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

wording

Browse Source
This commit is contained in:
Hans Pagel
2020-09-21 17:50:50 +02:00
parent b2c85f11df
commit 0c6e49362f
5 changed files with 37 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files

45
docs/src/docPages/api/editor.md
View File

@@ -1,25 +1,28 @@
# Editor # Editor
:::warning Out of date
This content is written for tiptap 1 and needs an update.
:::
This class is a central building block of tiptap. It does most of the heavy lifting of creating a working [ProseMirror](https://ProseMirror.net/) editor such as creating the [`EditorView`](https://ProseMirror.net/docs/ref/#view.EditorView), setting the initial [`EditorState`](https://ProseMirror.net/docs/ref/#state.Editor_State) and so on. This class is a central building block of tiptap. It does most of the heavy lifting of creating a working [ProseMirror](https://ProseMirror.net/) editor such as creating the [`EditorView`](https://ProseMirror.net/docs/ref/#view.EditorView), setting the initial [`EditorState`](https://ProseMirror.net/docs/ref/#state.Editor_State) and so on.
## Editor Properties ## Settings
| Property | Type | Default | Description | All of the listed settings can be set during initialization, read and updated during runtime.
| ---------------------- | :--------------: | :---------: | ------------------------------------------------------------------------------------------------------------------------------------------------- |
| `content` | `Object\|String` | `null` | The editor state object used by Prosemirror. You can also pass HTML to the `content` slot. When used both, the `content` slot will be ignored. | | Setting | Type | Default | Description |
| `editorProps` | `Object` | `{}` | A list of [Prosemirror editorProps](https://prosemirror.net/docs/ref/#view.EditorProps). | | ------------------ | --------------- | ------- | ---------------------------------------------------------------------------------------------------------------------------------------------- |
| `editable` | `Boolean` | `true` | When set to `false` the editor is read-only. | | `autoFocus` | `Boolean` | `false` | Focus the editor on init. |
| `autoFocus` | `Boolean` | `false` | Focus the editor on init. | | `content` | `Object|String` | `null` | The editor state object used by Prosemirror. You can also pass HTML to the `content` slot. When used both, the `content` slot will be ignored. |
| `extensions` | `Array` | `[]` | A list of extensions used, by the editor. This can be `Nodes`, `Marks` or `Plugins`. | | `dropCursor` | `Object` | `{}` | Config for `prosemirror-dropcursor`. |
| `useBuiltInExtensions` | `Boolean` | `true` | By default tiptap adds a `Doc`, `Paragraph` and `Text` node to the Prosemirror schema. | | `editable` | `Boolean` | `true` | When set to `false` the editor is read-only. |
| `dropCursor` | `Object` | `{}` | Config for `prosemirror-dropcursor`. | | `editorProps` | `Object` | `{}` | A list of [Prosemirror editorProps](https://prosemirror.net/docs/ref/#view.EditorProps). |
| `enableDropCursor` | `Boolean` | `true` | Option to enable / disable the dropCursor plugin. | | `enableDropCursor` | `Boolean` | `true` | Option to enable / disable the dropCursor plugin. |
| `enableGapCursor` | `Boolean` | `true` | Option to enable / disable the gapCursor plugin. | | `enableGapCursor` | `Boolean` | `true` | Option to enable / disable the gapCursor plugin. |
| `parseOptions` | `Object` | `{}` | A list of [Prosemirror parseOptions](https://prosemirror.net/docs/ref/#model.ParseOptions). | | `extensions` | `Array` | `[]` | A list of extensions used, by the editor. This can be `Nodes`, `Marks` or `Plugins`. |
| `onInit` | `Function` | `undefined` | This will return an Object with the current `state` and `view` of Prosemirror on init. | | `parseOptions` | `Object` | `{}` | A list of [Prosemirror parseOptions](https://prosemirror.net/docs/ref/#model.ParseOptions). |
| `onFocus` | `Function` | `undefined` | This will return an Object with the `event` and current `state` and `view` of Prosemirror on focus. |
| `onBlur` | `Function` | `undefined` | This will return an Object with the `event` and current `state` and `view` of Prosemirror on blur. | ## Hooks
| `onUpdate` | `Function` | `undefined` | This will return an Object with the current `state` of Prosemirror, a `getJSON()` and `getHTML()` function and the `transaction` on every change. | The editor provides a few hooks to react to specific [events](/api/events). Pass a function that get’s called in case of those events.
| Hook | Type | Default | Description |
| ---------- | ---------- | ----------- | ------------------------------------------------------------------------------------------------------------------------------------------- |
| `onBlur` | `Function` | `undefined` | This will return an Object with the `event` and current `state` and `view` of Prosemirror on blur. |
| `onFocus` | `Function` | `undefined` | This will return an Object with the `event` and current `state` and `view` of Prosemirror on focus. |
| `onInit` | `Function` | `undefined` | This will return an Object with the current `state` and `view` of Prosemirror on init. |
| `onUpdate` | `Function` | `undefined` | This will return an Object with the current `state` of Prosemirror, a `json()` and `html()` function and the `transaction` on every change. |

8
docs/src/docPages/api/events.md
View File

@@ -11,9 +11,9 @@ const editor = new Editor({
onInit: () => { onInit: () => {
// editor is initialized // editor is initialized
}, },
onUpdate: ({ getHTML }) => { onUpdate: ({ html }) => {
// get new content on update // get new content on update
const newContent = getHTML() const newContent = html()
}, },
}) })
``` ```
@@ -27,8 +27,8 @@ editor.on('init', () => {
// editor is initialized // editor is initialized
}) })
editor.on('update', ({ getHTML }) => { editor.on('update', ({ html }) => {
// get new content on update // get new content on update
const newContent = getHTML() const newContent = html()
}) })
``` ```

10
docs/src/docPages/introduction.md
View File

@@ -3,11 +3,13 @@ tiptap is a renderless wrapper around [ProseMirror](https://ProseMirror.net) –
Although tiptap tries to hide most of the complexity of ProseMirror, it’s built on top of its APIs and we strongly recommend you to read through the [ProseMirror Guide](https://ProseMirror.net/docs/guide/). You’ll have a better understanding of how everything works under the hood and get familiar with many terms and jargon used by tiptap. Although tiptap tries to hide most of the complexity of ProseMirror, it’s built on top of its APIs and we strongly recommend you to read through the [ProseMirror Guide](https://ProseMirror.net/docs/guide/). You’ll have a better understanding of how everything works under the hood and get familiar with many terms and jargon used by tiptap.
## Renderless ## Features
We don’t tell you what a menu should look like or where it should be rendered in the DOM. That’s why tiptap is renderless and comes without any CSS. You are in full control over markup and styling.
## Works with and without Vue.js **Renderless.** We don’t tell you what a menu should look like or where it should be rendered in the DOM. That’s why tiptap is renderless and comes without any CSS. You are in full control over markup and styling.
We don’t care what framework you use. Tiptap is ready to be used with plain JavaScript, Vue.js or React. That makes it even possible to write a renderer for Svelte and others.
**Framework-agnostic.** We don’t care what framework you use. Tiptap is ready to be used with plain JavaScript, Vue.js or React. That makes it even possible to write a renderer for Svelte and others.
**TypeScript.** Tiptap 2 is written in TypeScript. That gives you a nice autocomplete for the API (if your IDE for it), helps to find bugs early and makes it possible to generate [a complete API documentation](#) on top of the extensive human written documentation.
## Who uses tiptap? ## Who uses tiptap?
- [GitLab](https://gitlab.com) - [GitLab](https://gitlab.com)

4
docs/src/docPages/overview/upgrade-guide.md
View File

@@ -13,7 +13,7 @@ The new API will look pretty familiar too you, but there are a ton of changes th
### 1. Explicitly register the Document, Text and Paragraph extensions ### 1. Explicitly register the Document, Text and Paragraph extensions
Tiptap 1 tried to hide a few required extensions from you. Be sure to explicitly import the [Document](/api/extensions/document), [Paragraph](/api/extensions/paragraph) and [Text](/api/extensions/text) extensions. Tiptap 1 tried to hide a few required extensions from you with the default setting `useBuiltInExtensions: true`. Be sure to explicitly import the [Document](/api/extensions/document), [Paragraph](/api/extensions/paragraph) and [Text](/api/extensions/text) extensions.
```js ```js
import Document from '@tiptap/extension-document' import Document from '@tiptap/extension-document'
@@ -30,6 +30,8 @@ new Editor({
}) })
``` ```
The `useBuiltInExtensions` setting has been removed.
### 2. New document type ### 2. New document type
**We renamed the default `Document` type from `doc` to `document`.** To keep it like that, use your own implementation of the `Document` node or migrate the stored JSON to use the new name. **We renamed the default `Document` type from `doc` to `document`.** To keep it like that, use your own implementation of the `Document` node or migrate the stored JSON to use the new name.

1
docs/src/links.yaml
View File

@@ -98,7 +98,6 @@
items: items:
- title: Editor - title: Editor
link: /api/editor/ link: /api/editor/
draft: true
- title: Extensions - title: Extensions
link: /api/extensions/ link: /api/extensions/
items: items: