docs: update content

This commit is contained in:
Hans Pagel
2021-01-20 17:58:53 +01:00
parent 0685e33cca
commit 48cbca07dd
10 changed files with 874 additions and 439 deletions

View File

@@ -1,4 +1,5 @@
# Mention
Honestly, the mention node is amazing. It adds support for `@mentions`, for example to ping users, and provides full control over the rendering.
## Installation
```bash
@@ -10,22 +11,10 @@ yarn add @tiptap/extension-mention
```
## Settings
| Option | Type | Default | Description |
| -------------- | -------- | -------------------------- | ---------------------------------------------------------------------------- |
| HTMLAttributes | `Object` | `{}` | Custom HTML attributes that should be added to the rendered HTML tag. |
| suggestion | `Object` | `{ char: '@', command: … ` | [Suggestion utility](/api/utilities/suggestion) |
## Settings for suggestions
| Option | Type | Default | Description |
| --------------- | ---------- | -------------- | ----------------------------------------------------------- |
| char | `String` | `'@'` | The character that triggers the autocomplete popup. |
| allowSpaces | `Boolean` | `false` | Allows or disallows spaces in suggested items. |
| startOfLine | `Boolean` | `false` | Trigger the autocomplete popup at the start of a line only. |
| decorationTag | `String` | `'span'` | The HTML tag that should be rendered for the suggestion. |
| decorationClass | `String` | `'suggestion'` | A CSS class that should be added to the suggestion. |
| command | `Function` | `() => {}'` | Executed when a suggestion is selected. |
| items | `Function` | `() => {}` | Pass an array of filtered suggestions, can be async. |
| render | `Function` | `() => ({})` | A render function for the autocomplete popup. |
| Option | Type | Default | Description |
| -------------- | -------- | ------- | --------------------------------------------------------------------- |
| HTMLAttributes | `Object` | `{}` | Custom HTML attributes that should be added to the rendered HTML tag. |
| suggestion | `Object` | `{ … }` | [Read more](/api/utilities/suggestion) |
## Source code
[packages/extension-mention/](https://github.com/ueberdosis/tiptap-next/blob/main/packages/extension-mention/)