@elytracms/studio 0.0.90 → 0.0.91

package/dist/components/builder/canvas-render-context.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useSyncExternalStore } from 'react';
 import { resolvedAsset } from '@elytracms/core/content';
-import { listingQueryOf } from '@elytracms/core/runtime-renderer';
+import { nodeListingOf } from '@elytracms/core/runtime-renderer';
 import { translate } from '@elytracms/studio/lib/i18n';
 import { contentQueryErrorMessage } from '@elytracms/studio/lib/persona/labels';
 import { acquireContentSessionConsumer, contentSessionEpoch, resolveCanvasLink, resolveCanvasListing, resolveCanvasRelation, subscribeContentSession, validateCanvasListingQuery, } from '@elytracms/studio/lib/data';
@@ -49,6 +49,31 @@ export function unresolvedReuseStatus(node, capability, resolveAt, perspective)
         return null;
     return resolveAt(ref, 'draft') ? 'unpublished' : 'missing';
 }
+/**
+ * The canvas notice for a listing node that cannot run, or `null` (EC-460, the
+ * never-silent rule). Reads the shared `nodeListingOf` — the same reader the
+ * renderer and the delivery host use — so notice and resolution never disagree
+ * about WHICH query was judged. EC-581 6a: a declaration the registry rejected
+ * (`invalid-listing`) shows its registration issue; a runnable query is judged by
+ * `validate` (the session schema's `validateWhere`/`validateSort`/`validateLimit`);
+ * a listing awaiting its bound value keeps the block's own empty state. Pure,
+ * exported for the node test.
+ */
+export function canvasListingIssue(node, registry, validate) {
+    const manifest = registry.getManifest(node.componentId);
+    if (!manifest)
+        return null;
+    const listing = nodeListingOf(node, manifest, registry);
+    if (!listing || listing.state === 'awaiting')
+        return null;
+    if (listing.state === 'invalid')
+        return listing.messages.join(' ');
+    const errors = validate(listing.query);
+    if (errors.length === 0)
+        return null;
+    // EC-494: `ContentQueryError` carries a catalog ref, so this notice localizes.
+    return errors.map((error) => contentQueryErrorMessage(error)).join(' ');
+}
 /**
  * Assemble the canvas `RenderContext`. Pure (no hooks): the same deps produce
  * the same context, so the decorator's wrapper markup is pinnable in tests.
@@ -149,23 +174,8 @@ export function useCanvasRenderContext(args) {
     // target → null → the rich-text renderer shows the visible `unresolved-ref` issue.
     const resolveLink = useCallback((ref) => resolveCanvasLink(ref, activeLocale, perspective), [activeLocale, perspective, sessionEpoch]);
     const unresolvedReuse = useCallback((node) => unresolvedReuseStatus(node, reuse?.capability, (ref, p) => resolveCanvasRelation(ref, activeLocale, p), perspective), [reuse, activeLocale, perspective, sessionEpoch]);
-    // EC-460 (never-silent): flag a listing whose query is statically invalid
-    // against the active session schema. Pure over the registry + the shared
-    // `listingQueryOf` (the same query builder the renderer/host use), so notice
-    // and resolution can never disagree about WHICH query was judged.
-    const listingIssueOf = useCallback((node) => {
-        const manifest = studio.registry.getManifest(node.componentId);
-        if (!manifest?.listing)
-            return null;
-        const query = listingQueryOf(node, manifest.listing);
-        if (!query)
-            return null; // awaiting the filter pick — the block's own empty state
-        const errors = validateCanvasListingQuery(query);
-        if (errors.length === 0)
-            return null;
-        // EC-494: `ContentQueryError` carries a catalog ref, so this notice localizes.
-        return errors.map((error) => contentQueryErrorMessage(error)).join(' ');
-    }, [studio, sessionEpoch]);
+    // EC-460 (never-silent): flag a listing that cannot run (see `canvasListingIssue`).
+    const listingIssueOf = useCallback((node) => canvasListingIssue(node, studio.registry, (query) => validateCanvasListingQuery(query)), [studio, sessionEpoch]);
     const ctx = useMemo(() => createCanvasRenderContext({
         registry: studio.registry,
         implementations: studio.implementations,

package/dist/components/builder/canvas-render-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"canvas-render-context.js","sourceRoot":"","sources":["../../../src/components/builder/canvas-render-context.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useSyncExternalStore } from 'react'\nimport { resolvedAsset } from '@elytracms/core/content'\nimport type { AssetRecord } from '@elytracms/core/persistence'\nimport { listingQueryOf } from '@elytracms/core/runtime-renderer'\nimport type {\n  RenderAsset,\n  RenderContext,\n  ResolveAsset,\n  ResolveLink,\n  ResolveListing,\n  ResolveRelation,\n} from '@elytracms/core/runtime-renderer'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport type { StudioRegistry } from '@elytracms/studio/lib/registry'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { contentQueryErrorMessage } from '@elytracms/studio/lib/persona/labels'\nimport {\n  acquireContentSessionConsumer,\n  contentSessionEpoch,\n  resolveCanvasLink,\n  resolveCanvasListing,\n  resolveCanvasRelation,\n  subscribeContentSession,\n  validateCanvasListingQuery,\n} from '@elytracms/studio/lib/data'\nimport type { CanvasPerspective } from '@elytracms/studio/lib/data'\nimport { useStudioLocale } from '@elytracms/studio/lib/locale'\nimport { useOptionalAssets } from '../assets/assets-store'\nimport { useReuse } from './reuse-context'\nimport { reuseEmbedRef } from './reuse'\nimport type { ReuseCapability } from './reuse'\n\n/**\n * The canvas's `RenderContext` (EC-330, extracted from `BuilderCanvas`): the\n * injected resolvers that make the iframe preview match delivery — assets\n * (EC-195), relations (EC-254), listings (EC-255), rich-text links (EC-291) —\n * plus the per-node decorator that stamps the editable wrappers (selection/hover\n * state, rich-text remount epochs, and the EC-300 unresolved-reusable\n * placeholder). The binding resolver and the EC-176 locale-fallback chips (which\n * read bound props) went with the data-binding subsystem (EC-574).\n *\n * The context assembly is a pure factory ({@link createCanvasRenderContext})\n * over a pure decision helper ({@link unresolvedReuseStatus}), so the decoration\n * and resolver wiring are unit-testable without providers;\n * {@link useCanvasRenderContext} binds them to the live stores.\n */\n\n/** Collect every node id under a root (the page subtree). */\nexport function collectIds(node: ComponentNode, out: Set<string> = new Set()): Set<string> {\n  out.add(node.id)\n  for (const children of Object.values(node.slots ?? {})) {\n    for (const child of children) collectIds(child, out)\n  }\n  return out\n}\n\n/**\n * EC-300/AD-16: a transcluding embed whose target doesn't resolve in the active\n * perspective renders a placeholder, never an empty section. `unpublished` = the\n * target exists as a draft but isn't live (Published view of a draft-only reusable);\n * `missing` = no resolvable target at all (deleted). `null` = resolves fine, or the\n * node isn't an embed / has no target picked yet (its own empty state owns that).\n */\nexport function unresolvedReuseStatus(\n  node: ComponentNode,\n  capability: ReuseCapability | null | undefined,\n  resolveAt: (ref: { collection: string; id: string }, perspective: CanvasPerspective) => unknown,\n  perspective: CanvasPerspective,\n): 'unpublished' | 'missing' | null {\n  if (!capability) return null\n  const ref = reuseEmbedRef(node, capability)\n  if (!ref) return null\n  if (resolveAt(ref, perspective)) return null\n  return resolveAt(ref, 'draft') ? 'unpublished' : 'missing'\n}\n\n/** Everything the pure context factory needs — resolvers plus decoration state. */\nexport interface CanvasRenderContextDeps {\n  registry: RenderContext['registry']\n  implementations: RenderContext['implementations']\n  resolveAsset: ResolveAsset\n  resolveRelation: ResolveRelation\n  resolveListing: ResolveListing\n  resolveLink: ResolveLink\n  /** Only page nodes are editable; layout chrome must not be decorated. */\n  pageNodeIds: ReadonlySet<string>\n  selectedId: string | null\n  hoveredId: string | null\n  /** Per-node remount epochs from the inline rich-text editing (EC-159). */\n  richEditEpochs: Record<string, number>\n  unresolvedReuse(node: ComponentNode): 'unpublished' | 'missing' | null\n  /**\n   * EC-460 (never-silent): a human-readable message when the node declares a\n   * `listing` whose built query is STATICALLY invalid against the active session\n   * schema (unknown collection, non-filterable filter/sort field) — the canvas\n   * then shows a visible notice above the block instead of an empty grid that\n   * is indistinguishable from \"no content yet\". `null` = healthy (or no listing).\n   */\n  listingIssueOf(node: ComponentNode): string | null\n}\n\n/**\n * Assemble the canvas `RenderContext`. Pure (no hooks): the same deps produce\n * the same context, so the decorator's wrapper markup is pinnable in tests.\n */\nexport function createCanvasRenderContext(deps: CanvasRenderContextDeps): RenderContext {\n  return {\n    registry: deps.registry,\n    implementations: deps.implementations,\n    resolveAsset: deps.resolveAsset,\n    resolveRelation: deps.resolveRelation,\n    resolveListing: deps.resolveListing,\n    resolveLink: deps.resolveLink,\n    decorateNode: (node, rendered) => {\n      if (!deps.pageNodeIds.has(node.id)) return rendered\n      // An unresolved hard reference shows the placeholder in place of the empty\n      // transclusion; the node stays selectable, so its inspector relation chip\n      // (EC-296) deep-links to the reusable to edit/publish it.\n      const unresolved = deps.unresolvedReuse(node)\n      // EC-460: a config-invalid listing query gets a visible notice ABOVE the\n      // block (which keeps its own empty state below) — never a silent empty grid.\n      const listingIssue = deps.listingIssueOf(node)\n      return (\n        <div\n          // The epoch suffix forces a remount after a rich-text editing\n          // session mutated this node's rendered DOM (see richEditEpochs).\n          key={`${node.id}#${deps.richEditEpochs[node.id] ?? 0}`}\n          data-ec-node-id={node.id}\n          className=\"ec-editable\"\n          data-selected={node.id === deps.selectedId || undefined}\n          data-hovered={node.id === deps.hoveredId || undefined}\n        >\n          {unresolved ? (\n            <UnresolvedReusablePlaceholder status={unresolved} />\n          ) : (\n            <>\n              {listingIssue !== null ? <CanvasListingIssueNotice message={listingIssue} /> : null}\n              {rendered}\n            </>\n          )}\n        </div>\n      )\n    },\n  }\n}\n\n/**\n * The live canvas render context: binds the pure factory to the studio's\n * stores (asset library, content session, active locale, reuse capability) for\n * the given perspective. Returns the context plus the page-node id set the\n * canvas also needs for spacing-handle gating.\n */\n/**\n * The canvas's asset reader IS delivery's (NK-049 finding, 2026-10-23). This used to\n * hand-pick `url/width/height/alt/focalPoint`, read `alt` from the legacy column\n * only and drop `meta` — so a component's AI badge (`meta.aiGenerated`) and an\n * editor-set `meta.alt` rendered on the site but not on the canvas. One reader\n * (`resolvedAsset`, `content/assets.ts`) means the canvas and the host cannot\n * disagree about an asset's own facts; `RenderAsset` is a subset of\n * `ResolvedAsset`, `lqip` included. Pure, exported for the node test.\n */\nexport function canvasRenderAsset(record: AssetRecord | undefined): RenderAsset | null {\n  if (!record?.url) return null\n  return resolvedAsset(record, record.url)\n}\n\nexport function useCanvasRenderContext(args: {\n  /** The edited composition root (`builder.present`). */\n  present: ComponentNode\n  selectedId: string | null\n  hoveredId: string | null\n  studio: StudioRegistry\n  perspective: CanvasPerspective\n  richEditEpochs: Record<string, number>\n}): { ctx: RenderContext; pageNodeIds: ReadonlySet<string> } {\n  const { present, selectedId, hoveredId, studio, perspective, richEditEpochs } = args\n\n  // EC-460: the canvas follows the preview content session reactively. The\n  // epoch bumps whenever `configureContentSession` re-points the session (the\n  // write-sync refresh, a CMS-surface hydration, boot) — it keys the resolver\n  // callbacks below, so the context identity changes and the canvas re-renders\n  // against the fresh session. Registering as a CONSUMER tells the write-sync a\n  // preview surface is live, so a stale session actually refreshes (with no\n  // consumer it only flags — connected mode never pays a per-autosave query\n  // while nobody is previewing).\n  const sessionEpoch = useSyncExternalStore(subscribeContentSession, contentSessionEpoch)\n  useEffect(() => acquireContentSessionConsumer(), [])\n\n  // Only page nodes are editable; layout chrome (rendered around the page) is\n  // read-only context and must not be selectable (it isn't in the page tree).\n  const pageNodeIds = useMemo(() => collectIds(present), [present])\n\n  // EC-195: resolve an `asset`-typed Image prop (an asset id) from the live asset\n  // library, so the canvas previews exactly what the host renders. A record\n  // without a resolved url (e.g. a never-served seed) → null → the\n  // implementation's visible empty state.\n  const assetsStore = useOptionalAssets()\n  const resolveAsset: ResolveAsset = useCallback(\n    (assetId) => canvasRenderAsset(assetsStore?.assets.find((a) => a.id === assetId)),\n    [assetsStore],\n  )\n\n  // The canvas's active locale for relation/listing/link resolution below.\n  // EC-479: the ambient locale is `null` until a project's config is installed (it\n  // no longer opens on the engine's `en/de` fixture). `undefined` means \"you pick\" to\n  // the content engine, which then resolves in the SESSION's own default locale —\n  // never a fabricated one — so a canvas mounted outside a CMS session still previews\n  // in the project's locale.\n  const { locale } = useStudioLocale()\n  const activeLocale = locale ?? undefined\n  // EC-300: the reuse capability identifies a transcluding embed + its relation prop,\n  // so the canvas can detect a HARD reference whose target doesn't resolve and show a\n  // placeholder instead of an empty section. Null-safe (no provider / no capability).\n  const reuse = useReuse()\n\n  // EC-254: populate a block's `relation` prop (the editor's document pick — a\n  // ProductGrid's products, a Reusable's element) to delivery shape from the\n  // active content session, in the canvas's active locale, so the canvas previews\n  // picked documents exactly as the host renders them. The studio analog of the\n  // host's baked relations map. A missing/invisible target → null → the block's\n  // own empty state.\n  const resolveRelation: ResolveRelation = useCallback(\n    (ref) => resolveCanvasRelation(ref, activeLocale, perspective),\n    // sessionEpoch: re-resolve when the content session was re-pointed (EC-460).\n    [activeLocale, perspective, sessionEpoch],\n  )\n\n  // EC-255: resolve a listing block's query (a ProductGrid keyed to a category) to\n  // its documents from the active content session, in the canvas's active locale, so\n  // the canvas previews a dynamic grid exactly as the host renders it. The studio\n  // analog of the host's baked listings map; an empty/invalid query → [] → the\n  // block's own empty state.\n  const resolveListing: ResolveListing = useCallback(\n    (query) => resolveCanvasListing(query, activeLocale, perspective),\n    [activeLocale, perspective, sessionEpoch],\n  )\n\n  // EC-291: resolve a rich-text internal link (`{type:'reference'}`) to its target's\n  // URL path from the active content session, in the canvas's active locale — the\n  // studio analog of the host's baked links map. A missing/unpublished/unroutable\n  // target → null → the rich-text renderer shows the visible `unresolved-ref` issue.\n  const resolveLink: ResolveLink = useCallback(\n    (ref) => resolveCanvasLink(ref, activeLocale, perspective),\n    [activeLocale, perspective, sessionEpoch],\n  )\n\n  const unresolvedReuse = useCallback(\n    (node: ComponentNode): 'unpublished' | 'missing' | null =>\n      unresolvedReuseStatus(\n        node,\n        reuse?.capability,\n        (ref, p) => resolveCanvasRelation(ref, activeLocale, p),\n        perspective,\n      ),\n    [reuse, activeLocale, perspective, sessionEpoch],\n  )\n\n  // EC-460 (never-silent): flag a listing whose query is statically invalid\n  // against the active session schema. Pure over the registry + the shared\n  // `listingQueryOf` (the same query builder the renderer/host use), so notice\n  // and resolution can never disagree about WHICH query was judged.\n  const listingIssueOf = useCallback(\n    (node: ComponentNode): string | null => {\n      const manifest = studio.registry.getManifest(node.componentId)\n      if (!manifest?.listing) return null\n      const query = listingQueryOf(node, manifest.listing)\n      if (!query) return null // awaiting the filter pick — the block's own empty state\n      const errors = validateCanvasListingQuery(query)\n      if (errors.length === 0) return null\n      // EC-494: `ContentQueryError` carries a catalog ref, so this notice localizes.\n      return errors.map((error) => contentQueryErrorMessage(error)).join(' ')\n    },\n    [studio, sessionEpoch],\n  )\n\n  const ctx: RenderContext = useMemo(\n    () =>\n      createCanvasRenderContext({\n        registry: studio.registry,\n        implementations: studio.implementations,\n        resolveAsset,\n        resolveRelation,\n        resolveListing,\n        resolveLink,\n        pageNodeIds,\n        selectedId,\n        hoveredId,\n        richEditEpochs,\n        unresolvedReuse,\n        listingIssueOf,\n      }),\n    [studio, resolveAsset, resolveRelation, resolveListing, resolveLink, unresolvedReuse, pageNodeIds, selectedId, hoveredId, richEditEpochs, listingIssueOf],\n  )\n\n  return { ctx, pageNodeIds }\n}\n\n/**\n * In-canvas placeholder for a transcluding embed whose target doesn't resolve\n * (EC-300/AD-16) — shown in place of the empty section so a hard reference never\n * silently vanishes. Rendered INTO the iframe (portal), which carries only the\n * project's stylesheet, so it uses inline styles rather than studio UI classes\n * (the EC-414 AD-B chrome contract), with the `.ec-chrome` containment recipe\n * on its root. Exported for the chrome contract test. The node stays\n * selectable; the inspector's `element` relation chip (EC-296) deep-links to\n * the reusable to edit or publish it.\n */\n/**\n * In-canvas notice for a listing block whose query is statically invalid\n * against the active session schema (EC-460 — the never-silent rule): the\n * message renders ABOVE the block (which keeps its own empty state), so a\n * misdeclared `listing` manifest (non-filterable sort/filter field, unknown\n * collection) is an explicit, visible state — never an empty grid an editor\n * can't tell apart from \"no content yet\". Rendered INTO the iframe (project\n * stylesheet only), so it uses inline styles + the `.ec-chrome` containment\n * recipe, exactly like {@link UnresolvedReusablePlaceholder}. Exported for the\n * chrome contract test.\n */\nexport function CanvasListingIssueNotice({ message }: { message: string }) {\n  return (\n    <div\n      className=\"ec-chrome\"\n      data-testid=\"canvas-listing-issue\"\n      style={{\n        boxSizing: 'border-box',\n        border: '1px dashed rgba(200,140,40,0.65)',\n        borderRadius: 8,\n        padding: '10px 14px',\n        margin: '8px 16px',\n        background: 'rgba(230,160,40,0.08)',\n        color: 'rgba(120,80,10,0.95)',\n        font: '13px/1.5 system-ui, -apple-system, sans-serif',\n      }}\n    >\n      <span style={{ fontWeight: 600 }}>⚠ {translate('builder.canvas.listingInvalidTitle')}</span>{' '}\n      <span style={{ opacity: 0.9 }}>{message}</span>\n    </div>\n  )\n}\n\nexport function UnresolvedReusablePlaceholder({ status }: { status: 'unpublished' | 'missing' }) {\n  const title =\n    status === 'unpublished'\n      ? translate('builder.canvas.reusableUnpublishedTitle')\n      : translate('builder.canvas.reusableMissingTitle')\n  const hint =\n    status === 'unpublished'\n      ? translate('builder.canvas.reusableUnpublishedHint')\n      : translate('builder.canvas.reusableMissingHint')\n  return (\n    <div\n      className=\"ec-chrome\"\n      style={{\n        boxSizing: 'border-box',\n        border: '1px dashed rgba(120,120,120,0.5)',\n        borderRadius: 8,\n        padding: '24px 28px',\n        margin: '12px 16px',\n        background: 'rgba(127,127,127,0.06)',\n        color: 'rgba(90,90,90,0.95)',\n        font: '14px/1.5 system-ui, -apple-system, sans-serif',\n        textAlign: 'center',\n      }}\n    >\n      <div style={{ fontWeight: 600 }}>⚠ {title}</div>\n      <div style={{ marginTop: 6, fontSize: 13, opacity: 0.85 }}>{hint}</div>\n    </div>\n  )\n}\n"]}
+{"version":3,"file":"canvas-render-context.js","sourceRoot":"","sources":["../../../src/components/builder/canvas-render-context.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useMemo, useSyncExternalStore } from 'react'\nimport { resolvedAsset } from '@elytracms/core/content'\nimport type { AssetRecord } from '@elytracms/core/persistence'\nimport { nodeListingOf } from '@elytracms/core/runtime-renderer'\nimport type {\n  ListingQuery,\n  RenderAsset,\n  RenderContext,\n  ResolveAsset,\n  ResolveLink,\n  ResolveListing,\n  ResolveRelation,\n} from '@elytracms/core/runtime-renderer'\nimport type { ContentQueryError } from '@elytracms/core/content'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport type { StudioRegistry } from '@elytracms/studio/lib/registry'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { contentQueryErrorMessage } from '@elytracms/studio/lib/persona/labels'\nimport {\n  acquireContentSessionConsumer,\n  contentSessionEpoch,\n  resolveCanvasLink,\n  resolveCanvasListing,\n  resolveCanvasRelation,\n  subscribeContentSession,\n  validateCanvasListingQuery,\n} from '@elytracms/studio/lib/data'\nimport type { CanvasPerspective } from '@elytracms/studio/lib/data'\nimport { useStudioLocale } from '@elytracms/studio/lib/locale'\nimport { useOptionalAssets } from '../assets/assets-store'\nimport { useReuse } from './reuse-context'\nimport { reuseEmbedRef } from './reuse'\nimport type { ReuseCapability } from './reuse'\n\n/**\n * The canvas's `RenderContext` (EC-330, extracted from `BuilderCanvas`): the\n * injected resolvers that make the iframe preview match delivery — assets\n * (EC-195), relations (EC-254), listings (EC-255), rich-text links (EC-291) —\n * plus the per-node decorator that stamps the editable wrappers (selection/hover\n * state, rich-text remount epochs, and the EC-300 unresolved-reusable\n * placeholder). The binding resolver and the EC-176 locale-fallback chips (which\n * read bound props) went with the data-binding subsystem (EC-574).\n *\n * The context assembly is a pure factory ({@link createCanvasRenderContext})\n * over a pure decision helper ({@link unresolvedReuseStatus}), so the decoration\n * and resolver wiring are unit-testable without providers;\n * {@link useCanvasRenderContext} binds them to the live stores.\n */\n\n/** Collect every node id under a root (the page subtree). */\nexport function collectIds(node: ComponentNode, out: Set<string> = new Set()): Set<string> {\n  out.add(node.id)\n  for (const children of Object.values(node.slots ?? {})) {\n    for (const child of children) collectIds(child, out)\n  }\n  return out\n}\n\n/**\n * EC-300/AD-16: a transcluding embed whose target doesn't resolve in the active\n * perspective renders a placeholder, never an empty section. `unpublished` = the\n * target exists as a draft but isn't live (Published view of a draft-only reusable);\n * `missing` = no resolvable target at all (deleted). `null` = resolves fine, or the\n * node isn't an embed / has no target picked yet (its own empty state owns that).\n */\nexport function unresolvedReuseStatus(\n  node: ComponentNode,\n  capability: ReuseCapability | null | undefined,\n  resolveAt: (ref: { collection: string; id: string }, perspective: CanvasPerspective) => unknown,\n  perspective: CanvasPerspective,\n): 'unpublished' | 'missing' | null {\n  if (!capability) return null\n  const ref = reuseEmbedRef(node, capability)\n  if (!ref) return null\n  if (resolveAt(ref, perspective)) return null\n  return resolveAt(ref, 'draft') ? 'unpublished' : 'missing'\n}\n\n/** Everything the pure context factory needs — resolvers plus decoration state. */\nexport interface CanvasRenderContextDeps {\n  registry: RenderContext['registry']\n  implementations: RenderContext['implementations']\n  resolveAsset: ResolveAsset\n  resolveRelation: ResolveRelation\n  resolveListing: ResolveListing\n  resolveLink: ResolveLink\n  /** Only page nodes are editable; layout chrome must not be decorated. */\n  pageNodeIds: ReadonlySet<string>\n  selectedId: string | null\n  hoveredId: string | null\n  /** Per-node remount epochs from the inline rich-text editing (EC-159). */\n  richEditEpochs: Record<string, number>\n  unresolvedReuse(node: ComponentNode): 'unpublished' | 'missing' | null\n  /**\n   * EC-460 (never-silent): a human-readable message when the node declares a\n   * `listing` whose built query is STATICALLY invalid against the active session\n   * schema (unknown collection, non-filterable filter/sort field) — the canvas\n   * then shows a visible notice above the block instead of an empty grid that\n   * is indistinguishable from \"no content yet\". `null` = healthy (or no listing).\n   */\n  listingIssueOf(node: ComponentNode): string | null\n}\n\n/**\n * The canvas notice for a listing node that cannot run, or `null` (EC-460, the\n * never-silent rule). Reads the shared `nodeListingOf` — the same reader the\n * renderer and the delivery host use — so notice and resolution never disagree\n * about WHICH query was judged. EC-581 6a: a declaration the registry rejected\n * (`invalid-listing`) shows its registration issue; a runnable query is judged by\n * `validate` (the session schema's `validateWhere`/`validateSort`/`validateLimit`);\n * a listing awaiting its bound value keeps the block's own empty state. Pure,\n * exported for the node test.\n */\nexport function canvasListingIssue(\n  node: ComponentNode,\n  registry: RenderContext['registry'],\n  validate: (query: ListingQuery) => readonly ContentQueryError[],\n): string | null {\n  const manifest = registry.getManifest(node.componentId)\n  if (!manifest) return null\n  const listing = nodeListingOf(node, manifest, registry)\n  if (!listing || listing.state === 'awaiting') return null\n  if (listing.state === 'invalid') return listing.messages.join(' ')\n  const errors = validate(listing.query)\n  if (errors.length === 0) return null\n  // EC-494: `ContentQueryError` carries a catalog ref, so this notice localizes.\n  return errors.map((error) => contentQueryErrorMessage(error)).join(' ')\n}\n\n/**\n * Assemble the canvas `RenderContext`. Pure (no hooks): the same deps produce\n * the same context, so the decorator's wrapper markup is pinnable in tests.\n */\nexport function createCanvasRenderContext(deps: CanvasRenderContextDeps): RenderContext {\n  return {\n    registry: deps.registry,\n    implementations: deps.implementations,\n    resolveAsset: deps.resolveAsset,\n    resolveRelation: deps.resolveRelation,\n    resolveListing: deps.resolveListing,\n    resolveLink: deps.resolveLink,\n    decorateNode: (node, rendered) => {\n      if (!deps.pageNodeIds.has(node.id)) return rendered\n      // An unresolved hard reference shows the placeholder in place of the empty\n      // transclusion; the node stays selectable, so its inspector relation chip\n      // (EC-296) deep-links to the reusable to edit/publish it.\n      const unresolved = deps.unresolvedReuse(node)\n      // EC-460: a config-invalid listing query gets a visible notice ABOVE the\n      // block (which keeps its own empty state below) — never a silent empty grid.\n      const listingIssue = deps.listingIssueOf(node)\n      return (\n        <div\n          // The epoch suffix forces a remount after a rich-text editing\n          // session mutated this node's rendered DOM (see richEditEpochs).\n          key={`${node.id}#${deps.richEditEpochs[node.id] ?? 0}`}\n          data-ec-node-id={node.id}\n          className=\"ec-editable\"\n          data-selected={node.id === deps.selectedId || undefined}\n          data-hovered={node.id === deps.hoveredId || undefined}\n        >\n          {unresolved ? (\n            <UnresolvedReusablePlaceholder status={unresolved} />\n          ) : (\n            <>\n              {listingIssue !== null ? <CanvasListingIssueNotice message={listingIssue} /> : null}\n              {rendered}\n            </>\n          )}\n        </div>\n      )\n    },\n  }\n}\n\n/**\n * The live canvas render context: binds the pure factory to the studio's\n * stores (asset library, content session, active locale, reuse capability) for\n * the given perspective. Returns the context plus the page-node id set the\n * canvas also needs for spacing-handle gating.\n */\n/**\n * The canvas's asset reader IS delivery's (NK-049 finding, 2026-10-23). This used to\n * hand-pick `url/width/height/alt/focalPoint`, read `alt` from the legacy column\n * only and drop `meta` — so a component's AI badge (`meta.aiGenerated`) and an\n * editor-set `meta.alt` rendered on the site but not on the canvas. One reader\n * (`resolvedAsset`, `content/assets.ts`) means the canvas and the host cannot\n * disagree about an asset's own facts; `RenderAsset` is a subset of\n * `ResolvedAsset`, `lqip` included. Pure, exported for the node test.\n */\nexport function canvasRenderAsset(record: AssetRecord | undefined): RenderAsset | null {\n  if (!record?.url) return null\n  return resolvedAsset(record, record.url)\n}\n\nexport function useCanvasRenderContext(args: {\n  /** The edited composition root (`builder.present`). */\n  present: ComponentNode\n  selectedId: string | null\n  hoveredId: string | null\n  studio: StudioRegistry\n  perspective: CanvasPerspective\n  richEditEpochs: Record<string, number>\n}): { ctx: RenderContext; pageNodeIds: ReadonlySet<string> } {\n  const { present, selectedId, hoveredId, studio, perspective, richEditEpochs } = args\n\n  // EC-460: the canvas follows the preview content session reactively. The\n  // epoch bumps whenever `configureContentSession` re-points the session (the\n  // write-sync refresh, a CMS-surface hydration, boot) — it keys the resolver\n  // callbacks below, so the context identity changes and the canvas re-renders\n  // against the fresh session. Registering as a CONSUMER tells the write-sync a\n  // preview surface is live, so a stale session actually refreshes (with no\n  // consumer it only flags — connected mode never pays a per-autosave query\n  // while nobody is previewing).\n  const sessionEpoch = useSyncExternalStore(subscribeContentSession, contentSessionEpoch)\n  useEffect(() => acquireContentSessionConsumer(), [])\n\n  // Only page nodes are editable; layout chrome (rendered around the page) is\n  // read-only context and must not be selectable (it isn't in the page tree).\n  const pageNodeIds = useMemo(() => collectIds(present), [present])\n\n  // EC-195: resolve an `asset`-typed Image prop (an asset id) from the live asset\n  // library, so the canvas previews exactly what the host renders. A record\n  // without a resolved url (e.g. a never-served seed) → null → the\n  // implementation's visible empty state.\n  const assetsStore = useOptionalAssets()\n  const resolveAsset: ResolveAsset = useCallback(\n    (assetId) => canvasRenderAsset(assetsStore?.assets.find((a) => a.id === assetId)),\n    [assetsStore],\n  )\n\n  // The canvas's active locale for relation/listing/link resolution below.\n  // EC-479: the ambient locale is `null` until a project's config is installed (it\n  // no longer opens on the engine's `en/de` fixture). `undefined` means \"you pick\" to\n  // the content engine, which then resolves in the SESSION's own default locale —\n  // never a fabricated one — so a canvas mounted outside a CMS session still previews\n  // in the project's locale.\n  const { locale } = useStudioLocale()\n  const activeLocale = locale ?? undefined\n  // EC-300: the reuse capability identifies a transcluding embed + its relation prop,\n  // so the canvas can detect a HARD reference whose target doesn't resolve and show a\n  // placeholder instead of an empty section. Null-safe (no provider / no capability).\n  const reuse = useReuse()\n\n  // EC-254: populate a block's `relation` prop (the editor's document pick — a\n  // ProductGrid's products, a Reusable's element) to delivery shape from the\n  // active content session, in the canvas's active locale, so the canvas previews\n  // picked documents exactly as the host renders them. The studio analog of the\n  // host's baked relations map. A missing/invisible target → null → the block's\n  // own empty state.\n  const resolveRelation: ResolveRelation = useCallback(\n    (ref) => resolveCanvasRelation(ref, activeLocale, perspective),\n    // sessionEpoch: re-resolve when the content session was re-pointed (EC-460).\n    [activeLocale, perspective, sessionEpoch],\n  )\n\n  // EC-255: resolve a listing block's query (a ProductGrid keyed to a category) to\n  // its documents from the active content session, in the canvas's active locale, so\n  // the canvas previews a dynamic grid exactly as the host renders it. The studio\n  // analog of the host's baked listings map; an empty/invalid query → [] → the\n  // block's own empty state.\n  const resolveListing: ResolveListing = useCallback(\n    (query) => resolveCanvasListing(query, activeLocale, perspective),\n    [activeLocale, perspective, sessionEpoch],\n  )\n\n  // EC-291: resolve a rich-text internal link (`{type:'reference'}`) to its target's\n  // URL path from the active content session, in the canvas's active locale — the\n  // studio analog of the host's baked links map. A missing/unpublished/unroutable\n  // target → null → the rich-text renderer shows the visible `unresolved-ref` issue.\n  const resolveLink: ResolveLink = useCallback(\n    (ref) => resolveCanvasLink(ref, activeLocale, perspective),\n    [activeLocale, perspective, sessionEpoch],\n  )\n\n  const unresolvedReuse = useCallback(\n    (node: ComponentNode): 'unpublished' | 'missing' | null =>\n      unresolvedReuseStatus(\n        node,\n        reuse?.capability,\n        (ref, p) => resolveCanvasRelation(ref, activeLocale, p),\n        perspective,\n      ),\n    [reuse, activeLocale, perspective, sessionEpoch],\n  )\n\n  // EC-460 (never-silent): flag a listing that cannot run (see `canvasListingIssue`).\n  const listingIssueOf = useCallback(\n    (node: ComponentNode): string | null =>\n      canvasListingIssue(node, studio.registry, (query) => validateCanvasListingQuery(query)),\n    [studio, sessionEpoch],\n  )\n\n  const ctx: RenderContext = useMemo(\n    () =>\n      createCanvasRenderContext({\n        registry: studio.registry,\n        implementations: studio.implementations,\n        resolveAsset,\n        resolveRelation,\n        resolveListing,\n        resolveLink,\n        pageNodeIds,\n        selectedId,\n        hoveredId,\n        richEditEpochs,\n        unresolvedReuse,\n        listingIssueOf,\n      }),\n    [studio, resolveAsset, resolveRelation, resolveListing, resolveLink, unresolvedReuse, pageNodeIds, selectedId, hoveredId, richEditEpochs, listingIssueOf],\n  )\n\n  return { ctx, pageNodeIds }\n}\n\n/**\n * In-canvas placeholder for a transcluding embed whose target doesn't resolve\n * (EC-300/AD-16) — shown in place of the empty section so a hard reference never\n * silently vanishes. Rendered INTO the iframe (portal), which carries only the\n * project's stylesheet, so it uses inline styles rather than studio UI classes\n * (the EC-414 AD-B chrome contract), with the `.ec-chrome` containment recipe\n * on its root. Exported for the chrome contract test. The node stays\n * selectable; the inspector's `element` relation chip (EC-296) deep-links to\n * the reusable to edit or publish it.\n */\n/**\n * In-canvas notice for a listing block whose query is statically invalid\n * against the active session schema (EC-460 — the never-silent rule): the\n * message renders ABOVE the block (which keeps its own empty state), so a\n * misdeclared `listing` manifest (non-filterable sort/filter field, unknown\n * collection) is an explicit, visible state — never an empty grid an editor\n * can't tell apart from \"no content yet\". Rendered INTO the iframe (project\n * stylesheet only), so it uses inline styles + the `.ec-chrome` containment\n * recipe, exactly like {@link UnresolvedReusablePlaceholder}. Exported for the\n * chrome contract test.\n */\nexport function CanvasListingIssueNotice({ message }: { message: string }) {\n  return (\n    <div\n      className=\"ec-chrome\"\n      data-testid=\"canvas-listing-issue\"\n      style={{\n        boxSizing: 'border-box',\n        border: '1px dashed rgba(200,140,40,0.65)',\n        borderRadius: 8,\n        padding: '10px 14px',\n        margin: '8px 16px',\n        background: 'rgba(230,160,40,0.08)',\n        color: 'rgba(120,80,10,0.95)',\n        font: '13px/1.5 system-ui, -apple-system, sans-serif',\n      }}\n    >\n      <span style={{ fontWeight: 600 }}>⚠ {translate('builder.canvas.listingInvalidTitle')}</span>{' '}\n      <span style={{ opacity: 0.9 }}>{message}</span>\n    </div>\n  )\n}\n\nexport function UnresolvedReusablePlaceholder({ status }: { status: 'unpublished' | 'missing' }) {\n  const title =\n    status === 'unpublished'\n      ? translate('builder.canvas.reusableUnpublishedTitle')\n      : translate('builder.canvas.reusableMissingTitle')\n  const hint =\n    status === 'unpublished'\n      ? translate('builder.canvas.reusableUnpublishedHint')\n      : translate('builder.canvas.reusableMissingHint')\n  return (\n    <div\n      className=\"ec-chrome\"\n      style={{\n        boxSizing: 'border-box',\n        border: '1px dashed rgba(120,120,120,0.5)',\n        borderRadius: 8,\n        padding: '24px 28px',\n        margin: '12px 16px',\n        background: 'rgba(127,127,127,0.06)',\n        color: 'rgba(90,90,90,0.95)',\n        font: '14px/1.5 system-ui, -apple-system, sans-serif',\n        textAlign: 'center',\n      }}\n    >\n      <div style={{ fontWeight: 600 }}>⚠ {title}</div>\n      <div style={{ marginTop: 6, fontSize: 13, opacity: 0.85 }}>{hint}</div>\n    </div>\n  )\n}\n"]}

package/dist/components/builder/canvas.js

@@ -189,7 +189,7 @@ export function BuilderCanvas({ perspective = 'draft', } = {}) {
     // while an inline text/rich-text edit owns the node (EC-406 scope 4) — the
     // [data-ec-editing] outline owns that state, exactly as the selection overlay
     // yields; a content-drag is suppressed inside SpacingHandles via the drag session.
-    const spacingTarget = doc && !editing && hasSpacingHandles(builder.selectedNode) && pageNodeIds.has(builder.selectedNode.id)
+    const spacingTarget = doc && !editing && hasSpacingHandles(builder.selectedNode, builder.layout) && pageNodeIds.has(builder.selectedNode.id)
         ? builder.selectedNode
         : null;
     // EC-250: the preview frame width derives from the config-sourced breakpoints

package/dist/components/builder/canvas.js.map

@@ -1 +1 @@
-{"version":3,"file":"canvas.js","sourceRoot":"","sources":["../../../src/components/builder/canvas.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { renderPageComposition, setEditingMarkers } from '@elytracms/core/runtime-renderer'\nimport { getNode } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport type { CanvasPerspective } from '@elytracms/studio/lib/data'\nimport { resolveDeploymentCanvasTheme } from '@elytracms/studio/lib/workspace'\nimport { wireCanvasChrome } from './canvas-chrome'\nimport type { CanvasThemeStatus } from './canvas-chrome'\nimport { CanvasThemeNotice } from './canvas-theme-notice'\nimport { getCanvasStylesheetUrl } from './canvas-stylesheet'\nimport { useBuilder } from './builder-store'\nimport { useCanvasViewports, viewportWidth } from './canvas-breakpoints'\nimport { nodeIdAt, wrapperAt } from './canvas-dom'\nimport { useCanvasDnd } from './canvas-dnd'\nimport { useCanvasInlineEditing } from './canvas-inline-editing'\nimport { useCanvasRenderContext } from './canvas-render-context'\nimport {\n  ClipboardNoticeOverlay,\n  attachClipboardListeners,\n  useStudioClipboard,\n} from './clipboard-actions'\nimport { RichTextToolbar } from './rich-text-toolbar'\nimport { SpacingHandles, hasSpacingHandles } from './spacing-handles'\nimport { SelectionOverlay } from './selection-overlay'\nimport { attachDeleteKeyListener } from './delete-key'\nimport { usePropSync } from './prop-sync-context'\nimport { resolvePropClick } from './prop-selection'\n\n// EC-408: the studio canvas is the ONE surface that turns editing markers on, so\n// `ecProp` in the base primitives emits `data-ec-prop` here. Delivery\n// (`@elytracms/next`) is a separate build that never imports this module, so its\n// singleton stays off and shipped pages carry zero marker noise. Module-level\n// (not an effect) so markers are on before the first primitive renders.\nsetEditingMarkers(true)\n\n\n/**\n * Iframe-isolated page preview (brief §8.2, EC-061, EC-064). The graph renders\n * into a same-origin iframe via a React portal — true style isolation + true\n * responsive widths. Each node is wrapped with an editable marker so clicks\n * select and hover/selection draw outlines. Native listeners bridge the iframe\n * boundary (React's synthetic events don't cross frames); the two big gesture\n * state machines live in their own tested modules (EC-330): drag & drop in\n * `canvas-dnd`, inline text/rich-text editing in `canvas-inline-editing`, and\n * the render-context assembly in `canvas-render-context`.\n */\nexport function BuilderCanvas({\n  perspective = 'draft',\n}: {\n  /** Resolve references against this perspective (EC-300/AD-16). The editable Draft\n   *  view passes `'draft'` (a just-made reusable shows immediately); the read-only\n   *  Published view passes `'published'` (honest preview of what delivery serves). */\n  perspective?: CanvasPerspective\n} = {}) {\n  const builder = useBuilder()\n  const { dispatch } = builder\n  const studio = getStudioRegistry()\n\n  // The edited composition root, composed for preview. EC-287 retired the project\n  // graph and its published-graph preview; the canvas always renders the live,\n  // editable draft (content publishing is per document).\n  const activeRoot: ComponentNode = builder.present\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n  const [doc, setDoc] = useState<Document | null>(null)\n\n  // Graph/selection refs let the native iframe listeners read the *current*\n  // state without re-subscribing on every edit.\n  const presentRef = useRef(builder.present)\n  presentRef.current = builder.present\n  const selectedIdRef = useRef(builder.selectedId)\n  selectedIdRef.current = builder.selectedId\n\n  // EC-414 AD-D: the settled canvas-theme classification (legacy merged shape /\n  // broken stylesheet) drives the dev-only, never-blocking notice overlay.\n  const [themeStatus, setThemeStatus] = useState<CanvasThemeStatus | null>(null)\n\n  const wireUp = useCallback(() => {\n    const d = iframeRef.current?.contentDocument\n    if (!d || !d.body) return\n    // Deliberately no `.dark` here: this iframe renders the REAL page (plus\n    // studio editing chrome portaled alongside it), and its backdrop must read\n    // as a light, site-like page — never the studio chrome's current theme (a\n    // black canvas is exactly what leaks through when the studio is\n    // dark-themed and the iframe root inherits that class). The injected\n    // canvas stylesheet (new world: the chrome's neutral backdrop; legacy\n    // world: the studio `:root` tokens) supplies that backdrop once `.dark` is\n    // never added here (mirrors the components-preview surface, which wires\n    // through the same chrome). The editing chrome (selection/hover outlines,\n    // drop indicators, the rich-text toolbar, locale-fallback chips) uses\n    // hardcoded colors rather than tokens, so it stays visible against a light\n    // page regardless. The full injection — stylesheet link, editing chrome,\n    // the consumer's `defineStudio({ canvas })` theme (EC-389, injected LAST so\n    // it wins), and the EC-414 world probe — lives in\n    // `wireCanvasChrome`/`applyCanvasChrome`.\n    wireCanvasChrome(d, {\n      stylesheetUrl: getCanvasStylesheetUrl(),\n      theme: resolveDeploymentCanvasTheme(),\n      onStatus: (status) =>\n        setThemeStatus((prev) => (prev?.kind === status.kind ? prev : status)),\n    })\n    setDoc(d)\n  }, [])\n\n  // Handle the already-loaded case (srcDoc may load before onLoad attaches).\n  useEffect(() => {\n    if (iframeRef.current?.contentDocument?.readyState === 'complete') wireUp()\n  }, [wireUp])\n\n  // Inline editing (EC-158/EC-159): the dblclick-to-edit state machine, the\n  // live session ref other listeners consult, the rich-text host (mark\n  // toolbar), and the per-node remount epochs (decorate keys).\n  const inline = useCanvasInlineEditing(doc, { presentRef, dispatch, studio })\n  const { editingRef, richEditHost, richEditEpochs, editing } = inline\n\n  // EC-408: the field↔component sync channel (null in the component preview,\n  // which has no inspector). Read live through a ref — the native iframe\n  // listeners outlive renders.\n  const propSync = usePropSync()\n  const propSyncRef = useRef(propSync)\n  propSyncRef.current = propSync\n\n  // Native selection/hover listeners inside the iframe document.\n  useEffect(() => {\n    if (!doc) return\n    const onClick = (e: Event) => {\n      // Clicks inside the active inline editor are caret moves, not selection.\n      if (editingRef.current?.host.contains(e.target as Node)) return\n      const wrapper = wrapperAt(e.target)\n      if (!wrapper) return\n      const id = wrapper.getAttribute('data-ec-node-id')!\n      e.preventDefault()\n      dispatch({ type: 'select', id })\n      // EC-408: resolve the clicked sub-part to its `data-ec-prop` and, unless it\n      // is inline-editable (inline editing stays primary), ask the inspector to\n      // focus that prop's control. Unannotated components resolve no marker → the\n      // node-level select above is the whole behavior, exactly as before.\n      const sync = propSyncRef.current\n      if (!sync) return\n      const node = getNode(presentRef.current, id)\n      const manifest = node ? studio.registry.getManifest(node.componentId) : undefined\n      const { propName, focusField } = resolvePropClick({\n        target: e.target as Element | null,\n        wrapper,\n        manifest,\n      })\n      if (propName && focusField) sync.requestFocus({ nodeId: id, propName })\n    }\n    const onOver = (e: Event) => dispatch({ type: 'hover', id: nodeIdAt(e.target) })\n    const onLeave = () => dispatch({ type: 'hover', id: null })\n    doc.addEventListener('click', onClick, true)\n    doc.addEventListener('mouseover', onOver)\n    doc.addEventListener('mouseleave', onLeave, true)\n    return () => {\n      doc.removeEventListener('click', onClick, true)\n      doc.removeEventListener('mouseover', onOver)\n      doc.removeEventListener('mouseleave', onLeave, true)\n    }\n  }, [doc, dispatch, editingRef, presentRef, studio])\n\n  // Drag & drop on the canvas (EC-160/EC-162) — see `canvas-dnd`.\n  // EC-554: the field's top-level `allow` rides with the store (`builder.field`).\n  useCanvasDnd(doc, { presentRef, dispatch, studio, editingRef, fieldAllow: builder.field.allow })\n\n  // Copy/cut/paste on the canvas (EC-175): the same studio clipboard the page\n  // tree and blocks panel use, wired to the *iframe* document (events never\n  // cross frames). Shortcuts stay inert while an inline editor is live and in\n  // form fields; the iframe's own navigator.clipboard does the async I/O\n  // (Chromium scopes clipboard access to the focused document).\n  const clipboard = useStudioClipboard()\n  useEffect(() => {\n    if (!doc) return\n    return attachClipboardListeners(doc, {\n      clipboard,\n      getSelectedId: () => selectedIdRef.current,\n      isBlocked: () => editingRef.current !== null,\n      asyncClipboard: doc.defaultView?.navigator.clipboard,\n      getSelection: () => doc.getSelection(),\n    })\n  }, [doc, clipboard, editingRef])\n\n  // Delete/Backspace removes the selected node (EC-404) — the keyboard remove\n  // the studio was missing, wired beside the clipboard listeners on the iframe\n  // document, guarded so typing in an inline editor edits text instead.\n  useEffect(() => {\n    if (!doc) return\n    return attachDeleteKeyListener(doc, {\n      getSelectedId: () => selectedIdRef.current,\n      remove: (id) => dispatch({ type: 'remove', id }),\n      getRootId: () => presentRef.current.id,\n    })\n  }, [doc, dispatch])\n\n  // The render context: the seven delivery-parity resolvers + the editable-\n  // wrapper decorator (selection/hover, locale chips, remount epochs) — see\n  // `canvas-render-context`.\n  const { ctx, pageNodeIds } = useCanvasRenderContext({\n    present: builder.present,\n    selectedId: builder.selectedId,\n    hoveredId: builder.hoveredId,\n    studio,\n    perspective,\n    richEditEpochs,\n  })\n\n  // Tokenized spacing handles (EC-163): a selected Stack/Grid with 2+ children\n  // gets draggable gap handles between them, portaled into the iframe. Suppressed\n  // while an inline text/rich-text edit owns the node (EC-406 scope 4) — the\n  // [data-ec-editing] outline owns that state, exactly as the selection overlay\n  // yields; a content-drag is suppressed inside SpacingHandles via the drag session.\n  const spacingTarget =\n    doc && !editing && hasSpacingHandles(builder.selectedNode) && pageNodeIds.has(builder.selectedNode.id)\n      ? builder.selectedNode\n      : null\n\n  // EC-250: the preview frame width derives from the config-sourced breakpoints\n  // (Tailwind defaults when unconfigured), the same resolved set the toolbar\n  // switcher offers.\n  const { viewports } = useCanvasViewports()\n\n  return (\n    <div className=\"canvas-grid relative flex min-h-0 flex-1 items-stretch justify-center overflow-auto p-6\">\n      {/* Copy/cut/paste outcomes (EC-175): non-blocking, with issue deep links. */}\n      <ClipboardNoticeOverlay />\n      {/* Canvas-theme classification notice (EC-414 AD-D): dev-only, never blocks. */}\n      <CanvasThemeNotice status={themeStatus} />\n      <div style={{ width: viewportWidth(viewports, builder.viewport), maxWidth: '100%' }} className=\"flex\">\n        <iframe\n          ref={iframeRef}\n          onLoad={wireUp}\n          title={translate('builder.canvas.pagePreview')}\n          className=\"min-h-[480px] w-full rounded-lg border border-border bg-background shadow-md\"\n          srcDoc=\"<!doctype html><html><head></head><body></body></html>\"\n        />\n        {doc\n          ? createPortal(\n              // Render the composition root directly (EC-287: no layout\n              // indirection — a page renders its blocks).\n              renderPageComposition(activeRoot, ctx),\n              doc.body,\n            )\n          : null}\n        {/* Selection/hover frames + frame controls, topmost over the page (EC-404). */}\n        {doc ? <SelectionOverlay doc={doc} editing={editing} /> : null}\n        {spacingTarget && doc ? (\n          <SpacingHandles key={spacingTarget.id} doc={doc} node={spacingTarget} />\n        ) : null}\n        {/* Floating mark toolbar for the live rich-text session (EC-159). */}\n        {richEditHost && doc ? <RichTextToolbar doc={doc} host={richEditHost} /> : null}\n      </div>\n    </div>\n  )\n}\n"]}
+{"version":3,"file":"canvas.js","sourceRoot":"","sources":["../../../src/components/builder/canvas.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { renderPageComposition, setEditingMarkers } from '@elytracms/core/runtime-renderer'\nimport { getNode } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport type { CanvasPerspective } from '@elytracms/studio/lib/data'\nimport { resolveDeploymentCanvasTheme } from '@elytracms/studio/lib/workspace'\nimport { wireCanvasChrome } from './canvas-chrome'\nimport type { CanvasThemeStatus } from './canvas-chrome'\nimport { CanvasThemeNotice } from './canvas-theme-notice'\nimport { getCanvasStylesheetUrl } from './canvas-stylesheet'\nimport { useBuilder } from './builder-store'\nimport { useCanvasViewports, viewportWidth } from './canvas-breakpoints'\nimport { nodeIdAt, wrapperAt } from './canvas-dom'\nimport { useCanvasDnd } from './canvas-dnd'\nimport { useCanvasInlineEditing } from './canvas-inline-editing'\nimport { useCanvasRenderContext } from './canvas-render-context'\nimport {\n  ClipboardNoticeOverlay,\n  attachClipboardListeners,\n  useStudioClipboard,\n} from './clipboard-actions'\nimport { RichTextToolbar } from './rich-text-toolbar'\nimport { SpacingHandles, hasSpacingHandles } from './spacing-handles'\nimport { SelectionOverlay } from './selection-overlay'\nimport { attachDeleteKeyListener } from './delete-key'\nimport { usePropSync } from './prop-sync-context'\nimport { resolvePropClick } from './prop-selection'\n\n// EC-408: the studio canvas is the ONE surface that turns editing markers on, so\n// `ecProp` in the base primitives emits `data-ec-prop` here. Delivery\n// (`@elytracms/next`) is a separate build that never imports this module, so its\n// singleton stays off and shipped pages carry zero marker noise. Module-level\n// (not an effect) so markers are on before the first primitive renders.\nsetEditingMarkers(true)\n\n\n/**\n * Iframe-isolated page preview (brief §8.2, EC-061, EC-064). The graph renders\n * into a same-origin iframe via a React portal — true style isolation + true\n * responsive widths. Each node is wrapped with an editable marker so clicks\n * select and hover/selection draw outlines. Native listeners bridge the iframe\n * boundary (React's synthetic events don't cross frames); the two big gesture\n * state machines live in their own tested modules (EC-330): drag & drop in\n * `canvas-dnd`, inline text/rich-text editing in `canvas-inline-editing`, and\n * the render-context assembly in `canvas-render-context`.\n */\nexport function BuilderCanvas({\n  perspective = 'draft',\n}: {\n  /** Resolve references against this perspective (EC-300/AD-16). The editable Draft\n   *  view passes `'draft'` (a just-made reusable shows immediately); the read-only\n   *  Published view passes `'published'` (honest preview of what delivery serves). */\n  perspective?: CanvasPerspective\n} = {}) {\n  const builder = useBuilder()\n  const { dispatch } = builder\n  const studio = getStudioRegistry()\n\n  // The edited composition root, composed for preview. EC-287 retired the project\n  // graph and its published-graph preview; the canvas always renders the live,\n  // editable draft (content publishing is per document).\n  const activeRoot: ComponentNode = builder.present\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n  const [doc, setDoc] = useState<Document | null>(null)\n\n  // Graph/selection refs let the native iframe listeners read the *current*\n  // state without re-subscribing on every edit.\n  const presentRef = useRef(builder.present)\n  presentRef.current = builder.present\n  const selectedIdRef = useRef(builder.selectedId)\n  selectedIdRef.current = builder.selectedId\n\n  // EC-414 AD-D: the settled canvas-theme classification (legacy merged shape /\n  // broken stylesheet) drives the dev-only, never-blocking notice overlay.\n  const [themeStatus, setThemeStatus] = useState<CanvasThemeStatus | null>(null)\n\n  const wireUp = useCallback(() => {\n    const d = iframeRef.current?.contentDocument\n    if (!d || !d.body) return\n    // Deliberately no `.dark` here: this iframe renders the REAL page (plus\n    // studio editing chrome portaled alongside it), and its backdrop must read\n    // as a light, site-like page — never the studio chrome's current theme (a\n    // black canvas is exactly what leaks through when the studio is\n    // dark-themed and the iframe root inherits that class). The injected\n    // canvas stylesheet (new world: the chrome's neutral backdrop; legacy\n    // world: the studio `:root` tokens) supplies that backdrop once `.dark` is\n    // never added here (mirrors the components-preview surface, which wires\n    // through the same chrome). The editing chrome (selection/hover outlines,\n    // drop indicators, the rich-text toolbar, locale-fallback chips) uses\n    // hardcoded colors rather than tokens, so it stays visible against a light\n    // page regardless. The full injection — stylesheet link, editing chrome,\n    // the consumer's `defineStudio({ canvas })` theme (EC-389, injected LAST so\n    // it wins), and the EC-414 world probe — lives in\n    // `wireCanvasChrome`/`applyCanvasChrome`.\n    wireCanvasChrome(d, {\n      stylesheetUrl: getCanvasStylesheetUrl(),\n      theme: resolveDeploymentCanvasTheme(),\n      onStatus: (status) =>\n        setThemeStatus((prev) => (prev?.kind === status.kind ? prev : status)),\n    })\n    setDoc(d)\n  }, [])\n\n  // Handle the already-loaded case (srcDoc may load before onLoad attaches).\n  useEffect(() => {\n    if (iframeRef.current?.contentDocument?.readyState === 'complete') wireUp()\n  }, [wireUp])\n\n  // Inline editing (EC-158/EC-159): the dblclick-to-edit state machine, the\n  // live session ref other listeners consult, the rich-text host (mark\n  // toolbar), and the per-node remount epochs (decorate keys).\n  const inline = useCanvasInlineEditing(doc, { presentRef, dispatch, studio })\n  const { editingRef, richEditHost, richEditEpochs, editing } = inline\n\n  // EC-408: the field↔component sync channel (null in the component preview,\n  // which has no inspector). Read live through a ref — the native iframe\n  // listeners outlive renders.\n  const propSync = usePropSync()\n  const propSyncRef = useRef(propSync)\n  propSyncRef.current = propSync\n\n  // Native selection/hover listeners inside the iframe document.\n  useEffect(() => {\n    if (!doc) return\n    const onClick = (e: Event) => {\n      // Clicks inside the active inline editor are caret moves, not selection.\n      if (editingRef.current?.host.contains(e.target as Node)) return\n      const wrapper = wrapperAt(e.target)\n      if (!wrapper) return\n      const id = wrapper.getAttribute('data-ec-node-id')!\n      e.preventDefault()\n      dispatch({ type: 'select', id })\n      // EC-408: resolve the clicked sub-part to its `data-ec-prop` and, unless it\n      // is inline-editable (inline editing stays primary), ask the inspector to\n      // focus that prop's control. Unannotated components resolve no marker → the\n      // node-level select above is the whole behavior, exactly as before.\n      const sync = propSyncRef.current\n      if (!sync) return\n      const node = getNode(presentRef.current, id)\n      const manifest = node ? studio.registry.getManifest(node.componentId) : undefined\n      const { propName, focusField } = resolvePropClick({\n        target: e.target as Element | null,\n        wrapper,\n        manifest,\n      })\n      if (propName && focusField) sync.requestFocus({ nodeId: id, propName })\n    }\n    const onOver = (e: Event) => dispatch({ type: 'hover', id: nodeIdAt(e.target) })\n    const onLeave = () => dispatch({ type: 'hover', id: null })\n    doc.addEventListener('click', onClick, true)\n    doc.addEventListener('mouseover', onOver)\n    doc.addEventListener('mouseleave', onLeave, true)\n    return () => {\n      doc.removeEventListener('click', onClick, true)\n      doc.removeEventListener('mouseover', onOver)\n      doc.removeEventListener('mouseleave', onLeave, true)\n    }\n  }, [doc, dispatch, editingRef, presentRef, studio])\n\n  // Drag & drop on the canvas (EC-160/EC-162) — see `canvas-dnd`.\n  // EC-554: the field's top-level `allow` rides with the store (`builder.field`).\n  useCanvasDnd(doc, { presentRef, dispatch, studio, editingRef, fieldAllow: builder.field.allow })\n\n  // Copy/cut/paste on the canvas (EC-175): the same studio clipboard the page\n  // tree and blocks panel use, wired to the *iframe* document (events never\n  // cross frames). Shortcuts stay inert while an inline editor is live and in\n  // form fields; the iframe's own navigator.clipboard does the async I/O\n  // (Chromium scopes clipboard access to the focused document).\n  const clipboard = useStudioClipboard()\n  useEffect(() => {\n    if (!doc) return\n    return attachClipboardListeners(doc, {\n      clipboard,\n      getSelectedId: () => selectedIdRef.current,\n      isBlocked: () => editingRef.current !== null,\n      asyncClipboard: doc.defaultView?.navigator.clipboard,\n      getSelection: () => doc.getSelection(),\n    })\n  }, [doc, clipboard, editingRef])\n\n  // Delete/Backspace removes the selected node (EC-404) — the keyboard remove\n  // the studio was missing, wired beside the clipboard listeners on the iframe\n  // document, guarded so typing in an inline editor edits text instead.\n  useEffect(() => {\n    if (!doc) return\n    return attachDeleteKeyListener(doc, {\n      getSelectedId: () => selectedIdRef.current,\n      remove: (id) => dispatch({ type: 'remove', id }),\n      getRootId: () => presentRef.current.id,\n    })\n  }, [doc, dispatch])\n\n  // The render context: the seven delivery-parity resolvers + the editable-\n  // wrapper decorator (selection/hover, locale chips, remount epochs) — see\n  // `canvas-render-context`.\n  const { ctx, pageNodeIds } = useCanvasRenderContext({\n    present: builder.present,\n    selectedId: builder.selectedId,\n    hoveredId: builder.hoveredId,\n    studio,\n    perspective,\n    richEditEpochs,\n  })\n\n  // Tokenized spacing handles (EC-163): a selected Stack/Grid with 2+ children\n  // gets draggable gap handles between them, portaled into the iframe. Suppressed\n  // while an inline text/rich-text edit owns the node (EC-406 scope 4) — the\n  // [data-ec-editing] outline owns that state, exactly as the selection overlay\n  // yields; a content-drag is suppressed inside SpacingHandles via the drag session.\n  const spacingTarget =\n    doc && !editing && hasSpacingHandles(builder.selectedNode, builder.layout) && pageNodeIds.has(builder.selectedNode.id)\n      ? builder.selectedNode\n      : null\n\n  // EC-250: the preview frame width derives from the config-sourced breakpoints\n  // (Tailwind defaults when unconfigured), the same resolved set the toolbar\n  // switcher offers.\n  const { viewports } = useCanvasViewports()\n\n  return (\n    <div className=\"canvas-grid relative flex min-h-0 flex-1 items-stretch justify-center overflow-auto p-6\">\n      {/* Copy/cut/paste outcomes (EC-175): non-blocking, with issue deep links. */}\n      <ClipboardNoticeOverlay />\n      {/* Canvas-theme classification notice (EC-414 AD-D): dev-only, never blocks. */}\n      <CanvasThemeNotice status={themeStatus} />\n      <div style={{ width: viewportWidth(viewports, builder.viewport), maxWidth: '100%' }} className=\"flex\">\n        <iframe\n          ref={iframeRef}\n          onLoad={wireUp}\n          title={translate('builder.canvas.pagePreview')}\n          className=\"min-h-[480px] w-full rounded-lg border border-border bg-background shadow-md\"\n          srcDoc=\"<!doctype html><html><head></head><body></body></html>\"\n        />\n        {doc\n          ? createPortal(\n              // Render the composition root directly (EC-287: no layout\n              // indirection — a page renders its blocks).\n              renderPageComposition(activeRoot, ctx),\n              doc.body,\n            )\n          : null}\n        {/* Selection/hover frames + frame controls, topmost over the page (EC-404). */}\n        {doc ? <SelectionOverlay doc={doc} editing={editing} /> : null}\n        {spacingTarget && doc ? (\n          <SpacingHandles key={spacingTarget.id} doc={doc} node={spacingTarget} />\n        ) : null}\n        {/* Floating mark toolbar for the live rich-text session (EC-159). */}\n        {richEditHost && doc ? <RichTextToolbar doc={doc} host={richEditHost} /> : null}\n      </div>\n    </div>\n  )\n}\n"]}

package/dist/components/builder/clipboard-actions.d.ts

@@ -70,12 +70,6 @@ export interface StudioClipboard {
     pasteFromClipboard(anchorId?: string | null, asyncClipboard?: AsyncClipboard): Promise<void>;
 }
 export declare function useStudioClipboard(): StudioClipboard;
-/**
- * The visible reason a refused paste shows (EC-545) — pure, so the notice
- * wording per refusal is pinned without mounting the hook. EC-554: a field-leash
- * refusal names the FIELD (`fieldLabel`), never the invisible synthetic root's
- * slot — the rejection carries no destination label to misuse.
- */
 export declare function pasteRejectionMessage(rejection: PasteRejection, fieldLabel: string): string;
 export interface ClipboardListenerOptions {
     clipboard: StudioClipboard;

package/dist/components/builder/clipboard-actions.js

@@ -5,7 +5,7 @@ import { cloneWithNewIds } from '@elytracms/core/project-graph';
 import { buildFragmentFromComposition } from '@elytracms/core/clipboard';
 import { readFragmentFromClipboard, readFragmentFromDataTransfer, resolvePasteTarget, diffPastedSubtree, pasteSummaryMessage, writeFragmentToClipboard, writeFragmentToDataTransfer, } from '@elytracms/studio/lib/clipboard';
 import { getStudioRegistry } from '@elytracms/studio/lib/registry';
-import { clipboardErrorMessage, shortId } from '@elytracms/studio/lib/persona/labels';
+import { clipboardErrorMessage, componentDisplayName } from '@elytracms/studio/lib/persona/labels';
 import { translate } from '@elytracms/studio/lib/i18n';
 import { useProjectSession } from '../project-session.js';
 import { Badge, Row, Text } from '@elytracms/studio/ui';
@@ -63,7 +63,8 @@ export function useStudioClipboard() {
                 publishClipboardNotice({ kind: 'error', message: clipboardErrorMessage(built.error) });
                 return null;
             }
-            return { fragment: built.fragment, label: shortId(built.fragment.payload.root.componentId) };
+            const rootId = built.fragment.payload.root.componentId;
+            return { fragment: built.fragment, label: componentDisplayName(rootId, getStudioRegistry().registry.getManifest(rootId)) };
         };
         const write = (fragment, label, kind, dt, asyncClipboard) => {
             if (dt) {
@@ -161,15 +162,19 @@ export function useStudioClipboard() {
  * refusal names the FIELD (`fieldLabel`), never the invisible synthetic root's
  * slot — the rejection carries no destination label to misuse.
  */
+/** A component's label in a notice — its manifest title (EC-591: never a stripped id prefix). */
+function componentLabel(componentId) {
+    return componentDisplayName(componentId, getStudioRegistry().registry.getManifest(componentId));
+}
 export function pasteRejectionMessage(rejection, fieldLabel) {
     if (rejection.code === 'field-not-allowed') {
         return translate('builder.clipboard.notAllowedByField', {
-            component: shortId(rejection.componentId),
+            component: componentLabel(rejection.componentId),
             field: fieldLabel,
         });
     }
     return translate('builder.clipboard.notAllowed', {
-        component: shortId(rejection.componentId),
+        component: componentLabel(rejection.componentId),
         destination: rejection.destinationLabel,
     });
 }

package/dist/components/builder/clipboard-actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"clipboard-actions.js","sourceRoot":"","sources":["../../../src/components/builder/clipboard-actions.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useRef, useSyncExternalStore } from 'react'\nimport { AlertTriangle, CircleCheck, Crosshair, X } from 'lucide-react'\nimport { cloneWithNewIds } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { buildFragmentFromComposition } from '@elytracms/core/clipboard'\nimport type { ClipboardFragment, ParseFragmentResult } from '@elytracms/core/clipboard'\nimport {\n  readFragmentFromClipboard,\n  readFragmentFromDataTransfer,\n  resolvePasteTarget,\n  diffPastedSubtree,\n  pasteSummaryMessage,\n  writeFragmentToClipboard,\n  writeFragmentToDataTransfer,\n} from '@elytracms/studio/lib/clipboard'\nimport type { AsyncClipboard, PasteIssue, PasteRejection } from '@elytracms/studio/lib/clipboard'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { clipboardErrorMessage, shortId } from '@elytracms/studio/lib/persona/labels'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useProjectSession } from '../project-session'\nimport { Badge, Row, Text } from '@elytracms/studio/ui'\nimport { makeNodeIdCounter, useBuilder } from './builder-store'\n\n/**\n * Copy/cut/paste everywhere (EC-175, vision 3.3/3.7).\n *\n * One hook ({@link useStudioClipboard}) backs every affordance — canvas\n * keyboard shortcuts (wired inside the iframe by the canvas), page-tree\n * shortcuts and row buttons, and the blocks panel's \"copy exact\n * configuration\" — so they all produce/consume the same EC-174 fragment via\n * the OS clipboard (`lib/clipboard/os-clipboard`), never an app-internal\n * buffer. That is what makes paste work across documents, pages, projects,\n * and browser tabs.\n *\n * Dispatch contract: a paste is exactly ONE `insert` action (the fragment\n * root is a single subtree) → one history entry → one mirrored\n * `graph.insertNode` command — one undo step removes everything the paste\n * inserted. A cut is copy + exactly one `remove`; one undo restores it.\n *\n * Paste is PERMISSIVE: missing components and unresolvable bindings insert\n * anyway (the renderer's fallbacks keep them visible) and surface in a\n * notice — \"Pasted — 2 bindings unresolved, 1 component missing\" — whose\n * issues deep-link to the inserted nodes. Only structurally invalid clipboard\n * content is reported as a non-blocking error, never a crash or silent no-op.\n *\n * The one thing paste REFUSES is the leash: a pasted root the resolved slot's\n * `allow` excludes (EC-545), or — landing as a direct child of the composition\n * root — the composition field's top-level `allow` excludes (EC-554), is\n * rejected with a visible notice and no dispatch — the same verdict\n * drag-and-drop gives. Permissiveness is about what the target project can\n * *resolve*; the leash is what the component and field authors *declared*.\n */\n\n// ---------------------------------------------------------------------------\n// Notice store — module-level pub/sub (the drag-session pattern) so any\n// surface can publish and the canvas overlay renders it.\n// ---------------------------------------------------------------------------\n\nexport type ClipboardNotice =\n  | { kind: 'copied'; label: string }\n  | { kind: 'cut'; label: string }\n  | { kind: 'pasted'; summary: string; destinationLabel: string; issues: PasteIssue[] }\n  | { kind: 'error'; message: string }\n\nlet currentNotice: ClipboardNotice | null = null\nconst noticeListeners = new Set<() => void>()\n\nexport function publishClipboardNotice(notice: ClipboardNotice | null): void {\n  currentNotice = notice\n  for (const listener of [...noticeListeners]) listener()\n}\n\nfunction subscribeNotice(listener: () => void): () => void {\n  noticeListeners.add(listener)\n  return () => noticeListeners.delete(listener)\n}\n\nfunction getNotice(): ClipboardNotice | null {\n  return currentNotice\n}\n\nexport function useClipboardNotice(): ClipboardNotice | null {\n  return useSyncExternalStore(subscribeNotice, getNotice, getNotice)\n}\n\n// ---------------------------------------------------------------------------\n// Shortcut scoping\n// ---------------------------------------------------------------------------\n\n/**\n * Whether a clipboard shortcut/event must stay inert for this target: form\n * fields and any contenteditable (which includes the EC-158/EC-159 inline\n * editors) own their own native clipboard behaviour.\n */\nexport function clipboardEventBlocked(target: EventTarget | null): boolean {\n  const el = target as HTMLElement | null\n  if (!el) return false\n  const tag = el.tagName\n  if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT') return true\n  if (typeof el.closest === 'function' && el.closest('[contenteditable]')) return true\n  return el.isContentEditable === true\n}\n\n// ---------------------------------------------------------------------------\n// The clipboard surface\n// ---------------------------------------------------------------------------\n\nexport interface StudioClipboard {\n  /**\n   * Copy a canvas/tree node's subtree. Writes synchronously when a\n   * ClipboardEvent's DataTransfer is given, else via the async Clipboard API\n   * (`asyncClipboard` lets the canvas pass the iframe's own navigator —\n   * Chromium scopes clipboard access to the *focused* document).\n   */\n  copyNode(nodeId: string, dt?: DataTransfer | null, asyncClipboard?: AsyncClipboard): void\n  /** Copy, then remove the source in exactly one dispatch (one undo restores). */\n  cutNode(nodeId: string, dt?: DataTransfer | null, asyncClipboard?: AsyncClipboard): void\n  /** Copy a prebuilt fragment (blocks-panel \"copy exact configuration\"). */\n  copyFragment(fragment: ClipboardFragment, label: string): void\n  /** Paste from a paste event's DataTransfer (no permissions needed). */\n  pasteFromDataTransfer(dt: DataTransfer, anchorId?: string | null): void\n  /** Paste via the async Clipboard API (explicit affordances + shortcuts). */\n  pasteFromClipboard(anchorId?: string | null, asyncClipboard?: AsyncClipboard): Promise<void>\n}\n\nexport function useStudioClipboard(): StudioClipboard {\n  const builder = useBuilder()\n  const { projectId } = useProjectSession()\n  const studio = getStudioRegistry()\n\n  // Event listeners outlive renders; refs keep them on the current state.\n  const stateRef = useRef({ builder, projectId })\n  stateRef.current = { builder, projectId }\n\n  return useMemo<StudioClipboard>(() => {\n    const fragmentFor = (nodeId: string): { fragment: ClipboardFragment; label: string } | null => {\n      const { builder: b, projectId } = stateRef.current\n      const built = buildFragmentFromComposition(b.present, nodeId, { source: { projectId } })\n      if (!built.ok) {\n        // EC-494: the engine's clipboard errors carry a catalog ref, so the notice\n        // reads in the active studio locale instead of English inside German chrome.\n        publishClipboardNotice({ kind: 'error', message: clipboardErrorMessage(built.error) })\n        return null\n      }\n      return { fragment: built.fragment, label: shortId(built.fragment.payload.root.componentId) }\n    }\n\n    const write = (\n      fragment: ClipboardFragment,\n      label: string,\n      kind: 'copied' | 'cut',\n      dt?: DataTransfer | null,\n      asyncClipboard?: AsyncClipboard,\n    ): void => {\n      if (dt) {\n        writeFragmentToDataTransfer(dt, fragment)\n        publishClipboardNotice({ kind, label })\n        return\n      }\n      writeFragmentToClipboard(asyncClipboard ?? navigator.clipboard, fragment)\n        .then(() => publishClipboardNotice({ kind, label }))\n        .catch((cause: unknown) => {\n          const detail = cause instanceof Error ? cause.message : String(cause)\n          publishClipboardNotice({ kind: 'error', message: translate('builder.clipboard.writeError', { detail }) })\n        })\n    }\n\n    const currentRoot = (): ComponentNode | undefined => {\n      const { builder: b } = stateRef.current\n      return b.present\n    }\n\n    const applyPaste = (result: ParseFragmentResult, anchorId?: string | null): void => {\n      const { builder: b } = stateRef.current\n      if (!result.ok) {\n        publishClipboardNotice({ kind: 'error', message: clipboardErrorMessage(result.error) })\n        return\n      }\n      const root = currentRoot()\n      if (!root) return\n      const resolution = resolvePasteTarget({\n        root,\n        anchorId: anchorId !== undefined ? anchorId : b.selectedId,\n        componentId: result.fragment.payload.root.componentId,\n        getManifest: (id) => studio.registry.getManifest(id),\n        // EC-554: the composition field's top-level vocabulary, from the store.\n        fieldAllow: b.field.allow,\n      })\n      if (!resolution.ok) {\n        // EC-545 / EC-554: the slot leash or the field leash refuses the pasted\n        // root — the same verdict a drop gets, made visible. Nothing is dispatched.\n        publishClipboardNotice({ kind: 'error', message: pasteRejectionMessage(resolution, b.field.label) })\n        return\n      }\n      const { target, destinationLabel } = resolution\n      // Mirror the reducer's deterministic re-id so the issue deep links point\n      // at exactly the node ids the inserted subtree will carry — the SAME counter\n      // the reducer uses (`makeNodeIdCounter`), so the mirror can never diverge.\n      const inserted = cloneWithNewIds(result.fragment.payload.root, makeNodeIdCounter(b.nodeSeq).genId)\n      // ONE dispatch: one history entry, one graph.insertNode command, one undo.\n      b.dispatch({ type: 'insert', target, node: result.fragment.payload.root })\n      const diff = diffPastedSubtree({\n        node: inserted,\n        hasComponent: (id) => studio.registry.getManifest(id) !== undefined,\n      })\n      publishClipboardNotice({\n        kind: 'pasted',\n        summary: pasteSummaryMessage(diff),\n        destinationLabel,\n        issues: diff.issues,\n      })\n    }\n\n    return {\n      copyNode(nodeId, dt, asyncClipboard) {\n        const built = fragmentFor(nodeId)\n        if (built) write(built.fragment, built.label, 'copied', dt, asyncClipboard)\n      },\n      cutNode(nodeId, dt, asyncClipboard) {\n        const { builder: b } = stateRef.current\n        const root = currentRoot()\n        if (root && nodeId === root.id) {\n          publishClipboardNotice({ kind: 'error', message: translate('builder.clipboard.rootCannotBeCut') })\n          return\n        }\n        const built = fragmentFor(nodeId)\n        if (!built) return\n        write(built.fragment, built.label, 'cut', dt, asyncClipboard)\n        // Exactly one structural dispatch: a single undo restores the cut node.\n        b.dispatch({ type: 'remove', id: nodeId })\n      },\n      copyFragment(fragment, label) {\n        write(fragment, label, 'copied')\n      },\n      pasteFromDataTransfer(dt, anchorId) {\n        applyPaste(readFragmentFromDataTransfer(dt), anchorId)\n      },\n      async pasteFromClipboard(anchorId, asyncClipboard) {\n        applyPaste(await readFragmentFromClipboard(asyncClipboard ?? navigator.clipboard), anchorId)\n      },\n    }\n  }, [studio])\n}\n\n/**\n * The visible reason a refused paste shows (EC-545) — pure, so the notice\n * wording per refusal is pinned without mounting the hook. EC-554: a field-leash\n * refusal names the FIELD (`fieldLabel`), never the invisible synthetic root's\n * slot — the rejection carries no destination label to misuse.\n */\nexport function pasteRejectionMessage(rejection: PasteRejection, fieldLabel: string): string {\n  if (rejection.code === 'field-not-allowed') {\n    return translate('builder.clipboard.notAllowedByField', {\n      component: shortId(rejection.componentId),\n      field: fieldLabel,\n    })\n  }\n  return translate('builder.clipboard.notAllowed', {\n    component: shortId(rejection.componentId),\n    destination: rejection.destinationLabel,\n  })\n}\n\n// ---------------------------------------------------------------------------\n// Listener wiring — one implementation for the page-tree window and the\n// canvas iframe document (events never cross the frame boundary).\n// ---------------------------------------------------------------------------\n\nexport interface ClipboardListenerOptions {\n  clipboard: StudioClipboard\n  /** Current selection: the copy/cut subject and the paste anchor. */\n  getSelectedId: () => string | null\n  /** Extra guard (e.g. the canvas's live inline-edit session). */\n  isBlocked?: (target: EventTarget | null) => boolean\n  /** The async Clipboard API of the listening document's own window. */\n  asyncClipboard?: AsyncClipboard\n  /** The listening document's selection — real text selections stay native. */\n  getSelection?: () => Selection | null\n}\n\ninterface ListenerTarget {\n  addEventListener(type: string, listener: (e: Event) => void): void\n  removeEventListener(type: string, listener: (e: Event) => void): void\n}\n\n/**\n * Wire Cmd/Ctrl+C/X/V plus native copy/cut/paste ClipboardEvents.\n *\n * Shortcuts are handled on `keydown` (a selected node has no text selection,\n * so the browser would not fire native clipboard events for it); the\n * `preventDefault` there suppresses the native event, so the ClipboardEvent\n * listeners only ever see *other* triggers — context-menu copy/paste and\n * synthetic events — and the two paths can never double-handle one gesture.\n * Everything stays inert in form fields and inside the inline editors.\n */\nexport function attachClipboardListeners(target: ListenerTarget, opts: ClipboardListenerOptions): () => void {\n  const blocked = (t: EventTarget | null): boolean =>\n    clipboardEventBlocked(t) || (opts.isBlocked?.(t) ?? false)\n  const hasTextSelection = (): boolean => {\n    const selection = opts.getSelection?.()\n    return selection !== null && selection !== undefined && !selection.isCollapsed\n  }\n\n  const onKeyDown = (e: Event) => {\n    const event = e as KeyboardEvent\n    if (!(event.metaKey || event.ctrlKey) || event.altKey || event.shiftKey) return\n    const key = event.key.toLowerCase()\n    if (key !== 'c' && key !== 'x' && key !== 'v') return\n    if (blocked(event.target)) return\n    if ((key === 'c' || key === 'x') && hasTextSelection()) return\n    const selectedId = opts.getSelectedId()\n    if (key === 'v') {\n      event.preventDefault()\n      void opts.clipboard.pasteFromClipboard(selectedId, opts.asyncClipboard)\n      return\n    }\n    if (!selectedId) return\n    event.preventDefault()\n    if (key === 'c') opts.clipboard.copyNode(selectedId, null, opts.asyncClipboard)\n    else opts.clipboard.cutNode(selectedId, null, opts.asyncClipboard)\n  }\n\n  const onCopyOrCut = (e: Event) => {\n    const event = e as ClipboardEvent\n    if (blocked(event.target) || hasTextSelection()) return\n    const selectedId = opts.getSelectedId()\n    if (!selectedId || !event.clipboardData) return\n    event.preventDefault()\n    if (event.type === 'copy') opts.clipboard.copyNode(selectedId, event.clipboardData)\n    else opts.clipboard.cutNode(selectedId, event.clipboardData)\n  }\n\n  const onPaste = (e: Event) => {\n    const event = e as ClipboardEvent\n    if (blocked(event.target) || !event.clipboardData) return\n    event.preventDefault()\n    opts.clipboard.pasteFromDataTransfer(event.clipboardData, opts.getSelectedId())\n  }\n\n  target.addEventListener('keydown', onKeyDown)\n  target.addEventListener('copy', onCopyOrCut)\n  target.addEventListener('cut', onCopyOrCut)\n  target.addEventListener('paste', onPaste)\n  return () => {\n    target.removeEventListener('keydown', onKeyDown)\n    target.removeEventListener('copy', onCopyOrCut)\n    target.removeEventListener('cut', onCopyOrCut)\n    target.removeEventListener('paste', onPaste)\n  }\n}\n\n// ---------------------------------------------------------------------------\n// Notice overlay — rendered by the canvas; issues deep-link to their nodes.\n// ---------------------------------------------------------------------------\n\nexport function ClipboardNoticeOverlay() {\n  const notice = useClipboardNotice()\n  const builder = useBuilder()\n  if (!notice) return null\n\n  const tone =\n    notice.kind === 'error' ? 'error' : notice.kind === 'pasted' && notice.issues.length > 0 ? 'warning' : 'success'\n\n  return (\n    <div\n      data-testid=\"clipboard-notice\"\n      data-notice-kind={notice.kind}\n      className=\"absolute bottom-4 left-1/2 z-20 w-max max-w-[min(420px,90%)] -translate-x-1/2\"\n    >\n      <div className=\"rounded-lg border border-border bg-popover p-2 text-popover-foreground shadow-lg\">\n        <Row gap=\"2\" align=\"start\">\n          {tone === 'error' ? (\n            <AlertTriangle className=\"mt-0.5 size-3.5 shrink-0 text-destructive\" aria-hidden />\n          ) : tone === 'warning' ? (\n            <AlertTriangle className=\"mt-0.5 size-3.5 shrink-0 text-warning\" aria-hidden />\n          ) : (\n            <CircleCheck className=\"mt-0.5 size-3.5 shrink-0 text-success\" aria-hidden />\n          )}\n          <Text size=\"xs\" className=\"min-w-0 flex-1\">\n            {notice.kind === 'copied'\n              ? translate('builder.clipboard.copied', { label: notice.label })\n              : notice.kind === 'cut'\n                ? translate('builder.clipboard.cutNotice', { label: notice.label })\n                : notice.kind === 'pasted'\n                  ? translate('builder.clipboard.pastedInto', {\n                      summary: notice.summary,\n                      destination: notice.destinationLabel,\n                    })\n                  : notice.message}\n          </Text>\n          <button\n            type=\"button\"\n            aria-label={translate('common.dismiss')}\n            onClick={() => publishClipboardNotice(null)}\n            className=\"shrink-0 rounded p-0.5 text-muted-foreground hover:bg-muted hover:text-foreground\"\n          >\n            <X className=\"size-3.5\" />\n          </button>\n        </Row>\n        {notice.kind === 'pasted' && notice.issues.length > 0 ? (\n          <div className=\"mt-1.5 flex flex-col gap-1\">\n            {notice.issues.map((issue, i) => (\n              <button\n                key={`${issue.nodeId}-${i}`}\n                type=\"button\"\n                data-testid=\"clipboard-notice-issue\"\n                onClick={() => builder.dispatch({ type: 'select', id: issue.nodeId })}\n                className=\"flex w-full items-center gap-2 rounded-md p-1 text-left transition-colors hover:bg-muted\"\n              >\n                <Badge variant=\"warning\" className=\"shrink-0\">\n                  {translate('builder.clipboard.issueComponent')}\n                </Badge>\n                <Text size=\"xs\" tone=\"muted\" className=\"min-w-0 flex-1 truncate\">\n                  {issue.message}\n                </Text>\n                <Crosshair className=\"size-3.5 shrink-0 text-muted-foreground\" aria-hidden />\n              </button>\n            ))}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n"]}
+{"version":3,"file":"clipboard-actions.js","sourceRoot":"","sources":["../../../src/components/builder/clipboard-actions.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useMemo, useRef, useSyncExternalStore } from 'react'\nimport { AlertTriangle, CircleCheck, Crosshair, X } from 'lucide-react'\nimport { cloneWithNewIds } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { buildFragmentFromComposition } from '@elytracms/core/clipboard'\nimport type { ClipboardFragment, ParseFragmentResult } from '@elytracms/core/clipboard'\nimport {\n  readFragmentFromClipboard,\n  readFragmentFromDataTransfer,\n  resolvePasteTarget,\n  diffPastedSubtree,\n  pasteSummaryMessage,\n  writeFragmentToClipboard,\n  writeFragmentToDataTransfer,\n} from '@elytracms/studio/lib/clipboard'\nimport type { AsyncClipboard, PasteIssue, PasteRejection } from '@elytracms/studio/lib/clipboard'\nimport { getStudioRegistry } from '@elytracms/studio/lib/registry'\nimport { clipboardErrorMessage, componentDisplayName } from '@elytracms/studio/lib/persona/labels'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useProjectSession } from '../project-session'\nimport { Badge, Row, Text } from '@elytracms/studio/ui'\nimport { makeNodeIdCounter, useBuilder } from './builder-store'\n\n/**\n * Copy/cut/paste everywhere (EC-175, vision 3.3/3.7).\n *\n * One hook ({@link useStudioClipboard}) backs every affordance — canvas\n * keyboard shortcuts (wired inside the iframe by the canvas), page-tree\n * shortcuts and row buttons, and the blocks panel's \"copy exact\n * configuration\" — so they all produce/consume the same EC-174 fragment via\n * the OS clipboard (`lib/clipboard/os-clipboard`), never an app-internal\n * buffer. That is what makes paste work across documents, pages, projects,\n * and browser tabs.\n *\n * Dispatch contract: a paste is exactly ONE `insert` action (the fragment\n * root is a single subtree) → one history entry → one mirrored\n * `graph.insertNode` command — one undo step removes everything the paste\n * inserted. A cut is copy + exactly one `remove`; one undo restores it.\n *\n * Paste is PERMISSIVE: missing components and unresolvable bindings insert\n * anyway (the renderer's fallbacks keep them visible) and surface in a\n * notice — \"Pasted — 2 bindings unresolved, 1 component missing\" — whose\n * issues deep-link to the inserted nodes. Only structurally invalid clipboard\n * content is reported as a non-blocking error, never a crash or silent no-op.\n *\n * The one thing paste REFUSES is the leash: a pasted root the resolved slot's\n * `allow` excludes (EC-545), or — landing as a direct child of the composition\n * root — the composition field's top-level `allow` excludes (EC-554), is\n * rejected with a visible notice and no dispatch — the same verdict\n * drag-and-drop gives. Permissiveness is about what the target project can\n * *resolve*; the leash is what the component and field authors *declared*.\n */\n\n// ---------------------------------------------------------------------------\n// Notice store — module-level pub/sub (the drag-session pattern) so any\n// surface can publish and the canvas overlay renders it.\n// ---------------------------------------------------------------------------\n\nexport type ClipboardNotice =\n  | { kind: 'copied'; label: string }\n  | { kind: 'cut'; label: string }\n  | { kind: 'pasted'; summary: string; destinationLabel: string; issues: PasteIssue[] }\n  | { kind: 'error'; message: string }\n\nlet currentNotice: ClipboardNotice | null = null\nconst noticeListeners = new Set<() => void>()\n\nexport function publishClipboardNotice(notice: ClipboardNotice | null): void {\n  currentNotice = notice\n  for (const listener of [...noticeListeners]) listener()\n}\n\nfunction subscribeNotice(listener: () => void): () => void {\n  noticeListeners.add(listener)\n  return () => noticeListeners.delete(listener)\n}\n\nfunction getNotice(): ClipboardNotice | null {\n  return currentNotice\n}\n\nexport function useClipboardNotice(): ClipboardNotice | null {\n  return useSyncExternalStore(subscribeNotice, getNotice, getNotice)\n}\n\n// ---------------------------------------------------------------------------\n// Shortcut scoping\n// ---------------------------------------------------------------------------\n\n/**\n * Whether a clipboard shortcut/event must stay inert for this target: form\n * fields and any contenteditable (which includes the EC-158/EC-159 inline\n * editors) own their own native clipboard behaviour.\n */\nexport function clipboardEventBlocked(target: EventTarget | null): boolean {\n  const el = target as HTMLElement | null\n  if (!el) return false\n  const tag = el.tagName\n  if (tag === 'INPUT' || tag === 'TEXTAREA' || tag === 'SELECT') return true\n  if (typeof el.closest === 'function' && el.closest('[contenteditable]')) return true\n  return el.isContentEditable === true\n}\n\n// ---------------------------------------------------------------------------\n// The clipboard surface\n// ---------------------------------------------------------------------------\n\nexport interface StudioClipboard {\n  /**\n   * Copy a canvas/tree node's subtree. Writes synchronously when a\n   * ClipboardEvent's DataTransfer is given, else via the async Clipboard API\n   * (`asyncClipboard` lets the canvas pass the iframe's own navigator —\n   * Chromium scopes clipboard access to the *focused* document).\n   */\n  copyNode(nodeId: string, dt?: DataTransfer | null, asyncClipboard?: AsyncClipboard): void\n  /** Copy, then remove the source in exactly one dispatch (one undo restores). */\n  cutNode(nodeId: string, dt?: DataTransfer | null, asyncClipboard?: AsyncClipboard): void\n  /** Copy a prebuilt fragment (blocks-panel \"copy exact configuration\"). */\n  copyFragment(fragment: ClipboardFragment, label: string): void\n  /** Paste from a paste event's DataTransfer (no permissions needed). */\n  pasteFromDataTransfer(dt: DataTransfer, anchorId?: string | null): void\n  /** Paste via the async Clipboard API (explicit affordances + shortcuts). */\n  pasteFromClipboard(anchorId?: string | null, asyncClipboard?: AsyncClipboard): Promise<void>\n}\n\nexport function useStudioClipboard(): StudioClipboard {\n  const builder = useBuilder()\n  const { projectId } = useProjectSession()\n  const studio = getStudioRegistry()\n\n  // Event listeners outlive renders; refs keep them on the current state.\n  const stateRef = useRef({ builder, projectId })\n  stateRef.current = { builder, projectId }\n\n  return useMemo<StudioClipboard>(() => {\n    const fragmentFor = (nodeId: string): { fragment: ClipboardFragment; label: string } | null => {\n      const { builder: b, projectId } = stateRef.current\n      const built = buildFragmentFromComposition(b.present, nodeId, { source: { projectId } })\n      if (!built.ok) {\n        // EC-494: the engine's clipboard errors carry a catalog ref, so the notice\n        // reads in the active studio locale instead of English inside German chrome.\n        publishClipboardNotice({ kind: 'error', message: clipboardErrorMessage(built.error) })\n        return null\n      }\n      const rootId = built.fragment.payload.root.componentId\n      return { fragment: built.fragment, label: componentDisplayName(rootId, getStudioRegistry().registry.getManifest(rootId)) }\n    }\n\n    const write = (\n      fragment: ClipboardFragment,\n      label: string,\n      kind: 'copied' | 'cut',\n      dt?: DataTransfer | null,\n      asyncClipboard?: AsyncClipboard,\n    ): void => {\n      if (dt) {\n        writeFragmentToDataTransfer(dt, fragment)\n        publishClipboardNotice({ kind, label })\n        return\n      }\n      writeFragmentToClipboard(asyncClipboard ?? navigator.clipboard, fragment)\n        .then(() => publishClipboardNotice({ kind, label }))\n        .catch((cause: unknown) => {\n          const detail = cause instanceof Error ? cause.message : String(cause)\n          publishClipboardNotice({ kind: 'error', message: translate('builder.clipboard.writeError', { detail }) })\n        })\n    }\n\n    const currentRoot = (): ComponentNode | undefined => {\n      const { builder: b } = stateRef.current\n      return b.present\n    }\n\n    const applyPaste = (result: ParseFragmentResult, anchorId?: string | null): void => {\n      const { builder: b } = stateRef.current\n      if (!result.ok) {\n        publishClipboardNotice({ kind: 'error', message: clipboardErrorMessage(result.error) })\n        return\n      }\n      const root = currentRoot()\n      if (!root) return\n      const resolution = resolvePasteTarget({\n        root,\n        anchorId: anchorId !== undefined ? anchorId : b.selectedId,\n        componentId: result.fragment.payload.root.componentId,\n        getManifest: (id) => studio.registry.getManifest(id),\n        // EC-554: the composition field's top-level vocabulary, from the store.\n        fieldAllow: b.field.allow,\n      })\n      if (!resolution.ok) {\n        // EC-545 / EC-554: the slot leash or the field leash refuses the pasted\n        // root — the same verdict a drop gets, made visible. Nothing is dispatched.\n        publishClipboardNotice({ kind: 'error', message: pasteRejectionMessage(resolution, b.field.label) })\n        return\n      }\n      const { target, destinationLabel } = resolution\n      // Mirror the reducer's deterministic re-id so the issue deep links point\n      // at exactly the node ids the inserted subtree will carry — the SAME counter\n      // the reducer uses (`makeNodeIdCounter`), so the mirror can never diverge.\n      const inserted = cloneWithNewIds(result.fragment.payload.root, makeNodeIdCounter(b.nodeSeq).genId)\n      // ONE dispatch: one history entry, one graph.insertNode command, one undo.\n      b.dispatch({ type: 'insert', target, node: result.fragment.payload.root })\n      const diff = diffPastedSubtree({\n        node: inserted,\n        hasComponent: (id) => studio.registry.getManifest(id) !== undefined,\n      })\n      publishClipboardNotice({\n        kind: 'pasted',\n        summary: pasteSummaryMessage(diff),\n        destinationLabel,\n        issues: diff.issues,\n      })\n    }\n\n    return {\n      copyNode(nodeId, dt, asyncClipboard) {\n        const built = fragmentFor(nodeId)\n        if (built) write(built.fragment, built.label, 'copied', dt, asyncClipboard)\n      },\n      cutNode(nodeId, dt, asyncClipboard) {\n        const { builder: b } = stateRef.current\n        const root = currentRoot()\n        if (root && nodeId === root.id) {\n          publishClipboardNotice({ kind: 'error', message: translate('builder.clipboard.rootCannotBeCut') })\n          return\n        }\n        const built = fragmentFor(nodeId)\n        if (!built) return\n        write(built.fragment, built.label, 'cut', dt, asyncClipboard)\n        // Exactly one structural dispatch: a single undo restores the cut node.\n        b.dispatch({ type: 'remove', id: nodeId })\n      },\n      copyFragment(fragment, label) {\n        write(fragment, label, 'copied')\n      },\n      pasteFromDataTransfer(dt, anchorId) {\n        applyPaste(readFragmentFromDataTransfer(dt), anchorId)\n      },\n      async pasteFromClipboard(anchorId, asyncClipboard) {\n        applyPaste(await readFragmentFromClipboard(asyncClipboard ?? navigator.clipboard), anchorId)\n      },\n    }\n  }, [studio])\n}\n\n/**\n * The visible reason a refused paste shows (EC-545) — pure, so the notice\n * wording per refusal is pinned without mounting the hook. EC-554: a field-leash\n * refusal names the FIELD (`fieldLabel`), never the invisible synthetic root's\n * slot — the rejection carries no destination label to misuse.\n */\n/** A component's label in a notice — its manifest title (EC-591: never a stripped id prefix). */\nfunction componentLabel(componentId: string): string {\n  return componentDisplayName(componentId, getStudioRegistry().registry.getManifest(componentId))\n}\n\nexport function pasteRejectionMessage(rejection: PasteRejection, fieldLabel: string): string {\n  if (rejection.code === 'field-not-allowed') {\n    return translate('builder.clipboard.notAllowedByField', {\n      component: componentLabel(rejection.componentId),\n      field: fieldLabel,\n    })\n  }\n  return translate('builder.clipboard.notAllowed', {\n    component: componentLabel(rejection.componentId),\n    destination: rejection.destinationLabel,\n  })\n}\n\n// ---------------------------------------------------------------------------\n// Listener wiring — one implementation for the page-tree window and the\n// canvas iframe document (events never cross the frame boundary).\n// ---------------------------------------------------------------------------\n\nexport interface ClipboardListenerOptions {\n  clipboard: StudioClipboard\n  /** Current selection: the copy/cut subject and the paste anchor. */\n  getSelectedId: () => string | null\n  /** Extra guard (e.g. the canvas's live inline-edit session). */\n  isBlocked?: (target: EventTarget | null) => boolean\n  /** The async Clipboard API of the listening document's own window. */\n  asyncClipboard?: AsyncClipboard\n  /** The listening document's selection — real text selections stay native. */\n  getSelection?: () => Selection | null\n}\n\ninterface ListenerTarget {\n  addEventListener(type: string, listener: (e: Event) => void): void\n  removeEventListener(type: string, listener: (e: Event) => void): void\n}\n\n/**\n * Wire Cmd/Ctrl+C/X/V plus native copy/cut/paste ClipboardEvents.\n *\n * Shortcuts are handled on `keydown` (a selected node has no text selection,\n * so the browser would not fire native clipboard events for it); the\n * `preventDefault` there suppresses the native event, so the ClipboardEvent\n * listeners only ever see *other* triggers — context-menu copy/paste and\n * synthetic events — and the two paths can never double-handle one gesture.\n * Everything stays inert in form fields and inside the inline editors.\n */\nexport function attachClipboardListeners(target: ListenerTarget, opts: ClipboardListenerOptions): () => void {\n  const blocked = (t: EventTarget | null): boolean =>\n    clipboardEventBlocked(t) || (opts.isBlocked?.(t) ?? false)\n  const hasTextSelection = (): boolean => {\n    const selection = opts.getSelection?.()\n    return selection !== null && selection !== undefined && !selection.isCollapsed\n  }\n\n  const onKeyDown = (e: Event) => {\n    const event = e as KeyboardEvent\n    if (!(event.metaKey || event.ctrlKey) || event.altKey || event.shiftKey) return\n    const key = event.key.toLowerCase()\n    if (key !== 'c' && key !== 'x' && key !== 'v') return\n    if (blocked(event.target)) return\n    if ((key === 'c' || key === 'x') && hasTextSelection()) return\n    const selectedId = opts.getSelectedId()\n    if (key === 'v') {\n      event.preventDefault()\n      void opts.clipboard.pasteFromClipboard(selectedId, opts.asyncClipboard)\n      return\n    }\n    if (!selectedId) return\n    event.preventDefault()\n    if (key === 'c') opts.clipboard.copyNode(selectedId, null, opts.asyncClipboard)\n    else opts.clipboard.cutNode(selectedId, null, opts.asyncClipboard)\n  }\n\n  const onCopyOrCut = (e: Event) => {\n    const event = e as ClipboardEvent\n    if (blocked(event.target) || hasTextSelection()) return\n    const selectedId = opts.getSelectedId()\n    if (!selectedId || !event.clipboardData) return\n    event.preventDefault()\n    if (event.type === 'copy') opts.clipboard.copyNode(selectedId, event.clipboardData)\n    else opts.clipboard.cutNode(selectedId, event.clipboardData)\n  }\n\n  const onPaste = (e: Event) => {\n    const event = e as ClipboardEvent\n    if (blocked(event.target) || !event.clipboardData) return\n    event.preventDefault()\n    opts.clipboard.pasteFromDataTransfer(event.clipboardData, opts.getSelectedId())\n  }\n\n  target.addEventListener('keydown', onKeyDown)\n  target.addEventListener('copy', onCopyOrCut)\n  target.addEventListener('cut', onCopyOrCut)\n  target.addEventListener('paste', onPaste)\n  return () => {\n    target.removeEventListener('keydown', onKeyDown)\n    target.removeEventListener('copy', onCopyOrCut)\n    target.removeEventListener('cut', onCopyOrCut)\n    target.removeEventListener('paste', onPaste)\n  }\n}\n\n// ---------------------------------------------------------------------------\n// Notice overlay — rendered by the canvas; issues deep-link to their nodes.\n// ---------------------------------------------------------------------------\n\nexport function ClipboardNoticeOverlay() {\n  const notice = useClipboardNotice()\n  const builder = useBuilder()\n  if (!notice) return null\n\n  const tone =\n    notice.kind === 'error' ? 'error' : notice.kind === 'pasted' && notice.issues.length > 0 ? 'warning' : 'success'\n\n  return (\n    <div\n      data-testid=\"clipboard-notice\"\n      data-notice-kind={notice.kind}\n      className=\"absolute bottom-4 left-1/2 z-20 w-max max-w-[min(420px,90%)] -translate-x-1/2\"\n    >\n      <div className=\"rounded-lg border border-border bg-popover p-2 text-popover-foreground shadow-lg\">\n        <Row gap=\"2\" align=\"start\">\n          {tone === 'error' ? (\n            <AlertTriangle className=\"mt-0.5 size-3.5 shrink-0 text-destructive\" aria-hidden />\n          ) : tone === 'warning' ? (\n            <AlertTriangle className=\"mt-0.5 size-3.5 shrink-0 text-warning\" aria-hidden />\n          ) : (\n            <CircleCheck className=\"mt-0.5 size-3.5 shrink-0 text-success\" aria-hidden />\n          )}\n          <Text size=\"xs\" className=\"min-w-0 flex-1\">\n            {notice.kind === 'copied'\n              ? translate('builder.clipboard.copied', { label: notice.label })\n              : notice.kind === 'cut'\n                ? translate('builder.clipboard.cutNotice', { label: notice.label })\n                : notice.kind === 'pasted'\n                  ? translate('builder.clipboard.pastedInto', {\n                      summary: notice.summary,\n                      destination: notice.destinationLabel,\n                    })\n                  : notice.message}\n          </Text>\n          <button\n            type=\"button\"\n            aria-label={translate('common.dismiss')}\n            onClick={() => publishClipboardNotice(null)}\n            className=\"shrink-0 rounded p-0.5 text-muted-foreground hover:bg-muted hover:text-foreground\"\n          >\n            <X className=\"size-3.5\" />\n          </button>\n        </Row>\n        {notice.kind === 'pasted' && notice.issues.length > 0 ? (\n          <div className=\"mt-1.5 flex flex-col gap-1\">\n            {notice.issues.map((issue, i) => (\n              <button\n                key={`${issue.nodeId}-${i}`}\n                type=\"button\"\n                data-testid=\"clipboard-notice-issue\"\n                onClick={() => builder.dispatch({ type: 'select', id: issue.nodeId })}\n                className=\"flex w-full items-center gap-2 rounded-md p-1 text-left transition-colors hover:bg-muted\"\n              >\n                <Badge variant=\"warning\" className=\"shrink-0\">\n                  {translate('builder.clipboard.issueComponent')}\n                </Badge>\n                <Text size=\"xs\" tone=\"muted\" className=\"min-w-0 flex-1 truncate\">\n                  {issue.message}\n                </Text>\n                <Crosshair className=\"size-3.5 shrink-0 text-muted-foreground\" aria-hidden />\n              </button>\n            ))}\n          </div>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n"]}

package/dist/components/builder/composition-field-editor.d.ts

@@ -1,6 +1,8 @@
 import type { ComponentNode, PreservedSequenceItem, SplitBlockRoots } from '@elytracms/core/project-graph';
 import type { BlocksFieldDef } from '@elytracms/core/cms-core';
+import type { ComponentRegistry } from '@elytracms/core/component-registry';
 import type { BlockNode, BlockSequenceValue } from '@elytracms/core/rich-text';
+import type { MessageKey } from '@elytracms/studio/lib/i18n';
 import type { CompositionFieldScope } from './builder-store.js';
 import type { InspectorPane } from '../inspector/inspector-sidebar.js';
 /**
@@ -41,6 +43,26 @@ export declare function mergeCompositionValue(roots: readonly ComponentNode[], p
  * omitted `allow` stays `undefined` (EC-544: any registered component).
  */
 export declare function compositionFieldScope(field: BlocksFieldDef): CompositionFieldScope;
+/**
+ * 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 declare function canvasRoleNotices(registry: ComponentRegistry): MessageKey[];
+/** The role notices above the canvas (EC-591) — a standing truth about the component list. */
+export declare function CanvasRoleNotices({ notices }: {
+    notices: readonly MessageKey[];
+}): import("react").JSX.Element | null;
+/**
+ * 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 declare function NoStackCanvasNotice(): import("react").JSX.Element;
 export declare function CompositionFieldEditor({ field, value, onChange, readOnly, trailingPanes, }: {
     field: BlocksFieldDef;
     value: unknown;