@elytracms/studio 0.0.90 → 0.0.91

package/dist/components/builder/composition-field-editor.js

@@ -5,6 +5,7 @@ import { DEFAULT_SLOT, mergeBlockRoots, splitBlockRoots } from '@elytracms/core/
 import { Button, Panel, Row, Spacer, Text, Toolbar, ToolbarGroup, ToolbarSeparator } from '@elytracms/studio/ui';
 import { cn } from '@elytracms/studio/lib/utils';
 import { translate } from '@elytracms/studio/lib/i18n';
+import { getStudioRegistry } from '@elytracms/studio/lib/registry';
 import { BuilderProvider, useBuilder } from './builder-store.js';
 import { useCanvasViewports } from './canvas-breakpoints.js';
 import { BuilderCanvas } from './canvas.js';
@@ -40,8 +41,6 @@ import { fieldLabel } from '../cms/cms-labels.js';
  * than being crammed into the field list.
  */
 const SYNTH_ROOT_ID = 'composition.root';
-/** The implicit root container the field's blocks compose inside (like a page root). */
-const SYNTH_ROOT_COMPONENT = 'base.Stack';
 /**
  * Split a stored blocks-field value into the component nodes the canvas edits
  * and the sequence items it must preserve (EC-547, the EC-500 round-trip law:
@@ -79,14 +78,47 @@ export function compositionFieldScope(field) {
  * Wrap the field value's component roots in a synthetic root container (EC-287).
  * The builder store edits this single root-bearing composition directly; its
  * children are the field's component blocks, lifted back out via `onChange`.
+ * EC-591: the root is the component that fills the `layout.stack` role — the
+ * project's own, from its component list — never a hardcoded engine id.
  */
-function buildSyntheticRoot(roots) {
+function buildSyntheticRoot(roots, stackComponentId) {
     return {
         id: SYNTH_ROOT_ID,
-        componentId: SYNTH_ROOT_COMPONENT,
+        componentId: stackComponentId,
         slots: { [DEFAULT_SLOT]: [...roots] },
     };
 }
+/**
+ * The canvas notices for roles nobody in the component list fills (EC-591) — each
+ * names the gesture that is OFF because of it, so a missing role is visible, never
+ * a silent dead affordance. Only gestures the canvas actually has are listed: the
+ * `layout.stack` role is the canvas itself (see {@link CompositionFieldEditor}),
+ * `layout.grid` the wrap-beside gesture, `text` the seeded layout presets.
+ * (`richText` — the typography projection, EC-549 — and `image` — asset drop —
+ * have no canvas gesture yet, so there is nothing to switch off.) Pure.
+ */
+export function canvasRoleNotices(registry) {
+    const notices = [];
+    if (!registry.roleComponent('layout.grid'))
+        notices.push('builder.roles.noGrid');
+    if (!registry.roleComponent('text'))
+        notices.push('builder.roles.noText');
+    return notices;
+}
+/** The role notices above the canvas (EC-591) — a standing truth about the component list. */
+export function CanvasRoleNotices({ notices }) {
+    if (notices.length === 0)
+        return null;
+    return (_jsx("div", { "data-testid": "canvas-role-notices", className: "shrink-0 border-b border-border bg-muted/40", children: notices.map((key) => (_jsxs(Row, { gap: "2", align: "center", className: "px-3 py-1.5", children: [_jsx(AlertTriangle, { "aria-hidden": true, className: "size-3.5 shrink-0 text-muted-foreground" }), _jsx(Text, { size: "xs", tone: "muted", children: translate(key) })] }, key))) }));
+}
+/**
+ * The canvas in place of the editor when nobody fills `layout.stack` (EC-591): the
+ * blocks of a composition field compose inside that component, so there is no
+ * canvas without it. The value is not touched — nothing mounts that could write.
+ */
+export function NoStackCanvasNotice() {
+    return (_jsx(Panel, { "data-testid": "canvas-no-stack", className: "flex h-full min-h-0 items-center justify-center p-6", children: _jsxs(Row, { gap: "2", align: "center", className: "max-w-prose", children: [_jsx(AlertTriangle, { "aria-hidden": true, className: "size-4 shrink-0 text-muted-foreground" }), _jsx(Text, { size: "sm", tone: "muted", children: translate('builder.roles.noStack') })] }) }));
+}
 export function CompositionFieldEditor({ field, value, onChange, readOnly, trailingPanes, }) {
     // Split the value ONCE at mount (EC-547): component nodes become the canvas
     // roots; every other sequence item is preserved aside for write-back. The
@@ -95,11 +127,18 @@ export function CompositionFieldEditor({ field, value, onChange, readOnly, trail
     // draft. (BuilderProvider reads `composition` only in its lazy initial state,
     // so later prop changes are ignored regardless.)
     const initial = useMemo(() => splitCompositionValue(value), []);
-    const initialRoot = useMemo(() => buildSyntheticRoot(initial.roots), [initial]);
+    // EC-591: the roles come from the project's component list (the registry).
+    const registry = getStudioRegistry().registry;
+    const stack = registry.roleComponent('layout.stack');
+    const layout = registry.layout;
+    const notices = useMemo(() => canvasRoleNotices(registry), [registry]);
+    const initialRoot = useMemo(() => (stack ? buildSyntheticRoot(initial.roots, stack.id) : null), [initial, stack]);
     // EC-554: the field's `allow` travels WITH the store, so every placement
     // surface (canvas + tree DnD, paste, the insert offer) judges the same value.
     const fieldScope = useMemo(() => compositionFieldScope(field), [field]);
-    return (_jsxs(BuilderProvider, { composition: initialRoot, field: fieldScope, children: [_jsx(CompositionLift, { preserved: initial.preserved, onChange: onChange, readOnly: readOnly }), _jsx(ReuseProvider, { children: _jsx(PropSyncProvider, { children: _jsx(CompositionEditorShell, { readOnly: readOnly, trailingPanes: trailingPanes, preservedCount: initial.preserved.length }) }) })] }));
+    if (!initialRoot)
+        return _jsx(NoStackCanvasNotice, {});
+    return (_jsxs(BuilderProvider, { composition: initialRoot, field: fieldScope, layout: layout, children: [_jsx(CompositionLift, { preserved: initial.preserved, onChange: onChange, readOnly: readOnly }), _jsx(ReuseProvider, { children: _jsx(PropSyncProvider, { children: _jsx(CompositionEditorShell, { readOnly: readOnly, trailingPanes: trailingPanes, preservedCount: initial.preserved.length, roleNotices: notices }) }) })] }));
 }
 /**
  * EC-549 interim (scope item 3, the honesty floor): a mixed sequence's typography
@@ -177,7 +216,7 @@ function BreakpointSwitcher() {
  * field. It keeps spatial/preview controls — including the breakpoint
  * preview-width switcher (EC-211), a canvas concern, not a lifecycle one.
  */
-function CompositionEditorShell({ readOnly, trailingPanes, preservedCount = 0, }) {
+function CompositionEditorShell({ readOnly, trailingPanes, preservedCount = 0, roleNotices, }) {
     const builder = useBuilder();
     const dispatch = builder.dispatch;
     // The field's top-level component vocabulary (EC-188) — the leash applied to
@@ -231,6 +270,6 @@ function CompositionEditorShell({ readOnly, trailingPanes, preservedCount = 0, }
             setInsertOpen(true);
         },
     }), [builder, fieldAllow, dispatch]);
-    return (_jsx(InsertAffordanceProvider, { value: affordanceApi, children: _jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsx("div", { className: "shrink-0 border-b border-border", children: _jsxs(Toolbar, { children: [_jsxs(ToolbarGroup, { children: [_jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": translate('builder.canvas.undo'), title: translate('builder.canvas.undo'), disabled: readOnly || !builder.canUndo, onClick: () => dispatch({ type: 'undo' }), children: _jsx(Undo2, {}) }), _jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": translate('builder.canvas.redo'), title: translate('builder.canvas.redo'), disabled: readOnly || !builder.canRedo, onClick: () => dispatch({ type: 'redo' }), children: _jsx(Redo2, {}) })] }), _jsx(ToolbarSeparator, {}), _jsxs(Button, { size: "sm", variant: "ghost", disabled: readOnly, onClick: () => openInsert(builder.selectedId ?? rootId), children: [_jsx(Plus, {}), " ", translate('builder.canvas.insert')] }), _jsx(Spacer, {}), _jsx(BreakpointSwitcher, {}), _jsx(Spacer, {})] }) }), _jsxs("div", { className: "grid min-h-0 flex-1 grid-cols-[minmax(200px,240px)_1fr_minmax(280px,320px)] gap-px bg-border", children: [_jsx(Panel, { className: cn('rounded-none border-0', readOnly && 'pointer-events-none opacity-60'), children: _jsx(PageTree, { onAddChild: openInsert }) }), _jsxs("div", { className: cn('flex min-h-0 flex-col bg-background', readOnly && 'pointer-events-none opacity-60'), children: [_jsx(PreservedItemsNotice, { count: preservedCount }), _jsx(BuilderCanvas, { perspective: readOnly ? 'published' : 'draft' })] }), _jsx(InspectorSidebar, { panes: panes })] }), _jsx(InsertMenu, { context: insertContext, open: insertOpen, onOpenChange: setInsertOpen })] }) }));
+    return (_jsx(InsertAffordanceProvider, { value: affordanceApi, children: _jsxs("div", { className: "flex h-full min-h-0 flex-col", children: [_jsx("div", { className: "shrink-0 border-b border-border", children: _jsxs(Toolbar, { children: [_jsxs(ToolbarGroup, { children: [_jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": translate('builder.canvas.undo'), title: translate('builder.canvas.undo'), disabled: readOnly || !builder.canUndo, onClick: () => dispatch({ type: 'undo' }), children: _jsx(Undo2, {}) }), _jsx(Button, { size: "icon-sm", variant: "ghost", "aria-label": translate('builder.canvas.redo'), title: translate('builder.canvas.redo'), disabled: readOnly || !builder.canRedo, onClick: () => dispatch({ type: 'redo' }), children: _jsx(Redo2, {}) })] }), _jsx(ToolbarSeparator, {}), _jsxs(Button, { size: "sm", variant: "ghost", disabled: readOnly, onClick: () => openInsert(builder.selectedId ?? rootId), children: [_jsx(Plus, {}), " ", translate('builder.canvas.insert')] }), _jsx(Spacer, {}), _jsx(BreakpointSwitcher, {}), _jsx(Spacer, {})] }) }), _jsxs("div", { className: "grid min-h-0 flex-1 grid-cols-[minmax(200px,240px)_1fr_minmax(280px,320px)] gap-px bg-border", children: [_jsx(Panel, { className: cn('rounded-none border-0', readOnly && 'pointer-events-none opacity-60'), children: _jsx(PageTree, { onAddChild: openInsert }) }), _jsxs("div", { className: cn('flex min-h-0 flex-col bg-background', readOnly && 'pointer-events-none opacity-60'), children: [_jsx(PreservedItemsNotice, { count: preservedCount }), _jsx(CanvasRoleNotices, { notices: roleNotices ?? [] }), _jsx(BuilderCanvas, { perspective: readOnly ? 'published' : 'draft' })] }), _jsx(InspectorSidebar, { panes: panes })] }), _jsx(InsertMenu, { context: insertContext, open: insertOpen, onOpenChange: setInsertOpen })] }) }));
 }
 //# sourceMappingURL=composition-field-editor.js.map

package/dist/components/builder/composition-field-editor.js.map

@@ -1 +1 @@
-{"version":3,"file":"composition-field-editor.js","sourceRoot":"","sources":["../../../src/components/builder/composition-field-editor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react'\nimport { AlertTriangle, Pilcrow, Plus, Redo2, SlidersHorizontal, Undo2 } from 'lucide-react'\nimport { DEFAULT_SLOT, mergeBlockRoots, splitBlockRoots } from '@elytracms/core/project-graph'\nimport type { ComponentNode, PreservedSequenceItem, SplitBlockRoots } from '@elytracms/core/project-graph'\nimport type { BlocksFieldDef } from '@elytracms/core/cms-core'\nimport type { BlockNode, BlockSequenceValue } from '@elytracms/core/rich-text'\nimport { Button, Panel, Row, Spacer, Text, Toolbar, ToolbarGroup, ToolbarSeparator } from '@elytracms/studio/ui'\nimport { cn } from '@elytracms/studio/lib/utils'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { BuilderProvider, useBuilder } from './builder-store'\nimport type { CompositionFieldScope } from './builder-store'\nimport { useCanvasViewports } from './canvas-breakpoints'\nimport type { ViewportOption } from './canvas-breakpoints'\nimport { BuilderCanvas } from './canvas'\nimport { PageTree } from './page-tree'\nimport { PropertyInspector } from './property-inspector'\nimport { InspectorSidebar } from '../inspector/inspector-sidebar'\nimport type { InspectorPane } from '../inspector/inspector-sidebar'\nimport { InsertMenu } from './insert-menu'\nimport type { InsertContext } from './insert-menu'\nimport { insertablePositions, resolveInsertContext, resolveInsertContextAt } from './insert-context'\nimport type { InsertPosition } from './insert-context'\nimport { InsertAffordanceProvider } from './insert-affordance-context'\nimport type { InsertAffordanceApi } from './insert-affordance-context'\nimport { PropSyncProvider } from './prop-sync-context'\nimport { ReuseProvider } from './reuse-context'\nimport { fieldLabel } from '../cms/cms-labels'\n\n/**\n * EC-188 — the block-field surface: one canvas engine mounted on a composition\n * **field value** (AD-12), not the project graph.\n *\n * The composition tree is wrapped in a synthetic single-page graph and edited by\n * a SCOPED `BuilderProvider` with **no `projectId`** (so the graph persister is a\n * no-op — builder-store.tsx). Every committed edit is lifted out via `onChange`\n * into the CMS document draft; the document's own Save persists it (the tree is\n * stored as document data, `v.any()`).\n *\n * EC-547 (EC-500 D1–D3): the stored value is the converged v2 block sequence\n * `{ version: 2, content: BlockNode[] }`. The canvas edits the sequence's\n * `elytra/component` nodes; typography nodes survive the session byte-for-byte\n * and keep their order relative to components on write-back (see\n * {@link splitCompositionValue} / {@link mergeCompositionValue}). Legacy bare\n * node/array values are still ACCEPTED on read during the staging window, but\n * every write emits v2. This reuses the real canvas + inspector +\n * blocks panel unchanged — the same EC-158–164 mechanics — without touching the\n * project-wide builder store. Surfaced on a dedicated \"Canvas\" fieldset tab in\n * the CMS detail editor so the page builder gets full screen real estate rather\n * than being crammed into the field list.\n */\n\nconst SYNTH_ROOT_ID = 'composition.root'\n/** The implicit root container the field's blocks compose inside (like a page root). */\nconst SYNTH_ROOT_COMPONENT = 'base.Stack'\n\n/**\n * A sequence item the canvas does not natively edit (EC-547 / EC-500 D3):\n * typography nodes, unknown/future node kinds, even entries the v2 schema would\n * reject — the editor is not a validator, so they are carried BYTE-FOR-BYTE and\n * re-merged on write-back rather than parsed, rewritten, or dropped.\n * `componentPrefix` records how many component nodes preceded the item in the\n * original sequence — the anchor {@link mergeCompositionValue} splices by.\n */\nexport type PreservedBlockNode = PreservedSequenceItem<BlockNode>\n\n/** A field value split for canvas editing: component roots + everything else. */\nexport type SplitCompositionValue = SplitBlockRoots<BlockNode>\n\n/**\n * Split a stored blocks-field value into the component nodes the canvas edits\n * and the sequence items it must preserve (EC-547, the EC-500 round-trip law:\n * a projection may only rewrite nodes it natively edits). Typography items are\n * deliberately NOT surfaced as editable canvas blocks in v1 (EC-500 D3) — they\n * survive the editing session and keep their order on write-back.\n *\n * EC-576: the logic is core's {@link splitBlockRoots} — the ONE reader every\n * blocks writer shares. This is the canvas's typed view of it: project-graph\n * sits below rich-text and cannot name {@link BlockNode}, so the carried items\n * arrive `unknown`; they are typed here, not checked (preservation over parsing).\n */\nexport function splitCompositionValue(value: unknown): SplitCompositionValue {\n  return splitBlockRoots(value) as SplitCompositionValue\n}\n\n/**\n * Merge canvas-edited component roots back into the stored sequence (EC-547).\n * The merge rule — preserved items anchored to their ordinal position between\n * components, every root tagged, the write always v2 — is core's\n * {@link mergeBlockRoots} (EC-576: the same merge every blocks writer goes\n * through, via `editBlockRoots`). Typed here as the rich-text value.\n */\nexport function mergeCompositionValue(\n  roots: readonly ComponentNode[],\n  preserved: readonly PreservedBlockNode[],\n): BlockSequenceValue {\n  return mergeBlockRoots(roots, preserved)\n}\n\n/**\n * The field scope the editor's store carries (EC-554): the field's label (named\n * by refusal notices) and its top-level `allow`, passed through verbatim — an\n * omitted `allow` stays `undefined` (EC-544: any registered component).\n */\nexport function compositionFieldScope(field: BlocksFieldDef): CompositionFieldScope {\n  return { label: fieldLabel(field), allow: field.allow }\n}\n\n/**\n * Wrap the field value's component roots in a synthetic root container (EC-287).\n * The builder store edits this single root-bearing composition directly; its\n * children are the field's component blocks, lifted back out via `onChange`.\n */\nfunction buildSyntheticRoot(roots: readonly ComponentNode[]): ComponentNode {\n  return {\n    id: SYNTH_ROOT_ID,\n    componentId: SYNTH_ROOT_COMPONENT,\n    slots: { [DEFAULT_SLOT]: [...roots] },\n  }\n}\n\nexport function CompositionFieldEditor({\n  field,\n  value,\n  onChange,\n  readOnly,\n  trailingPanes,\n}: {\n  field: BlocksFieldDef\n  value: unknown\n  onChange: (value: unknown) => void\n  readOnly: boolean\n  /** Inspector panes the document editor appends after the canvas-supplied\n   *  `Properties` pane (EC-224 — the frame-owned `Versions` pane). */\n  trailingPanes?: readonly InspectorPane[]\n}) {\n  // Split the value ONCE at mount (EC-547): component nodes become the canvas\n  // roots; every other sequence item is preserved aside for write-back. The\n  // editor is uncontrolled thereafter — it is the source of truth while open and\n  // lifts changes out via onChange; re-opening the tab remounts from the current\n  // draft. (BuilderProvider reads `composition` only in its lazy initial state,\n  // so later prop changes are ignored regardless.)\n  const initial = useMemo(() => splitCompositionValue(value), [])\n  const initialRoot = useMemo(() => buildSyntheticRoot(initial.roots), [initial])\n  // EC-554: the field's `allow` travels WITH the store, so every placement\n  // surface (canvas + tree DnD, paste, the insert offer) judges the same value.\n  const fieldScope = useMemo(() => compositionFieldScope(field), [field])\n\n  return (\n    <BuilderProvider composition={initialRoot} field={fieldScope}>\n      <CompositionLift preserved={initial.preserved} onChange={onChange} readOnly={readOnly} />\n      <ReuseProvider>\n        {/* EC-408: the field↔component selection-sync channel wraps BOTH the canvas\n            and the inspector (they reach each other through nothing else). */}\n        <PropSyncProvider>\n          <CompositionEditorShell\n            readOnly={readOnly}\n            trailingPanes={trailingPanes}\n            preservedCount={initial.preserved.length}\n          />\n        </PropSyncProvider>\n      </ReuseProvider>\n    </BuilderProvider>\n  )\n}\n\n/**\n * EC-549 interim (scope item 3, the honesty floor): a mixed sequence's typography\n * items are preserved for write-back but NOT rendered on the canvas — and a canvas\n * that silently shows half the sequence lets an editor rearrange around content\n * they cannot see. Until typography items are first-class, path-addressed canvas\n * items (EC-549's main scope), the surface must SAY what it is not showing: a\n * persistent, non-dismissible count above the canvas. Deliberately NOT the\n * dismissible overlay shape (`CanvasThemeNotice`) — this states a standing truth\n * about the VALUE, not a one-time migration hint, and it must not cover blocks.\n */\nexport function PreservedItemsNotice({ count }: { count: number }) {\n  if (count === 0) return null\n  return (\n    <Row\n      gap=\"2\"\n      align=\"center\"\n      data-testid=\"composition-preserved-notice\"\n      className=\"shrink-0 border-b border-border bg-muted/40 px-3 py-1.5\"\n    >\n      <Pilcrow aria-hidden className=\"size-3.5 shrink-0 text-muted-foreground\" />\n      <Text size=\"xs\" tone=\"muted\">\n        {translate('builder.composition.preservedNotice', { count })}\n      </Text>\n    </Row>\n  )\n}\n\n/**\n * Lifts committed edits out of the scoped store into the CMS draft. The first\n * render establishes the (container-normalized) baseline so simply opening the\n * tab never marks the document dirty; every subsequent change to the block list\n * emits the merged v2 sequence value (EC-547) — the canvas roots spliced back\n * between the preserved typography items. Cardinality (`multiple`) no longer\n * shapes the stored value: it is a validation constraint over the one envelope\n * (EC-500 D2), so the bare-object special case for `multiple: false` is gone.\n */\nfunction CompositionLift({\n  preserved,\n  onChange,\n  readOnly,\n}: {\n  preserved: readonly PreservedBlockNode[]\n  onChange: (value: unknown) => void\n  readOnly: boolean\n}) {\n  const builder = useBuilder()\n  const blocks = builder.present.slots?.[DEFAULT_SLOT] ?? EMPTY_BLOCKS\n  const onChangeRef = useRef(onChange)\n  onChangeRef.current = onChange\n  const baselineRef = useRef<readonly ComponentNode[] | null>(null)\n\n  useEffect(() => {\n    // EC-226: never lift edits out of a READ-ONLY canvas (the Published view).\n    // The canvas's keyboard listeners (clipboard paste/cut) aren't blocked by the\n    // visual `pointer-events-none`, so without this a Cmd+V could mutate the\n    // graph; refusing to lift keeps the document draft intact regardless. The\n    // editor remounts per perspective, so any transient in-canvas change is\n    // discarded on switch.\n    if (readOnly) return\n    if (baselineRef.current === null) {\n      baselineRef.current = blocks\n      return\n    }\n    if (blocks !== baselineRef.current) {\n      baselineRef.current = blocks\n      onChangeRef.current(mergeCompositionValue(blocks, preserved))\n    }\n  }, [blocks, preserved, readOnly])\n\n  return null\n}\n\nconst EMPTY_BLOCKS: readonly ComponentNode[] = []\n\n/** A breakpoint preview-width toggle (EC-211/EC-250). Switching the viewport\n * resizes only the preview frame (not an undoable edit, writes no graph command).\n * The label is the breakpoint name (`Full`/`sm`/`md`/…) with the real px width in\n * the tooltip — so the switcher reflects the site's actual screens, not a fixed\n * desktop/tablet/phone triple. */\nfunction ViewportButton({ option }: { option: ViewportOption }) {\n  const builder = useBuilder()\n  const active = builder.viewport === option.key\n  return (\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      aria-label={translate('builder.canvas.viewportPreviewAria', { label: option.label })}\n      aria-pressed={active}\n      title={\n        option.px !== undefined\n          ? `${option.label} · ${option.px}px`\n          : translate('builder.canvas.viewportWidthTitle', { label: option.label })\n      }\n      onClick={() => builder.dispatch({ type: 'viewport', viewport: option.key })}\n      className={cn('px-2 text-xs', active && 'bg-accent text-accent-foreground')}\n    >\n      {option.label}\n    </Button>\n  )\n}\n\n/** The centered breakpoint switcher (EC-250): the resolved viewport set, plus a\n * visible validation issue when a project declared breakpoints but none are usable. */\nfunction BreakpointSwitcher() {\n  const { viewports, issue } = useCanvasViewports()\n  return (\n    <Row gap=\"1\" align=\"center\">\n      <ToolbarGroup>\n        {viewports.map((v) => (\n          <ViewportButton key={v.key} option={v} />\n        ))}\n      </ToolbarGroup>\n      {issue ? (\n        <Row gap=\"1\" align=\"center\" className=\"text-amber-600 dark:text-amber-400\" title={issue}>\n          <AlertTriangle aria-hidden className=\"size-3.5\" />\n          <Text size=\"xs\">{translate('builder.canvas.breakpointsIssueLabel')}</Text>\n        </Row>\n      ) : null}\n    </Row>\n  )\n}\n\n/**\n * The slim editor surface — the canvas + layers + inspector, plus Insert and\n * undo/redo. It deliberately drops the project-builder *lifecycle* chrome\n * (publish, versions, AI, page SEO): the document owns the lifecycle, not the\n * field. It keeps spatial/preview controls — including the breakpoint\n * preview-width switcher (EC-211), a canvas concern, not a lifecycle one.\n */\nfunction CompositionEditorShell({\n  readOnly,\n  trailingPanes,\n  preservedCount = 0,\n}: {\n  readOnly: boolean\n  /** Document-level panes appended after `Properties` (EC-224). */\n  trailingPanes?: readonly InspectorPane[]\n  /** Preserved (non-component) sequence items the canvas cannot show (EC-549 interim). */\n  preservedCount?: number\n}) {\n  const builder = useBuilder()\n  const dispatch = builder.dispatch\n  // The field's top-level component vocabulary (EC-188) — the leash applied to\n  // inserts at the composition root so forbidden components aren't even offered.\n  // Read from the store's field scope (EC-554), the same value DnD and paste judge.\n  const fieldAllow = builder.field.allow\n  const [insertContext, setInsertContext] = useState<InsertContext | null>(null)\n  const [insertOpen, setInsertOpen] = useState(false)\n  const rootId = builder.present.id\n\n  // The canvas SUPPLIES the `Properties` pane (EC-224); the document editor\n  // appends its own (`Versions`). Properties dims under read-only just as the\n  // whole inspector column used to — but the appended panes stay interactive.\n  const propertiesPane = useMemo<InspectorPane>(\n    () => ({\n      id: 'properties',\n      label: translate('builder.inspector.propertiesPane'),\n      icon: <SlidersHorizontal className=\"size-3.5\" />,\n      render: () => (\n        <div className={cn('h-full min-h-0 overflow-hidden', readOnly && 'pointer-events-none opacity-60')}>\n          <PropertyInspector />\n        </div>\n      ),\n    }),\n    [readOnly],\n  )\n  const panes = useMemo<InspectorPane[]>(\n    () => [propertiesPane, ...(trailingPanes ?? [])],\n    [propertiesPane, trailingPanes],\n  )\n\n  // The single insert entry point for BOTH the toolbar and the page tree's\n  // \"Add child\" (EC-383). It selects its target first so `builder.selectedId`\n  // is the one source of truth for where an insert lands: the toolbar resolves\n  // `builder.selectedId ?? rootId` while Add-child passes an explicit row, and\n  // without this sync clicking Add-child (which otherwise leaves selection put)\n  // could target a different node than the toolbar — surfacing as a mismatched\n  // (even empty \"No allowed components match\") insert dialog. Both now resolve\n  // the identical target + allow set for the same selection.\n  function openInsert(nodeId: string) {\n    const ctx = resolveInsertContext(builder, nodeId, fieldAllow)\n    if (!ctx) return\n    if (nodeId !== builder.selectedId) dispatch({ type: 'select', id: nodeId })\n    setInsertContext(ctx)\n    setInsertOpen(true)\n  }\n\n  // EC-405: the in-canvas \"+\" affordances resolve the SAME slot rules through the\n  // shared position-carrying insert-context resolution, and open the panel at the\n  // clicked edge (an explicit position that survives to the insertion, rather than\n  // the panel re-deriving it from the selection). Re-memoized on every store change\n  // so the closures read the live graph.\n  const affordanceApi = useMemo<InsertAffordanceApi>(\n    () => ({\n      positionsFor: (nodeId: string) => insertablePositions(builder, nodeId, fieldAllow),\n      openAt: (nodeId: string, position: InsertPosition) => {\n        const ctx = resolveInsertContextAt(builder, nodeId, position, fieldAllow)\n        if (!ctx) return\n        if (nodeId !== builder.selectedId) dispatch({ type: 'select', id: nodeId })\n        setInsertContext(ctx)\n        setInsertOpen(true)\n      },\n    }),\n    [builder, fieldAllow, dispatch],\n  )\n\n  return (\n    <InsertAffordanceProvider value={affordanceApi}>\n      <div className=\"flex h-full min-h-0 flex-col\">\n        <div className=\"shrink-0 border-b border-border\">\n          <Toolbar>\n            <ToolbarGroup>\n              <Button\n                size=\"icon-sm\"\n                variant=\"ghost\"\n                aria-label={translate('builder.canvas.undo')}\n                title={translate('builder.canvas.undo')}\n                disabled={readOnly || !builder.canUndo}\n                onClick={() => dispatch({ type: 'undo' })}\n              >\n                <Undo2 />\n              </Button>\n              <Button\n                size=\"icon-sm\"\n                variant=\"ghost\"\n                aria-label={translate('builder.canvas.redo')}\n                title={translate('builder.canvas.redo')}\n                disabled={readOnly || !builder.canRedo}\n                onClick={() => dispatch({ type: 'redo' })}\n              >\n                <Redo2 />\n              </Button>\n            </ToolbarGroup>\n            <ToolbarSeparator />\n            <Button\n              size=\"sm\"\n              variant=\"ghost\"\n              disabled={readOnly}\n              onClick={() => openInsert(builder.selectedId ?? rootId)}\n            >\n              <Plus /> {translate('builder.canvas.insert')}\n            </Button>\n            {/* Breakpoint preview-width switcher (EC-211/EC-250), centered over the\n              canvas via flanking spacers. A preview control, not an edit — stays\n              active even in read-only published preview. */}\n            <Spacer />\n            <BreakpointSwitcher />\n            <Spacer />\n          </Toolbar>\n        </div>\n\n        <div className=\"grid min-h-0 flex-1 grid-cols-[minmax(200px,240px)_1fr_minmax(280px,320px)] gap-px bg-border\">\n          <Panel className={cn('rounded-none border-0', readOnly && 'pointer-events-none opacity-60')}>\n            <PageTree onAddChild={openInsert} />\n          </Panel>\n          <div className={cn('flex min-h-0 flex-col bg-background', readOnly && 'pointer-events-none opacity-60')}>\n            <PreservedItemsNotice count={preservedCount} />\n            {/* EC-300/AD-16: the read-only Published view resolves references against\n              the published perspective (honest preview); the editable Draft view\n              resolves drafts (a just-made reusable shows immediately). */}\n            <BuilderCanvas perspective={readOnly ? 'published' : 'draft'} />\n          </div>\n          <InspectorSidebar panes={panes} />\n        </div>\n\n        <InsertMenu context={insertContext} open={insertOpen} onOpenChange={setInsertOpen} />\n      </div>\n    </InsertAffordanceProvider>\n  )\n}\n"]}
+{"version":3,"file":"composition-field-editor.js","sourceRoot":"","sources":["../../../src/components/builder/composition-field-editor.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useEffect, useMemo, useRef, useState } from 'react'\nimport { AlertTriangle, Pilcrow, Plus, Redo2, SlidersHorizontal, Undo2 } from 'lucide-react'\nimport { DEFAULT_SLOT, mergeBlockRoots, splitBlockRoots } from '@elytracms/core/project-graph'\nimport type { ComponentNode, PreservedSequenceItem, SplitBlockRoots } from '@elytracms/core/project-graph'\nimport type { BlocksFieldDef } from '@elytracms/core/cms-core'\nimport type { ComponentRegistry } from '@elytracms/core/component-registry'\nimport type { BlockNode, BlockSequenceValue } from '@elytracms/core/rich-text'\nimport { Button, Panel, Row, Spacer, Text, Toolbar, ToolbarGroup, ToolbarSeparator } from '@elytracms/studio/ui'\nimport { cn } from '@elytracms/studio/lib/utils'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport type { MessageKey } from '@elytracms/studio/lib/i18n'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { BuilderProvider, useBuilder } from './builder-store'\nimport type { CompositionFieldScope } from './builder-store'\nimport { useCanvasViewports } from './canvas-breakpoints'\nimport type { ViewportOption } from './canvas-breakpoints'\nimport { BuilderCanvas } from './canvas'\nimport { PageTree } from './page-tree'\nimport { PropertyInspector } from './property-inspector'\nimport { InspectorSidebar } from '../inspector/inspector-sidebar'\nimport type { InspectorPane } from '../inspector/inspector-sidebar'\nimport { InsertMenu } from './insert-menu'\nimport type { InsertContext } from './insert-menu'\nimport { insertablePositions, resolveInsertContext, resolveInsertContextAt } from './insert-context'\nimport type { InsertPosition } from './insert-context'\nimport { InsertAffordanceProvider } from './insert-affordance-context'\nimport type { InsertAffordanceApi } from './insert-affordance-context'\nimport { PropSyncProvider } from './prop-sync-context'\nimport { ReuseProvider } from './reuse-context'\nimport { fieldLabel } from '../cms/cms-labels'\n\n/**\n * EC-188 — the block-field surface: one canvas engine mounted on a composition\n * **field value** (AD-12), not the project graph.\n *\n * The composition tree is wrapped in a synthetic single-page graph and edited by\n * a SCOPED `BuilderProvider` with **no `projectId`** (so the graph persister is a\n * no-op — builder-store.tsx). Every committed edit is lifted out via `onChange`\n * into the CMS document draft; the document's own Save persists it (the tree is\n * stored as document data, `v.any()`).\n *\n * EC-547 (EC-500 D1–D3): the stored value is the converged v2 block sequence\n * `{ version: 2, content: BlockNode[] }`. The canvas edits the sequence's\n * `elytra/component` nodes; typography nodes survive the session byte-for-byte\n * and keep their order relative to components on write-back (see\n * {@link splitCompositionValue} / {@link mergeCompositionValue}). Legacy bare\n * node/array values are still ACCEPTED on read during the staging window, but\n * every write emits v2. This reuses the real canvas + inspector +\n * blocks panel unchanged — the same EC-158–164 mechanics — without touching the\n * project-wide builder store. Surfaced on a dedicated \"Canvas\" fieldset tab in\n * the CMS detail editor so the page builder gets full screen real estate rather\n * than being crammed into the field list.\n */\n\nconst SYNTH_ROOT_ID = 'composition.root'\n\n/**\n * A sequence item the canvas does not natively edit (EC-547 / EC-500 D3):\n * typography nodes, unknown/future node kinds, even entries the v2 schema would\n * reject — the editor is not a validator, so they are carried BYTE-FOR-BYTE and\n * re-merged on write-back rather than parsed, rewritten, or dropped.\n * `componentPrefix` records how many component nodes preceded the item in the\n * original sequence — the anchor {@link mergeCompositionValue} splices by.\n */\nexport type PreservedBlockNode = PreservedSequenceItem<BlockNode>\n\n/** A field value split for canvas editing: component roots + everything else. */\nexport type SplitCompositionValue = SplitBlockRoots<BlockNode>\n\n/**\n * Split a stored blocks-field value into the component nodes the canvas edits\n * and the sequence items it must preserve (EC-547, the EC-500 round-trip law:\n * a projection may only rewrite nodes it natively edits). Typography items are\n * deliberately NOT surfaced as editable canvas blocks in v1 (EC-500 D3) — they\n * survive the editing session and keep their order on write-back.\n *\n * EC-576: the logic is core's {@link splitBlockRoots} — the ONE reader every\n * blocks writer shares. This is the canvas's typed view of it: project-graph\n * sits below rich-text and cannot name {@link BlockNode}, so the carried items\n * arrive `unknown`; they are typed here, not checked (preservation over parsing).\n */\nexport function splitCompositionValue(value: unknown): SplitCompositionValue {\n  return splitBlockRoots(value) as SplitCompositionValue\n}\n\n/**\n * Merge canvas-edited component roots back into the stored sequence (EC-547).\n * The merge rule — preserved items anchored to their ordinal position between\n * components, every root tagged, the write always v2 — is core's\n * {@link mergeBlockRoots} (EC-576: the same merge every blocks writer goes\n * through, via `editBlockRoots`). Typed here as the rich-text value.\n */\nexport function mergeCompositionValue(\n  roots: readonly ComponentNode[],\n  preserved: readonly PreservedBlockNode[],\n): BlockSequenceValue {\n  return mergeBlockRoots(roots, preserved)\n}\n\n/**\n * The field scope the editor's store carries (EC-554): the field's label (named\n * by refusal notices) and its top-level `allow`, passed through verbatim — an\n * omitted `allow` stays `undefined` (EC-544: any registered component).\n */\nexport function compositionFieldScope(field: BlocksFieldDef): CompositionFieldScope {\n  return { label: fieldLabel(field), allow: field.allow }\n}\n\n/**\n * Wrap the field value's component roots in a synthetic root container (EC-287).\n * The builder store edits this single root-bearing composition directly; its\n * children are the field's component blocks, lifted back out via `onChange`.\n * EC-591: the root is the component that fills the `layout.stack` role — the\n * project's own, from its component list — never a hardcoded engine id.\n */\nfunction buildSyntheticRoot(roots: readonly ComponentNode[], stackComponentId: string): ComponentNode {\n  return {\n    id: SYNTH_ROOT_ID,\n    componentId: stackComponentId,\n    slots: { [DEFAULT_SLOT]: [...roots] },\n  }\n}\n\n/**\n * The canvas notices for roles nobody in the component list fills (EC-591) — each\n * names the gesture that is OFF because of it, so a missing role is visible, never\n * a silent dead affordance. Only gestures the canvas actually has are listed: the\n * `layout.stack` role is the canvas itself (see {@link CompositionFieldEditor}),\n * `layout.grid` the wrap-beside gesture, `text` the seeded layout presets.\n * (`richText` — the typography projection, EC-549 — and `image` — asset drop —\n * have no canvas gesture yet, so there is nothing to switch off.) Pure.\n */\nexport function canvasRoleNotices(registry: ComponentRegistry): MessageKey[] {\n  const notices: MessageKey[] = []\n  if (!registry.roleComponent('layout.grid')) notices.push('builder.roles.noGrid')\n  if (!registry.roleComponent('text')) notices.push('builder.roles.noText')\n  return notices\n}\n\n/** The role notices above the canvas (EC-591) — a standing truth about the component list. */\nexport function CanvasRoleNotices({ notices }: { notices: readonly MessageKey[] }) {\n  if (notices.length === 0) return null\n  return (\n    <div data-testid=\"canvas-role-notices\" className=\"shrink-0 border-b border-border bg-muted/40\">\n      {notices.map((key) => (\n        <Row key={key} gap=\"2\" align=\"center\" className=\"px-3 py-1.5\">\n          <AlertTriangle aria-hidden className=\"size-3.5 shrink-0 text-muted-foreground\" />\n          <Text size=\"xs\" tone=\"muted\">\n            {translate(key)}\n          </Text>\n        </Row>\n      ))}\n    </div>\n  )\n}\n\n/**\n * The canvas in place of the editor when nobody fills `layout.stack` (EC-591): the\n * blocks of a composition field compose inside that component, so there is no\n * canvas without it. The value is not touched — nothing mounts that could write.\n */\nexport function NoStackCanvasNotice() {\n  return (\n    <Panel data-testid=\"canvas-no-stack\" className=\"flex h-full min-h-0 items-center justify-center p-6\">\n      <Row gap=\"2\" align=\"center\" className=\"max-w-prose\">\n        <AlertTriangle aria-hidden className=\"size-4 shrink-0 text-muted-foreground\" />\n        <Text size=\"sm\" tone=\"muted\">\n          {translate('builder.roles.noStack')}\n        </Text>\n      </Row>\n    </Panel>\n  )\n}\n\nexport function CompositionFieldEditor({\n  field,\n  value,\n  onChange,\n  readOnly,\n  trailingPanes,\n}: {\n  field: BlocksFieldDef\n  value: unknown\n  onChange: (value: unknown) => void\n  readOnly: boolean\n  /** Inspector panes the document editor appends after the canvas-supplied\n   *  `Properties` pane (EC-224 — the frame-owned `Versions` pane). */\n  trailingPanes?: readonly InspectorPane[]\n}) {\n  // Split the value ONCE at mount (EC-547): component nodes become the canvas\n  // roots; every other sequence item is preserved aside for write-back. The\n  // editor is uncontrolled thereafter — it is the source of truth while open and\n  // lifts changes out via onChange; re-opening the tab remounts from the current\n  // draft. (BuilderProvider reads `composition` only in its lazy initial state,\n  // so later prop changes are ignored regardless.)\n  const initial = useMemo(() => splitCompositionValue(value), [])\n  // EC-591: the roles come from the project's component list (the registry).\n  const registry = getStudioRegistry().registry\n  const stack = registry.roleComponent('layout.stack')\n  const layout = registry.layout\n  const notices = useMemo(() => canvasRoleNotices(registry), [registry])\n  const initialRoot = useMemo(\n    () => (stack ? buildSyntheticRoot(initial.roots, stack.id) : null),\n    [initial, stack],\n  )\n  // EC-554: the field's `allow` travels WITH the store, so every placement\n  // surface (canvas + tree DnD, paste, the insert offer) judges the same value.\n  const fieldScope = useMemo(() => compositionFieldScope(field), [field])\n\n  if (!initialRoot) return <NoStackCanvasNotice />\n\n  return (\n    <BuilderProvider composition={initialRoot} field={fieldScope} layout={layout}>\n      <CompositionLift preserved={initial.preserved} onChange={onChange} readOnly={readOnly} />\n      <ReuseProvider>\n        {/* EC-408: the field↔component selection-sync channel wraps BOTH the canvas\n            and the inspector (they reach each other through nothing else). */}\n        <PropSyncProvider>\n          <CompositionEditorShell\n            readOnly={readOnly}\n            trailingPanes={trailingPanes}\n            preservedCount={initial.preserved.length}\n            roleNotices={notices}\n          />\n        </PropSyncProvider>\n      </ReuseProvider>\n    </BuilderProvider>\n  )\n}\n\n/**\n * EC-549 interim (scope item 3, the honesty floor): a mixed sequence's typography\n * items are preserved for write-back but NOT rendered on the canvas — and a canvas\n * that silently shows half the sequence lets an editor rearrange around content\n * they cannot see. Until typography items are first-class, path-addressed canvas\n * items (EC-549's main scope), the surface must SAY what it is not showing: a\n * persistent, non-dismissible count above the canvas. Deliberately NOT the\n * dismissible overlay shape (`CanvasThemeNotice`) — this states a standing truth\n * about the VALUE, not a one-time migration hint, and it must not cover blocks.\n */\nexport function PreservedItemsNotice({ count }: { count: number }) {\n  if (count === 0) return null\n  return (\n    <Row\n      gap=\"2\"\n      align=\"center\"\n      data-testid=\"composition-preserved-notice\"\n      className=\"shrink-0 border-b border-border bg-muted/40 px-3 py-1.5\"\n    >\n      <Pilcrow aria-hidden className=\"size-3.5 shrink-0 text-muted-foreground\" />\n      <Text size=\"xs\" tone=\"muted\">\n        {translate('builder.composition.preservedNotice', { count })}\n      </Text>\n    </Row>\n  )\n}\n\n/**\n * Lifts committed edits out of the scoped store into the CMS draft. The first\n * render establishes the (container-normalized) baseline so simply opening the\n * tab never marks the document dirty; every subsequent change to the block list\n * emits the merged v2 sequence value (EC-547) — the canvas roots spliced back\n * between the preserved typography items. Cardinality (`multiple`) no longer\n * shapes the stored value: it is a validation constraint over the one envelope\n * (EC-500 D2), so the bare-object special case for `multiple: false` is gone.\n */\nfunction CompositionLift({\n  preserved,\n  onChange,\n  readOnly,\n}: {\n  preserved: readonly PreservedBlockNode[]\n  onChange: (value: unknown) => void\n  readOnly: boolean\n}) {\n  const builder = useBuilder()\n  const blocks = builder.present.slots?.[DEFAULT_SLOT] ?? EMPTY_BLOCKS\n  const onChangeRef = useRef(onChange)\n  onChangeRef.current = onChange\n  const baselineRef = useRef<readonly ComponentNode[] | null>(null)\n\n  useEffect(() => {\n    // EC-226: never lift edits out of a READ-ONLY canvas (the Published view).\n    // The canvas's keyboard listeners (clipboard paste/cut) aren't blocked by the\n    // visual `pointer-events-none`, so without this a Cmd+V could mutate the\n    // graph; refusing to lift keeps the document draft intact regardless. The\n    // editor remounts per perspective, so any transient in-canvas change is\n    // discarded on switch.\n    if (readOnly) return\n    if (baselineRef.current === null) {\n      baselineRef.current = blocks\n      return\n    }\n    if (blocks !== baselineRef.current) {\n      baselineRef.current = blocks\n      onChangeRef.current(mergeCompositionValue(blocks, preserved))\n    }\n  }, [blocks, preserved, readOnly])\n\n  return null\n}\n\nconst EMPTY_BLOCKS: readonly ComponentNode[] = []\n\n/** A breakpoint preview-width toggle (EC-211/EC-250). Switching the viewport\n * resizes only the preview frame (not an undoable edit, writes no graph command).\n * The label is the breakpoint name (`Full`/`sm`/`md`/…) with the real px width in\n * the tooltip — so the switcher reflects the site's actual screens, not a fixed\n * desktop/tablet/phone triple. */\nfunction ViewportButton({ option }: { option: ViewportOption }) {\n  const builder = useBuilder()\n  const active = builder.viewport === option.key\n  return (\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      aria-label={translate('builder.canvas.viewportPreviewAria', { label: option.label })}\n      aria-pressed={active}\n      title={\n        option.px !== undefined\n          ? `${option.label} · ${option.px}px`\n          : translate('builder.canvas.viewportWidthTitle', { label: option.label })\n      }\n      onClick={() => builder.dispatch({ type: 'viewport', viewport: option.key })}\n      className={cn('px-2 text-xs', active && 'bg-accent text-accent-foreground')}\n    >\n      {option.label}\n    </Button>\n  )\n}\n\n/** The centered breakpoint switcher (EC-250): the resolved viewport set, plus a\n * visible validation issue when a project declared breakpoints but none are usable. */\nfunction BreakpointSwitcher() {\n  const { viewports, issue } = useCanvasViewports()\n  return (\n    <Row gap=\"1\" align=\"center\">\n      <ToolbarGroup>\n        {viewports.map((v) => (\n          <ViewportButton key={v.key} option={v} />\n        ))}\n      </ToolbarGroup>\n      {issue ? (\n        <Row gap=\"1\" align=\"center\" className=\"text-amber-600 dark:text-amber-400\" title={issue}>\n          <AlertTriangle aria-hidden className=\"size-3.5\" />\n          <Text size=\"xs\">{translate('builder.canvas.breakpointsIssueLabel')}</Text>\n        </Row>\n      ) : null}\n    </Row>\n  )\n}\n\n/**\n * The slim editor surface — the canvas + layers + inspector, plus Insert and\n * undo/redo. It deliberately drops the project-builder *lifecycle* chrome\n * (publish, versions, AI, page SEO): the document owns the lifecycle, not the\n * field. It keeps spatial/preview controls — including the breakpoint\n * preview-width switcher (EC-211), a canvas concern, not a lifecycle one.\n */\nfunction CompositionEditorShell({\n  readOnly,\n  trailingPanes,\n  preservedCount = 0,\n  roleNotices,\n}: {\n  readOnly: boolean\n  /** Document-level panes appended after `Properties` (EC-224). */\n  trailingPanes?: readonly InspectorPane[]\n  /** Preserved (non-component) sequence items the canvas cannot show (EC-549 interim). */\n  preservedCount?: number\n  /** Notices for the roles nobody fills (EC-591) — see {@link canvasRoleNotices}. */\n  roleNotices?: readonly MessageKey[]\n}) {\n  const builder = useBuilder()\n  const dispatch = builder.dispatch\n  // The field's top-level component vocabulary (EC-188) — the leash applied to\n  // inserts at the composition root so forbidden components aren't even offered.\n  // Read from the store's field scope (EC-554), the same value DnD and paste judge.\n  const fieldAllow = builder.field.allow\n  const [insertContext, setInsertContext] = useState<InsertContext | null>(null)\n  const [insertOpen, setInsertOpen] = useState(false)\n  const rootId = builder.present.id\n\n  // The canvas SUPPLIES the `Properties` pane (EC-224); the document editor\n  // appends its own (`Versions`). Properties dims under read-only just as the\n  // whole inspector column used to — but the appended panes stay interactive.\n  const propertiesPane = useMemo<InspectorPane>(\n    () => ({\n      id: 'properties',\n      label: translate('builder.inspector.propertiesPane'),\n      icon: <SlidersHorizontal className=\"size-3.5\" />,\n      render: () => (\n        <div className={cn('h-full min-h-0 overflow-hidden', readOnly && 'pointer-events-none opacity-60')}>\n          <PropertyInspector />\n        </div>\n      ),\n    }),\n    [readOnly],\n  )\n  const panes = useMemo<InspectorPane[]>(\n    () => [propertiesPane, ...(trailingPanes ?? [])],\n    [propertiesPane, trailingPanes],\n  )\n\n  // The single insert entry point for BOTH the toolbar and the page tree's\n  // \"Add child\" (EC-383). It selects its target first so `builder.selectedId`\n  // is the one source of truth for where an insert lands: the toolbar resolves\n  // `builder.selectedId ?? rootId` while Add-child passes an explicit row, and\n  // without this sync clicking Add-child (which otherwise leaves selection put)\n  // could target a different node than the toolbar — surfacing as a mismatched\n  // (even empty \"No allowed components match\") insert dialog. Both now resolve\n  // the identical target + allow set for the same selection.\n  function openInsert(nodeId: string) {\n    const ctx = resolveInsertContext(builder, nodeId, fieldAllow)\n    if (!ctx) return\n    if (nodeId !== builder.selectedId) dispatch({ type: 'select', id: nodeId })\n    setInsertContext(ctx)\n    setInsertOpen(true)\n  }\n\n  // EC-405: the in-canvas \"+\" affordances resolve the SAME slot rules through the\n  // shared position-carrying insert-context resolution, and open the panel at the\n  // clicked edge (an explicit position that survives to the insertion, rather than\n  // the panel re-deriving it from the selection). Re-memoized on every store change\n  // so the closures read the live graph.\n  const affordanceApi = useMemo<InsertAffordanceApi>(\n    () => ({\n      positionsFor: (nodeId: string) => insertablePositions(builder, nodeId, fieldAllow),\n      openAt: (nodeId: string, position: InsertPosition) => {\n        const ctx = resolveInsertContextAt(builder, nodeId, position, fieldAllow)\n        if (!ctx) return\n        if (nodeId !== builder.selectedId) dispatch({ type: 'select', id: nodeId })\n        setInsertContext(ctx)\n        setInsertOpen(true)\n      },\n    }),\n    [builder, fieldAllow, dispatch],\n  )\n\n  return (\n    <InsertAffordanceProvider value={affordanceApi}>\n      <div className=\"flex h-full min-h-0 flex-col\">\n        <div className=\"shrink-0 border-b border-border\">\n          <Toolbar>\n            <ToolbarGroup>\n              <Button\n                size=\"icon-sm\"\n                variant=\"ghost\"\n                aria-label={translate('builder.canvas.undo')}\n                title={translate('builder.canvas.undo')}\n                disabled={readOnly || !builder.canUndo}\n                onClick={() => dispatch({ type: 'undo' })}\n              >\n                <Undo2 />\n              </Button>\n              <Button\n                size=\"icon-sm\"\n                variant=\"ghost\"\n                aria-label={translate('builder.canvas.redo')}\n                title={translate('builder.canvas.redo')}\n                disabled={readOnly || !builder.canRedo}\n                onClick={() => dispatch({ type: 'redo' })}\n              >\n                <Redo2 />\n              </Button>\n            </ToolbarGroup>\n            <ToolbarSeparator />\n            <Button\n              size=\"sm\"\n              variant=\"ghost\"\n              disabled={readOnly}\n              onClick={() => openInsert(builder.selectedId ?? rootId)}\n            >\n              <Plus /> {translate('builder.canvas.insert')}\n            </Button>\n            {/* Breakpoint preview-width switcher (EC-211/EC-250), centered over the\n              canvas via flanking spacers. A preview control, not an edit — stays\n              active even in read-only published preview. */}\n            <Spacer />\n            <BreakpointSwitcher />\n            <Spacer />\n          </Toolbar>\n        </div>\n\n        <div className=\"grid min-h-0 flex-1 grid-cols-[minmax(200px,240px)_1fr_minmax(280px,320px)] gap-px bg-border\">\n          <Panel className={cn('rounded-none border-0', readOnly && 'pointer-events-none opacity-60')}>\n            <PageTree onAddChild={openInsert} />\n          </Panel>\n          <div className={cn('flex min-h-0 flex-col bg-background', readOnly && 'pointer-events-none opacity-60')}>\n            <PreservedItemsNotice count={preservedCount} />\n            <CanvasRoleNotices notices={roleNotices ?? []} />\n            {/* EC-300/AD-16: the read-only Published view resolves references against\n              the published perspective (honest preview); the editable Draft view\n              resolves drafts (a just-made reusable shows immediately). */}\n            <BuilderCanvas perspective={readOnly ? 'published' : 'draft'} />\n          </div>\n          <InspectorSidebar panes={panes} />\n        </div>\n\n        <InsertMenu context={insertContext} open={insertOpen} onOpenChange={setInsertOpen} />\n      </div>\n    </InsertAffordanceProvider>\n  )\n}\n"]}

package/dist/components/builder/inline-edit.d.ts

@@ -63,21 +63,24 @@ export interface InlineEditableProp {
 /**
  * Resolve which prop of `node` an inline-edit gesture should target: the
  * first manifest prop flagged `inlineEditable` whose *current* value is a
- * plain static string (or unset with a string default). Bound props and
- * non-string values are never inline-editable — they stay inspector-only.
+ * plain static string, or that is unset and `text`-typed — an unset prop starts
+ * EMPTY (EC-591/2f: absent is `undefined`; the manifest `default` is a hint, never
+ * the value being edited). Bound props and non-string values are never
+ * inline-editable — they stay inspector-only.
  */
 export declare function resolveInlineEditableProp(manifest: ComponentManifest | undefined, node: ComponentNode): InlineEditableProp | null;
 /** A node prop carrying rich-text content that can be edited in place now. */
 export interface InlineRichTextProp {
     propName: string;
-    /** The current stored value (or the manifest default when unset). */
+    /** The current stored value (an empty document when unset — EC-591/2f). */
     value: RichTextValue;
 }
 /**
  * Resolve which rich-text prop of `node` an inline-edit gesture should
  * target: the first manifest prop flagged `inlineEditable` whose inspector
  * control is `richtext` and whose *current* value is a static, schema-valid
- * rich-text value (or unset with a valid rich-text default). Bound props are
+ * rich-text value, or that is unset — then the session starts from an EMPTY
+ * document (EC-591/2f: never the manifest `default`, a hint only). Bound props are
  * never inline-editable — translating/bound content stays inspector- and
  * CMS-owned, exactly like EC-158's plain-text rule.
  */

package/dist/components/builder/inline-edit.js

@@ -29,8 +29,10 @@ export function createInlineEditSession(args) {
 /**
  * Resolve which prop of `node` an inline-edit gesture should target: the
  * first manifest prop flagged `inlineEditable` whose *current* value is a
- * plain static string (or unset with a string default). Bound props and
- * non-string values are never inline-editable — they stay inspector-only.
+ * plain static string, or that is unset and `text`-typed — an unset prop starts
+ * EMPTY (EC-591/2f: absent is `undefined`; the manifest `default` is a hint, never
+ * the value being edited). Bound props and non-string values are never
+ * inline-editable — they stay inspector-only.
  */
 export function resolveInlineEditableProp(manifest, node) {
     if (!manifest)
@@ -38,9 +40,8 @@ export function resolveInlineEditableProp(manifest, node) {
     for (const propName of inlineEditablePropNames(manifest)) {
         const current = node.props?.[propName];
         if (current === undefined) {
-            const fallback = manifest.props[propName]?.default;
-            if (typeof fallback === 'string')
-                return { propName, value: fallback };
+            if (manifest.props[propName]?.type === 'text')
+                return { propName, value: '' };
             continue;
         }
         if (isStaticProp(current) && typeof current.value === 'string') {
@@ -53,7 +54,8 @@ export function resolveInlineEditableProp(manifest, node) {
  * Resolve which rich-text prop of `node` an inline-edit gesture should
  * target: the first manifest prop flagged `inlineEditable` whose inspector
  * control is `richtext` and whose *current* value is a static, schema-valid
- * rich-text value (or unset with a valid rich-text default). Bound props are
+ * rich-text value, or that is unset — then the session starts from an EMPTY
+ * document (EC-591/2f: never the manifest `default`, a hint only). Bound props are
  * never inline-editable — translating/bound content stays inspector- and
  * CMS-owned, exactly like EC-158's plain-text rule.
  */
@@ -65,15 +67,16 @@ export function resolveInlineRichTextProp(manifest, node) {
         if (manifest.props[propName]?.type !== 'richText')
             continue;
         const current = node.props?.[propName];
-        const raw = current === undefined ? manifest.props[propName]?.default : undefined;
         if (current !== undefined && !isStaticProp(current))
             continue;
-        const parsed = parseRichTextValue(isStaticProp(current) ? current.value : raw);
+        const parsed = parseRichTextValue(isStaticProp(current) ? current.value : EMPTY_RICH_TEXT);
         if (parsed.ok)
             return { propName, value: parsed.value };
     }
     return null;
 }
+/** The document an unset rich-text prop starts its inline session from (EC-591/2f). */
+const EMPTY_RICH_TEXT = { version: 2, content: [{ type: 'paragraph' }] };
 /**
  * One rich-text editing session (EC-159), with EC-158's one-finish guarantee:
  * the first `commit()`/`cancel()` wins and every later call is inert, so

package/dist/components/builder/inline-edit.js.map

@@ -1 +1 @@
-{"version":3,"file":"inline-edit.js","sourceRoot":"","sources":["../../../src/components/builder/inline-edit.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ComponentManifest } from '@elytracms/core/component-registry'\nimport { inlineEditablePropNames } from '@elytracms/core/component-registry'\nimport { isStaticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { parseRichTextValue, richTextDocsEquivalent } from '@elytracms/core/rich-text'\nimport type { BlockNode, RichTextDoc, RichTextNode, RichTextValue } from '@elytracms/core/rich-text'\n\n/**\n * Inline text editing on the canvas (EC-158) — framework-free core.\n *\n * The canvas wires DOM events (dblclick/keydown/blur) to this module; the\n * module owns the editing-session state machine and the\n * one-gesture-one-command guarantee. A session finishes exactly once: the\n * first `commit()`/`cancel()` wins and every later call returns `null`, so\n * overlapping DOM signals (Enter immediately followed by blur, blur racing a\n * teardown) can never dispatch a second operations command or stack a second\n * undo step.\n *\n * Locale semantics (EC-176): inline editing targets STATIC graph props only,\n * and static graph props are locale-independent by design — the canonical\n * graph stores one value per prop, not per-locale variants. Bound props are\n * never inline-editable (below), so fallback-shown BOUND text on the canvas\n * cannot be edited in place either: translating localized content happens in\n * the CMS surfaces, where the active-locale variant is created explicitly.\n * Nothing here needs the ambient locale.\n */\n\n/** The single graph mutation a finished session may produce. */\nexport interface InlineEditCommit {\n  kind: 'commit'\n  nodeId: string\n  propName: string\n  /** The edited text to write as the prop's static value. */\n  value: string\n}\n\n/** A cancelled session: restore this text on the DOM, dispatch nothing. */\nexport interface InlineEditCancel {\n  kind: 'cancel'\n  /** The original rendered value to restore. */\n  value: string\n}\n\nexport interface InlineEditSession {\n  readonly nodeId: string\n  readonly propName: string\n  readonly original: string\n  /** False once the session committed or cancelled. */\n  readonly active: boolean\n  /**\n   * Finish by committing `text`. Returns the one commit outcome, or `null`\n   * when the session already finished or the text is unchanged (an unchanged\n   * commit finishes the session but dispatches nothing — graph untouched).\n   */\n  commit(text: string): InlineEditCommit | null\n  /** Finish by cancelling. Returns the restore outcome once, then `null`. */\n  cancel(): InlineEditCancel | null\n}\n\nexport function createInlineEditSession(args: {\n  nodeId: string\n  propName: string\n  original: string\n}): InlineEditSession {\n  let active = true\n  return {\n    nodeId: args.nodeId,\n    propName: args.propName,\n    original: args.original,\n    get active() {\n      return active\n    },\n    commit(text: string): InlineEditCommit | null {\n      if (!active) return null\n      active = false\n      if (text === args.original) return null\n      return { kind: 'commit', nodeId: args.nodeId, propName: args.propName, value: text }\n    },\n    cancel(): InlineEditCancel | null {\n      if (!active) return null\n      active = false\n      return { kind: 'cancel', value: args.original }\n    },\n  }\n}\n\n/** A node prop that can be edited in place right now. */\nexport interface InlineEditableProp {\n  propName: string\n  /** The current static string value (or string default when unset). */\n  value: string\n}\n\n/**\n * Resolve which prop of `node` an inline-edit gesture should target: the\n * first manifest prop flagged `inlineEditable` whose *current* value is a\n * plain static string (or unset with a string default). Bound props and\n * non-string values are never inline-editable — they stay inspector-only.\n */\nexport function resolveInlineEditableProp(\n  manifest: ComponentManifest | undefined,\n  node: ComponentNode,\n): InlineEditableProp | null {\n  if (!manifest) return null\n  for (const propName of inlineEditablePropNames(manifest)) {\n    const current = node.props?.[propName]\n    if (current === undefined) {\n      const fallback = manifest.props[propName]?.default\n      if (typeof fallback === 'string') return { propName, value: fallback }\n      continue\n    }\n    if (isStaticProp(current) && typeof current.value === 'string') {\n      return { propName, value: current.value }\n    }\n  }\n  return null\n}\n\n// ---------------------------------------------------------------------------\n// Rich-text inline editing (EC-159) — the same session contract over the\n// `@elytracms/core/rich-text` storage format.\n// ---------------------------------------------------------------------------\n\n/** A node prop carrying rich-text content that can be edited in place now. */\nexport interface InlineRichTextProp {\n  propName: string\n  /** The current stored value (or the manifest default when unset). */\n  value: RichTextValue\n}\n\n/**\n * Resolve which rich-text prop of `node` an inline-edit gesture should\n * target: the first manifest prop flagged `inlineEditable` whose inspector\n * control is `richtext` and whose *current* value is a static, schema-valid\n * rich-text value (or unset with a valid rich-text default). Bound props are\n * never inline-editable — translating/bound content stays inspector- and\n * CMS-owned, exactly like EC-158's plain-text rule.\n */\nexport function resolveInlineRichTextProp(\n  manifest: ComponentManifest | undefined,\n  node: ComponentNode,\n): InlineRichTextProp | null {\n  if (!manifest) return null\n  for (const propName of inlineEditablePropNames(manifest)) {\n    // EC-190: a rich-text prop is the `richText` field-def type (was control.kind 'richtext').\n    if (manifest.props[propName]?.type !== 'richText') continue\n    const current = node.props?.[propName]\n    const raw = current === undefined ? manifest.props[propName]?.default : undefined\n    if (current !== undefined && !isStaticProp(current)) continue\n    const parsed = parseRichTextValue(isStaticProp(current) ? current.value : raw)\n    if (parsed.ok) return { propName, value: parsed.value }\n  }\n  return null\n}\n\n/** The single graph mutation a finished rich-text session may produce. */\nexport interface InlineRichTextCommit {\n  kind: 'commit'\n  nodeId: string\n  propName: string\n  /** The edited content to write as the prop's static value. */\n  value: RichTextValue\n}\n\nexport interface InlineRichTextSession {\n  readonly nodeId: string\n  readonly propName: string\n  readonly original: RichTextValue\n  /** False once the session committed or cancelled. */\n  readonly active: boolean\n  /**\n   * Finish by committing the parsed-back document. Returns the one commit\n   * outcome, or `null` when the session already finished or the document is\n   * equivalent to the original. An equivalent commit finishes the session and\n   * dispatches nothing — the stored value is never rewritten, so untouched\n   * content round-trips byte-identical.\n   */\n  commit(doc: RichTextDoc): InlineRichTextCommit | null\n  /** Finish by cancelling. Returns `true` exactly once (restore the DOM). */\n  cancel(): boolean\n}\n\n/**\n * One rich-text editing session (EC-159), with EC-158's one-finish guarantee:\n * the first `commit()`/`cancel()` wins and every later call is inert, so\n * overlapping DOM signals can never dispatch a second operations command or\n * stack a second undo step. The committed value keeps the original's stored\n * schema `version` stamp — only the document tree changes.\n */\nexport function createInlineRichTextSession(args: {\n  nodeId: string\n  propName: string\n  original: RichTextValue\n}): InlineRichTextSession {\n  let active = true\n  return {\n    nodeId: args.nodeId,\n    propName: args.propName,\n    original: args.original,\n    get active() {\n      return active\n    },\n    commit(doc: RichTextDoc): InlineRichTextCommit | null {\n      if (!active) return null\n      active = false\n      if (richTextDocsEquivalent(doc, { type: 'doc', content: (args.original.content ?? []) as RichTextNode[] })) return null\n      return {\n        kind: 'commit',\n        nodeId: args.nodeId,\n        propName: args.propName,\n        // EC-547: the committed doc is render/edit-time; storage is the v2 sequence.\n        value: { version: args.original.version, content: (doc.content ?? []) as BlockNode[] },\n      }\n    },\n    cancel(): boolean {\n      if (!active) return false\n      active = false\n      return true\n    },\n  }\n}\n\n/**\n * The structural slice of `Element` the host finder needs — kept minimal so\n * the descent logic is unit-testable without a DOM.\n */\nexport interface InlineHostElement {\n  readonly childElementCount: number\n  readonly firstElementChild: InlineHostElement | null\n  readonly textContent: string | null\n  getAttribute(name: string): string | null\n}\n\n/**\n * Find the rendered element inside a node's `.ec-editable` wrapper that hosts\n * the editable text. Descends single-child chains as long as no text is lost,\n * never crossing into another node's wrapper, and only accepts a host whose\n * text content is *exactly* the stored prop value — if the component renders\n * the prop transformed (or alongside other text), inline editing is skipped\n * and the inspector remains the editing surface. That exactness is what makes\n * edit-mode typography pixel-identical to render state: we edit the rendered\n * element itself.\n */\nexport function findInlineTextHost(\n  wrapper: InlineHostElement,\n  expected: string,\n): InlineHostElement | null {\n  let el = wrapper.firstElementChild\n  if (!el) return null\n  if (el.getAttribute('data-ec-node-id') !== null) return null\n  while (\n    el.childElementCount === 1 &&\n    el.firstElementChild!.getAttribute('data-ec-node-id') === null &&\n    el.firstElementChild!.textContent === el.textContent\n  ) {\n    el = el.firstElementChild!\n  }\n  return (el.textContent ?? '') === expected ? el : null\n}\n"]}
+{"version":3,"file":"inline-edit.js","sourceRoot":"","sources":["../../../src/components/builder/inline-edit.ts"],"names":[],"mappings":"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","sourcesContent":["import type { ComponentManifest } from '@elytracms/core/component-registry'\nimport { inlineEditablePropNames } from '@elytracms/core/component-registry'\nimport { isStaticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { parseRichTextValue, richTextDocsEquivalent } from '@elytracms/core/rich-text'\nimport type { BlockNode, RichTextDoc, RichTextNode, RichTextValue } from '@elytracms/core/rich-text'\n\n/**\n * Inline text editing on the canvas (EC-158) — framework-free core.\n *\n * The canvas wires DOM events (dblclick/keydown/blur) to this module; the\n * module owns the editing-session state machine and the\n * one-gesture-one-command guarantee. A session finishes exactly once: the\n * first `commit()`/`cancel()` wins and every later call returns `null`, so\n * overlapping DOM signals (Enter immediately followed by blur, blur racing a\n * teardown) can never dispatch a second operations command or stack a second\n * undo step.\n *\n * Locale semantics (EC-176): inline editing targets STATIC graph props only,\n * and static graph props are locale-independent by design — the canonical\n * graph stores one value per prop, not per-locale variants. Bound props are\n * never inline-editable (below), so fallback-shown BOUND text on the canvas\n * cannot be edited in place either: translating localized content happens in\n * the CMS surfaces, where the active-locale variant is created explicitly.\n * Nothing here needs the ambient locale.\n */\n\n/** The single graph mutation a finished session may produce. */\nexport interface InlineEditCommit {\n  kind: 'commit'\n  nodeId: string\n  propName: string\n  /** The edited text to write as the prop's static value. */\n  value: string\n}\n\n/** A cancelled session: restore this text on the DOM, dispatch nothing. */\nexport interface InlineEditCancel {\n  kind: 'cancel'\n  /** The original rendered value to restore. */\n  value: string\n}\n\nexport interface InlineEditSession {\n  readonly nodeId: string\n  readonly propName: string\n  readonly original: string\n  /** False once the session committed or cancelled. */\n  readonly active: boolean\n  /**\n   * Finish by committing `text`. Returns the one commit outcome, or `null`\n   * when the session already finished or the text is unchanged (an unchanged\n   * commit finishes the session but dispatches nothing — graph untouched).\n   */\n  commit(text: string): InlineEditCommit | null\n  /** Finish by cancelling. Returns the restore outcome once, then `null`. */\n  cancel(): InlineEditCancel | null\n}\n\nexport function createInlineEditSession(args: {\n  nodeId: string\n  propName: string\n  original: string\n}): InlineEditSession {\n  let active = true\n  return {\n    nodeId: args.nodeId,\n    propName: args.propName,\n    original: args.original,\n    get active() {\n      return active\n    },\n    commit(text: string): InlineEditCommit | null {\n      if (!active) return null\n      active = false\n      if (text === args.original) return null\n      return { kind: 'commit', nodeId: args.nodeId, propName: args.propName, value: text }\n    },\n    cancel(): InlineEditCancel | null {\n      if (!active) return null\n      active = false\n      return { kind: 'cancel', value: args.original }\n    },\n  }\n}\n\n/** A node prop that can be edited in place right now. */\nexport interface InlineEditableProp {\n  propName: string\n  /** The current static string value (or string default when unset). */\n  value: string\n}\n\n/**\n * Resolve which prop of `node` an inline-edit gesture should target: the\n * first manifest prop flagged `inlineEditable` whose *current* value is a\n * plain static string, or that is unset and `text`-typed — an unset prop starts\n * EMPTY (EC-591/2f: absent is `undefined`; the manifest `default` is a hint, never\n * the value being edited). Bound props and non-string values are never\n * inline-editable — they stay inspector-only.\n */\nexport function resolveInlineEditableProp(\n  manifest: ComponentManifest | undefined,\n  node: ComponentNode,\n): InlineEditableProp | null {\n  if (!manifest) return null\n  for (const propName of inlineEditablePropNames(manifest)) {\n    const current = node.props?.[propName]\n    if (current === undefined) {\n      if (manifest.props[propName]?.type === 'text') return { propName, value: '' }\n      continue\n    }\n    if (isStaticProp(current) && typeof current.value === 'string') {\n      return { propName, value: current.value }\n    }\n  }\n  return null\n}\n\n// ---------------------------------------------------------------------------\n// Rich-text inline editing (EC-159) — the same session contract over the\n// `@elytracms/core/rich-text` storage format.\n// ---------------------------------------------------------------------------\n\n/** A node prop carrying rich-text content that can be edited in place now. */\nexport interface InlineRichTextProp {\n  propName: string\n  /** The current stored value (an empty document when unset — EC-591/2f). */\n  value: RichTextValue\n}\n\n/**\n * Resolve which rich-text prop of `node` an inline-edit gesture should\n * target: the first manifest prop flagged `inlineEditable` whose inspector\n * control is `richtext` and whose *current* value is a static, schema-valid\n * rich-text value, or that is unset — then the session starts from an EMPTY\n * document (EC-591/2f: never the manifest `default`, a hint only). Bound props are\n * never inline-editable — translating/bound content stays inspector- and\n * CMS-owned, exactly like EC-158's plain-text rule.\n */\nexport function resolveInlineRichTextProp(\n  manifest: ComponentManifest | undefined,\n  node: ComponentNode,\n): InlineRichTextProp | null {\n  if (!manifest) return null\n  for (const propName of inlineEditablePropNames(manifest)) {\n    // EC-190: a rich-text prop is the `richText` field-def type (was control.kind 'richtext').\n    if (manifest.props[propName]?.type !== 'richText') continue\n    const current = node.props?.[propName]\n    if (current !== undefined && !isStaticProp(current)) continue\n    const parsed = parseRichTextValue(isStaticProp(current) ? current.value : EMPTY_RICH_TEXT)\n    if (parsed.ok) return { propName, value: parsed.value }\n  }\n  return null\n}\n\n/** The document an unset rich-text prop starts its inline session from (EC-591/2f). */\nconst EMPTY_RICH_TEXT = { version: 2, content: [{ type: 'paragraph' }] }\n\n/** The single graph mutation a finished rich-text session may produce. */\nexport interface InlineRichTextCommit {\n  kind: 'commit'\n  nodeId: string\n  propName: string\n  /** The edited content to write as the prop's static value. */\n  value: RichTextValue\n}\n\nexport interface InlineRichTextSession {\n  readonly nodeId: string\n  readonly propName: string\n  readonly original: RichTextValue\n  /** False once the session committed or cancelled. */\n  readonly active: boolean\n  /**\n   * Finish by committing the parsed-back document. Returns the one commit\n   * outcome, or `null` when the session already finished or the document is\n   * equivalent to the original. An equivalent commit finishes the session and\n   * dispatches nothing — the stored value is never rewritten, so untouched\n   * content round-trips byte-identical.\n   */\n  commit(doc: RichTextDoc): InlineRichTextCommit | null\n  /** Finish by cancelling. Returns `true` exactly once (restore the DOM). */\n  cancel(): boolean\n}\n\n/**\n * One rich-text editing session (EC-159), with EC-158's one-finish guarantee:\n * the first `commit()`/`cancel()` wins and every later call is inert, so\n * overlapping DOM signals can never dispatch a second operations command or\n * stack a second undo step. The committed value keeps the original's stored\n * schema `version` stamp — only the document tree changes.\n */\nexport function createInlineRichTextSession(args: {\n  nodeId: string\n  propName: string\n  original: RichTextValue\n}): InlineRichTextSession {\n  let active = true\n  return {\n    nodeId: args.nodeId,\n    propName: args.propName,\n    original: args.original,\n    get active() {\n      return active\n    },\n    commit(doc: RichTextDoc): InlineRichTextCommit | null {\n      if (!active) return null\n      active = false\n      if (richTextDocsEquivalent(doc, { type: 'doc', content: (args.original.content ?? []) as RichTextNode[] })) return null\n      return {\n        kind: 'commit',\n        nodeId: args.nodeId,\n        propName: args.propName,\n        // EC-547: the committed doc is render/edit-time; storage is the v2 sequence.\n        value: { version: args.original.version, content: (doc.content ?? []) as BlockNode[] },\n      }\n    },\n    cancel(): boolean {\n      if (!active) return false\n      active = false\n      return true\n    },\n  }\n}\n\n/**\n * The structural slice of `Element` the host finder needs — kept minimal so\n * the descent logic is unit-testable without a DOM.\n */\nexport interface InlineHostElement {\n  readonly childElementCount: number\n  readonly firstElementChild: InlineHostElement | null\n  readonly textContent: string | null\n  getAttribute(name: string): string | null\n}\n\n/**\n * Find the rendered element inside a node's `.ec-editable` wrapper that hosts\n * the editable text. Descends single-child chains as long as no text is lost,\n * never crossing into another node's wrapper, and only accepts a host whose\n * text content is *exactly* the stored prop value — if the component renders\n * the prop transformed (or alongside other text), inline editing is skipped\n * and the inspector remains the editing surface. That exactness is what makes\n * edit-mode typography pixel-identical to render state: we edit the rendered\n * element itself.\n */\nexport function findInlineTextHost(\n  wrapper: InlineHostElement,\n  expected: string,\n): InlineHostElement | null {\n  let el = wrapper.firstElementChild\n  if (!el) return null\n  if (el.getAttribute('data-ec-node-id') !== null) return null\n  while (\n    el.childElementCount === 1 &&\n    el.firstElementChild!.getAttribute('data-ec-node-id') === null &&\n    el.firstElementChild!.textContent === el.textContent\n  ) {\n    el = el.firstElementChild!\n  }\n  return (el.textContent ?? '') === expected ? el : null\n}\n"]}

package/dist/components/builder/insert-context.js

@@ -1,6 +1,6 @@
 import { getNode, getParentInfo } from '@elytracms/core/project-graph';
 import { getStudioRegistry } from '@elytracms/studio/lib/registry';
-import { shortId } from '@elytracms/studio/lib/persona/labels';
+import { componentDisplayName } from '@elytracms/studio/lib/persona/labels';
 import { fieldAllowAt, manifestRules, primaryInsertSlot } from '@elytracms/studio/lib/dnd/drop-rules';
 import { hasInsertableComponent, intersectAllow } from './blocks-model.js';
 /**
@@ -39,7 +39,7 @@ export function resolveInsertContext(builder, nodeId, fieldAllow, studio = getSt
         ? {
             target: { parentId: nodeId, slot: childSlot.name },
             slotAllow: childSlot.allow,
-            destinationLabel: `${shortId(node.componentId)} · ${childSlot.name}`,
+            destinationLabel: `${componentDisplayName(node.componentId, manifest)} · ${childSlot.name}`,
         }
         : resolveSiblingContext(studio, root, nodeId);
     // The field vocabulary governs only the top level (a direct child of the page
@@ -57,6 +57,10 @@ function withFieldLeash(root, ctx, fieldAllow) {
     const leash = fieldAllowAt(root, ctx.target.parentId, fieldAllow);
     return leash ? { ...ctx, slotAllow: intersectAllow(ctx.slotAllow, leash) } : ctx;
 }
+/** A destination's component label — its manifest title (EC-591: never a stripped id prefix). */
+function parentLabel(studio, componentId) {
+    return componentDisplayName(componentId, studio.registry.getManifest(componentId));
+}
 /** Sibling-or-root insert context for a node with no insertable child slot. */
 function resolveSiblingContext(studio, root, nodeId) {
     const info = getParentInfo(root, nodeId);
@@ -68,7 +72,7 @@ function resolveSiblingContext(studio, root, nodeId) {
         return {
             target: { parentId: info.parent.id, slot: info.slot, index: info.index + 1 },
             slotAllow: allow,
-            destinationLabel: `${shortId(info.parent.componentId)} · ${info.slot}`,
+            destinationLabel: `${parentLabel(studio, info.parent.componentId)} · ${info.slot}`,
         };
     }
     return { target: { parentId: nodeId, slot: 'children' }, destinationLabel: 'root' };
@@ -106,7 +110,7 @@ export function resolveInsertContextAt(builder, nodeId, position, fieldAllow, st
                 index: (node.slots?.[slot.name] ?? []).length,
             },
             slotAllow: slot.allow,
-            destinationLabel: `${shortId(node.componentId)} · ${slot.name}`,
+            destinationLabel: `${componentDisplayName(node.componentId, manifest)} · ${slot.name}`,
         };
     }
     else {
@@ -122,7 +126,7 @@ export function resolveInsertContextAt(builder, nodeId, position, fieldAllow, st
                 index: info.index + (position === 'after' ? 1 : 0),
             },
             slotAllow: pManifest?.slots.find((s) => s.name === info.slot)?.allow,
-            destinationLabel: `${shortId(info.parent.componentId)} · ${info.slot}`,
+            destinationLabel: `${parentLabel(studio, info.parent.componentId)} · ${info.slot}`,
         };
     }
     // EC-544: closed-set reading, same as `resolveInsertContext` above.

package/dist/components/builder/insert-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"insert-context.js","sourceRoot":"","sources":["../../../src/components/builder/insert-context.ts"],"names":[],"mappings":"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","sourcesContent":["import { getNode, getParentInfo } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport type { StudioRegistry } from '@elytracms/studio/lib/registry'\nimport { shortId } from '@elytracms/studio/lib/persona/labels'\nimport { fieldAllowAt, manifestRules, primaryInsertSlot } from '@elytracms/studio/lib/dnd/drop-rules'\nimport { hasInsertableComponent, intersectAllow } from './blocks-model'\nimport type { InsertContext } from './insert-menu'\n\n/**\n * Where an insert lands: the canvas insert-context resolution, shared by every\n * surface that mounts the canvas engine.\n *\n * Extracted from the retired standalone `BuilderShell` (EC-210) so the in-CMS\n * Canvas editor (`composition-field-editor.tsx`, EC-188/AD-12) can own it without\n * importing the dead shell. No UI here — pure graph/registry resolution.\n */\n\n/**\n * Resolve where an insert lands: into the node's child slot, else as a sibling.\n *\n * `fieldAllow` (EC-188) is the composition field's TOP-LEVEL vocabulary\n * (`field.allow`). It constrains ONLY inserts that land as a direct child of the\n * active page root — the top level of a composition field value — where it is\n * intersected into `slotAllow` so forbidden components are never even offered,\n * mirroring the top-level leash in `validateCompositionValue`. Deeper inserts keep\n * following each component's own slot `allow`. Callers that omit `fieldAllow` get\n * an unconstrained top level. EC-554: which placements the field governs is read\n * through `fieldAllowAt` — the SAME reader drag-and-drop and paste judge with, so\n * the offer and the placement can never disagree.\n */\nexport function resolveInsertContext(\n  builder: { present: ComponentNode },\n  nodeId: string,\n  fieldAllow?: readonly string[],\n  studio: StudioRegistry = getStudioRegistry(),\n): InsertContext | null {\n  const root = builder.present\n  const node = getNode(root, nodeId)\n  if (!node) return null\n  // EC-386: resolve against the merged slot vocabulary (`manifestRules` folds\n  // blocks-prop regions in), through the SAME `primaryInsertSlot` rule a DnD\n  // `into` uses — so a `project.Section.body`-style region receives the insert\n  // instead of silently degrading to a sibling insert.\n  const manifest = studio.registry.getManifest(node.componentId)\n  const childSlot = primaryInsertSlot(manifestRules(manifest))\n  const ctx: InsertContext = childSlot\n    ? {\n        target: { parentId: nodeId, slot: childSlot.name },\n        slotAllow: childSlot.allow,\n        destinationLabel: `${shortId(node.componentId)} · ${childSlot.name}`,\n      }\n    : resolveSiblingContext(studio, root, nodeId)\n\n  // The field vocabulary governs only the top level (a direct child of the page\n  // root). EC-544: an `allow` list is a closed set — absent = any, a list (even\n  // an empty one) = exactly those ids — the same reading the validator applies,\n  // so an empty intersection here is the \"No allowed components match\" state.\n  return withFieldLeash(root, ctx, fieldAllow)\n}\n\n/**\n * Layer the composition field's top-level vocabulary over the resolved slot\n * `allow` (EC-188) — for a direct child of the root only, as decided by\n * {@link fieldAllowAt} (EC-554: the one reader every placement path shares).\n */\nfunction withFieldLeash(\n  root: ComponentNode,\n  ctx: InsertContext,\n  fieldAllow: readonly string[] | undefined,\n): InsertContext {\n  const leash = fieldAllowAt(root, ctx.target.parentId, fieldAllow)\n  return leash ? { ...ctx, slotAllow: intersectAllow(ctx.slotAllow, leash) } : ctx\n}\n\n/** Sibling-or-root insert context for a node with no insertable child slot. */\nfunction resolveSiblingContext(studio: StudioRegistry, root: ComponentNode, nodeId: string): InsertContext {\n  const info = getParentInfo(root, nodeId)\n  if (info) {\n    // EC-386: the parent slot may be a blocks-prop region — look it up on the\n    // merged vocabulary so its `allow` leash still filters sibling inserts.\n    const pManifest = manifestRules(studio.registry.getManifest(info.parent.componentId))\n    const allow = pManifest?.slots.find((s) => s.name === info.slot)?.allow\n    return {\n      target: { parentId: info.parent.id, slot: info.slot, index: info.index + 1 },\n      slotAllow: allow,\n      destinationLabel: `${shortId(info.parent.componentId)} · ${info.slot}`,\n    }\n  }\n  return { target: { parentId: nodeId, slot: 'children' }, destinationLabel: 'root' }\n}\n\n/**\n * An in-canvas insertion position relative to a reference node (EC-405) — the\n * DnD position vocabulary (`lib/dnd/drop-rules`), narrowed to the three the\n * insertion affordances offer: `before`/`after` a sibling, or `into` an (empty)\n * container. `left`/`right` (the wrap-into-columns gesture) are DnD-only.\n */\nexport type InsertPosition = 'before' | 'after' | 'into'\n\n/**\n * Resolve an `InsertContext` for an EXPLICIT position relative to `nodeId`\n * (EC-405) — the position-carrying twin of {@link resolveInsertContext}, so an\n * affordance click at a chosen edge lands the insert at exactly that spot rather\n * than the panel re-deriving it from the selection.\n *\n * The slot resolution reuses the shared DnD rules — `into` uses\n * {@link primaryInsertSlot} (the same slot a drop `into` picks; `null` when the\n * node accepts no children), `before`/`after` use the reference's parent slot at\n * `index`/`index + 1` — so this surface and drag-insert can never disagree about\n * where a position lands or what it allows. `fieldAllow` (EC-188) still constrains\n * ONLY a direct child of the composition root, mirroring `resolveInsertContext`.\n */\nexport function resolveInsertContextAt(\n  builder: { present: ComponentNode },\n  nodeId: string,\n  position: InsertPosition,\n  fieldAllow?: readonly string[],\n  studio: StudioRegistry = getStudioRegistry(),\n): InsertContext | null {\n  const root = builder.present\n  const node = getNode(root, nodeId)\n  if (!node) return null\n\n  let ctx: InsertContext\n  if (position === 'into') {\n    // EC-386: `manifestRules` folds blocks-prop regions into the slot set, so\n    // an affordance/drop `into` a Section-style body lands in that region.\n    const manifest = studio.registry.getManifest(node.componentId)\n    const slot = primaryInsertSlot(manifestRules(manifest))\n    if (!slot) return null // the node accepts no children — no `into` position\n    ctx = {\n      target: {\n        parentId: nodeId,\n        slot: slot.name,\n        index: (node.slots?.[slot.name] ?? []).length,\n      },\n      slotAllow: slot.allow,\n      destinationLabel: `${shortId(node.componentId)} · ${slot.name}`,\n    }\n  } else {\n    const info = getParentInfo(root, nodeId)\n    if (!info) return null // the root has no siblings — no before/after position\n    // EC-386: merged vocabulary — a blocks-prop parent region keeps its leash.\n    const pManifest = manifestRules(studio.registry.getManifest(info.parent.componentId))\n    ctx = {\n      target: {\n        parentId: info.parent.id,\n        slot: info.slot,\n        index: info.index + (position === 'after' ? 1 : 0),\n      },\n      slotAllow: pManifest?.slots.find((s) => s.name === info.slot)?.allow,\n      destinationLabel: `${shortId(info.parent.componentId)} · ${info.slot}`,\n    }\n  }\n\n  // EC-544: closed-set reading, same as `resolveInsertContext` above.\n  return withFieldLeash(root, ctx, fieldAllow)\n}\n\n/**\n * Which affordance positions are actually insertable at `nodeId` (EC-405 scope 3):\n * a position is offered only when it structurally exists AND at least one registry\n * component may land there (the SAME slot-rule filter the tree/DnD and the blocks\n * panel apply — {@link hasInsertableComponent} over the resolved `slotAllow`), so a\n * blocked spot shows no dead button.\n *\n * An EMPTY, insertable container surfaces ONLY `into` — the meaningful action there\n * is \"add the first child\", and an empty container often renders zero-height, so\n * its own before/after edges are degenerate and would pile the three \"+\" buttons\n * onto one point. A filled container and every leaf get before/after instead (each\n * child already carries its own edge affordances, so a filled container needs no\n * center \"+\").\n */\nexport function insertablePositions(\n  builder: { present: ComponentNode },\n  nodeId: string,\n  fieldAllow?: readonly string[],\n  studio: StudioRegistry = getStudioRegistry(),\n): InsertPosition[] {\n  // Empty insertable container → into only.\n  const into = resolveInsertContextAt(builder, nodeId, 'into', fieldAllow, studio)\n  if (into && (into.target.index ?? 0) === 0 && hasInsertableComponent(studio, into.slotAllow)) {\n    return ['into']\n  }\n  // Otherwise the sibling edges that accept something.\n  const out: InsertPosition[] = []\n  for (const position of ['before', 'after'] as const) {\n    const ctx = resolveInsertContextAt(builder, nodeId, position, fieldAllow, studio)\n    if (ctx && hasInsertableComponent(studio, ctx.slotAllow)) out.push(position)\n  }\n  return out\n}\n"]}
+{"version":3,"file":"insert-context.js","sourceRoot":"","sources":["../../../src/components/builder/insert-context.ts"],"names":[],"mappings":"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","sourcesContent":["import { getNode, getParentInfo } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport type { StudioRegistry } from '@elytracms/studio/lib/registry'\nimport { componentDisplayName } from '@elytracms/studio/lib/persona/labels'\nimport { fieldAllowAt, manifestRules, primaryInsertSlot } from '@elytracms/studio/lib/dnd/drop-rules'\nimport { hasInsertableComponent, intersectAllow } from './blocks-model'\nimport type { InsertContext } from './insert-menu'\n\n/**\n * Where an insert lands: the canvas insert-context resolution, shared by every\n * surface that mounts the canvas engine.\n *\n * Extracted from the retired standalone `BuilderShell` (EC-210) so the in-CMS\n * Canvas editor (`composition-field-editor.tsx`, EC-188/AD-12) can own it without\n * importing the dead shell. No UI here — pure graph/registry resolution.\n */\n\n/**\n * Resolve where an insert lands: into the node's child slot, else as a sibling.\n *\n * `fieldAllow` (EC-188) is the composition field's TOP-LEVEL vocabulary\n * (`field.allow`). It constrains ONLY inserts that land as a direct child of the\n * active page root — the top level of a composition field value — where it is\n * intersected into `slotAllow` so forbidden components are never even offered,\n * mirroring the top-level leash in `validateCompositionValue`. Deeper inserts keep\n * following each component's own slot `allow`. Callers that omit `fieldAllow` get\n * an unconstrained top level. EC-554: which placements the field governs is read\n * through `fieldAllowAt` — the SAME reader drag-and-drop and paste judge with, so\n * the offer and the placement can never disagree.\n */\nexport function resolveInsertContext(\n  builder: { present: ComponentNode },\n  nodeId: string,\n  fieldAllow?: readonly string[],\n  studio: StudioRegistry = getStudioRegistry(),\n): InsertContext | null {\n  const root = builder.present\n  const node = getNode(root, nodeId)\n  if (!node) return null\n  // EC-386: resolve against the merged slot vocabulary (`manifestRules` folds\n  // blocks-prop regions in), through the SAME `primaryInsertSlot` rule a DnD\n  // `into` uses — so a `project.Section.body`-style region receives the insert\n  // instead of silently degrading to a sibling insert.\n  const manifest = studio.registry.getManifest(node.componentId)\n  const childSlot = primaryInsertSlot(manifestRules(manifest))\n  const ctx: InsertContext = childSlot\n    ? {\n        target: { parentId: nodeId, slot: childSlot.name },\n        slotAllow: childSlot.allow,\n        destinationLabel: `${componentDisplayName(node.componentId, manifest)} · ${childSlot.name}`,\n      }\n    : resolveSiblingContext(studio, root, nodeId)\n\n  // The field vocabulary governs only the top level (a direct child of the page\n  // root). EC-544: an `allow` list is a closed set — absent = any, a list (even\n  // an empty one) = exactly those ids — the same reading the validator applies,\n  // so an empty intersection here is the \"No allowed components match\" state.\n  return withFieldLeash(root, ctx, fieldAllow)\n}\n\n/**\n * Layer the composition field's top-level vocabulary over the resolved slot\n * `allow` (EC-188) — for a direct child of the root only, as decided by\n * {@link fieldAllowAt} (EC-554: the one reader every placement path shares).\n */\nfunction withFieldLeash(\n  root: ComponentNode,\n  ctx: InsertContext,\n  fieldAllow: readonly string[] | undefined,\n): InsertContext {\n  const leash = fieldAllowAt(root, ctx.target.parentId, fieldAllow)\n  return leash ? { ...ctx, slotAllow: intersectAllow(ctx.slotAllow, leash) } : ctx\n}\n\n/** A destination's component label — its manifest title (EC-591: never a stripped id prefix). */\nfunction parentLabel(studio: StudioRegistry, componentId: string): string {\n  return componentDisplayName(componentId, studio.registry.getManifest(componentId))\n}\n\n/** Sibling-or-root insert context for a node with no insertable child slot. */\nfunction resolveSiblingContext(studio: StudioRegistry, root: ComponentNode, nodeId: string): InsertContext {\n  const info = getParentInfo(root, nodeId)\n  if (info) {\n    // EC-386: the parent slot may be a blocks-prop region — look it up on the\n    // merged vocabulary so its `allow` leash still filters sibling inserts.\n    const pManifest = manifestRules(studio.registry.getManifest(info.parent.componentId))\n    const allow = pManifest?.slots.find((s) => s.name === info.slot)?.allow\n    return {\n      target: { parentId: info.parent.id, slot: info.slot, index: info.index + 1 },\n      slotAllow: allow,\n      destinationLabel: `${parentLabel(studio, info.parent.componentId)} · ${info.slot}`,\n    }\n  }\n  return { target: { parentId: nodeId, slot: 'children' }, destinationLabel: 'root' }\n}\n\n/**\n * An in-canvas insertion position relative to a reference node (EC-405) — the\n * DnD position vocabulary (`lib/dnd/drop-rules`), narrowed to the three the\n * insertion affordances offer: `before`/`after` a sibling, or `into` an (empty)\n * container. `left`/`right` (the wrap-into-columns gesture) are DnD-only.\n */\nexport type InsertPosition = 'before' | 'after' | 'into'\n\n/**\n * Resolve an `InsertContext` for an EXPLICIT position relative to `nodeId`\n * (EC-405) — the position-carrying twin of {@link resolveInsertContext}, so an\n * affordance click at a chosen edge lands the insert at exactly that spot rather\n * than the panel re-deriving it from the selection.\n *\n * The slot resolution reuses the shared DnD rules — `into` uses\n * {@link primaryInsertSlot} (the same slot a drop `into` picks; `null` when the\n * node accepts no children), `before`/`after` use the reference's parent slot at\n * `index`/`index + 1` — so this surface and drag-insert can never disagree about\n * where a position lands or what it allows. `fieldAllow` (EC-188) still constrains\n * ONLY a direct child of the composition root, mirroring `resolveInsertContext`.\n */\nexport function resolveInsertContextAt(\n  builder: { present: ComponentNode },\n  nodeId: string,\n  position: InsertPosition,\n  fieldAllow?: readonly string[],\n  studio: StudioRegistry = getStudioRegistry(),\n): InsertContext | null {\n  const root = builder.present\n  const node = getNode(root, nodeId)\n  if (!node) return null\n\n  let ctx: InsertContext\n  if (position === 'into') {\n    // EC-386: `manifestRules` folds blocks-prop regions into the slot set, so\n    // an affordance/drop `into` a Section-style body lands in that region.\n    const manifest = studio.registry.getManifest(node.componentId)\n    const slot = primaryInsertSlot(manifestRules(manifest))\n    if (!slot) return null // the node accepts no children — no `into` position\n    ctx = {\n      target: {\n        parentId: nodeId,\n        slot: slot.name,\n        index: (node.slots?.[slot.name] ?? []).length,\n      },\n      slotAllow: slot.allow,\n      destinationLabel: `${componentDisplayName(node.componentId, manifest)} · ${slot.name}`,\n    }\n  } else {\n    const info = getParentInfo(root, nodeId)\n    if (!info) return null // the root has no siblings — no before/after position\n    // EC-386: merged vocabulary — a blocks-prop parent region keeps its leash.\n    const pManifest = manifestRules(studio.registry.getManifest(info.parent.componentId))\n    ctx = {\n      target: {\n        parentId: info.parent.id,\n        slot: info.slot,\n        index: info.index + (position === 'after' ? 1 : 0),\n      },\n      slotAllow: pManifest?.slots.find((s) => s.name === info.slot)?.allow,\n      destinationLabel: `${parentLabel(studio, info.parent.componentId)} · ${info.slot}`,\n    }\n  }\n\n  // EC-544: closed-set reading, same as `resolveInsertContext` above.\n  return withFieldLeash(root, ctx, fieldAllow)\n}\n\n/**\n * Which affordance positions are actually insertable at `nodeId` (EC-405 scope 3):\n * a position is offered only when it structurally exists AND at least one registry\n * component may land there (the SAME slot-rule filter the tree/DnD and the blocks\n * panel apply — {@link hasInsertableComponent} over the resolved `slotAllow`), so a\n * blocked spot shows no dead button.\n *\n * An EMPTY, insertable container surfaces ONLY `into` — the meaningful action there\n * is \"add the first child\", and an empty container often renders zero-height, so\n * its own before/after edges are degenerate and would pile the three \"+\" buttons\n * onto one point. A filled container and every leaf get before/after instead (each\n * child already carries its own edge affordances, so a filled container needs no\n * center \"+\").\n */\nexport function insertablePositions(\n  builder: { present: ComponentNode },\n  nodeId: string,\n  fieldAllow?: readonly string[],\n  studio: StudioRegistry = getStudioRegistry(),\n): InsertPosition[] {\n  // Empty insertable container → into only.\n  const into = resolveInsertContextAt(builder, nodeId, 'into', fieldAllow, studio)\n  if (into && (into.target.index ?? 0) === 0 && hasInsertableComponent(studio, into.slotAllow)) {\n    return ['into']\n  }\n  // Otherwise the sibling edges that accept something.\n  const out: InsertPosition[] = []\n  for (const position of ['before', 'after'] as const) {\n    const ctx = resolveInsertContextAt(builder, nodeId, position, fieldAllow, studio)\n    if (ctx && hasInsertableComponent(studio, ctx.slotAllow)) out.push(position)\n  }\n  return out\n}\n"]}

package/dist/components/builder/layout-inspector.d.ts

@@ -1,5 +1,5 @@
-import type { ComponentNode, SpacingTokenName } from '@elytracms/core/project-graph';
-export declare function layoutManagedPropNames(node: ComponentNode): readonly string[];
+import type { ComponentNode, LayoutContainerIds, SpacingTokenName } from '@elytracms/core/project-graph';
+export declare function layoutManagedPropNames(node: ComponentNode, layout: LayoutContainerIds): readonly string[];
 /**
  * i18n message key per spacing token step (EC-161 scale) — no CSS lengths.
  * Shared with the canvas gap handles (EC-163): the live drag label and this

package/dist/components/builder/layout-inspector.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CONTAINER_ALIGNMENTS, GRID_MAX_COLUMNS, SPACING_TOKEN_NAMES, STACK_COMPONENT_ID, STACK_ON_MOBILE_PROP, gridStacksOnMobile, isLayoutContainerNode, isSpacingTokenName, isStaticProp, spacingTokenFromLegacyGap, staticProp, } from '@elytracms/core/project-graph';
+import { CONTAINER_ALIGNMENTS, GRID_MAX_COLUMNS, SPACING_TOKEN_NAMES, STACK_ON_MOBILE_PROP, gridStacksOnMobile, isLayoutContainerNode, layoutContainerKind, isSpacingTokenName, isStaticProp, spacingTokenFromLegacyGap, staticProp, } from '@elytracms/core/project-graph';
 import { Field, InspectorSection, Select, Stack } from '@elytracms/studio/ui';
 import { translate } from '@elytracms/studio/lib/i18n';
 import { useBuilder } from './builder-store.js';
@@ -13,8 +13,8 @@ import { useBuilder } from './builder-store.js';
  */
 /** The props this section owns for a container (hidden from the generic Props list). */
 const LAYOUT_PROPS = ['direction', 'gap', 'align', 'columns', STACK_ON_MOBILE_PROP];
-export function layoutManagedPropNames(node) {
-    return isLayoutContainerNode(node) ? LAYOUT_PROPS : [];
+export function layoutManagedPropNames(node, layout) {
+    return isLayoutContainerNode(node, layout) ? LAYOUT_PROPS : [];
 }
 /**
  * i18n message key per spacing token step (EC-161 scale) — no CSS lengths.
@@ -73,12 +73,14 @@ const COLUMN_OPTIONS = Array.from({ length: GRID_MAX_COLUMNS }, (_, i) => i + 1)
 /** The contextual layout section. Renders nothing for non-container nodes. */
 export function LayoutSection({ node }) {
     const builder = useBuilder();
-    if (!isLayoutContainerNode(node))
+    // EC-591: a layout container is whichever component fills a layout role.
+    const kind = layoutContainerKind(node.componentId, builder.layout);
+    if (!kind)
         return null;
-    const isStack = node.componentId === STACK_COMPONENT_ID;
+    const isStack = kind === 'stack';
     const set = (name, value) => builder.dispatch({ type: 'setProp', id: node.id, name, value: staticProp(value) });
     const clear = (name) => builder.dispatch({ type: 'removeProp', id: node.id, name });
-    return (_jsx(InspectorSection, { title: translate('builder.layout.title'), children: _jsxs(Stack, { gap: "3", children: [isStack ? (_jsx(Field, { label: translate('builder.layout.direction'), htmlFor: `layout-${node.id}-direction`, children: _jsxs(Select, { id: `layout-${node.id}-direction`, value: currentDirection(node), onChange: (e) => set('direction', e.target.value), children: [_jsx("option", { value: "vertical", children: translate('builder.layout.vertical') }), _jsx("option", { value: "horizontal", children: translate('builder.layout.horizontal') })] }) })) : (_jsx(Field, { label: translate('builder.layout.columns'), htmlFor: `layout-${node.id}-columns`, children: _jsx(Select, { id: `layout-${node.id}-columns`, value: String(currentColumns(node)), onChange: (e) => set('columns', Number(e.target.value)), children: COLUMN_OPTIONS.map((n) => (_jsx("option", { value: String(n), children: translate(n === 1 ? 'builder.layout.columnCount.one' : 'builder.layout.columnCount.other', { count: n }) }, n))) }) })), _jsx(Field, { label: translate('builder.layout.gap'), htmlFor: `layout-${node.id}-gap`, children: _jsxs(Select, { id: `layout-${node.id}-gap`, value: currentGapToken(node), onChange: (e) => (e.target.value === GAP_NONE ? clear('gap') : set('gap', e.target.value)), children: [_jsx("option", { value: GAP_NONE, children: translate(GAP_NONE_LABEL_KEY) }), SPACING_TOKEN_NAMES.map((name) => (_jsx("option", { value: name, children: translate(GAP_LABEL_KEYS[name]) }, name)))] }) }), _jsx(Field, { label: translate('builder.layout.alignment'), htmlFor: `layout-${node.id}-align`, children: _jsx(Select, { id: `layout-${node.id}-align`, value: currentAlignment(node), onChange: (e) => set('align', e.target.value), children: CONTAINER_ALIGNMENTS.map((name) => (_jsx("option", { value: name, children: translate(ALIGN_LABEL_KEYS[name]) }, name))) }) }), !isStack ? (_jsx(Field, { label: translate('builder.layout.onPhones'), htmlFor: `layout-${node.id}-mobile`, children: _jsxs(Select, { id: `layout-${node.id}-mobile`, value: gridStacksOnMobile(node) ? 'stack' : 'keep', onChange: (e) => e.target.value === 'keep'
+    return (_jsx(InspectorSection, { title: translate('builder.layout.title'), children: _jsxs(Stack, { gap: "3", children: [isStack ? (_jsx(Field, { label: translate('builder.layout.direction'), htmlFor: `layout-${node.id}-direction`, children: _jsxs(Select, { id: `layout-${node.id}-direction`, value: currentDirection(node), onChange: (e) => set('direction', e.target.value), children: [_jsx("option", { value: "vertical", children: translate('builder.layout.vertical') }), _jsx("option", { value: "horizontal", children: translate('builder.layout.horizontal') })] }) })) : (_jsx(Field, { label: translate('builder.layout.columns'), htmlFor: `layout-${node.id}-columns`, children: _jsx(Select, { id: `layout-${node.id}-columns`, value: String(currentColumns(node)), onChange: (e) => set('columns', Number(e.target.value)), children: COLUMN_OPTIONS.map((n) => (_jsx("option", { value: String(n), children: translate(n === 1 ? 'builder.layout.columnCount.one' : 'builder.layout.columnCount.other', { count: n }) }, n))) }) })), _jsx(Field, { label: translate('builder.layout.gap'), htmlFor: `layout-${node.id}-gap`, children: _jsxs(Select, { id: `layout-${node.id}-gap`, value: currentGapToken(node), onChange: (e) => (e.target.value === GAP_NONE ? clear('gap') : set('gap', e.target.value)), children: [_jsx("option", { value: GAP_NONE, children: translate(GAP_NONE_LABEL_KEY) }), SPACING_TOKEN_NAMES.map((name) => (_jsx("option", { value: name, children: translate(GAP_LABEL_KEYS[name]) }, name)))] }) }), _jsx(Field, { label: translate('builder.layout.alignment'), htmlFor: `layout-${node.id}-align`, children: _jsx(Select, { id: `layout-${node.id}-align`, value: currentAlignment(node), onChange: (e) => set('align', e.target.value), children: CONTAINER_ALIGNMENTS.map((name) => (_jsx("option", { value: name, children: translate(ALIGN_LABEL_KEYS[name]) }, name))) }) }), !isStack ? (_jsx(Field, { label: translate('builder.layout.onPhones'), htmlFor: `layout-${node.id}-mobile`, children: _jsxs(Select, { id: `layout-${node.id}-mobile`, value: gridStacksOnMobile(node, builder.layout) ? 'stack' : 'keep', onChange: (e) => e.target.value === 'keep'
                             ? set(STACK_ON_MOBILE_PROP, false)
                             : clear(STACK_ON_MOBILE_PROP), children: [_jsx("option", { value: "stack", children: translate('builder.layout.stack') }), _jsx("option", { value: "keep", children: translate('builder.layout.keepColumns') })] }) })) : null] }) }));
 }