ianhitchman/tiptap
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Merge branch 'main' of https://github.com/ueberdosis/tiptap-next into feature/replace-classes

Browse Source 
# Conflicts:
#	docs/src/demos/Examples/Focus/index.vue
#	docs/src/docPages/api/extensions/placeholder.md
#	docs/src/docPages/general/roadmap.md
This commit is contained in:
Philipp Kühn
2020-09-09 18:16:51 +02:00
parent 2ff134274e 9819e44fe6
commit 0361da1b71
41 changed files with 386 additions and 313 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
docs/src/docPages/api/extensions/blockquote.md
View File

@@ -2,7 +2,9 @@
The Blockquote extension enables you to use the `<blockquote>` HTML tag in the editor.
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

4
docs/src/docPages/api/extensions/bold.md
View File

@@ -6,7 +6,9 @@ The extension will generate the corresponding `<strong>` HTML tags when reading
:::
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

4
docs/src/docPages/api/extensions/bullet-list.md
View File

@@ -6,7 +6,9 @@ It’s intended to be used with the `ListItem` extension.
:::
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

4
docs/src/docPages/api/extensions/code.md
View File

@@ -2,7 +2,9 @@
The Code extensions enables you to use the `<code>` HTML tag in the editor. If you paste in text with `<code>` tags it will rendered accordingly.
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

15
docs/src/docPages/api/extensions/document.md
View File

@@ -1 +1,14 @@
# Document
# Document
**The `Document` extension is required**, no matter what you build with tiptap. It’s a so called “topNode”, a node that’s the home to all other nodes. Think of it like the `<body>` tag for your document.
The node is very tiny though. It defines a name of the node (`document`), is configured to be a top node (`topNode: true`) and that it can contain multiple other nodes (`block`). That’s all. But have a look yourself:
:::warning Breaking Change from 1.x → 2.x
Tiptap 1 tried to hide that node from you, but it has always been there. A tiny, but important change though: **We renamed the default type from `doc` to `document`.** To keep it like that, use your own implementation of the `Document` node or migrate the stored JSON to use the new name.
:::
## Source Code
[packages/extension-document/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-document/)
## Usage
<demo name="Extensions/Document" highlight="10,28" />

3
docs/src/docPages/api/extensions/heading.md
View File

@@ -3,7 +3,8 @@ Enables you to use headline HTML tags in the editor.
## Options
| Option | Type | Default | Description |
| ------ | ---- | ---- | ----- |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
| levels | Array | [1, 2, 3, 4, 5, 6] | Specifies which headlines are supported. |
## Commands

4
docs/src/docPages/api/extensions/horizontal-rule.md
View File

@@ -2,7 +2,9 @@
Enables you to use the `<hr>` HTML tag in the editor.
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

4
docs/src/docPages/api/extensions/italic.md
View File

@@ -6,7 +6,9 @@ The extension will generate the corresponding `<em>` HTML tags when reading cont
:::
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

5
docs/src/docPages/api/extensions/link.md
View File

@@ -3,5 +3,6 @@ Enables you to use the `<a>` HTML tag in the editor.
## Options
| Option | Type | Default | Description |
| ------ | ---- | ---- | ----- |
| openOnClick | Boolean | true | Specifies if links will be opened on click. |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
| openOnClick | Boolean | true | Specifies if links will be opened on click. |

7
docs/src/docPages/api/extensions/list-item.md
View File

@@ -3,4 +3,9 @@ Enables you to use the `<li>` HTML tag in the editor.
::: warning Restrictions
This extensions is intended to be used with the `BulletList` or `OrderedList` extension.
:::
:::
## Options
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

4
docs/src/docPages/api/extensions/ordered-list.md
View File

@@ -6,7 +6,9 @@ This extensions is intended to be used with the `ListItem` extension.
:::
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

19
docs/src/docPages/api/extensions/paragraph.md
View File

@@ -1,2 +1,19 @@
# Paragraph
Enables you to use paragraphs in the editor.
Yes, the schema is very strict. Without this extension you won’t even be able to use paragraphs in the editor.
## Options
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
*None*
## Keybindings
*None*
## Source Code
[packages/extension-paragraph/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-paragraph/)
## Usage
<demo name="Extensions/Paragraph" highlight="11,29" />

81
docs/src/docPages/api/extensions/placeholder.md
View File

@@ -1,83 +1,2 @@
# Placeholder
Enables you to show placeholders on empty paragraphs.
## Table
This enables support for tables in your editor.
Tables can be nested and allow all blocks to be used inside.
Each `<TableCell>` includes a single `<Paragraph>`.
## Options
| Option | Type | Default | Description |
| ------ | ---- | ---- | ----- |
| resizable | Boolean | false | Enables the resizing of columns |
## Keybindings
* `Tab` → Next Cell
* `Shift` + `Tab` + ` → Previous Cell
## Commands
| Command | Options | Description |
| ------ | ---- | ---------------- |
| createTable | ```{ rowsCount, colsCount, withHeaderRow }``` | Returns a table node of a given size. `withHeaderRow` defines whether the first row of the table will be a header row. |
| deleteTable | — | Deletes the complete table which is active |
| addColumnBefore | — | Add a column before the selection. |
| addColumnAfter | — | Add a column after the selection. |
| deleteColumn | — | Removes the selected columns. |
| addRowBefore | — | Add a table row before the selection. |
| addRowAfter | — | Add a table row after the selection. |
| toggleCellMerge | — | See mergeCells and splitCells |
| mergeCells | — | Merge the selected cells into a single cell. Only available when the selected cells' outline forms a rectangle. |
| splitCell | — | Split a selected cell, whose rowspan or colspan is greater than one into smaller cells. |
| toggleHeaderColumn | — | Toggles whether the selected column contains header cells. |
| toggleHeaderRow | — | Toggles whether the selected row contains header cells. |
| toggleHeaderCell | — | Toggles whether the selected column contains header cells. |
| setCellAttr | — | Returns a command that sets the given attribute to the given value, and is only available when the currently selected cell doesn't already have that attribute set to that value. |
| fixTables | — | Inspect all tables in the given state's document and return a transaction that fixes them, if necessary. |
## Usage
::: warning
You have to include all table extensions (`TableHeader`, `TableCell` & `TableRow`)
:::
```markup
<template>
<div>
<editor-menu-bar :editor="editor" v-slot="{ commands, isActive }">
<button :class="{ 'is-active': isActive.bold() }" @click="commands.createTable({rowsCount: 3, colsCount: 3, withHeaderRow: false })">
Create Table
</button>
</editor-menu-bar>
<editor-content :editor="editor" />
</div>
</template>
<script>
import { Editor, EditorContent, EditorMenuBar } from 'tiptap'
import { Table, TableCell, TableHeader, TableRow } from 'tiptap-extensions'
export default {
components: {
EditorMenuBar,
EditorContent,
},
data() {
return {
editor: new Editor({
extensions: [
Table(),
TableCell(),
TableHeader(),
TableRow(),
],
content: ''
}),
}
},
beforeDestroy() {
this.editor.destroy()
}
}
</script>
```

4
docs/src/docPages/api/extensions/strike.md
View File

@@ -2,7 +2,9 @@
Enables you to use the `<s>` HTML tag in the editor.
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |

2
docs/src/docPages/api/extensions/todo-item.md
View File

@@ -7,7 +7,7 @@ This extensions is intended to be used with the `TodoList` extension.
## Options
| Option | Type | Default | Description |
| ------ | ---- | ---- | ----- |
| ------ | ---- | ------- | ----------- |
| nested | Boolean | false | Specifies if you can nest todo lists. |
## Commands

4
docs/src/docPages/api/extensions/underline.md
View File

@@ -2,7 +2,9 @@
Enables you to use the `<u>` HTML tag in the editor.
## Options
*None*
| Option | Type | Default | Description |
| ------ | ---- | ------- | ----------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |