v0.56.2
The component insert picker gains a live preview and round-trip editing, and the component contract
grows the optional fields that make a good picker possible. These refine the existing
component-editing surface and are all additive, so it is a patch; existing definitions compile
unchanged with no action required.
How the design was reached. Two research arms ran first. One surveyed how comparable systems build
their insert pickers (Gutenberg, Sanity, Wagtail, Payload, Contentful, Builder, and the git-backed and
document tools). The other hunted documented complaints from both the editor and the developer, then
paired each with a correction. Five pains recur across systems that share no code, and cairn already
beats four of them by its existing architecture: a single ComponentDef co-locates render and schema
(no schema-render drift), content is markdown in git (no database-migration tax), and the parser reads
real directives (lossless re-edit stays reachable). The fifth pain, configuring a block without seeing
the result, no system has solved. An adversarial critique of the first mockup then caught the preview
faked with static HTML and an ironic "Untitled" placeholder, which the shipped design corrects.
What an editor gets. The picker lists components in one column, grouped under headings, each row a
glyph, a description, and a line on when to reach for it; a search box appears once a site declares
more than eight. Picking a component that declares a preview opens a two-pane configure step: the
fill form on the left, and on the right the configured component rendered through the site's own
pipeline, the same machinery the edit page preview uses. This is the part no comparable CMS offers,
and cairn can offer it because it already owns the render path. The preview settles on a debounce
rather than re-rendering on every keystroke, and it stays honest: a still-empty required field shows
the skeleton with the empty region called out rather than a fabricated result, and a render that
throws shows a failed-to-render surface and keeps the form. A component that declares no preview
keeps the single-column form. Required fields are marked and block Insert with inline messages, and
the modal collapses to one column on a narrow screen.
Round-trip editing closes the loop. With the cursor in a placed component, an Edit block control opens
it back into the same guided form, pre-filled, and Update rewrites that block in place. It is offered
only when the round-trip is provably lossless for that block: one that carries an attribute or a child
the component does not declare is left for hand-editing rather than silently rewritten, the failure
that corrupts content in the git-backed editors the research surveyed. A guided edit that does run
preserves content and normalizes formatting to the canonical serialization. A consumer site that
mounts CairnAdmin gets this with no change.
For consumers, the ComponentDef contract gains optional fields, so existing definitions compile
unchanged with no action required:
iconshows a glyph from the site icon set beside the label in the picker.groupputs a component under a category heading, in declaration order.hiddenkeeps a component out of the top-level picker (for a nested-only component).previewis a structured sample (attributesandslots) the picker seeds the form with and
renders. Declaring it is what opts a component into the two-pane preview layout.patternandvalidateon an attribute field add inline validation, the regex case and a pure
cross-field escape hatch.itemLabelon a repeatable slot derives a row's label, so a list of items is not a column of blanks.
Round-trip editing of a placed component, a persistent catalog rail, and a slash-trigger are designed
for but deferred to a later pass.