Is it possible to use div instead of p?

[roeycohen]

I've tried creating a DivNode that inherits from ParagraphNode, but the default node seems to be P

Thanks for this great project :)

[trueadm]

You'll need to use the node replacement API to set the ParagraphNode to be your DivNode. https://lexical.dev/docs/concepts/node-replacement

[roeycohen]

I didn't try... I found myself overriding all of these functions anyway...

TextNode.importDOM (for colors)
ParagraphNode.importDOM (div => p)
ListItemNode.importDOM (text-align support)

ParagraphNode.prototype.exportDOM (for better directionality saving)
TextNode.prototype.exportDOM (replacing spans with b, u, i and s to reduce html size)
ListItemNode.prototype.exportDOM (directionality + value remove)
LinkNode.prototype.exportDOM (prevent auto-links from being saved as regular links)

We were using draftjs till now, and were delighted to found out that lexical is already quite evolved and takes the same approach that we loved in draft :)

[edishu]

@trueadm the example you have shared adds styling to CustomParagraphNode node. But how can I convert it to a div element?

[etrepum]

You can change the tag used by overriding the createDOM, updateDOM, importDOM, and exportDOM methods of your ParagraphNode subclass

[edishu]

Thanks, that works well! However, I just createDOM only. Do I need to add updateDOM, importDOM, and exportDOM too?

[etrepum]

You'll need importDOM if you ever want HTML import of your customized tag to create paragraph nodes, which may be relevant for copy and paste in certain situations. The other ones you can probably rely on the default implementations.