Plate is providing a typed layer on top of Slate, using mostly generic types.
Differences with Slate types:
Vrepresents the "value" being edited by Slate. In the most generic editor,
Vwould be equivalent to
TElement(since that is what is accepted as children of the editor). But in a custom editor, you might have
TEditor<Array<Paragraph | Quote>>.
TNode-related methods have been also made generic, so for example if you use
getLeafNode(editor, path)it knows that the return value is a
TTextnode. But more specifically, it knows that it is the text node of the type you've defined in your custom elements (with any marks you've defined).
TEditortype is not matching with Slate
Editortype, so Plate has forked (type-only) all Slate methods that use
Editorthat you should use.
- This replaces the declaration merging approach, and provides some benefits. One of the drawbacks to declaration merging was that it was impossible to know whether you were dealing with an "unknown" or "known" element, since the underlying type was changed. Similarly, having two editors on the page with different schemas wasn't possible to represent. Hopefully this approach with generics will be able to smoothly replace the declaration merging approach. (While being easy to migrate to, since you can pass those same custom element definitions into
First, let's create a new file to define our
MyValue type, which will be the type of our
Myis short and explicit.
T...Elementis used because
...Elementis already used by Plate UI components and we don't want naming conflicts between imports.
T...is also a way to differenciate Plate types with Slate types.
MyValue is the most important type as most of the core types are derived from it.
The following types are optional but highly recommended, writing generic types are redundant so try doing it only once:
Finally, let's define typed functions: