@graphysdk/react-renderer 1.9.0-beta.1788895348418 → 1.9.0-beta.1789025801428

package/dist/index.mjs

@@ -1,39 +1,39 @@
-import { Ct as _t, Ft as de, It as re, Lt as A, M as Dt, Mt as $t, Nt as xt, O as Ht, Pt as Mt, St as le, Tt as Pt, X as Lt, Y as Bt, _ as Kt, _t as ue, a as Ot, bt as me, ct as At, gt as K, i as jt, it as Ft, j as Ut, jt as Yt, k as Wt, lt as Vt, mt as Xt, n as Qt, pt as zt, r as Jt, rt as Zt, s as er, t as ge, tt as tr, vt as rr, wt as nr, xt as sr, yt as j } from "./history-chords-DhcO3NfJ.js";
-import { d as ir, t as he } from "./dev.utils-DT-z_GBs.js";
-import { COMPILER_STAGE_KEYS as F, Geom as pe, GraphCompilationSession as fe, areEditTargetsEqual as ve, buildDiagnostic as V, createAnchorResolver as ye, createCompiler as be, createGraphyBuilder as Se, createStyleResolver as Ee, findAnnotation as Ce, isCompilerCachingEnabled as Te, resolveDefinition as Ne, setCompilerCachingEnabled as Re, toPercent as P } from "@graphysdk/viz-engine";
-import { Component as qe, useCallback as f, useEffect as x, useId as Ge, useImperativeHandle as we, useMemo as $, useRef as X, useState as C, useSyncExternalStore as ke } from "react";
-import { Fragment as Ie, jsx as d, jsxs as v } from "react/jsx-runtime";
-import { useStore as Q } from "zustand";
+import { Ct as Dt, Ft as le, It as ne, Lt as A, M as $t, Mt as xt, Nt as Ht, O as Mt, Pt as Lt, St as ue, Tt as Pt, X as Bt, Y as Kt, _ as Ot, _t as me, a as At, bt as he, ct as jt, gt as K, i as Ft, it as Ut, j as Yt, jt as Wt, k as Vt, lt as Xt, mt as Qt, n as zt, pt as Jt, r as Zt, rt as er, s as tr, t as ge, tt as rr, vt as nr, wt as sr, xt as or, yt as j } from "./history-chords-BtNvrHbM.js";
+import { d as ar, t as pe } from "./dev.utils-DT-z_GBs.js";
+import { COMPILER_STAGE_KEYS as F, Geom as fe, GraphCompilationSession as ve, areEditTargetsEqual as ye, buildDiagnostic as V, createAnchorResolver as be, createCompiler as Se, createGraphyBuilder as Ee, createStyleResolver as Ce, findAnnotation as Te, findLayerById as X, isCompilerCachingEnabled as Ne, resolveDefinition as Re, setCompilerCachingEnabled as qe, toPercent as L } from "@graphysdk/viz-engine";
+import { Component as Ie, useCallback as f, useEffect as x, useId as ke, useImperativeHandle as Ge, useMemo as $, useRef as Q, useState as C, useSyncExternalStore as we } from "react";
+import { Fragment as _e, jsx as d, jsxs as v } from "react/jsx-runtime";
+import { useStore as z } from "zustand";
 import { createStore as U } from "zustand/vanilla";
-import _e from "clsx";
-import './index.css';var De = "_1a5iqpb0", $e = "_1a5iqpb1";
-var xe = "_1a5iqpb3", He = "_1a5iqpb4", Me = "_1a5iqpb5";
-var z = ({ errors: e }) => {
+import De from "clsx";
+import './index.css';var $e = "_1a5iqpb0", xe = "_1a5iqpb1";
+var He = "_1a5iqpb3", Me = "_1a5iqpb4", Le = "_1a5iqpb5";
+var J = ({ errors: e }) => {
   const [t, ...r] = e;
   return /* @__PURE__ */ v("div", {
     role: "alert",
-    className: De,
+    className: $e,
     children: [
       /* @__PURE__ */ d("strong", {
-        className: $e,
+        className: xe,
         children: "This chart could not be rendered."
       }),
-      t && /* @__PURE__ */ d(J, { diagnostic: t }),
+      t && /* @__PURE__ */ d(Z, { diagnostic: t }),
       r.length > 0 && /* @__PURE__ */ d("ul", {
         className: "_1a5iqpb2",
-        children: r.map((n, o) => /* @__PURE__ */ d("li", { children: /* @__PURE__ */ d(J, { diagnostic: n }) }, `${n.code}-${o}`))
+        children: r.map((n, o) => /* @__PURE__ */ d("li", { children: /* @__PURE__ */ d(Z, { diagnostic: n }) }, `${n.code}-${o}`))
       })
     ]
   });
-}, J = ({ diagnostic: e }) => /* @__PURE__ */ v("div", {
-  className: xe,
+}, Z = ({ diagnostic: e }) => /* @__PURE__ */ v("div", {
+  className: He,
   children: [
     /* @__PURE__ */ d("span", {
-      className: He,
+      className: Me,
       children: e.code
     }),
     /* @__PURE__ */ d("p", {
-      className: Me,
+      className: Le,
       children: e.message
     }),
     e.suggestion && /* @__PURE__ */ d("p", {
@@ -45,7 +45,7 @@ var z = ({ errors: e }) => {
 function Pe(e = [], t = []) {
   return e.length === t.length && e.every((r, n) => Object.is(r, t[n]));
 }
-var Le = class extends qe {
+var Be = class extends Ie {
   constructor(...e) {
     super(...e), this.state = { caughtDiagnostic: null };
   }
@@ -61,28 +61,28 @@ var Le = class extends qe {
   }
   render() {
     const { caughtDiagnostic: e } = this.state;
-    if (e) return /* @__PURE__ */ d(z, { errors: [e] });
+    if (e) return /* @__PURE__ */ d(J, { errors: [e] });
     const { forcedErrors: t, children: r } = this.props;
-    return t && t.length > 0 ? /* @__PURE__ */ d(z, { errors: t }) : r;
+    return t && t.length > 0 ? /* @__PURE__ */ d(J, { errors: t }) : r;
   }
-}, ne = (e) => typeof e == "object" && "geom" in e && "render" in e, Be = (e) => {
-  const t = Ne(e);
-  return t instanceof pe ? t : null;
-}, Ke = (e, t) => {
-  const r = e.filter((n) => Oe(n, t));
+}, se = (e) => typeof e == "object" && "geom" in e && "render" in e, Ke = (e) => {
+  const t = Re(e);
+  return t instanceof fe ? t : null;
+}, Oe = (e, t) => {
+  const r = e.filter((n) => Ae(n, t));
   return r.length === e.length ? e : r;
-}, Oe = (e, t) => e.kind !== "annotation" ? !0 : Ce(t.annotations, e.id) !== null, Z = [], Ae = () => U((e) => ({
-  selection: Z,
-  setSelection: (t) => e((r) => je(r.selection, t) ? r : { selection: t }),
-  clearSelection: () => e((t) => t.selection.length === 0 ? t : { selection: Z })
-})), je = (e, t) => e === t ? !0 : e.length !== t.length ? !1 : e.every((r, n) => {
+}, Ae = (e, t) => e.kind === "annotation" ? Te(t.annotations, e.id) !== null : e.kind === "observations" ? X(t.layers, e.layerId) !== void 0 : e.kind === "layer" && e.layerId !== void 0 ? X(t.layers, e.layerId) !== void 0 : !0, ee = [], je = () => U((e) => ({
+  selection: ee,
+  setSelection: (t) => e((r) => Fe(r.selection, t) ? r : { selection: t }),
+  clearSelection: () => e((t) => t.selection.length === 0 ? t : { selection: ee })
+})), Fe = (e, t) => e === t ? !0 : e.length !== t.length ? !1 : e.every((r, n) => {
   const o = t[n];
-  return o !== void 0 && ve(r, o);
-}), Fe = 5, Ue = (e) => {
-  if (!he) return {
+  return o !== void 0 && ye(r, o);
+}), Ue = 5, Ye = (e) => {
+  if (!pe) return {
     emit: () => {
     },
-    subscribe: () => We,
+    subscribe: () => Ve,
     getLastTrigger: () => null,
     getLastCompile: () => null,
     getCacheStats: () => e.getCacheStats()
@@ -104,7 +104,7 @@ var Le = class extends qe {
     getLastCompile: () => e.getLastCompile(),
     getCacheStats: () => e.getCacheStats()
   };
-}, Ye = () => U((e) => ({
+}, We = () => U((e) => ({
   lastCompile: null,
   history: [],
   nextId: 1,
@@ -113,19 +113,19 @@ var Le = class extends qe {
     if (n.lastSnapshot === r) return n;
     const o = {
       id: n.nextId,
-      label: Ve(t),
+      label: Xe(t),
       stages: r.stages,
       durationMs: r.durationMs
     };
     return {
       lastCompile: o,
-      history: Xe(n.history, o, Fe),
+      history: Qe(n.history, o, Ue),
       nextId: n.nextId + 1,
       lastSnapshot: r
     };
   })
-})), We = () => {
-}, Ve = (e) => {
+})), Ve = () => {
+}, Xe = (e) => {
   switch (e.kind) {
     case "init":
       return "init";
@@ -136,14 +136,14 @@ var Le = class extends qe {
     case "command":
       return e.command.metadata.description;
   }
-}, Xe = (e, t, r) => {
+}, Qe = (e, t, r) => {
   const n = e.length >= r ? e.length - (r - 1) : 0;
   return [...e.slice(n), t];
 };
-function Qe(e) {
-  const t = e.filter(ne), r = /* @__PURE__ */ new Set([...Object.keys(me), ...t.map((c) => c.geom)]), n = [], o = /* @__PURE__ */ new Set();
+function ze(e) {
+  const t = e.filter(se), r = /* @__PURE__ */ new Set([...Object.keys(he), ...t.map((c) => c.geom)]), n = [], o = /* @__PURE__ */ new Set();
   for (const c of e) {
-    const u = Be(c);
+    const u = Ke(c);
     u === null || r.has(u.type) || o.has(u.type) || (o.add(u.type), n.push({
       kind: "user-input",
       severity: "error",
@@ -184,7 +184,7 @@ function Qe(e) {
     warnings: i
   };
 }
-function ze(e, t) {
+function Je(e, t) {
   const { coordSystem: r, layers: n } = e, o = /* @__PURE__ */ new Set(), a = [];
   for (const i of n)
     t(i.geom, r.type) !== null || o.has(i.geom) || (o.add(i.geom), a.push({
@@ -200,7 +200,7 @@ function ze(e, t) {
     }));
   return a;
 }
-function Je(e, t) {
+function Ze(e, t) {
   const { coordSystem: r, layers: n } = e, o = /* @__PURE__ */ new Set(), a = [];
   for (const i of n) {
     if (i.interactive === !1 || i.spatialKind !== "render-hit-test" || o.has(i.geom)) continue;
@@ -219,7 +219,7 @@ function Je(e, t) {
   }
   return a;
 }
-function Ze(e) {
+function et(e) {
   const t = /* @__PURE__ */ new Set(), r = [];
   for (const n of e.layers) {
     const o = n.identityKey;
@@ -237,7 +237,7 @@ function Ze(e) {
   }
   return r;
 }
-function et(e, t) {
+function tt(e, t) {
   const { coordSystem: r, layers: n } = e, o = /* @__PURE__ */ new Set(), a = [];
   for (const i of n) {
     if (i.interactive === !1 || i.spatialKind !== "render-hit-test" || o.has(i.geom)) continue;
@@ -256,7 +256,7 @@ function et(e, t) {
   }
   return a;
 }
-function tt(e, t) {
+function rt(e, t) {
   const r = /* @__PURE__ */ new Set(), n = [];
   for (const o of e.layers)
     o.interactive !== !1 && (o.spatialKind !== "render-hit-test" || r.has(o.geom) || t.hasCapability(o.geom) || (r.add(o.geom), n.push({
@@ -272,7 +272,7 @@ function tt(e, t) {
     })));
   return n;
 }
-function rt(e, t) {
+function nt(e, t) {
   const { coordSystem: r, layers: n } = e, o = /* @__PURE__ */ new Set(), a = [];
   for (const i of n) {
     if (i.interactive === !1 || i.spatialKind === "render-hit-test" || o.has(i.geom)) continue;
@@ -291,56 +291,56 @@ function rt(e, t) {
   }
   return a;
 }
-var nt = (e) => U((t) => ({
+var st = (e) => U((t) => ({
   compiled: e,
   setCompiled: (r) => t((n) => n.compiled === r ? n : { compiled: r })
-})), st = ({ input: e, data: t, customPalettes: r, colorScheme: n, plugins: o, resolveRenderer: a, anchorResolver: i, onChange: c, onError: u, onWarnings: m }) => {
-  const T = K(c), w = K(u), q = K(m), [{ session: g, compileBus: l }] = C(() => {
-    const s = be({ plugins: o });
+})), ot = ({ input: e, data: t, customPalettes: r, colorScheme: n, plugins: o, resolveRenderer: a, anchorResolver: i, onChange: c, onError: u, onWarnings: m }) => {
+  const T = K(c), k = K(u), q = K(m), [{ session: h, compileBus: l }] = C(() => {
+    const s = Se({ plugins: o });
     return {
-      session: new fe(s),
-      compileBus: Ue(s)
+      session: new ve(s),
+      compileBus: Ye(s)
     };
-  }), [p] = C(() => Qe(o ?? [])), y = X(null), [k] = C(ot), N = X(null), b = f((s) => p.errors.length === 0 ? s : [...p.errors, ...s ?? []], [p]), _ = f((s) => {
+  }), [p] = C(() => ze(o ?? [])), y = Q(null), [G] = C(it), N = Q(null), b = f((s) => p.errors.length === 0 ? s : [...p.errors, ...s ?? []], [p]), _ = f((s) => {
     if (!s.ok) return s.errors;
     if (N.current) N.current.getState().setCompiled(s.compiled);
     else {
-      const h = nt(s.compiled);
-      h.subscribe(k.notify), N.current = h, k.notify();
+      const g = st(s.compiled);
+      g.subscribe(G.notify), N.current = g, G.notify();
     }
     return null;
-  }, [k]), [H, D] = C(() => {
-    const s = g.compile({
+  }, [G]), [H, D] = C(() => {
+    const s = h.compile({
       input: e,
       data: t,
       customPalettes: r,
       colorScheme: n
     });
     return y.current = s, b(_(s));
-  }), G = f((s) => s.ok ? [
+  }), I = f((s) => s.ok ? [
     ...s.warnings,
-    ...ze(s.compiled, a),
     ...Je(s.compiled, a),
-    ...Ze(s.compiled),
-    ...et(s.compiled, a),
-    ...rt(s.compiled, a),
-    ...tt(s.compiled, i)
+    ...Ze(s.compiled, a),
+    ...et(s.compiled),
+    ...tt(s.compiled, a),
+    ...nt(s.compiled, a),
+    ...rt(s.compiled, i)
   ] : s.warnings, [a, i]), S = f((s) => {
-    s.length !== 0 && (A(s), w.current?.(s));
-  }, [w]), R = f((s) => {
+    s.length !== 0 && (A(s), k.current?.(s));
+  }, [k]), R = f((s) => {
     s.length !== 0 && (A(s), q.current?.(s));
   }, [q]);
   x(() => {
     const s = y.current;
-    s && (S([...p.errors, ...s.ok ? [] : s.errors]), R([...p.warnings, ...G(s)]), s.ok && l.emit({ kind: "init" }));
+    s && (S([...p.errors, ...s.ok ? [] : s.errors]), R([...p.warnings, ...I(s)]), s.ok && l.emit({ kind: "init" }));
   }, [
     l,
     S,
     R,
     p,
-    G
+    I
   ]), x(() => {
-    const s = g.update({
+    const s = h.update({
       input: e,
       data: t,
       customPalettes: r,
@@ -348,65 +348,65 @@ var nt = (e) => U((t) => ({
     });
     if (!s) return;
     s.sealedInput && T.current?.(s.sealedInput);
-    const h = _(s.result);
-    D(b(h)), h && S(h), R(G(s.result)), h || l.emit({ kind: s.inputChanged ? "input" : "data" });
+    const g = _(s.result);
+    D(b(g)), g && S(g), R(I(s.result)), g || l.emit({ kind: s.inputChanged ? "input" : "data" });
   }, [
     e,
     t,
     r,
     n,
-    g,
+    h,
     l,
     _,
     S,
     R,
     b,
-    G,
+    I,
     T
   ]);
-  const I = f((s) => {
-    D((h) => h === null ? h : b(null)), R(G(s));
+  const w = f((s) => {
+    D((g) => g === null ? g : b(null)), R(I(s));
   }, [
     b,
     R,
-    G
+    I
   ]), M = f((s) => {
-    s.compiled && N.current?.getState().setCompiled(s.compiled), s.result && I(s.result), s.command && l.emit({
+    s.compiled && N.current?.getState().setCompiled(s.compiled), s.result && w(s.result), s.command && l.emit({
       kind: "command",
       command: s.command
     }), s.input && T.current?.(s.input), s.errors && S([...s.errors]);
   }, [
-    I,
+    w,
     l,
     T,
     S
   ]), E = f((s) => {
-    for (const h of s) M(h);
-    return s.some((h) => !!h.compiled);
-  }, [M]), B = f((s, h) => {
-    E(g.applyCommand(s, h));
-  }, [g, E]), ie = f(() => {
-    E(g.seal());
-  }, [g, E]), Y = f(() => E(g.undo()), [g, E]), W = f(() => E(g.redo()), [g, E]), ae = $(() => ({
-    stack: g.history,
+    for (const g of s) M(g);
+    return s.some((g) => !!g.compiled);
+  }, [M]), B = f((s, g) => {
+    E(h.applyCommand(s, g));
+  }, [h, E]), ae = f(() => {
+    E(h.seal());
+  }, [h, E]), Y = f(() => E(h.undo()), [h, E]), W = f(() => E(h.redo()), [h, E]), ce = $(() => ({
+    stack: h.history,
     undo: Y,
     redo: W
   }), [
-    g,
+    h,
     Y,
     W
-  ]), ce = f(() => N.current?.getState().compiled ?? null, []);
+  ]), de = f(() => N.current?.getState().compiled ?? null, []);
   return {
     store: N.current,
     dispatch: B,
-    seal: ie,
-    history: ae,
-    subscribe: k.subscribe,
-    getCompiled: ce,
+    seal: ae,
+    history: ce,
+    subscribe: G.subscribe,
+    getCompiled: de,
     compileBus: l,
     compileErrors: H
   };
-}, ot = () => {
+}, it = () => {
   const e = /* @__PURE__ */ new Set();
   return {
     subscribe: (t) => (e.add(t), () => {
@@ -414,39 +414,39 @@ var nt = (e) => U((t) => ({
     }),
     notify: () => e.forEach((t) => t())
   };
-}, it = ({ data: e, input: t, plugins: r = [], formattingLocale: n, handleRef: o, onChange: a, onError: i, onWarnings: c, customPalettes: u, colorScheme: m = "light", children: T }) => {
-  const [w] = C(() => ue(r.filter(ne))), q = Ge(), [g] = C(() => ye(r)), [l] = C(() => Ae()), p = $(() => Ee({ colorScheme: m }), [m]), { store: y, dispatch: k, seal: N, history: b, subscribe: _, getCompiled: H, compileBus: D, compileErrors: G } = st({
+}, at = ({ data: e, input: t, plugins: r = [], formattingLocale: n, handleRef: o, onChange: a, onError: i, onWarnings: c, customPalettes: u, colorScheme: m = "light", children: T }) => {
+  const [k] = C(() => me(r.filter(se))), q = ke(), [h] = C(() => be(r)), [l] = C(() => je()), p = $(() => Ce({ colorScheme: m }), [m]), { store: y, dispatch: G, seal: N, history: b, subscribe: _, getCompiled: H, compileBus: D, compileErrors: I } = ot({
     input: t,
     data: e,
     customPalettes: u,
     colorScheme: m,
     plugins: r,
-    resolveRenderer: w,
-    anchorResolver: g,
+    resolveRenderer: k,
+    anchorResolver: h,
     onChange: a,
     onError: i,
     onWarnings: c
   });
   x(() => {
     if (y)
-      return y.subscribe((I, M) => {
-        if (I.compiled.spec === M.compiled.spec) return;
+      return y.subscribe((w, M) => {
+        if (w.compiled.spec === M.compiled.spec) return;
         const { selection: E, setSelection: B } = l.getState();
-        E.length !== 0 && B(Ke(E, I.compiled.spec));
+        E.length !== 0 && B(Oe(E, w.compiled.spec));
       });
   }, [y, l]);
   const S = $(() => ({
-    dispatch: k,
+    dispatch: G,
     seal: N
-  }), [k, N]);
-  we(o, () => ({
+  }), [G, N]);
+  Ge(o, () => ({
     commands: S,
     undo: b.undo,
     redo: b.redo,
     subscribe: _,
     getCompiled: H,
     getSelection: () => l.getState().selection,
-    setSelection: (I) => l.getState().setSelection(I),
+    setSelection: (w) => l.getState().setSelection(w),
     subscribeSelection: l.subscribe
   }), [
     S,
@@ -465,7 +465,7 @@ var nt = (e) => U((t) => ({
     compileBus: D,
     colorScheme: m,
     styleResolver: p,
-    anchorResolver: g
+    anchorResolver: h
   } : null, [
     q,
     y,
@@ -476,32 +476,32 @@ var nt = (e) => U((t) => ({
     D,
     m,
     p,
-    g
+    h
   ]);
-  return /* @__PURE__ */ d(Le, {
-    forcedErrors: G,
+  return /* @__PURE__ */ d(Be, {
+    forcedErrors: I,
     onError: i,
     resetKeys: [t, e],
-    children: R ? /* @__PURE__ */ d(de.Provider, {
+    children: R ? /* @__PURE__ */ d(le.Provider, {
       value: R,
-      children: /* @__PURE__ */ d(le, {
-        value: w,
+      children: /* @__PURE__ */ d(ue, {
+        value: k,
         children: T
       })
     }) : null
   });
 };
 function gr(e) {
-  const t = Se(e);
+  const t = Ee(e);
   return {
     ...t,
-    GraphProvider: (n) => /* @__PURE__ */ d(it, {
+    GraphProvider: (n) => /* @__PURE__ */ d(at, {
       ...n,
       plugins: t.plugins
     })
   };
 }
-var hr = ({ children: e, ...t }) => /* @__PURE__ */ d("svg", {
+var pr = ({ children: e, ...t }) => /* @__PURE__ */ d("svg", {
   viewBox: "0 0 1 1",
   preserveAspectRatio: "none",
   width: "100%",
@@ -509,57 +509,57 @@ var hr = ({ children: e, ...t }) => /* @__PURE__ */ d("svg", {
   pointerEvents: "none",
   ...t,
   children: e
-}), pr = ({ box: e, children: t }) => /* @__PURE__ */ d("svg", {
-  x: P(e.x0),
-  y: P(e.y0),
-  width: P(e.x1 - e.x0),
-  height: P(e.y1 - e.y0),
+}), fr = ({ box: e, children: t }) => /* @__PURE__ */ d("svg", {
+  x: L(e.x0),
+  y: L(e.y0),
+  width: L(e.x1 - e.x0),
+  height: L(e.y1 - e.y0),
   overflow: "hidden",
   pointerEvents: "none",
   children: t
-}), at = "drqe3u0", ct = "drqe3u1", dt = "drqe3u2", lt = "drqe3u3", L = "drqe3u4", ut = "drqe3u5", mt = "drqe3u6", gt = "drqe3u7", O = "drqe3u8", ht = "drqe3u9", pt = "drqe3ua";
-var ft = "drqe3uc", vt = "drqe3ud", yt = "drqe3ue", bt = "drqe3uf";
-var St = "drqe3uh", Et = "drqe3ui", ee = {
+}), ct = "drqe3u0", dt = "drqe3u1", lt = "drqe3u2", ut = "drqe3u3", P = "drqe3u4", mt = "drqe3u5", ht = "drqe3u6", gt = "drqe3u7", O = "drqe3u8", pt = "drqe3u9", ft = "drqe3ua";
+var vt = "drqe3uc", yt = "drqe3ud", bt = "drqe3ue", St = "drqe3uf";
+var Et = "drqe3uh", Ct = "drqe3ui", te = {
   enabled: "drqe3uk drqe3uj",
   disabled: "drqe3ul drqe3uj"
-}, te = {
+}, re = {
   ran: "drqe3un drqe3um",
   dim: "drqe3uo drqe3um"
-}, se = {
+}, oe = {
   ran: "drqe3uq drqe3up",
   cached: "drqe3ur drqe3up",
   untouched: "drqe3us drqe3up"
-}, fr = ({ width: e = 380, style: t, className: r } = {}) => {
-  const { compileBus: n } = re(), [o] = C(() => Ye()), [a, i] = C(!1), [c, u] = C(Te);
+}, vr = ({ width: e = 380, style: t, className: r } = {}) => {
+  const { compileBus: n } = ne(), [o] = C(() => We()), [a, i] = C(!1), [c, u] = C(Ne);
   x(() => {
     const { recordCompile: l } = o.getState(), p = n.getLastTrigger(), y = n.getLastCompile();
     return p && y && l(p, y), n.subscribe(l);
   }, [o, n]);
-  const m = Q(o, (l) => l.lastCompile), T = Q(o, (l) => l.history), w = n.getCacheStats(), q = m === null && T.length === 0, g = () => {
+  const m = z(o, (l) => l.lastCompile), T = z(o, (l) => l.history), k = n.getCacheStats(), q = m === null && T.length === 0, h = () => {
     u((l) => {
       const p = !l;
-      return Re(p), p;
+      return qe(p), p;
     });
   };
   return /* @__PURE__ */ v("div", {
-    className: _e(pt, r),
+    className: De(ft, r),
     style: {
       width: e,
       ...t
     },
     children: [
       /* @__PURE__ */ v("div", {
-        className: at,
+        className: ct,
         children: [/* @__PURE__ */ v("div", { children: [/* @__PURE__ */ d("div", {
-          className: ct,
+          className: dt,
           children: "compile cache"
         }), /* @__PURE__ */ d("div", {
-          className: yt,
-          children: q ? "production: stats disabled" : m ? `last: ${m.label} · ${oe(m.durationMs)}` : "awaiting first compile…"
+          className: bt,
+          children: q ? "production: stats disabled" : m ? `last: ${m.label} · ${ie(m.durationMs)}` : "awaiting first compile…"
         })] }), /* @__PURE__ */ d("button", {
           type: "button",
           onClick: () => i((l) => !l),
-          className: bt,
+          className: St,
           children: a ? "▾" : "▴"
         })]
       }),
@@ -567,8 +567,8 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
         className: "drqe3ub",
         children: [/* @__PURE__ */ v("button", {
           type: "button",
-          onClick: g,
-          className: c ? ee.enabled : ee.disabled,
+          onClick: h,
+          className: c ? te.enabled : te.disabled,
           "aria-pressed": c,
           children: ["cache ", c ? "enabled" : "disabled"]
         }), /* @__PURE__ */ d("span", {
@@ -576,48 +576,48 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
           children: "next compile reflects this toggle"
         })]
       }),
-      !a && !q && /* @__PURE__ */ v(Ie, { children: [/* @__PURE__ */ d(Ct, {
+      !a && !q && /* @__PURE__ */ v(_e, { children: [/* @__PURE__ */ d(Tt, {
         delta: m?.stages,
-        cumulative: w
-      }), /* @__PURE__ */ d(Tt, { entries: T })] })
+        cumulative: k
+      }), /* @__PURE__ */ d(Nt, { entries: T })] })
     ]
   });
-}, Ct = ({ delta: e, cumulative: t }) => /* @__PURE__ */ v("table", {
-  className: dt,
+}, Tt = ({ delta: e, cumulative: t }) => /* @__PURE__ */ v("table", {
+  className: lt,
   children: [/* @__PURE__ */ d("thead", { children: /* @__PURE__ */ v("tr", {
-    className: St,
+    className: Et,
     children: [
       /* @__PURE__ */ d("th", {
-        className: lt,
+        className: ut,
         children: "stage"
       }),
       /* @__PURE__ */ d("th", {
-        className: L,
+        className: P,
         children: "Δ miss"
       }),
       /* @__PURE__ */ d("th", {
-        className: L,
+        className: P,
         children: "Δ hit"
       }),
       /* @__PURE__ */ d("th", {
-        className: L,
+        className: P,
         children: "total miss"
       }),
       /* @__PURE__ */ d("th", {
-        className: L,
+        className: P,
         children: "total hit"
       })
     ]
   }) }), /* @__PURE__ */ d("tbody", { children: F.map((r) => {
-    const n = e?.[r], o = Nt(n);
+    const n = e?.[r], o = Rt(n);
     return /* @__PURE__ */ v("tr", {
-      className: ft,
+      className: vt,
       children: [
         /* @__PURE__ */ v("td", {
-          className: ut,
+          className: mt,
           children: [
             /* @__PURE__ */ d("span", {
-              className: se[o],
+              className: oe[o],
               "aria-hidden": !0
             }),
             " ",
@@ -625,7 +625,7 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
           ]
         }),
         /* @__PURE__ */ d("td", {
-          className: o === "ran" ? te.ran : te.dim,
+          className: o === "ran" ? re.ran : re.dim,
           children: n?.misses ?? 0
         }),
         /* @__PURE__ */ d("td", {
@@ -643,18 +643,18 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
       ]
     }, r);
   }) })]
-}), Tt = ({ entries: e }) => e.length === 0 ? null : /* @__PURE__ */ v("div", {
-  className: vt,
+}), Nt = ({ entries: e }) => e.length === 0 ? null : /* @__PURE__ */ v("div", {
+  className: yt,
   children: [/* @__PURE__ */ d("div", {
-    className: Et,
+    className: Ct,
     children: "recent compiles"
   }), e.map((t) => {
-    const r = Rt(t.stages, (a) => a.misses > 0), n = F.length;
+    const r = qt(t.stages, (a) => a.misses > 0), n = F.length;
     return /* @__PURE__ */ v("div", {
-      className: mt,
+      className: ht,
       children: [
         /* @__PURE__ */ d("span", {
-          className: se[r === 0 ? "cached" : "ran"],
+          className: oe[r === 0 ? "cached" : "ran"],
           "aria-hidden": !0
         }),
         /* @__PURE__ */ d("span", {
@@ -663,24 +663,24 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
           children: t.label
         }),
         /* @__PURE__ */ v("span", {
-          className: ht,
+          className: pt,
           children: [
             r,
             "/",
             n,
             " ran · ",
-            oe(t.durationMs)
+            ie(t.durationMs)
           ]
         })
       ]
     }, t.id);
   })]
-}), Nt = (e) => !e || e.hits === 0 && e.misses === 0 ? "untouched" : e.misses > 0 ? "ran" : "cached", Rt = (e, t) => {
+}), Rt = (e) => !e || e.hits === 0 && e.misses === 0 ? "untouched" : e.misses > 0 ? "ran" : "cached", qt = (e, t) => {
   let r = 0;
   for (const n of F) t(e[n]) && (r += 1);
   return r;
-}, oe = (e) => e >= 10 ? `${e.toFixed(0)}ms` : `${e.toFixed(2)}ms`, vr = () => {
-  const { history: e } = re(), { stack: t, undo: r, redo: n } = e, o = f((c) => t.subscribe(c), [t]), a = f(() => t.getSnapshot(), [t]), i = ke(o, a, a);
+}, ie = (e) => e >= 10 ? `${e.toFixed(0)}ms` : `${e.toFixed(2)}ms`, yr = () => {
+  const { history: e } = ne(), { stack: t, undo: r, redo: n } = e, o = f((c) => t.subscribe(c), [t]), a = f(() => t.getSnapshot(), [t]), i = we(o, a, a);
   return $(() => ({
     ...i,
     undo: r,
@@ -690,7 +690,7 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
     r,
     n
   ]);
-}, qt = /* @__PURE__ */ new Set([
+}, It = /* @__PURE__ */ new Set([
   "button",
   "checkbox",
   "color",
@@ -701,13 +701,13 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
   "range",
   "reset",
   "submit"
-]), yr = (e, t = {}) => {
+]), br = (e, t = {}) => {
   const { target: r, enabled: n = !0 } = t;
   x(() => {
-    const o = Gt(r);
+    const o = kt(r);
     if (!n || !o) return;
     const a = (i) => {
-      if (!wt(i) || i.defaultPrevented || kt(i.target)) return;
+      if (!Gt(i) || i.defaultPrevented || wt(i.target)) return;
       const c = ge(i);
       if (!c) return;
       const u = e.current;
@@ -719,45 +719,45 @@ var St = "drqe3uh", Et = "drqe3ui", ee = {
     r,
     n
   ]);
-}, Gt = (e) => e === void 0 ? window : e !== null && "current" in e ? e.current : e, wt = (e) => "key" in e, kt = (e) => e instanceof HTMLInputElement ? !qt.has(e.type) : e instanceof HTMLElement ? e.isContentEditable || e.tagName === "TEXTAREA" : !1;
+}, kt = (e) => e === void 0 ? window : e !== null && "current" in e ? e.current : e, Gt = (e) => "key" in e, wt = (e) => e instanceof HTMLInputElement ? !It.has(e.type) : e instanceof HTMLElement ? e.isContentEditable || e.tagName === "TEXTAREA" : !1;
 export {
-  Ut as BrandMark,
+  Yt as BrandMark,
   Pt as CanvasTextMeasurer,
-  Wt as DefaultFooter,
-  er as DefaultGrid,
-  Ht as DefaultHeader,
-  sr as DefaultSwatch,
-  Bt as DefaultTooltip,
-  fr as DevToolsPanel,
-  Le as GraphErrorBoundary,
-  z as GraphErrorPanel,
-  it as GraphProvider,
-  Ot as GraphRenderer,
-  Xt as HoverProvider,
-  _t as TextMeasurerProvider,
-  tr as ThemeProvider,
-  pr as UnitBoxSvg,
-  hr as UnitSpaceSvg,
+  Vt as DefaultFooter,
+  tr as DefaultGrid,
+  Mt as DefaultHeader,
+  or as DefaultSwatch,
+  Kt as DefaultTooltip,
+  vr as DevToolsPanel,
+  Be as GraphErrorBoundary,
+  J as GraphErrorPanel,
+  at as GraphProvider,
+  At as GraphRenderer,
+  Qt as HoverProvider,
+  Dt as TextMeasurerProvider,
+  rr as ThemeProvider,
+  fr as UnitBoxSvg,
+  pr as UnitSpaceSvg,
   gr as createGraphyKit,
-  Zt as darkTheme,
-  rr as defineGeomRenderer,
-  Ft as lightTheme,
-  Yt as lightenCss,
-  Ke as pruneSelection,
-  Dt as resolveBrandMarkVisual,
-  Mt as useCompiledSelector,
-  Vt as useElementScreenRect,
-  zt as useGeomHitTest,
-  At as useGeomHover,
-  Qt as useGraphCommands,
-  jt as useGraphHandle,
-  vr as useGraphHistory,
-  yr as useGraphHistoryShortcuts,
-  Kt as useGraphSelection,
-  Jt as useHandleCompiled,
-  Lt as useHoverState,
-  $t as useStyleReaders,
-  xt as useStyleResolver,
-  nr as useTextMeasurer,
-  ir as vars
+  er as darkTheme,
+  nr as defineGeomRenderer,
+  Ut as lightTheme,
+  Wt as lightenCss,
+  Oe as pruneSelection,
+  $t as resolveBrandMarkVisual,
+  Lt as useCompiledSelector,
+  Xt as useElementScreenRect,
+  Jt as useGeomHitTest,
+  jt as useGeomHover,
+  zt as useGraphCommands,
+  Ft as useGraphHandle,
+  yr as useGraphHistory,
+  br as useGraphHistoryShortcuts,
+  Ot as useGraphSelection,
+  Zt as useHandleCompiled,
+  Bt as useHoverState,
+  xt as useStyleReaders,
+  Ht as useStyleResolver,
+  sr as useTextMeasurer,
+  ar as vars
 };