@popcraft/kit 0.53.17 → 0.53.19

package/dist/chunks/{chunk-XKUI2K2V.js → chunk-X4JKF2JG.js}

@@ -577,9 +577,222 @@ var BUILTIN_THEMES = [popcraftDark, comicBase, comicYellow, comicBlack];
 var PICKABLE_BUILTIN_IDS = [popcraftDark.id, comicYellow.id, comicBlack.id];
 var INITIAL_THEME_ID = popcraftDark.id;
 
+// lib/theme/resolve.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+
+// lib/theme/tokens.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+var c = (group, def, description) => ({ type: "color", group, default: def, description });
+var TOKENS = {
+  // surface — an elevation ramp, darkest first. PopCraft Dark's defaults are the Dune IDE "Space Optimal" palette:
+  // a flat, near-black violet-grey (#0F0F13 chrome over a #131318 canvas) with lavender (#A78BFA) as the accent.
+  // The comic themes override every color they use, so these only shape PopCraft Dark.
+  "app.bg": c("surface", "#0F0F13", "Window background behind every panel."),
+  sunken: c("surface", "#0A0A0D", "Wells and focused inline fields sunk below a panel."),
+  base: c("surface", "#131318", "Recessed areas: previews, segmented-control tracks, dialog headers."),
+  window: c("surface", "#0F0F13", "Floating chips and cards over the canvas."),
+  overlay: c("surface", "#0F0F13", "Popovers, menus and dialogs."),
+  field: c("surface", "#16161C", "Compact inputs and context menus."),
+  "panel.bg": c("surface", "#0F0F13", "Side panels, top bar and toolbars."),
+  raised: c("surface", "#1B1B22", "Secondary buttons and list rows."),
+  "raised.hover": c("surface", "#262238", "Hovered secondary buttons and rows."),
+  control: c("surface", "#1B1B22", "Selects, steppers, and hovered icon buttons."),
+  "control.hover": c("surface", "#2A2A36", "Hovered controls, toggles and separators."),
+  border: c("surface", "rgba(228,227,238,0.075)", "Default hairline between regions."),
+  "border.strong": c("surface", "#322D48", "Borders around menus and cards."),
+  "border.faint": c("surface", "rgba(228,227,238,0.05)", "Barely-visible separators."),
+  "border.muted": c("surface", "#262238", "Secondary buttons and chips."),
+  "border.emph": c("surface", "rgba(228,227,238,0.15)", "Hovered chips and emphasised outlines."),
+  // text — brightest first
+  fg: c("text", "#E4E3EE", "Primary text and icons."),
+  "fg.bright": c("text", "#F4F3FA", "Headings in dialogs."),
+  "fg.soft": c("text", "rgba(228,227,238,0.85)", "Body text in panels and menus."),
+  "fg.dim": c("text", "rgba(228,227,238,0.74)", "Menu items and secondary body text."),
+  "fg.muted": c("text", "#A6A5B8", "Labels and inactive icons."),
+  "fg.subtle": c("text", "#85849A", "Hints, placeholders and section captions."),
+  "fg.disabled": c("text", "#585868", "Disabled controls and faint captions."),
+  "fg.faint": c("text", "#3E3E4C", "Decorative text that should barely show."),
+  "fg.onAccent": c("text", "#0A0A0D", "Text and icons on accent-colored surfaces."),
+  // accent
+  accent: c("accent", "#A78BFA", "Primary action color."),
+  "accent.hover": c("accent", "#C4A7FF", "Hovered primary action."),
+  focusRing: c("accent", "#A78BFA", "Keyboard focus outline."),
+  component: c("accent", "#7DD3FC", "Components and instances."),
+  ai: c("accent", "#F0ABFC", "AI features: sparkle icons and AI badges."),
+  prototype: c("accent", "#93C5FD", "Prototype connections and interactions in panels."),
+  danger: c("accent", "#FB7185", "Destructive actions and errors."),
+  warning: c("accent", "#FCD34D", "Warnings."),
+  success: c("accent", "#6EE7B7", "Success states."),
+  // shape
+  "radius.sm": { type: "length", group: "shape", default: "4px", description: "Small controls." },
+  "radius.md": { type: "length", group: "shape", default: "6px", description: "Inputs, buttons, menus and segmented controls." },
+  "radius.lg": { type: "length", group: "shape", default: "8px", description: "Menu surfaces and cards." },
+  "radius.xl": { type: "length", group: "shape", default: "10px", description: "Dialogs." },
+  "border.width": { type: "length", group: "shape", default: "1px", description: "Width of panel and input borders." },
+  "shadow.panel": { type: "shadow", group: "shape", default: "none", description: "Shadow under docked panels." },
+  "shadow.popover": { type: "shadow", group: "shape", default: "0 8px 24px rgba(0,0,0,0.6)", description: "Shadow under floating surfaces." },
+  "shadow.button": { type: "shadow", group: "shape", default: "none", description: "Shadow under buttons." },
+  // type
+  "font.ui": { type: "font", group: "type", default: "-apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI Variable', 'Segoe UI', Inter, system-ui, sans-serif", description: "UI text." },
+  "font.heading": { type: "font", group: "type", default: "-apple-system, BlinkMacSystemFont, 'SF Pro Text', 'Segoe UI Variable', 'Segoe UI', Inter, system-ui, sans-serif", description: "Section titles." },
+  "font.mono": { type: "font", group: "type", default: "'Monaspace Argon', 'Geist Mono Fallback'", description: "Code and numeric values." },
+  "letterSpacing.heading": { type: "length", group: "type", default: "0", description: "Tracking on section titles." },
+  "textTransform.heading": { type: "string", group: "type", default: "none", description: "none | uppercase for section titles." },
+  "heading.stroke": { type: "length", group: "type", default: "0px", description: "Outline width drawn around section titles (comic lettering); 0px for none." },
+  // decor
+  "panel.pattern": { type: "string", group: "decor", default: "none", description: "background-image layered on panels (e.g. halftone)." },
+  "tilt.popover": { type: "length", group: "decor", default: "0deg", description: "Rotation applied to popovers." },
+  "motion.enabled": { type: "string", group: "decor", default: "1", description: "1 to allow theme animations, 0 to turn them off (reduced-motion users never see them)." },
+  "decor.pop1": c("decor", "#A78BFA", "First flourish color: active-tool bursts, caption tags and halftone washes."),
+  "decor.pop1.fg": c("decor", "#0A0A0D", "Text and icons on `decor.pop1` surfaces (pressed tabs and buttons, hovered menu items, the active tool)."),
+  "decor.pop2": c("decor", "#F0ABFC", "Second flourish color: dialog bursts, focus pops and highlight bars."),
+  "decor.pop3": c("decor", "#7DD3FC", "Third flourish color: canvas-corner halftones and hover accents."),
+  // canvas — editor chrome drawn by WebGPU (lib/theme/chrome.ts). Must be hex or rgb()/rgba() colors.
+  "canvas.selection": c("canvas", "#A78BFA", "Selection outline, marquee, lasso, pen and vector-edit handles."),
+  "canvas.selection.component": c("canvas", "#7DD3FC", "Selection outline and labels on components."),
+  "canvas.handle.fill": c("canvas", "#ffffff", "Fill of resize, vector and gradient handles."),
+  "canvas.handle.stroke": c("canvas", "#A78BFA", "Outline of resize and corner-radius handles."),
+  "canvas.handle.strokeWidth": { type: "number", group: "canvas", default: "1", description: "Handle outline thickness, as a multiple of the default hairline (1\u20134)." },
+  "canvas.ruler.bg": c("canvas", "#0F0F13", "Ruler background."),
+  "canvas.ruler.tick": c("canvas", "#3E3E4C", "Ruler ticks."),
+  "canvas.ruler.label": c("canvas", "#A6A5B8", "Ruler numbers."),
+  "canvas.ruler.track": c("canvas", "#7DD3FC", "Selection span on the ruler, ruler guides and control points."),
+  "canvas.guide.hover": c("canvas", "#93C5FD", "Hovered ruler guide."),
+  "canvas.measure": c("canvas", "#FB7185", "Snap lines and distance measurements."),
+  "canvas.caret": c("canvas", "#C4A7FF", "Text caret, text selection, and auto-layout padding handles."),
+  "canvas.prototype": c("canvas", "#93C5FD", "Prototype connection arrows."),
+  "canvas.cursor.fill": c("canvas", "#0A0A0D", "Inside of the arrow and hand cursors."),
+  "canvas.cursor.outline": c("canvas", "#E4E3EE", "Cursor outlines, and the lines of the crosshair, text and resize cursors."),
+  "canvas.cursor.shadow": c("canvas", "rgba(0,0,0,0)", "Hard drop shadow under cursors; transparent for none. A visible shadow also makes cursor lines bolder."),
+  "canvas.backdrop.dots": c("canvas", "rgba(0,0,0,0)", "Halftone dots behind the canvas content, growing toward the bottom-right corner. The alpha is the strength; transparent turns them off."),
+  "canvas.backdrop.dotsAlt": c("canvas", "rgba(0,0,0,0)", "Second halftone layer, growing toward the top-left corner."),
+  "canvas.stage": c("canvas", "#0B0B0E", "Letterbox around the frame in Stage view (the active frame alone, fitted like a video)."),
+  "canvas.cursor.move": c("canvas", "#5EEAD4", "Pulsing crosshair shown while dragging selected layers."),
+  "canvas.cursor.resize": c("canvas", "#FB7185", "Throbbing glow shown while resizing."),
+  "canvas.cursor.rotate": c("canvas", "#F0ABFC", "Spinning dashed ring shown while rotating.")
+};
+var TOKEN_IDS = Object.keys(TOKENS);
+function tokenVar(id) {
+  return "--pc-" + id.replace(/\./g, "-").replace(/[A-Z]/g, (m) => "-" + m.toLowerCase());
+}
+
+// lib/theme/resolve.ts
+function resolveTheme(themeId, lookup, overrides = {}) {
+  const chain = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (let t = lookup(themeId); t && !seen.has(t.id); t = t.extends ? lookup(t.extends) : void 0) {
+    seen.add(t.id);
+    chain.unshift(t);
+  }
+  const out = {};
+  for (const id of TOKEN_IDS) out[id] = TOKENS[id].default;
+  const set = /* @__PURE__ */ new Set();
+  for (const t of chain) for (const [k, v] of Object.entries(t.tokens)) {
+    out[k] = v;
+    set.add(k);
+  }
+  for (const [k, v] of Object.entries(overrides)) {
+    out[k] = v;
+    set.add(k);
+  }
+  for (const [id, rule2] of DERIVED) {
+    if (set.has(id)) continue;
+    const from = rule2.from.filter((f) => set.has(f));
+    if (from.length === rule2.from.length) out[id] = rule2.make(out);
+  }
+  return out;
+}
+var mix = (a, b, pct) => `color-mix(in oklab, ${a} ${100 - pct}%, ${b} ${pct}%)`;
+var rule = (from, make) => ({ from, make });
+var DERIVED = [
+  ["accent.hover", rule(["accent"], (t) => mix(t.accent, t.fg, 15))],
+  ["focusRing", rule(["accent"], (t) => t["accent.hover"])],
+  ["fg.bright", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 3))],
+  ["fg.soft", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 8))],
+  ["fg.dim", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 14))],
+  ["fg.muted", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 32))],
+  ["fg.subtle", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 48))],
+  ["fg.disabled", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 62))],
+  ["fg.faint", rule(["fg"], (t) => mix(t.fg, t["panel.bg"], 72))],
+  ["field", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 2))],
+  ["control", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 8))],
+  ["control.hover", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 14))],
+  ["raised", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 5))],
+  ["raised.hover", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 11))],
+  ["overlay", rule(["panel.bg"], (t) => mix(t["panel.bg"], t["app.bg"], 25))],
+  ["window", rule(["panel.bg"], (t) => mix(t["panel.bg"], t["app.bg"], 40))],
+  ["base", rule(["panel.bg"], (t) => mix(t["panel.bg"], t["app.bg"], 55))],
+  ["sunken", rule(["panel.bg"], (t) => mix(t["panel.bg"], t["app.bg"], 75))],
+  ["border", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 10))],
+  ["border.strong", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 16))],
+  ["border.faint", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 6))],
+  ["border.muted", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 12))],
+  ["border.emph", rule(["panel.bg"], (t) => mix(t["panel.bg"], t.fg, 22))]
+];
+function collectFonts(themeId, lookup) {
+  const fonts = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (let t = lookup(themeId); t && !seen.has(t.id); t = t.extends ? lookup(t.extends) : void 0) {
+    seen.add(t.id);
+    if (t.fonts) fonts.unshift(...t.fonts);
+  }
+  return fonts;
+}
+function collectCss(themeId, lookup) {
+  const css = [];
+  const seen = /* @__PURE__ */ new Set();
+  for (let t = lookup(themeId); t && !seen.has(t.id); t = t.extends ? lookup(t.extends) : void 0) {
+    seen.add(t.id);
+    if (t.css) css.unshift(t.css);
+  }
+  return css;
+}
+function toCssVars(tokens) {
+  return TOKEN_IDS.map((id) => `${tokenVar(id)}: ${tokens[id]};`).join("\n");
+}
+function parseColor(value) {
+  const v = value.trim();
+  const hex = /^#([0-9a-f]{3,8})$/i.exec(v);
+  if (hex) {
+    let h = hex[1];
+    if (h.length === 3 || h.length === 4) h = [...h].map((ch) => ch + ch).join("");
+    if (h.length !== 6 && h.length !== 8) return null;
+    const n = (i) => parseInt(h.slice(i, i + 2), 16) / 255;
+    return { r: n(0), g: n(2), b: n(4), a: h.length === 8 ? n(6) : 1 };
+  }
+  const rgb = /^rgba?\(\s*([\d.]+)[\s,]+([\d.]+)[\s,]+([\d.]+)(?:[\s,/]+([\d.]+%?))?\s*\)$/i.exec(v);
+  if (rgb) {
+    const a = rgb[4] === void 0 ? 1 : rgb[4].endsWith("%") ? parseFloat(rgb[4]) / 100 : parseFloat(rgb[4]);
+    return { r: +rgb[1] / 255, g: +rgb[2] / 255, b: +rgb[3] / 255, a };
+  }
+  const srgb = /^color\(\s*srgb\s+([\d.]+)\s+([\d.]+)\s+([\d.]+)(?:\s*\/\s*([\d.]+%?))?\s*\)$/i.exec(v);
+  if (srgb) {
+    const a = srgb[4] === void 0 ? 1 : srgb[4].endsWith("%") ? parseFloat(srgb[4]) / 100 : parseFloat(srgb[4]);
+    return { r: +srgb[1], g: +srgb[2], b: +srgb[3], a };
+  }
+  return null;
+}
+function canvasColors(tokens) {
+  const out = {};
+  for (const id of TOKEN_IDS) {
+    if (TOKENS[id].group !== "canvas" || TOKENS[id].type !== "color") continue;
+    out[id] = parseColor(tokens[id]) ?? parseColor(TOKENS[id].default);
+  }
+  return out;
+}
+
 export {
   DEFAULT_THEME_ID,
   BUILTIN_THEMES,
   PICKABLE_BUILTIN_IDS,
-  INITIAL_THEME_ID
+  INITIAL_THEME_ID,
+  TOKENS,
+  TOKEN_IDS,
+  tokenVar,
+  resolveTheme,
+  collectFonts,
+  collectCss,
+  toCssVars,
+  parseColor,
+  canvasColors
 };

package/dist/chunks/{chunk-K63NQAOB.js → chunk-XE6NJFI2.js}

@@ -36,6 +36,90 @@ import {
   init_define_POPCRAFT_COMPONENT_IDS
 } from "./chunk-63KP74KB.js";
 
+// lib/editor/stage-view.ts
+init_define_POPCRAFT_COMPONENT_IDS();
+init_scene_graph();
+var NO_INSETS = { top: 0, right: 0, bottom: 0, left: 0 };
+var STAGE_PADDING = 24;
+var STAGE_TYPES = /* @__PURE__ */ new Set(["FRAME", "COMPONENT", "COMPONENT_SET", "INSTANCE"]);
+function rootOf(nodes, pageId, id) {
+  let n = nodes[id.split("::")[0]];
+  while (n && n.parentId && n.parentId !== pageId) n = nodes[n.parentId];
+  return n && n.parentId === pageId ? n : null;
+}
+var isStageRoot = (n, pageId) => !!n && n.parentId === pageId && STAGE_TYPES.has(n.type) && n.visible !== false;
+function openComposition(s) {
+  const t = s.transport.target;
+  return s.mode === "ANIMATE" && t?.kind === "composition" ? s.document.compositions?.[t.compositionId] ?? null : null;
+}
+function stageFrameId(s) {
+  const nodes = s.document.nodes, pageId = s.currentPageId;
+  if (openComposition(s)) return null;
+  const t = s.transport.target;
+  if (s.mode === "ANIMATE" && t?.kind === "frame" && isStageRoot(nodes[t.frameId], pageId)) return t.frameId;
+  for (const id of s.selection) {
+    const root = rootOf(nodes, pageId, id);
+    if (isStageRoot(root, pageId)) return root.id;
+  }
+  if (s.stageFrameId && isStageRoot(nodes[s.stageFrameId], pageId)) return s.stageFrameId;
+  const page = nodes[pageId];
+  let best = null, bestD = Infinity;
+  for (const id of page?.childIds ?? []) {
+    if (!isStageRoot(nodes[id], pageId)) continue;
+    const w = getWorldTransform({ nodes }, id);
+    const d = Math.hypot(w.cx - s.camera.x, w.cy - s.camera.y);
+    if (d < bestD) {
+      bestD = d;
+      best = id;
+    }
+  }
+  return best;
+}
+function stageTarget(s, doc = s.document) {
+  const nodes = doc.nodes;
+  const comp = openComposition(s);
+  if (comp) {
+    const rect = compositionStage(comp, (id) => {
+      if (!nodes[id]) return null;
+      const w = getWorldTransform({ nodes }, id);
+      return { x: w.cx, y: w.cy };
+    });
+    return rect ? { kind: "composition", compositionId: comp.id, rect } : null;
+  }
+  const frameId = stageFrameId(s);
+  const b = frameId ? selectionWorldBounds(nodes, [frameId]) : null;
+  if (!frameId || !b) return null;
+  return { kind: "frame", frameId, rect: { x: b.minX, y: b.minY, width: b.maxX - b.minX, height: b.maxY - b.minY } };
+}
+function stageFit(rect, view, insets = NO_INSETS, padding = 0) {
+  const availW = view.width - insets.left - insets.right - padding * 2;
+  const availH = view.height - insets.top - insets.bottom - padding * 2;
+  if (!(rect.width > 0) || !(rect.height > 0) || availW <= 0 || availH <= 0) return null;
+  const zoom = Math.max(0.01, Math.min(64, availW / rect.width, availH / rect.height));
+  const dx = (insets.left - insets.right) / 2, dy = (insets.top - insets.bottom) / 2;
+  return { x: rect.x + rect.width / 2 - dx / zoom, y: rect.y + rect.height / 2 - dy / zoom, zoom };
+}
+function occluderInsets(canvas, boxes) {
+  const out = { ...NO_INSETS };
+  const w = canvas.right - canvas.left, h = canvas.bottom - canvas.top;
+  if (w <= 0 || h <= 0) return out;
+  const midY = (canvas.top + canvas.bottom) / 2;
+  for (const b of boxes) {
+    const left = Math.max(b.left, canvas.left), right = Math.min(b.right, canvas.right);
+    const top = Math.max(b.top, canvas.top), bottom = Math.min(b.bottom, canvas.bottom);
+    if (right - left < 1 || bottom - top < 1) continue;
+    if ((top + bottom) / 2 >= midY) out.bottom = Math.max(out.bottom, canvas.bottom - top);
+    else out.top = Math.max(out.top, bottom - canvas.top);
+  }
+  const cap = h * (2 / 3);
+  if (out.top + out.bottom > cap) {
+    const k = cap / (out.top + out.bottom);
+    out.top *= k;
+    out.bottom *= k;
+  }
+  return out;
+}
+
 // lib/document/z-order.ts
 init_define_POPCRAFT_COMPONENT_IDS();
 function reorderSelection(doc, ids, dir) {
@@ -133,90 +217,6 @@ function relinkCopies(doc, copies) {
   return nodes ? { ...doc, nodes } : doc;
 }
 
-// lib/editor/stage-view.ts
-init_define_POPCRAFT_COMPONENT_IDS();
-init_scene_graph();
-var NO_INSETS = { top: 0, right: 0, bottom: 0, left: 0 };
-var STAGE_PADDING = 24;
-var STAGE_TYPES = /* @__PURE__ */ new Set(["FRAME", "COMPONENT", "COMPONENT_SET", "INSTANCE"]);
-function rootOf(nodes, pageId, id) {
-  let n = nodes[id.split("::")[0]];
-  while (n && n.parentId && n.parentId !== pageId) n = nodes[n.parentId];
-  return n && n.parentId === pageId ? n : null;
-}
-var isStageRoot = (n, pageId) => !!n && n.parentId === pageId && STAGE_TYPES.has(n.type) && n.visible !== false;
-function openComposition(s) {
-  const t = s.transport.target;
-  return s.mode === "ANIMATE" && t?.kind === "composition" ? s.document.compositions?.[t.compositionId] ?? null : null;
-}
-function stageFrameId(s) {
-  const nodes = s.document.nodes, pageId = s.currentPageId;
-  if (openComposition(s)) return null;
-  const t = s.transport.target;
-  if (s.mode === "ANIMATE" && t?.kind === "frame" && isStageRoot(nodes[t.frameId], pageId)) return t.frameId;
-  for (const id of s.selection) {
-    const root = rootOf(nodes, pageId, id);
-    if (isStageRoot(root, pageId)) return root.id;
-  }
-  if (s.stageFrameId && isStageRoot(nodes[s.stageFrameId], pageId)) return s.stageFrameId;
-  const page = nodes[pageId];
-  let best = null, bestD = Infinity;
-  for (const id of page?.childIds ?? []) {
-    if (!isStageRoot(nodes[id], pageId)) continue;
-    const w = getWorldTransform({ nodes }, id);
-    const d = Math.hypot(w.cx - s.camera.x, w.cy - s.camera.y);
-    if (d < bestD) {
-      bestD = d;
-      best = id;
-    }
-  }
-  return best;
-}
-function stageTarget(s, doc = s.document) {
-  const nodes = doc.nodes;
-  const comp = openComposition(s);
-  if (comp) {
-    const rect = compositionStage(comp, (id) => {
-      if (!nodes[id]) return null;
-      const w = getWorldTransform({ nodes }, id);
-      return { x: w.cx, y: w.cy };
-    });
-    return rect ? { kind: "composition", compositionId: comp.id, rect } : null;
-  }
-  const frameId = stageFrameId(s);
-  const b = frameId ? selectionWorldBounds(nodes, [frameId]) : null;
-  if (!frameId || !b) return null;
-  return { kind: "frame", frameId, rect: { x: b.minX, y: b.minY, width: b.maxX - b.minX, height: b.maxY - b.minY } };
-}
-function stageFit(rect, view, insets = NO_INSETS, padding = 0) {
-  const availW = view.width - insets.left - insets.right - padding * 2;
-  const availH = view.height - insets.top - insets.bottom - padding * 2;
-  if (!(rect.width > 0) || !(rect.height > 0) || availW <= 0 || availH <= 0) return null;
-  const zoom = Math.max(0.01, Math.min(64, availW / rect.width, availH / rect.height));
-  const dx = (insets.left - insets.right) / 2, dy = (insets.top - insets.bottom) / 2;
-  return { x: rect.x + rect.width / 2 - dx / zoom, y: rect.y + rect.height / 2 - dy / zoom, zoom };
-}
-function occluderInsets(canvas, boxes) {
-  const out = { ...NO_INSETS };
-  const w = canvas.right - canvas.left, h = canvas.bottom - canvas.top;
-  if (w <= 0 || h <= 0) return out;
-  const midY = (canvas.top + canvas.bottom) / 2;
-  for (const b of boxes) {
-    const left = Math.max(b.left, canvas.left), right = Math.min(b.right, canvas.right);
-    const top = Math.max(b.top, canvas.top), bottom = Math.min(b.bottom, canvas.bottom);
-    if (right - left < 1 || bottom - top < 1) continue;
-    if ((top + bottom) / 2 >= midY) out.bottom = Math.max(out.bottom, canvas.bottom - top);
-    else out.top = Math.max(out.top, bottom - canvas.top);
-  }
-  const cap = h * (2 / 3);
-  if (out.top + out.bottom > cap) {
-    const k = cap / (out.top + out.bottom);
-    out.top *= k;
-    out.bottom *= k;
-  }
-  return out;
-}
-
 // lib/editor/crop.ts
 init_define_POPCRAFT_COMPONENT_IDS();
 init_dist_node();
@@ -325,6 +325,10 @@ export {
   resetCrop,
   setCropAspect,
   resizeWindow,
+  STAGE_PADDING,
+  stageTarget,
+  stageFit,
+  occluderInsets,
   reorderSelection,
   isPathSource,
   isClosedOutline,
@@ -332,9 +336,5 @@ export {
   textLinkSource,
   linkedTexts,
   reboxed,
-  relinkCopies,
-  STAGE_PADDING,
-  stageTarget,
-  stageFit,
-  occluderInsets
+  relinkCopies
 };