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

a ton of improvements

Browse Source
This commit is contained in:
Hans Pagel
2020-09-23 12:03:03 +02:00
parent 42b982b71c
commit 949f4ccb3d
24 changed files with 85 additions and 61 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -12,7 +12,7 @@ npm install @tiptap/extension-blockquote
yarn add @tiptap/extension-blockquote
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -16,7 +16,7 @@ npm install @tiptap/extension-bold
yarn add @tiptap/extension-bold
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -1,22 +1,22 @@
# BulletList
This extension enables you to use bullet lists in the editor. They are rendered as `<ul>` HTML tags,
Type `* ​`, `- ​` or `+ ​` at the beginning of a new line and it will magically transform to a bullet list.
Type <code>*&nbsp;</code>, <code>-&nbsp;</code> or <code>+&nbsp;</code> at the beginning of a new line and it will magically transform to a bullet list.
## Installation
::: warning Use with ListItem
The `BulletList` extension is intended to be used with the [`ListItem`](/api/extensions/list-item) extension. Make sure to import that one too, otherwise you’ll get a SyntaxError.
:::
## Installation
```bash
# With npm
npm install @tiptap/extension-bullet-list
npm install @tiptap/extension-bullet-list @tiptap/extension-list-item
# Or: With Yarn
yarn add @tiptap/extension-bullet-list
yarn add @tiptap/extension-bullet-list @tiptap/extension-list-item
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

2
docs/src/docPages/api/extensions/code-block-highlight.md
View File

@@ -1,7 +1,7 @@
# CodeBlockHighlight
Enables you to use the `<pre>` HTML tag with auto-detected syntax highlighting in the editor.
## Options
## Settings
*None*
## Commands

2
docs/src/docPages/api/extensions/code-block.md
View File

@@ -16,7 +16,7 @@ npm install @tiptap/extension-code-block
yarn add @tiptap/extension-code-block
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -12,7 +12,7 @@ npm install @tiptap/extension-code
yarn add @tiptap/extension-code
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

2
docs/src/docPages/api/extensions/hard-break.md
View File

@@ -10,7 +10,7 @@ npm install @tiptap/extension-hard-break
yarn add @tiptap/extension-hard-break
```
## Options
## Settings
*None*
## Commands

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

@@ -1,7 +1,7 @@
# Heading
The Heading extension adds support for headings of different levels. Headings are rendered with `<h1>`, `<h2>`, `<h3>`, `<h4>`, `<h5>` or `<h6>` HTML tags. By default all six headline levels are enabled, but you can pass an array to only allow a few levels. Check the usage example to see how this is done.
Type `# ​` at the beginning of a new line and it will magically transform to a headline, same for `## ​`, `### ​`, `#### ​`, `##### ​` and `###### ​`.
Type <code>#&nbsp;</code> at the beginning of a new line and it will magically transform to a headline, same for <code>##&nbsp;</code>, <code>###&nbsp;</code>, <code>####&nbsp;</code>, <code>#####&nbsp;</code> and <code>######&nbsp;</code>.
## Installation
```bash
@@ -12,7 +12,7 @@ npm install @tiptap/extension-heading
yarn add @tiptap/extension-heading
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------------------ | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |
@@ -35,4 +35,4 @@ yarn add @tiptap/extension-heading
[packages/extension-heading/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-heading/)
## Usage
<demo name="Extensions/Heading" highlight="" />
<demo name="Extensions/Heading" highlight="3-11,23,42-44" />

7
docs/src/docPages/api/extensions/history.md
View File

@@ -10,8 +10,10 @@ npm install @tiptap/extension-history
yarn add @tiptap/extension-history
```
## Options
*None*
## Settings
| Option | Type | Default | Description |
| -------------------- | ------ | ------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ |
| historyPluginOptions | Object | {} | Supports the following configuration options:<br /><br />**depth:** The amount of history events that are collected before the oldest events are discarded. Defaults to 100.<br /><br />**newGroupDelay:** The delay between changes after which a new group should be started. Defaults to 500 (milliseconds). Note that when changes aren't adjacent, a new group is always started. |
## Commands
| Command | Options | Description |
@@ -20,6 +22,7 @@ yarn add @tiptap/extension-history
| redo | — | Redo the last change. |
## Keyboard shortcuts
### Undo
* Windows & Linux: `Control` + `Z`
* macOS: `Command` + `Z`

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

@@ -1,7 +1,7 @@
# HorizontalRule
Use this extension to render a `<hr>` HTML tag. If you pass `<hr>` in the editor’s initial content, it’ll be rendered accordingly.
Type three dashes (`---`) or three underscores and a space (`___ ​`) at the beginning of a new line and it will magically transform to a horizontal rule.
Type three dashes (<code>---</code>) or three underscores and a space (<code>___ </code>) at the beginning of a new line and it will magically transform to a horizontal rule.
## Installation
```bash
@@ -12,7 +12,7 @@ npm install @tiptap/extension-horizontal-rule
yarn add @tiptap/extension-horizontal-rule
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -1,6 +1,8 @@
# Italic
Use this extension to render text in *italic*. If you pass `<em>`, `<i>` tags, or text with inline `style` attributes setting `font-style: italic` in the editor’s initial content, they all will be rendered accordingly.
Type `*one asterisk*` or `_one underline_` and it will magically transform to *italic* text while you type.
::: warning Restrictions
The extension will generate the corresponding `<em>` HTML tags when reading contents of the `Editor` instance. All text marked italic, regardless of the method will be normalized to `<em>` HTML tags.
:::
@@ -14,7 +16,7 @@ npm install @tiptap/extension-italic
yarn add @tiptap/extension-italic
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -10,7 +10,7 @@ npm install @tiptap/extension-link
yarn add @tiptap/extension-link
```
## Options
## Settings
| Option | Type | Default | Description |
| ----------- | ------- | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -14,7 +14,7 @@ npm install @tiptap/extension-list-item
yarn add @tiptap/extension-list-item
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -1,20 +1,20 @@
# OrderedList
Enables you to use the `<ol>` HTML tag in the editor.
::: warning Restrictions
This extensions is intended to be used with the `ListItem` extension.
## Installation
::: warning Use with ListItem
The `OrderedList` extension is intended to be used with the [`ListItem`](/api/extensions/list-item) extension. Make sure to import that one too, otherwise you’ll get a SyntaxError.
:::
## Installation
```bash
# With npm
npm install @tiptap/extension-ordered-list
npm install @tiptap/extension-ordered-list @tiptap/extension-list-item
# Or: With Yarn
yarn add @tiptap/extension-ordered-list
yarn add @tiptap/extension-ordered-list @tiptap/extension-list-item
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -1,6 +1,10 @@
# Paragraph
Yes, the schema is very strict. Without this extension you won’t even be able to use paragraphs in the editor.
:::warning Breaking Change from 1.x → 2.x
Tiptap 1 tried to hide that node from you, but it has always been there. You have to explicitly import it from now on (or use `defaultExtensions()`).
:::
## Installation
```bash
# With npm
@@ -10,7 +14,7 @@ npm install @tiptap/extension-paragraph
yarn add @tiptap/extension-paragraph
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

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

@@ -1,7 +1,7 @@
# Strike
Use this extension to render ~~striked text~~. If you pass `<s>`, `<del>`, `<strike>` tags, or text with inline `style` attributes setting `text-decoration: line-through` in the editor’s initial content, they all will be rendered accordingly.
Type `~text between tildes~` and it will be magically ~~striked through~~ while you type.
Type <code>~text between tildes~</code> and it will be magically ~~striked through~~ while you type.
::: warning Restrictions
The extension will generate the corresponding `<s>` HTML tags when reading contents of the `Editor` instance. All text striked through, regardless of the method will be normalized to `<s>` HTML tags.
@@ -16,7 +16,7 @@ npm install @tiptap/extension-strike
yarn add @tiptap/extension-strike
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |

2
docs/src/docPages/api/extensions/text.md
View File

@@ -2,7 +2,7 @@
**The `Text` extension is required**, at least if you want to work with text of any kind and that’s very likely. This extension is a little bit different, it doesn’t even render HTML. It’s plain text, that’s all.
:::warning Breaking Change from 1.x → 2.x
Tiptap 1 tried to hide that node from you, but it has always been there.
Tiptap 1 tried to hide that node from you, but it has always been there. You have to explicitly import it from now on (or use `defaultExtensions()`).
:::
## Installation

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

@@ -5,7 +5,7 @@ It renders a single toggleable item of a list.
This extensions is intended to be used with the `TodoList` extension.
:::
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------- | ------- | ------------------------------------- |
| nested | Boolean | false | Specifies if you can nest todo lists. |

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

@@ -5,7 +5,7 @@ Renders a toggleable list of items.
This extensions is intended to be used with the `TodoItem` extension.
:::
## Options
## Settings
*None*
## Commands

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

@@ -1,6 +1,8 @@
# Underline
Use this extension to render text <u>underlined</u>. If you pass `<u>` tags, or text with inline `style` attributes setting `text-decoration: underline` in the editor’s initial content, they all will be rendered accordingly.
Be aware that underlined text in the Internet usually indicates that it’s a clickable link. Don’t confuse your users with underlined text.
::: warning Restrictions
The extension will generate the corresponding `<u>` HTML tags when reading contents of the `Editor` instance. All text marked underlined, regardless of the method will be normalized to `<u>` HTML tags.
:::
@@ -14,7 +16,7 @@ npm install @tiptap/extension-underline
yarn add @tiptap/extension-underline
```
## Options
## Settings
| Option | Type | Default | Description |
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | – | Add a custom class to the rendered HTML tag. |