@elytracms/studio 0.0.62 → 0.0.64

package/dist/components/builder/spacing-handles.js.map

@@ -1 +1 @@
-{"version":3,"file":"spacing-handles.js","sourceRoot":"","sources":["../../../src/components/builder/spacing-handles.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { DEFAULT_SLOT, isLayoutContainerNode, staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport type { FlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport {\n  containerGapStep,\n  gapHandleSpots,\n  gapStepCss,\n  gapStepFromDrag,\n} from '@elytracms/studio/lib/dnd/gap-drag'\nimport type { GapStep } from '@elytracms/studio/lib/dnd/gap-drag'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useBuilder } from './builder-store'\nimport { GAP_LABEL_KEYS, GAP_NONE_LABEL_KEY } from './layout-inspector'\n\n/**\n * Tokenized spacing handles (EC-163, vision §3.1 / AD-10): when a Stack/Grid\n * container is selected on the canvas, draggable gap handles appear between\n * its children, axis-aware via the shared `containerFlowAxis`. Dragging snaps\n * through the EC-161 spacing-token scale (`lib/dnd/gap-drag` — pure math, no\n * pixel value can escape it) with a live plain-language label (the layout\n * inspector's vocabulary). The drag previews imperatively on the rendered\n * element; releasing commits exactly ONE builder dispatch — `setProp` with the\n * token, or `removeProp` for \"no gap\", the identical values the inspector's\n * gap select writes — so one undo restores, and the graph stays the single\n * source of truth. Esc mid-drag cancels: preview reverts, nothing dispatches.\n */\n\n/** Plain-language label for a gap step — the inspector's vocabulary. */\nexport function gapStepLabel(step: GapStep): string {\n  return step === null ? translate(GAP_NONE_LABEL_KEY) : translate(GAP_LABEL_KEYS[step])\n}\n\ninterface HandleSpotView {\n  index: number\n  /** Document-coordinate position of the handle's center. */\n  x: number\n  y: number\n  crossStart: number\n  crossLength: number\n}\n\ninterface ActiveDrag {\n  index: number\n  startStep: GapStep\n  step: GapStep\n  /** Pointer start along the flow axis (client coords). */\n  startCoord: number\n  /** Live pointer position (document coords) for the floating label. */\n  labelX: number\n  labelY: number\n}\n\n/** The container's rendered element (the Stack/Grid div carrying the gap style). */\nfunction containerElementFor(doc: Document, nodeId: string): HTMLElement | null {\n  const wrapper = doc.querySelector(`[data-ec-node-id=\"${nodeId}\"]`)\n  return (wrapper?.querySelector(':scope > [data-ec-primitive]') as HTMLElement | null) ?? null\n}\n\ninterface Measured {\n  spots: HandleSpotView[]\n  /** The axis the children are *rendered* along (drag direction follows it). */\n  axis: FlowAxis\n}\n\n/**\n * Measure the handle spots between the container's rendered children. The\n * graph-level flow axis (`containerFlowAxis`) is tried first; when the\n * rendered layout disagrees — a stacking Grid below the mobile breakpoint\n * lays its \"columns\" out vertically — the cross axis is measured instead, so\n * handles always sit in the gaps the editor actually sees.\n */\nfunction measureSpots(doc: Document, nodeId: string, flowAxis: FlowAxis): Measured {\n  const container = containerElementFor(doc, nodeId)\n  const win = doc.defaultView\n  if (!container || !win) return { spots: [], axis: flowAxis }\n  const children = Array.from(\n    container.querySelectorAll(':scope > [data-ec-node-id]'),\n  ) as HTMLElement[]\n  if (children.length < 2) return { spots: [], axis: flowAxis }\n  const rects = children.map((el) => {\n    const r = el.getBoundingClientRect()\n    return { left: r.left + win.scrollX, top: r.top + win.scrollY, width: r.width, height: r.height }\n  })\n  const along = gapHandleSpots(rects, flowAxis)\n  if (along.length > 0) return { spots: along, axis: flowAxis }\n  const cross: FlowAxis = flowAxis === 'horizontal' ? 'vertical' : 'horizontal'\n  const across = gapHandleSpots(rects, cross)\n  return across.length > 0 ? { spots: across, axis: cross } : { spots: [], axis: flowAxis }\n}\n\n/** True when the node is a container with at least two children to space. */\nexport function hasSpacingHandles(node: ComponentNode | null): node is ComponentNode {\n  return (\n    node !== null &&\n    isLayoutContainerNode(node) &&\n    (node.slots?.[DEFAULT_SLOT]?.length ?? 0) >= 2\n  )\n}\n\nconst HANDLE_THICKNESS = 14\nconst HANDLE_BAR = 4\nconst HANDLE_MAX_LENGTH = 48\n\nexport function SpacingHandles({ doc, node }: { doc: Document; node: ComponentNode }) {\n  const builder = useBuilder()\n  const { dispatch } = builder\n  const flowAxis = containerFlowAxis(node)\n  const [measured, setMeasured] = useState<Measured>({ spots: [], axis: flowAxis })\n  const [drag, setDrag] = useState<ActiveDrag | null>(null)\n  const dragRef = useRef<ActiveDrag | null>(null)\n  // The container's pre-drag inline gap, restored on cancel/commit (the graph\n  // re-render owns the committed value; the preview is imperative-only).\n  const inlineGapRef = useRef<string>('')\n\n  // Re-measure when the graph, selection, drag preview, or iframe size change.\n  useLayoutEffect(() => {\n    const measure = () => setMeasured(measureSpots(doc, node.id, flowAxis))\n    measure()\n    const win = doc.defaultView\n    win?.addEventListener('resize', measure)\n    return () => win?.removeEventListener('resize', measure)\n  }, [doc, node, flowAxis, builder.present, builder.viewport, drag?.step])\n  const { spots, axis } = measured\n\n  const applyPreview = useCallback(\n    (step: GapStep) => {\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = gapStepCss(step)\n    },\n    [doc, node.id],\n  )\n\n  const finish = useCallback(\n    (mode: 'commit' | 'cancel') => {\n      const active = dragRef.current\n      if (!active) return\n      dragRef.current = null\n      setDrag(null)\n      // Drop the imperative preview; the rendered graph value takes over.\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = inlineGapRef.current\n      if (mode === 'commit' && active.step !== active.startStep) {\n        // Exactly one dispatch — one operations command, one undo step — and\n        // the identical prop value the inspector's gap select produces.\n        if (active.step === null) {\n          dispatch({ type: 'removeProp', id: node.id, name: 'gap' })\n        } else {\n          dispatch({ type: 'setProp', id: node.id, name: 'gap', value: staticProp(active.step) })\n        }\n      }\n    },\n    [doc, node.id, dispatch],\n  )\n\n  // Esc cancels mid-drag — listen on both documents (focus may sit either side\n  // of the iframe boundary while the pointer is captured).\n  useEffect(() => {\n    if (!drag) return\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        e.stopPropagation()\n        finish('cancel')\n      }\n    }\n    doc.addEventListener('keydown', onKeyDown, true)\n    document.addEventListener('keydown', onKeyDown, true)\n    return () => {\n      doc.removeEventListener('keydown', onKeyDown, true)\n      document.removeEventListener('keydown', onKeyDown, true)\n    }\n  }, [drag, doc, finish])\n\n  // Cleanup on unmount/selection change mid-drag: revert, never dispatch.\n  useEffect(() => () => finish('cancel'), [finish])\n\n  const onPointerDown = (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => {\n    if (e.button !== 0) return\n    e.preventDefault()\n    e.stopPropagation()\n    const startStep = containerGapStep(node)\n    const container = containerElementFor(doc, node.id)\n    inlineGapRef.current = container?.style.gap ?? ''\n    try {\n      e.currentTarget.setPointerCapture(e.pointerId)\n    } catch {\n      // Synthetic pointer events (tests, automation) have no active pointer\n      // to capture; move/up still arrive via the handle's own listeners.\n    }\n    const next: ActiveDrag = {\n      index: spot.index,\n      startStep,\n      step: startStep,\n      startCoord: axis === 'horizontal' ? e.clientX : e.clientY,\n      labelX: spot.x,\n      labelY: spot.y,\n    }\n    dragRef.current = next\n    setDrag(next)\n  }\n\n  const onPointerMove = (e: React.PointerEvent<HTMLDivElement>) => {\n    const active = dragRef.current\n    if (!active) return\n    const win = doc.defaultView\n    const coord = axis === 'horizontal' ? e.clientX : e.clientY\n    const step = gapStepFromDrag(active.startStep, coord - active.startCoord)\n    const next: ActiveDrag = {\n      ...active,\n      step,\n      labelX: e.clientX + (win?.scrollX ?? 0),\n      labelY: e.clientY + (win?.scrollY ?? 0),\n    }\n    dragRef.current = next\n    setDrag(next)\n    applyPreview(step)\n  }\n\n  const horizontal = axis === 'horizontal'\n\n  return createPortal(\n    <div data-ec-spacing-handles=\"\">\n      {spots.map((spot) => {\n        const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH)\n        const active = drag?.index === spot.index\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-handle={spot.index}\n            role=\"separator\"\n            aria-label={translate('builder.spacing.gapAfterChild', { index: spot.index + 1 })}\n            aria-orientation={horizontal ? 'vertical' : 'horizontal'}\n            onPointerDown={onPointerDown(spot)}\n            onPointerMove={onPointerMove}\n            onPointerUp={() => finish('commit')}\n            onPointerCancel={() => finish('cancel')}\n            style={{\n              position: 'absolute',\n              left: spot.x - (horizontal ? HANDLE_THICKNESS / 2 : length / 2),\n              top: spot.y - (horizontal ? length / 2 : HANDLE_THICKNESS / 2),\n              width: horizontal ? HANDLE_THICKNESS : length,\n              height: horizontal ? length : HANDLE_THICKNESS,\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n              cursor: horizontal ? 'col-resize' : 'row-resize',\n              zIndex: 40,\n              touchAction: 'none',\n            }}\n          >\n            <div\n              style={{\n                width: horizontal ? HANDLE_BAR : '100%',\n                height: horizontal ? '100%' : HANDLE_BAR,\n                borderRadius: 999,\n                backgroundColor: active ? '#5b8cff' : 'rgba(91, 140, 255, 0.65)',\n                boxShadow: '0 0 0 1px rgba(8, 12, 24, 0.55)',\n              }}\n            />\n          </div>\n        )\n      })}\n      {drag ? (\n        <div\n          data-ec-gap-label=\"\"\n          style={{\n            position: 'absolute',\n            left: drag.labelX + 12,\n            top: drag.labelY + 12,\n            zIndex: 50,\n            pointerEvents: 'none',\n            padding: '2px 8px',\n            borderRadius: 6,\n            fontSize: 11,\n            fontWeight: 600,\n            whiteSpace: 'nowrap',\n            color: '#fff',\n            backgroundColor: '#5b8cff',\n            boxShadow: '0 2px 8px rgba(8, 12, 24, 0.4)',\n          }}\n        >\n          {gapStepLabel(drag.step)}\n        </div>\n      ) : null}\n    </div>,\n    doc.body,\n  )\n}\n"]}
+{"version":3,"file":"spacing-handles.js","sourceRoot":"","sources":["../../../src/components/builder/spacing-handles.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { DEFAULT_SLOT, isLayoutContainerNode, staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode } from '@elytracms/core/project-graph'\nimport { containerFlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport type { FlowAxis } from '@elytracms/studio/lib/dnd/drop-rules'\nimport {\n  containerGapStep,\n  gapHandleSpots,\n  gapStepCss,\n  gapStepFromDrag,\n} from '@elytracms/studio/lib/dnd/gap-drag'\nimport type { GapStep } from '@elytracms/studio/lib/dnd/gap-drag'\nimport { translate } from '@elytracms/studio/lib/i18n'\nimport { useBuilder } from './builder-store'\nimport { GAP_LABEL_KEYS, GAP_NONE_LABEL_KEY } from './layout-inspector'\n\n/**\n * Tokenized spacing handles (EC-163, vision §3.1 / AD-10): when a Stack/Grid\n * container is selected on the canvas, draggable gap handles appear between\n * its children, axis-aware via the shared `containerFlowAxis`. Dragging snaps\n * through the EC-161 spacing-token scale (`lib/dnd/gap-drag` — pure math, no\n * pixel value can escape it) with a live plain-language label (the layout\n * inspector's vocabulary). The drag previews imperatively on the rendered\n * element; releasing commits exactly ONE builder dispatch — `setProp` with the\n * token, or `removeProp` for \"no gap\", the identical values the inspector's\n * gap select writes — so one undo restores, and the graph stays the single\n * source of truth. Esc mid-drag cancels: preview reverts, nothing dispatches.\n */\n\n/** Plain-language label for a gap step — the inspector's vocabulary. */\nexport function gapStepLabel(step: GapStep): string {\n  return step === null ? translate(GAP_NONE_LABEL_KEY) : translate(GAP_LABEL_KEYS[step])\n}\n\nexport interface HandleSpotView {\n  index: number\n  /** Document-coordinate position of the handle's center. */\n  x: number\n  y: number\n  crossStart: number\n  crossLength: number\n}\n\ninterface ActiveDrag {\n  index: number\n  startStep: GapStep\n  step: GapStep\n  /** Pointer start along the flow axis (client coords). */\n  startCoord: number\n  /** Live pointer position (document coords) for the floating label. */\n  labelX: number\n  labelY: number\n}\n\n/** The container's rendered element (the Stack/Grid div carrying the gap style). */\nfunction containerElementFor(doc: Document, nodeId: string): HTMLElement | null {\n  const wrapper = doc.querySelector(`[data-ec-node-id=\"${nodeId}\"]`)\n  return (wrapper?.querySelector(':scope > [data-ec-primitive]') as HTMLElement | null) ?? null\n}\n\ninterface Measured {\n  spots: HandleSpotView[]\n  /** The axis the children are *rendered* along (drag direction follows it). */\n  axis: FlowAxis\n}\n\n/**\n * Measure the handle spots between the container's rendered children. The\n * graph-level flow axis (`containerFlowAxis`) is tried first; when the\n * rendered layout disagrees — a stacking Grid below the mobile breakpoint\n * lays its \"columns\" out vertically — the cross axis is measured instead, so\n * handles always sit in the gaps the editor actually sees.\n */\nfunction measureSpots(doc: Document, nodeId: string, flowAxis: FlowAxis): Measured {\n  const container = containerElementFor(doc, nodeId)\n  const win = doc.defaultView\n  if (!container || !win) return { spots: [], axis: flowAxis }\n  const children = Array.from(\n    container.querySelectorAll(':scope > [data-ec-node-id]'),\n  ) as HTMLElement[]\n  if (children.length < 2) return { spots: [], axis: flowAxis }\n  const rects = children.map((el) => {\n    const r = el.getBoundingClientRect()\n    return { left: r.left + win.scrollX, top: r.top + win.scrollY, width: r.width, height: r.height }\n  })\n  const along = gapHandleSpots(rects, flowAxis)\n  if (along.length > 0) return { spots: along, axis: flowAxis }\n  const cross: FlowAxis = flowAxis === 'horizontal' ? 'vertical' : 'horizontal'\n  const across = gapHandleSpots(rects, cross)\n  return across.length > 0 ? { spots: across, axis: cross } : { spots: [], axis: flowAxis }\n}\n\n/** True when the node is a container with at least two children to space. */\nexport function hasSpacingHandles(node: ComponentNode | null): node is ComponentNode {\n  return (\n    node !== null &&\n    isLayoutContainerNode(node) &&\n    (node.slots?.[DEFAULT_SLOT]?.length ?? 0) >= 2\n  )\n}\n\nconst HANDLE_THICKNESS = 14\nconst HANDLE_BAR = 4\nconst HANDLE_MAX_LENGTH = 48\n\n/** Everything the portal-free handle markup needs (chrome contract surface). */\nexport interface SpacingHandlesViewProps {\n  spots: HandleSpotView[]\n  horizontal: boolean\n  /** The live drag, for the active-handle tint and the floating label. */\n  drag: { index: number; labelX: number; labelY: number; label: string } | null\n  onPointerDown: (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => void\n  onPointerMove: (e: React.PointerEvent<HTMLDivElement>) => void\n  onPointerUp: () => void\n  onPointerCancel: () => void\n}\n\n/**\n * The spacing handles' rendered markup, portal-free so the AD-D chrome\n * contract test can walk it with `renderToStaticMarkup`. In-frame chrome\n * contract (EC-414 AD-B): `ec-*`/`data-ec-*` plus inline styles only; the root\n * carries the `.ec-chrome` containment recipe.\n */\nexport function SpacingHandlesView(props: SpacingHandlesViewProps) {\n  const { spots, horizontal, drag } = props\n  return (\n    <div data-ec-spacing-handles=\"\" className=\"ec-chrome\">\n      {spots.map((spot) => {\n        const length = Math.min(spot.crossLength, HANDLE_MAX_LENGTH)\n        const active = drag?.index === spot.index\n        return (\n          <div\n            key={spot.index}\n            data-ec-gap-handle={spot.index}\n            role=\"separator\"\n            aria-label={translate('builder.spacing.gapAfterChild', { index: spot.index + 1 })}\n            aria-orientation={horizontal ? 'vertical' : 'horizontal'}\n            onPointerDown={props.onPointerDown(spot)}\n            onPointerMove={props.onPointerMove}\n            onPointerUp={props.onPointerUp}\n            onPointerCancel={props.onPointerCancel}\n            style={{\n              position: 'absolute',\n              left: spot.x - (horizontal ? HANDLE_THICKNESS / 2 : length / 2),\n              top: spot.y - (horizontal ? length / 2 : HANDLE_THICKNESS / 2),\n              width: horizontal ? HANDLE_THICKNESS : length,\n              height: horizontal ? length : HANDLE_THICKNESS,\n              display: 'flex',\n              alignItems: 'center',\n              justifyContent: 'center',\n              cursor: horizontal ? 'col-resize' : 'row-resize',\n              zIndex: 40,\n              touchAction: 'none',\n            }}\n          >\n            <div\n              style={{\n                width: horizontal ? HANDLE_BAR : '100%',\n                height: horizontal ? '100%' : HANDLE_BAR,\n                borderRadius: 999,\n                backgroundColor: active ? '#5b8cff' : 'rgba(91, 140, 255, 0.65)',\n                boxShadow: '0 0 0 1px rgba(8, 12, 24, 0.55)',\n              }}\n            />\n          </div>\n        )\n      })}\n      {drag ? (\n        <div\n          data-ec-gap-label=\"\"\n          style={{\n            position: 'absolute',\n            left: drag.labelX + 12,\n            top: drag.labelY + 12,\n            zIndex: 50,\n            pointerEvents: 'none',\n            padding: '2px 8px',\n            borderRadius: 6,\n            fontSize: 11,\n            fontWeight: 600,\n            whiteSpace: 'nowrap',\n            color: '#fff',\n            backgroundColor: '#5b8cff',\n            boxShadow: '0 2px 8px rgba(8, 12, 24, 0.4)',\n          }}\n        >\n          {drag.label}\n        </div>\n      ) : null}\n    </div>\n  )\n}\n\nexport function SpacingHandles({ doc, node }: { doc: Document; node: ComponentNode }) {\n  const builder = useBuilder()\n  const { dispatch } = builder\n  const flowAxis = containerFlowAxis(node)\n  const [measured, setMeasured] = useState<Measured>({ spots: [], axis: flowAxis })\n  const [drag, setDrag] = useState<ActiveDrag | null>(null)\n  const dragRef = useRef<ActiveDrag | null>(null)\n  // The container's pre-drag inline gap, restored on cancel/commit (the graph\n  // re-render owns the committed value; the preview is imperative-only).\n  const inlineGapRef = useRef<string>('')\n\n  // Re-measure when the graph, selection, drag preview, or iframe size change.\n  useLayoutEffect(() => {\n    const measure = () => setMeasured(measureSpots(doc, node.id, flowAxis))\n    measure()\n    const win = doc.defaultView\n    win?.addEventListener('resize', measure)\n    return () => win?.removeEventListener('resize', measure)\n  }, [doc, node, flowAxis, builder.present, builder.viewport, drag?.step])\n  const { spots, axis } = measured\n\n  const applyPreview = useCallback(\n    (step: GapStep) => {\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = gapStepCss(step)\n    },\n    [doc, node.id],\n  )\n\n  const finish = useCallback(\n    (mode: 'commit' | 'cancel') => {\n      const active = dragRef.current\n      if (!active) return\n      dragRef.current = null\n      setDrag(null)\n      // Drop the imperative preview; the rendered graph value takes over.\n      const container = containerElementFor(doc, node.id)\n      if (container) container.style.gap = inlineGapRef.current\n      if (mode === 'commit' && active.step !== active.startStep) {\n        // Exactly one dispatch — one operations command, one undo step — and\n        // the identical prop value the inspector's gap select produces.\n        if (active.step === null) {\n          dispatch({ type: 'removeProp', id: node.id, name: 'gap' })\n        } else {\n          dispatch({ type: 'setProp', id: node.id, name: 'gap', value: staticProp(active.step) })\n        }\n      }\n    },\n    [doc, node.id, dispatch],\n  )\n\n  // Esc cancels mid-drag — listen on both documents (focus may sit either side\n  // of the iframe boundary while the pointer is captured).\n  useEffect(() => {\n    if (!drag) return\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.key === 'Escape') {\n        e.preventDefault()\n        e.stopPropagation()\n        finish('cancel')\n      }\n    }\n    doc.addEventListener('keydown', onKeyDown, true)\n    document.addEventListener('keydown', onKeyDown, true)\n    return () => {\n      doc.removeEventListener('keydown', onKeyDown, true)\n      document.removeEventListener('keydown', onKeyDown, true)\n    }\n  }, [drag, doc, finish])\n\n  // Cleanup on unmount/selection change mid-drag: revert, never dispatch.\n  useEffect(() => () => finish('cancel'), [finish])\n\n  const onPointerDown = (spot: HandleSpotView) => (e: React.PointerEvent<HTMLDivElement>) => {\n    if (e.button !== 0) return\n    e.preventDefault()\n    e.stopPropagation()\n    const startStep = containerGapStep(node)\n    const container = containerElementFor(doc, node.id)\n    inlineGapRef.current = container?.style.gap ?? ''\n    try {\n      e.currentTarget.setPointerCapture(e.pointerId)\n    } catch {\n      // Synthetic pointer events (tests, automation) have no active pointer\n      // to capture; move/up still arrive via the handle's own listeners.\n    }\n    const next: ActiveDrag = {\n      index: spot.index,\n      startStep,\n      step: startStep,\n      startCoord: axis === 'horizontal' ? e.clientX : e.clientY,\n      labelX: spot.x,\n      labelY: spot.y,\n    }\n    dragRef.current = next\n    setDrag(next)\n  }\n\n  const onPointerMove = (e: React.PointerEvent<HTMLDivElement>) => {\n    const active = dragRef.current\n    if (!active) return\n    const win = doc.defaultView\n    const coord = axis === 'horizontal' ? e.clientX : e.clientY\n    const step = gapStepFromDrag(active.startStep, coord - active.startCoord)\n    const next: ActiveDrag = {\n      ...active,\n      step,\n      labelX: e.clientX + (win?.scrollX ?? 0),\n      labelY: e.clientY + (win?.scrollY ?? 0),\n    }\n    dragRef.current = next\n    setDrag(next)\n    applyPreview(step)\n  }\n\n  const horizontal = axis === 'horizontal'\n\n  return createPortal(\n    <SpacingHandlesView\n      spots={spots}\n      horizontal={horizontal}\n      drag={\n        drag\n          ? { index: drag.index, labelX: drag.labelX, labelY: drag.labelY, label: gapStepLabel(drag.step) }\n          : null\n      }\n      onPointerDown={onPointerDown}\n      onPointerMove={onPointerMove}\n      onPointerUp={() => finish('commit')}\n      onPointerCancel={() => finish('cancel')}\n    />,\n    doc.body,\n  )\n}\n"]}

package/dist/components/cms/cms-index.js

@@ -5,7 +5,7 @@ import { Link, STUDIO_PROJECT_ROUTE, studioPath } from '@elytracms/studio/router
 import { useCms } from '@elytracms/studio/components/cms/cms-store';
 import { focusCollectionList } from './collection-focus.js';
 import { Card, Code, Heading, Spacer, Stack, Text } from '@elytracms/studio/ui';
-import { localizedLabel } from '@elytracms/studio/lib/i18n';
+import { localizedLabel, useT } from '@elytracms/studio/lib/i18n';
 /**
  * The CMS section landing view (EC-223 Stage 6): the collection grid, shown when
  * no collection is selected. Takes `projectId` as a prop; the splat resolver
@@ -14,13 +14,16 @@ import { localizedLabel } from '@elytracms/studio/lib/i18n';
  */
 export function CmsIndex({ projectId, focusCollections, }) {
     const cms = useCms();
+    const t = useT();
     const collections = focusCollectionList(cms.collections, focusCollections);
-    return (_jsx("div", { className: "mx-auto w-full max-w-3xl p-4 sm:p-6", children: _jsxs(Stack, { gap: "6", children: [_jsxs(Stack, { gap: "1", children: [_jsx(Heading, { size: "display", children: "Content" }), _jsx(Text, { tone: "muted", children: "Schema-driven collections. Open a collection to browse its documents as a table and edit them in the detail editor." })] }), _jsx("div", { className: "grid gap-3 sm:grid-cols-2", children: collections.map((collection) => {
+    return (_jsx("div", { className: "mx-auto w-full max-w-3xl p-4 sm:p-6", children: _jsxs(Stack, { gap: "6", children: [_jsxs(Stack, { gap: "1", children: [_jsx(Heading, { size: "display", children: t('cms.index.heading') }), _jsx(Text, { tone: "muted", children: t('cms.index.description') })] }), _jsx("div", { className: "grid gap-3 sm:grid-cols-2", children: collections.map((collection) => {
                         // EC-217: a singleton reads as one fixed document — a distinct icon
                         // and a "Single document" note instead of a (always-1) row count.
                         const singleton = isSingleton(collection);
                         const Icon = singleton ? FileCog : Database;
-                        return (_jsx(Link, { to: STUDIO_PROJECT_ROUTE, params: { projectId, _splat: studioPath.cmsCollection(collection.id) }, children: _jsxs(Card, { className: "flex items-center gap-3 p-4 transition-colors hover:border-primary/30", children: [_jsx("span", { className: "grid size-9 shrink-0 place-items-center rounded-lg bg-muted text-muted-foreground", children: _jsx(Icon, { className: "size-4" }) }), _jsxs(Stack, { gap: "none", className: "min-w-0", children: [_jsx(Text, { weight: "semibold", className: "truncate", children: localizedLabel(collection.form?.label, collection.id) }), _jsxs(Code, { tone: "muted", className: "w-fit", children: [collection.id, " \u00B7 ", collection.fields.length, " fields"] })] }), _jsx(Spacer, {}), singleton ? (_jsx(Text, { size: "xs", tone: "muted", className: "whitespace-nowrap", children: "Single document" })) : (_jsx(Text, { size: "sm", tone: "muted", mono: true, children: cms.documentsOf(collection.id).length }))] }) }, collection.id));
+                        return (_jsx(Link, { to: STUDIO_PROJECT_ROUTE, params: { projectId, _splat: studioPath.cmsCollection(collection.id) }, children: _jsxs(Card, { className: "flex items-center gap-3 p-4 transition-colors hover:border-primary/30", children: [_jsx("span", { className: "grid size-9 shrink-0 place-items-center rounded-lg bg-muted text-muted-foreground", children: _jsx(Icon, { className: "size-4" }) }), _jsxs(Stack, { gap: "none", className: "min-w-0", children: [_jsx(Text, { weight: "semibold", className: "truncate", children: localizedLabel(collection.form?.label, collection.id) }), _jsxs(Code, { tone: "muted", className: "w-fit", children: [collection.id, " \u00B7", ' ', t(collection.fields.length === 1
+                                                        ? 'cms.index.fieldCount.one'
+                                                        : 'cms.index.fieldCount.other', { count: collection.fields.length })] })] }), _jsx(Spacer, {}), singleton ? (_jsx(Text, { size: "xs", tone: "muted", className: "whitespace-nowrap", children: t('cms.index.singleDocument') })) : (_jsx(Text, { size: "sm", tone: "muted", mono: true, children: cms.documentsOf(collection.id).length }))] }) }, collection.id));
                     }) })] }) }));
 }
 //# sourceMappingURL=cms-index.js.map

package/dist/components/cms/cms-index.js.map

@@ -1 +1 @@
-{"version":3,"file":"cms-index.js","sourceRoot":"","sources":["../../../src/components/cms/cms-index.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,cAAc,CAAA;AAChD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AACtD,OAAO,EAAE,IAAI,EAAE,oBAAoB,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAA;AACjF,OAAO,EAAE,MAAM,EAAE,MAAM,4CAA4C,CAAA;AACnE,OAAO,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AACxD,OAAO,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAA;AAC/E,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAE3D;;;;;GAKG;AACH,MAAM,UAAU,QAAQ,CAAC,EACvB,SAAS,EACT,gBAAgB,GAIjB;IACC,MAAM,GAAG,GAAG,MAAM,EAAE,CAAA;IACpB,MAAM,WAAW,GAAG,mBAAmB,CAAC,GAAG,CAAC,WAAW,EAAE,gBAAgB,CAAC,CAAA;IAE1E,OAAO,CACL,cAAK,SAAS,EAAC,qCAAqC,YAClD,MAAC,KAAK,IAAC,GAAG,EAAC,GAAG,aACZ,MAAC,KAAK,IAAC,GAAG,EAAC,GAAG,aACZ,KAAC,OAAO,IAAC,IAAI,EAAC,SAAS,wBAAkB,EACzC,KAAC,IAAI,IAAC,IAAI,EAAC,OAAO,oIAGX,IACD,EACR,cAAK,SAAS,EAAC,2BAA2B,YACvC,WAAW,CAAC,GAAG,CAAC,CAAC,UAAU,EAAE,EAAE;wBAC9B,oEAAoE;wBACpE,kEAAkE;wBAClE,MAAM,SAAS,GAAG,WAAW,CAAC,UAAU,CAAC,CAAA;wBACzC,MAAM,IAAI,GAAG,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,QAAQ,CAAA;wBAC3C,OAAO,CACL,KAAC,IAAI,IAEH,EAAE,EAAE,oBAAoB,EACxB,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,EAAE,CAAC,EAAE,YAEtE,MAAC,IAAI,IAAC,SAAS,EAAC,uEAAuE,aACrF,eAAM,SAAS,EAAC,mFAAmF,YACjG,KAAC,IAAI,IAAC,SAAS,EAAC,QAAQ,GAAG,GACtB,EACP,MAAC,KAAK,IAAC,GAAG,EAAC,MAAM,EAAC,SAAS,EAAC,SAAS,aACnC,KAAC,IAAI,IAAC,MAAM,EAAC,UAAU,EAAC,SAAS,EAAC,UAAU,YACzC,cAAc,CAAC,UAAU,CAAC,IAAI,EAAE,KAAK,EAAE,UAAU,CAAC,EAAE,CAAC,GACjD,EACP,MAAC,IAAI,IAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,OAAO,aACjC,UAAU,CAAC,EAAE,cAAK,UAAU,CAAC,MAAM,CAAC,MAAM,eACtC,IACD,EACR,KAAC,MAAM,KAAG,EACT,SAAS,CAAC,CAAC,CAAC,CACX,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,mBAAmB,gCAEnD,CACR,CAAC,CAAC,CAAC,CACF,KAAC,IAAI,IAAC,IAAI,EAAC,IAAI,EAAC,IAAI,EAAC,OAAO,EAAC,IAAI,kBAC9B,GAAG,CAAC,WAAW,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,MAAM,GACjC,CACR,IACI,IA1BF,UAAU,CAAC,EAAE,CA2Bb,CACR,CAAA;oBACH,CAAC,CAAC,GACE,IACA,GACJ,CACP,CAAA;AACH,CAAC","sourcesContent":["import { Database, FileCog } from 'lucide-react'\nimport { isSingleton } from '@elytracms/core/cms-core'\nimport { Link, STUDIO_PROJECT_ROUTE, studioPath } from '@elytracms/studio/router'\nimport { useCms } from '@elytracms/studio/components/cms/cms-store'\nimport { focusCollectionList } from './collection-focus'\nimport { Card, Code, Heading, Spacer, Stack, Text } from '@elytracms/studio/ui'\nimport { localizedLabel } from '@elytracms/studio/lib/i18n'\n\n/**\n * The CMS section landing view (EC-223 Stage 6): the collection grid, shown when\n * no collection is selected. Takes `projectId` as a prop; the splat resolver\n * mounts it inside the CMS provider so {@link useCms} resolves. `focusCollections`\n * (EC-239) narrows the grid for a focused CMS module instance.\n */\nexport function CmsIndex({\n  projectId,\n  focusCollections,\n}: {\n  projectId: string\n  focusCollections?: readonly string[]\n}) {\n  const cms = useCms()\n  const collections = focusCollectionList(cms.collections, focusCollections)\n\n  return (\n    <div className=\"mx-auto w-full max-w-3xl p-4 sm:p-6\">\n      <Stack gap=\"6\">\n        <Stack gap=\"1\">\n          <Heading size=\"display\">Content</Heading>\n          <Text tone=\"muted\">\n            Schema-driven collections. Open a collection to browse its documents as a table and edit\n            them in the detail editor.\n          </Text>\n        </Stack>\n        <div className=\"grid gap-3 sm:grid-cols-2\">\n          {collections.map((collection) => {\n            // EC-217: a singleton reads as one fixed document — a distinct icon\n            // and a \"Single document\" note instead of a (always-1) row count.\n            const singleton = isSingleton(collection)\n            const Icon = singleton ? FileCog : Database\n            return (\n              <Link\n                key={collection.id}\n                to={STUDIO_PROJECT_ROUTE}\n                params={{ projectId, _splat: studioPath.cmsCollection(collection.id) }}\n              >\n                <Card className=\"flex items-center gap-3 p-4 transition-colors hover:border-primary/30\">\n                  <span className=\"grid size-9 shrink-0 place-items-center rounded-lg bg-muted text-muted-foreground\">\n                    <Icon className=\"size-4\" />\n                  </span>\n                  <Stack gap=\"none\" className=\"min-w-0\">\n                    <Text weight=\"semibold\" className=\"truncate\">\n                      {localizedLabel(collection.form?.label, collection.id)}\n                    </Text>\n                    <Code tone=\"muted\" className=\"w-fit\">\n                      {collection.id} · {collection.fields.length} fields\n                    </Code>\n                  </Stack>\n                  <Spacer />\n                  {singleton ? (\n                    <Text size=\"xs\" tone=\"muted\" className=\"whitespace-nowrap\">\n                      Single document\n                    </Text>\n                  ) : (\n                    <Text size=\"sm\" tone=\"muted\" mono>\n                      {cms.documentsOf(collection.id).length}\n                    </Text>\n                  )}\n                </Card>\n              </Link>\n            )\n          })}\n        </div>\n      </Stack>\n    </div>\n  )\n}\n"]}
+{"version":3,"file":"cms-index.js","sourceRoot":"","sources":["../../../src/components/cms/cms-index.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Database, FileCog } from 'lucide-react'\nimport { isSingleton } from '@elytracms/core/cms-core'\nimport { Link, STUDIO_PROJECT_ROUTE, studioPath } from '@elytracms/studio/router'\nimport { useCms } from '@elytracms/studio/components/cms/cms-store'\nimport { focusCollectionList } from './collection-focus'\nimport { Card, Code, Heading, Spacer, Stack, Text } from '@elytracms/studio/ui'\nimport { localizedLabel, useT } from '@elytracms/studio/lib/i18n'\n\n/**\n * The CMS section landing view (EC-223 Stage 6): the collection grid, shown when\n * no collection is selected. Takes `projectId` as a prop; the splat resolver\n * mounts it inside the CMS provider so {@link useCms} resolves. `focusCollections`\n * (EC-239) narrows the grid for a focused CMS module instance.\n */\nexport function CmsIndex({\n  projectId,\n  focusCollections,\n}: {\n  projectId: string\n  focusCollections?: readonly string[]\n}) {\n  const cms = useCms()\n  const t = useT()\n  const collections = focusCollectionList(cms.collections, focusCollections)\n\n  return (\n    <div className=\"mx-auto w-full max-w-3xl p-4 sm:p-6\">\n      <Stack gap=\"6\">\n        <Stack gap=\"1\">\n          <Heading size=\"display\">{t('cms.index.heading')}</Heading>\n          <Text tone=\"muted\">{t('cms.index.description')}</Text>\n        </Stack>\n        <div className=\"grid gap-3 sm:grid-cols-2\">\n          {collections.map((collection) => {\n            // EC-217: a singleton reads as one fixed document — a distinct icon\n            // and a \"Single document\" note instead of a (always-1) row count.\n            const singleton = isSingleton(collection)\n            const Icon = singleton ? FileCog : Database\n            return (\n              <Link\n                key={collection.id}\n                to={STUDIO_PROJECT_ROUTE}\n                params={{ projectId, _splat: studioPath.cmsCollection(collection.id) }}\n              >\n                <Card className=\"flex items-center gap-3 p-4 transition-colors hover:border-primary/30\">\n                  <span className=\"grid size-9 shrink-0 place-items-center rounded-lg bg-muted text-muted-foreground\">\n                    <Icon className=\"size-4\" />\n                  </span>\n                  <Stack gap=\"none\" className=\"min-w-0\">\n                    <Text weight=\"semibold\" className=\"truncate\">\n                      {localizedLabel(collection.form?.label, collection.id)}\n                    </Text>\n                    <Code tone=\"muted\" className=\"w-fit\">\n                      {collection.id} ·{' '}\n                      {t(\n                        collection.fields.length === 1\n                          ? 'cms.index.fieldCount.one'\n                          : 'cms.index.fieldCount.other',\n                        { count: collection.fields.length },\n                      )}\n                    </Code>\n                  </Stack>\n                  <Spacer />\n                  {singleton ? (\n                    <Text size=\"xs\" tone=\"muted\" className=\"whitespace-nowrap\">\n                      {t('cms.index.singleDocument')}\n                    </Text>\n                  ) : (\n                    <Text size=\"sm\" tone=\"muted\" mono>\n                      {cms.documentsOf(collection.id).length}\n                    </Text>\n                  )}\n                </Card>\n              </Link>\n            )\n          })}\n        </div>\n      </Stack>\n    </div>\n  )\n}\n"]}

package/dist/components/components/component-preview.d.ts

@@ -69,7 +69,8 @@ export declare class PreviewErrorBoundary extends Component<{
  * The EC-191 fallback panel — component name + "preview unavailable" + the error.
  * Rendered INTO the preview iframe (which carries only the project stylesheet, and
  * may carry none in tests), so it uses inline styles rather than studio UI classes
- * — matching the canvas's own in-iframe placeholder convention.
+ * — the EC-414 AD-B chrome contract, with the `.ec-chrome` containment recipe on
+ * its root (walked by the chrome contract test).
  */
 export declare function PreviewUnavailable({ displayName, error }: {
     displayName: string;

package/dist/components/components/component-preview.js

@@ -9,6 +9,8 @@ import { previewSpecs } from '@elytracms/studio/lib/registry/preview';
 import { Badge, Button, Code, Field, Row, Spacer, Stack, TabButton, Text } from '@elytracms/studio/ui';
 import { localizedLabel, translate } from '@elytracms/studio/lib/i18n';
 import { cn } from '@elytracms/studio/lib/utils';
+import { resolveDeploymentCanvasTheme } from '@elytracms/studio/lib/workspace';
+import { wireCanvasChrome } from '../builder/canvas-chrome.js';
 import { getCanvasStylesheetUrl } from '../builder/canvas-stylesheet.js';
 import { useCanvasViewports, viewportWidth } from '../builder/canvas-breakpoints.js';
 import { PropValueControl } from '../cms/prop-fields.js';
@@ -97,20 +99,23 @@ function ServerOnlyNotice() {
 const MIN_PREVIEW_HEIGHT = 360;
 /**
  * The live preview render surface. Reuses the BuilderCanvas styling mechanism
- * (EC-061, `canvas.tsx`): the component renders inside an ISOLATED same-origin
- * iframe that `<link>`s the project's canvas stylesheet
- * (`getCanvasStylesheetUrl()` — the consuming app's delivery CSS + studio CSS), so
- * a component built with the site's Tailwind theme previews with the site's styles,
- * exactly as it does on the canvas and in delivery. Using the iframe (not the
- * studio DOM) is what keeps the delivery CSS scoped and off the studio chrome.
+ * (EC-061, `canvas.tsx`) — since EC-414 through the SAME code path, `wireCanvasChrome`
+ * (closing the EC-389 follow-up): the component renders inside an ISOLATED
+ * same-origin iframe that `<link>`s the project's canvas stylesheet
+ * (`getCanvasStylesheetUrl()` — the consumer's theme entry; in the legacy merged
+ * world also the studio CSS), so a component built with the site's Tailwind theme
+ * previews with the site's styles, exactly as it does on the canvas and in
+ * delivery. Using the iframe (not the studio DOM) is what keeps the delivery CSS
+ * scoped and off the studio chrome.
  *
  * Unlike the builder canvas, this iframe's document is deliberately left OUT of
  * the studio's own dark/light class: this is a standalone-component reference
  * surface (not a full page), so its own negative space around the component must
  * read as a light, site-like backdrop — never the studio chrome's current theme
  * (a black frame is exactly what leaks through when the studio is dark-themed and
- * the iframe root inherits that class). The canvas stylesheet's `:root` (light)
- * tokens supply that backdrop for free once the `.dark` class is never added here.
+ * the iframe root inherits that class). The chrome's world probe supplies that
+ * backdrop: the neutral backdrop rules in the new world, the studio `:root`
+ * (light) tokens in the legacy one.
  *
  * Sizing: width is driven by the caller (the breakpoint selector); height is
  * measured live from the rendered content via `ResizeObserver` (EC-330) so a
@@ -128,21 +133,14 @@ function ComponentPreviewFrame({ node, ctx, displayName, width, }) {
         const d = iframeRef.current?.contentDocument;
         if (!d || !d.body)
             return;
-        // Deliberately no `.dark` here (see the surface note above) — the light
-        // `:root` tokens from the injected stylesheet are the intended backdrop.
-        // Unset stylesheet (tests / an app that never called
-        // `setCanvasStylesheetUrl`) → skip the link.
-        const appCss = getCanvasStylesheetUrl();
-        if (appCss && !d.getElementById('ec-app-css')) {
-            const link = d.createElement('link');
-            link.id = 'ec-app-css';
-            link.rel = 'stylesheet';
-            link.href = appCss;
-            d.head.appendChild(link);
-        }
-        d.body.className = 'bg-background text-foreground font-sans';
-        d.body.style.margin = '0';
-        d.body.style.padding = '24px';
+        // ONE code path with the builder canvas (EC-414 AD-B item 4): stylesheet
+        // link + chrome css + consumer canvas theme + the world probe. No kit
+        // tokens here — this is a registry-level reference surface, not a project
+        // page. The dev theme notice is the builder canvas's job, not this pane's.
+        wireCanvasChrome(d, {
+            stylesheetUrl: getCanvasStylesheetUrl(),
+            theme: resolveDeploymentCanvasTheme(),
+        });
         setDoc(d);
     }, []);
     // Handle the already-loaded case (srcDoc can load before onLoad attaches).
@@ -208,10 +206,11 @@ export class PreviewErrorBoundary extends Component {
  * The EC-191 fallback panel — component name + "preview unavailable" + the error.
  * Rendered INTO the preview iframe (which carries only the project stylesheet, and
  * may carry none in tests), so it uses inline styles rather than studio UI classes
- * — matching the canvas's own in-iframe placeholder convention.
+ * — the EC-414 AD-B chrome contract, with the `.ec-chrome` containment recipe on
+ * its root (walked by the chrome contract test).
  */
 export function PreviewUnavailable({ displayName, error }) {
-    return (_jsxs("div", { "data-preview-unavailable": true, style: {
+    return (_jsxs("div", { "data-preview-unavailable": true, className: "ec-chrome", style: {
             boxSizing: 'border-box',
             maxWidth: '42rem',
             margin: '0 auto',

package/dist/components/components/component-preview.js.map

@@ -1 +1 @@
-{"version":3,"file":"component-preview.js","sourceRoot":"","sources":["../../../src/components/components/component-preview.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\nimport { MonitorOff, RotateCcw } from 'lucide-react'\nimport { renderNode } from '@elytracms/core/runtime-renderer'\nimport type { RenderContext } from '@elytracms/core/runtime-renderer'\nimport { staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode, JsonValue } from '@elytracms/core/project-graph'\nimport type { ComponentManifest, PropField } from '@elytracms/core/component-registry'\nimport { componentStatus, previewContext } from '@elytracms/studio/lib/registry'\nimport type { StudioRegistry } from '@elytracms/studio/lib/registry'\nimport { previewSpecs } from '@elytracms/studio/lib/registry/preview'\nimport type { PreviewSpec } from '@elytracms/studio/lib/registry/preview'\nimport { Badge, Button, Code, Field, Row, Spacer, Stack, TabButton, Text } from '@elytracms/studio/ui'\nimport { localizedLabel, translate } from '@elytracms/studio/lib/i18n'\nimport { cn } from '@elytracms/studio/lib/utils'\nimport { getCanvasStylesheetUrl } from '../builder/canvas-stylesheet'\nimport { useCanvasViewports, viewportWidth } from '../builder/canvas-breakpoints'\nimport type { ViewportOption } from '../builder/canvas-breakpoints'\nimport { PropValueControl } from '../cms/prop-fields'\n\n/**\n * EC-320 — the editable component preview. A component's declared preview states\n * (fixtures) select the SAMPLE STATE (slot content, base props); on top of that\n * the user edits individual prop values in the Props sidebar and the preview\n * re-renders live through the SAME runtime-renderer path the Builder and export\n * use (EC-054). Slots follow the selected fixture — full slot-tree editing is out\n * of scope for this reference surface (that's the composition editor's job); the\n * Slots pane documents what a component accepts and which state supplies content.\n */\n\nexport interface PreviewState {\n  specs: PreviewSpec[]\n  index: number\n  setIndex: (i: number) => void\n  /** Per-prop static-value overrides applied over the selected fixture. */\n  overrides: Record<string, JsonValue>\n  setOverride: (name: string, value: JsonValue) => void\n  clearOverride: (name: string) => void\n  resetAll: () => void\n  dirty: boolean\n  /** The live node: the selected fixture with prop overrides applied. */\n  node: ComponentNode\n}\n\n/** Preview state for a manifest: the fixture selection + the live prop overrides. */\nexport function usePreviewState(manifest: ComponentManifest): PreviewState {\n  const specs = useMemo(() => previewSpecs(manifest), [manifest])\n  const [index, setIndexRaw] = useState(0)\n  const [overrides, setOverrides] = useState<Record<string, JsonValue>>({})\n\n  // Switching preview state resets prop edits — they were relative to the old state.\n  const setIndex = (i: number) => {\n    setIndexRaw(i)\n    setOverrides({})\n  }\n  const setOverride = (name: string, value: JsonValue) =>\n    setOverrides((o) => ({ ...o, [name]: value }))\n  const clearOverride = (name: string) =>\n    setOverrides((o) => {\n      const next = { ...o }\n      delete next[name]\n      return next\n    })\n  const resetAll = () => setOverrides({})\n\n  const base = specs[Math.min(index, specs.length - 1)]?.node\n  const node = useMemo<ComponentNode>(() => {\n    const fixture = base ?? { id: `preview-${manifest.id}`, componentId: manifest.id, props: {} }\n    const props = { ...(fixture.props ?? {}) }\n    for (const [name, value] of Object.entries(overrides)) props[name] = staticProp(value)\n    return { ...fixture, props }\n  }, [base, overrides, manifest.id])\n\n  return {\n    specs,\n    index: Math.min(index, Math.max(specs.length - 1, 0)),\n    setIndex,\n    overrides,\n    setOverride,\n    clearOverride,\n    resetAll,\n    dirty: Object.keys(overrides).length > 0,\n    node,\n  }\n}\n\n/** Re-id a preview node into the canvas `node-<n>` namespace for embedding (transfer). */\nexport function embedNodeFrom(node: ComponentNode, id: string): ComponentNode {\n  return { ...node, id }\n}\n\n/**\n * The live preview surface: the fixture-state selector (when a component declares\n * more than one) plus the rendered node. Server-only components (EC-191\n * `clientRenderable: false`) can't run on the client-rendered canvas, so they show\n * a documented fallback rather than risk a crash; a missing implementation falls\n * back through the renderer itself (the incompatible state).\n */\nexport function ComponentPreview({\n  manifest,\n  studio,\n  state,\n}: {\n  manifest: ComponentManifest\n  studio: StudioRegistry\n  state: PreviewState\n}) {\n  const ctx = useMemo(() => previewContext(studio), [studio])\n  const serverOnly = manifest.clientRenderable === false\n  const status = componentStatus(studio, manifest)\n  const displayName = manifest.title ?? manifest.id\n\n  // EC-330: the same config-sourced breakpoint set the builder canvas toolbar\n  // offers (`canvas-breakpoints.ts`) — reused, not redefined, so a preview and\n  // the real canvas never disagree about the site's responsive widths.\n  // Defaults to the always-present 'full' (responsive) option.\n  const { viewports } = useCanvasViewports()\n  const [viewport, setViewport] = useState(viewports[0]!.key)\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col\">\n      <Row gap=\"1\" wrap align=\"center\" className=\"shrink-0 border-b border-border px-3 py-2\">\n        {state.specs.length > 1 ? (\n          <Row\n            gap=\"1\"\n            wrap\n            role=\"group\"\n            aria-label={translate('components.fixtureRunner.statesAria')}\n          >\n            {state.specs.map((spec, i) => (\n              <TabButton key={spec.name} active={i === state.index} onClick={() => state.setIndex(i)}>\n                {spec.name}\n              </TabButton>\n            ))}\n          </Row>\n        ) : null}\n        <Spacer />\n        <Row\n          gap=\"1\"\n          wrap\n          role=\"group\"\n          aria-label={translate('components.preview.breakpointAria')}\n        >\n          {viewports.map((option) => (\n            <PreviewBreakpointButton\n              key={option.key}\n              option={option}\n              active={option.key === viewport}\n              onSelect={() => setViewport(option.key)}\n            />\n          ))}\n        </Row>\n        {state.dirty ? (\n          <Button variant=\"ghost\" size=\"sm\" onClick={state.resetAll} data-testid=\"preview-reset\">\n            <RotateCcw /> {translate('components.preview.reset')}\n          </Button>\n        ) : null}\n      </Row>\n\n      <div\n        className=\"canvas-grid min-h-0 flex-1 overflow-auto p-6\"\n        data-fixture-state={state.specs[state.index]?.name}\n      >\n        {serverOnly ? (\n          <ServerOnlyNotice />\n        ) : (\n          <ComponentPreviewFrame\n            node={state.node}\n            ctx={ctx}\n            displayName={displayName}\n            width={viewportWidth(viewports, viewport)}\n          />\n        )}\n        {status === 'incompatible' && !serverOnly ? (\n          <Text size=\"xs\" tone=\"muted\" className=\"mx-auto mt-3 max-w-2xl\">\n            {translate('components.preview.incompatibleNote')}\n          </Text>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n\n/**\n * One breakpoint option in the preview's width switcher. Mirrors the builder\n * canvas toolbar's `ViewportButton` (`composition-field-editor.tsx`) — same\n * `Button`/active-state styling — but drives LOCAL preview state instead of\n * the builder store (this surface has no composition/undo stack).\n *\n * EC-328: evaluated against the shared `TabButton`/`SegmentedControl`\n * primitives and kept separate — it's built on the shared `Button` (not a\n * bare hand-rolled `<button>`, so it wasn't part of the duplication those\n * primitives address), and carries an interpolated `aria-label` plus a\n * conditional px-value `title` tooltip neither primitive's terse API models.\n */\nfunction PreviewBreakpointButton({\n  option,\n  active,\n  onSelect,\n}: {\n  option: ViewportOption\n  active: boolean\n  onSelect: () => void\n}) {\n  return (\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      aria-label={translate('builder.canvas.viewportPreviewAria', { label: option.label })}\n      aria-pressed={active}\n      title={\n        option.px !== undefined\n          ? `${option.label} · ${option.px}px`\n          : translate('builder.canvas.viewportWidthTitle', { label: option.label })\n      }\n      onClick={onSelect}\n      className={cn('px-2 text-xs', active && 'bg-accent text-accent-foreground')}\n    >\n      {option.label}\n    </Button>\n  )\n}\n\nfunction ServerOnlyNotice() {\n  return (\n    <div className=\"mx-auto grid max-w-2xl place-items-center rounded-lg border border-dashed border-border bg-muted/30 p-8 text-center\">\n      <Stack gap=\"2\" align=\"center\">\n        <MonitorOff className=\"size-5 text-muted-foreground\" aria-hidden />\n        <Text size=\"sm\" weight=\"medium\">\n          {translate('components.preview.serverOnlyTitle')}\n        </Text>\n        <Text size=\"xs\" tone=\"muted\" className=\"max-w-sm\">\n          {translate('components.preview.serverOnlyBody')}\n        </Text>\n      </Stack>\n    </div>\n  )\n}\n\n/** Floor for the auto-height iframe — never collapses to a sliver while empty/loading. */\nconst MIN_PREVIEW_HEIGHT = 360\n\n/**\n * The live preview render surface. Reuses the BuilderCanvas styling mechanism\n * (EC-061, `canvas.tsx`): the component renders inside an ISOLATED same-origin\n * iframe that `<link>`s the project's canvas stylesheet\n * (`getCanvasStylesheetUrl()` — the consuming app's delivery CSS + studio CSS), so\n * a component built with the site's Tailwind theme previews with the site's styles,\n * exactly as it does on the canvas and in delivery. Using the iframe (not the\n * studio DOM) is what keeps the delivery CSS scoped and off the studio chrome.\n *\n * Unlike the builder canvas, this iframe's document is deliberately left OUT of\n * the studio's own dark/light class: this is a standalone-component reference\n * surface (not a full page), so its own negative space around the component must\n * read as a light, site-like backdrop — never the studio chrome's current theme\n * (a black frame is exactly what leaks through when the studio is dark-themed and\n * the iframe root inherits that class). The canvas stylesheet's `:root` (light)\n * tokens supply that backdrop for free once the `.dark` class is never added here.\n *\n * Sizing: width is driven by the caller (the breakpoint selector); height is\n * measured live from the rendered content via `ResizeObserver` (EC-330) so a\n * preset switch or a prop edit — both of which change what's portaled into\n * `doc.body` — always show without clipping or dead space.\n *\n * The render is wrapped in {@link PreviewErrorBoundary} so a component that throws\n * shows the EC-191 fallback instead of taking the whole Components view down.\n */\nfunction ComponentPreviewFrame({\n  node,\n  ctx,\n  displayName,\n  width,\n}: {\n  node: ComponentNode\n  ctx: RenderContext\n  displayName: string\n  /** CSS width for the iframe — '100%' (responsive) or a fixed breakpoint px width. */\n  width: string\n}) {\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n  const [doc, setDoc] = useState<Document | null>(null)\n  const [height, setHeight] = useState(MIN_PREVIEW_HEIGHT)\n\n  const wireUp = useCallback(() => {\n    const d = iframeRef.current?.contentDocument\n    if (!d || !d.body) return\n    // Deliberately no `.dark` here (see the surface note above) — the light\n    // `:root` tokens from the injected stylesheet are the intended backdrop.\n    // Unset stylesheet (tests / an app that never called\n    // `setCanvasStylesheetUrl`) → skip the link.\n    const appCss = getCanvasStylesheetUrl()\n    if (appCss && !d.getElementById('ec-app-css')) {\n      const link = d.createElement('link')\n      link.id = 'ec-app-css'\n      link.rel = 'stylesheet'\n      link.href = appCss\n      d.head.appendChild(link)\n    }\n    d.body.className = 'bg-background text-foreground font-sans'\n    d.body.style.margin = '0'\n    d.body.style.padding = '24px'\n    setDoc(d)\n  }, [])\n\n  // Handle the already-loaded case (srcDoc can load before onLoad attaches).\n  useEffect(() => {\n    if (iframeRef.current?.contentDocument?.readyState === 'complete') wireUp()\n  }, [wireUp])\n\n  // Auto-height (EC-330): a same-origin iframe exposes its own document, so a\n  // `ResizeObserver` on the BODY tracks its live (height: auto) content size —\n  // re-firing on its own whenever the portaled render changes (preset switch,\n  // prop edit), no manual re-measure wiring needed. Attached per `doc` (re-runs\n  // whenever the iframe reloads), not just on mount. Loop-safety: the observed\n  // element (the iframe's body) is never the element this effect resizes (the\n  // IFRAME itself) — writing height never feeds back into the observed box, and\n  // width is never derived from height, so there is no growth loop. Guarded for\n  // environments without ResizeObserver (jsdom/tests, older embeds).\n  useEffect(() => {\n    const body = doc?.body\n    if (!body || typeof ResizeObserver === 'undefined') return\n    const measure = () => setHeight(Math.max(body.scrollHeight, MIN_PREVIEW_HEIGHT))\n    measure()\n    const observer = new ResizeObserver(measure)\n    observer.observe(body)\n    return () => observer.disconnect()\n  }, [doc])\n\n  return (\n    <>\n      <iframe\n        ref={iframeRef}\n        onLoad={wireUp}\n        title={translate('components.detail.tab.preview')}\n        style={{ width, height, maxWidth: '100%' }}\n        className=\"mx-auto block rounded-lg border border-border bg-background shadow-sm\"\n        srcDoc=\"<!doctype html><html><head></head><body></body></html>\"\n      />\n      {doc\n        ? createPortal(\n            <PreviewErrorBoundary displayName={displayName} resetKey={node}>\n              <PreviewLiveRender node={node} ctx={ctx} />\n            </PreviewErrorBoundary>,\n            doc.body,\n          )\n        : null}\n    </>\n  )\n}\n\n/** Renders the node through the runtime renderer, INSIDE a component render so the\n *  error boundary catches synchronous render throws (mirrors the blocks-panel\n *  thumbnail's `LiveRender`). */\nfunction PreviewLiveRender({ node, ctx }: { node: ComponentNode; ctx: RenderContext }) {\n  return <>{renderNode(node, ctx)}</>\n}\n\ninterface PreviewBoundaryState {\n  error: Error | null\n}\n\n/**\n * EC-191 resilience for the Components view: a component whose render throws — a\n * missing provider/context (e.g. a prop control that needs a document's\n * `CollectionViewSource`), a runtime bug — shows the documented \"preview\n * unavailable\" fallback ({@link PreviewUnavailable}) instead of taking the whole\n * view down. It resets when the previewed `resetKey` (the node) changes, so\n * switching the fixture state or editing a prop retries the render.\n */\nexport class PreviewErrorBoundary extends Component<\n  { children: ReactNode; displayName: string; resetKey: unknown },\n  PreviewBoundaryState\n> {\n  override state: PreviewBoundaryState = { error: null }\n\n  static getDerivedStateFromError(error: Error): PreviewBoundaryState {\n    return { error }\n  }\n\n  override componentDidUpdate(prev: Readonly<{ resetKey: unknown }>) {\n    if (this.state.error && prev.resetKey !== this.props.resetKey) {\n      this.setState({ error: null })\n    }\n  }\n\n  override render(): ReactNode {\n    if (this.state.error) {\n      return <PreviewUnavailable displayName={this.props.displayName} error={this.state.error} />\n    }\n    return this.props.children\n  }\n}\n\n/**\n * The EC-191 fallback panel — component name + \"preview unavailable\" + the error.\n * Rendered INTO the preview iframe (which carries only the project stylesheet, and\n * may carry none in tests), so it uses inline styles rather than studio UI classes\n * — matching the canvas's own in-iframe placeholder convention.\n */\nexport function PreviewUnavailable({ displayName, error }: { displayName: string; error: Error }) {\n  return (\n    <div\n      data-preview-unavailable\n      style={{\n        boxSizing: 'border-box',\n        maxWidth: '42rem',\n        margin: '0 auto',\n        border: '1px dashed rgba(120,120,120,0.5)',\n        borderRadius: 8,\n        padding: '24px 28px',\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 }}>⚠ {translate('components.preview.unavailableTitle')}</div>\n      <div style={{ marginTop: 4, fontWeight: 600, opacity: 0.9 }}>{displayName}</div>\n      <div style={{ marginTop: 6, fontSize: 13, opacity: 0.85, wordBreak: 'break-word' }}>\n        {error.message}\n      </div>\n    </div>\n  )\n}\n\n/**\n * The editable Props pane (right inspector). Every non-`blocks` prop is edited\n * through the shared {@link PropValueControl} — the exact control set documents\n * use (EC-190/EC-314 phase 4) — so a change re-renders the preview immediately.\n * `blocks` props are a canvas (composition) concern, edited in a document, not here.\n */\nexport function PropsEditorPane({\n  manifest,\n  state,\n}: {\n  manifest: ComponentManifest\n  state: PreviewState\n}) {\n  const editable = Object.entries(manifest.props).filter(([, spec]) => spec.type !== 'blocks')\n  const fixture = state.specs[state.index]?.node\n  if (editable.length === 0) {\n    return (\n      <Text size=\"sm\" tone=\"subtle\" className=\"p-4\">\n        {translate('components.fieldInspector.noProps')}\n      </Text>\n    )\n  }\n  return (\n    <Stack gap=\"4\" className=\"p-4\">\n      {editable.map(([name, spec]) => {\n        const id = `prop-${name}`\n        const overridden = state.overrides[name] !== undefined\n        return (\n          <Field\n            key={name}\n            label={\n              <Row gap=\"2\">\n                <span>{localizedLabel((spec as PropField).form?.label, name)}</span>\n                {overridden ? <Badge variant=\"info\">{translate('components.preview.edited')}</Badge> : null}\n              </Row>\n            }\n            htmlFor={id}\n            hint={localizedLabel((spec as PropField).form?.description) || undefined}\n          >\n            <PropValueControl\n              id={id}\n              name={name}\n              spec={spec as PropField}\n              value={\n                overridden\n                  ? staticProp(state.overrides[name]!)\n                  : (fixture?.props?.[name] ?? undefined)\n              }\n              onSet={(v) => state.setOverride(name, v)}\n              onClear={() => state.clearOverride(name)}\n            />\n          </Field>\n        )\n      })}\n      {state.dirty ? (\n        <Button variant=\"outline\" size=\"sm\" onClick={state.resetAll} className=\"self-start\">\n          <RotateCcw /> {translate('components.preview.resetProps')}\n        </Button>\n      ) : null}\n    </Stack>\n  )\n}\n\n/**\n * The Slots pane (right inspector): the component's declared child regions and,\n * for a fixture that supplies slot content, a note that the preview's slot content\n * follows the selected state. Documents the pragmatic scope call — no slot-tree\n * editing on this reference surface.\n */\nexport function SlotsInfoPane({ manifest }: { manifest: ComponentManifest }) {\n  if (manifest.slots.length === 0) {\n    return (\n      <Text size=\"sm\" tone=\"subtle\" className=\"p-4\">\n        {translate('components.fieldInspector.noSlots')}\n      </Text>\n    )\n  }\n  return (\n    <Stack gap=\"3\" className=\"p-4\">\n      <Text size=\"xs\" tone=\"muted\">\n        {translate('components.preview.slotsNote')}\n      </Text>\n      <div className=\"divide-y divide-border rounded-md border border-border\">\n        {manifest.slots.map((slot) => (\n          <div key={slot.name} className=\"flex flex-col gap-1 p-3\">\n            <Row gap=\"2\">\n              <Code tone=\"primary\">{slot.name}</Code>\n              {slot.required ? (\n                <Badge variant=\"warning\">{translate('common.required')}</Badge>\n              ) : (\n                <Badge variant=\"outline\">{translate('common.optional')}</Badge>\n              )}\n            </Row>\n            {slot.allow && slot.allow.length > 0 ? (\n              <Row gap=\"2\" className=\"text-xs\" wrap>\n                <Text size=\"xs\" tone=\"subtle\">\n                  {translate('components.fieldInspector.allows')}\n                </Text>\n                {slot.allow.map((id) => (\n                  <Code key={id} tone=\"muted\">\n                    {id}\n                  </Code>\n                ))}\n              </Row>\n            ) : null}\n          </div>\n        ))}\n      </div>\n    </Stack>\n  )\n}\n"]}
+{"version":3,"file":"component-preview.js","sourceRoot":"","sources":["../../../src/components/components/component-preview.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, useCallback, useEffect, useMemo, useRef, useState } from 'react'\nimport type { ReactNode } from 'react'\nimport { createPortal } from 'react-dom'\nimport { MonitorOff, RotateCcw } from 'lucide-react'\nimport { renderNode } from '@elytracms/core/runtime-renderer'\nimport type { RenderContext } from '@elytracms/core/runtime-renderer'\nimport { staticProp } from '@elytracms/core/project-graph'\nimport type { ComponentNode, JsonValue } from '@elytracms/core/project-graph'\nimport type { ComponentManifest, PropField } from '@elytracms/core/component-registry'\nimport { componentStatus, previewContext } from '@elytracms/studio/lib/registry'\nimport type { StudioRegistry } from '@elytracms/studio/lib/registry'\nimport { previewSpecs } from '@elytracms/studio/lib/registry/preview'\nimport type { PreviewSpec } from '@elytracms/studio/lib/registry/preview'\nimport { Badge, Button, Code, Field, Row, Spacer, Stack, TabButton, Text } from '@elytracms/studio/ui'\nimport { localizedLabel, translate } from '@elytracms/studio/lib/i18n'\nimport { cn } from '@elytracms/studio/lib/utils'\nimport { resolveDeploymentCanvasTheme } from '@elytracms/studio/lib/workspace'\nimport { wireCanvasChrome } from '../builder/canvas-chrome'\nimport { getCanvasStylesheetUrl } from '../builder/canvas-stylesheet'\nimport { useCanvasViewports, viewportWidth } from '../builder/canvas-breakpoints'\nimport type { ViewportOption } from '../builder/canvas-breakpoints'\nimport { PropValueControl } from '../cms/prop-fields'\n\n/**\n * EC-320 — the editable component preview. A component's declared preview states\n * (fixtures) select the SAMPLE STATE (slot content, base props); on top of that\n * the user edits individual prop values in the Props sidebar and the preview\n * re-renders live through the SAME runtime-renderer path the Builder and export\n * use (EC-054). Slots follow the selected fixture — full slot-tree editing is out\n * of scope for this reference surface (that's the composition editor's job); the\n * Slots pane documents what a component accepts and which state supplies content.\n */\n\nexport interface PreviewState {\n  specs: PreviewSpec[]\n  index: number\n  setIndex: (i: number) => void\n  /** Per-prop static-value overrides applied over the selected fixture. */\n  overrides: Record<string, JsonValue>\n  setOverride: (name: string, value: JsonValue) => void\n  clearOverride: (name: string) => void\n  resetAll: () => void\n  dirty: boolean\n  /** The live node: the selected fixture with prop overrides applied. */\n  node: ComponentNode\n}\n\n/** Preview state for a manifest: the fixture selection + the live prop overrides. */\nexport function usePreviewState(manifest: ComponentManifest): PreviewState {\n  const specs = useMemo(() => previewSpecs(manifest), [manifest])\n  const [index, setIndexRaw] = useState(0)\n  const [overrides, setOverrides] = useState<Record<string, JsonValue>>({})\n\n  // Switching preview state resets prop edits — they were relative to the old state.\n  const setIndex = (i: number) => {\n    setIndexRaw(i)\n    setOverrides({})\n  }\n  const setOverride = (name: string, value: JsonValue) =>\n    setOverrides((o) => ({ ...o, [name]: value }))\n  const clearOverride = (name: string) =>\n    setOverrides((o) => {\n      const next = { ...o }\n      delete next[name]\n      return next\n    })\n  const resetAll = () => setOverrides({})\n\n  const base = specs[Math.min(index, specs.length - 1)]?.node\n  const node = useMemo<ComponentNode>(() => {\n    const fixture = base ?? { id: `preview-${manifest.id}`, componentId: manifest.id, props: {} }\n    const props = { ...(fixture.props ?? {}) }\n    for (const [name, value] of Object.entries(overrides)) props[name] = staticProp(value)\n    return { ...fixture, props }\n  }, [base, overrides, manifest.id])\n\n  return {\n    specs,\n    index: Math.min(index, Math.max(specs.length - 1, 0)),\n    setIndex,\n    overrides,\n    setOverride,\n    clearOverride,\n    resetAll,\n    dirty: Object.keys(overrides).length > 0,\n    node,\n  }\n}\n\n/** Re-id a preview node into the canvas `node-<n>` namespace for embedding (transfer). */\nexport function embedNodeFrom(node: ComponentNode, id: string): ComponentNode {\n  return { ...node, id }\n}\n\n/**\n * The live preview surface: the fixture-state selector (when a component declares\n * more than one) plus the rendered node. Server-only components (EC-191\n * `clientRenderable: false`) can't run on the client-rendered canvas, so they show\n * a documented fallback rather than risk a crash; a missing implementation falls\n * back through the renderer itself (the incompatible state).\n */\nexport function ComponentPreview({\n  manifest,\n  studio,\n  state,\n}: {\n  manifest: ComponentManifest\n  studio: StudioRegistry\n  state: PreviewState\n}) {\n  const ctx = useMemo(() => previewContext(studio), [studio])\n  const serverOnly = manifest.clientRenderable === false\n  const status = componentStatus(studio, manifest)\n  const displayName = manifest.title ?? manifest.id\n\n  // EC-330: the same config-sourced breakpoint set the builder canvas toolbar\n  // offers (`canvas-breakpoints.ts`) — reused, not redefined, so a preview and\n  // the real canvas never disagree about the site's responsive widths.\n  // Defaults to the always-present 'full' (responsive) option.\n  const { viewports } = useCanvasViewports()\n  const [viewport, setViewport] = useState(viewports[0]!.key)\n\n  return (\n    <div className=\"flex h-full min-h-0 flex-col\">\n      <Row gap=\"1\" wrap align=\"center\" className=\"shrink-0 border-b border-border px-3 py-2\">\n        {state.specs.length > 1 ? (\n          <Row\n            gap=\"1\"\n            wrap\n            role=\"group\"\n            aria-label={translate('components.fixtureRunner.statesAria')}\n          >\n            {state.specs.map((spec, i) => (\n              <TabButton key={spec.name} active={i === state.index} onClick={() => state.setIndex(i)}>\n                {spec.name}\n              </TabButton>\n            ))}\n          </Row>\n        ) : null}\n        <Spacer />\n        <Row\n          gap=\"1\"\n          wrap\n          role=\"group\"\n          aria-label={translate('components.preview.breakpointAria')}\n        >\n          {viewports.map((option) => (\n            <PreviewBreakpointButton\n              key={option.key}\n              option={option}\n              active={option.key === viewport}\n              onSelect={() => setViewport(option.key)}\n            />\n          ))}\n        </Row>\n        {state.dirty ? (\n          <Button variant=\"ghost\" size=\"sm\" onClick={state.resetAll} data-testid=\"preview-reset\">\n            <RotateCcw /> {translate('components.preview.reset')}\n          </Button>\n        ) : null}\n      </Row>\n\n      <div\n        className=\"canvas-grid min-h-0 flex-1 overflow-auto p-6\"\n        data-fixture-state={state.specs[state.index]?.name}\n      >\n        {serverOnly ? (\n          <ServerOnlyNotice />\n        ) : (\n          <ComponentPreviewFrame\n            node={state.node}\n            ctx={ctx}\n            displayName={displayName}\n            width={viewportWidth(viewports, viewport)}\n          />\n        )}\n        {status === 'incompatible' && !serverOnly ? (\n          <Text size=\"xs\" tone=\"muted\" className=\"mx-auto mt-3 max-w-2xl\">\n            {translate('components.preview.incompatibleNote')}\n          </Text>\n        ) : null}\n      </div>\n    </div>\n  )\n}\n\n/**\n * One breakpoint option in the preview's width switcher. Mirrors the builder\n * canvas toolbar's `ViewportButton` (`composition-field-editor.tsx`) — same\n * `Button`/active-state styling — but drives LOCAL preview state instead of\n * the builder store (this surface has no composition/undo stack).\n *\n * EC-328: evaluated against the shared `TabButton`/`SegmentedControl`\n * primitives and kept separate — it's built on the shared `Button` (not a\n * bare hand-rolled `<button>`, so it wasn't part of the duplication those\n * primitives address), and carries an interpolated `aria-label` plus a\n * conditional px-value `title` tooltip neither primitive's terse API models.\n */\nfunction PreviewBreakpointButton({\n  option,\n  active,\n  onSelect,\n}: {\n  option: ViewportOption\n  active: boolean\n  onSelect: () => void\n}) {\n  return (\n    <Button\n      size=\"sm\"\n      variant=\"ghost\"\n      aria-label={translate('builder.canvas.viewportPreviewAria', { label: option.label })}\n      aria-pressed={active}\n      title={\n        option.px !== undefined\n          ? `${option.label} · ${option.px}px`\n          : translate('builder.canvas.viewportWidthTitle', { label: option.label })\n      }\n      onClick={onSelect}\n      className={cn('px-2 text-xs', active && 'bg-accent text-accent-foreground')}\n    >\n      {option.label}\n    </Button>\n  )\n}\n\nfunction ServerOnlyNotice() {\n  return (\n    <div className=\"mx-auto grid max-w-2xl place-items-center rounded-lg border border-dashed border-border bg-muted/30 p-8 text-center\">\n      <Stack gap=\"2\" align=\"center\">\n        <MonitorOff className=\"size-5 text-muted-foreground\" aria-hidden />\n        <Text size=\"sm\" weight=\"medium\">\n          {translate('components.preview.serverOnlyTitle')}\n        </Text>\n        <Text size=\"xs\" tone=\"muted\" className=\"max-w-sm\">\n          {translate('components.preview.serverOnlyBody')}\n        </Text>\n      </Stack>\n    </div>\n  )\n}\n\n/** Floor for the auto-height iframe — never collapses to a sliver while empty/loading. */\nconst MIN_PREVIEW_HEIGHT = 360\n\n/**\n * The live preview render surface. Reuses the BuilderCanvas styling mechanism\n * (EC-061, `canvas.tsx`) — since EC-414 through the SAME code path, `wireCanvasChrome`\n * (closing the EC-389 follow-up): the component renders inside an ISOLATED\n * same-origin iframe that `<link>`s the project's canvas stylesheet\n * (`getCanvasStylesheetUrl()` — the consumer's theme entry; in the legacy merged\n * world also the studio CSS), so a component built with the site's Tailwind theme\n * previews with the site's styles, exactly as it does on the canvas and in\n * delivery. Using the iframe (not the studio DOM) is what keeps the delivery CSS\n * scoped and off the studio chrome.\n *\n * Unlike the builder canvas, this iframe's document is deliberately left OUT of\n * the studio's own dark/light class: this is a standalone-component reference\n * surface (not a full page), so its own negative space around the component must\n * read as a light, site-like backdrop — never the studio chrome's current theme\n * (a black frame is exactly what leaks through when the studio is dark-themed and\n * the iframe root inherits that class). The chrome's world probe supplies that\n * backdrop: the neutral backdrop rules in the new world, the studio `:root`\n * (light) tokens in the legacy one.\n *\n * Sizing: width is driven by the caller (the breakpoint selector); height is\n * measured live from the rendered content via `ResizeObserver` (EC-330) so a\n * preset switch or a prop edit — both of which change what's portaled into\n * `doc.body` — always show without clipping or dead space.\n *\n * The render is wrapped in {@link PreviewErrorBoundary} so a component that throws\n * shows the EC-191 fallback instead of taking the whole Components view down.\n */\nfunction ComponentPreviewFrame({\n  node,\n  ctx,\n  displayName,\n  width,\n}: {\n  node: ComponentNode\n  ctx: RenderContext\n  displayName: string\n  /** CSS width for the iframe — '100%' (responsive) or a fixed breakpoint px width. */\n  width: string\n}) {\n  const iframeRef = useRef<HTMLIFrameElement>(null)\n  const [doc, setDoc] = useState<Document | null>(null)\n  const [height, setHeight] = useState(MIN_PREVIEW_HEIGHT)\n\n  const wireUp = useCallback(() => {\n    const d = iframeRef.current?.contentDocument\n    if (!d || !d.body) return\n    // ONE code path with the builder canvas (EC-414 AD-B item 4): stylesheet\n    // link + chrome css + consumer canvas theme + the world probe. No kit\n    // tokens here — this is a registry-level reference surface, not a project\n    // page. The dev theme notice is the builder canvas's job, not this pane's.\n    wireCanvasChrome(d, {\n      stylesheetUrl: getCanvasStylesheetUrl(),\n      theme: resolveDeploymentCanvasTheme(),\n    })\n    setDoc(d)\n  }, [])\n\n  // Handle the already-loaded case (srcDoc can load before onLoad attaches).\n  useEffect(() => {\n    if (iframeRef.current?.contentDocument?.readyState === 'complete') wireUp()\n  }, [wireUp])\n\n  // Auto-height (EC-330): a same-origin iframe exposes its own document, so a\n  // `ResizeObserver` on the BODY tracks its live (height: auto) content size —\n  // re-firing on its own whenever the portaled render changes (preset switch,\n  // prop edit), no manual re-measure wiring needed. Attached per `doc` (re-runs\n  // whenever the iframe reloads), not just on mount. Loop-safety: the observed\n  // element (the iframe's body) is never the element this effect resizes (the\n  // IFRAME itself) — writing height never feeds back into the observed box, and\n  // width is never derived from height, so there is no growth loop. Guarded for\n  // environments without ResizeObserver (jsdom/tests, older embeds).\n  useEffect(() => {\n    const body = doc?.body\n    if (!body || typeof ResizeObserver === 'undefined') return\n    const measure = () => setHeight(Math.max(body.scrollHeight, MIN_PREVIEW_HEIGHT))\n    measure()\n    const observer = new ResizeObserver(measure)\n    observer.observe(body)\n    return () => observer.disconnect()\n  }, [doc])\n\n  return (\n    <>\n      <iframe\n        ref={iframeRef}\n        onLoad={wireUp}\n        title={translate('components.detail.tab.preview')}\n        style={{ width, height, maxWidth: '100%' }}\n        className=\"mx-auto block rounded-lg border border-border bg-background shadow-sm\"\n        srcDoc=\"<!doctype html><html><head></head><body></body></html>\"\n      />\n      {doc\n        ? createPortal(\n            <PreviewErrorBoundary displayName={displayName} resetKey={node}>\n              <PreviewLiveRender node={node} ctx={ctx} />\n            </PreviewErrorBoundary>,\n            doc.body,\n          )\n        : null}\n    </>\n  )\n}\n\n/** Renders the node through the runtime renderer, INSIDE a component render so the\n *  error boundary catches synchronous render throws (mirrors the blocks-panel\n *  thumbnail's `LiveRender`). */\nfunction PreviewLiveRender({ node, ctx }: { node: ComponentNode; ctx: RenderContext }) {\n  return <>{renderNode(node, ctx)}</>\n}\n\ninterface PreviewBoundaryState {\n  error: Error | null\n}\n\n/**\n * EC-191 resilience for the Components view: a component whose render throws — a\n * missing provider/context (e.g. a prop control that needs a document's\n * `CollectionViewSource`), a runtime bug — shows the documented \"preview\n * unavailable\" fallback ({@link PreviewUnavailable}) instead of taking the whole\n * view down. It resets when the previewed `resetKey` (the node) changes, so\n * switching the fixture state or editing a prop retries the render.\n */\nexport class PreviewErrorBoundary extends Component<\n  { children: ReactNode; displayName: string; resetKey: unknown },\n  PreviewBoundaryState\n> {\n  override state: PreviewBoundaryState = { error: null }\n\n  static getDerivedStateFromError(error: Error): PreviewBoundaryState {\n    return { error }\n  }\n\n  override componentDidUpdate(prev: Readonly<{ resetKey: unknown }>) {\n    if (this.state.error && prev.resetKey !== this.props.resetKey) {\n      this.setState({ error: null })\n    }\n  }\n\n  override render(): ReactNode {\n    if (this.state.error) {\n      return <PreviewUnavailable displayName={this.props.displayName} error={this.state.error} />\n    }\n    return this.props.children\n  }\n}\n\n/**\n * The EC-191 fallback panel — component name + \"preview unavailable\" + the error.\n * Rendered INTO the preview iframe (which carries only the project stylesheet, and\n * may carry none in tests), so it uses inline styles rather than studio UI classes\n * — the EC-414 AD-B chrome contract, with the `.ec-chrome` containment recipe on\n * its root (walked by the chrome contract test).\n */\nexport function PreviewUnavailable({ displayName, error }: { displayName: string; error: Error }) {\n  return (\n    <div\n      data-preview-unavailable\n      className=\"ec-chrome\"\n      style={{\n        boxSizing: 'border-box',\n        maxWidth: '42rem',\n        margin: '0 auto',\n        border: '1px dashed rgba(120,120,120,0.5)',\n        borderRadius: 8,\n        padding: '24px 28px',\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 }}>⚠ {translate('components.preview.unavailableTitle')}</div>\n      <div style={{ marginTop: 4, fontWeight: 600, opacity: 0.9 }}>{displayName}</div>\n      <div style={{ marginTop: 6, fontSize: 13, opacity: 0.85, wordBreak: 'break-word' }}>\n        {error.message}\n      </div>\n    </div>\n  )\n}\n\n/**\n * The editable Props pane (right inspector). Every non-`blocks` prop is edited\n * through the shared {@link PropValueControl} — the exact control set documents\n * use (EC-190/EC-314 phase 4) — so a change re-renders the preview immediately.\n * `blocks` props are a canvas (composition) concern, edited in a document, not here.\n */\nexport function PropsEditorPane({\n  manifest,\n  state,\n}: {\n  manifest: ComponentManifest\n  state: PreviewState\n}) {\n  const editable = Object.entries(manifest.props).filter(([, spec]) => spec.type !== 'blocks')\n  const fixture = state.specs[state.index]?.node\n  if (editable.length === 0) {\n    return (\n      <Text size=\"sm\" tone=\"subtle\" className=\"p-4\">\n        {translate('components.fieldInspector.noProps')}\n      </Text>\n    )\n  }\n  return (\n    <Stack gap=\"4\" className=\"p-4\">\n      {editable.map(([name, spec]) => {\n        const id = `prop-${name}`\n        const overridden = state.overrides[name] !== undefined\n        return (\n          <Field\n            key={name}\n            label={\n              <Row gap=\"2\">\n                <span>{localizedLabel((spec as PropField).form?.label, name)}</span>\n                {overridden ? <Badge variant=\"info\">{translate('components.preview.edited')}</Badge> : null}\n              </Row>\n            }\n            htmlFor={id}\n            hint={localizedLabel((spec as PropField).form?.description) || undefined}\n          >\n            <PropValueControl\n              id={id}\n              name={name}\n              spec={spec as PropField}\n              value={\n                overridden\n                  ? staticProp(state.overrides[name]!)\n                  : (fixture?.props?.[name] ?? undefined)\n              }\n              onSet={(v) => state.setOverride(name, v)}\n              onClear={() => state.clearOverride(name)}\n            />\n          </Field>\n        )\n      })}\n      {state.dirty ? (\n        <Button variant=\"outline\" size=\"sm\" onClick={state.resetAll} className=\"self-start\">\n          <RotateCcw /> {translate('components.preview.resetProps')}\n        </Button>\n      ) : null}\n    </Stack>\n  )\n}\n\n/**\n * The Slots pane (right inspector): the component's declared child regions and,\n * for a fixture that supplies slot content, a note that the preview's slot content\n * follows the selected state. Documents the pragmatic scope call — no slot-tree\n * editing on this reference surface.\n */\nexport function SlotsInfoPane({ manifest }: { manifest: ComponentManifest }) {\n  if (manifest.slots.length === 0) {\n    return (\n      <Text size=\"sm\" tone=\"subtle\" className=\"p-4\">\n        {translate('components.fieldInspector.noSlots')}\n      </Text>\n    )\n  }\n  return (\n    <Stack gap=\"3\" className=\"p-4\">\n      <Text size=\"xs\" tone=\"muted\">\n        {translate('components.preview.slotsNote')}\n      </Text>\n      <div className=\"divide-y divide-border rounded-md border border-border\">\n        {manifest.slots.map((slot) => (\n          <div key={slot.name} className=\"flex flex-col gap-1 p-3\">\n            <Row gap=\"2\">\n              <Code tone=\"primary\">{slot.name}</Code>\n              {slot.required ? (\n                <Badge variant=\"warning\">{translate('common.required')}</Badge>\n              ) : (\n                <Badge variant=\"outline\">{translate('common.optional')}</Badge>\n              )}\n            </Row>\n            {slot.allow && slot.allow.length > 0 ? (\n              <Row gap=\"2\" className=\"text-xs\" wrap>\n                <Text size=\"xs\" tone=\"subtle\">\n                  {translate('components.fieldInspector.allows')}\n                </Text>\n                {slot.allow.map((id) => (\n                  <Code key={id} tone=\"muted\">\n                    {id}\n                  </Code>\n                ))}\n              </Row>\n            ) : null}\n          </div>\n        ))}\n      </div>\n    </Stack>\n  )\n}\n"]}

package/dist/components/deployment-setup-gate.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-run
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { Button, Card, CardContent, CardHeader, CardTitle, Code, Stack, Text } from '@elytracms/studio/ui';
 import { resolveBackendConfig, selectPersistenceAdapter, studioDeploymentReadiness, } from '@elytracms/studio/lib/persistence';
-import { getWorkspaceState, resolveDeploymentCollections, resolveDeploymentUrl, } from '@elytracms/studio/lib/workspace';
+import { getWorkspaceState, resolveDeploymentAi, resolveDeploymentCollections, resolveDeploymentUrl, } from '@elytracms/studio/lib/workspace';
 import { translate } from '@elytracms/studio/lib/i18n';
 /**
  * Deployment-setup boot gate (EC-258) — the single readiness surface that
@@ -24,11 +24,18 @@ import { translate } from '@elytracms/studio/lib/i18n';
  */
 export function DeploymentSetupGate({ children }) {
     const config = useMemo(() => resolveBackendConfig(), []);
+    // EC-399: a configured (and not disabled) `defineStudio({ ai })` block means the
+    // AI route exists — its provider-key expectation joins the deployment-env checks.
+    const aiRouteConfigured = useMemo(() => {
+        const ai = resolveDeploymentAi();
+        return Boolean(ai && ai.enabled !== false);
+    }, []);
     const staticReport = useCallback(() => studioDeploymentReadiness({
         backend: config,
         workspace: getWorkspaceState(),
         collections: resolveDeploymentCollections(),
-    }), [config]);
+        aiRouteConfigured,
+    }), [config, aiRouteConfigured]);
     const [state, setState] = useState(() => config.kind === 'convex' ? { phase: 'checking' } : { phase: 'resolved', report: staticReport() });
     const check = useCallback(() => {
         if (config.kind !== 'convex') {
@@ -44,6 +51,7 @@ export function DeploymentSetupGate({ children }) {
                 workspace: getWorkspaceState(),
                 collections: resolveDeploymentCollections(),
                 reachable,
+                aiRouteConfigured,
             }),
         });
         setState({ phase: 'checking' });
@@ -51,7 +59,7 @@ export function DeploymentSetupGate({ children }) {
             .then((adapter) => adapter.status())
             .then((status) => resolve({ available: status.available, ...(status.detail ? { detail: status.detail } : {}) }))
             .catch((error) => resolve({ available: false, detail: error instanceof Error ? error.message : String(error) }));
-    }, [config, staticReport]);
+    }, [config, staticReport, aiRouteConfigured]);
     useEffect(() => {
         if (config.kind === 'convex')
             check();
@@ -64,12 +72,15 @@ export function DeploymentSetupGate({ children }) {
     return _jsx(_Fragment, { children: children });
 }
 /**
- * The checks that BLOCK boot: a failed deployment- or app-level precondition. The
- * per-user bucket ("not a member") is not a boot blocker — it is surfaced post-auth
- * ("ask an admin"), and at boot it is `unknown` (pre-auth) anyway.
+ * The checks that BLOCK boot: a failed deployment-, deployment-env-, or app-level
+ * precondition. The per-user bucket ("not a member") is not a boot blocker — it is
+ * surfaced post-auth ("ask an admin"), and at boot it is `unknown` (pre-auth) anyway.
+ * Deployment-env checks are `unknown` in the browser today (nothing gathered — EC-399),
+ * so they never block in practice; `warn` findings never block anywhere.
  */
 function blockingFailures(report) {
-    return report.checks.filter((c) => c.status === 'fail' && (c.bucket === 'deployment' || c.bucket === 'app'));
+    return report.checks.filter((c) => c.status === 'fail' &&
+        (c.bucket === 'deployment' || c.bucket === 'deployment-env' || c.bucket === 'app'));
 }
 /** Deterministic boot state while the backend probe is in flight (also SSR output). */
 function DeploymentChecking() {
@@ -81,7 +92,28 @@ function DeploymentChecking() {
  */
 export function DeploymentSetupScreen({ report, onRetry, }) {
     const failures = report.checks.filter((c) => c.status === 'fail');
-    return (_jsx(BootScreenFrame, { children: _jsxs(Card, { className: "max-w-2xl border-destructive/40", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: translate('shell.deploymentSetup.title') }) }), _jsx(CardContent, { children: _jsxs(Stack, { gap: "3", children: [_jsx(Text, { size: "sm", tone: "muted", children: translate('shell.deploymentSetup.description') }), _jsx(Stack, { gap: "2", role: "list", "aria-label": translate('shell.deploymentSetup.issuesLabel'), children: failures.map((check) => (_jsx(CheckRow, { check: check }, check.id))) }), onRetry ? (_jsx(Button, { variant: "outline", size: "sm", onClick: onRetry, className: "self-start", children: translate('shell.deploymentSetup.retry') })) : null] }) })] }) }));
+    const envChecks = report.checks.filter((c) => c.bucket === 'deployment-env');
+    return (_jsx(BootScreenFrame, { children: _jsxs(Card, { className: "max-w-2xl border-destructive/40", children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: translate('shell.deploymentSetup.title') }) }), _jsx(CardContent, { children: _jsxs(Stack, { gap: "3", children: [_jsx(Text, { size: "sm", tone: "muted", children: translate('shell.deploymentSetup.description') }), _jsx(Stack, { gap: "2", role: "list", "aria-label": translate('shell.deploymentSetup.issuesLabel'), children: failures.map((check) => (_jsx(CheckRow, { check: check }, check.id))) }), envChecks.length > 0 ? _jsx(ExpectedEnvSection, { checks: envChecks }) : null, onRetry ? (_jsx(Button, { variant: "outline", size: "sm", onClick: onRetry, className: "self-start", children: translate('shell.deploymentSetup.retry') })) : null] }) })] }) }));
+}
+/**
+ * The expected-env facts (EC-399) — the SAME contract `elytra doctor` checks, so the
+ * studio and CLI tell one story. Presence only: each row is a var name + set/missing/
+ * unknown status text; values never exist in the report. In the browser the presence
+ * sources aren't readable pre-auth, so rows typically read `unknown` and point at
+ * `elytra doctor` — which is exactly the honest answer.
+ */
+function ExpectedEnvSection({ checks }) {
+    return (_jsxs(Stack, { gap: "2", children: [_jsx(Text, { size: "sm", className: "font-medium", children: translate('shell.deploymentSetup.envSection') }), _jsx(Text, { size: "xs", tone: "muted", children: translate('shell.deploymentSetup.envSectionHint') }), _jsx(Stack, { gap: "1", role: "list", "aria-label": translate('shell.deploymentSetup.envSection'), children: checks.map((check) => (_jsx(EnvCheckRow, { check: check }, check.id))) })] }));
+}
+const ENV_STATUS_GLYPH = {
+    ok: '✓',
+    warn: '!',
+    fail: '✗',
+    unknown: '?',
+};
+function EnvCheckRow({ check }) {
+    const failing = check.status === 'fail';
+    return (_jsxs("div", { role: "listitem", className: `rounded-md border p-2 ${failing ? 'border-destructive/30 bg-destructive/5' : 'border-border bg-muted/30'}`, children: [_jsxs(Text, { size: "xs", mono: true, className: failing ? 'text-destructive' : undefined, children: [ENV_STATUS_GLYPH[check.status], " [", check.id, "]"] }), _jsx(Text, { size: "xs", tone: "muted", children: check.detail }), check.fix && (check.status === 'fail' || check.status === 'warn') ? (_jsxs(Text, { size: "xs", tone: "muted", className: "mt-1", children: [translate('shell.deploymentSetup.fixLabel'), ": ", _jsx(Code, { className: "break-all", children: check.fix })] })) : null] }));
 }
 function CheckRow({ check }) {
     return (_jsxs("div", { role: "listitem", className: "rounded-md border border-destructive/30 bg-destructive/5 p-2", children: [_jsxs(Text, { size: "xs", mono: true, className: "text-destructive", children: ["[", check.id, "]"] }), _jsx(Text, { size: "sm", children: check.detail }), check.fix ? (_jsxs(Text, { size: "xs", tone: "muted", className: "mt-1", children: [translate('shell.deploymentSetup.fixLabel'), ": ", _jsx(Code, { className: "break-all", children: check.fix })] })) : null] }));