Function: NestedLexicalEditor()

NestedLexicalEditor<T>(props): Element

A nested editor React component that allows editing of the contents of complex markdown nodes that have nested markdown content (for example, custom directives or JSX elements).

Type parameters

Type parameter
T extends RootContent

Parameters

Parameter	Type	Description
props	object	-
props.block?	boolean	Whether or not the editor edits blocks (multiple paragraphs)
props.contentEditableProps?	object & AllHTMLAttributes<HTMLDivElement>	Props passed to the ContentEditable component.
props.getContent	(mdastNode) => RootContent[]	A function that returns the phrasing content of the mdast node. In most cases, this will be the children property of the mdast node, but you can also have multiple nested nodes with their own children.
props.getUpdatedMdastNode	(mdastNode, children) => T	A function that should return the updated mdast node based on the original mdast node and the new content (serialized as mdast tree) produced by the editor.

Returns

Element

Example

You can use a type param to specify the type of the mdast node

interface CalloutDirectiveNode extends LeafDirective {
  name: 'callout'
  children: Mdast.PhrasingContent[]
}

return <NestedLexicalEditor<CalloutDirectiveNode> getContent={node => node.children} getUpdatedMdastNode={(node, children) => ({ ...node, children })} />