@snowcone-app/canvas 0.17.3 → 0.18.0

package/dist/embed--B8ot6Lj.js

@@ -1,746 +0,0 @@
-import { C as Ee, e as Re } from "./UnifiedFontService-Dsu5cwfT.js";
-import { y as x } from "./FontAnalyzer-CLv7_msL.js";
-import { jsx as f, jsxs as Q, Fragment as we } from "react/jsx-runtime";
-import { useContext as Z, createContext as ee, useRef as N, useState as O, useMemo as I, useEffect as $, useSyncExternalStore as L, Component as xe, forwardRef as te, useId as re, useLayoutEffect as ne, useCallback as se } from "react";
-import { assertVariantSelected as ie, RenderSession as Se, createCartDetail as Ie } from "@snowcone-app/sdk";
-import { g as R, i as Ce, h as ae, B as Te, E as Ne } from "./EditorContext-CGkfmbgo.js";
-import { u as Oe, p as ke } from "./usePieceGuideBundle-C1ipFnZd.js";
-import { r as oe } from "./editorErrors-BY4Pdg7a.js";
-import { l as X, i as _e, s as le } from "./template-fields-Z9x13sjM.js";
-import "./CanvasStateV1-BG2hEc3-.js";
-const de = ee(void 0);
-function A() {
-  const t = Z(de);
-  if (!t)
-    throw new Error(
-      "useRealtimeMockups / <RealtimeCanvas> / <RealtimeMockup> must be rendered inside <RealtimeEmbed>. Wrap them: <RealtimeEmbed shop=… product=… design=… grantUrl=…>…</RealtimeEmbed>"
-    );
-  return t;
-}
-const $e = "[RealtimeEmbed]";
-function Be(t) {
-  var n, s;
-  if ((n = t == null ? void 0 : t.requiredPlacements) != null && n.length)
-    return t.requiredPlacements.filter((a) => !a.autoFilledByVariant).map((a) => a.label);
-  const e = new Set(
-    (((s = t == null ? void 0 : t.options) == null ? void 0 : s.combinations) ?? []).map((a) => a.variantId).filter((a) => typeof a == "string" && a !== "")
-  );
-  return !!(t != null && t.variantId) || e.size > 1 ? [] : (t == null ? void 0 : t.placements) ?? [];
-}
-function ue({ shop: t, product: e, design: r, hasGrant: n }) {
-  var c, d;
-  const s = [];
-  if (t || s.push({
-    severity: "error",
-    issue: "missing-shop",
-    message: "`shop` is required (your publishable shop id)."
-  }), n || s.push({
-    severity: "error",
-    issue: "missing-grant",
-    message: "no grant source — pass `grantUrl` (a proxy to mintRealtimeGrant) or `grant`. Without it the session can never authorize and no mockup renders."
-  }), (c = e == null ? void 0 : e.mockupIds) != null && c.length || s.push({
-    severity: "error",
-    issue: "empty-mockup-ids",
-    message: 'product.mockupIds is empty — pass the catalog scene codes (product.mockups[].id) you want rendered, e.g. ["FV1qjO"].'
-  }), e != null && e.options)
-    try {
-      ie(e);
-    } catch (m) {
-      s.push({
-        severity: "error",
-        issue: "variant-required",
-        message: m instanceof Error ? m.message : String(m)
-      });
-    }
-  const a = r.toJSON(), l = a.activeArtboard, i = Be(e);
-  i.length > 1 && s.push({
-    severity: "error",
-    issue: "multi-placement",
-    message: `product ${e.productId} requires placements [${i.join(", ")}] but this embed renders a single placement ("${l}"). The render will time out waiting for the others. This product needs the eject path — see https://developers.snowcone.app/embed-mode#eject.`
-  }), (d = e == null ? void 0 : e.placements) != null && d.length && !e.placements.includes(l) && s.push({
-    severity: "error",
-    issue: "placement-mismatch",
-    message: `the design's placement "${l}" 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 o = a.elements.map((m) => m.name).filter((m) => !!m), u = o.filter((m, y) => o.indexOf(m) !== y);
-  return u.length && s.push({
-    severity: "warn",
-    issue: "duplicate-layer-names",
-    message: `duplicate layer name(s) [${[...new Set(u)].join(", ")}] — useTextBinding(name) / useImageBinding(name) bind to the FIRST match, so a duplicate name makes a control edit the wrong layer. Keep names unique.`
-  }), s;
-}
-function Fe(t) {
-  for (const e of ue(t))
-    (e.severity === "error" && e.issue !== "placement-mismatch" ? console.error : console.warn)(`${$e} ${e.message}`);
-}
-function j(t) {
-  return t.text;
-}
-function _(t) {
-  return t.name;
-}
-class De {
-  constructor(e) {
-    this.listeners = /* @__PURE__ */ new Set(), this.getState = () => this.state, this.subscribe = (n) => (this.listeners.add(n), () => this.listeners.delete(n)), this.state = e;
-    const r = /* @__PURE__ */ new Map();
-    for (const n of e.elements) {
-      const s = _(n), a = j(n);
-      s && typeof a == "string" && r.set(s, a);
-    }
-    this.seedTextByName = r;
-  }
-  /** Replace the whole state (the canvas `onChange` path). */
-  setState(e) {
-    this.state = e, this.emit();
-  }
-  /** The seed value of a named text layer (for completeness rule C3). */
-  seedTextOf(e) {
-    return this.seedTextByName.get(e);
-  }
-  /** Current text of a named text layer, or undefined when absent. */
-  textOf(e) {
-    const r = this.state.elements.find((n) => _(n) === e);
-    return r ? j(r) : void 0;
-  }
-  /** Kind of the named layer in the CURRENT state ('text' | 'image' | null
-   *  for unbindable), or undefined when no layer has the name. */
-  layerKindOf(e) {
-    const r = this.state.elements.find((n) => _(n) === e);
-    return r ? X(r) : void 0;
-  }
-  /** Names of bindable layers in the current state, for error messages. */
-  bindableLayerNames() {
-    return this.state.elements.filter((e) => X(e) !== null).map(_).filter((e) => !!e);
-  }
-  /**
-   * Direct write path for `Editor.TextField` when NO canvas is mounted (with
-   * one, writes route through the editor command path and arrive back here
-   * via `setState`). Immutable update; last-write-wins.
-   */
-  updateTextLayer(e, r) {
-    let n = !1;
-    const s = this.state.elements.map((a) => _(a) !== e ? a : (n = !0, { ...a, text: r }));
-    if (!n)
-      throw new R(
-        "E_LAYER_NOT_FOUND",
-        `no layer "${e}" in the current design state. Bindable layers: ${JSON.stringify(this.bindableLayerNames())}.`,
-        { layerName: e, validNames: this.bindableLayerNames(), docSlug: "embed-mode" }
-      );
-    this.setState({ ...this.state, elements: s });
-  }
-  /** ≥1 element with visible content (completeness rule C4): non-empty text,
-   *  an image with a URL, or a shape. Hidden elements don't count. */
-  hasRenderableElement() {
-    return this.state.elements.some((e) => {
-      if (e.visible === !1) return !1;
-      const r = e.transformType;
-      if (r === "image") return !!e.imageUrl;
-      if (r === "shape" || r === "group" || r === "path") return !0;
-      const n = j(e);
-      return typeof n == "string" && n.trim().length > 0;
-    });
-  }
-  emit() {
-    for (const e of [...this.listeners]) e();
-  }
-}
-class Ue {
-  constructor() {
-    this.canvasIds = /* @__PURE__ */ new Set(), this.requirements = /* @__PURE__ */ new Map(), this.textFields = /* @__PURE__ */ new Map(), this.bridge = null, this.listeners = /* @__PURE__ */ new Set(), this.version = 0, this.getVersion = () => this.version, this.subscribe = (e) => (this.listeners.add(e), () => this.listeners.delete(e));
-  }
-  registerCanvas(e) {
-    return this.canvasIds.add(e), this.bump(), () => {
-      this.canvasIds.delete(e), this.bump();
-    };
-  }
-  hasCanvas() {
-    return this.canvasIds.size > 0;
-  }
-  /** Declare that a part is meaningless without a mounted Canvas (ADR-0085 §4
-   *  table). Validated by Root once per commit. */
-  requireCanvas(e, r) {
-    return this.requirements.set(e, r), this.bump(), () => {
-      this.requirements.delete(e), this.bump();
-    };
-  }
-  /** Run by Root during RENDER, re-triggered by every registry change — by
-   *  then the whole commit's registrations are in, so there is no race
-   *  against the lazy chunk (ADR-0085 §4). Throws land in Root's boundary. */
-  validate() {
-    if (this.canvasIds.size > 1)
-      throw new R(
-        "E_DUPLICATE_CANVAS",
-        "two <Editor.Canvas> parts are mounted under one <Editor.Root>. A Root owns exactly one editable artboard — remove one Canvas, or mount a second <Editor.Root> for a second editor. (Multiple <Editor.Preview> parts ARE valid.)",
-        { docSlug: "embed-mode" }
-      );
-    if (this.requirements.size > 0 && !this.hasCanvas()) {
-      const e = [...new Set(this.requirements.values())];
-      throw new R(
-        "E_REQUIRES_CANVAS",
-        `${e.join(", ")} require${e.length === 1 ? "s" : ""} an <Editor.Canvas> under the same <Editor.Root> — they operate on the editable artboard (selection, editor commands). Mount <Editor.Canvas/>, or remove the part. Canvas-free parts: Editor.Preview, Editor.Buy, Editor.TextField, Editor.Layers.`,
-        { parts: e, docSlug: "embed-mode" }
-      );
-    }
-  }
-  registerTextField(e, r) {
-    return this.textFields.set(e, r), this.bump(), () => {
-      this.textFields.delete(e), this.bump();
-    };
-  }
-  /** Mounted TextField registrations — Buy's required-layer list (C2/C3).
-   *  Unmounted (incl. conditionally hidden) fields are absent by construction. */
-  getTextFields() {
-    return [...this.textFields.values()];
-  }
-  /** Bound-layer lookup for the mutation guard (ADR-0085 §3 /
-   *  `E_BOUND_LAYER_MUTATION`): a layer is bound while ANY mounted
-   *  `Editor.TextField` carries its name. Satisfies `BoundLayerGuard`
-   *  structurally (subscribe/getVersion above). */
-  getBoundLayer(e) {
-    for (const r of this.textFields.values())
-      if (r.name === e) return { part: "Editor.TextField" };
-    return null;
-  }
-  registerCanvasBridge(e) {
-    return this.bridge = e, this.bump(), () => {
-      this.bridge === e && (this.bridge = null), this.bump();
-    };
-  }
-  getCanvasBridge() {
-    return this.bridge;
-  }
-  bump() {
-    this.version++;
-    for (const e of [...this.listeners]) e();
-  }
-}
-const ce = ee(null);
-function K(t) {
-  const e = Z(ce);
-  if (!e)
-    throw new R(
-      "E_OUTSIDE_ROOT",
-      `<${t}> must be rendered inside <Editor.Root>. Wrap it: <Editor.Root shop={…} product={…} design={…} grantUrl={…}><${t}/></Editor.Root>`,
-      { part: t, docSlug: "embed-mode" }
-    );
-  return e;
-}
-function Le(t) {
-  return {
-    reportInvariant(e) {
-      if (Ce()) throw e;
-      t(e);
-    },
-    reportRuntimeError(e) {
-      oe(e), t(e);
-    }
-  };
-}
-const me = 8e3;
-function Ae(t) {
-  return `[RealtimeEmbed] No mockup after ${Math.round(me / 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 fe({ error: t, onRetry: e }) {
-  const r = ae(t) ? t.code : "EDITOR_ERROR";
-  return /* @__PURE__ */ Q(
-    "div",
-    {
-      "data-sc-part": "error",
-      role: "alert",
-      style: {
-        padding: "16px",
-        borderRadius: "12px",
-        border: "1px solid var(--sc-color-destructive, #b91c1c)",
-        background: "var(--sc-color-surface, #fef2f2)",
-        color: "var(--sc-color-foreground, #7f1d1d)",
-        fontFamily: "ui-sans-serif, system-ui, sans-serif",
-        fontSize: "13px",
-        lineHeight: 1.5
-      },
-      children: [
-        /* @__PURE__ */ Q("p", { style: { margin: 0, fontWeight: 700 }, children: [
-          "Editor failed: ",
-          r
-        ] }),
-        /* @__PURE__ */ f("p", { style: { margin: "4px 0 0" }, children: t.message }),
-        e ? /* @__PURE__ */ f(
-          "button",
-          {
-            type: "button",
-            "data-sc-part": "error-retry",
-            onClick: e,
-            style: {
-              marginTop: "10px",
-              padding: "6px 14px",
-              borderRadius: "9999px",
-              border: "1px solid currentColor",
-              background: "transparent",
-              color: "inherit",
-              font: "inherit",
-              fontWeight: 600,
-              cursor: "pointer"
-            },
-            children: "Retry"
-          }
-        ) : null
-      ]
-    }
-  );
-}
-class Me extends xe {
-  constructor() {
-    super(...arguments), this.state = { caught: null };
-  }
-  static getDerivedStateFromError(e) {
-    return { caught: e };
-  }
-  componentDidCatch(e) {
-    var r;
-    oe(e), typeof x < "u" && ((r = x.env) == null ? void 0 : r.NODE_ENV) !== "production" && console.error("[Editor.Root] contained a composition error:", e);
-  }
-  render() {
-    return this.state.caught ? /* @__PURE__ */ f(fe, { error: this.state.caught }) : this.props.children;
-  }
-}
-function Ve({ reportedError: t, onRetry: e, children: r }) {
-  if (t) {
-    const n = ae(t) && t.code === "E_CHUNK_LOAD_FAILED";
-    return /* @__PURE__ */ f(fe, { error: t, onRetry: n ? e : void 0 });
-  }
-  return /* @__PURE__ */ f(Me, { reportedError: null, onRetry: e, children: r });
-}
-function Pe(t) {
-  const {
-    shop: e,
-    product: r,
-    design: n,
-    throttleMs: s = 200,
-    onMockups: a,
-    onRenderError: l,
-    wsUrl: i,
-    services: o,
-    children: u,
-    internals: c,
-    __validation: d = "throw"
-  } = t, m = I(() => n.toJSON().activeArtboard, [n]), y = Oe(r.variantId ?? r.defaultGvid), g = I(() => {
-    if (!y) return null;
-    const h = n.toJSON().artboards[0];
-    return ke(y, h) ?? null;
-  }, [y, n]), b = N(a), p = N(l);
-  b.current = a, p.current = l;
-  const [S, q] = O([]), [C, T] = O(!0), [H, B] = O(null), M = !!("grantUrl" in t && t.grantUrl || "grant" in t && t.grant), V = qe(t), ye = "grantUrl" in V ? V.grantUrl : "getToken", W = `${r.productId}|${r.mockupIds.join(",")}|${r.variantId ?? ""}`, F = `${e}|${W}|${m}|${M}`;
-  I(() => {
-    var E;
-    if (d !== "throw") return;
-    const h = ue({ shop: e, product: r, design: n, hasGrant: M }), v = h.find((k) => k.severity === "error");
-    if (v)
-      throw new R("E_EMBED_CONFIG", v.message, {
-        issue: v.issue,
-        docSlug: "embed-mode"
-      });
-    for (const k of h)
-      typeof x < "u" && ((E = x.env) == null ? void 0 : E.NODE_ENV) !== "production" && console.warn(`[Editor.Root] ${k.message}`);
-  }, [F, d]);
-  const z = N(null);
-  $(() => {
-    var h;
-    if (d === "warn" && typeof x < "u" && ((h = x.env) == null ? void 0 : h.NODE_ENV) !== "production") {
-      if (z.current === F) return;
-      z.current = F, Fe({ shop: e, product: r, design: n, hasGrant: M });
-    }
-  }, [F, d]);
-  const D = I(
-    () => {
-      try {
-        return { session: new Se({ shop: e, product: r, wsUrl: i, ...V }) };
-      } catch (h) {
-        return { error: h instanceof Error ? h.message : String(h) };
-      }
-    },
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [e, W, m, i, ye]
-  ), w = "session" in D ? D.session : null, U = "error" in D ? D.error : null, P = I(() => (h, v = s) => {
-    w && (B(null), T(!0), w.renderState(m, h, v).catch((E) => {
-      var Y;
-      const k = E instanceof Error ? E.message : String(E);
-      B(k), T(!1), (Y = p.current) == null || Y.call(p, k);
-    }));
-  }, [w, m, s]);
-  $(() => {
-    var h;
-    if (U) {
-      B(U), T(!1), (h = p.current) == null || h.call(p, U);
-      return;
-    }
-    if (w)
-      return w.onMockups((v) => {
-        var E;
-        q(v), T(!1), (E = b.current) == null || E.call(b, v);
-      }), w.onError((v) => {
-        var E;
-        B(v), T(!1), (E = p.current) == null || E.call(p, v);
-      }), P(n.toServerRequest()), () => w.close();
-  }, [w, U]), $(() => {
-    var v;
-    if (!C || typeof x > "u" || ((v = x.env) == null ? void 0 : v.NODE_ENV) === "production") return;
-    const h = setTimeout(() => console.warn(Ae(m)), me);
-    return () => clearTimeout(h);
-  }, [C, m]);
-  const ve = I(
-    () => ({
-      session: w,
-      design: n,
-      placement: m,
-      product: r,
-      mockups: S,
-      isRendering: C,
-      error: H,
-      throttleMs: s,
-      pieceGuides: g,
-      pushRender: P,
-      stateStore: c.store
-    }),
-    [w, n, m, r, S, C, H, s, g, P, c.store]
-  ), be = L(
-    c.registry.subscribe,
-    c.registry.getVersion,
-    c.registry.getVersion
-  );
-  I(() => c.registry.validate(), [c.registry, be]);
-  const J = /* @__PURE__ */ f(ce.Provider, { value: c, children: /* @__PURE__ */ f(de.Provider, { value: ve, children: /* @__PURE__ */ f(Te.Provider, { value: c.registry, children: /* @__PURE__ */ f(Ne, { children: u }) }) }) });
-  return o ? /* @__PURE__ */ f(Ee, { services: o, children: J }) : J;
-}
-function he(t) {
-  const { design: e } = t, r = N(null), [n, s] = O(null);
-  (r.current === null || r.current.design !== e) && (r.current = {
-    design: e,
-    internals: {
-      store: new De(e.toJSON()),
-      registry: new Ue()
-    }
-  });
-  const a = I(
-    () => ({
-      ...r.current.internals,
-      ...Le(s)
-    }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [r.current.internals]
-  );
-  return (
-    // `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__ */ f("div", { className: "sc-root", style: { display: "contents" }, "data-sc-part": "root", children: /* @__PURE__ */ f(Ve, { reportedError: n, onRetry: () => s(null), children: /* @__PURE__ */ f(Pe, { ...t, internals: a }) }) })
-  );
-}
-let je = () => import("./EditorCanvasImpl-DQxqdgpq.js").then((t) => t.EditorCanvasImpl);
-function ge() {
-  return je();
-}
-const Ge = te(function({ children: e, maxHeight: r, className: n, style: s }, a) {
-  const l = K("Editor.Canvas"), i = re();
-  ne(() => l.registry.registerCanvas(i), [l.registry, i]);
-  const [o, u] = O(null);
-  return $(() => {
-    let c = !1;
-    return ge().then(
-      (d) => {
-        c || u(() => d);
-      },
-      (d) => {
-        c || l.reportRuntimeError(
-          new R(
-            "E_CHUNK_LOAD_FAILED",
-            `the editor's rendering chunk failed to load (${d instanceof Error ? d.message : String(d)}). This is a network/CDN failure, not a composition mistake — retry, or check the deployment serves the @snowcone-app/canvas lazy chunks.`,
-            { cause: d instanceof Error ? d.message : String(d), docSlug: "embed-mode" }
-          )
-        );
-      }
-    ), () => {
-      c = !0;
-    };
-  }, [l]), o ? /* @__PURE__ */ f(o, { ref: a, kit: "embed-only", partAttr: "canvas", maxHeight: r, className: n, style: s, children: e }) : /* @__PURE__ */ f(
-    "div",
-    {
-      "data-sc-part": "canvas",
-      "data-sc-state": "loading",
-      className: n,
-      style: { minHeight: r ?? 200, ...s },
-      "aria-busy": "true"
-    }
-  );
-}), Ke = 1.2, G = [1200, 1400, 1600, 1800, 2e3, 2500, 3e3, 4e3];
-function He(t) {
-  for (const e of G)
-    if (e >= t) return e;
-  return G[G.length - 1];
-}
-function We(t, e) {
-  if (!(t > 0) || !(e > 0) || e <= t * Ke) return null;
-  const r = He(e);
-  return `[RealtimeMockup] mockup rendered at ${t}px but displayed at ~${e} device px — the preview will look soft. Pass \`product.width\` (e.g. ${r}) on the embed for a crisp preview.`;
-}
-function pe({
-  mockupId: t,
-  fallback: e = null,
-  alt: r = "Live product mockup",
-  className: n,
-  style: s
-}) {
-  const { mockups: a } = A(), l = N(/* @__PURE__ */ new Set()), i = t ? a.find((u) => u.mockupId === t && u.imageUrl) : a.find((u) => u.imageUrl);
-  if (!(i != null && i.imageUrl))
-    return /* @__PURE__ */ f(we, { children: e });
-  const o = (u) => {
-    var g;
-    if (typeof x > "u" || ((g = x.env) == null ? void 0 : g.NODE_ENV) === "production" || typeof window > "u" || l.current.has(i.mockupId)) return;
-    const c = u.currentTarget, d = c.getBoundingClientRect().width;
-    if (d <= 0) return;
-    const m = Math.round(d * (window.devicePixelRatio || 1)), y = We(c.naturalWidth, m);
-    y && (l.current.add(i.mockupId), console.warn(y));
-  };
-  return (
-    // eslint-disable-next-line @next/next/no-img-element
-    /* @__PURE__ */ f(
-      "img",
-      {
-        "data-sc-part": "preview",
-        src: i.imageUrl,
-        alt: r,
-        className: n,
-        style: s,
-        onLoad: o
-      }
-    )
-  );
-}
-function ze(t) {
-  const { layer: e, optional: r = !1, placeholder: n, className: s, style: a } = t, l = K("Editor.TextField"), { pushRender: i, throttleMs: o, stateStore: u } = A(), c = re(), d = N(null);
-  if (!_e(e))
-    throw new R(
-      "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 (d.current !== e.name) {
-    const g = u.layerKindOf(e.name);
-    if (g === void 0)
-      throw new R(
-        "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(u.bindableLayerNames())}.`,
-        { layerName: e.name, validNames: u.bindableLayerNames(), docSlug: "embed-mode" }
-      );
-    if (g !== "text")
-      throw new R(
-        "E_LAYER_WRONG_KIND",
-        `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" }
-      );
-    d.current = e.name;
-  }
-  ne(() => l.registry.registerTextField(c, { name: e.name, optional: r }), [l.registry, c, e.name, r]);
-  const m = L(
-    u.subscribe,
-    () => u.textOf(e.name) ?? "",
-    () => u.textOf(e.name) ?? ""
-  ), y = se(
-    (g) => {
-      const b = g.target.value, p = l.registry.getCanvasBridge();
-      if (p) {
-        p.setTextByName(e.name, b) || l.reportInvariant(
-          new R(
-            "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" }
-          )
-        );
-        return;
-      }
-      u.updateTextLayer(e.name, b), i(le(u.getState()), o);
-    },
-    [l, e.name, u, i, o]
-  );
-  return /* @__PURE__ */ f(
-    "input",
-    {
-      "data-sc-part": "textfield",
-      "data-sc-layer": e.name,
-      type: "text",
-      value: m,
-      onChange: y,
-      placeholder: n,
-      "aria-label": t["aria-label"] ?? e.name,
-      className: s,
-      style: a
-    }
-  );
-}
-function Je(t) {
-  const e = [];
-  if (t.product.options)
-    try {
-      ie(t.product);
-    } catch {
-      e.push("variant");
-    }
-  for (const r of t.textFields) {
-    if (r.optional) continue;
-    const n = (t.textOf(r.name) ?? "").trim();
-    if (n.length === 0) {
-      e.push(`layer:${r.name}`);
-      continue;
-    }
-    const s = (t.seedTextOf(r.name) ?? "").trim();
-    s.length > 0 && n === s && e.push(`layer-seed:${r.name}`);
-  }
-  return t.hasRenderableElement || e.push("empty-design"), (!Number.isInteger(t.quantity) || t.quantity < 1) && e.push("quantity"), e;
-}
-function Ye(t, e) {
-  const r = t.options, n = r == null ? void 0 : r.combinations;
-  if (!r || !(n != null && n.length)) return null;
-  const s = n.find((i) => i.variantId && i.variantId === t.variantId) ?? n[0];
-  if (!s) return null;
-  const a = {};
-  for (const [i, o] of Object.entries(s))
-    i === "variantId" || i === "price" || (typeof o == "string" ? a[i] = o : typeof o == "number" && (a[i] = String(o)));
-  const l = Object.fromEntries(
-    Object.keys(a).map((i) => [
-      i,
-      { key: i, affectsCombinations: !0, choices: [...new Set(n.map((o) => String(o[i] ?? "")))] }
-    ])
-  );
-  return Ie({
-    productId: t.productId,
-    quantity: e,
-    selection: a,
-    combinations: n,
-    attributes: l
-  });
-}
-function Qe(t) {
-  const { onAddToCart: e, quantity: r = 1, children: n, className: s, style: a } = t, l = K("Editor.Buy"), { product: i, stateStore: o } = A();
-  if (!(i != null && i.productId))
-    throw new R(
-      "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 u = L(o.subscribe, o.getState, o.getState), c = L(
-    l.registry.subscribe,
-    l.registry.getVersion,
-    l.registry.getVersion
-  ), d = I(
-    () => Je({
-      product: i,
-      quantity: r,
-      textFields: l.registry.getTextFields(),
-      textOf: (S) => o.textOf(S),
-      seedTextOf: (S) => o.seedTextOf(S),
-      hasRenderableElement: o.hasRenderableElement()
-    }),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [i, r, u, c]
-  ), m = d.length === 0, [y, g] = O(!1), b = N(!1), p = se(() => {
-    if (b.current || !m) return;
-    b.current = !0, g(!0);
-    const S = o.getState(), q = {
-      productId: i.productId,
-      ...i.variantId ? { variantId: i.variantId } : {},
-      quantity: r,
-      cartDetail: Ye(i, r),
-      designState: S,
-      serverRequest: le(S)
-    };
-    let C;
-    try {
-      C = e(q);
-    } catch (T) {
-      throw b.current = !1, g(!1), T;
-    }
-    Promise.resolve(C).finally(() => {
-      b.current = !1, g(!1);
-    });
-  }, [m, i, r, o, e]);
-  return /* @__PURE__ */ f(
-    "button",
-    {
-      type: "button",
-      "data-sc-part": "buy",
-      "data-sc-buy-state": y ? "busy" : m ? "ready" : "incomplete",
-      "data-sc-buy-missing": d.join(",") || void 0,
-      disabled: !m || y,
-      "aria-busy": y || void 0,
-      onClick: p,
-      className: s,
-      style: a,
-      children: n ?? "Add to cart"
-    }
-  );
-}
-const lt = {
-  /** The one provider boundary — session, design, live state, error boundary. */
-  Root: he,
-  /** The editable artboard (the ONE lazy renderer boundary — D9). */
-  Canvas: Ge,
-  /** Live product mockup. ×N under one Root is valid. */
-  Preview: pe,
-  /** Form input bound to a design text layer by typed token (T1). */
-  TextField: ze,
-  /** Smart commerce part: completeness + payload assembly; submit = host callback. */
-  Buy: Qe
-};
-function dt(t) {
-  return /* @__PURE__ */ f(he, { ...t, __validation: "warn" });
-}
-const ut = te(
-  function(e, r) {
-    const { children: n, className: s, style: a, maxHeight: l, ...i } = e, [o, u] = O(null);
-    return $(() => {
-      let c = !1;
-      return ge().then(
-        (d) => {
-          c || u(() => d);
-        },
-        (d) => {
-          console.error("[RealtimeCanvas] failed to load the rendering chunk:", d);
-        }
-      ), () => {
-        c = !0;
-      };
-    }, []), o ? /* @__PURE__ */ f(o, { ref: r, selfScope: !0, maxHeight: l, className: s, style: a, ...i, children: n }) : /* @__PURE__ */ f(
-      "div",
-      {
-        className: `sc-root${s ? ` ${s}` : ""}`,
-        style: { minHeight: l ?? 200, ...a },
-        "aria-busy": "true"
-      }
-    );
-  }
-);
-function ct(t) {
-  return /* @__PURE__ */ f(pe, { ...t });
-}
-function mt() {
-  const { mockups: t, isRendering: e, error: r } = A();
-  return { mockups: t, isRendering: e, error: r };
-}
-Re();
-export {
-  De as D,
-  ce as E,
-  ut as R,
-  lt as a,
-  dt as b,
-  ct as c,
-  ue as d,
-  mt as e,
-  A as u,
-  Fe as v
-};
-//# sourceMappingURL=embed--B8ot6Lj.js.map