add more content, add tests to the tasklist extension

This commit is contained in:
Hans Pagel
2020-11-03 17:05:27 +01:00
parent 34a3a7fe26
commit d69b8778d6
11 changed files with 145 additions and 28 deletions

View File

@@ -5,7 +5,7 @@ Type <code>*&nbsp;</code>, <code>-&nbsp;</code> or <code>+&nbsp;</code> at the b
## 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 youll get a SyntaxError.
This extension requires the [`ListItem`](/api/nodes/list-item) extension.
:::
```bash

View File

@@ -2,8 +2,8 @@
The ListItem extension adds support for the `<li>` HTML tag. Its used for bullet lists and ordered lists and cant really be used without them.
## Installation
::: warning Restrictions
This extension is intended to be used with the [`BulletList`](/api/extensions/bullet-list) or [`OrderedList`](/api/extensions/ordered-list) extension. It doesnt work without at least using one of them.
::: warning Use with BulletList and/or OrderedList
This extension requires the [`BulletList`](/api/nodes/bullet-list) or [`OrderedList`](/api/nodes/ordered-list) extension.
:::
```bash
@@ -19,9 +19,6 @@ yarn add @tiptap/extension-list-item
| ------ | ------ | ------- | -------------------------------------------- |
| class | string | | Add a custom class to the rendered HTML tag. |
## Commands
*None*
## Keyboard shortcuts
* New list item: `Enter`
* Sink a list item: `Tab`

View File

@@ -5,7 +5,7 @@ Type <code>1.&nbsp;</code> (or any other number followed by a dot) at the beginn
## 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 youll get a SyntaxError.
This extension requires the [`ListItem`](/api/nodes/list-item) extension.
:::
```bash
@@ -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 | Parameters | Description |
| ----------- | ---------- | ---------------------- |
| orderedList | — | Toggle a ordered list. |
| Command | Parameters | Description |
| ----------- | ---------- | ----------------------- |
| orderedList | — | Toggle an ordered list. |
## Keyboard shortcuts
* `Control`&nbsp;`Shift`&nbsp;`9`

View File

@@ -1,8 +1,8 @@
# TaskItem
## Installation
::: warning Restrictions
This extension is intended to be used with the [`TaskList`](/api/extensions/task-list) extension. It doesnt work without at least using one of them.
::: warning Use with TaskList
This extension requires the [`TaskList`](/api/nodes/task-list) extension.
:::
```bash

View File

@@ -1,16 +1,18 @@
# TaskList
This extension enables you to use task lists in the editor. They are rendered as `<ul>` HTML tags.
This extension enables you to use task lists in the editor. They are rendered as `<ul data-type="task_list">`. This implementation doesnt require any framework, its using plain JavaScript only.
Type <code>[ ]&nbsp;</code> or <code>[x]&nbsp;</code> at the beginning of a new line and it will magically transform to a task list.
## Installation
::: warning Use with TaskItem
The `TaskList` extension is intended to be used with the [`TaskItem`](/api/extensions/task-item) extension. Make sure to import that one too, otherwise youll get a SyntaxError.
This extension requires the [`TaskItem`](/api/nodes/task-item) extension.
:::
```bash
# With npm
# with npm
npm install @tiptap/extension-task-list @tiptap/extension-task-item
# Or: With Yarn
# with Yarn
yarn add @tiptap/extension-task-list @tiptap/extension-task-item
```
@@ -28,4 +30,4 @@ yarn add @tiptap/extension-task-list @tiptap/extension-task-item
[packages/extension-task-list/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-task-list/)
## Usage
<demo name="Nodes/TaskList" />
<demo name="Nodes/TaskList" highlight="3-5,17-18,37-38" />