@flesler/cursor-canvas-web 1.2.1 → 1.3.0

package/dist/cursor-canvas.js

@@ -1,10 +1,10 @@
 import { jsx as i, jsxs as y } from "react/jsx-runtime";
-import { useComputedColorScheme as ge, Button as xe, Alert as ve, Card as be, Checkbox as Se, Divider as ke, Title as W, ActionIcon as we, Badge as Ce, Group as Le, Select as Te, Stack as Pe, Text as H, Table as L, Textarea as Ae, TextInput as Me, Switch as Be } from "@mantine/core";
-import { useState as D, createContext as $e, useCallback as G, useContext as oe } from "react";
-import { useEffect as Ut, useMemo as Qt, useRef as en, useState as tn } from "react";
-import { r as De, u as te } from "./host-tokens-Dh2BFFjv.js";
-import { c as rn, a as on, b as an, d as sn, e as ln, f as cn, g as dn, h as un, i as fn } from "./host-tokens-Dh2BFFjv.js";
-import { BarChart as Fe, AreaChart as Ee, LineChart as Ne, DonutChart as Ie, PieChart as ze, ChartLegend as Re } from "@mantine/charts";
+import { useComputedColorScheme as ve, Button as be, Alert as Se, Card as ke, Checkbox as we, Divider as Ce, Title as W, ActionIcon as Le, Badge as Te, Group as Pe, Select as Ae, Stack as Me, Text as H, Table as C, Textarea as Be, TextInput as $e, Switch as De } from "@mantine/core";
+import { useState as D, createContext as ie, useCallback as G, useContext as O } from "react";
+import { useEffect as Qt, useMemo as en, useRef as tn, useState as nn } from "react";
+import { r as Fe, u as ne } from "./host-tokens-Bt6GPXN1.js";
+import { c as on, a as an, b as sn, d as ln, e as cn, f as dn, g as un, h as fn, i as hn } from "./host-tokens-Bt6GPXN1.js";
+import { BarChart as Ee, AreaChart as Ie, LineChart as Ne, DonutChart as ze, PieChart as Re, ChartLegend as _e } from "@mantine/charts";
 const w = {
   success: "#1F8A65",
   danger: "#CF2D56",
@@ -14,7 +14,7 @@ const w = {
   added: "#1F8A65",
   deleted: "#CF2D56",
   renamed: "#5A6CC0"
-}, ae = {
+}, se = {
   success: "green",
   danger: "red",
   warning: "orange",
@@ -24,25 +24,25 @@ const w = {
   deleted: "red",
   renamed: "indigo"
 };
-function m() {
-  const t = ge("light") === "dark" ? "dark" : "light";
-  return De(t);
+function g() {
+  const t = ve("light") === "dark" ? "dark" : "light";
+  return Fe(t);
 }
-const ie = {
+const le = {
   verticalAlign: "bottom",
   align: "center"
-}, se = {
+}, ce = {
   legend: { justifyContent: "center" }
 };
-function O() {
-  const t = m().chart.sequence;
+function j() {
+  const t = g().chart.sequence;
   return (n, r) => n ? w[n] : t[r % t.length];
 }
-function le() {
-  const t = m().text.primary;
+function de() {
+  const t = g().text.primary;
   return { textColor: t, barLabelColor: t };
 }
-function ce(e, t) {
+function ue(e, t) {
   return e.map((n, r) => {
     const a = { category: n };
     for (const o of t)
@@ -50,16 +50,16 @@ function ce(e, t) {
     return a;
   });
 }
-function de(e, t) {
+function fe(e, t) {
   return e.map((n, r) => ({
     name: n.name,
     color: t(n.tone, r)
   }));
 }
-function ue(e, t) {
+function he(e, t) {
   return (n) => `${t ?? ""}${n}${e ?? ""}`;
 }
-function _e(e, t) {
+function He(e, t) {
   if (e != null && e.length)
     return e.map((n) => ({
       ...t ? { x: n.value } : { y: n.value },
@@ -67,10 +67,10 @@ function _e(e, t) {
       color: n.tone ? w[n.tone] : w.neutral
     }));
 }
-const He = /* @__PURE__ */ new Set(["log", "symlog", "pow", "sqrt"]);
-function We(e) {
+const We = /* @__PURE__ */ new Set(["log", "symlog", "pow", "sqrt"]);
+function Ge(e) {
   const { scale: t } = e;
-  return typeof t != "string" || !He.has(t) ? e : {
+  return typeof t != "string" || !We.has(t) ? e : {
     ...e,
     type: e.type ?? "number",
     allowDataOverflow: e.allowDataOverflow ?? !0,
@@ -78,29 +78,29 @@ function We(e) {
     domain: e.domain ?? [1, "dataMax"]
   };
 }
-function fe(e) {
-  const t = _e(e.referenceLines, !!e.horizontal);
+function pe(e) {
+  const t = He(e.referenceLines, !!e.horizontal);
   let n;
   if (!e.stacked && !e.normalized) {
     const o = e.beginAtZero !== !1;
     n = [e.yMin ?? (o ? 0 : "auto"), e.yMax ?? "auto"];
   }
-  const r = e.valueAxis ? We(e.valueAxis) : void 0;
+  const r = e.valueAxis ? Ge(e.valueAxis) : void 0;
   if (!n && !r)
     return { referenceLines: t };
   const a = { ...n && { domain: n }, ...r };
   return e.horizontal ? { xAxisProps: a, referenceLines: t } : { yAxisProps: a, referenceLines: t };
 }
-function Ge(e, t, n) {
+function Oe(e, t, n) {
   return e !== void 0 ? e : t.length === 1 && n.length <= 8;
 }
-const ne = 14;
-function Oe(e) {
-  return e.length <= ne ? e : `${e.slice(0, ne - 1)}…`;
-}
+const re = 14;
 function je(e) {
+  return e.length <= re ? e : `${e.slice(0, re - 1)}…`;
+}
+function Ke(e) {
   var o;
-  const t = typeof e.x == "number" ? e.x : Number(e.x) || 0, n = typeof e.y == "number" ? e.y : Number(e.y) || 0, r = String(((o = e.payload) == null ? void 0 : o.value) ?? ""), a = Oe(r);
+  const t = typeof e.x == "number" ? e.x : Number(e.x) || 0, n = typeof e.y == "number" ? e.y : Number(e.y) || 0, r = String(((o = e.payload) == null ? void 0 : o.value) ?? ""), a = je(r);
   return /* @__PURE__ */ i("g", { transform: `translate(${t},${n})`, children: /* @__PURE__ */ y(
     "text",
     {
@@ -117,16 +117,16 @@ function je(e) {
     }
   ) });
 }
-function Ke(e) {
+function Xe(e) {
   return {
     fontWeight: 700,
     fill: e
   };
 }
-function Xe() {
+function qe() {
   return {
     yAxisProps: {
-      tick: je,
+      tick: Ke,
       width: 96
     },
     barChartProps: {
@@ -134,14 +134,14 @@ function Xe() {
     }
   };
 }
-function qe() {
+function Ve() {
   return {
     barChartProps: {
       margin: { top: 22 }
     }
   };
 }
-function ft({
+function ht({
   categories: e,
   series: t,
   height: n = 240,
@@ -153,16 +153,16 @@ function ft({
   beginAtZero: d,
   yMin: l,
   yMax: u,
-  referenceLines: g,
+  referenceLines: m,
   style: v,
   extra: h,
   smooth: k
 }) {
-  const T = (h == null ? void 0 : h.smooth) ?? k, C = O(), P = le(), M = ce(e, t), $ = de(t, C), b = !!(r && (h != null && h.stacked)), F = fe({
+  const L = (h == null ? void 0 : h.smooth) ?? k, T = j(), P = de(), M = ue(e, t), $ = fe(t, T), b = !!(r && (h != null && h.stacked)), F = pe({
     beginAtZero: d,
     yMin: l,
     yMax: u,
-    referenceLines: g,
+    referenceLines: m,
     horizontal: !1,
     stacked: b,
     valueAxis: h == null ? void 0 : h.valueAxis
@@ -171,23 +171,22 @@ function ft({
     data: M,
     dataKey: "category",
     series: $,
-    curveType: T ? "monotone" : "linear",
+    curveType: L ? "monotone" : "linear",
     withLegend: t.length > 1,
-    legendProps: ie,
-    valueFormatter: ue(a, o),
+    legendProps: le,
+    valueFormatter: he(a, o),
     withPointLabels: c ?? e.length <= 20,
     tooltipProps: f ? void 0 : { cursor: !1 },
     styles: {
-      ...se,
+      ...ce,
       legendItemName: { color: P.textColor }
     },
-    ...P,
     ...F,
     style: v
   };
-  return r ? /* @__PURE__ */ i(Ee, { ...A, type: b ? "stacked" : "default" }) : /* @__PURE__ */ i(Ne, { ...A });
+  return r ? /* @__PURE__ */ i(Ie, { ...A, type: b ? "stacked" : "default" }) : /* @__PURE__ */ i(Ne, { ...A });
 }
-function ht({
+function pt({
   categories: e,
   series: t,
   height: n = 240,
@@ -199,57 +198,56 @@ function ht({
   showValues: d,
   beginAtZero: l,
   yMin: u,
-  yMax: g,
+  yMax: m,
   referenceLines: v,
   style: h,
   extra: k
 }) {
-  const T = O(), C = le(), P = ce(e, t), M = o ? "percent" : r ? "stacked" : "default", $ = fe({
+  const L = j(), T = de(), P = ue(e, t), M = o ? "percent" : r ? "stacked" : "default", $ = pe({
     beginAtZero: l,
     yMin: u,
-    yMax: g,
+    yMax: m,
     referenceLines: v,
     horizontal: a,
     stacked: r,
     normalized: o,
     valueAxis: k == null ? void 0 : k.valueAxis
-  }), b = !r && !o && Ge(d, t, e);
+  }), b = !r && !o && Oe(d, t, e);
   return /* @__PURE__ */ i(
-    Fe,
+    Ee,
     {
       h: n,
       data: P,
       dataKey: "category",
-      series: de(t, T),
+      series: fe(t, L),
       type: M,
       orientation: a ? "vertical" : "horizontal",
       withLegend: t.length > 1,
-      legendProps: ie,
-      valueFormatter: ue(c, f),
+      legendProps: le,
+      valueFormatter: he(c, f),
       withBarValueLabel: b,
-      ...b ? { valueLabelProps: Ke(C.barLabelColor) } : {},
-      ...a ? Xe() : b ? qe() : {},
+      ...b ? { valueLabelProps: Xe(T.barLabelColor) } : {},
+      ...a ? qe() : b ? Ve() : {},
       styles: {
-        ...se,
-        legendItemName: { color: C.textColor }
+        ...ce,
+        legendItemName: { color: T.textColor }
       },
-      ...C,
       ...$,
       style: h
     }
   );
 }
-const Ve = 180, Ye = 540;
-function Ze(e, t) {
+const Ye = 180, Ze = 540;
+function Je(e, t) {
   if (t <= 0)
     return "0%";
   const n = e / t * 100;
   return n < 10 && Math.abs(n - Math.round(n)) > 0.05 ? `${n.toFixed(1)}%` : `${Math.round(n)}%`;
 }
-function Je(e) {
+function Ue(e) {
   return Math.max(28, Math.round(e * 0.22));
 }
-function Ue(e) {
+function Qe(e) {
   return e.map((t) => ({
     dataKey: t.name,
     value: t.name,
@@ -257,14 +255,14 @@ function Ue(e) {
     type: "circle"
   }));
 }
-function Qe(e, t) {
+function et(e, t) {
   return e.map((n) => ({
     name: n.name,
     color: n.color,
-    label: `${n.name} ${Ze(n.value, t)}`
+    label: `${n.name} ${Je(n.value, t)}`
   }));
 }
-function et({
+function tt({
   total: e,
   family: t,
   primary: n,
@@ -285,27 +283,27 @@ function et({
     }
   );
 }
-function pt({ data: e, size: t = 200, donut: n, style: r }) {
-  const [a, o] = D(null), c = m(), f = O(), d = e.map((h, k) => ({
+function yt({ data: e, size: t = 200, donut: n, style: r }) {
+  const [a, o] = D(null), c = g(), f = j(), d = e.map((h, k) => ({
     name: h.label,
     value: h.value,
     color: f(h.tone, k)
   })), l = d.reduce((h, k) => h + k.value, 0), u = {
-    startAngle: Ve,
-    endAngle: Ye
-  }, g = (h) => ({
+    startAngle: Ye,
+    endAngle: Ze
+  }, m = (h) => ({
     opacity: a === null || a === h ? 1 : 0.35
   }), v = n ? /* @__PURE__ */ i(
-    Ie,
+    ze,
     {
       data: d,
       size: t,
-      thickness: Je(t),
+      thickness: Ue(t),
       withTooltip: !0,
-      cellProps: (h) => g(h.name),
+      cellProps: (h) => m(h.name),
       ...u,
       children: /* @__PURE__ */ i(
-        et,
+        tt,
         {
           total: l,
           family: c.typography.fontFamily,
@@ -315,13 +313,13 @@ function pt({ data: e, size: t = 200, donut: n, style: r }) {
       )
     }
   ) : /* @__PURE__ */ i(
-    ze,
+    Re,
     {
       data: d,
       size: t,
       withTooltip: !0,
       withLabelsLine: !1,
-      cellProps: (h) => g(h.name),
+      cellProps: (h) => m(h.name),
       ...u
     }
   );
@@ -351,10 +349,10 @@ function pt({ data: e, size: t = 200, donut: n, style: r }) {
           }
         ),
         /* @__PURE__ */ i(
-          Re,
+          _e,
           {
-            payload: Ue(d),
-            series: Qe(d, l),
+            payload: Qe(d),
+            series: et(d, l),
             legendPosition: "bottom",
             centered: !0,
             onHighlight: o,
@@ -376,7 +374,7 @@ function pt({ data: e, size: t = 200, donut: n, style: r }) {
     }
   );
 }
-function yt(e) {
+function mt(e) {
   const {
     nodes: t,
     edges: n,
@@ -386,21 +384,21 @@ function yt(e) {
     rankGap: c = 64,
     nodeGap: f = 48,
     padding: d = 24
-  } = e, l = t.map((s) => s.id), u = new Set(l), g = /* @__PURE__ */ new Map();
-  for (const s of l) g.set(s, []);
+  } = e, l = t.map((s) => s.id), u = new Set(l), m = /* @__PURE__ */ new Map();
+  for (const s of l) m.set(s, []);
   for (const s of n)
-    u.has(s.from) && u.has(s.to) && g.get(s.from).push(s.to);
-  const v = 0, h = 1, k = 2, T = new Map(l.map((s) => [s, v])), C = /* @__PURE__ */ new Set(), P = (s, p) => `${s}\0${p}`, M = (s) => {
-    T.set(s, h);
-    for (const p of g.get(s) ?? []) {
-      const x = T.get(p);
-      x === h ? C.add(P(s, p)) : x === v && M(p);
+    u.has(s.from) && u.has(s.to) && m.get(s.from).push(s.to);
+  const v = 0, h = 1, k = 2, L = new Map(l.map((s) => [s, v])), T = /* @__PURE__ */ new Set(), P = (s, p) => `${s}\0${p}`, M = (s) => {
+    L.set(s, h);
+    for (const p of m.get(s) ?? []) {
+      const x = L.get(p);
+      x === h ? T.add(P(s, p)) : x === v && M(p);
     }
-    T.set(s, k);
+    L.set(s, k);
   };
-  for (const s of l) T.get(s) === v && M(s);
+  for (const s of l) L.get(s) === v && M(s);
   const $ = n.filter(
-    (s) => u.has(s.from) && u.has(s.to) && !C.has(P(s.from, s.to))
+    (s) => u.has(s.from) && u.has(s.to) && !T.has(P(s.from, s.to))
   ), b = new Map(l.map((s) => [s, 0])), F = new Map(l.map((s) => [s, []]));
   for (const s of $)
     F.get(s.from).push(s.to), b.set(s.to, (b.get(s.to) ?? 0) + 1);
@@ -415,32 +413,32 @@ function yt(e) {
     const p = A.get(s);
     B.has(p) || B.set(p, []), B.get(p).push(s);
   }
-  const E = [...B.keys()].sort((s, p) => s - p), S = r === "vertical", X = (s) => s * (S ? a : o) + Math.max(0, s - 1) * f, q = Math.max(
+  const E = [...B.keys()].sort((s, p) => s - p), S = r === "vertical", q = (s) => s * (S ? a : o) + Math.max(0, s - 1) * f, V = Math.max(
     0,
-    ...E.map((s) => X(B.get(s).length))
-  ), N = /* @__PURE__ */ new Map(), V = [];
+    ...E.map((s) => q(B.get(s).length))
+  ), I = /* @__PURE__ */ new Map(), Y = [];
   E.forEach((s, p) => {
-    const x = B.get(s), R = X(x.length), _ = d + (q - R) / 2, I = d + p * ((S ? o : a) + c);
-    x.forEach((U, Q) => {
-      const ee = _ + Q * ((S ? a : o) + f), ye = S ? ee : I, me = S ? I : ee;
-      N.set(U, { id: U, x: ye, y: me, rank: s, order: Q });
-    }), V.push({
+    const x = B.get(s), R = q(x.length), _ = d + (V - R) / 2, N = d + p * ((S ? o : a) + c);
+    x.forEach((Q, ee) => {
+      const te = _ + ee * ((S ? a : o) + f), ge = S ? te : N, xe = S ? N : te;
+      I.set(Q, { id: Q, x: ge, y: xe, rank: s, order: ee });
+    }), Y.push({
       rank: s,
-      x: S ? _ : I,
-      y: S ? I : _,
+      x: S ? _ : N,
+      y: S ? N : _,
       width: S ? R : a,
       height: S ? o : R,
       nodeIds: x
     });
   });
-  const Y = (s, p) => s ? S ? {
+  const Z = (s, p) => s ? S ? {
     x: s.x + a / 2,
     y: p === "source" ? s.y + o : s.y
   } : {
     x: p === "source" ? s.x + a : s.x,
     y: s.y + o / 2
-  } : { x: 0, y: 0 }, pe = n.filter((s) => u.has(s.from) && u.has(s.to)).map((s) => {
-    const p = Y(N.get(s.from), "source"), x = Y(N.get(s.to), "target");
+  } : { x: 0, y: 0 }, me = n.filter((s) => u.has(s.from) && u.has(s.to)).map((s) => {
+    const p = Z(I.get(s.from), "source"), x = Z(I.get(s.to), "target");
     return {
       from: s.from,
       to: s.to,
@@ -448,19 +446,19 @@ function yt(e) {
       sourceY: p.y,
       targetX: x.x,
       targetY: x.y,
-      isBackEdge: C.has(P(s.from, s.to))
+      isBackEdge: T.has(P(s.from, s.to))
     };
-  }), Z = d * 2 + E.length * (S ? o : a) + Math.max(0, E.length - 1) * c, J = d * 2 + q;
+  }), J = d * 2 + E.length * (S ? o : a) + Math.max(0, E.length - 1) * c, U = d * 2 + V;
   return {
-    nodes: [...N.values()],
-    edges: pe,
-    ranks: V,
+    nodes: [...I.values()],
+    edges: me,
+    ranks: Y,
     direction: r,
-    width: S ? J : Z,
-    height: S ? Z : J
+    width: S ? U : J,
+    height: S ? J : U
   };
 }
-function mt({
+function gt({
   additions: e = 0,
   deletions: t = 0,
   style: n
@@ -489,19 +487,19 @@ function mt({
     }
   );
 }
-const tt = {
+const nt = {
   added: "+",
   removed: "-",
   unchanged: " "
 };
-function gt({
+function xt({
   lines: e,
   showLineNumbers: t = !0,
   coloredLineNumbers: n = !0,
   showAccentStrip: r = !0,
   style: a
 }) {
-  const o = m(), c = (l) => l === "added" ? o.diff.insertedLine : l === "removed" ? o.diff.removedLine : "transparent", f = (l) => l === "added" ? o.diff.stripAdded : l === "removed" ? o.diff.stripRemoved : "transparent", d = (l) => n && l === "added" ? w.added : n && l === "removed" ? w.deleted : o.text.tertiary;
+  const o = g(), c = (l) => l === "added" ? o.diff.insertedLine : l === "removed" ? o.diff.removedLine : "transparent", f = (l) => l === "added" ? o.diff.stripAdded : l === "removed" ? o.diff.stripRemoved : "transparent", d = (l) => n && l === "added" ? w.added : n && l === "removed" ? w.deleted : o.text.tertiary;
   return /* @__PURE__ */ i(
     "div",
     {
@@ -547,7 +545,7 @@ function gt({
                   userSelect: "none",
                   color: d(l.type)
                 },
-                children: tt[l.type]
+                children: nt[l.type]
               }
             ),
             /* @__PURE__ */ i(
@@ -569,8 +567,8 @@ function gt({
     }
   );
 }
-function nt({ status: e }) {
-  const t = m(), n = e === "completed" ? w.success : e === "in_progress" ? t.accent.primary : e === "cancelled" ? w.danger : t.text.tertiary;
+function rt({ status: e }) {
+  const t = g(), n = e === "completed" ? w.success : e === "in_progress" ? t.accent.primary : e === "cancelled" ? w.danger : t.text.tertiary;
   return /* @__PURE__ */ y(
     "svg",
     {
@@ -606,13 +604,13 @@ function nt({ status: e }) {
     }
   );
 }
-function rt({
+function ot({
   todos: e,
   dimmedTodoIds: t,
   onTodoClick: n,
   style: r
 }) {
-  const a = m();
+  const a = g();
   return e.length === 0 ? null : /* @__PURE__ */ i("div", { style: { display: "flex", flexDirection: "column", ...r }, children: e.map((o) => {
     const c = t == null ? void 0 : t.has(o.id);
     return /* @__PURE__ */ y(
@@ -636,7 +634,7 @@ function rt({
           opacity: c ? 0.45 : 1
         },
         children: [
-          /* @__PURE__ */ i(nt, { status: o.status }),
+          /* @__PURE__ */ i(rt, { status: o.status }),
           /* @__PURE__ */ i(
             "span",
             {
@@ -653,14 +651,14 @@ function rt({
     );
   }) });
 }
-function xt({
+function vt({
   todos: e,
   dimmedTodoIds: t,
   defaultExpanded: n = !1,
   onTodoClick: r,
   style: a
 }) {
-  const o = m(), [c, f] = D(n);
+  const o = g(), [c, f] = D(n);
   if (e.length === 0) return null;
   const d = e.filter((l) => l.status === "completed").length;
   return /* @__PURE__ */ y(
@@ -728,7 +726,7 @@ function xt({
           }
         ),
         c && /* @__PURE__ */ i("div", { style: { padding: 6 }, children: /* @__PURE__ */ i(
-          rt,
+          ot,
           {
             todos: e,
             dimmedTodoIds: t,
@@ -739,7 +737,7 @@ function xt({
     }
   );
 }
-function vt(e, t) {
+function bt(e, t) {
   const n = `canvas:${e}`, [r, a] = D(() => {
     if (typeof localStorage > "u") return t;
     try {
@@ -763,14 +761,14 @@ function vt(e, t) {
   );
   return [r, o];
 }
-function bt() {
+function St() {
   return G((e) => {
   }, []);
 }
-function St(e, t) {
+function kt(e, t) {
   return { ...e, ...t };
 }
-function j(e, t, n) {
+function K(e, t, n) {
   const r = e.typography[t];
   return {
     fontFamily: e.typography.fontFamily,
@@ -782,25 +780,25 @@ function j(e, t, n) {
     ...n
   };
 }
-function kt({ children: e, style: t }) {
-  const n = m();
-  return /* @__PURE__ */ i(W, { order: 1, style: j(n, "h1", t), children: e });
-}
 function wt({ children: e, style: t }) {
-  const n = m();
-  return /* @__PURE__ */ i(W, { order: 2, style: j(n, "h2", t), children: e });
+  const n = g();
+  return /* @__PURE__ */ i(W, { order: 1, style: K(n, "h1", t), children: e });
 }
 function Ct({ children: e, style: t }) {
-  const n = m();
-  return /* @__PURE__ */ i(W, { order: 3, style: j(n, "h3", t), children: e });
+  const n = g();
+  return /* @__PURE__ */ i(W, { order: 2, style: K(n, "h2", t), children: e });
+}
+function Lt({ children: e, style: t }) {
+  const n = g();
+  return /* @__PURE__ */ i(W, { order: 3, style: K(n, "h3", t), children: e });
 }
-const ot = {
+const at = {
   normal: 400,
   medium: 500,
   semibold: 600,
   bold: 700
-};
-function Lt({
+}, oe = ie(!1);
+function Tt({
   children: e,
   tone: t = "primary",
   size: n = "body",
@@ -810,27 +808,28 @@ function Lt({
   truncate: c,
   style: f
 }) {
-  const d = m();
-  return /* @__PURE__ */ i(
+  const d = g(), u = O(oe) && r === "p" ? "span" : r, m = r === "p";
+  return /* @__PURE__ */ i(oe.Provider, { value: !0, children: /* @__PURE__ */ i(
     H,
     {
-      component: r,
+      component: u,
       size: n === "small" ? "xs" : "sm",
-      fw: ot[a],
+      fw: at[a],
       c: t === "primary" ? void 0 : d.text[t],
       truncate: c,
       style: {
         fontStyle: o ? "italic" : void 0,
         ...t === "primary" ? { color: d.text.primary } : void 0,
+        ...m && u === "span" ? { display: "block" } : void 0,
         fontFamily: d.typography.fontFamily,
         ...f
       },
       children: e
     }
-  );
+  ) });
 }
-function Tt({ children: e, style: t }) {
-  const n = m();
+function Pt({ children: e, style: t }) {
+  const n = g();
   return /* @__PURE__ */ i(
     "code",
     {
@@ -847,8 +846,8 @@ function Tt({ children: e, style: t }) {
     }
   );
 }
-function Pt({ children: e, href: t, style: n }) {
-  const r = m();
+function At({ children: e, href: t, style: n }) {
+  const r = g();
   return /* @__PURE__ */ i(
     "a",
     {
@@ -860,17 +859,17 @@ function Pt({ children: e, href: t, style: n }) {
     }
   );
 }
-function At({ children: e, gap: t, style: n }) {
-  return /* @__PURE__ */ i(Pe, { gap: t, style: n, children: e });
+function Mt({ children: e, gap: t, style: n }) {
+  return /* @__PURE__ */ i(Me, { gap: t, style: n, children: e });
 }
-const re = {
+const ae = {
   start: "flex-start",
   center: "center",
   end: "flex-end",
   stretch: "stretch",
   "space-between": "space-between"
 };
-function Mt({
+function Bt({
   children: e,
   gap: t,
   align: n = "center",
@@ -879,21 +878,21 @@ function Mt({
   style: o
 }) {
   return /* @__PURE__ */ i(
-    Le,
+    Pe,
     {
       gap: t,
-      align: re[n],
-      justify: re[r],
+      align: ae[n],
+      justify: ae[r],
       wrap: a ? "wrap" : "nowrap",
       style: o,
       children: e
     }
   );
 }
-function Bt() {
+function $t() {
   return /* @__PURE__ */ i("div", { style: { flex: 1 } });
 }
-function $t({ children: e, columns: t, gap: n = 16, align: r, style: a }) {
+function Dt({ children: e, columns: t, gap: n = 16, align: r, style: a }) {
   const o = typeof t == "number" ? `repeat(${t}, minmax(0, 1fr))` : t;
   return /* @__PURE__ */ i(
     "div",
@@ -909,16 +908,16 @@ function $t({ children: e, columns: t, gap: n = 16, align: r, style: a }) {
     }
   );
 }
-function Dt({ style: e }) {
-  return /* @__PURE__ */ i(ke, { style: e });
+function Ft({ style: e }) {
+  return /* @__PURE__ */ i(Ce, { style: e });
 }
-const K = $e({
+const X = ie({
   collapsible: !1,
   open: !0,
   toggle: () => {
   }
 });
-function Ft({
+function Et({
   children: e,
   variant: t = "default",
   collapsible: n = !1,
@@ -927,12 +926,12 @@ function Ft({
   onOpenChange: o,
   style: c
 }) {
-  const f = m(), [d, l] = D(r), u = a ?? d, g = G(() => {
+  const f = g(), [d, l] = D(r), u = a ?? d, m = G(() => {
     const v = !u;
     a === void 0 && l(v), o == null || o(v);
   }, [u, a, o]);
   return /* @__PURE__ */ i(
-    be,
+    ke,
     {
       withBorder: t !== "borderless",
       radius: f.radius.md,
@@ -942,12 +941,12 @@ function Ft({
         borderColor: f.stroke.secondary,
         ...c
       },
-      children: /* @__PURE__ */ i(K.Provider, { value: { collapsible: n, open: u, toggle: g }, children: e })
+      children: /* @__PURE__ */ i(X.Provider, { value: { collapsible: n, open: u, toggle: m }, children: e })
     }
   );
 }
-function Et({ children: e, trailing: t, style: n }) {
-  const r = m(), { collapsible: a, open: o, toggle: c } = oe(K);
+function It({ children: e, trailing: t, style: n }) {
+  const r = g(), { collapsible: a, open: o, toggle: c } = O(X);
   return /* @__PURE__ */ y(
     "div",
     {
@@ -969,7 +968,7 @@ function Et({ children: e, trailing: t, style: n }) {
       },
       children: [
         /* @__PURE__ */ y("span", { style: { display: "inline-flex", alignItems: "center", gap: 6 }, children: [
-          a && /* @__PURE__ */ i(he, { expanded: o }),
+          a && /* @__PURE__ */ i(ye, { expanded: o }),
           e
         ] }),
         t != null && /* @__PURE__ */ i("span", { children: t })
@@ -978,10 +977,10 @@ function Et({ children: e, trailing: t, style: n }) {
   );
 }
 function Nt({ children: e, style: t }) {
-  const { collapsible: n, open: r } = oe(K);
+  const { collapsible: n, open: r } = O(X);
   return n && !r ? null : /* @__PURE__ */ i("div", { style: { padding: 14, ...t }, children: e });
 }
-function he({ expanded: e }) {
+function ye({ expanded: e }) {
   return /* @__PURE__ */ i(
     "svg",
     {
@@ -1007,8 +1006,8 @@ function he({ expanded: e }) {
     }
   );
 }
-function It({ value: e, label: t, tone: n, style: r }) {
-  const a = m();
+function zt({ value: e, label: t, tone: n, style: r }) {
+  const a = g();
   return /* @__PURE__ */ y("div", { style: r, children: [
     /* @__PURE__ */ i(
       H,
@@ -1036,7 +1035,7 @@ function It({ value: e, label: t, tone: n, style: r }) {
     )
   ] });
 }
-function zt({
+function Rt({
   children: e,
   active: t,
   tone: n = "neutral",
@@ -1048,9 +1047,9 @@ function zt({
   onClick: d
 }) {
   return /* @__PURE__ */ i(
-    Ce,
+    Te,
     {
-      color: ae[n],
+      color: se[n],
       variant: t ? "filled" : "light",
       size: r === "sm" ? "sm" : "md",
       leftSection: a,
@@ -1066,7 +1065,7 @@ function zt({
     }
   );
 }
-function Rt({
+function _t({
   children: e,
   tone: t = "neutral",
   title: n,
@@ -1074,9 +1073,9 @@ function Rt({
   style: a
 }) {
   return /* @__PURE__ */ i(
-    ve,
+    Se,
     {
-      color: ae[t],
+      color: se[t],
       title: n,
       icon: r,
       variant: "light",
@@ -1085,14 +1084,14 @@ function Rt({
     }
   );
 }
-const at = {
+const it = {
   success: "rgba(31,138,101,0.12)",
   danger: "rgba(207,45,86,0.12)",
   warning: "rgba(232,163,61,0.14)",
   info: "rgba(46,121,181,0.12)",
   neutral: "rgba(136,136,168,0.12)"
 };
-function _t({
+function Ht({
   headers: e,
   rows: t,
   columnAlign: n,
@@ -1104,7 +1103,7 @@ function _t({
   emptyMessage: d
 }) {
   return /* @__PURE__ */ y(
-    L,
+    C,
     {
       withTableBorder: a,
       withColumnBorders: !1,
@@ -1113,15 +1112,15 @@ function _t({
       highlightOnHover: !0,
       style: f,
       children: [
-        /* @__PURE__ */ i(L.Thead, { children: /* @__PURE__ */ i(L.Tr, { children: e.map((l, u) => /* @__PURE__ */ i(L.Th, { ta: (n == null ? void 0 : n[u]) ?? "left", children: l }, u)) }) }),
-        /* @__PURE__ */ i(L.Tbody, { children: t.length === 0 ? /* @__PURE__ */ i(L.Tr, { children: /* @__PURE__ */ i(L.Td, { colSpan: e.length, ta: "center", c: "dimmed", children: d ?? "No data" }) }) : t.map((l, u) => {
-          const g = r == null ? void 0 : r[u];
+        /* @__PURE__ */ i(C.Thead, { children: /* @__PURE__ */ i(C.Tr, { children: e.map((l, u) => /* @__PURE__ */ i(C.Th, { ta: (n == null ? void 0 : n[u]) ?? "left", children: l }, u)) }) }),
+        /* @__PURE__ */ i(C.Tbody, { children: t.length === 0 ? /* @__PURE__ */ i(C.Tr, { children: /* @__PURE__ */ i(C.Td, { colSpan: e.length, ta: "center", c: "dimmed", children: d ?? "No data" }) }) : t.map((l, u) => {
+          const m = r == null ? void 0 : r[u];
           return /* @__PURE__ */ i(
-            L.Tr,
+            C.Tr,
             {
-              style: g ? { background: at[g] } : void 0,
+              style: m ? { background: it[m] } : void 0,
               children: e.map((v, h) => /* @__PURE__ */ i(
-                L.Td,
+                C.Td,
                 {
                   ta: (n == null ? void 0 : n[h]) ?? "left",
                   children: l[h]
@@ -1136,12 +1135,12 @@ function _t({
     }
   );
 }
-const it = {
+const st = {
   primary: "filled",
   secondary: "default",
   ghost: "subtle"
 };
-function Ht({
+function Wt({
   children: e,
   variant: t = "secondary",
   disabled: n,
@@ -1150,9 +1149,9 @@ function Ht({
   onClick: o
 }) {
   return /* @__PURE__ */ i(
-    xe,
+    be,
     {
-      variant: it[t],
+      variant: st[t],
       color: t === "primary" ? "accent" : void 0,
       size: "xs",
       disabled: n,
@@ -1163,7 +1162,7 @@ function Ht({
     }
   );
 }
-function Wt({
+function Gt({
   children: e,
   onClick: t,
   disabled: n,
@@ -1173,7 +1172,7 @@ function Wt({
   style: c
 }) {
   return /* @__PURE__ */ i(
-    we,
+    Le,
     {
       variant: a === "circle" ? "light" : "subtle",
       radius: a === "circle" ? "xl" : "sm",
@@ -1188,7 +1187,7 @@ function Wt({
     }
   );
 }
-function Gt({
+function Ot({
   value: e,
   onChange: t,
   options: n,
@@ -1197,7 +1196,7 @@ function Gt({
   style: o
 }) {
   return /* @__PURE__ */ i(
-    Te,
+    Ae,
     {
       value: e,
       data: n,
@@ -1211,7 +1210,7 @@ function Gt({
     }
   );
 }
-function Ot({
+function jt({
   checked: e,
   onChange: t,
   disabled: n,
@@ -1219,7 +1218,7 @@ function Ot({
   style: a
 }) {
   return /* @__PURE__ */ i(
-    Se,
+    we,
     {
       checked: e,
       disabled: n,
@@ -1229,7 +1228,7 @@ function Ot({
     }
   );
 }
-function jt({
+function Kt({
   checked: e,
   onChange: t,
   disabled: n,
@@ -1237,7 +1236,7 @@ function jt({
   style: a
 }) {
   return /* @__PURE__ */ i(
-    Be,
+    De,
     {
       checked: e,
       disabled: n,
@@ -1247,7 +1246,7 @@ function jt({
     }
   );
 }
-function Kt({
+function Xt({
   value: e,
   onChange: t,
   placeholder: n,
@@ -1256,7 +1255,7 @@ function Kt({
   style: o
 }) {
   return /* @__PURE__ */ i(
-    Me,
+    $e,
     {
       value: e,
       placeholder: n,
@@ -1267,7 +1266,7 @@ function Kt({
     }
   );
 }
-function Xt({
+function qt({
   value: e,
   onChange: t,
   placeholder: n,
@@ -1276,7 +1275,7 @@ function Xt({
   style: o
 }) {
   return /* @__PURE__ */ i(
-    Ae,
+    Be,
     {
       value: e,
       placeholder: n,
@@ -1288,8 +1287,8 @@ function Xt({
     }
   );
 }
-function qt({ color: e, style: t }) {
-  const n = m();
+function Vt({ color: e, style: t }) {
+  const n = g();
   return /* @__PURE__ */ i(
     "span",
     {
@@ -1305,14 +1304,14 @@ function qt({ color: e, style: t }) {
     }
   );
 }
-function Vt({
+function Yt({
   segments: e,
   total: t,
   topLeftLabel: n,
   topRightLabel: r,
   style: a
 }) {
-  const o = m(), c = t > 0 ? t : 1, f = e.reduce(
+  const o = g(), c = t > 0 ? t : 1, f = e.reduce(
     (l, u) => l + (Number.isFinite(u.value) && u.value > 0 ? u.value : 0),
     0
   ), d = Math.max(0, c - f);
@@ -1335,12 +1334,12 @@ function Vt({
     ),
     /* @__PURE__ */ y("div", { style: { display: "flex", gap: 2, height: 8 }, children: [
       e.map((l, u) => {
-        const g = Number.isFinite(l.value) && l.value > 0 ? l.value : 0, v = o.category[l.color ?? te[u % te.length]];
+        const m = Number.isFinite(l.value) && l.value > 0 ? l.value : 0, v = o.category[l.color ?? ne[u % ne.length]];
         return /* @__PURE__ */ i(
           "div",
           {
             style: {
-              width: `${g / c * 100}%`,
+              width: `${m / c * 100}%`,
               background: v,
               borderRadius: 3
             }
@@ -1361,7 +1360,7 @@ function Vt({
     ] })
   ] });
 }
-function Yt({
+function Zt({
   title: e,
   leading: t,
   count: n,
@@ -1370,7 +1369,7 @@ function Yt({
   defaultOpen: o = !1,
   style: c
 }) {
-  const f = m(), [d, l] = D(o);
+  const f = g(), [d, l] = D(o);
   return /* @__PURE__ */ y("div", { style: c, children: [
     /* @__PURE__ */ y(
       "div",
@@ -1387,7 +1386,7 @@ function Yt({
           fontSize: 14
         },
         children: [
-          /* @__PURE__ */ i(he, { expanded: d }),
+          /* @__PURE__ */ i(ye, { expanded: d }),
           t,
           /* @__PURE__ */ i("span", { style: { fontWeight: 500 }, children: e }),
           n != null && /* @__PURE__ */ i("span", { style: { color: f.text.tertiary, fontSize: 12 }, children: n }),
@@ -1400,58 +1399,58 @@ function Yt({
   ] });
 }
 export {
-  ht as BarChart,
-  Ht as Button,
-  Rt as Callout,
-  Ft as Card,
+  pt as BarChart,
+  Wt as Button,
+  _t as Callout,
+  Et as Card,
   Nt as CardBody,
-  Et as CardHeader,
-  Ot as Checkbox,
-  Tt as Code,
-  Yt as CollapsibleSection,
-  mt as DiffStats,
-  gt as DiffView,
-  Dt as Divider,
-  $t as Grid,
-  kt as H1,
-  wt as H2,
-  Ct as H3,
-  Wt as IconButton,
-  ft as LineChart,
-  Pt as Link,
-  pt as PieChart,
-  zt as Pill,
-  Mt as Row,
-  Gt as Select,
-  Bt as Spacer,
-  At as Stack,
-  It as Stat,
-  qt as Swatch,
-  _t as Table,
-  Lt as Text,
-  Xt as TextArea,
-  Kt as TextInput,
-  rt as TodoList,
-  xt as TodoListCard,
-  jt as Toggle,
-  Vt as UsageBar,
-  rn as canvasPaletteDark,
-  on as canvasPaletteGrokDark,
-  an as canvasPaletteGrokLight,
-  sn as canvasPaletteLight,
-  ln as canvasTokens,
-  cn as canvasTokensLight,
-  dn as categoryPaletteDark,
-  un as categoryPaletteLight,
-  fn as colorPalette,
-  yt as computeDAGLayout,
-  St as mergeStyle,
-  te as usageColorSequence,
-  bt as useCanvasAction,
-  vt as useCanvasState,
-  Ut as useEffect,
-  m as useHostTheme,
-  Qt as useMemo,
-  en as useRef,
-  tn as useState
+  It as CardHeader,
+  jt as Checkbox,
+  Pt as Code,
+  Zt as CollapsibleSection,
+  gt as DiffStats,
+  xt as DiffView,
+  Ft as Divider,
+  Dt as Grid,
+  wt as H1,
+  Ct as H2,
+  Lt as H3,
+  Gt as IconButton,
+  ht as LineChart,
+  At as Link,
+  yt as PieChart,
+  Rt as Pill,
+  Bt as Row,
+  Ot as Select,
+  $t as Spacer,
+  Mt as Stack,
+  zt as Stat,
+  Vt as Swatch,
+  Ht as Table,
+  Tt as Text,
+  qt as TextArea,
+  Xt as TextInput,
+  ot as TodoList,
+  vt as TodoListCard,
+  Kt as Toggle,
+  Yt as UsageBar,
+  on as canvasPaletteDark,
+  an as canvasPaletteGrokDark,
+  sn as canvasPaletteGrokLight,
+  ln as canvasPaletteLight,
+  cn as canvasTokens,
+  dn as canvasTokensLight,
+  un as categoryPaletteDark,
+  fn as categoryPaletteLight,
+  hn as colorPalette,
+  mt as computeDAGLayout,
+  kt as mergeStyle,
+  ne as usageColorSequence,
+  St as useCanvasAction,
+  bt as useCanvasState,
+  Qt as useEffect,
+  g as useHostTheme,
+  en as useMemo,
+  tn as useRef,
+  nn as useState
 };