docs: update content

This commit is contained in:
Philipp Kühn
2021-05-06 18:41:22 +02:00
parent 21384fc7a6
commit 00d8958b72
49 changed files with 180 additions and 122 deletions

View File

@@ -34,11 +34,13 @@ The `element` specifies the HTML element the editor will be binded too. The foll
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
element: document.querySelector('.element'),
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
})
```
@@ -53,7 +55,7 @@ Its required to pass a list of extensions to the `extensions` property, even
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
import Document from '@tiptap/extension-document'
import Paragraph from '@tiptap/extension-paragraph'
import Text from '@tiptap/extension-text'
@@ -61,7 +63,9 @@ import Highlight from '@tiptap/extension-highlight'
new Editor({
// Use the default extensions
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
// … or use specific extensions
extensions: [
@@ -72,7 +76,7 @@ new Editor({
// … or both
extensions: [
...defaultExtensions(),
StarterKit,
Highlight,
],
})
@@ -83,11 +87,13 @@ With the `content` property you can provide the initial content for the editor.
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
content: `<p>Example Text</p>`,
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
})
```
@@ -96,11 +102,13 @@ The `editable` property determines if users can write into the editor.
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
content: `<p>Example Text</p>`,
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
editable: false,
})
```
@@ -110,10 +118,12 @@ With `autofocus` you can force the cursor to jump in the editor on initializatio
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
autofocus: false,
})
```
@@ -132,11 +142,13 @@ By default, tiptap enables all [input rules](/guide/custom-extensions/#input-rul
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
content: `<p>Example Text</p>`,
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
enableInputRules: false,
})
```
@@ -146,11 +158,13 @@ By default, tiptap enables all [paste rules](/guide/custom-extensions/#paste-rul
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
content: `<p>Example Text</p>`,
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
enablePasteRules: false,
})
```
@@ -160,10 +174,12 @@ By default, tiptap injects [a little bit of CSS](https://github.com/ueberdosis/t
```js
import { Editor } from '@tiptap/core'
import { defaultExtensions } from '@tiptap/starter-kit'
import StarterKit from '@tiptap/starter-kit'
new Editor({
extensions: defaultExtensions(),
extensions: [
StarterKit,
],
injectCSS: false,
})
```

View File

@@ -22,7 +22,7 @@ There are also some extensions with more capabilities. We call them [nodes](/api
| [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 dont have to use it, but we prepared a `@tiptap/starter-kit` which includes the most common extensions. Read more about [`defaultExtensions()`](/guide/configuration#default-extensions).
You dont 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).
## How extensions work
Although tiptap tries to hide most of the complexity of ProseMirror, its built on top of its APIs and we recommend you to read through the [ProseMirror Guide](https://ProseMirror.net/docs/guide/) for advanced usage. Youll have a better understanding of how everything works under the hood and get more familiar with many terms and jargon used by tiptap.

View File

@@ -7,7 +7,7 @@
The node is very tiny though. It defines a name of the node (`document`), is configured to be a top node (`topNode: true`) and that it can contain multiple other nodes (`block+`). Thats all. But have a look yourself:
:::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()`).
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 `StarterKit`).
:::
## Installation

View File

@@ -5,7 +5,7 @@
Yes, the schema is very strict. Without this extension you wont 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()`).
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 `StarterKit`).
:::
## Installation

View File

@@ -5,7 +5,7 @@
**The `Text` extension is required**, at least if you want to work with text of any kind and thats very likely. This extension is a little bit different, it doesnt even render HTML. Its plain text, thats all.
:::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()`).
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 `StarterKit`).
:::
## Installation