From 34c7f643abea556d71a1334fb9b7b1f87e00cf72 Mon Sep 17 00:00:00 2001 From: Fadekemi Adebayo Date: Sat, 30 Nov 2024 16:15:14 +0000 Subject: [PATCH] document withKlass option --- packages/lexical-website/docs/concepts/node-replacement.md | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/packages/lexical-website/docs/concepts/node-replacement.md b/packages/lexical-website/docs/concepts/node-replacement.md index 8090b41ac05..48873e59673 100644 --- a/packages/lexical-website/docs/concepts/node-replacement.md +++ b/packages/lexical-website/docs/concepts/node-replacement.md @@ -1,6 +1,6 @@ -# Node Overrides +# Node Overrides / Node Replacements Some of the most commonly used Lexical Nodes are owned and maintained by the core library. For example, ParagraphNode, HeadingNode, QuoteNode, List(Item)Node etc - these are all provided by Lexical packages, which provides an easier out-of-the-box experience for some editor features, but makes it difficult to override their behavior. For instance, if you wanted to change the behavior of ListNode, you would typically extend the class and override the methods. However, how would you tell Lexical to use *your* ListNode subclass in the ListPlugin instead of using the core ListNode? That's where Node Overrides can help. @@ -22,6 +22,10 @@ const editorConfig = { ] } ``` +In the snippet above, +- `replace`: Specifies the core node type to be replaced. +- `with`: Defines a transformation function to replace instances of the original node to the custom node. +- `withKlass`: This option ensures that behaviors associated with the original node type work seamlessly with the replacement. For instance, node transforms or listeners targeting ParagraphNode will also apply to CustomParagraphNode when withKlass is specified. Without this option, the custom node might not fully integrate with the editor's built-in features, leading to unexpected behavior. Once this is done, Lexical will replace all ParagraphNode instances with CustomParagraphNode instances. One important use case for this feature is overriding the serialization behavior of core nodes. Check out the full example below.