LLui Markdown Editor

A WYSIWYG editor built on The Elm Architecture — Markdown in, Markdown out, the rich editing hidden behind a pluggable widget. Powered by @llui/markdown-editor over @llui/lexical.

Full editor

Toolbar, lists, code, links, and a custom callout decorator. The panel mirrors the live Markdown; the buttons drive the editor through its public handle.

Drive via the handle

These buttons send messages through the editor's public send() handle — the same API an agent would use. Click into the editor first, then a button.

Live Markdown read-only output

The Markdown the editor produces, updated live. Display only — edit on the left, not here.

Minimal editor

No chrome at all — just keyboard Markdown shortcuts. The same component, configured down.

Single block (inline-only)

The same component constrained to one paragraph with inline styles only via singleBlockPlugin() — no headings, lists, or block structure. Block Markdown stays literal, and pasting multi-paragraph text collapses to a single line.

Title field strict single line

Enter is inert; paste a heading or several paragraphs — it flattens to one line.

Comment box line breaks + links

singleBlockPlugin({ allowLineBreaks: true, link: true }) + the linkPlugin() dialog. Shift/Enter inserts a soft break, never a new paragraph.

Why a constraint, not a plugin add-on

singleBlockPlugin() replaces the default plugin set — it contributes only inline transformers and a RootNode transform that coalesces any stray blocks back into one paragraph. Compose it with linkPlugin() for links; a dev-only guard warns if you accidentally pair it with corePlugin().

Try pasting this into the title field:

# A heading
followed by a second paragraph.

Two-way Markdown source

The raw Markdown and the WYSIWYG view are bound through the handle — edit either side.