🤖 Be sure to mix in
props.childrenin your custom components! The attributes must be added to the top-level DOM element inside the component, as they are required for Slate's DOM helper functions to work. And the children are the actual text content of your document which Slate manages for you automatically.
renderElement. Since text formatting tends to be fairly simple, we've opted to ditch the
switchstatement and just toggle on/off a few styles instead. (But there's nothing preventing you from using custom components if you'd like!)
<strike>to that text, you might have to rearrange the closing tags yet again. Rendering leaves in Slate is similar—you can't guarantee that even though a word has one type of formatting applied to it that that leaf will be contiguous, because it depends on how it overlaps with other formatting.
Rangeof the document instead of being associated with a given text node.
useSlatehook to retrieve the context, it will re-render whenever the editor changes, so that the active state of the buttons stays in sync.