fix: use <details>/<summary> for toggle block HTML export

[YousefED]

Summary

Toggle list items and toggle headings now export to external HTML using semantic <details>/<summary> elements instead of plain <div>/<li> tags. Children of toggle blocks are correctly placed inside the <details> element.

Closes #1936

Rationale

When exporting toggle blocks to HTML, the output rendered as plain <div> tags, making the toggle functionality completely lost. The <details>/<summary> HTML elements provide native, semantic toggle behavior that works without JavaScript.

Changes

• types.ts — Added optional childrenDOM property to toExternalHTML return type, allowing blocks to specify where children should be placed during serialization
• serializeBlocksExternalHTML.ts — When childrenDOM is set, children are appended there instead of being flattened into the parent document
• ToggleListItem/block.ts — toExternalHTML now produces <li><details open><summary><p>...</p></summary></details></li>
• Heading/block.ts — toExternalHTML wraps in <details><summary> when isToggleable: true

Impact

• Toggle list items and toggle headings now produce semantically correct HTML with native expand/collapse behavior
• Non-toggleable headings are unaffected
• The childrenDOM property is a general-purpose extension point that custom blocks can also use

Testing

• Added new lists/toggleWithChildren test case covering toggle list items and toggle headings with children
• All 509 tests pass (format conversion, clipboard, React)
• Updated snapshots for affected test cases

Checklist

• Code follows the project's coding standards.
• Unit tests covering the new feature have been added.
• All existing tests pass.
• The documentation has been updated to reflect the new feature

Additional Notes

The childrenDOM mechanism is generic — any custom block can return childrenDOM from toExternalHTML to control where children are placed in the exported HTML, instead of having them flattened.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated (UTC)
blocknote	Building	Preview	Feb 26, 2026 6:15pm
blocknote-website	Building	Preview	Feb 26, 2026 6:15pm