@snowcone-app/canvas 0.19.1 → 0.20.0

package/dist/testing.mjs

@@ -1,11 +1,11 @@
-import { e as ie, g as oe, a as ae } from "./editorErrors-DXNfVXtD.js";
+import { E as A, g as m } from "./editorErrors-CK1RISFa.js";
+import { l as ie, m as oe, n as ae } from "./editorErrors-CK1RISFa.js";
 import { fetchMockupImage as S, isSnowconeSdkError as b, RenderSession as _, mintRealtimeGrant as R } from "@snowcone-app/sdk";
-import { s as I, d as A } from "./design-builder-v4935TeS.js";
-import { E as y, g as m } from "./EditorContext-5QpqAhjh.js";
+import { s as I, d as y } from "./design-builder-DMKx9UXD.js";
 import { jsx as u } from "react/jsx-runtime";
 import { useState as D } from "react";
 import { T as p } from "./ThemeContext-Rjz25x9X.js";
-import { E as T, A as k, g as F, I as x } from "./FontAnalyzer-DIlqmyuf.js";
+import { E as T, A as k, g as F, I as x } from "./FontAnalyzer-BpsTYowD.js";
 const G = ({
   children: t,
   initialElements: n = [],
@@ -32,7 +32,7 @@ const G = ({
     }), a;
   });
   return /* @__PURE__ */ u(p, { children: /* @__PURE__ */ u(
-    y,
+    A,
     {
       initialArtboardConfig: o,
       children: t
@@ -44,7 +44,7 @@ const G = ({
   initialSelection: e = null,
   initialMultiSelection: r = [],
   initialArtboardConfig: i = {}
-}) => /* @__PURE__ */ u(p, { children: /* @__PURE__ */ u(y, { initialArtboardConfig: i, children: t }) });
+}) => /* @__PURE__ */ u(p, { children: /* @__PURE__ */ u(A, { initialArtboardConfig: i, children: t }) });
 function W(t = "custom", n = {}) {
   const e = F(t);
   if (!e || !e.Component)
@@ -223,10 +223,10 @@ async function X(t, n, e) {
 }
 const v = "https://assets.test-403.invalid/denied.png";
 function Z() {
-  return A({ name: "Front", width: 1e3, height: 1e3 }).background(v, { aspectRatio: 1, name: "art" }).text("ALLOWLIST DENIAL FIXTURE", { anchor: "top", name: "headline" });
+  return y({ name: "Front", width: 1e3, height: 1e3 }).background(v, { aspectRatio: 1, name: "art" }).text("ALLOWLIST DENIAL FIXTURE", { anchor: "top", name: "headline" });
 }
 function ee() {
-  return A({ name: "Front", width: 1e3, height: 1e3 }).text("YOUR NAME", { anchor: "center", name: "name" });
+  return y({ name: "Front", width: 1e3, height: 1e3 }).text("YOUR NAME", { anchor: "center", name: "name" });
 }
 function te(t = "failing-grant fixture: grant endpoint unavailable") {
   return () => Promise.reject(new Error(t));

package/dist/types/index.d.ts

@@ -568,6 +568,15 @@ export type ClipShape = 'rectangle' | 'circle' | {
         baseHeight?: number;
     }>;
 };
+/**
+ * Pacing role of an artboard in a multi-page template (ADR-0086 albums).
+ *
+ * Client/template metadata: auto-fill uses it to know which spreads clone as
+ * the page count grows (`repeating`) and which stay fixed (`cover` /
+ * `front-matter` / `back-matter`). It never reaches the server render wire —
+ * `serializeStateForServer` strips it like the element `artboard` membership tag.
+ */
+export type ArtboardRole = 'cover' | 'front-matter' | 'repeating' | 'back-matter';
 export interface ArtboardConfig {
     id?: string;
     name?: string;
@@ -581,6 +590,7 @@ export interface ArtboardConfig {
     exportBackground?: boolean;
     elementIds?: string[];
     transformType?: 'artboard';
+    role?: ArtboardRole;
     clipShape?: ClipShape;
     previewBackgroundColor?: string;
     distressTexture?: ArtboardDistressTexture;

package/dist/{usePieceGuideBundle-DVOISsB1.js → usePieceGuideBundle-Ctnu5k2D.js}

@@ -1,4 +1,4 @@
-import { y as r } from "./FontAnalyzer-DIlqmyuf.js";
+import { y as r } from "./FontAnalyzer-BpsTYowD.js";
 import { useState as a, useEffect as d } from "react";
 const u = "https://api.snowcone.app";
 function h(e) {
@@ -58,4 +58,4 @@ export {
   l as p,
   p as u
 };
-//# sourceMappingURL=usePieceGuideBundle-DVOISsB1.js.map
+//# sourceMappingURL=usePieceGuideBundle-Ctnu5k2D.js.map

package/dist/{usePieceGuideBundle-DVOISsB1.js.map → usePieceGuideBundle-Ctnu5k2D.js.map}

@@ -1 +1 @@
-{"version":3,"file":"usePieceGuideBundle-DVOISsB1.js","sources":["../src/components/embed-realtime/usePieceGuideBundle.ts"],"sourcesContent":["'use client';\n\n/**\n * usePieceGuideBundle — fetch a product's printable-area guides for the embed.\n *\n * Some products hide part of the print file under hardware (a phone case's\n * camera module, a notebook's spine). snowcone.app's own editor draws the\n * printable-area / dead-zone overlay from the product's piece guides;\n * `<RealtimeEmbed>` uses this hook so embedders get the same overlay with\n * zero config — without it, a buyer can edit artwork the mockup will never\n * show, with no signal anywhere (#566).\n *\n * The endpoint is a public read (geometry only — piece rects, safe areas,\n * authored guides; same exposure class as the public catalog). Errors degrade\n * silently to \"no guides\": the editor keeps working, the overlay just doesn't\n * appear — same posture as snowcone.app's own loader.\n *\n * @module\n */\n\nimport { useEffect, useState } from 'react';\nimport type { PieceGuidesConfig } from '../embed/SnowconeCanvas.js';\nimport type {\n  PieceGuide,\n  PieceGuideRendererPiece,\n  PieceGuideRendererStyle,\n} from '../../rendering/PieceGuideRenderer.js';\n\n/** Backend base hosting `GET /printables/by-gvid/:gvid/piece-guides`. */\nexport const PIECE_GUIDES_API_BASE = 'https://api.snowcone.app';\n\n/** Wire shape of the piece-guides endpoint (the consumer-safe subset). */\ninterface RawPieceGuidesResponse {\n  artboardWidth: number;\n  artboardHeight: number;\n  /** Inches→px conversion factor for `safeAreaInsetInches`. */\n  templateDpi: number;\n  pieces: Array<{\n    id: string;\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n    rotation?: number;\n    safeAreaInsetInches?: number;\n  }>;\n  pieceGuides?: Record<string, PieceGuide>;\n  pieceGuidesStyle?: PieceGuideRendererStyle;\n}\n\n/** A fetched bundle: the overlay config plus the artboard frame it was authored in. */\nexport interface PieceGuideBundle {\n  /** The print-file frame the piece coords live in. */\n  artboardWidth: number;\n  artboardHeight: number;\n  config: PieceGuidesConfig;\n}\n\n/** Convert the wire response into a renderer-ready bundle (inches → px, etc.). */\nexport function transformPieceGuides(raw: RawPieceGuidesResponse): PieceGuideBundle {\n  const pieces: PieceGuideRendererPiece[] = raw.pieces.map((p) => ({\n    id: p.id,\n    x: p.x,\n    y: p.y,\n    width: p.width,\n    height: p.height,\n    rotation: typeof p.rotation === 'number' ? p.rotation : undefined,\n    safeAreaInsetPx:\n      typeof p.safeAreaInsetInches === 'number' && p.safeAreaInsetInches > 0\n        ? p.safeAreaInsetInches * raw.templateDpi\n        : undefined,\n  }));\n  return {\n    artboardWidth: raw.artboardWidth,\n    artboardHeight: raw.artboardHeight,\n    config: {\n      pieces,\n      guides: raw.pieceGuides ?? {},\n      style: raw.pieceGuidesStyle,\n    },\n  };\n}\n\n/**\n * Gate the bundle on the design's artboard matching the print-file frame the\n * guides were authored in — the same gate snowcone.app's editor applies. A\n * design authored at other dims would render the overlay misaligned, so it's\n * skipped (with a dev hint, since the fix — author at the placement's dims —\n * is on the embedder's side).\n */\nexport function pieceGuidesForArtboard(\n  bundle: PieceGuideBundle,\n  artboard: { width: number; height: number } | undefined,\n): PieceGuidesConfig | undefined {\n  if (!artboard) return undefined;\n  if (artboard.width !== bundle.artboardWidth || artboard.height !== bundle.artboardHeight) {\n    if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {\n      console.warn(\n        `[RealtimeEmbed] This product has printable-area guides (authored at ` +\n          `${bundle.artboardWidth}×${bundle.artboardHeight}), but the design's artboard is ` +\n          `${artboard.width}×${artboard.height} — the dead-zone overlay is skipped because the ` +\n          `coordinates wouldn't line up. Author the design at the placement's dimensions to get it.`,\n      );\n    }\n    return undefined;\n  }\n  return bundle.config;\n}\n\n/**\n * Fetch the piece-guide bundle for a variant (gvid). Returns null while\n * loading, when `gvid` is undefined, and on any error (silent degrade).\n */\nexport function usePieceGuideBundle(\n  gvid: string | undefined,\n  apiBase: string = PIECE_GUIDES_API_BASE,\n): PieceGuideBundle | null {\n  const [bundle, setBundle] = useState<PieceGuideBundle | null>(null);\n\n  useEffect(() => {\n    if (!gvid) {\n      setBundle(null);\n      return;\n    }\n    let cancelled = false;\n    fetch(`${apiBase}/printables/by-gvid/${encodeURIComponent(gvid)}/piece-guides`)\n      .then(async (res) => {\n        if (!res.ok) throw new Error(`status ${res.status}`);\n        return (await res.json()) as RawPieceGuidesResponse;\n      })\n      .then((raw) => {\n        if (!cancelled) setBundle(transformPieceGuides(raw));\n      })\n      .catch(() => {\n        // No guides is a degraded state, not a failure — the editor keeps\n        // working, the overlay just doesn't appear.\n        if (!cancelled) setBundle(null);\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [gvid, apiBase]);\n\n  return bundle;\n}\n"],"names":["PIECE_GUIDES_API_BASE","transformPieceGuides","raw","pieces","p","pieceGuidesForArtboard","bundle","artboard","process","usePieceGuideBundle","gvid","apiBase","setBundle","useState","useEffect","cancelled","res"],"mappings":";;AA6BO,MAAMA,IAAwB;AA8B9B,SAASC,EAAqBC,GAA+C;AAClF,QAAMC,IAAoCD,EAAI,OAAO,IAAI,CAACE,OAAO;AAAA,IAC/D,IAAIA,EAAE;AAAA,IACN,GAAGA,EAAE;AAAA,IACL,GAAGA,EAAE;AAAA,IACL,OAAOA,EAAE;AAAA,IACT,QAAQA,EAAE;AAAA,IACV,UAAU,OAAOA,EAAE,YAAa,WAAWA,EAAE,WAAW;AAAA,IACxD,iBACE,OAAOA,EAAE,uBAAwB,YAAYA,EAAE,sBAAsB,IACjEA,EAAE,sBAAsBF,EAAI,cAC5B;AAAA,EAAA,EACN;AACF,SAAO;AAAA,IACL,eAAeA,EAAI;AAAA,IACnB,gBAAgBA,EAAI;AAAA,IACpB,QAAQ;AAAA,MACN,QAAAC;AAAA,MACA,QAAQD,EAAI,eAAe,CAAA;AAAA,MAC3B,OAAOA,EAAI;AAAA,IAAA;AAAA,EACb;AAEJ;AASO,SAASG,EACdC,GACAC,GAC+B;;AAC/B,MAAKA,GACL;AAAA,QAAIA,EAAS,UAAUD,EAAO,iBAAiBC,EAAS,WAAWD,EAAO,gBAAgB;AACxF,MAAI,OAAOE,IAAY,SAAeA,IAAAA,EAAQ,QAARA,gBAAAA,EAAa,cAAa,gBAC9D,QAAQ;AAAA,QACN,uEACKF,EAAO,aAAa,IAAIA,EAAO,cAAc,mCAC7CC,EAAS,KAAK,IAAIA,EAAS,MAAM;AAAA,MAAA;AAI1C;AAAA,IACF;AACA,WAAOD,EAAO;AAAA;AAChB;AAMO,SAASG,EACdC,GACAC,IAAkBX,GACO;AACzB,QAAM,CAACM,GAAQM,CAAS,IAAIC,EAAkC,IAAI;AAElE,SAAAC,EAAU,MAAM;AACd,QAAI,CAACJ,GAAM;AACT,MAAAE,EAAU,IAAI;AACd;AAAA,IACF;AACA,QAAIG,IAAY;AAChB,iBAAM,GAAGJ,CAAO,uBAAuB,mBAAmBD,CAAI,CAAC,eAAe,EAC3E,KAAK,OAAOM,MAAQ;AACnB,UAAI,CAACA,EAAI,GAAI,OAAM,IAAI,MAAM,UAAUA,EAAI,MAAM,EAAE;AACnD,aAAQ,MAAMA,EAAI,KAAA;AAAA,IACpB,CAAC,EACA,KAAK,CAACd,MAAQ;AACb,MAAKa,KAAWH,EAAUX,EAAqBC,CAAG,CAAC;AAAA,IACrD,CAAC,EACA,MAAM,MAAM;AAGX,MAAKa,KAAWH,EAAU,IAAI;AAAA,IAChC,CAAC,GACI,MAAM;AACX,MAAAG,IAAY;AAAA,IACd;AAAA,EACF,GAAG,CAACL,GAAMC,CAAO,CAAC,GAEXL;AACT;"}
+{"version":3,"file":"usePieceGuideBundle-Ctnu5k2D.js","sources":["../src/components/embed-realtime/usePieceGuideBundle.ts"],"sourcesContent":["'use client';\n\n/**\n * usePieceGuideBundle — fetch a product's printable-area guides for the embed.\n *\n * Some products hide part of the print file under hardware (a phone case's\n * camera module, a notebook's spine). snowcone.app's own editor draws the\n * printable-area / dead-zone overlay from the product's piece guides;\n * `<RealtimeEmbed>` uses this hook so embedders get the same overlay with\n * zero config — without it, a buyer can edit artwork the mockup will never\n * show, with no signal anywhere (#566).\n *\n * The endpoint is a public read (geometry only — piece rects, safe areas,\n * authored guides; same exposure class as the public catalog). Errors degrade\n * silently to \"no guides\": the editor keeps working, the overlay just doesn't\n * appear — same posture as snowcone.app's own loader.\n *\n * @module\n */\n\nimport { useEffect, useState } from 'react';\nimport type { PieceGuidesConfig } from '../embed/SnowconeCanvas.js';\nimport type {\n  PieceGuide,\n  PieceGuideRendererPiece,\n  PieceGuideRendererStyle,\n} from '../../rendering/PieceGuideRenderer.js';\n\n/** Backend base hosting `GET /printables/by-gvid/:gvid/piece-guides`. */\nexport const PIECE_GUIDES_API_BASE = 'https://api.snowcone.app';\n\n/** Wire shape of the piece-guides endpoint (the consumer-safe subset). */\ninterface RawPieceGuidesResponse {\n  artboardWidth: number;\n  artboardHeight: number;\n  /** Inches→px conversion factor for `safeAreaInsetInches`. */\n  templateDpi: number;\n  pieces: Array<{\n    id: string;\n    x: number;\n    y: number;\n    width: number;\n    height: number;\n    rotation?: number;\n    safeAreaInsetInches?: number;\n  }>;\n  pieceGuides?: Record<string, PieceGuide>;\n  pieceGuidesStyle?: PieceGuideRendererStyle;\n}\n\n/** A fetched bundle: the overlay config plus the artboard frame it was authored in. */\nexport interface PieceGuideBundle {\n  /** The print-file frame the piece coords live in. */\n  artboardWidth: number;\n  artboardHeight: number;\n  config: PieceGuidesConfig;\n}\n\n/** Convert the wire response into a renderer-ready bundle (inches → px, etc.). */\nexport function transformPieceGuides(raw: RawPieceGuidesResponse): PieceGuideBundle {\n  const pieces: PieceGuideRendererPiece[] = raw.pieces.map((p) => ({\n    id: p.id,\n    x: p.x,\n    y: p.y,\n    width: p.width,\n    height: p.height,\n    rotation: typeof p.rotation === 'number' ? p.rotation : undefined,\n    safeAreaInsetPx:\n      typeof p.safeAreaInsetInches === 'number' && p.safeAreaInsetInches > 0\n        ? p.safeAreaInsetInches * raw.templateDpi\n        : undefined,\n  }));\n  return {\n    artboardWidth: raw.artboardWidth,\n    artboardHeight: raw.artboardHeight,\n    config: {\n      pieces,\n      guides: raw.pieceGuides ?? {},\n      style: raw.pieceGuidesStyle,\n    },\n  };\n}\n\n/**\n * Gate the bundle on the design's artboard matching the print-file frame the\n * guides were authored in — the same gate snowcone.app's editor applies. A\n * design authored at other dims would render the overlay misaligned, so it's\n * skipped (with a dev hint, since the fix — author at the placement's dims —\n * is on the embedder's side).\n */\nexport function pieceGuidesForArtboard(\n  bundle: PieceGuideBundle,\n  artboard: { width: number; height: number } | undefined,\n): PieceGuidesConfig | undefined {\n  if (!artboard) return undefined;\n  if (artboard.width !== bundle.artboardWidth || artboard.height !== bundle.artboardHeight) {\n    if (typeof process !== 'undefined' && process.env?.NODE_ENV !== 'production') {\n      console.warn(\n        `[RealtimeEmbed] This product has printable-area guides (authored at ` +\n          `${bundle.artboardWidth}×${bundle.artboardHeight}), but the design's artboard is ` +\n          `${artboard.width}×${artboard.height} — the dead-zone overlay is skipped because the ` +\n          `coordinates wouldn't line up. Author the design at the placement's dimensions to get it.`,\n      );\n    }\n    return undefined;\n  }\n  return bundle.config;\n}\n\n/**\n * Fetch the piece-guide bundle for a variant (gvid). Returns null while\n * loading, when `gvid` is undefined, and on any error (silent degrade).\n */\nexport function usePieceGuideBundle(\n  gvid: string | undefined,\n  apiBase: string = PIECE_GUIDES_API_BASE,\n): PieceGuideBundle | null {\n  const [bundle, setBundle] = useState<PieceGuideBundle | null>(null);\n\n  useEffect(() => {\n    if (!gvid) {\n      setBundle(null);\n      return;\n    }\n    let cancelled = false;\n    fetch(`${apiBase}/printables/by-gvid/${encodeURIComponent(gvid)}/piece-guides`)\n      .then(async (res) => {\n        if (!res.ok) throw new Error(`status ${res.status}`);\n        return (await res.json()) as RawPieceGuidesResponse;\n      })\n      .then((raw) => {\n        if (!cancelled) setBundle(transformPieceGuides(raw));\n      })\n      .catch(() => {\n        // No guides is a degraded state, not a failure — the editor keeps\n        // working, the overlay just doesn't appear.\n        if (!cancelled) setBundle(null);\n      });\n    return () => {\n      cancelled = true;\n    };\n  }, [gvid, apiBase]);\n\n  return bundle;\n}\n"],"names":["PIECE_GUIDES_API_BASE","transformPieceGuides","raw","pieces","p","pieceGuidesForArtboard","bundle","artboard","process","usePieceGuideBundle","gvid","apiBase","setBundle","useState","useEffect","cancelled","res"],"mappings":";;AA6BO,MAAMA,IAAwB;AA8B9B,SAASC,EAAqBC,GAA+C;AAClF,QAAMC,IAAoCD,EAAI,OAAO,IAAI,CAACE,OAAO;AAAA,IAC/D,IAAIA,EAAE;AAAA,IACN,GAAGA,EAAE;AAAA,IACL,GAAGA,EAAE;AAAA,IACL,OAAOA,EAAE;AAAA,IACT,QAAQA,EAAE;AAAA,IACV,UAAU,OAAOA,EAAE,YAAa,WAAWA,EAAE,WAAW;AAAA,IACxD,iBACE,OAAOA,EAAE,uBAAwB,YAAYA,EAAE,sBAAsB,IACjEA,EAAE,sBAAsBF,EAAI,cAC5B;AAAA,EAAA,EACN;AACF,SAAO;AAAA,IACL,eAAeA,EAAI;AAAA,IACnB,gBAAgBA,EAAI;AAAA,IACpB,QAAQ;AAAA,MACN,QAAAC;AAAA,MACA,QAAQD,EAAI,eAAe,CAAA;AAAA,MAC3B,OAAOA,EAAI;AAAA,IAAA;AAAA,EACb;AAEJ;AASO,SAASG,EACdC,GACAC,GAC+B;;AAC/B,MAAKA,GACL;AAAA,QAAIA,EAAS,UAAUD,EAAO,iBAAiBC,EAAS,WAAWD,EAAO,gBAAgB;AACxF,MAAI,OAAOE,IAAY,SAAeA,IAAAA,EAAQ,QAARA,gBAAAA,EAAa,cAAa,gBAC9D,QAAQ;AAAA,QACN,uEACKF,EAAO,aAAa,IAAIA,EAAO,cAAc,mCAC7CC,EAAS,KAAK,IAAIA,EAAS,MAAM;AAAA,MAAA;AAI1C;AAAA,IACF;AACA,WAAOD,EAAO;AAAA;AAChB;AAMO,SAASG,EACdC,GACAC,IAAkBX,GACO;AACzB,QAAM,CAACM,GAAQM,CAAS,IAAIC,EAAkC,IAAI;AAElE,SAAAC,EAAU,MAAM;AACd,QAAI,CAACJ,GAAM;AACT,MAAAE,EAAU,IAAI;AACd;AAAA,IACF;AACA,QAAIG,IAAY;AAChB,iBAAM,GAAGJ,CAAO,uBAAuB,mBAAmBD,CAAI,CAAC,eAAe,EAC3E,KAAK,OAAOM,MAAQ;AACnB,UAAI,CAACA,EAAI,GAAI,OAAM,IAAI,MAAM,UAAUA,EAAI,MAAM,EAAE;AACnD,aAAQ,MAAMA,EAAI,KAAA;AAAA,IACpB,CAAC,EACA,KAAK,CAACd,MAAQ;AACb,MAAKa,KAAWH,EAAUX,EAAqBC,CAAG,CAAC;AAAA,IACrD,CAAC,EACA,MAAM,MAAM;AAGX,MAAKa,KAAWH,EAAU,IAAI;AAAA,IAChC,CAAC,GACI,MAAM;AACX,MAAAG,IAAY;AAAA,IACd;AAAA,EACF,GAAG,CAACL,GAAMC,CAAO,CAAC,GAEXL;AACT;"}