@snowcone-app/canvas 0.21.2 → 0.21.3

package/dist/{embed-pM7ZkFuz.js → embed-QBZkgWDr.js}

@@ -1,24 +1,24 @@
-import { E as ye, o as be, p as ve, C as xe, q, r as we, t as Ee, v as Se, w as ke, x as Ie, g as Re, e as Ce } from "./UnifiedFontService-C8gaspRD.js";
-import { y as N } from "./FontAnalyzer-CwIpgTGd.js";
-import { jsx as s, jsxs as k, Fragment as oe } from "react/jsx-runtime";
-import { useContext as Oe, createContext as Ne, useRef as C, useState as I, useMemo as O, useSyncExternalStore as B, useEffect as A, Component as Te, forwardRef as se, useId as X, useLayoutEffect as W, useCallback as j } from "react";
-import { assertVariantSelected as $e, RenderSession as _e, createCartDetail as De } from "@snowcone-app/sdk";
-import { i as ie, g as F, B as Ve, E as Ae, r as Fe } from "./editorErrors-B2mb1sVN.js";
-import { u as Be, p as Ue } from "./usePieceGuideBundle-CbJJg66S.js";
-import { s as Z, i as Le } from "./design-builder-CT4DHIPe.js";
-import { D as Pe, C as je, g as qe, e as Me } from "./template-fields-BsnHMf1i.js";
+import { E as be, o as ve, p as xe, C as we, q, r as Ee, t as ke, v as Se, w as Ie, x as Re, g as Ce, e as Oe } from "./UnifiedFontService-CC3CSmH5.js";
+import { y as $ } from "./FontAnalyzer-CwIpgTGd.js";
+import { jsx as s, jsxs as R, Fragment as se } from "react/jsx-runtime";
+import { useContext as Ne, createContext as Te, useRef as N, useState as C, useMemo as O, useSyncExternalStore as B, useEffect as D, Component as $e, forwardRef as ie, useId as Z, useLayoutEffect as W, useCallback as j } from "react";
+import { assertVariantSelected as _e, RenderSession as De, createCartDetail as Ve } from "@snowcone-app/sdk";
+import { i as ae, g as V, B as Ae, E as Fe, r as Be } from "./editorErrors-B2mb1sVN.js";
+import { u as Ue, p as Le } from "./usePieceGuideBundle-CbJJg66S.js";
+import { s as ee, i as Pe } from "./design-builder-CT4DHIPe.js";
+import { D as je, C as qe, g as Me, e as ze } from "./template-fields-C2pSfMBh.js";
 import "./CanvasStateV1-DmZ1Qvvn.js";
-const ae = Ne(void 0);
+const ce = Te(void 0);
 function G() {
-  const t = Oe(ae);
+  const t = Ne(ce);
   if (!t)
     throw new Error(
       "useRealtimeMockups / <RealtimeCanvas> / <RealtimeMockup> must be rendered inside <RealtimeEmbed>. Wrap them: <RealtimeEmbed shop=… product=… design=… grantUrl=…>…</RealtimeEmbed>"
     );
   return t;
 }
-const ze = "[RealtimeEmbed]";
-function He(t) {
+const He = "[RealtimeEmbed]";
+function Ke(t) {
   var r, o;
   if ((r = t == null ? void 0 : t.requiredPlacements) != null && r.length)
     return t.requiredPlacements.filter((a) => !a.autoFilledByVariant).map((a) => a.label);
@@ -27,7 +27,7 @@ function He(t) {
   );
   return !!(t != null && t.variantId) || e.size > 1 ? [] : (t == null ? void 0 : t.placements) ?? [];
 }
-function ce({ shop: t, product: e, design: n, hasGrant: r }) {
+function le({ shop: t, product: e, design: n, hasGrant: r }) {
   var l, m;
   const o = [];
   if (t || o.push({
@@ -44,7 +44,7 @@ function ce({ shop: t, product: e, design: n, hasGrant: r }) {
     message: 'product.mockupIds is empty — pass the catalog scene codes (product.mockups[].id) you want rendered, e.g. ["FV1qjO"].'
   }), e != null && e.options)
     try {
-      $e(e);
+      _e(e);
     } catch (f) {
       o.push({
         severity: "error",
@@ -52,7 +52,7 @@ function ce({ shop: t, product: e, design: n, hasGrant: r }) {
         message: f instanceof Error ? f.message : String(f)
       });
     }
-  const a = n.toJSON(), c = a.activeArtboard, u = He(e);
+  const a = n.toJSON(), c = a.activeArtboard, u = Ke(e);
   u.length > 1 && o.push({
     severity: "error",
     issue: "multi-placement",
@@ -62,30 +62,30 @@ function ce({ shop: t, product: e, design: n, hasGrant: r }) {
     issue: "placement-mismatch",
     message: `the design's placement "${c}" is not in product.placements [${e.placements.join(", ")}]. The canvas artboard name and renderState placement must equal a real product placement label, or the server renders a blank mockup. Fix the \`name\` passed to design({ name }).`
   });
-  const d = a.elements.map((f) => f.name).filter((f) => !!f), i = d.filter((f, h) => d.indexOf(f) !== h);
+  const d = a.elements.map((f) => f.name).filter((f) => !!f), i = d.filter((f, w) => d.indexOf(f) !== w);
   return i.length && o.push({
     severity: "warn",
     issue: "duplicate-layer-names",
     message: `duplicate layer name(s) [${[...new Set(i)].join(", ")}] — useTextBinding(name) / useImageBinding(name) bind to the FIRST match, so a duplicate name makes a control edit the wrong layer. Keep names unique.`
   }), o;
 }
-function Ke(t) {
-  for (const e of ce(t))
-    (e.severity === "error" && e.issue !== "placement-mismatch" ? console.error : console.warn)(`${ze} ${e.message}`);
-}
-const le = 8e3;
 function We(t) {
-  return `[RealtimeEmbed] No mockup after ${Math.round(le / 1e3)}s. Common causes: a variant product missing \`variantId\` (pass \`product.options\` so the embed can flag it up front), a multi-placement product (the server waits for every required placement but <RealtimeEmbed> sends only "${t}" — pass \`product.requiredPlacements\` so this is flagged at mount; such products need the eject path), an unreachable or non-public asset URL in the design, or the placement "${t}" not existing on the product. The render may still arrive — this is a heads-up, not a failure.`;
+  for (const e of le(t))
+    (e.severity === "error" && e.issue !== "placement-mismatch" ? console.error : console.warn)(`${He} ${e.message}`);
 }
+const de = 8e3;
 function Ge(t) {
+  return `[RealtimeEmbed] No mockup after ${Math.round(de / 1e3)}s. Common causes: a variant product missing \`variantId\` (pass \`product.options\` so the embed can flag it up front), a multi-placement product (the server waits for every required placement but <RealtimeEmbed> sends only "${t}" — pass \`product.requiredPlacements\` so this is flagged at mount; such products need the eject path), an unreachable or non-public asset URL in the design, or the placement "${t}" not existing on the product. The render may still arrive — this is a heads-up, not a failure.`;
+}
+function Qe(t) {
   if ("grantUrl" in t && t.grantUrl)
     return { grantUrl: t.grantUrl };
   const e = t.grant;
   return typeof e == "function" ? { getToken: e } : { getToken: () => Promise.resolve(e) };
 }
-function de({ error: t, onRetry: e }) {
-  const n = ie(t) ? t.code : "EDITOR_ERROR";
-  return /* @__PURE__ */ k(
+function ue({ error: t, onRetry: e }) {
+  const n = ae(t) ? t.code : "EDITOR_ERROR";
+  return /* @__PURE__ */ R(
     "div",
     {
       "data-sc-part": "error",
@@ -101,7 +101,7 @@ function de({ error: t, onRetry: e }) {
         lineHeight: 1.5
       },
       children: [
-        /* @__PURE__ */ k("p", { style: { margin: 0, fontWeight: 700 }, children: [
+        /* @__PURE__ */ R("p", { style: { margin: 0, fontWeight: 700 }, children: [
           "Editor failed: ",
           n
         ] }),
@@ -130,7 +130,7 @@ function de({ error: t, onRetry: e }) {
     }
   );
 }
-class Qe extends Te {
+class Je extends $e {
   constructor() {
     super(...arguments), this.state = { caught: null };
   }
@@ -139,20 +139,20 @@ class Qe extends Te {
   }
   componentDidCatch(e) {
     var n;
-    Fe(e), typeof N < "u" && ((n = N.env) == null ? void 0 : n.NODE_ENV) !== "production" && console.error("[Editor.Root] contained a composition error:", e);
+    Be(e), typeof $ < "u" && ((n = $.env) == null ? void 0 : n.NODE_ENV) !== "production" && console.error("[Editor.Root] contained a composition error:", e);
   }
   render() {
-    return this.state.caught ? /* @__PURE__ */ s(de, { error: this.state.caught }) : this.props.children;
+    return this.state.caught ? /* @__PURE__ */ s(ue, { error: this.state.caught }) : this.props.children;
   }
 }
-function Je({ reportedError: t, onRetry: e, children: n }) {
+function Ye({ reportedError: t, onRetry: e, children: n }) {
   if (t) {
-    const r = ie(t) && t.code === "E_CHUNK_LOAD_FAILED";
-    return /* @__PURE__ */ s(de, { error: t, onRetry: r ? e : void 0 });
+    const r = ae(t) && t.code === "E_CHUNK_LOAD_FAILED";
+    return /* @__PURE__ */ s(ue, { error: t, onRetry: r ? e : void 0 });
   }
-  return /* @__PURE__ */ s(Qe, { reportedError: null, onRetry: e, children: n });
+  return /* @__PURE__ */ s(Je, { reportedError: null, onRetry: e, children: n });
 }
-function Ye(t) {
+function Xe(t) {
   const {
     shop: e,
     product: n,
@@ -165,127 +165,142 @@ function Ye(t) {
     children: i,
     internals: l,
     __validation: m = "throw"
-  } = t, f = O(() => r.toJSON().activeArtboard, [r]);
+  } = t, f = O(() => r.toJSON().activeArtboard, [r]), w = O(() => {
+    const p = r.toJSON().artboards[0];
+    if (p)
+      return {
+        name: p.name,
+        width: p.width,
+        height: p.height,
+        ...p.backgroundColor ? { backgroundColor: p.backgroundColor } : {}
+      };
+  }, [r]);
   B(
     l.commerce.subscribe,
     l.commerce.getVersion,
     l.commerce.getVersion
   );
-  const h = l.commerce.resolvedVariantId(), p = Be(h ?? n.variantId ?? n.defaultGvid), w = O(() => {
-    if (!p) return null;
-    const g = r.toJSON().artboards[0];
-    return Ue(p, g) ?? null;
-  }, [p, r]), E = C(a), b = C(c);
-  E.current = a, b.current = c;
-  const [T, R] = I([]), [D, x] = I(!0), [$, _] = I(null), U = !!("grantUrl" in t && t.grantUrl || "grant" in t && t.grant), P = Ge(t), pe = "grantUrl" in P ? P.grantUrl : "getToken", ee = `${n.productId}|${n.mockupIds.join(",")}|${n.variantId ?? ""}`, M = `${e}|${ee}|${f}|${U}`;
+  const g = l.commerce.renderVariantId(), v = Ue(g ?? n.variantId ?? n.defaultGvid), E = O(() => {
+    if (!v) return null;
+    const p = r.toJSON().artboards[0];
+    return Le(v, p) ?? null;
+  }, [v, r]), T = N(a), h = N(c);
+  T.current = a, h.current = c;
+  const [k, L] = C([]), [x, S] = C(!0), [A, F] = C(null), P = !!("grantUrl" in t && t.grantUrl || "grant" in t && t.grant), Q = Qe(t), ge = "grantUrl" in Q ? Q.grantUrl : "getToken", te = `${n.productId}|${n.mockupIds.join(",")}|${n.variantId ?? ""}`, M = `${e}|${te}|${f}|${P}`;
   O(() => {
-    var S;
+    var I;
     if (m !== "throw") return;
-    const g = ce({ shop: e, product: n, design: r, hasGrant: U }), y = g.find((L) => L.severity === "error");
+    const p = le({ shop: e, product: n, design: r, hasGrant: P }), y = p.find((U) => U.severity === "error");
     if (y)
-      throw new F("E_EMBED_CONFIG", y.message, {
+      throw new V("E_EMBED_CONFIG", y.message, {
         issue: y.issue,
         docSlug: "embed-mode"
       });
-    for (const L of g)
-      typeof N < "u" && ((S = N.env) == null ? void 0 : S.NODE_ENV) !== "production" && console.warn(`[Editor.Root] ${L.message}`);
+    for (const U of p)
+      typeof $ < "u" && ((I = $.env) == null ? void 0 : I.NODE_ENV) !== "production" && console.warn(`[Editor.Root] ${U.message}`);
   }, [M, m]);
-  const te = C(null);
-  A(() => {
-    var g;
-    if (m === "warn" && typeof N < "u" && ((g = N.env) == null ? void 0 : g.NODE_ENV) !== "production") {
-      if (te.current === M) return;
-      te.current = M, Ke({ shop: e, product: n, design: r, hasGrant: U });
+  const ne = N(null);
+  D(() => {
+    var p;
+    if (m === "warn" && typeof $ < "u" && ((p = $.env) == null ? void 0 : p.NODE_ENV) !== "production") {
+      if (ne.current === M) return;
+      ne.current = M, We({ shop: e, product: n, design: r, hasGrant: P });
     }
   }, [M, m]);
   const z = O(
     () => {
       try {
-        return { session: new _e({ shop: e, product: n, wsUrl: u, ...P }) };
-      } catch (g) {
-        return { error: g instanceof Error ? g.message : String(g) };
+        return { session: new De({ shop: e, product: n, wsUrl: u, ...Q }) };
+      } catch (p) {
+        return { error: p instanceof Error ? p.message : String(p) };
       }
     },
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [e, ee, f, u, pe]
-  ), v = "session" in z ? z.session : null, H = "error" in z ? z.error : null, K = O(() => (g, y = o) => {
-    v && (_(null), x(!0), v.renderState(f, g, y).catch((S) => {
-      var re;
-      const L = S instanceof Error ? S.message : String(S);
-      _(L), x(!1), (re = b.current) == null || re.call(b, L);
+    [e, te, f, u, ge]
+  ), b = "session" in z ? z.session : null, H = "error" in z ? z.error : null, K = O(() => (p, y = o) => {
+    b && (F(null), S(!0), b.renderState(f, p, y).catch((I) => {
+      var oe;
+      const U = I instanceof Error ? I.message : String(I);
+      F(U), S(!1), (oe = h.current) == null || oe.call(h, U);
     }));
-  }, [v, f, o]);
-  A(() => {
-    var g;
+  }, [b, f, o]);
+  D(() => {
+    var p;
     if (H) {
-      _(H), x(!1), (g = b.current) == null || g.call(b, H);
+      F(H), S(!1), (p = h.current) == null || p.call(h, H);
       return;
     }
-    if (v)
-      return v.onMockups((y) => {
-        var S;
-        R(y), x(!1), (S = E.current) == null || S.call(E, y);
-      }), v.onError((y) => {
-        var S;
-        _(y), x(!1), (S = b.current) == null || S.call(b, y);
-      }), K(r.toServerRequest()), () => v.close();
-  }, [v, H]);
-  const Q = C({
+    if (b)
+      return b.onMockups((y) => {
+        var I;
+        L(y), S(!1), (I = T.current) == null || I.call(T, y);
+      }), b.onError((y) => {
+        var I;
+        F(y), S(!1), (I = h.current) == null || I.call(h, y);
+      }), K(r.toServerRequest()), () => b.close();
+  }, [b, H]);
+  const J = N({
     session: null,
     variantId: void 0
   });
-  A(() => {
-    if (!v || !h) return;
-    const g = Q.current, y = g.session === v ? g.variantId : n.variantId;
-    if (h === y) {
-      Q.current = { session: v, variantId: y };
+  D(() => {
+    if (!b || !g) return;
+    const p = J.current, y = p.session === b ? p.variantId : n.variantId;
+    if (g === y) {
+      J.current = { session: b, variantId: y };
       return;
     }
-    Q.current = { session: v, variantId: h }, v.setProduct({ ...n, variantId: h }), K(Z(l.store.getState()));
-  }, [v, h]), A(() => {
+    J.current = { session: b, variantId: g }, b.setProduct({ ...n, variantId: g }), K(ee(l.store.getState()));
+  }, [b, g]), D(() => {
     var y;
-    if (!D || typeof N > "u" || ((y = N.env) == null ? void 0 : y.NODE_ENV) === "production") return;
-    const g = setTimeout(() => console.warn(We(f)), le);
-    return () => clearTimeout(g);
-  }, [D, f]);
-  const ge = O(
+    if (!x || typeof $ > "u" || ((y = $.env) == null ? void 0 : y.NODE_ENV) === "production") return;
+    const p = setTimeout(() => console.warn(Ge(f)), de);
+    return () => clearTimeout(p);
+  }, [x, f]);
+  const he = O(
     () => ({
-      session: v,
+      session: b,
       design: r,
       placement: f,
       product: n,
-      mockups: T,
-      isRendering: D,
-      error: $,
+      mockups: k,
+      isRendering: x,
+      error: A,
       throttleMs: o,
-      pieceGuides: w,
+      pieceGuides: E,
       pushRender: K,
       stateStore: l.store
     }),
-    [v, r, f, n, T, D, $, o, w, K, l.store]
-  ), he = B(
+    [b, r, f, n, k, x, A, o, E, K, l.store]
+  ), ye = B(
     l.registry.subscribe,
     l.registry.getVersion,
     l.registry.getVersion
   );
-  O(() => l.registry.validate(), [l.registry, he]);
-  const ne = /* @__PURE__ */ s(ve.Provider, { value: l, children: /* @__PURE__ */ s(ae.Provider, { value: ge, children: /* @__PURE__ */ s(Ve.Provider, { value: l.registry, children: /* @__PURE__ */ s(Ae, { children: i }) }) }) });
-  return d ? /* @__PURE__ */ s(xe, { services: d, children: ne }) : ne;
+  O(() => l.registry.validate(), [l.registry, ye]);
+  const re = /* @__PURE__ */ s(xe.Provider, { value: l, children: /* @__PURE__ */ s(ce.Provider, { value: he, children: /* @__PURE__ */ s(Ae.Provider, { value: l.registry, children: /* @__PURE__ */ s(
+    Fe,
+    {
+      ...w ? { initialArtboardConfig: w } : {},
+      children: i
+    }
+  ) }) }) });
+  return d ? /* @__PURE__ */ s(we, { services: d, children: re }) : re;
 }
-function ue(t) {
-  const { design: e, product: n } = t, r = `${n.productId}|${n.variantId ?? ""}`, o = C(null), a = C(null), [c, u] = I(null);
+function me(t) {
+  const { design: e, product: n } = t, r = `${n.productId}|${n.variantId ?? ""}`, o = N(null), a = N(null), [c, u] = C(null);
   (o.current === null || o.current.design !== e) && (o.current = {
     design: e,
     internals: {
-      store: new Pe(e.toJSON()),
-      registry: new ye()
+      store: new je(e.toJSON()),
+      registry: new be()
     }
-  }), (a.current === null || a.current.productIdentity !== r) && (a.current = { productIdentity: r, commerce: new je(n) });
+  }), (a.current === null || a.current.productIdentity !== r) && (a.current = { productIdentity: r, commerce: new qe(n) });
   const d = O(
     () => ({
       ...o.current.internals,
       commerce: a.current.commerce,
-      ...be(u)
+      ...ve(u)
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [o.current.internals, a.current.commerce]
@@ -294,26 +309,26 @@ function ue(t) {
     // `display: contents` — the .sc-root scope without a layout box, so the
     // host's grid/flex sees the parts directly (and the legacy RealtimeEmbed
     // wrapper, which had no DOM at all, stays layout-identical).
-    /* @__PURE__ */ s("div", { className: "sc-root", style: { display: "contents" }, "data-sc-part": "root", children: /* @__PURE__ */ s(Je, { reportedError: c, onRetry: () => u(null), children: /* @__PURE__ */ s(Ye, { ...t, internals: d }) }) })
+    /* @__PURE__ */ s("div", { className: "sc-root", style: { display: "contents" }, "data-sc-part": "root", children: /* @__PURE__ */ s(Ye, { reportedError: c, onRetry: () => u(null), children: /* @__PURE__ */ s(Xe, { ...t, internals: d }) }) })
   );
 }
-let Xe = () => import("./EditorCanvasImpl-BmLHjXe7.js").then((t) => t.EditorCanvasImpl);
-function me() {
-  return Xe();
+let Ze = () => import("./EditorCanvasImpl-M7rw1c1k.js").then((t) => t.EditorCanvasImpl);
+function fe() {
+  return Ze();
 }
-const Ze = se(function({ children: e, maxHeight: n, className: r, style: o }, a) {
-  const c = q("Editor.Canvas"), u = X();
+const et = ie(function({ children: e, maxHeight: n, className: r, style: o }, a) {
+  const c = q("Editor.Canvas"), u = Z();
   W(() => c.registry.registerCanvas(u), [c.registry, u]);
-  const [d, i] = I(null);
-  return A(() => {
+  const [d, i] = C(null);
+  return D(() => {
     let l = !1;
-    return me().then(
+    return fe().then(
       (m) => {
         l || i(() => m);
       },
       (m) => {
         l || c.reportRuntimeError(
-          new F(
+          new V(
             "E_CHUNK_LOAD_FAILED",
             `the editor's rendering chunk failed to load (${m instanceof Error ? m.message : String(m)}). This is a network/CDN failure, not a composition mistake — retry, or check the deployment serves the @snowcone-app/canvas lazy chunks.`,
             { cause: m instanceof Error ? m.message : String(m), docSlug: "embed-mode" }
@@ -338,34 +353,34 @@ const Ze = se(function({ children: e, maxHeight: n, className: r, style: o }, a)
       "aria-busy": "true"
     }
   );
-}), et = 1.2, J = [1200, 1400, 1600, 1800, 2e3, 2500, 3e3, 4e3];
-function tt(t) {
-  for (const e of J)
+}), tt = 1.2, Y = [1200, 1400, 1600, 1800, 2e3, 2500, 3e3, 4e3];
+function nt(t) {
+  for (const e of Y)
     if (e >= t) return e;
-  return J[J.length - 1];
+  return Y[Y.length - 1];
 }
-function nt(t, e) {
-  if (!(t > 0) || !(e > 0) || e <= t * et) return null;
-  const n = tt(e);
+function rt(t, e) {
+  if (!(t > 0) || !(e > 0) || e <= t * tt) return null;
+  const n = nt(e);
   return `[RealtimeMockup] mockup rendered at ${t}px but displayed at ~${e} device px — the preview will look soft. Pass \`product.width\` (e.g. ${n}) on the embed for a crisp preview.`;
 }
-function fe({
+function pe({
   mockupId: t,
   fallback: e = null,
   alt: n = "Live product mockup",
   className: r,
   style: o
 }) {
-  const { mockups: a, error: c } = G(), u = C(/* @__PURE__ */ new Set()), d = t ? a.find((l) => l.mockupId === t && l.imageUrl) : a.find((l) => l.imageUrl);
+  const { mockups: a, error: c } = G(), u = N(/* @__PURE__ */ new Set()), d = t ? a.find((l) => l.mockupId === t && l.imageUrl) : a.find((l) => l.imageUrl);
   if (!(d != null && d.imageUrl))
-    return c ? /* @__PURE__ */ s("div", { "data-sc-part": "preview-error", role: "alert", "data-sc-error": c, className: r, style: o, children: e ?? `Render failed: ${c}` }) : /* @__PURE__ */ s(oe, { children: e });
+    return c ? /* @__PURE__ */ s("div", { "data-sc-part": "preview-error", role: "alert", "data-sc-error": c, className: r, style: o, children: e ?? `Render failed: ${c}` }) : /* @__PURE__ */ s(se, { children: e });
   const i = (l) => {
-    var w;
-    if (typeof N > "u" || ((w = N.env) == null ? void 0 : w.NODE_ENV) === "production" || typeof window > "u" || u.current.has(d.mockupId)) return;
+    var v;
+    if (typeof $ > "u" || ((v = $.env) == null ? void 0 : v.NODE_ENV) === "production" || typeof window > "u" || u.current.has(d.mockupId)) return;
     const m = l.currentTarget, f = m.getBoundingClientRect().width;
     if (f <= 0) return;
-    const h = Math.round(f * (window.devicePixelRatio || 1)), p = nt(m.naturalWidth, h);
-    p && (u.current.add(d.mockupId), console.warn(p));
+    const w = Math.round(f * (window.devicePixelRatio || 1)), g = rt(m.naturalWidth, w);
+    g && (u.current.add(d.mockupId), console.warn(g));
   };
   return (
     // eslint-disable-next-line @next/next/no-img-element
@@ -382,27 +397,27 @@ function fe({
     )
   );
 }
-function rt(t) {
-  const { layer: e, optional: n = !1, placeholder: r, className: o, style: a } = t, c = q("Editor.TextField"), { pushRender: u, throttleMs: d, stateStore: i } = G(), l = X(), m = C(null);
-  if (!Le(e))
-    throw new F(
+function ot(t) {
+  const { layer: e, optional: n = !1, placeholder: r, className: o, style: a } = t, c = q("Editor.TextField"), { pushRender: u, throttleMs: d, stateStore: i } = G(), l = Z(), m = N(null);
+  if (!Pe(e))
+    throw new V(
       "E_LAYER_TOKEN_REQUIRED",
       `the \`layer\` prop must be a token minted by the design — pass layer={design.layer("name")}, not ${typeof e == "string" ? `the bare string "${e}"` : "a plain value"}. Tokens validate the name against the design's layers at mint time.`,
       { received: typeof e == "string" ? e : typeof e, docSlug: "embed-mode" }
     );
   if (m.current !== e.name) {
-    const p = i.layerKindOf(e.name);
-    if (p === void 0)
-      throw new F(
+    const g = i.layerKindOf(e.name);
+    if (g === void 0)
+      throw new V(
         "E_LAYER_NOT_FOUND",
         `no layer "${e.name}" in this Root's design — the token was minted from a different design than the one passed to <Editor.Root design={…}>. Bindable layers here: ${JSON.stringify(i.bindableLayerNames())}.`,
         { layerName: e.name, validNames: i.bindableLayerNames(), docSlug: "embed-mode" }
       );
-    if (p !== "text")
-      throw new F(
+    if (g !== "text")
+      throw new V(
         "E_LAYER_WRONG_KIND",
-        `layer "${e.name}" is ${p === null ? "not a bindable kind" : `an ${p} layer`} — <Editor.TextField> binds text layers only.`,
-        { layerName: e.name, actualKind: p, docSlug: "embed-mode" }
+        `layer "${e.name}" is ${g === null ? "not a bindable kind" : `an ${g} layer`} — <Editor.TextField> binds text layers only.`,
+        { layerName: e.name, actualKind: g, docSlug: "embed-mode" }
       );
     m.current = e.name;
   }
@@ -411,12 +426,12 @@ function rt(t) {
     i.subscribe,
     () => i.textOf(e.name) ?? "",
     () => i.textOf(e.name) ?? ""
-  ), h = j(
-    (p) => {
-      const w = p.target.value, E = c.registry.getCanvasBridge();
+  ), w = j(
+    (g) => {
+      const v = g.target.value, E = c.registry.getCanvasBridge();
       if (E) {
-        E.setTextByName(e.name, w) || c.reportInvariant(
-          new F(
+        E.setTextByName(e.name, v) || c.reportInvariant(
+          new V(
             "E_LAYER_NOT_FOUND",
             `layer "${e.name}" no longer exists in the mounted canvas — it was removed or renamed after this <Editor.TextField> bound to it. Bound layers must not be renamed or deleted while a field is mounted (ADR-0085 §3).`,
             { layerName: e.name, docSlug: "embed-mode" }
@@ -424,7 +439,7 @@ function rt(t) {
         );
         return;
       }
-      i.updateTextLayer(e.name, w), u(Z(i.getState()), d);
+      i.updateTextLayer(e.name, v), u(ee(i.getState()), d);
     },
     [c, e.name, i, u, d]
   );
@@ -435,7 +450,7 @@ function rt(t) {
       "data-sc-layer": e.name,
       type: "text",
       value: f,
-      onChange: h,
+      onChange: w,
       placeholder: r,
       "aria-label": t["aria-label"] ?? e.name,
       className: o,
@@ -443,7 +458,7 @@ function rt(t) {
     }
   );
 }
-function ot(t) {
+function st(t) {
   const e = [];
   for (const n of t.missingOptionKeys)
     e.push(`option:${n}`);
@@ -460,13 +475,13 @@ function ot(t) {
   }
   return t.hasRenderableElement || e.push("empty-design"), (!Number.isInteger(t.quantity) || t.quantity < 1) && e.push("quantity"), e;
 }
-function st(t, e) {
+function it(t, e) {
   const n = e.getCombinations(), r = e.getAttributes();
   if (Object.keys(r).length === 0 || n.length === 0) return null;
   const o = Object.fromEntries(
-    Object.entries(r).map(([a, c]) => [a, { ...c, choices: qe(c) }])
+    Object.entries(r).map(([a, c]) => [a, { ...c, choices: Me(c) }])
   );
-  return De({
+  return Ve({
     productId: t.productId,
     quantity: e.getQuantity(),
     selection: e.getSelection(),
@@ -474,25 +489,25 @@ function st(t, e) {
     attributes: o
   });
 }
-function it(t) {
+function at(t) {
   const { onAddToCart: e, defaultQuantity: n, children: r, className: o, style: a } = t, c = q("Editor.Buy"), { product: u, stateStore: d } = G(), i = c.commerce;
   if (!(u != null && u.productId))
-    throw new F(
+    throw new V(
       "E_BUY_NO_PRODUCT",
       "<Editor.Buy> has no product context — pass `product` (with `productId`) on <Editor.Root product={…}>. Buy assembles its cart payload from the Root product and the live design state.",
       { docSlug: "embed-mode" }
     );
-  const l = C(!1);
+  const l = N(!1);
   W(() => {
     l.current || (l.current = !0, typeof n == "number" && i.setQuantity(n));
   }, [i]);
-  const m = B(d.subscribe, d.getState, d.getState), f = B(i.subscribe, i.getVersion, i.getVersion), h = B(
+  const m = B(d.subscribe, d.getState, d.getState), f = B(i.subscribe, i.getVersion, i.getVersion), w = B(
     c.registry.subscribe,
     c.registry.getVersion,
     c.registry.getVersion
-  ), p = i.getQuantity(), w = O(
-    () => ot({
-      quantity: p,
+  ), g = i.getQuantity(), v = O(
+    () => st({
+      quantity: g,
       missingOptionKeys: i.missingOptionKeys(),
       selectionValid: i.selectionValid(),
       textFields: c.registry.getTextFields(),
@@ -501,27 +516,27 @@ function it(t) {
       hasRenderableElement: d.hasRenderableElement()
     }),
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    [i, p, m, f, h]
-  ), E = w.length === 0, [b, T] = I(!1), R = C(!1), D = j(() => {
-    if (R.current || !E) return;
-    R.current = !0, T(!0);
-    const x = d.getState(), $ = i.resolvedVariantId(), _ = {
+    [i, g, m, f, w]
+  ), E = v.length === 0, [T, h] = C(!1), k = N(!1), L = j(() => {
+    if (k.current || !E) return;
+    k.current = !0, h(!0);
+    const x = d.getState(), S = i.resolvedVariantId(), A = {
       productId: u.productId,
-      ...$ ? { variantId: $ } : {},
+      ...S ? { variantId: S } : {},
       quantity: i.getQuantity(),
       selection: i.getSelection(),
-      cartDetail: st(u, i),
+      cartDetail: it(u, i),
       designState: x,
-      serverRequest: Z(x)
+      serverRequest: ee(x)
     };
-    let U;
+    let F;
     try {
-      U = e(_);
+      F = e(A);
     } catch (P) {
-      throw R.current = !1, T(!1), P;
+      throw k.current = !1, h(!1), P;
     }
-    Promise.resolve(U).finally(() => {
-      R.current = !1, T(!1);
+    Promise.resolve(F).finally(() => {
+      k.current = !1, h(!1);
     });
   }, [E, u, i, d, e]);
   return /* @__PURE__ */ s(
@@ -529,40 +544,40 @@ function it(t) {
     {
       type: "button",
       "data-sc-part": "buy",
-      "data-sc-buy-state": b ? "busy" : E ? "ready" : "incomplete",
-      "data-sc-buy-missing": w.join(",") || void 0,
-      disabled: !E || b,
-      "aria-busy": b || void 0,
-      onClick: D,
+      "data-sc-buy-state": T ? "busy" : E ? "ready" : "incomplete",
+      "data-sc-buy-missing": v.join(",") || void 0,
+      disabled: !E || T,
+      "aria-busy": T || void 0,
+      onClick: L,
       className: o,
       style: a,
       children: r ?? "Add to cart"
     }
   );
 }
-function at({
+function ct({
   placement: t = "docked",
   className: e,
   style: n
 }) {
   const r = q("Editor.Controls");
-  we("Editor.Controls");
-  const o = X();
+  Ee("Editor.Controls");
+  const o = Z();
   W(
     () => r.registry.registerControls(o, t),
     [r.registry, o, t]
   );
-  const a = t === "docked", [c, u] = I(null);
-  return A(() => {
+  const a = t === "docked", [c, u] = C(null);
+  return D(() => {
     if (!a) return;
     let d = !1;
-    return import("./ContextualToolbars-BYnovWnN.js").then((i) => i.x).then(
+    return import("./ContextualToolbars-BDEt9ND0.js").then((i) => i.s).then(
       (i) => {
         d || u(() => i.ContextualToolbars);
       },
       (i) => {
         d || r.reportRuntimeError(
-          new F(
+          new V(
             "E_CHUNK_LOAD_FAILED",
             `the editor's controls chunk failed to load (${i instanceof Error ? i.message : String(i)}). This is a network/CDN failure, not a composition mistake — retry, or check the deployment serves the @snowcone-app/canvas lazy chunks.`,
             { cause: i instanceof Error ? i.message : String(i), docSlug: "embed-mode" }
@@ -584,7 +599,7 @@ function at({
     }
   ) : null;
 }
-function ct() {
+function lt() {
   const e = q("useProductSelection").commerce, n = B(e.subscribe, e.getVersion, e.getVersion), r = j((a, c) => e.select(a, c), [e]), o = j((a) => e.setQuantity(a), [e]);
   return O(
     () => ({
@@ -603,37 +618,37 @@ function ct() {
     [e, r, o, n]
   );
 }
-const V = {
+const _ = {
   /** The one provider boundary — session, design, live state, error boundary. */
-  Root: ue,
+  Root: me,
   /** The editable artboard (the ONE lazy renderer boundary — D9). */
-  Canvas: Ze,
+  Canvas: et,
   /** Live product mockup. ×N under one Root is valid. */
-  Preview: fe,
+  Preview: pe,
   /** Form input bound to a design text layer by typed token (T1). */
-  TextField: rt,
+  TextField: ot,
   /** Smart commerce part: completeness + payload assembly; submit = host callback. */
-  Buy: it,
+  Buy: at,
   /** Layer list. The one editor part that works canvas-free (ADR-0085 §4). */
-  Layers: Ie,
+  Layers: Re,
   /** Morphing contextual zone — ONE coarse part; placement docked|floating (§5). */
-  Controls: at,
+  Controls: ct,
   /** Undo/redo controls. Requires Editor.Canvas. */
-  History: ke,
+  History: Ie,
   /** The one ⋯ overflow menu. Requires Editor.Canvas. */
   Menu: Se,
   /** The ⊕ add-element menu. Requires Editor.Canvas. */
-  Add: Ee
+  Add: ke
 };
-function Rt(t) {
-  return /* @__PURE__ */ s(ue, { ...t, __validation: "warn" });
+function Ct(t) {
+  return /* @__PURE__ */ s(me, { ...t, __validation: "warn" });
 }
-const Ct = se(
+const Ot = ie(
   function(e, n) {
-    const { children: r, className: o, style: a, maxHeight: c, ...u } = e, [d, i] = I(null);
-    return A(() => {
+    const { children: r, className: o, style: a, maxHeight: c, ...u } = e, [d, i] = C(null);
+    return D(() => {
       let l = !1;
-      return me().then(
+      return fe().then(
         (m) => {
           l || i(() => m);
         },
@@ -653,14 +668,14 @@ const Ct = se(
     );
   }
 );
-function Ot(t) {
-  return /* @__PURE__ */ s(fe, { ...t });
+function Nt(t) {
+  return /* @__PURE__ */ s(pe, { ...t });
 }
-function Nt() {
+function Tt() {
   const { mockups: t, isRendering: e, error: n } = G();
   return { mockups: t, isRendering: e, error: n };
 }
-function lt(t) {
+function dt(t) {
   return new Intl.NumberFormat("en-US", {
     style: "currency",
     currency: "USD",
@@ -668,7 +683,7 @@ function lt(t) {
     maximumFractionDigits: t % 100 === 0 ? 0 : 2
   }).format(t / 100);
 }
-const dt = {
+const ut = {
   display: "inline-flex",
   alignItems: "center",
   justifyContent: "center",
@@ -683,7 +698,7 @@ const dt = {
   fontSize: 16,
   lineHeight: 1,
   cursor: "pointer"
-}, ut = {
+}, mt = {
   display: "flex",
   alignItems: "center",
   gap: 10,
@@ -699,7 +714,7 @@ const dt = {
   textAlign: "left",
   cursor: "pointer"
 };
-function Y({
+function X({
   label: t,
   onSelect: e
 }) {
@@ -709,13 +724,13 @@ function Y({
       type: "button",
       role: "menuitem",
       "data-sc-part": "snowcone-editor-menu-item",
-      style: ut,
+      style: mt,
       onClick: e,
       children: t
     }
   );
 }
-function mt({
+function ft({
   fullscreen: t,
   onToggleFullscreen: e,
   viewCount: n,
@@ -723,8 +738,8 @@ function mt({
   onSelectView: o,
   onExport: a
 }) {
-  const [c, u] = I(!1), d = () => u(!1);
-  return /* @__PURE__ */ k("div", { style: { position: "relative" }, children: [
+  const [c, u] = C(!1), d = () => u(!1);
+  return /* @__PURE__ */ R("div", { style: { position: "relative" }, children: [
     /* @__PURE__ */ s(
       "button",
       {
@@ -733,12 +748,12 @@ function mt({
         "aria-haspopup": "menu",
         "aria-expanded": c,
         "data-sc-part": "snowcone-editor-menu",
-        style: dt,
+        style: ut,
         onClick: () => u((i) => !i),
         children: "⋮"
       }
     ),
-    c ? /* @__PURE__ */ k(oe, { children: [
+    c ? /* @__PURE__ */ R(se, { children: [
       /* @__PURE__ */ s(
         "div",
         {
@@ -747,7 +762,7 @@ function mt({
           "aria-hidden": "true"
         }
       ),
-      /* @__PURE__ */ k(
+      /* @__PURE__ */ R(
         "div",
         {
           role: "menu",
@@ -767,7 +782,7 @@ function mt({
           },
           children: [
             /* @__PURE__ */ s(
-              Y,
+              X,
               {
                 label: t ? "Exit fullscreen" : "Fullscreen",
                 onSelect: () => {
@@ -776,7 +791,7 @@ function mt({
               }
             ),
             n > 1 ? Array.from({ length: n }, (i, l) => /* @__PURE__ */ s(
-              Y,
+              X,
               {
                 label: `View ${l + 1}${l === r ? " ✓" : ""}`,
                 onSelect: () => {
@@ -786,7 +801,7 @@ function mt({
               l
             )) : null,
             /* @__PURE__ */ s(
-              Y,
+              X,
               {
                 label: "Export PNG",
                 onSelect: () => {
@@ -800,17 +815,17 @@ function mt({
     ] }) : null
   ] });
 }
-function ft() {
-  const { flatLayers: t, selectLayer: e, generateAllPreviews: n } = Re({ previewSize: 96 });
-  return A(() => {
+function pt() {
+  const { flatLayers: t, selectLayer: e, generateAllPreviews: n } = Ce({ previewSize: 96 });
+  return D(() => {
     t.length > 0 && n();
-  }, [t.length, n]), /* @__PURE__ */ k(
+  }, [t.length, n]), /* @__PURE__ */ R(
     "div",
     {
       "data-sc-part": "snowcone-editor-idle-dock",
       style: { display: "flex", alignItems: "center", justifyContent: "center", gap: 8, minHeight: 44 },
       children: [
-        /* @__PURE__ */ s(V.Add, {}),
+        /* @__PURE__ */ s(_.Add, {}),
         t.length > 0 ? /* @__PURE__ */ s("div", { style: { width: 1, height: 28, background: "rgba(0,0,0,0.1)", flexShrink: 0 }, "aria-hidden": "true" }) : null,
         t.map((r) => /* @__PURE__ */ s(
           "button",
@@ -857,13 +872,13 @@ function ft() {
     }
   );
 }
-function pt({
+function gt({
   onAddToCart: t,
   defaultQuantity: e
 }) {
-  const { price: n, complete: r } = ct();
-  return /* @__PURE__ */ k(
-    V.Buy,
+  const { price: n, complete: r } = lt();
+  return /* @__PURE__ */ R(
+    _.Buy,
     {
       onAddToCart: t,
       ...typeof e == "number" ? { defaultQuantity: e } : {},
@@ -886,12 +901,12 @@ function pt({
       },
       children: [
         "Add to cart",
-        typeof n == "number" ? ` · ${lt(n)}` : ""
+        typeof n == "number" ? ` · ${dt(n)}` : ""
       ]
     }
   );
 }
-function gt({
+function ht({
   title: t,
   height: e,
   mockupIds: n,
@@ -900,15 +915,15 @@ function gt({
   className: a,
   style: c
 }) {
-  const [u, d] = I(!1), [i, l] = I(0), [m, f] = I(!1), h = C(null), p = Me(), w = n[Math.min(i, n.length - 1)], E = j(async () => {
-    var _;
-    const R = await ((_ = h.current) == null ? void 0 : _.exportArtboards({ format: "dataUrl" }));
-    if (!R) return;
-    const [D, x] = Object.entries(R)[0] ?? [];
+  const [u, d] = C(!1), [i, l] = C(0), [m, f] = C(!1), w = N(null), g = ze(), v = n[Math.min(i, n.length - 1)], E = j(async () => {
+    var A;
+    const k = await ((A = w.current) == null ? void 0 : A.exportArtboards({ format: "dataUrl" }));
+    if (!k) return;
+    const [L, x] = Object.entries(k)[0] ?? [];
     if (typeof x != "string") return;
-    const $ = document.createElement("a");
-    $.href = x, $.download = `${D ?? "design"}.png`, $.click();
-  }, []), b = {
+    const S = document.createElement("a");
+    S.href = x, S.download = `${L ?? "design"}.png`, S.click();
+  }, []), T = {
     display: "flex",
     flexDirection: "column",
     overflow: "hidden",
@@ -929,7 +944,7 @@ function gt({
       boxShadow: "0 1px 3px rgba(0,0,0,0.08)"
     },
     ...c
-  }, T = {
+  }, h = {
     position: "absolute",
     top: 8,
     right: 12,
@@ -944,15 +959,15 @@ function gt({
     cursor: "pointer",
     zIndex: 2
   };
-  return /* @__PURE__ */ k(
+  return /* @__PURE__ */ R(
     "div",
     {
       "data-sc-part": "snowcone-editor",
       "data-sc-fullscreen": u ? "true" : void 0,
       className: a,
-      style: b,
+      style: T,
       children: [
-        /* @__PURE__ */ k(
+        /* @__PURE__ */ R(
           "div",
           {
             "data-sc-part": "snowcone-editor-header",
@@ -965,34 +980,34 @@ function gt({
             },
             children: [
               /* @__PURE__ */ s("span", { style: { fontSize: 14, fontWeight: 700, marginRight: "auto" }, children: t }),
-              /* @__PURE__ */ s(V.History, {}),
+              /* @__PURE__ */ s(_.History, {}),
               /* @__PURE__ */ s(
-                mt,
+                ft,
                 {
                   fullscreen: u,
-                  onToggleFullscreen: () => d((R) => !R),
+                  onToggleFullscreen: () => d((k) => !k),
                   viewCount: n.length,
                   viewIndex: i,
                   onSelectView: l,
                   onExport: () => void E()
                 }
               ),
-              /* @__PURE__ */ s(pt, { onAddToCart: r, defaultQuantity: o })
+              /* @__PURE__ */ s(gt, { onAddToCart: r, defaultQuantity: o })
             ]
           }
         ),
-        /* @__PURE__ */ k(
+        /* @__PURE__ */ R(
           "div",
           {
             "data-sc-part": "snowcone-editor-stage",
             style: { position: "relative", flex: 1, minHeight: 0, padding: "4px 12px" },
             children: [
-              /* @__PURE__ */ s(V.Canvas, { ref: h, style: { height: "100%" } }),
+              /* @__PURE__ */ s(_.Canvas, { ref: w, style: { height: "100%" } }),
               m ? (
                 // Swapped: the mockup IS the stage; the corner chip returns to the
                 // artwork. The canvas stays mounted underneath (no document
                 // teardown), just covered.
-                /* @__PURE__ */ k(
+                /* @__PURE__ */ R(
                   "div",
                   {
                     "data-sc-part": "snowcone-editor-swap-stage",
@@ -1008,9 +1023,9 @@ function gt({
                     },
                     children: [
                       /* @__PURE__ */ s(
-                        V.Preview,
+                        _.Preview,
                         {
-                          mockupId: w,
+                          mockupId: v,
                           alt: "Product mockup",
                           fallback: /* @__PURE__ */ s("div", { "aria-busy": "true", children: "Rendering…" }),
                           style: { maxWidth: "100%", maxHeight: "100%", objectFit: "contain", borderRadius: 12 }
@@ -1024,7 +1039,7 @@ function gt({
                           "data-sc-part": "snowcone-editor-swap-back",
                           onClick: () => f(!1),
                           style: {
-                            ...T,
+                            ...h,
                             display: "flex",
                             alignItems: "center",
                             justifyContent: "center",
@@ -1046,11 +1061,11 @@ function gt({
                   "aria-label": "Show product mockup",
                   "data-sc-part": "snowcone-editor-pip",
                   onClick: () => f(!0),
-                  style: T,
+                  style: h,
                   children: /* @__PURE__ */ s(
-                    V.Preview,
+                    _.Preview,
                     {
-                      mockupId: w,
+                      mockupId: v,
                       alt: "Product mockup preview",
                       fallback: /* @__PURE__ */ s("span", { style: { fontSize: 10, opacity: 0.5 }, "aria-busy": "true", children: "mockup…" }),
                       style: { width: "100%", height: "100%", objectFit: "cover", display: "block" }
@@ -1061,15 +1076,15 @@ function gt({
             ]
           }
         ),
-        /* @__PURE__ */ k(
+        /* @__PURE__ */ R(
           "div",
           {
             "data-sc-part": "snowcone-editor-zone",
-            "data-sc-zone-state": p ? "selected" : "idle",
+            "data-sc-zone-state": g ? "selected" : "idle",
             style: { flexShrink: 0, padding: "4px 16px 14px" },
             children: [
-              /* @__PURE__ */ s("div", { style: { display: p ? void 0 : "none" }, children: /* @__PURE__ */ s(V.Controls, { placement: "docked" }) }),
-              p ? null : /* @__PURE__ */ s(ft, {})
+              /* @__PURE__ */ s("div", { style: { display: g ? void 0 : "none" }, children: /* @__PURE__ */ s(_.Controls, { placement: "docked" }) }),
+              g ? null : /* @__PURE__ */ s(pt, {})
             ]
           }
         )
@@ -1077,7 +1092,7 @@ function gt({
     }
   );
 }
-function Tt(t) {
+function $t(t) {
   const {
     onAddToCart: e,
     defaultQuantity: n,
@@ -1087,8 +1102,8 @@ function Tt(t) {
     style: c,
     ...u
   } = t;
-  return /* @__PURE__ */ s(V.Root, { ...u, children: /* @__PURE__ */ s(
-    gt,
+  return /* @__PURE__ */ s(_.Root, { ...u, children: /* @__PURE__ */ s(
+    ht,
     {
       title: r,
       height: o,
@@ -1100,18 +1115,18 @@ function Tt(t) {
     }
   ) });
 }
-Ce();
+Oe();
 export {
-  V as E,
-  Ct as R,
-  Tt as S,
-  Rt as a,
-  Ot as b,
-  ce as c,
-  ct as d,
-  Nt as e,
-  lt as f,
+  _ as E,
+  Ot as R,
+  $t as S,
+  Ct as a,
+  Nt as b,
+  le as c,
+  lt as d,
+  Tt as e,
+  dt as f,
   G as u,
-  Ke as v
+  We as v
 };
-//# sourceMappingURL=embed-pM7ZkFuz.js.map
+//# sourceMappingURL=embed-QBZkgWDr.js.map