move everything around, add more content and a first test for images

This commit is contained in:
Hans Pagel
2020-11-03 16:43:35 +01:00
parent 9bcdb57f14
commit 34a3a7fe26
64 changed files with 177 additions and 70 deletions

View File

@@ -19,9 +19,9 @@ yarn add @tiptap/extension-blockquote
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |
| ---------- | ------- | ----------------------------- |
| blockquote | — | Wrap content in a blockquote. |
| Command | Parameters | Description |
| ---------- | ---------- | ----------------------------- |
| blockquote | — | Wrap content in a blockquote. |
## Keyboard shortcuts
* Windows/Linux: `Control` `Shift` `9`
@@ -31,4 +31,4 @@ yarn add @tiptap/extension-blockquote
[packages/extension-blockquote/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-blockquote/)
## Usage
<demo name="Extensions/Blockquote" highlight="3-5,17,36" />
<demo name="Nodes/Blockquote" highlight="3-5,17,36" />

View File

@@ -22,9 +22,9 @@ yarn add @tiptap/extension-bullet-list @tiptap/extension-list-item
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |
| ----------- | ------- | --------------------- |
| bullet_list | — | Toggle a bullet list. |
| Command | Parameters | Description |
| ----------- | ---------- | --------------------- |
| bullet_list | — | Toggle a bullet list. |
## Keyboard shortcuts
* `Control`&nbsp;`Shift`&nbsp;`8`
@@ -33,4 +33,4 @@ yarn add @tiptap/extension-bullet-list @tiptap/extension-list-item
[packages/extension-bullet-list/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-bullet-list/)
## Usage
<demo name="Extensions/BulletList" highlight="3-5,17-18,37-38" />
<demo name="Nodes/BulletList" highlight="3-5,17-18,37-38" />

View File

@@ -23,9 +23,9 @@ yarn add @tiptap/extension-code-block
| languageClassPrefix | string | language- | Adds a prefix to language classes that are applied to code tags. |
## Commands
| Command | Options | Description |
| --------- | ------- | ----------------------------- |
| codeBlock | — | Wrap content in a code block. |
| Command | Parameters | Description |
| --------- | ---------- | ----------------------------- |
| codeBlock | — | Wrap content in a code block. |
## Keyboard shortcuts
* Windows/Linux: `Control`&nbsp;`Shift`&nbsp;`C`
@@ -35,4 +35,4 @@ yarn add @tiptap/extension-code-block
[packages/extension-code-block/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-code-block/)
## Usage
<demo name="Extensions/CodeBlock" highlight="3-5,17,36" />
<demo name="Nodes/CodeBlock" highlight="3-5,17,36" />

View File

@@ -20,4 +20,4 @@ yarn add @tiptap/extension-document
[packages/extension-document/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-document/)
## Usage
<demo name="Extensions/Document" highlight="10,28" />
<demo name="Nodes/Document" highlight="10,28" />

View File

@@ -10,13 +10,10 @@ npm install @tiptap/extension-hard-break
yarn add @tiptap/extension-hard-break
```
## Settings
*None*
## Commands
| Command | Options | Description |
| --------- | ------- | ----------------- |
| hardBreak | — | Add a line break. |
| Command | Parameters | Description |
| --------- | ---------- | ----------------- |
| hardBreak | — | Add a line break. |
## Keyboard shortcuts
* `Shift`&nbsp;`Enter`
@@ -27,4 +24,4 @@ yarn add @tiptap/extension-hard-break
[packages/extension-hard-break/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-hard-break/)
## Usage
<demo name="Extensions/HardBreak" highlight="3-5,17,36" />
<demo name="Nodes/HardBreak" highlight="3-5,17,36" />

View File

@@ -19,9 +19,9 @@ yarn add @tiptap/extension-heading
| levels | Array | [1, 2, 3, 4, 5, 6] | Specifies which heading levels are supported. |
## Commands
| Command | Options | Description |
| ------- | ------- | ----------------------- |
| heading | level | Creates a heading node. |
| Command | Parameters | Description |
| ------- | ---------- | ------------------------------------------------ |
| heading | level | Creates a heading node with the specified level. |
## Keyboard shortcuts
* Windows/Linux: `Control`&nbsp;`Alt`&nbsp;`1-6`
@@ -31,4 +31,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="3-11,23,42-44" />
<demo name="Nodes/Heading" highlight="3-11,23,42-44" />

View File

@@ -18,9 +18,9 @@ yarn add @tiptap/extension-horizontal-rule
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |
| --------------- | ------- | ------------------------- |
| horizontalRule | — | Create a horizontal rule. |
| Command | Parameters | Description |
| -------------- | ---------- | ------------------------- |
| horizontalRule | — | Create a horizontal rule. |
## Keyboard shortcuts
*None*
@@ -29,4 +29,4 @@ yarn add @tiptap/extension-horizontal-rule
[packages/extension-horizontal-rule/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-horizontal-rule/)
## Usage
<demo name="Extensions/HorizontalRule" highlight="3-5,17,36" />
<demo name="Nodes/HorizontalRule" highlight="3-5,17,36" />

View File

@@ -1,4 +1,9 @@
# Image
Use this extension to render `<img>` HTML tags. By default, those images are blocks. If you want to render images in line with text set the `inline` option to `true`.
:::warning Restrictions
This extension does only the rendering of images. It doesnt upload images to your server, thats a whole different story.
:::
## Installation
```bash
@@ -10,12 +15,12 @@ yarn add @tiptap/extension-image
```
## Settings
| Option | Type | Default | Description |
| ------ | ------- | ------- | ------------------------ |
| inline | boolean | false | Renders the node inline. |
| Option | Type | Default | Description |
| ------ | ------- | ------- | ------------------------------ |
| inline | boolean | false | Renders the image node inline. |
## Source code
[packages/extension-image/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-image/)
## Usage
<demo name="Extensions/Image" />
<demo name="Nodes/Image" />

View File

@@ -31,4 +31,4 @@ yarn add @tiptap/extension-list-item
[packages/extension-list-item/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-list-item/)
## Usage
<demo name="Extensions/ListItem" highlight="3-8,20-22,41-43" />
<demo name="Nodes/ListItem" highlight="3-8,20-22,41-43" />

View File

@@ -22,9 +22,9 @@ yarn add @tiptap/extension-ordered-list @tiptap/extension-list-item
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |
| ------------ | ------- | ---------------------- |
| ordered_list | — | Toggle a ordered list. |
| Command | Parameters | Description |
| ----------- | ---------- | ---------------------- |
| orderedList | — | Toggle a ordered list. |
## Keyboard shortcuts
* `Control`&nbsp;`Shift`&nbsp;`9`
@@ -33,4 +33,4 @@ yarn add @tiptap/extension-ordered-list @tiptap/extension-list-item
[packages/extension-ordered-list/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-ordered-list/)
## Usage
<demo name="Extensions/OrderedList" highlight="3-5,17-18,37-38" />
<demo name="Nodes/OrderedList" highlight="3-5,17-18,37-38" />

View File

@@ -20,9 +20,9 @@ yarn add @tiptap/extension-paragraph
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |
| --------- | ------- | -------------------------------------------- |
| paragraph | — | Transforms all selected nodes to paragraphs. |
| Command | Parameters | Description |
| --------- | ---------- | -------------------------------------------- |
| paragraph | — | Transforms all selected nodes to paragraphs. |
## Keyboard shortcuts
* Windows & Linux: `Control`&nbsp;`Alt`&nbsp;`0`
@@ -32,4 +32,4 @@ yarn add @tiptap/extension-paragraph
[packages/extension-paragraph/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-paragraph/)
## Usage
<demo name="Extensions/Paragraph" highlight="11,29" />
<demo name="Nodes/Paragraph" highlight="11,29" />

View File

@@ -25,4 +25,4 @@ yarn add @tiptap/extension-task-list @tiptap/extension-task-item
[packages/extension-task-item/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-task-item/)
## Usage
<demo name="Extensions/TaskItem" />
<demo name="Nodes/TaskItem" />

View File

@@ -20,12 +20,12 @@ yarn add @tiptap/extension-task-list @tiptap/extension-task-item
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
| Command | Options | Description |
| -------- | ------- | ------------------- |
| taskList | — | Toggle a task list. |
| Command | Parameters | Description |
| -------- | ---------- | ------------------- |
| taskList | — | Toggle a task list. |
## Source code
[packages/extension-task-list/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-task-list/)
## Usage
<demo name="Extensions/TaskList" />
<demo name="Nodes/TaskList" />

View File

@@ -18,4 +18,4 @@ yarn add @tiptap/extension-text
[packages/extension-text/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-text/)
## Usage
<demo name="Extensions/Text" highlight="12,30" />
<demo name="Nodes/Text" highlight="12,30" />