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

docs: update content

Browse Source
This commit is contained in:
Hans Pagel
2021-06-22 21:28:20 +02:00
parent db8c9d50b2
commit 50a793cd43
9 changed files with 148 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
docs/src/docPages/api/commands/blur.md
View File

@@ -1,3 +1,11 @@
# blur
This command removes the focus from the editor.
See also: [focus](/api/commands/focus)
## Usage
```js
// Remove the focus from the editor
editor.commands.blur()
```
<ContentMissing />

2
docs/src/docPages/api/commands/focus.md
View File

@@ -3,7 +3,7 @@ This command sets the focus back to the editor.
When a user clicks on a button outside the editor, the browser sets the focus to that button. In most scenarios you want to focus the editor then again. That’s why you’ll see that in basically every demo here.
See also: [setTextSelection](/api/commands/set-text-selection)
See also: [setTextSelection](/api/commands/set-text-selection), [blur](/api/commands/blur)
## Parameters
`position: 'start' | 'end' | number | boolean | null (false)`

26
docs/src/docPages/api/extensions.md
View File

@@ -8,19 +8,19 @@ Extensions add new capabilities to tiptap and you’ll read the word extension h
There are also some extensions with more capabilities. We call them [nodes](/api/nodes) and [marks](/api/marks) which can render content in the editor.
## List of provided extensions
| Title | Default Extension | Source Code |
| ----------------------------------------------------------- | ----------------- | ------------------------------------------------------------------------------------------------------ |
| [CharacterCount](/api/extensions/character-count) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-character-count/) |
| [Collaboration](/api/extensions/collaboration) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-collaboration/) |
| [CollaborationCursor](/api/extensions/collaboration-cursor) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-collaboration-cursor/) |
| [Dropcursor](/api/extensions/dropcursor) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-dropcursor/) |
| [Focus](/api/extensions/focus) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-focus/) |
| [FontFamily](/api/extensions/font-family) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-font-family/) |
| [Gapcursor](/api/extensions/gapcursor) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-gapcursor/) |
| [History](/api/extensions/history) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-history/) |
| [Placeholder](/api/extensions/placeholder) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-placeholder/) |
| [TextAlign](/api/extensions/text-align) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text-align/) |
| [Typography](/api/extensions/typography) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-typography/) |
| Title | StarterKit ([view](/api/extensions/starter-kit)) | Source Code |
| ----------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------- |
| [CharacterCount](/api/extensions/character-count) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-character-count/) |
| [Collaboration](/api/extensions/collaboration) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-collaboration/) |
| [CollaborationCursor](/api/extensions/collaboration-cursor) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-collaboration-cursor/) |
| [Dropcursor](/api/extensions/dropcursor) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-dropcursor/) |
| [Focus](/api/extensions/focus) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-focus/) |
| [FontFamily](/api/extensions/font-family) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-font-family/) |
| [Gapcursor](/api/extensions/gapcursor) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-gapcursor/) |
| [History](/api/extensions/history) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-history/) |
| [Placeholder](/api/extensions/placeholder) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-placeholder/) |
| [TextAlign](/api/extensions/text-align) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text-align/) |
| [Typography](/api/extensions/typography) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-typography/) |
You don’t have to use it, but we prepared a `@tiptap/starter-kit` which includes the most common extensions. Read more about [`StarterKit`](/guide/configuration#default-extensions).

82
docs/src/docPages/api/extensions/starter-kit.md Normal file
View File

@@ -0,0 +1,82 @@
# StarterKit
[![Version](https://img.shields.io/npm/v/@tiptap/starter-kit.svg?label=version)](https://www.npmjs.com/package/@tiptap/starter-kit)
[![Downloads](https://img.shields.io/npm/dm/@tiptap/starter-kit.svg)](https://npmcharts.com/compare/@tiptap/starter-kit?minimal=true)
The `StarterKit` is a collection of the most popular tiptap extensions. If you’re just getting started, this extension is for you.
## Installation
```bash
# with npm
npm install @tiptap/starter-kit
# with Yarn
yarn add @tiptap/starter-kit
```
## Included extensions
### Nodes
* [`Blockquote`](/api/nodes/blockquote)
* [`BulletList`](/api/nodes/bullet-list)
* [`CodeBlock`](/api/nodes/code-block)
* [`Document`](/api/nodes/document)
* [`HardBreak`](/api/nodes/hard-break)
* [`Heading`](/api/nodes/heading)
* [`HorizontalRule`](/api/nodes/horizontal-rule)
* [`ListItem`](/api/nodes/list-item)
* [`Mention`](/api/nodes/mention)
* [`OrderedList`](/api/nodes/ordered-list)
* [`Paragraph`](/api/nodes/paragraph)
* [`Text`](/api/nodes/text)
### Marks
* [`Bold`](/api/marks/bold)
* [`Code`](/api/marks/code)
* [`Italic`](/api/marks/italic)
* [`Strike`](/api/marks/strike)
* [`TextStyle`](/api/marks/text-style)
### Extensions
* [`Dropcursor`](/api/extensions/dropcursor)
* [`Gapcursor`](/api/extensions/gapcursor)
* [`History`](/api/extensions/history)
## Source code
[packages/starter-kit/](https://github.com/ueberdosis/tiptap/blob/main/packages/starter-kit/)
## Usage
Pass `StarterKit` to the editor to load all included extension at once.
```js
import { Editor } from '@tiptap/core'
import StarterKit from '@tiptap/starter-kit'
const editor = new Editor({
content: '<p>Example Text</p>',
extensions: [
StarterKit,
],
})
```
You can configure the included extensions, or even disable a few of them, like shown below.
```js
import { Editor } from '@tiptap/core'
import StarterKit from '@tiptap/starter-kit'
const editor = new Editor({
content: '<p>Example Text</p>',
extensions: [
StarterKit.configure({
// Disable an included extension
history: false,
// Configure an included extension
heading: {
levels: [1, 2],
},
}),
],
})
```

24
docs/src/docPages/api/marks.md
View File

@@ -6,15 +6,15 @@
One or multiple marks can be applied to [nodes](/api/nodes), for example to add inline formatting like bold and italic, or other additional information.
## List of supported marks
| Title | Default Extension | Source Code |
| ------------------------------------- | ----------------- | ---------------------------------------------------------------------------------------- |
| [Bold](/api/marks/bold) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-bold/) |
| [Code](/api/marks/code) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-code/) |
| [Highlight](/api/marks/highlight) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-highlight/) |
| [Italic](/api/marks/italic) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-italic/) |
| [Link](/api/marks/link) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-link/) |
| [Strike](/api/marks/strike) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-strike/) |
| [Subscript](/api/marks/subscript) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-subscript/) |
| [Superscript](/api/marks/superscript) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-superscript/) |
| [TextStyle](/api/marks/text-style) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text-style/) |
| [Underline](/api/marks/underline) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-underline/) |
| Title | StarterKit ([view](/api/extensions/starter-kit)) | Source Code |
| ------------------------------------- | ------------------------------------------------ | ---------------------------------------------------------------------------------------- |
| [Bold](/api/marks/bold) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-bold/) |
| [Code](/api/marks/code) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-code/) |
| [Highlight](/api/marks/highlight) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-highlight/) |
| [Italic](/api/marks/italic) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-italic/) |
| [Link](/api/marks/link) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-link/) |
| [Strike](/api/marks/strike) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-strike/) |
| [Subscript](/api/marks/subscript) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-subscript/) |
| [Superscript](/api/marks/superscript) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-superscript/) |
| [TextStyle](/api/marks/text-style) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text-style/) |
| [Underline](/api/marks/underline) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-underline/) |

44
docs/src/docPages/api/nodes.md
View File

@@ -6,28 +6,28 @@
If you think of the document as a tree, then nodes are just a type of content in that tree. Examples of nodes are paragraphs, headings, or code blocks. But nodes don’t have to be blocks. They can also be rendered inline with the text, for example for **@mentions**.
## List of supported nodes
| Title | Default Extension | Source Code |
| -------------------------------------------- | ----------------- | ------------------------------------------------------------------------------------------------- |
| [Blockquote](/api/nodes/blockquote) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-blockquote/) |
| [BulletList](/api/nodes/bullet-list) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-bullet-list/) |
| [CodeBlock](/api/nodes/code-block) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-code-block/) |
| [Document](/api/nodes/document) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-document/) |
| [Emoji](/api/nodes/emoji) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-emoji/) |
| [HardBreak](/api/nodes/hard-break) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-hard-break/) |
| [Hashtag](/api/nodes/hashtag) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-hashtag/) |
| [Heading](/api/nodes/heading) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-heading/) |
| [HorizontalRule](/api/nodes/horizontal-rule) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-horizontal-rule/) |
| [Image](/api/nodes/image) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-image/) |
| [ListItem](/api/nodes/list-item) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-list-item/) |
| [Mention](/api/nodes/mention) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-mention/) |
| [OrderedList](/api/nodes/ordered-list) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-ordered-list/) |
| [Paragraph](/api/nodes/paragraph) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-paragraph/) |
| [Table](/api/nodes/table) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table/) |
| [TableRow](/api/nodes/table-row) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table-row/) |
| [TableCell](/api/nodes/table-cell) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table-cell/) |
| [TaskList](/api/nodes/task-list) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-task-list/) |
| [TaskItem](/api/nodes/task-item) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-task-item/) |
| [Text](/api/nodes/text) | Yes | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text/) |
| Title | StarterKit ([view](/api/extensions/starter-kit)) | Source Code |
| -------------------------------------------- | ------------------------------------------------ | -------------------------------------------------------------------------------------------- |
| [Blockquote](/api/nodes/blockquote) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-blockquote/) |
| [BulletList](/api/nodes/bullet-list) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-bullet-list/) |
| [CodeBlock](/api/nodes/code-block) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-code-block/) |
| [Document](/api/nodes/document) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-document/) |
| [Emoji](/api/nodes/emoji) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-emoji/) |
| [HardBreak](/api/nodes/hard-break) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-hard-break/) |
| [Hashtag](/api/nodes/hashtag) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-hashtag/) |
| [Heading](/api/nodes/heading) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-heading/) |
| [HorizontalRule](/api/nodes/horizontal-rule) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-horizontal-rule/) |
| [Image](/api/nodes/image) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-image/) |
| [ListItem](/api/nodes/list-item) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-list-item/) |
| [Mention](/api/nodes/mention) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-mention/) |
| [OrderedList](/api/nodes/ordered-list) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-ordered-list/) |
| [Paragraph](/api/nodes/paragraph) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-paragraph/) |
| [Table](/api/nodes/table) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table/) |
| [TableRow](/api/nodes/table-row) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table-row/) |
| [TableCell](/api/nodes/table-cell) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-table-cell/) |
| [TaskList](/api/nodes/task-list) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-task-list/) |
| [TaskItem](/api/nodes/task-item) | – | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-task-item/) |
| [Text](/api/nodes/text) | Included | [GitHub](https://github.com/ueberdosis/tiptap/blob/main/packages/extension-text/) |
## Create a new node
You’re free to create your own nodes for tiptap. Here is the boilerplate code that’s need to create and register your own node: