@elytracms/studio 0.0.93 → 0.0.95

package/dist/components/builder/canvas-rebase.d.ts

@@ -0,0 +1,77 @@
+import type { DocumentPatch } from '@elytracms/core/cms-core';
+import type { ComponentNode } from '@elytracms/core/project-graph';
+import type { PreservedItem } from './canvas-runs.js';
+/** One composition state: the synthetic root and the preserved typography (a history entry's shape). */
+export interface CanvasValueState {
+    readonly root: ComponentNode;
+    readonly preserved: readonly PreservedItem[];
+}
+/** The stored v2 sequence a composition state stands for (THE merge order). */
+export declare function canvasValueOf(state: CanvasValueState): unknown;
+/** The external change between two values of the field (the canvas writer's delta; `[]` when equal). */
+export declare function externalChange(from: unknown, to: unknown): DocumentPatch[];
+/** A field value with the change absorbed, or `undefined` when it cannot take it. */
+export declare function absorbIntoValue(value: unknown, change: readonly DocumentPatch[]): {
+    value: unknown;
+} | undefined;
+/** One composition state with the change absorbed, or `undefined` when it cannot take it. */
+export declare function absorbChange(state: CanvasValueState, change: readonly DocumentPatch[]): CanvasValueState | undefined;
+/** The editor state a rebase reads and writes (the builder state's composition, history and selection). */
+export interface RebasableState {
+    readonly present: ComponentNode;
+    readonly preserved: readonly PreservedItem[];
+    /** Oldest first. */
+    readonly past: readonly CanvasValueState[];
+    /** Next redo first. */
+    readonly future: readonly CanvasValueState[];
+    readonly selectedId: string | null;
+    readonly selectedRun: number | null;
+    readonly hoveredId: string | null;
+}
+/**
+ * Rebase the editor onto the field's change `from` → `to` (see the module doc). Returns
+ * `undefined` when there is nothing to change.
+ */
+export declare function rebaseCanvas(state: RebasableState, from: unknown, to: unknown): RebasableState | undefined;
+/**
+ * A change of the canvas field's value made UNDERNEATH the canvas, as the document draft
+ * saw it happen: the field's value before and after the session's document moved, and a
+ * sequence number (one per change, increasing).
+ */
+export interface CanvasFieldChange {
+    readonly from: unknown;
+    readonly to: unknown;
+    readonly seq: number;
+}
+/** What the canvas lifts into the draft: its value and the value its delta is measured from. */
+export interface CanvasLift {
+    readonly value: unknown;
+    /** The value the store last agreed on with the draft — the canvas writer's delta is `base` → `value`. */
+    readonly base: unknown;
+}
+/**
+ * EC-630 — the two-way sync between the canvas store and the document draft (pure; the
+ * canvas's `CompositionSync` is its React shell).
+ *
+ * It tracks the value the store and the draft last AGREED on (`synced`):
+ * - {@link CanvasSync.stored} — the store's value changed (an edit, an undo, a rebase's
+ *   adoption): lift it, with `synced` as the base of the canvas writer's delta, unless
+ *   the draft already holds it. Measuring the delta from `synced` — never from the draft's
+ *   current value — is what keeps a colleague's change that reached the draft a moment
+ *   before an edit lifts out of that edit's patches (they would otherwise revert it).
+ * - {@link CanvasSync.changed} — the draft reports a change made underneath: `synced`
+ *   absorbs it, and the action to dispatch is a `rebase`. Until the store has applied
+ *   every rebase dispatched (its `rebased` count), a store value predates one and is not
+ *   lifted (its edits are lifted from the rebased value right after).
+ */
+export interface CanvasSync {
+    changed(change: CanvasFieldChange): {
+        type: 'rebase';
+        from: unknown;
+        to: unknown;
+    } | undefined;
+    stored(value: unknown, rebased: number): CanvasLift | undefined;
+}
+export declare function createCanvasSync(initial: unknown, seenSeq?: number): CanvasSync;
+/** The selection after a rebase: kept while its node exists, else its nearest surviving ancestor, else the root. */
+export declare function survivingSelection(before: ComponentNode, after: ComponentNode, selectedId: string | null): string | null;

package/dist/components/builder/canvas-rebase.js

@@ -0,0 +1,169 @@
+import { applyDocumentPatches, locateNode, semanticValueEqual, valuePathNodeIds } from '@elytracms/core/cms-core';
+import { DEFAULT_SLOT, getNode, getParentInfo, mergeBlockRoots, splitBlockRoots } from '@elytracms/core/project-graph';
+import { compositionPatches } from './composition-patches.js';
+import { runByKey } from './canvas-runs.js';
+/**
+ * EC-630 — the canvas REBASES onto a change of its field made underneath it (a colleague's
+ * patch arriving by subscription, the canonical row a write returned, a resolved
+ * conflict) instead of remounting: the change lands, and the editor's undo history and
+ * selection survive (EC-595's model — the canvas commits and rebases like every other
+ * editor). Pure; the builder reducer's `rebase` action calls {@link rebaseCanvas}.
+ *
+ * **The external change** is named by the document draft that saw it happen: the field's
+ * value before (`from`) and after (`to`) the session's document moved. Its delta is the
+ * one the canvas writer itself would emit between the two ({@link externalChange} — node
+ * patches keyed by id, or the coarser whole-field write when node verbs cannot say it: a
+ * typography change, prose being one position). Measured between two DRAFT values, the
+ * delta holds the colleague's change and nothing else — not this editor's own edits (both
+ * values hold them), not a canonicalisation of them.
+ *
+ * **The present absorbs the change** with THE merge (`applyDocumentPatches`, the function
+ * both stores run), so an edit of this editor's that the draft has not seen yet survives
+ * under it; when the present cannot take it, the incoming value wins. Never re-normalised
+ * (receiving a change never writes one back).
+ *
+ * **Undo never reverts an external change.** The history holds whole-state snapshots, so
+ * kept as they were, an undo would restore a pre-change snapshot and the next commit
+ * would write patches that silently revert the colleague. Instead every snapshot ABSORBS
+ * the same delta: an undo then restores the editor's own earlier state WITH the
+ * colleague's change in it.
+ * - A `remove` of a node the snapshot does not hold is already absorbed (nothing to
+ *   resurrect).
+ * - Any other patch a snapshot cannot take (its node is not there — the colleague edited
+ *   a node this editor inserted later, or moved one into it) means restoring it WOULD
+ *   revert the colleague: the snapshot and every entry beyond it (older undo steps, later
+ *   redo steps — reachable only through it) are dropped. Conservative: a lost undo step
+ *   is recoverable, a silently destroyed colleague's edit is not.
+ * - Steps the change emptied (an undo that would now change nothing — the colleague wrote
+ *   the same position later, or rewrote the whole field) are dropped, so every remaining
+ *   undo does something.
+ *
+ * **The selection** survives while its node does. When the change removed it, it moves to
+ * the nearest surviving ancestor (the rule a local `remove` follows — the inspector stays
+ * where the editor was working), else the root. A selected typography RUN stays selected
+ * only while the typography is unchanged: runs carry no ids (EC-500 D1), so after a prose
+ * change a key no longer names the same run with certainty.
+ */
+/** The field name the canvas's own deltas are addressed at (internal — never stored, never sent). */
+const CANVAS_FIELD = 'canvas';
+/** The stored v2 sequence a composition state stands for (THE merge order). */
+export function canvasValueOf(state) {
+    return mergeBlockRoots(state.root.slots?.[DEFAULT_SLOT] ?? [], state.preserved);
+}
+/** A composition state holding `value` under the given synthetic root (its children replaced). */
+function stateOfValue(root, value) {
+    const split = splitBlockRoots(value);
+    return { root: { ...root, slots: { ...root.slots, [DEFAULT_SLOT]: split.roots } }, preserved: split.preserved };
+}
+/** The external change between two values of the field (the canvas writer's delta; `[]` when equal). */
+export function externalChange(from, to) {
+    return compositionPatches(from, to, CANVAS_FIELD, undefined);
+}
+/** Whether a `remove` names a node this value does not hold (already absorbed). */
+function removesAbsent(value, patch) {
+    if (patch.op !== 'remove')
+        return false;
+    const ids = valuePathNodeIds(patch.path);
+    const id = ids[ids.length - 1];
+    return id !== undefined && locateNode(value, id) === undefined;
+}
+/** A field value with the change absorbed, or `undefined` when it cannot take it. */
+export function absorbIntoValue(value, change) {
+    const patches = change.filter((patch) => !removesAbsent(value, patch));
+    if (patches.length === 0)
+        return { value };
+    const document = { collection: CANVAS_FIELD, id: CANVAS_FIELD, values: { [CANVAS_FIELD]: value } };
+    const result = applyDocumentPatches({ document, patches, since: [] });
+    if (result.refused.length > 0)
+        return undefined;
+    return { value: result.document.values[CANVAS_FIELD] };
+}
+/** One composition state with the change absorbed, or `undefined` when it cannot take it. */
+export function absorbChange(state, change) {
+    const absorbed = absorbIntoValue(canvasValueOf(state), change);
+    return absorbed ? stateOfValue(state.root, absorbed.value) : undefined;
+}
+/**
+ * Rebase one direction of the history (`chain` ordered from the present outward — the
+ * newest undo step first, or the next redo step first): each entry absorbs the change,
+ * the first that cannot ends the chain, and an entry equal to its neighbour toward the
+ * present is dropped. Returns the chain in the same order.
+ */
+function rebaseChain(present, chain, change) {
+    const out = [];
+    let neighbour = canvasValueOf(present);
+    for (const entry of chain) {
+        const absorbed = absorbChange(entry, change);
+        if (!absorbed)
+            break;
+        const value = canvasValueOf(absorbed);
+        if (semanticValueEqual(value, neighbour))
+            continue;
+        out.push(absorbed);
+        neighbour = value;
+    }
+    return out;
+}
+/**
+ * Rebase the editor onto the field's change `from` → `to` (see the module doc). Returns
+ * `undefined` when there is nothing to change.
+ */
+export function rebaseCanvas(state, from, to) {
+    const change = externalChange(from, to);
+    if (change.length === 0)
+        return undefined;
+    const current = { root: state.present, preserved: state.preserved };
+    const next = absorbChange(current, change) ?? stateOfValue(state.present, to);
+    const past = rebaseChain(next, [...state.past].reverse(), change).reverse();
+    const future = rebaseChain(next, state.future, change);
+    const typographyKept = semanticValueEqual(state.preserved.map((item) => item.node), next.preserved.map((item) => item.node));
+    const roots = next.root.slots?.[DEFAULT_SLOT]?.length ?? 0;
+    return {
+        present: next.root,
+        preserved: next.preserved,
+        past,
+        future,
+        selectedId: survivingSelection(state.present, next.root, state.selectedId),
+        selectedRun: state.selectedRun !== null && typographyKept && runByKey(roots, next.preserved, state.selectedRun)
+            ? state.selectedRun
+            : null,
+        hoveredId: state.hoveredId !== null && getNode(next.root, state.hoveredId) ? state.hoveredId : null,
+    };
+}
+export function createCanvasSync(initial, seenSeq = 0) {
+    let synced = initial;
+    let seen = seenSeq;
+    let dispatched = 0;
+    return {
+        changed(change) {
+            if (change.seq <= seen)
+                return undefined;
+            seen = change.seq;
+            synced = absorbIntoValue(synced, externalChange(change.from, change.to))?.value ?? change.to;
+            dispatched += 1;
+            return { type: 'rebase', from: change.from, to: change.to };
+        },
+        stored(value, rebased) {
+            if (rebased < dispatched)
+                return undefined;
+            if (semanticValueEqual(value, synced))
+                return undefined;
+            const base = synced;
+            synced = value;
+            return { value, base };
+        },
+    };
+}
+/** The selection after a rebase: kept while its node exists, else its nearest surviving ancestor, else the root. */
+export function survivingSelection(before, after, selectedId) {
+    if (selectedId === null)
+        return null;
+    let id = selectedId;
+    while (id !== null) {
+        if (getNode(after, id))
+            return id;
+        id = getParentInfo(before, id)?.parent.id ?? null;
+    }
+    return after.id;
+}
+//# sourceMappingURL=canvas-rebase.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"canvas-rebase.js","sourceRoot":"","sources":["../../../src/components/builder/canvas-rebase.ts"],"names":[],"mappings":"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","sourcesContent":["import { applyDocumentPatches, locateNode, semanticValueEqual, valuePathNodeIds } from '@elytracms/core/cms-core'\nimport type { CmsDocument, DocumentPatch } from '@elytracms/core/cms-core'\nimport { DEFAULT_SLOT, getNode, getParentInfo, mergeBlockRoots, splitBlockRoots } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { compositionPatches } from './composition-patches'\nimport { runByKey } from './canvas-runs'\nimport type { PreservedItem } from './canvas-runs'\n\n/**\n * EC-630 — the canvas REBASES onto a change of its field made underneath it (a colleague's\n * patch arriving by subscription, the canonical row a write returned, a resolved\n * conflict) instead of remounting: the change lands, and the editor's undo history and\n * selection survive (EC-595's model — the canvas commits and rebases like every other\n * editor). Pure; the builder reducer's `rebase` action calls {@link rebaseCanvas}.\n *\n * **The external change** is named by the document draft that saw it happen: the field's\n * value before (`from`) and after (`to`) the session's document moved. Its delta is the\n * one the canvas writer itself would emit between the two ({@link externalChange} — node\n * patches keyed by id, or the coarser whole-field write when node verbs cannot say it: a\n * typography change, prose being one position). Measured between two DRAFT values, the\n * delta holds the colleague's change and nothing else — not this editor's own edits (both\n * values hold them), not a canonicalisation of them.\n *\n * **The present absorbs the change** with THE merge (`applyDocumentPatches`, the function\n * both stores run), so an edit of this editor's that the draft has not seen yet survives\n * under it; when the present cannot take it, the incoming value wins. Never re-normalised\n * (receiving a change never writes one back).\n *\n * **Undo never reverts an external change.** The history holds whole-state snapshots, so\n * kept as they were, an undo would restore a pre-change snapshot and the next commit\n * would write patches that silently revert the colleague. Instead every snapshot ABSORBS\n * the same delta: an undo then restores the editor's own earlier state WITH the\n * colleague's change in it.\n * - A `remove` of a node the snapshot does not hold is already absorbed (nothing to\n *   resurrect).\n * - Any other patch a snapshot cannot take (its node is not there — the colleague edited\n *   a node this editor inserted later, or moved one into it) means restoring it WOULD\n *   revert the colleague: the snapshot and every entry beyond it (older undo steps, later\n *   redo steps — reachable only through it) are dropped. Conservative: a lost undo step\n *   is recoverable, a silently destroyed colleague's edit is not.\n * - Steps the change emptied (an undo that would now change nothing — the colleague wrote\n *   the same position later, or rewrote the whole field) are dropped, so every remaining\n *   undo does something.\n *\n * **The selection** survives while its node does. When the change removed it, it moves to\n * the nearest surviving ancestor (the rule a local `remove` follows — the inspector stays\n * where the editor was working), else the root. A selected typography RUN stays selected\n * only while the typography is unchanged: runs carry no ids (EC-500 D1), so after a prose\n * change a key no longer names the same run with certainty.\n */\n\n/** The field name the canvas's own deltas are addressed at (internal — never stored, never sent). */\nconst CANVAS_FIELD = 'canvas'\n\n/** One composition state: the synthetic root and the preserved typography (a history entry's shape). */\nexport interface CanvasValueState {\n  readonly root: ComponentNode\n  readonly preserved: readonly PreservedItem[]\n}\n\n/** The stored v2 sequence a composition state stands for (THE merge order). */\nexport function canvasValueOf(state: CanvasValueState): unknown {\n  return mergeBlockRoots(state.root.slots?.[DEFAULT_SLOT] ?? [], state.preserved)\n}\n\n/** A composition state holding `value` under the given synthetic root (its children replaced). */\nfunction stateOfValue(root: ComponentNode, value: unknown): CanvasValueState {\n  const split = splitBlockRoots(value)\n  return { root: { ...root, slots: { ...root.slots, [DEFAULT_SLOT]: split.roots } }, preserved: split.preserved }\n}\n\n/** The external change between two values of the field (the canvas writer's delta; `[]` when equal). */\nexport function externalChange(from: unknown, to: unknown): DocumentPatch[] {\n  return compositionPatches(from, to, CANVAS_FIELD, undefined)\n}\n\n/** Whether a `remove` names a node this value does not hold (already absorbed). */\nfunction removesAbsent(value: unknown, patch: DocumentPatch): boolean {\n  if (patch.op !== 'remove') return false\n  const ids = valuePathNodeIds(patch.path)\n  const id = ids[ids.length - 1]\n  return id !== undefined && locateNode(value, id) === undefined\n}\n\n/** A field value with the change absorbed, or `undefined` when it cannot take it. */\nexport function absorbIntoValue(value: unknown, change: readonly DocumentPatch[]): { value: unknown } | undefined {\n  const patches = change.filter((patch) => !removesAbsent(value, patch))\n  if (patches.length === 0) return { value }\n  const document: CmsDocument = { collection: CANVAS_FIELD, id: CANVAS_FIELD, values: { [CANVAS_FIELD]: value } }\n  const result = applyDocumentPatches({ document, patches, since: [] })\n  if (result.refused.length > 0) return undefined\n  return { value: result.document.values[CANVAS_FIELD] }\n}\n\n/** One composition state with the change absorbed, or `undefined` when it cannot take it. */\nexport function absorbChange(state: CanvasValueState, change: readonly DocumentPatch[]): CanvasValueState | undefined {\n  const absorbed = absorbIntoValue(canvasValueOf(state), change)\n  return absorbed ? stateOfValue(state.root, absorbed.value) : undefined\n}\n\n/**\n * Rebase one direction of the history (`chain` ordered from the present outward — the\n * newest undo step first, or the next redo step first): each entry absorbs the change,\n * the first that cannot ends the chain, and an entry equal to its neighbour toward the\n * present is dropped. Returns the chain in the same order.\n */\nfunction rebaseChain(\n  present: CanvasValueState,\n  chain: readonly CanvasValueState[],\n  change: readonly DocumentPatch[],\n): CanvasValueState[] {\n  const out: CanvasValueState[] = []\n  let neighbour = canvasValueOf(present)\n  for (const entry of chain) {\n    const absorbed = absorbChange(entry, change)\n    if (!absorbed) break\n    const value = canvasValueOf(absorbed)\n    if (semanticValueEqual(value, neighbour)) continue\n    out.push(absorbed)\n    neighbour = value\n  }\n  return out\n}\n\n/** The editor state a rebase reads and writes (the builder state's composition, history and selection). */\nexport interface RebasableState {\n  readonly present: ComponentNode\n  readonly preserved: readonly PreservedItem[]\n  /** Oldest first. */\n  readonly past: readonly CanvasValueState[]\n  /** Next redo first. */\n  readonly future: readonly CanvasValueState[]\n  readonly selectedId: string | null\n  readonly selectedRun: number | null\n  readonly hoveredId: string | null\n}\n\n/**\n * Rebase the editor onto the field's change `from` → `to` (see the module doc). Returns\n * `undefined` when there is nothing to change.\n */\nexport function rebaseCanvas(state: RebasableState, from: unknown, to: unknown): RebasableState | undefined {\n  const change = externalChange(from, to)\n  if (change.length === 0) return undefined\n  const current: CanvasValueState = { root: state.present, preserved: state.preserved }\n  const next = absorbChange(current, change) ?? stateOfValue(state.present, to)\n  const past = rebaseChain(next, [...state.past].reverse(), change).reverse()\n  const future = rebaseChain(next, state.future, change)\n  const typographyKept = semanticValueEqual(\n    state.preserved.map((item) => item.node),\n    next.preserved.map((item) => item.node),\n  )\n  const roots = next.root.slots?.[DEFAULT_SLOT]?.length ?? 0\n  return {\n    present: next.root,\n    preserved: next.preserved,\n    past,\n    future,\n    selectedId: survivingSelection(state.present, next.root, state.selectedId),\n    selectedRun:\n      state.selectedRun !== null && typographyKept && runByKey(roots, next.preserved, state.selectedRun)\n        ? state.selectedRun\n        : null,\n    hoveredId: state.hoveredId !== null && getNode(next.root, state.hoveredId) ? state.hoveredId : null,\n  }\n}\n\n/**\n * A change of the canvas field's value made UNDERNEATH the canvas, as the document draft\n * saw it happen: the field's value before and after the session's document moved, and a\n * sequence number (one per change, increasing).\n */\nexport interface CanvasFieldChange {\n  readonly from: unknown\n  readonly to: unknown\n  readonly seq: number\n}\n\n/** What the canvas lifts into the draft: its value and the value its delta is measured from. */\nexport interface CanvasLift {\n  readonly value: unknown\n  /** The value the store last agreed on with the draft — the canvas writer's delta is `base` → `value`. */\n  readonly base: unknown\n}\n\n/**\n * EC-630 — the two-way sync between the canvas store and the document draft (pure; the\n * canvas's `CompositionSync` is its React shell).\n *\n * It tracks the value the store and the draft last AGREED on (`synced`):\n * - {@link CanvasSync.stored} — the store's value changed (an edit, an undo, a rebase's\n *   adoption): lift it, with `synced` as the base of the canvas writer's delta, unless\n *   the draft already holds it. Measuring the delta from `synced` — never from the draft's\n *   current value — is what keeps a colleague's change that reached the draft a moment\n *   before an edit lifts out of that edit's patches (they would otherwise revert it).\n * - {@link CanvasSync.changed} — the draft reports a change made underneath: `synced`\n *   absorbs it, and the action to dispatch is a `rebase`. Until the store has applied\n *   every rebase dispatched (its `rebased` count), a store value predates one and is not\n *   lifted (its edits are lifted from the rebased value right after).\n */\nexport interface CanvasSync {\n  changed(change: CanvasFieldChange): { type: 'rebase'; from: unknown; to: unknown } | undefined\n  stored(value: unknown, rebased: number): CanvasLift | undefined\n}\n\nexport function createCanvasSync(initial: unknown, seenSeq = 0): CanvasSync {\n  let synced = initial\n  let seen = seenSeq\n  let dispatched = 0\n  return {\n    changed(change) {\n      if (change.seq <= seen) return undefined\n      seen = change.seq\n      synced = absorbIntoValue(synced, externalChange(change.from, change.to))?.value ?? change.to\n      dispatched += 1\n      return { type: 'rebase', from: change.from, to: change.to }\n    },\n    stored(value, rebased) {\n      if (rebased < dispatched) return undefined\n      if (semanticValueEqual(value, synced)) return undefined\n      const base = synced\n      synced = value\n      return { value, base }\n    },\n  }\n}\n\n/** The selection after a rebase: kept while its node exists, else its nearest surviving ancestor, else the root. */\nexport function survivingSelection(before: ComponentNode, after: ComponentNode, selectedId: string | null): string | null {\n  if (selectedId === null) return null\n  let id: string | null = selectedId\n  while (id !== null) {\n    if (getNode(after, id)) return id\n    id = getParentInfo(before, id)?.parent.id ?? null\n  }\n  return after.id\n}\n"]}

package/dist/components/builder/canvas-render-context.d.ts

@@ -1,9 +1,9 @@
 import type { Perspective } from '@elytracms/core/cms-core';
-import type { AssetRecord } from '@elytracms/core/persistence';
+import type { AssetReadLocale, AssetRecord } from '@elytracms/core/persistence';
 import type { ListingQuery, RenderAsset, RenderContext, ResolveAsset, ResolveLink, ResolveListing, ResolveRelation } from '@elytracms/core/runtime-renderer';
 import type { ContentQueryError } from '@elytracms/core/content';
 import type { ComponentNode } from '@elytracms/core/project-graph';
-import type { StudioRegistry } from '@elytracms/studio/lib/registry';
+import type { StudioRegistry } from '../../lib/registry/index.js';
 import type { ReuseCapability } from './reuse.js';
 /**
  * The canvas's `RenderContext` (EC-330, extracted from `BuilderCanvas`): the
@@ -93,9 +93,12 @@ export declare function createCanvasRenderContext(deps: CanvasRenderContextDeps)
  * editor-set `meta.alt` rendered on the site but not on the canvas. One reader
  * (`resolvedAsset`, `content/assets.ts`) means the canvas and the host cannot
  * disagree about an asset's own facts; `RenderAsset` IS `ResolvedAsset` (EC-587 —
- * one resolved shape in every position). Pure, exported for the node test.
+ * one resolved shape in every position). EC-632: in the canvas's locale `at` — the
+ * locale the relations, listings and links beside it resolve in — so a localized alt
+ * previews in the locale the editor has open, with delivery's fallback. Pure, exported
+ * for the node test.
  */
-export declare function canvasRenderAsset(record: AssetRecord | undefined): RenderAsset | null;
+export declare function canvasRenderAsset(record: AssetRecord | undefined, at: AssetReadLocale | null): RenderAsset | null;
 export declare function useCanvasRenderContext(args: {
     /** The edited composition root (`builder.present`). */
     present: ComponentNode;

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

@@ -2,11 +2,12 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useSyncExternalStore } from 'react';
 import { DRAFT_PERSPECTIVE } from '@elytracms/core/cms-core';
 import { resolvedAsset } from '@elytracms/core/content';
+import { assetReadLocale } from '@elytracms/core/persistence';
 import { createRenderContext, listingFailureOf } 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';
-import { useStudioLocale } from '@elytracms/studio/lib/locale';
+import { translate } from '../../lib/i18n/index.js';
+import { contentQueryErrorMessage } from '../../lib/persona/labels.js';
+import { acquireContentSessionConsumer, contentSessionEpoch, resolveCanvasLink, resolveCanvasListing, resolveCanvasRelation, subscribeContentSession, validateCanvasListingQuery, } from '../../lib/data/index.js';
+import { useStudioLocale } from '../../lib/locale/index.js';
 import { useOptionalAssets } from '../assets/assets-store.js';
 import { useReuse } from './reuse-context.js';
 import { reuseEmbedRef } from './reuse.js';
@@ -113,12 +114,15 @@ export function createCanvasRenderContext(deps) {
  * editor-set `meta.alt` rendered on the site but not on the canvas. One reader
  * (`resolvedAsset`, `content/assets.ts`) means the canvas and the host cannot
  * disagree about an asset's own facts; `RenderAsset` IS `ResolvedAsset` (EC-587 —
- * one resolved shape in every position). Pure, exported for the node test.
+ * one resolved shape in every position). EC-632: in the canvas's locale `at` — the
+ * locale the relations, listings and links beside it resolve in — so a localized alt
+ * previews in the locale the editor has open, with delivery's fallback. Pure, exported
+ * for the node test.
  */
-export function canvasRenderAsset(record) {
-    if (!record?.url)
-        return null;
-    return resolvedAsset(record, record.url);
+export function canvasRenderAsset(record, at) {
+    // EC-633: a record with no URL is decided by the constructor (no resolved asset), the
+    // same answer delivery gets — so both render the same empty state.
+    return record ? resolvedAsset(record, record.url, at) : null;
 }
 export function useCanvasRenderContext(args) {
     const { present, selectedId, hoveredId, studio, perspective, richEditEpochs } = args;
@@ -139,16 +143,20 @@ export function useCanvasRenderContext(args) {
     // library, so the canvas previews exactly what the host renders. A record
     // without a resolved url (e.g. a never-served seed) → null → the
     // implementation's visible empty state.
-    const assetsStore = useOptionalAssets();
-    const resolveAsset = useCallback((assetId) => canvasRenderAsset(assetsStore?.assets.find((a) => a.id === assetId)), [assetsStore]);
-    // The canvas's active locale for relation/listing/link resolution below.
+    // The canvas's active locale for asset/relation/listing/link resolution below.
     // EC-479: the ambient locale is `null` until a project's config is installed (it
     // no longer opens on the engine's `en/de` fixture). `undefined` means "you pick" to
     // the content engine, which then resolves in the SESSION's own default locale —
     // never a fabricated one — so a canvas mounted outside a CMS session still previews
     // in the project's locale.
-    const { locale } = useStudioLocale();
+    const { locale, config: localeConfig } = useStudioLocale();
     const activeLocale = locale ?? undefined;
+    // EC-632: an asset's localized metadata (alt) reads in the same locale, falling back to
+    // the project's default — `null` (shared metadata only) before a config is installed.
+    const defaultLocale = localeConfig?.default;
+    const assetLocale = useMemo(() => (defaultLocale === undefined ? null : assetReadLocale({ default: defaultLocale }, activeLocale)), [defaultLocale, activeLocale]);
+    const assetsStore = useOptionalAssets();
+    const resolveAsset = useCallback((assetId) => canvasRenderAsset(assetsStore?.assets.find((a) => a.id === assetId), assetLocale), [assetsStore, assetLocale]);
     // EC-300: the reuse capability identifies a transcluding embed + its relation prop,
     // so the canvas can detect a HARD reference whose target doesn't resolve and show a
     // placeholder instead of an empty section. Null-safe (no provider / no capability).

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 { DRAFT_PERSPECTIVE } from '@elytracms/core/cms-core'\nimport type { Perspective } from '@elytracms/core/cms-core'\nimport { resolvedAsset } from '@elytracms/core/content'\nimport type { AssetRecord } from '@elytracms/core/persistence'\nimport { createRenderContext, listingFailureOf } 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 { 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: Perspective) => unknown,\n  perspective: Perspective,\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_PERSPECTIVE) ? 'unpublished' : 'missing'\n}\n\n/**\n * Everything the pure context factory needs — the live SOURCE (resolvers over the\n * content session, and the session schema's verdict on a listing query) plus the\n * editor's decoration state. EC-592: the factory is a call of core's ONE\n * `createRenderContext` (`mode: 'canvas'`) — the delivery host calls the same one\n * over its baked source.\n */\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) / EC-581 6a: why a runnable listing query is STATICALLY\n   * invalid against the active session schema (unknown collection, non-filterable\n   * filter/sort field) — localized messages, or `null` when it can run. The render\n   * context judges the declaration itself and shows the notice above the block —\n   * the same judgment the delivery host reads from its baked refusals.\n   */\n  listingFailure(query: ListingQuery): readonly string[] | null\n}\n\n/**\n * The session schema's verdict on a listing query, localized (EC-494:\n * `ContentQueryError` carries a catalog ref) — the canvas's `listingFailure` source.\n */\nexport function sessionListingFailure(\n  validate: (query: ListingQuery) => readonly ContentQueryError[],\n): (query: ListingQuery) => readonly string[] | null {\n  return (query) => {\n    const errors = validate(query)\n    return errors.length === 0 ? null : errors.map((error) => contentQueryErrorMessage(error))\n  }\n}\n\n/**\n * The canvas notice text for a listing node that cannot run, or `null` (EC-460, the\n * never-silent rule) — core's ONE judgment (`listingFailureOf`: the registry's verdict\n * on the declaration, then `validate`'s on the built query; a listing awaiting its\n * bound value keeps the block's own empty state). Pure, 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 failure = listingFailureOf(node, registry, { listingFailure: sessionListingFailure(validate) })\n  return failure ? failure.join(' ') : null\n}\n\n/**\n * Assemble the canvas `RenderContext` — core's ONE `createRenderContext` over the live\n * source, `mode: 'canvas'`, with the editor's decoration. Pure (no hooks): the same\n * deps produce the same context, so the decorator's wrapper markup is pinnable.\n */\nexport function createCanvasRenderContext(deps: CanvasRenderContextDeps): RenderContext {\n  return createRenderContext({\n    components: { registry: deps.registry, implementations: deps.implementations },\n    mode: 'canvas',\n    source: {\n      resolveAsset: deps.resolveAsset,\n      resolveRelation: deps.resolveRelation,\n      resolveListing: deps.resolveListing,\n      resolveLink: deps.resolveLink,\n      listingFailure: deps.listingFailure,\n    },\n    // EC-460: a listing that cannot run gets the canvas's own (chrome-styled,\n    // localized) notice ABOVE the block, which keeps its empty state below.\n    listingNotice: (_node, messages) => <CanvasListingIssueNotice message={messages.join(' ')} />,\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      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 ? <UnresolvedReusablePlaceholder status={unresolved} /> : rendered}\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 `ResolvedAsset` (EC-587 —\n * one resolved shape in every position). 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: Perspective\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): the session schema's verdict on a listing query.\n  const listingFailure = useMemo(\n    () => sessionListingFailure((query) => validateCanvasListingQuery(query)),\n    [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        listingFailure,\n      }),\n    [studio, resolveAsset, resolveRelation, resolveListing, resolveLink, unresolvedReuse, pageNodeIds, selectedId, hoveredId, richEditEpochs, listingFailure],\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 { DRAFT_PERSPECTIVE } from '@elytracms/core/cms-core'\nimport type { Perspective } from '@elytracms/core/cms-core'\nimport { resolvedAsset } from '@elytracms/core/content'\nimport { assetReadLocale } from '@elytracms/core/persistence'\nimport type { AssetReadLocale, AssetRecord } from '@elytracms/core/persistence'\nimport { createRenderContext, listingFailureOf } 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 '../../lib/registry'\nimport { translate } from '../../lib/i18n'\nimport { contentQueryErrorMessage } from '../../lib/persona/labels'\nimport {\n  acquireContentSessionConsumer,\n  contentSessionEpoch,\n  resolveCanvasLink,\n  resolveCanvasListing,\n  resolveCanvasRelation,\n  subscribeContentSession,\n  validateCanvasListingQuery,\n} from '../../lib/data'\nimport { useStudioLocale } from '../../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: Perspective) => unknown,\n  perspective: Perspective,\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_PERSPECTIVE) ? 'unpublished' : 'missing'\n}\n\n/**\n * Everything the pure context factory needs — the live SOURCE (resolvers over the\n * content session, and the session schema's verdict on a listing query) plus the\n * editor's decoration state. EC-592: the factory is a call of core's ONE\n * `createRenderContext` (`mode: 'canvas'`) — the delivery host calls the same one\n * over its baked source.\n */\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) / EC-581 6a: why a runnable listing query is STATICALLY\n   * invalid against the active session schema (unknown collection, non-filterable\n   * filter/sort field) — localized messages, or `null` when it can run. The render\n   * context judges the declaration itself and shows the notice above the block —\n   * the same judgment the delivery host reads from its baked refusals.\n   */\n  listingFailure(query: ListingQuery): readonly string[] | null\n}\n\n/**\n * The session schema's verdict on a listing query, localized (EC-494:\n * `ContentQueryError` carries a catalog ref) — the canvas's `listingFailure` source.\n */\nexport function sessionListingFailure(\n  validate: (query: ListingQuery) => readonly ContentQueryError[],\n): (query: ListingQuery) => readonly string[] | null {\n  return (query) => {\n    const errors = validate(query)\n    return errors.length === 0 ? null : errors.map((error) => contentQueryErrorMessage(error))\n  }\n}\n\n/**\n * The canvas notice text for a listing node that cannot run, or `null` (EC-460, the\n * never-silent rule) — core's ONE judgment (`listingFailureOf`: the registry's verdict\n * on the declaration, then `validate`'s on the built query; a listing awaiting its\n * bound value keeps the block's own empty state). Pure, 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 failure = listingFailureOf(node, registry, { listingFailure: sessionListingFailure(validate) })\n  return failure ? failure.join(' ') : null\n}\n\n/**\n * Assemble the canvas `RenderContext` — core's ONE `createRenderContext` over the live\n * source, `mode: 'canvas'`, with the editor's decoration. Pure (no hooks): the same\n * deps produce the same context, so the decorator's wrapper markup is pinnable.\n */\nexport function createCanvasRenderContext(deps: CanvasRenderContextDeps): RenderContext {\n  return createRenderContext({\n    components: { registry: deps.registry, implementations: deps.implementations },\n    mode: 'canvas',\n    source: {\n      resolveAsset: deps.resolveAsset,\n      resolveRelation: deps.resolveRelation,\n      resolveListing: deps.resolveListing,\n      resolveLink: deps.resolveLink,\n      listingFailure: deps.listingFailure,\n    },\n    // EC-460: a listing that cannot run gets the canvas's own (chrome-styled,\n    // localized) notice ABOVE the block, which keeps its empty state below.\n    listingNotice: (_node, messages) => <CanvasListingIssueNotice message={messages.join(' ')} />,\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      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 ? <UnresolvedReusablePlaceholder status={unresolved} /> : rendered}\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 `ResolvedAsset` (EC-587 —\n * one resolved shape in every position). EC-632: in the canvas's locale `at` — the\n * locale the relations, listings and links beside it resolve in — so a localized alt\n * previews in the locale the editor has open, with delivery's fallback. Pure, exported\n * for the node test.\n */\nexport function canvasRenderAsset(record: AssetRecord | undefined, at: AssetReadLocale | null): RenderAsset | null {\n  // EC-633: a record with no URL is decided by the constructor (no resolved asset), the\n  // same answer delivery gets — so both render the same empty state.\n  return record ? resolvedAsset(record, record.url, at) : null\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: Perspective\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  // The canvas's active locale for asset/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, config: localeConfig } = useStudioLocale()\n  const activeLocale = locale ?? undefined\n  // EC-632: an asset's localized metadata (alt) reads in the same locale, falling back to\n  // the project's default — `null` (shared metadata only) before a config is installed.\n  const defaultLocale = localeConfig?.default\n  const assetLocale = useMemo(\n    () => (defaultLocale === undefined ? null : assetReadLocale({ default: defaultLocale }, activeLocale)),\n    [defaultLocale, activeLocale],\n  )\n  const assetsStore = useOptionalAssets()\n  const resolveAsset: ResolveAsset = useCallback(\n    (assetId) => canvasRenderAsset(assetsStore?.assets.find((a) => a.id === assetId), assetLocale),\n    [assetsStore, assetLocale],\n  )\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): the session schema's verdict on a listing query.\n  const listingFailure = useMemo(\n    () => sessionListingFailure((query) => validateCanvasListingQuery(query)),\n    [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        listingFailure,\n      }),\n    [studio, resolveAsset, resolveRelation, resolveListing, resolveLink, unresolvedReuse, pageNodeIds, selectedId, hoveredId, richEditEpochs, listingFailure],\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-theme-notice.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useState } from 'react';
 import { AlertTriangle, X } from 'lucide-react';
-import { translate } from '@elytracms/studio/lib/i18n';
-import { isDevRuntime } from '@elytracms/studio/lib/persistence';
+import { translate } from '../../lib/i18n/index.js';
+import { isDevRuntime } from '../../lib/persistence/index.js';
 import { Row, Text } from '@elytracms/studio/ui';
 /**
  * EC-414 AD-D item 2 — the canvas-theme runtime notice, in the established

package/dist/components/builder/canvas-theme-notice.js.map

@@ -1 +1 @@
-{"version":3,"file":"canvas-theme-notice.js","sourceRoot":"","sources":["../../../src/components/builder/canvas-theme-notice.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,aAAa,EAAE,CAAC,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,4BAA4B,CAAA;AACtD,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAA;AAChE,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAGhD;;;;;;;;;;;;;;GAcG;AAEH,MAAM,cAAc,GAAG,IAAI,GAAG,EAA6B,CAAA;AAE3D,sDAAsD;AACtD,MAAM,UAAU,8BAA8B;IAC5C,cAAc,CAAC,KAAK,EAAE,CAAA;AACxB,CAAC;AAED,MAAM,WAAW,GAAuD;IACtE,MAAM,EAAE,kCAAkC;IAC1C,kBAAkB,EAAE,2CAA2C;IAC/D,iBAAiB,EAAE,yCAAyC;IAC5D,eAAe,EAAE,wCAAwC;CAC1D,CAAA;AAED,MAAM,UAAU,iBAAiB,CAAC,EAAE,MAAM,EAAwC;IAChF,+EAA+E;IAC/E,MAAM,CAAC,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IACtC,IAAI,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE;QAAE,OAAO,IAAI,CAAA;IAC3C,MAAM,UAAU,GAAG,WAAW,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;IAC3C,IAAI,CAAC,UAAU,IAAI,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC;QAAE,OAAO,IAAI,CAAA;IAE/D,OAAO,CACL,6BACc,qBAAqB,sBACf,MAAM,CAAC,IAAI,EAC7B,SAAS,EAAC,4EAA4E,YAEtF,cAAK,SAAS,EAAC,kFAAkF,YAC/F,MAAC,GAAG,IAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,OAAO,aACxB,KAAC,aAAa,IAAC,SAAS,EAAC,uCAAuC,wBAAe,EAC/E,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,YACvC,SAAS,CAAC,UAAU,CAAC,GACjB,EACP,iBACE,IAAI,EAAC,QAAQ,gBACD,SAAS,CAAC,gBAAgB,CAAC,EACvC,OAAO,EAAE,GAAG,EAAE;4BACZ,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;4BAC/B,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAA;wBAC5B,CAAC,EACD,SAAS,EAAC,mFAAmF,YAE7F,KAAC,CAAC,IAAC,SAAS,EAAC,UAAU,GAAG,GACnB,IACL,GACF,GACF,CACP,CAAA;AACH,CAAC","sourcesContent":["import { useState } from 'react'\nimport { AlertTriangle, X } from 'lucide-react'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { isDevRuntime } from '@elytracms/studio/lib/persistence'\nimport { Row, Text } from '@elytracms/studio/ui'\nimport type { CanvasThemeStatus } from './canvas-chrome'\n\n/**\n * EC-414 AD-D item 2 — the canvas-theme runtime notice, in the established\n * validation-surface style (the `ClipboardNoticeOverlay` shape: a dismissible,\n * NEVER-blocking overlay above the canvas, in the STUDIO document — studio UI\n * primitives are fine here, this is not in-frame chrome). Dev builds only:\n *\n *   - `legacy`: the probe found the merged pre-EC-414 canvas.css — a one-time\n *     notice naming the migration (the canvas keeps working exactly as before).\n *   - `stylesheet-error` / `no-theme-tokens` / `no-stylesheet`: the canvas\n *     stylesheet is broken or missing — the invalid state is named explicitly\n *     instead of silently rendering unstyled blocks.\n *\n * \"One-time\": dismissing a kind suppresses it for the rest of the studio\n * session (module state survives canvas remounts/navigation).\n */\n\nconst dismissedKinds = new Set<CanvasThemeStatus['kind']>()\n\n/** Test hook: reset the session-sticky dismissals. */\nexport function resetCanvasThemeNoticeForTests(): void {\n  dismissedKinds.clear()\n}\n\nconst NOTICE_KEYS: Partial<Record<CanvasThemeStatus['kind'], string>> = {\n  legacy: 'builder.canvasTheme.legacyNotice',\n  'stylesheet-error': 'builder.canvasTheme.stylesheetErrorNotice',\n  'no-theme-tokens': 'builder.canvasTheme.noThemeTokensNotice',\n  'no-stylesheet': 'builder.canvasTheme.noStylesheetNotice',\n}\n\nexport function CanvasThemeNotice({ status }: { status: CanvasThemeStatus | null }) {\n  // Local state only forces the re-render on dismiss; the truth is module-level.\n  const [, setDismissedAt] = useState(0)\n  if (!status || !isDevRuntime()) return null\n  const messageKey = NOTICE_KEYS[status.kind]\n  if (!messageKey || dismissedKinds.has(status.kind)) return null\n\n  return (\n    <div\n      data-testid=\"canvas-theme-notice\"\n      data-notice-kind={status.kind}\n      className=\"absolute top-4 left-1/2 z-20 w-max max-w-[min(460px,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          <AlertTriangle className=\"mt-0.5 size-3.5 shrink-0 text-warning\" aria-hidden />\n          <Text size=\"xs\" className=\"min-w-0 flex-1\">\n            {translate(messageKey)}\n          </Text>\n          <button\n            type=\"button\"\n            aria-label={translate('common.dismiss')}\n            onClick={() => {\n              dismissedKinds.add(status.kind)\n              setDismissedAt(Date.now())\n            }}\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      </div>\n    </div>\n  )\n}\n"]}
+{"version":3,"file":"canvas-theme-notice.js","sourceRoot":"","sources":["../../../src/components/builder/canvas-theme-notice.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,aAAa,EAAE,CAAC,EAAE,MAAM,cAAc,CAAA;AAC/C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAA;AAC1C,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AACpD,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAGhD;;;;;;;;;;;;;;GAcG;AAEH,MAAM,cAAc,GAAG,IAAI,GAAG,EAA6B,CAAA;AAE3D,sDAAsD;AACtD,MAAM,UAAU,8BAA8B;IAC5C,cAAc,CAAC,KAAK,EAAE,CAAA;AACxB,CAAC;AAED,MAAM,WAAW,GAAuD;IACtE,MAAM,EAAE,kCAAkC;IAC1C,kBAAkB,EAAE,2CAA2C;IAC/D,iBAAiB,EAAE,yCAAyC;IAC5D,eAAe,EAAE,wCAAwC;CAC1D,CAAA;AAED,MAAM,UAAU,iBAAiB,CAAC,EAAE,MAAM,EAAwC;IAChF,+EAA+E;IAC/E,MAAM,CAAC,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAA;IACtC,IAAI,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE;QAAE,OAAO,IAAI,CAAA;IAC3C,MAAM,UAAU,GAAG,WAAW,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;IAC3C,IAAI,CAAC,UAAU,IAAI,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC;QAAE,OAAO,IAAI,CAAA;IAE/D,OAAO,CACL,6BACc,qBAAqB,sBACf,MAAM,CAAC,IAAI,EAC7B,SAAS,EAAC,4EAA4E,YAEtF,cAAK,SAAS,EAAC,kFAAkF,YAC/F,MAAC,GAAG,IAAC,GAAG,EAAC,GAAG,EAAC,KAAK,EAAC,OAAO,aACxB,KAAC,aAAa,IAAC,SAAS,EAAC,uCAAuC,wBAAe,EAC/E,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,SAAS,EAAC,gBAAgB,YACvC,SAAS,CAAC,UAAU,CAAC,GACjB,EACP,iBACE,IAAI,EAAC,QAAQ,gBACD,SAAS,CAAC,gBAAgB,CAAC,EACvC,OAAO,EAAE,GAAG,EAAE;4BACZ,cAAc,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,CAAC,CAAA;4BAC/B,cAAc,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAA;wBAC5B,CAAC,EACD,SAAS,EAAC,mFAAmF,YAE7F,KAAC,CAAC,IAAC,SAAS,EAAC,UAAU,GAAG,GACnB,IACL,GACF,GACF,CACP,CAAA;AACH,CAAC","sourcesContent":["import { useState } from 'react'\nimport { AlertTriangle, X } from 'lucide-react'\nimport { translate } from '../../lib/i18n'\nimport { isDevRuntime } from '../../lib/persistence'\nimport { Row, Text } from '@elytracms/studio/ui'\nimport type { CanvasThemeStatus } from './canvas-chrome'\n\n/**\n * EC-414 AD-D item 2 — the canvas-theme runtime notice, in the established\n * validation-surface style (the `ClipboardNoticeOverlay` shape: a dismissible,\n * NEVER-blocking overlay above the canvas, in the STUDIO document — studio UI\n * primitives are fine here, this is not in-frame chrome). Dev builds only:\n *\n *   - `legacy`: the probe found the merged pre-EC-414 canvas.css — a one-time\n *     notice naming the migration (the canvas keeps working exactly as before).\n *   - `stylesheet-error` / `no-theme-tokens` / `no-stylesheet`: the canvas\n *     stylesheet is broken or missing — the invalid state is named explicitly\n *     instead of silently rendering unstyled blocks.\n *\n * \"One-time\": dismissing a kind suppresses it for the rest of the studio\n * session (module state survives canvas remounts/navigation).\n */\n\nconst dismissedKinds = new Set<CanvasThemeStatus['kind']>()\n\n/** Test hook: reset the session-sticky dismissals. */\nexport function resetCanvasThemeNoticeForTests(): void {\n  dismissedKinds.clear()\n}\n\nconst NOTICE_KEYS: Partial<Record<CanvasThemeStatus['kind'], string>> = {\n  legacy: 'builder.canvasTheme.legacyNotice',\n  'stylesheet-error': 'builder.canvasTheme.stylesheetErrorNotice',\n  'no-theme-tokens': 'builder.canvasTheme.noThemeTokensNotice',\n  'no-stylesheet': 'builder.canvasTheme.noStylesheetNotice',\n}\n\nexport function CanvasThemeNotice({ status }: { status: CanvasThemeStatus | null }) {\n  // Local state only forces the re-render on dismiss; the truth is module-level.\n  const [, setDismissedAt] = useState(0)\n  if (!status || !isDevRuntime()) return null\n  const messageKey = NOTICE_KEYS[status.kind]\n  if (!messageKey || dismissedKinds.has(status.kind)) return null\n\n  return (\n    <div\n      data-testid=\"canvas-theme-notice\"\n      data-notice-kind={status.kind}\n      className=\"absolute top-4 left-1/2 z-20 w-max max-w-[min(460px,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          <AlertTriangle className=\"mt-0.5 size-3.5 shrink-0 text-warning\" aria-hidden />\n          <Text size=\"xs\" className=\"min-w-0 flex-1\">\n            {translate(messageKey)}\n          </Text>\n          <button\n            type=\"button\"\n            aria-label={translate('common.dismiss')}\n            onClick={() => {\n              dismissedKinds.add(status.kind)\n              setDismissedAt(Date.now())\n            }}\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      </div>\n    </div>\n  )\n}\n"]}

package/dist/components/builder/canvas.js

@@ -3,10 +3,10 @@ import { useCallback, useEffect, useRef, useState } from 'react';
 import { createPortal } from 'react-dom';
 import { setEditingMarkers } from '@elytracms/core/runtime-renderer';
 import { getNode } from '@elytracms/core/project-graph';
-import { getStudioRegistry } from '@elytracms/studio/lib/registry';
-import { translate } from '@elytracms/studio/lib/i18n';
+import { getStudioRegistry } from '../../lib/registry/index.js';
+import { translate } from '../../lib/i18n/index.js';
 import { DRAFT_PERSPECTIVE } from '@elytracms/core/cms-core';
-import { resolveDeploymentCanvasTheme } from '@elytracms/studio/lib/workspace';
+import { resolveDeploymentCanvasTheme } from '../../lib/workspace/index.js';
 import { wireCanvasChrome } from './canvas-chrome.js';
 import { CanvasThemeNotice } from './canvas-theme-notice.js';
 import { getCanvasStylesheetUrl } from './canvas-stylesheet.js';