mirror/slate
1
0
Fork 0
mirror of https://github.com/ianstormtaylor/slate.git synced 2025-08-30 10:29:48 +02:00
Code Issues Releases Wiki Activity

Allow void elements to receive marks (#5135)

Browse Source 
Some void elements are effectively stand-ins for text, such as with the mentions example,
where the mention element renders the character's name. Users might want to format Void
elements like this with bold, or set their font and size, so `editor.markableVoid` tells
Slate whether or not to apply Marks to the text children of void elements.

- Adds `markableVoid()` as a schema-specific overrideable test.
- Changes `addMark` and `removeMark` so marks can apply to voids. Also changes behavior
of collapsed selection so that if a markable Void is selected, the mark will be applied /
removed.
- Shows how `markableVoid()` can work in the mentions example
This commit is contained in:
Brian Bucknam
2022-11-08 04:38:15 -08:00
committed by GitHub
parent 3c49ff28b3
commit 346f6572fc
12 changed files with 407 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
docs/api/nodes/editor.md
View File

@@ -12,6 +12,7 @@ interface Editor {
// Schema-specific node behaviors.
isInline: (element: Element) => boolean
isVoid: (element: Element) => boolean
markableVoid: (element: Element) => boolean
normalizeNode: (entry: NodeEntry) => void
onChange: () => void
@@ -221,7 +222,7 @@ Options: `{at?: Location, mode?: 'highest' | 'lowest', voids?: boolean}`
#### `Editor.addMark(editor: Editor, key: string, value: any) => void`
Add a custom property to the leaf text nodes in the current selection.
Add a custom property to the leaf text nodes and any nodes that `editor.markableVoid()` allows in the current selection.
If the selection is currently collapsed, the marks will be added to the `editor.marks` property instead, and applied when text is inserted next.
@@ -265,7 +266,7 @@ If the selection is currently expanded, it will be deleted first.
#### `Editor.removeMark(editor: Editor, key: string) => void`
Remove a custom property from all of the leaf text nodes in the current selection.
Remove a custom property from all of the leaf text nodes within non-void nodes or void nodes that `editor.markableVoid()` allows in the current selection.
If the selection is currently collapsed, the removal will be stored on `editor.marks` and applied to the text inserted next.
@@ -423,13 +424,17 @@ Called when there is a change in the editor.
### Mark methods
#### `markableVoid: (element: Element) => boolean`
Tells which void nodes accept Marks. Slate's default implementation returns `false`, but if some void elements support formatting, override this function to include them.
#### `addMark(key: string, value: any) => void`
Add a custom property to the leaf text nodes in the current selection. If the selection is currently collapsed, the marks will be added to the `editor.marks` property instead, and applied when text is inserted next.
Add a custom property to the leaf text nodes within non-void nodes or void nodes that `editor.markableVoid()` allows in the current selection. If the selection is currently collapsed, the marks will be added to the `editor.marks` property instead, and applied when text is inserted next.
#### `removeMark(key: string) => void`
Remove a custom property from the leaf text nodes in the current selection.
Remove a custom property from the leaf text nodes within non-void nodes or void nodes that `editor.markableVoid()` allows in the current selection.
### getFragment method