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

add content

Browse Source
This commit is contained in:
Hans Pagel
2020-11-05 14:39:28 +01:00
parent 8147172325
commit 520cc318a6
9 changed files with 208 additions and 178 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
docs/src/docPages/api/commands.md
View File

@@ -27,35 +27,67 @@ When a user clicks on a button outside of the content, the editor isn’t in foc
All chained commands are kind of queued up. They are combined to one single transaction. That means, the content is only updated once, also the `update` event is only triggered once.
## Dry run for commands
Sometimes, you don’t want to actually run the commands, but only know if it would be possible to run commands, for example to show or hide buttons in a menu. Inside of a command you can *try* to execute other commands, without actually changing the content like this:
```js
commands.try([
() => commands.splitBlock(),
() => commands.whatever(),
])
```
Outside of components you can do this, too. The editor exposes a try method, which passes all commands and expects an array of commands you want to try:
```js
editor.try(({ commands }) => [
() => commands.splitBlock(),
() => commands.whatever(),
])
```
This stops at the first command which return `false`. Commands after that won’t be executed. Even if all commands would be possible to run, none of the changes are applied to the document.
## List of commands
Have a look at all of the core commands listed below. They should give you a good first impression of what’s possible.
### Content
| Command | Description |
| --------------- | ----------------------------------------------------------- |
| .clearContent() | Clear the whole document. |
| .insertgetHTML() | Insert a string of HTML at the currently selected position. |
| .insertText() | Insert a string of text at the currently selected position. |
| .setContent() | Replace the whole document with new content. |
| Command | Description |
| ---------------- | ----------------------------------------------------------- |
| .clearContent() | Clear the whole document. |
| .insertgetHTML() | Insert a string of HTML at the currently selected position. |
| .insertText() | Insert a string of text at the currently selected position. |
| .insertHTML() | |
| .setContent() | Replace the whole document with new content. |
### Nodes & Marks
| Command | Description |
| ------------------- | ------------------------------------------------------ |
| .removeMark() | Remove a mark in the current selection. |
| .removeMarks() | Remove all marks in the current selection. |
| .selectParentNode() | Select the parent node. |
| .toggleMark() | Toggle a mark on and off. |
| .toggleBlockType() | Toggle a node with another node. |
| .setBlockType() | Replace a given range with a node. |
| .updateMark() | Update a mark with new attributes. |
| Command | Description |
| ---------------------- | ------------------------------------------ |
| .clearNodes() | |
| .removeMark() | |
| .removeMark() | Remove a mark in the current selection. |
| .removeMarks() | |
| .removeMarks() | Remove all marks in the current selection. |
| .resetNodeAttributes() | |
| .selectParentNode() | Select the parent node. |
| .setBlockType() | Replace a given range with a node. |
| .setNodeAttributes() | |
| .splitBlock() | Forks a new node from an existing node. |
| .toggleBlockType() | Toggle a node with another node. |
| .toggleMark() | |
| .toggleMark() | Toggle a mark on and off. |
| .toggleWrap() | |
| .updateMark() | |
| .updateMark() | Update a mark with new attributes. |
### Lists
| Command | Description |
| ------------------- | ------------------------------------------------------ |
| .liftListItem() | Lift the list item into a wrapping list. |
| .sinkListItem() | Sink the list item down into an inner list. |
| .splitListItem() | Splits a textblock of a list item into two list items. |
| .toggleList() | Toggle between different list styles. |
| Command | Description |
| ---------------- | ------------------------------------------------------ |
| .liftListItem() | Lift the list item into a wrapping list. |
| .sinkListItem() | Sink the list item down into an inner list. |
| .splitListItem() | Splits a textblock of a list item into two list items. |
| .toggleList() | Toggle between different list styles. |
| .wrapInList() | |
### Selection
| Command | Description |
@@ -67,4 +99,4 @@ Have a look at all of the core commands listed below. They should give you a goo
| .selectAll() | Select the whole document. |
### Extensions
All extension can add additional commands (and most do), check out the specific [documentation for the provided extensions](/api/extensions), [nodes](/api/nodes), and [marks](/api/marks) to learn more about that. Of course, you can [add your custom extensions](/guide/build-custom-extensions) with custom commands aswell.
All extensions can add additional commands (and most do), check out the specific [documentation for the provided nodes](/api/nodes), [marks](/api/marks), and [extensions](/api/extensions) to learn more about those. Of course, you can [add your custom extensions](/guide/build-custom-extensions) with custom commands aswell.