@1agh/maude 0.45.1 → 0.46.0

package/apps/studio/canvas-lib.tsx

@@ -101,7 +101,20 @@ import {
 } from 'react';
 
 import { ArtboardActivityOverlay } from './artboard-activity-overlay.tsx';
+import {
+  ArtboardGuidesOverlay,
+  type GuideDefinitions,
+  type OverlayVisibility,
+} from './artboard-guides-overlay.tsx';
 import { CanvasShell } from './canvas-shell.tsx';
+import type { ArtboardPrintProp } from './print/units.ts';
+// feature-2-print-artboards T3 — side-effect import: registers the print
+// kind's overlay content (bleed/trim/margin) into artboard-guides-overlay's
+// registry at module load, per that file's own "call registerKindOverlay at
+// module load" contract. Must live in the same module graph every canvas
+// bundle already pulls in (canvas-lib IS that shared graph — DDR-025), so a
+// canvas never renders without the registration having run first.
+import './print-overlay-content.tsx';
 import {
   buildMoveArtboardsRecord,
   diffLayoutPositions,
@@ -299,6 +312,21 @@ const ENGINE_CSS = `
   color: var(--fg-1, #4a3f30);
   font-family: var(--font-mono, ui-monospace, SFMono-Regular, Menlo, monospace);
 }
+/* T3 — per-kind chrome. Subtle tint on the header + a small glyph before the
+   label text, for any non-digital kind. digital (the default, and every
+   unmigrated canvas) renders no chip and no tint — byte-identical chrome. */
+.dc-canvas .dc-artboard[data-dc-kind]:not([data-dc-kind='digital']) .dc-artboard-label {
+  background: color-mix(in oklab, var(--accent, var(--fg-2, #4a3f30)) 10%, var(--bg-2, #e8e3d8));
+}
+.dc-canvas .dc-artboard-kind-chip {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  margin-right: 6px;
+  color: var(--accent, var(--fg-1, #4a3f30));
+  opacity: 0.85;
+  vertical-align: -1px;
+}
 .dc-canvas .dc-artboard-body {
   flex: 1;
   position: relative;
@@ -379,12 +407,25 @@ function ensureEngineStyles(): void {
 // world-coord positioning) and by DCSection (which collapses inside the
 // canvas) and by future T3 components (MiniMap, ZoomToolbar).
 
+/**
+ * What an artboard IS — digital screen / print page / web flow / video comp.
+ * Absent JSX prop resolves to `digital` (DDR-027-consistent: JSX is truth,
+ * no meta PATCH lane). Drives chrome (T3), the guides overlay content
+ * registry (T4), and generation/editing rules downstream (feature-2-print,
+ * feature-3-web).
+ */
+export type ArtboardKind = 'digital' | 'print' | 'web' | 'video';
+
 export interface ArtboardRect {
   id: string;
   x: number;
   y: number;
   w: number;
   h: number;
+  /** Resolved kind (explicit `kind` prop, or `video` fallback via
+   *  `subtreeHasVideoComp`, or `digital`) — JSX-authoritative, recomputed
+   *  from `harvestArtboards` every render; never persisted to meta. */
+  kind: ArtboardKind;
 }
 
 export interface ViewportState {
@@ -445,8 +486,11 @@ interface ArtboardSeed {
   id: string;
   w: number;
   h: number;
+  kind: ArtboardKind;
 }
 
+const ARTBOARD_KINDS: ReadonlySet<string> = new Set(['digital', 'print', 'web', 'video']);
+
 /**
  * Walk a children subtree harvesting DCArtboard descriptors in render order.
  * DCSection (and any other wrapper) is traversed but doesn't appear in the
@@ -469,11 +513,22 @@ function harvestArtboards(children: ReactNode): ArtboardSeed[] {
       (typeof type === 'function' &&
         (type as { displayName?: string }).displayName === 'DCArtboard');
     if (isArtboard) {
-      const props = node.props as { id?: string; width?: number; height?: number };
+      const props = node.props as {
+        id?: string;
+        width?: number;
+        height?: number;
+        kind?: string;
+        children?: ReactNode;
+      };
+      const explicitKind =
+        typeof props.kind === 'string' && ARTBOARD_KINDS.has(props.kind)
+          ? (props.kind as ArtboardKind)
+          : undefined;
       out.push({
         id: typeof props.id === 'string' && props.id.length > 0 ? props.id : `__ab_${auto}`,
         w: typeof props.width === 'number' ? props.width : VP_GRID.w,
         h: typeof props.height === 'number' ? props.height : VP_GRID.h,
+        kind: explicitKind ?? (subtreeHasVideoComp(props.children) ? 'video' : 'digital'),
       });
       auto++;
       return;
@@ -529,6 +584,7 @@ function synthDefaultGrid(seeds: ArtboardSeed[]): ArtboardRect[] {
       y: row * (cellH + VP_GRID.gutter),
       w: seed.w,
       h: seed.h,
+      kind: seed.kind,
     };
   });
 }
@@ -565,6 +621,9 @@ function readCanvasMeta():
   | {
       layout?: { artboards?: ArtboardRect[] };
       viewport?: ViewportState;
+      /** T6 — per-user overlay-visibility bag, GET-merged in from view.json
+       *  server-side (never present in the versioned `.meta.json` itself). */
+      overlays?: OverlayVisibility;
     }
   | undefined {
   if (typeof window === 'undefined') return undefined;
@@ -572,6 +631,7 @@ function readCanvasMeta():
     __canvas_meta__?: {
       layout?: { artboards?: ArtboardRect[] };
       viewport?: ViewportState;
+      overlays?: OverlayVisibility;
     };
   };
   return w.__canvas_meta__;
@@ -1487,6 +1547,21 @@ function DesignCanvasInner({ children, controls }: DesignCanvasProps) {
   const hostRef = useRef<HTMLDivElement | null>(null);
   const worldRef = useRef<HTMLDivElement | null>(null);
 
+  // T6 — self-seed the (per-canvas, persisted) guides visibility into the
+  // shared ChromeVisibilityContext once at mount, from the SAME
+  // window.__canvas_meta__ snapshot the viewport/layout reads above use.
+  // Unlike minimap/zoom/present (global shell prefs pushed in via postMessage
+  // shortly after load), `guides` has no global default to race — it's
+  // read directly out of this canvas's own meta, so there's nothing to wait
+  // for. The shell's View-menu toggle then live-updates it through the same
+  // `dgn:'view-chrome'` channel as the other three flags.
+  // T6 — the per-canvas overlay-visibility self-seed used to live here, but
+  // this component renders CanvasShell as its CHILD and the
+  // ChromeVisibilityProvider mounts INSIDE CanvasShell — so this component's
+  // own useChromeVisibility() was always null and the seed silently never
+  // ran (dead code since the foundation feature). The working seed now lives
+  // in canvas-shell.tsx's CanvasRouter, which sits inside the provider.
+
   const seeds = useMemo(() => harvestArtboards(children), [children]);
 
   // Merge JSX-derived defaults with meta-persisted positions. Per DDR-027,
@@ -1511,6 +1586,10 @@ function DesignCanvasInner({ children, controls }: DesignCanvasProps) {
         y: Number.isFinite(m.y) ? m.y : d.y,
         w: typeof m.w === 'number' && m.w > 0 ? m.w : d.w,
         h: typeof m.h === 'number' && m.h > 0 ? m.h : d.h,
+        // kind is JSX-authoritative like w/h (DDR-027) but, unlike w/h, was
+        // never part of the legacy persisted layout shape — always the fresh
+        // seed value, no meta fallback to tolerate.
+        kind: d.kind,
       };
     });
   }, [seeds]);
@@ -1803,6 +1882,57 @@ export function DCSection({
 }
 DCSection.displayName = 'DCSection';
 
+/**
+ * Small monochrome glyph shown in the SKU-strip header for a non-`digital`
+ * artboard (T3). Mirrors the corner video-badge's stroke style (viewBox 16,
+ * `currentColor`, ~1.2px stroke) for chrome consistency. `video` reuses that
+ * exact badge glyph.
+ */
+function ArtboardKindIcon({ kind }: { kind: ArtboardKind }) {
+  if (kind === 'print') {
+    return (
+      <svg viewBox="0 0 16 16" width="10" height="10" fill="none" aria-hidden="true">
+        <rect
+          x="3"
+          y="1.5"
+          width="10"
+          height="5"
+          rx="0.5"
+          stroke="currentColor"
+          strokeWidth="1.2"
+        />
+        <rect x="1.5" y="6" width="13" height="6" rx="1" stroke="currentColor" strokeWidth="1.2" />
+        <rect x="4.5" y="10.5" width="7" height="4" stroke="currentColor" strokeWidth="1.1" />
+      </svg>
+    );
+  }
+  if (kind === 'web') {
+    return (
+      <svg viewBox="0 0 16 16" width="10" height="10" fill="none" aria-hidden="true">
+        <circle cx="8" cy="8" r="6" stroke="currentColor" strokeWidth="1.2" />
+        <path
+          d="M2 8h12M8 2c2 2 2 10 0 12M8 2c-2 2-2 10 0 12"
+          stroke="currentColor"
+          strokeWidth="1.1"
+        />
+      </svg>
+    );
+  }
+  // video — same glyph as the corner Timeline badge.
+  return (
+    <svg viewBox="0 0 16 16" width="10" height="10" fill="none" aria-hidden="true">
+      <rect x="1.5" y="4.5" width="8" height="7" rx="1.2" stroke="currentColor" strokeWidth="1.3" />
+      <path
+        d="M9.5 7l4-2.3v6.6l-4-2.3"
+        stroke="currentColor"
+        strokeWidth="1.3"
+        strokeLinejoin="round"
+      />
+    </svg>
+  );
+}
+ArtboardKindIcon.displayName = 'ArtboardKindIcon';
+
 /**
  * Bordered artboard with a SKU-strip header. Inside DesignCanvas its world
  * position comes from meta.layout (or the synthesized default grid); the
@@ -1820,6 +1950,9 @@ export function DCArtboard({
   padding,
   layout,
   gap,
+  kind,
+  guides,
+  print,
   children,
 }: {
   id: string;
@@ -1833,17 +1966,33 @@ export function DCArtboard({
   fixed?: boolean;
   /** `.dc-artboard-body` background (CSS color/token, e.g. "var(--bg-1)"). */
   background?: string;
-  /** `.dc-artboard-body` padding, px, all sides. */
-  padding?: number;
+  /** `.dc-artboard-body` padding — px number, or a `var(--token)` string
+   *  (space-token binding from the Inspector's artboard panel). */
+  padding?: number | string;
   /** `.dc-artboard-body` layout mode. Default = the engine's plain block flow. */
   layout?: 'block' | 'flex-col' | 'flex-row' | 'grid';
-  /** `.dc-artboard-body` gap, px — only visible under flex-col/flex-row/grid. */
-  gap?: number;
+  /** `.dc-artboard-body` gap — px number or `var(--token)` string; only
+   *  visible under flex-col/flex-row/grid. */
+  gap?: number | string;
+  /** What this artboard IS — digital screen / print page / web flow / video
+   *  comp. Absent ⇒ `digital` (or `video` when the subtree contains a
+   *  `<VideoComp>`, for unmigrated canvases — see `subtreeHasVideoComp`).
+   *  An explicit prop always supersedes that structural fallback. */
+  kind?: ArtboardKind;
+  /** Generic layout guides (T5) — Figma-vocabulary columns/rows/grid,
+   *  versioned design intent. Kind-agnostic: any artboard can carry these
+   *  regardless of `kind`. Visibility is per-user (T6), not this prop. */
+  guides?: GuideDefinitions;
+  /** feature-2-print-artboards T2 — paper/orientation/bleed/margins intent.
+   *  Only meaningful when `kind="print"`; the overlay (T3) reads it to draw
+   *  bleed/trim/margin guides against THIS artboard's own resolved px size. */
+  print?: ArtboardPrintProp;
   children: ReactNode;
 }) {
   const ctx = useWorldContext();
   const _controller = useViewportControllerContext();
   const toolMode = useToolModeOptional();
+  const chrome = useChromeVisibility();
   const selSet = useSelectionSetOptional();
   const dragBus = useDragStateContext();
   // Phase 13 / DDR-029 — live "agent works here" overlay. Inert (present=false)
@@ -1853,10 +2002,15 @@ export function DCArtboard({
   // its presence color + show its funny name instead of the generic file label.
   const agent = useAgentPresence();
   const rect = ctx ? ctx.rectFor(id) : null;
+  // T1/T2 — explicit `kind` wins; `subtreeHasVideoComp` is the fallback that
+  // keeps existing unmigrated video canvases badged identically without
+  // requiring a JSX edit (Design Decision 1).
+  const hasVideoContent = useMemo(() => subtreeHasVideoComp(children), [children]);
+  const resolvedKind: ArtboardKind = kind ?? (hasVideoContent ? 'video' : 'digital');
   // DDR-148 — badge video artboards in the header; clicking the badge opens
   // the timeline panel via the same postMessage the context-menu "Open
   // Timeline" entry already sends (canvas-shell.tsx artboardHasVideo/handler).
-  const hasVideo = useMemo(() => subtreeHasVideoComp(children), [children]);
+  const hasVideo = resolvedKind === 'video';
   const openTimeline = useCallback(
     (e: ReactMouseEvent<HTMLButtonElement>) => {
       e.stopPropagation();
@@ -1921,8 +2075,9 @@ export function DCArtboard({
   const bodyStyle = useMemo<CSSProperties>(() => {
     const st: CSSProperties = {};
     if (background) st.background = background;
-    if (typeof padding === 'number') st.padding = padding;
-    if (typeof gap === 'number') st.gap = gap;
+    // number → px; string → a var(--token) binding (validated server-side).
+    if (typeof padding === 'number' || typeof padding === 'string') st.padding = padding;
+    if (typeof gap === 'number' || typeof gap === 'string') st.gap = gap;
     if (layout === 'flex-col') {
       st.display = 'flex';
       st.flexDirection = 'column';
@@ -1943,9 +2098,20 @@ export function DCArtboard({
   const readBackAttrs = {
     'data-dc-fixed': fixed ? 'true' : undefined,
     'data-dc-bg': background,
-    'data-dc-padding': typeof padding === 'number' ? String(padding) : undefined,
+    'data-dc-padding': padding != null ? String(padding) : undefined,
     'data-dc-layout': layout,
-    'data-dc-gap': typeof gap === 'number' ? String(gap) : undefined,
+    'data-dc-gap': gap != null ? String(gap) : undefined,
+    // Always present (unlike the optional-override props above) — this is a
+    // resolved classification, not a "no override" style knob. Chrome, the
+    // Inspector kind picker (T8), and canvas-shell's artboardHasVideo gate
+    // (T2) all key off this attribute.
+    'data-dc-kind': resolvedKind,
+    // feature-2-print-artboards T2 — read-back for the Inspector's print
+    // picker (paper/orientation/bleed pre-fill), same "stamp the resolved
+    // prop as JSON, parse it back" shape `guides` would need if it grew an
+    // Inspector editor. Small object (≤ ~150 bytes), so a plain JSON attr is
+    // simpler than adding parallel data-dc-print-* scalar attrs per field.
+    'data-dc-print': print ? JSON.stringify(print) : undefined,
   };
 
   if (!ctx || !rect) {
@@ -2037,7 +2203,22 @@ export function DCArtboard({
         }}
         {...handleProps}
       >
-        <button type="button" className="dc-artboard-label sku" aria-label={`Artboard ${label}`}>
+        <button
+          type="button"
+          className="dc-artboard-label sku"
+          // a11y-auditor (T3 review) — the kind chip is aria-hidden (decorative,
+          // redundant with the Inspector's Kind picker), so a non-digital kind
+          // must still reach the artboard's own accessible name or it's
+          // invisible to AT users entirely.
+          aria-label={
+            resolvedKind !== 'digital' ? `Artboard ${label}, ${resolvedKind}` : `Artboard ${label}`
+          }
+        >
+          {resolvedKind !== 'digital' ? (
+            <span className="dc-artboard-kind-chip" aria-hidden="true">
+              <ArtboardKindIcon kind={resolvedKind} />
+            </span>
+          ) : null}
           {label}
         </button>
         {hasVideo ? (
@@ -2079,6 +2260,17 @@ export function DCArtboard({
           color={agent?.color}
         />
       ) : null}
+      {/* T4 — world-coord sibling, same reasoning as ArtboardActivityOverlay
+          above: must stay OUTSIDE `.dc-artboard`'s contain:paint/
+          content-visibility subtree so guides are never culled/frozen with
+          exported content (they're never exported at all). */}
+      <ArtboardGuidesOverlay
+        rect={{ x: liveX, y: liveY, w: rect.w, h: rect.h }}
+        kind={resolvedKind}
+        guides={guides}
+        print={print}
+        visibility={{ guides: chrome?.guides ?? false, print: chrome?.print ?? false }}
+      />
     </>
   );
 }

package/apps/studio/canvas-shell.tsx

@@ -570,10 +570,17 @@ function getLastLayersArtboardId(): string | null {
 // DDR-148 — an artboard hosting a <VideoComp> stamps a `[data-comp-id]`
 // element inside it (see video-comp.tsx). Gates the artboard-chrome context
 // menu's "Open Timeline" entry to artboards that actually have a sequence.
+// T2 (feature-1-artboard-kinds-foundation) — merged with the resolved `kind`:
+// an explicit `kind="video"` (DCArtboard's `data-dc-kind` readback) also
+// qualifies, even before any `<VideoComp>` content exists yet; the structural
+// `[data-comp-id]` check stays as the fallback for unmigrated canvases.
 function artboardHasVideo(artboardId: string | null | undefined): boolean {
   if (typeof document === 'undefined' || !artboardId) return false;
   try {
-    return !!document.querySelector(`[data-dc-screen="${CSS.escape(artboardId)}"] [data-comp-id]`);
+    const root = document.querySelector(`[data-dc-screen="${CSS.escape(artboardId)}"]`);
+    if (!root) return false;
+    if (root.getAttribute('data-dc-kind') === 'video') return true;
+    return !!root.querySelector('[data-comp-id]');
   } catch {
     return false;
   }
@@ -1421,6 +1428,56 @@ function buildRegistry(deps: {
     ],
   };
 
+  // feature-1-artboard-kinds-foundation, T8 — kind-switch submenu, same
+  // shape as themeItem above (a parent-only MenuItem whose onSelect never
+  // fires). The write is main-origin-only (DDR-054): post to the parent
+  // shell (dgn:'set-artboard-kind-request'), which calls
+  // api.setArtboardKindOp and records undo — mirrors delete-artboard-request.
+  const postArtboardKindRequest = (artboardId: string, kind: string | null): void => {
+    try {
+      window.parent.postMessage({ dgn: 'set-artboard-kind-request', artboardId, kind }, '*');
+    } catch {
+      /* detached / cross-origin */
+    }
+  };
+  const kindItem: MenuItem = {
+    id: 'kind',
+    label: 'Artboard kind',
+    onSelect: () => {
+      /* parent of a submenu — never invoked directly */
+    },
+    submenu: [
+      {
+        id: 'kind-digital',
+        label: 'Digital (default)',
+        onSelect: (target) => {
+          if (target.artboardId) postArtboardKindRequest(target.artboardId, null);
+        },
+      },
+      {
+        id: 'kind-print',
+        label: 'Print',
+        onSelect: (target) => {
+          if (target.artboardId) postArtboardKindRequest(target.artboardId, 'print');
+        },
+      },
+      {
+        id: 'kind-web',
+        label: 'Web',
+        onSelect: (target) => {
+          if (target.artboardId) postArtboardKindRequest(target.artboardId, 'web');
+        },
+      },
+      {
+        id: 'kind-video',
+        label: 'Video',
+        onSelect: (target) => {
+          if (target.artboardId) postArtboardKindRequest(target.artboardId, 'video');
+        },
+      },
+    ],
+  };
+
   return {
     element: [
       [
@@ -1771,7 +1828,7 @@ function buildRegistry(deps: {
           onSelect: () => distributeArtboards('y'),
         },
       ],
-      [themeItem],
+      [themeItem, kindItem],
       [
         {
           id: 'delete-artboard',
@@ -1938,6 +1995,34 @@ function CanvasRouter({
   // consumes.
   const chromeCtx = useChromeVisibility();
 
+  // Dogfood follow-up (print artboards) — self-seed the per-canvas persisted
+  // overlay visibility (view.json `overlays.guides`/`overlays.print`, GET-
+  // merged into `window.__canvas_meta__` by _shell.html before mount) into
+  // the chrome store, once per mount. This seed originally lived in
+  // DesignCanvasInner (canvas-lib.tsx) — but that component renders
+  // CanvasShell as its CHILD, and ChromeVisibilityProvider mounts INSIDE
+  // CanvasShell, so DesignCanvasInner's own useChromeVisibility() was always
+  // null and the seed silently never ran (dead since the foundation feature;
+  // the generic `guides` toggle had no UI yet, so nothing surfaced it —
+  // "Show print guides" is its first real consumer). CanvasRouter sits
+  // inside the provider (it's the view-chrome bridge), so the seed works
+  // here. Absent keys stay HIDDEN (the T6 gotcha — an old view.json must
+  // not suddenly paint guides nobody asked for).
+  const overlaysSeededRef = useRef(false);
+  useEffect(() => {
+    if (overlaysSeededRef.current || !chromeCtx) return;
+    overlaysSeededRef.current = true;
+    const w = window as unknown as {
+      __canvas_meta__?: { overlays?: Record<string, boolean> };
+    };
+    const overlays = w.__canvas_meta__?.overlays;
+    if (!overlays) return;
+    const patch: { guides?: boolean; print?: boolean } = {};
+    if (overlays.guides === true) patch.guides = true;
+    if (overlays.print === true) patch.print = true;
+    if (Object.keys(patch).length > 0) chromeCtx.setChrome(patch);
+  }, [chromeCtx]);
+
   // Task A2 (feature-element-editing-robustness) — host-scroll-0 invariant.
   // `.dc-canvas` (overflow:hidden) and each `.dc-artboard-body` are the engine's
   // clip layers; the camera lives entirely in the `.dc-world` transform, and
@@ -2037,29 +2122,39 @@ function CanvasRouter({
       // request-layers re-walks + posts the tree for an artboard.
       if (m.dgn === 'select-by-id') {
         const mm = m as { id?: string; artboardId?: string | null; index?: number };
-        if (mm.id) {
-          const target = resolveSelectionEl(document, {
-            id: mm.id,
-            artboardId: mm.artboardId,
-            index: mm.index,
-          });
-          if (target) {
-            selSet.replace(
-              hoverTargetToSelection({
-                el: target,
-                cdId: mm.id,
-                artboardId: mm.artboardId ?? null,
-              } as HoverTarget)
-            );
-            // Task A1 — reveal THROUGH the camera, not host scroll. The old
-            // `scrollIntoView` scrolled the overflow:hidden `.dc-canvas` /
-            // `.dc-artboard-body` clip layers, desyncing the `.dc-world`
-            // transform (Bugs A + B). `revealElementViaCamera` pans the world
-            // the minimal amount only when the element is off-screen.
-            const host = hostRef.current;
-            if (host && zoomController) {
-              revealElementViaCamera(host, target as HTMLElement, zoomController);
-            }
+        // Dogfood follow-up — a bare ARTBOARD selection (no data-cd-id, the
+        // ArtboardKnobs panel's own case) has no `mm.id` to resolve by, so
+        // the element branch below never ran for it: after a structural
+        // artboard write (kind/print/style/hug/resize) the Inspector kept
+        // showing the PRE-edit attrs snapshot (e.g. "Digital" right after
+        // switching to "Print") until the user manually re-clicked the
+        // artboard. Resolve by the SAME `[data-dc-screen="<id>"]` selector
+        // ArtboardKnobs itself reads its selection from (dom-selection.ts
+        // `hoverTargetToSelection` "2. data-dc-screen" resolution order) when
+        // there's no cdId to anchor on.
+        const target = mm.id
+          ? resolveSelectionEl(document, { id: mm.id, artboardId: mm.artboardId, index: mm.index })
+          : mm.artboardId
+            ? resolveSelectionEl(document, {
+                selector: `[data-dc-screen="${CSS.escape(mm.artboardId)}"]`,
+              })
+            : null;
+        if (target) {
+          selSet.replace(
+            hoverTargetToSelection({
+              el: target,
+              cdId: mm.id,
+              artboardId: mm.artboardId ?? null,
+            } as HoverTarget)
+          );
+          // Task A1 — reveal THROUGH the camera, not host scroll. The old
+          // `scrollIntoView` scrolled the overflow:hidden `.dc-canvas` /
+          // `.dc-artboard-body` clip layers, desyncing the `.dc-world`
+          // transform (Bugs A + B). `revealElementViaCamera` pans the world
+          // the minimal amount only when the element is off-screen.
+          const host = hostRef.current;
+          if (host && zoomController) {
+            revealElementViaCamera(host, target as HTMLElement, zoomController);
           }
         }
         return;
@@ -2188,13 +2283,57 @@ function CanvasRouter({
       }
       // Shell View-menu chrome toggles + Presentation Mode. Only the fields the
       // shell sends are merged, so a `{ present: true }` enter keeps the user's
-      // individual minimap/zoom toggles for the eventual exit.
+      // individual minimap/zoom toggles for the eventual exit. `guides` (T6) is
+      // the odd one out — per-CANVAS persisted state, not a global pref — but
+      // rides the same live-broadcast channel; the shell PATCHes view.json
+      // separately (see setGuidesVisible in app.jsx).
       if (m.dgn === 'view-chrome' && chromeCtx) {
-        const mm = m as { minimap?: boolean; zoom?: boolean; present?: boolean };
-        const patch: { minimap?: boolean; zoom?: boolean; present?: boolean } = {};
+        const mm = m as {
+          minimap?: boolean;
+          zoom?: boolean;
+          present?: boolean;
+          guides?: boolean;
+          print?: boolean;
+        };
+        const patch: {
+          minimap?: boolean;
+          zoom?: boolean;
+          present?: boolean;
+          guides?: boolean;
+          print?: boolean;
+        } = {};
         if (typeof mm.minimap === 'boolean') patch.minimap = mm.minimap;
         if (typeof mm.zoom === 'boolean') patch.zoom = mm.zoom;
         if (typeof mm.present === 'boolean') patch.present = mm.present;
+        if (typeof mm.guides === 'boolean') patch.guides = mm.guides;
+        // feature-2-print-artboards T3 — "Show print guides" (bleed/trim/
+        // margin overlay). Same per-canvas-persisted shape as `guides`.
+        if (typeof mm.print === 'boolean') patch.print = mm.print;
+        // Dogfood follow-up — mirror `guides`/`print` into the in-iframe
+        // `window.__canvas_meta__.overlays` snapshot, exactly like the
+        // existing viewport/layout mirror in canvas-lib.tsx's onSettle (DDR-
+        // 138 comment: "populated ONCE at page load — so after a settle, a
+        // soft HMR remount (any module edit: text, reorder, agent edit)
+        // would re-read the STALE page-load [value]"). Without this, a
+        // structural edit AFTER toggling guides on (e.g. a kind switch,
+        // which is exactly such an edit) remounts DesignCanvasInner, its
+        // `guidesSeededRef` self-seed effect re-fires, and reads the stale
+        // page-load overlays snapshot — silently reverting a live-toggled
+        // guide back to hidden even though the View-menu checkbox still
+        // shows it checked. Same class of bug DDR-138 fixed for the camera;
+        // this is its `overlays` counterpart.
+        if (patch.guides !== undefined || patch.print !== undefined) {
+          const w = window as unknown as {
+            __canvas_meta__?: { overlays?: Record<string, boolean> };
+          };
+          if (w.__canvas_meta__) {
+            w.__canvas_meta__.overlays = {
+              ...w.__canvas_meta__.overlays,
+              ...(patch.guides !== undefined ? { guides: patch.guides } : {}),
+              ...(patch.print !== undefined ? { print: patch.print } : {}),
+            };
+          }
+        }
         chromeCtx.setChrome(patch);
         return;
       }