@devalok/shilp-sutra 0.30.0 → 0.32.0

package/dist/ui/charts/index.js

@@ -1,152 +1,153 @@
 "use client";
-import { jsx as e, jsxs as p, Fragment as ee } from "react/jsx-runtime";
-import * as te from "react";
-import { useRef as ve, useState as de, useEffect as ye, useCallback as ke } from "react";
-import { cn as Q } from "../lib/utils.js";
-import { scaleBand as Ge, scaleLinear as ae, scalePoint as Ce } from "d3-scale";
-import { tweens as le, motionProps as se } from "../lib/motion.js";
-import { axisLeft as Xe, axisBottom as De, axisRight as Pe, axisTop as ze } from "d3-axis";
-import { select as Be } from "d3-selection";
-import { u as Ve } from "../../_chunks/motion-provider.js";
-import { m as ne } from "../../_chunks/framer.js";
-import { line as me, curveMonotoneX as ue, curveLinear as Ae, stack as _e, stackOrderNone as je, stackOffsetNone as Te, area as Me, pie as Ye, arc as ge, lineRadial as Oe, curveLinearClosed as We } from "d3-shape";
-const Ie = {
+import { jsx as e, jsxs as p, Fragment as te } from "react/jsx-runtime";
+import * as ne from "react";
+import { useRef as ye, useState as me, useEffect as xe, useCallback as Re } from "react";
+import { cn as H } from "../lib/utils.js";
+import { scaleBand as Xe, scaleLinear as oe, scalePoint as Le } from "d3-scale";
+import { tweens as se, motionProps as ce } from "../lib/motion.js";
+import { axisLeft as De, axisBottom as Pe, axisRight as ze, axisTop as Be } from "d3-axis";
+import { select as Ve } from "d3-selection";
+import { u as _e } from "../../_chunks/motion-provider.js";
+import { m as re } from "../../_chunks/framer.js";
+import { line as he, curveMonotoneX as de, curveLinear as Ae, stack as je, stackOrderNone as Te, stackOffsetNone as Ye, area as Ne, pie as Oe, arc as ve, lineRadial as We, curveLinearClosed as Ie } from "d3-shape";
+const Fe = {
   top: 20,
   right: 20,
   bottom: 40,
   left: 50
-}, xe = te.forwardRef(
+}, be = ne.forwardRef(
   ({
     height: t = 300,
     margin: a,
     className: o,
-    children: y,
-    ...m
-  }, x) => {
-    const c = ve(null), [M, z] = de(0), N = { ...Ie, ...a };
-    ye(() => {
-      if (!c.current) return;
-      const j = new ResizeObserver((P) => {
-        const R = P[0];
-        R && z(R.contentRect.width);
+    ariaLabel: x = "Chart",
+    children: d,
+    ...M
+  }, i) => {
+    const k = ye(null), [G, P] = me(0), v = { ...Fe, ...a };
+    xe(() => {
+      if (!k.current) return;
+      const B = new ResizeObserver((N) => {
+        const z = N[0];
+        z && P(z.contentRect.width);
       });
-      return j.observe(c.current), () => j.disconnect();
+      return B.observe(k.current), () => B.disconnect();
     }, []);
-    const A = Math.max(0, M - N.left - N.right), k = Math.max(0, t - N.top - N.bottom);
+    const R = Math.max(0, G - v.left - v.right), Z = Math.max(0, t - v.top - v.bottom);
     return /* @__PURE__ */ e(
       "div",
       {
-        ref: (j) => {
-          c.current = j, typeof x == "function" ? x(j) : x && (x.current = j);
+        ref: (B) => {
+          k.current = B, typeof i == "function" ? i(B) : i && (i.current = B);
         },
-        className: Q("relative w-full", o),
-        ...m,
-        children: M > 0 && /* @__PURE__ */ e("svg", { width: M, height: t, role: "img", "aria-label": "Chart", children: /* @__PURE__ */ e("g", { transform: `translate(${N.left},${N.top})`, children: y({ width: A, height: k, margin: N }) }) })
+        className: H("relative w-full", o),
+        ...M,
+        children: G > 0 && /* @__PURE__ */ e("svg", { width: G, height: t, role: "img", "aria-label": x, children: /* @__PURE__ */ e("g", { transform: `translate(${v.left},${v.top})`, children: d({ width: R, height: Z, margin: v }) }) })
       }
     );
   }
 );
-xe.displayName = "ChartContainer";
-function K({
+be.displayName = "ChartContainer";
+function ee({
   scale: t,
   orientation: a,
   transform: o,
-  tickCount: y,
-  tickFormat: m,
-  label: x,
-  className: c
+  tickCount: x,
+  tickFormat: d,
+  label: M,
+  className: i
 }) {
-  const M = ve(null);
-  return ye(() => {
-    if (!M.current) return;
-    const N = {
-      top: ze,
-      right: Pe,
-      bottom: De,
-      left: Xe
+  const k = ye(null);
+  return xe(() => {
+    if (!k.current) return;
+    const P = {
+      top: Be,
+      right: ze,
+      bottom: Pe,
+      left: De
     }[a];
-    let A = N(t);
-    y && (A = A.ticks(y)), m && (A = A.tickFormat(m));
-    const k = Be(M.current);
-    k.call(A), k.selectAll(".tick line").attr("stroke", "var(--color-surface-border)"), k.selectAll(".tick text").attr("fill", "var(--color-surface-fg-muted)").attr("font-size", "var(--font-size-xs)"), k.selectAll(".domain").attr("stroke", "var(--color-surface-border-strong)");
-  }, [t, a, y, m]), /* @__PURE__ */ e("g", { ref: M, transform: o, className: c, children: x && /* @__PURE__ */ e(
+    let v = P(t);
+    x && (v = v.ticks(x)), d && (v = v.tickFormat(d));
+    const R = Ve(k.current);
+    R.call(v), R.selectAll(".tick line").attr("stroke", "var(--color-surface-border)"), R.selectAll(".tick text").attr("fill", "var(--color-surface-fg-muted)").attr("font-size", "var(--font-size-xs)"), R.selectAll(".domain").attr("stroke", "var(--color-surface-border-strong)");
+  }, [t, a, x, d]), /* @__PURE__ */ e("g", { ref: k, transform: o, className: i, children: M && /* @__PURE__ */ e(
     "text",
     {
       textAnchor: "middle",
       fill: "var(--color-surface-fg-muted)",
       fontSize: "var(--font-size-sm)",
       ...a === "bottom" ? { x: "50%", dy: 35 } : a === "left" ? { transform: "rotate(-90)", y: -40, x: 0 } : {},
-      children: x
+      children: M
     }
   ) });
 }
-K.displayName = "Axis";
-function he({
+ee.displayName = "Axis";
+function fe({
   width: t,
   height: a,
   xScale: o,
-  yScale: y,
-  horizontal: m = !0,
-  vertical: x = !1
+  yScale: x,
+  horizontal: d = !0,
+  vertical: M = !1
 }) {
   return /* @__PURE__ */ p("g", { className: "grid-lines", children: [
-    m && y?.ticks && y.ticks().map((c, M) => /* @__PURE__ */ e(
+    d && x?.ticks && x.ticks().map((i, k) => /* @__PURE__ */ e(
       "line",
       {
         x1: 0,
         x2: t,
-        y1: y(c),
-        y2: y(c),
+        y1: x(i),
+        y2: x(i),
         stroke: "var(--color-surface-border)",
         strokeDasharray: "3,3",
         opacity: 0.6
       },
-      `h-${M}`
+      `h-${k}`
     )),
-    x && o?.ticks && o.ticks().map((c, M) => /* @__PURE__ */ e(
+    M && o?.ticks && o.ticks().map((i, k) => /* @__PURE__ */ e(
       "line",
       {
-        x1: o(c),
-        x2: o(c),
+        x1: o(i),
+        x2: o(i),
         y1: 0,
         y2: a,
         stroke: "var(--color-surface-border)",
         strokeDasharray: "3,3",
         opacity: 0.6
       },
-      `v-${M}`
+      `v-${k}`
     ))
   ] });
 }
-he.displayName = "GridLines";
-function ce({ items: t, position: a = "bottom", className: o }) {
+fe.displayName = "GridLines";
+function ie({ items: t, position: a = "bottom", className: o }) {
   return /* @__PURE__ */ e(
     "div",
     {
-      className: Q(
+      className: H(
         "flex gap-ds-04 text-ds-sm text-surface-fg-muted",
         a === "left" || a === "right" ? "flex-col" : "flex-row flex-wrap justify-center",
         o
       ),
-      children: t.map((m) => /* @__PURE__ */ p("div", { className: "flex items-center gap-ds-02", children: [
+      children: t.map((d) => /* @__PURE__ */ p("div", { className: "flex items-center gap-ds-02", children: [
         /* @__PURE__ */ e(
           "span",
           {
             className: "inline-block h-3 w-3 shrink-0 rounded-ds-sm",
-            style: { backgroundColor: m.color }
+            style: { backgroundColor: d.color }
           }
         ),
-        /* @__PURE__ */ e("span", { children: m.label })
-      ] }, m.label))
+        /* @__PURE__ */ e("span", { children: d.label })
+      ] }, d.label))
     }
   );
 }
-ce.displayName = "Legend";
-function ie({ state: t, className: a }) {
+ie.displayName = "Legend";
+function ue({ state: t, className: a }) {
   return t.visible ? /* @__PURE__ */ e(
     "div",
     {
-      className: Q(
+      className: H(
         "pointer-events-none absolute z-tooltip",
         "rounded-ds-md border border-surface-border-strong",
         "bg-surface-overlay px-ds-03 py-ds-02",
@@ -159,21 +160,21 @@ function ie({ state: t, className: a }) {
     }
   ) : null;
 }
-ie.displayName = "ChartTooltip";
-function fe() {
-  const [t, a] = de({
+ue.displayName = "ChartTooltip";
+function pe() {
+  const [t, a] = me({
     visible: !1,
     x: 0,
     y: 0,
     content: null
-  }), o = ke((m, x, c) => {
-    a({ visible: !0, x: m, y: x, content: c });
-  }, []), y = ke(() => {
-    a((m) => ({ ...m, visible: !1 }));
+  }), o = Re((d, M, i) => {
+    a({ visible: !0, x: d, y: M, content: i });
+  }, []), x = Re(() => {
+    a((d) => ({ ...d, visible: !1 }));
   }, []);
-  return { tooltip: t, show: o, hide: y };
+  return { tooltip: t, show: o, hide: x };
 }
-const be = [
+const Me = [
   "chart-1",
   "chart-2",
   "chart-3",
@@ -183,157 +184,158 @@ const be = [
   "chart-7",
   "chart-8"
 ];
-function Re(t) {
+function $e(t) {
   return `var(--${t})`;
 }
-function re(t, a = 0) {
-  return t ? be.includes(t) ? Re(t) : t : Re(be[a % be.length]);
+function ae(t, a = 0) {
+  return t ? Me.includes(t) ? $e(t) : t : $e(Me[a % Me.length]);
 }
-function oe() {
-  const { reducedMotion: t } = Ve();
+function le() {
+  const { reducedMotion: t } = _e();
   return t;
 }
-function Fe(t, a = 300) {
+function Ee(t, a = 300) {
   return t ? 0 : a;
 }
-const Ee = te.forwardRef(
+const Ue = ne.forwardRef(
   ({
     data: t,
     xKey: a,
     yKey: o,
-    orientation: y = "vertical",
-    stacked: m = !1,
-    grouped: x = !1,
-    color: c,
-    height: M = 300,
-    showGrid: z = !0,
-    showTooltip: N = !0,
-    showLegend: A = !1,
-    animate: k = !0,
-    barRadius: j = 4,
-    xLabel: P,
-    yLabel: R,
-    seriesLabels: X,
-    className: E,
-    ...W
-  }, U) => {
-    const { tooltip: I, show: T, hide: B } = fe(), q = oe(), d = y === "vertical", w = k && !q, b = Array.isArray(o) ? o : [o], i = b.length > 1, V = i ? b.map(
-      ($, L) => re(
-        Array.isArray(c) ? c[L] : typeof c == "string" ? c : void 0,
+    orientation: x = "vertical",
+    stacked: d = !1,
+    grouped: M = !1,
+    color: i,
+    height: k = 300,
+    showGrid: G = !0,
+    showTooltip: P = !0,
+    showLegend: v = !1,
+    animate: R = !0,
+    barRadius: Z = 4,
+    xLabel: B,
+    yLabel: N,
+    seriesLabels: z,
+    ariaLabel: X,
+    className: W,
+    ...q
+  }, j) => {
+    const { tooltip: T, show: V, hide: J } = pe(), E = le(), m = x === "vertical", S = R && !E, y = Array.isArray(o) ? o : [o], c = y.length > 1, I = c ? y.map(
+      (C, L) => ae(
+        Array.isArray(i) ? i[L] : typeof i == "string" ? i : void 0,
         L
       )
     ) : [
-      re(
-        typeof c == "string" ? c : Array.isArray(c) ? c[0] : void 0,
+      ae(
+        typeof i == "string" ? i : Array.isArray(i) ? i[0] : void 0,
         0
       )
     ];
     return /* @__PURE__ */ p(
-      ne.div,
+      re.div,
       {
-        ref: U,
-        className: Q("relative", E),
-        ...w ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: le.fade } : {},
-        ...se(W),
+        ref: j,
+        className: H("relative", W),
+        ...S ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: se.fade } : {},
+        ...ce(q),
         children: [
-          /* @__PURE__ */ e(xe, { height: M, children: ({ width: $, height: L, margin: u }) => {
-            const s = t.map((S) => String(S[a]));
-            let l;
-            m ? l = Math.max(
+          /* @__PURE__ */ e(be, { height: k, ariaLabel: X ?? "Bar chart", children: ({ width: C, height: L, margin: u }) => {
+            const l = t.map((A) => String(A[a]));
+            let s;
+            d ? s = Math.max(
               ...t.map(
-                (S) => b.reduce((G, C) => G + (Number(S[C]) || 0), 0)
+                (A) => y.reduce((w, $) => w + (Number(A[$]) || 0), 0)
               )
-            ) : l = Math.max(
-              ...t.flatMap((S) => b.map((G) => Number(S[G]) || 0))
+            ) : s = Math.max(
+              ...t.flatMap((A) => y.map((w) => Number(A[w]) || 0))
             );
-            const g = Ge().domain(s).range(d ? [0, $] : [0, L]).padding(0.2), n = ae().domain([0, l * 1.1]).range(d ? [L, 0] : [0, $]).nice(), r = g.bandwidth(), f = i && x ? r / b.length : r;
-            return /* @__PURE__ */ p(ee, { children: [
-              z && /* @__PURE__ */ e(
-                he,
+            const b = Xe().domain(l).range(m ? [0, C] : [0, L]).padding(0.2), n = oe().domain([0, s * 1.1]).range(m ? [L, 0] : [0, C]).nice(), r = b.bandwidth(), f = c && M ? r / y.length : r;
+            return /* @__PURE__ */ p(te, { children: [
+              G && /* @__PURE__ */ e(
+                fe,
                 {
-                  width: $,
+                  width: C,
                   height: L,
-                  yScale: d ? n : void 0,
-                  xScale: d ? void 0 : n,
-                  horizontal: d,
-                  vertical: !d
+                  yScale: m ? n : void 0,
+                  xScale: m ? void 0 : n,
+                  horizontal: m,
+                  vertical: !m
                 }
               ),
-              t.map((S) => {
-                const G = String(S[a]);
-                let C = 0;
-                return b.map((J, h) => {
-                  const v = Number(S[J]) || 0, _ = V[h] || V[0];
-                  let Y, F, H, D;
-                  return d ? (Y = (g(G) ?? 0) + (x && i ? h * f : 0), F = n(m ? C + v : v), H = f, D = m ? n(C) - n(C + v) : L - n(v)) : (Y = m ? n(C) : 0, F = (g(G) ?? 0) + (x && i ? h * f : 0), H = m ? n(C + v) - n(C) : n(v), D = f), m && (C += v), /* @__PURE__ */ e(
+              t.map((A) => {
+                const w = String(A[a]);
+                let $ = 0;
+                return y.map((Q, h) => {
+                  const g = Number(A[Q]) || 0, _ = I[h] || I[0];
+                  let Y, F, K, D;
+                  return m ? (Y = (b(w) ?? 0) + (M && c ? h * f : 0), F = n(d ? $ + g : g), K = f, D = d ? n($) - n($ + g) : L - n(g)) : (Y = d ? n($) : 0, F = (b(w) ?? 0) + (M && c ? h * f : 0), K = d ? n($ + g) - n($) : n(g), D = f), d && ($ += g), /* @__PURE__ */ e(
                     "rect",
                     {
                       x: Y,
                       y: F,
-                      width: Math.max(0, H),
+                      width: Math.max(0, K),
                       height: Math.max(0, D),
-                      rx: j,
+                      rx: Z,
                       fill: _,
                       className: "transition-opacity hover:opacity-80",
-                      onMouseMove: (Z) => {
-                        if (N) {
-                          const O = Z.currentTarget.closest("div")?.getBoundingClientRect();
-                          T(
-                            Z.clientX - (O?.left ?? 0),
-                            Z.clientY - (O?.top ?? 0),
+                      onMouseMove: (U) => {
+                        if (P) {
+                          const O = U.currentTarget.closest("div")?.getBoundingClientRect();
+                          V(
+                            U.clientX - (O?.left ?? 0),
+                            U.clientY - (O?.top ?? 0),
                             /* @__PURE__ */ p("div", { children: [
-                              /* @__PURE__ */ e("div", { className: "font-medium", children: G }),
-                              i && /* @__PURE__ */ e("div", { className: "text-surface-fg-muted", children: X?.[h] ?? J }),
-                              /* @__PURE__ */ e("div", { children: v.toLocaleString() })
+                              /* @__PURE__ */ e("div", { className: "font-medium", children: w }),
+                              c && /* @__PURE__ */ e("div", { className: "text-surface-fg-muted", children: z?.[h] ?? Q }),
+                              /* @__PURE__ */ e("div", { children: g.toLocaleString() })
                             ] })
                           );
                         }
                       },
-                      onMouseLeave: B
+                      onMouseLeave: J
                     },
-                    `${G}-${J}`
+                    `${w}-${Q}`
                   );
                 });
               }),
-              d ? /* @__PURE__ */ p(ee, { children: [
+              m ? /* @__PURE__ */ p(te, { children: [
                 /* @__PURE__ */ e(
-                  K,
+                  ee,
                   {
-                    scale: g,
+                    scale: b,
                     orientation: "bottom",
                     transform: `translate(0,${L})`,
-                    label: P
+                    label: B
                   }
                 ),
-                /* @__PURE__ */ e(K, { scale: n, orientation: "left", label: R })
-              ] }) : /* @__PURE__ */ p(ee, { children: [
+                /* @__PURE__ */ e(ee, { scale: n, orientation: "left", label: N })
+              ] }) : /* @__PURE__ */ p(te, { children: [
                 /* @__PURE__ */ e(
-                  K,
+                  ee,
                   {
                     scale: n,
                     orientation: "bottom",
                     transform: `translate(0,${L})`,
-                    label: P
+                    label: B
                   }
                 ),
                 /* @__PURE__ */ e(
-                  K,
+                  ee,
                   {
-                    scale: g,
+                    scale: b,
                     orientation: "left",
-                    label: R
+                    label: N
                   }
                 )
               ] })
             ] });
           } }),
-          N && /* @__PURE__ */ e(ie, { state: I }),
-          A && i && /* @__PURE__ */ e(
-            ce,
+          P && /* @__PURE__ */ e(ue, { state: T }),
+          v && c && /* @__PURE__ */ e(
+            ie,
             {
-              items: b.map(($, L) => ({
-                label: X?.[L] ?? $,
-                color: V[L]
+              items: y.map((C, L) => ({
+                label: z?.[L] ?? C,
+                color: I[L]
               })),
               className: "mt-ds-04"
             }
@@ -343,106 +345,107 @@ const Ee = te.forwardRef(
     );
   }
 );
-Ee.displayName = "BarChart";
-const Ue = te.forwardRef(
+Ue.displayName = "BarChart";
+const Ze = ne.forwardRef(
   ({
     data: t,
     xKey: a,
     series: o,
-    curved: y = !1,
-    showDots: m = !1,
-    dotSize: x = 4,
-    strokeWidth: c = 2,
-    height: M = 300,
-    showGrid: z = !0,
-    showTooltip: N = !0,
-    showLegend: A = !1,
-    animate: k = !0,
-    xLabel: j,
-    yLabel: P,
-    className: R,
+    curved: x = !1,
+    showDots: d = !1,
+    dotSize: M = 4,
+    strokeWidth: i = 2,
+    height: k = 300,
+    showGrid: G = !0,
+    showTooltip: P = !0,
+    showLegend: v = !1,
+    animate: R = !0,
+    xLabel: Z,
+    yLabel: B,
+    ariaLabel: N,
+    className: z,
     ...X
-  }, E) => {
-    const { tooltip: W, show: U, hide: I } = fe(), T = oe(), B = k && !T, q = o.map((d, w) => re(d.color, w));
+  }, W) => {
+    const { tooltip: q, show: j, hide: T } = pe(), V = le(), J = R && !V, E = o.map((m, S) => ae(m.color, S));
     return /* @__PURE__ */ p(
-      ne.div,
+      re.div,
       {
-        ref: E,
-        className: Q("relative", R),
-        ...B ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: le.fade } : {},
-        ...se(X),
+        ref: W,
+        className: H("relative", z),
+        ...J ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: se.fade } : {},
+        ...ce(X),
         children: [
-          /* @__PURE__ */ e(xe, { height: M, children: ({ width: d, height: w, margin: b }) => {
-            const i = t.map((r) => r[a]), V = i.every((r) => typeof r == "number");
-            let $, L;
-            if (V) {
-              const r = i, f = Math.min(...r), S = Math.max(...r), G = ae().domain([f, S]).range([0, d]);
-              $ = G, L = (C) => G(Number(C[a]));
+          /* @__PURE__ */ e(be, { height: k, ariaLabel: N ?? "Line chart", children: ({ width: m, height: S, margin: y }) => {
+            const c = t.map((r) => r[a]), I = c.every((r) => typeof r == "number");
+            let C, L;
+            if (I) {
+              const r = c, f = Math.min(...r), A = Math.max(...r), w = oe().domain([f, A]).range([0, m]);
+              C = w, L = ($) => w(Number($[a]));
             } else {
-              const r = i.map(String), f = Ce().domain(r).range([0, d]).padding(0.5);
-              $ = f, L = (S) => f(String(S[a])) ?? 0;
+              const r = c.map(String), f = Le().domain(r).range([0, m]).padding(0.5);
+              C = f, L = (A) => f(String(A[a])) ?? 0;
             }
             const u = t.flatMap(
               (r) => o.map((f) => Number(r[f.key]) || 0)
-            ), s = Math.max(...u), l = ae().domain([0, s * 1.1]).range([w, 0]).nice(), g = y ? ue : Ae, n = me().curve(g).defined((r) => r != null);
-            return /* @__PURE__ */ p(ee, { children: [
-              z && /* @__PURE__ */ e(
-                he,
+            ), l = Math.max(...u), s = oe().domain([0, l * 1.1]).range([S, 0]).nice(), b = x ? de : Ae, n = he().curve(b).defined((r) => r != null);
+            return /* @__PURE__ */ p(te, { children: [
+              G && /* @__PURE__ */ e(
+                fe,
                 {
-                  width: d,
-                  height: w,
-                  yScale: l,
+                  width: m,
+                  height: S,
+                  yScale: s,
                   horizontal: !0
                 }
               ),
               o.map((r, f) => {
-                const G = n.x((C) => L(C)).y((C) => l(Number(C[r.key]) || 0))(t) ?? "";
+                const w = n.x(($) => L($)).y(($) => s(Number($[r.key]) || 0))(t) ?? "";
                 return /* @__PURE__ */ p("g", { children: [
                   /* @__PURE__ */ e(
                     "path",
                     {
-                      d: G,
+                      d: w,
                       fill: "none",
-                      stroke: q[f],
-                      strokeWidth: c,
+                      stroke: E[f],
+                      strokeWidth: i,
                       strokeLinejoin: "round",
                       strokeLinecap: "round"
                     }
                   ),
-                  m && t.map((C, J) => {
-                    const h = L(C), v = l(Number(C[r.key]) || 0);
+                  d && t.map(($, Q) => {
+                    const h = L($), g = s(Number($[r.key]) || 0);
                     return /* @__PURE__ */ e(
                       "circle",
                       {
                         cx: h,
-                        cy: v,
-                        r: x,
-                        fill: q[f],
+                        cy: g,
+                        r: M,
+                        fill: E[f],
                         className: "transition-opacity hover:opacity-80"
                       },
-                      `${r.key}-dot-${J}`
+                      `${r.key}-dot-${Q}`
                     );
                   })
                 ] }, r.key);
               }),
-              N && t.map((r, f) => {
-                const S = L(r), G = d / Math.max(t.length - 1, 1);
+              P && t.map((r, f) => {
+                const A = L(r), w = m / Math.max(t.length - 1, 1);
                 return /* @__PURE__ */ e(
                   "rect",
                   {
-                    x: S - G / 2,
+                    x: A - w / 2,
                     y: 0,
-                    width: G,
-                    height: w,
+                    width: w,
+                    height: S,
                     fill: "transparent",
-                    onMouseMove: (C) => {
-                      const J = C.currentTarget.closest("div")?.getBoundingClientRect();
-                      U(
-                        C.clientX - (J?.left ?? 0),
-                        C.clientY - (J?.top ?? 0),
+                    onMouseMove: ($) => {
+                      const Q = $.currentTarget.closest("div")?.getBoundingClientRect();
+                      j(
+                        $.clientX - (Q?.left ?? 0),
+                        $.clientY - (Q?.top ?? 0),
                         /* @__PURE__ */ p("div", { children: [
                           /* @__PURE__ */ e("div", { className: "font-medium", children: String(r[a]) }),
-                          o.map((h, v) => /* @__PURE__ */ p(
+                          o.map((h, g) => /* @__PURE__ */ p(
                             "div",
                             {
                               className: "flex items-center gap-ds-02",
@@ -451,7 +454,7 @@ const Ue = te.forwardRef(
                                   "span",
                                   {
                                     className: "inline-block h-2 w-2 rounded-ds-full",
-                                    style: { backgroundColor: q[v] }
+                                    style: { backgroundColor: E[g] }
                                   }
                                 ),
                                 /* @__PURE__ */ p("span", { className: "text-surface-fg-muted", children: [
@@ -467,30 +470,30 @@ const Ue = te.forwardRef(
                         ] })
                       );
                     },
-                    onMouseLeave: I
+                    onMouseLeave: T
                   },
                   `hover-${f}`
                 );
               }),
               /* @__PURE__ */ e(
-                K,
+                ee,
                 {
-                  scale: $,
+                  scale: C,
                   orientation: "bottom",
-                  transform: `translate(0,${w})`,
-                  label: j
+                  transform: `translate(0,${S})`,
+                  label: Z
                 }
               ),
-              /* @__PURE__ */ e(K, { scale: l, orientation: "left", label: P })
+              /* @__PURE__ */ e(ee, { scale: s, orientation: "left", label: B })
             ] });
           } }),
-          N && /* @__PURE__ */ e(ie, { state: W }),
-          A && o.length > 1 && /* @__PURE__ */ e(
-            ce,
+          P && /* @__PURE__ */ e(ue, { state: q }),
+          v && o.length > 1 && /* @__PURE__ */ e(
+            ie,
             {
-              items: o.map((d, w) => ({
-                label: d.label,
-                color: q[w]
+              items: o.map((m, S) => ({
+                label: m.label,
+                color: E[S]
               })),
               className: "mt-ds-04"
             }
@@ -500,74 +503,75 @@ const Ue = te.forwardRef(
     );
   }
 );
-Ue.displayName = "LineChart";
-const Ze = te.forwardRef(
+Ze.displayName = "LineChart";
+const qe = ne.forwardRef(
   ({
     data: t,
     xKey: a,
     series: o,
-    curved: y = !1,
-    stacked: m = !1,
-    fillOpacity: x = 0.3,
-    gradient: c = !1,
-    strokeWidth: M = 2,
-    height: z = 300,
-    showGrid: N = !0,
-    showTooltip: A = !0,
-    showLegend: k = !1,
-    animate: j = !0,
-    xLabel: P,
-    yLabel: R,
+    curved: x = !1,
+    stacked: d = !1,
+    fillOpacity: M = 0.3,
+    gradient: i = !1,
+    strokeWidth: k = 2,
+    height: G = 300,
+    showGrid: P = !0,
+    showTooltip: v = !0,
+    showLegend: R = !1,
+    animate: Z = !0,
+    xLabel: B,
+    yLabel: N,
+    ariaLabel: z,
     className: X,
-    ...E
-  }, W) => {
-    const { tooltip: U, show: I, hide: T } = fe(), B = oe(), q = j && !B, d = o.map((b, i) => re(b.color, i)), w = te.useId();
+    ...W
+  }, q) => {
+    const { tooltip: j, show: T, hide: V } = pe(), J = le(), E = Z && !J, m = o.map((y, c) => ae(y.color, c)), S = ne.useId();
     return /* @__PURE__ */ p(
-      ne.div,
+      re.div,
       {
-        ref: W,
-        className: Q("relative", X),
-        ...q ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: le.fade } : {},
-        ...se(E),
+        ref: q,
+        className: H("relative", X),
+        ...E ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: se.fade } : {},
+        ...ce(W),
         children: [
-          /* @__PURE__ */ e(xe, { height: z, children: ({ width: b, height: i, margin: V }) => {
-            const $ = t.map((h) => h[a]), L = $.every((h) => typeof h == "number");
-            let u, s, l;
+          /* @__PURE__ */ e(be, { height: G, ariaLabel: z ?? "Area chart", children: ({ width: y, height: c, margin: I }) => {
+            const C = t.map((h) => h[a]), L = C.every((h) => typeof h == "number");
+            let u, l, s;
             if (L) {
-              const h = $, v = Math.min(...h), _ = Math.max(...h), Y = ae().domain([v, _]).range([0, b]);
-              u = Y, s = (F) => Y(Number(F[a])), l = (F) => Y(Number(t[F][a]));
+              const h = C, g = Math.min(...h), _ = Math.max(...h), Y = oe().domain([g, _]).range([0, y]);
+              u = Y, l = (F) => Y(Number(F[a])), s = (F) => Y(Number(t[F][a]));
             } else {
-              const h = $.map(String), v = Ce().domain(h).range([0, b]).padding(0.5);
-              u = v, s = (_) => v(String(_[a])) ?? 0, l = (_) => v(String(t[_][a])) ?? 0;
+              const h = C.map(String), g = Le().domain(h).range([0, y]).padding(0.5);
+              u = g, l = (_) => g(String(_[a])) ?? 0, s = (_) => g(String(t[_][a])) ?? 0;
             }
-            let g;
-            m ? g = Math.max(
+            let b;
+            d ? b = Math.max(
               ...t.map(
-                (h) => o.reduce((v, _) => v + (Number(h[_.key]) || 0), 0)
+                (h) => o.reduce((g, _) => g + (Number(h[_.key]) || 0), 0)
               )
-            ) : g = Math.max(
+            ) : b = Math.max(
               ...t.flatMap(
-                (h) => o.map((v) => Number(h[v.key]) || 0)
+                (h) => o.map((g) => Number(h[g.key]) || 0)
               )
             );
-            const n = ae().domain([0, g * 1.1]).range([i, 0]).nice(), r = y ? ue : Ae, f = () => t.map((h, v) => {
-              const _ = s(h), Y = b / Math.max(t.length - 1, 1);
+            const n = oe().domain([0, b * 1.1]).range([c, 0]).nice(), r = x ? de : Ae, f = () => t.map((h, g) => {
+              const _ = l(h), Y = y / Math.max(t.length - 1, 1);
               return /* @__PURE__ */ e(
                 "rect",
                 {
                   x: _ - Y / 2,
                   y: 0,
                   width: Y,
-                  height: i,
+                  height: c,
                   fill: "transparent",
                   onMouseMove: (F) => {
-                    const H = F.currentTarget.closest("div")?.getBoundingClientRect();
-                    I(
-                      F.clientX - (H?.left ?? 0),
-                      F.clientY - (H?.top ?? 0),
+                    const K = F.currentTarget.closest("div")?.getBoundingClientRect();
+                    T(
+                      F.clientX - (K?.left ?? 0),
+                      F.clientY - (K?.top ?? 0),
                       /* @__PURE__ */ p("div", { children: [
                         /* @__PURE__ */ e("div", { className: "font-medium", children: String(h[a]) }),
-                        o.map((D, Z) => /* @__PURE__ */ p(
+                        o.map((D, U) => /* @__PURE__ */ p(
                           "div",
                           {
                             className: "flex items-center gap-ds-02",
@@ -576,7 +580,7 @@ const Ze = te.forwardRef(
                                 "span",
                                 {
                                   className: "inline-block h-2 w-2 rounded-ds-full",
-                                  style: { backgroundColor: d[Z] }
+                                  style: { backgroundColor: m[U] }
                                 }
                               ),
                               /* @__PURE__ */ p("span", { className: "text-surface-fg-muted", children: [
@@ -592,14 +596,14 @@ const Ze = te.forwardRef(
                       ] })
                     );
                   },
-                  onMouseLeave: T
+                  onMouseLeave: V
                 },
-                `hover-${v}`
+                `hover-${g}`
               );
-            }), S = () => c ? /* @__PURE__ */ e("defs", { children: o.map((h, v) => /* @__PURE__ */ p(
+            }), A = () => i ? /* @__PURE__ */ e("defs", { children: o.map((h, g) => /* @__PURE__ */ p(
               "linearGradient",
               {
-                id: `${w}-gradient-${v}`,
+                id: `${S}-gradient-${g}`,
                 x1: "0",
                 y1: "0",
                 x2: "0",
@@ -609,100 +613,100 @@ const Ze = te.forwardRef(
                     "stop",
                     {
                       offset: "0%",
-                      stopColor: d[v],
-                      stopOpacity: x
+                      stopColor: m[g],
+                      stopOpacity: M
                     }
                   ),
                   /* @__PURE__ */ e(
                     "stop",
                     {
                       offset: "100%",
-                      stopColor: d[v],
+                      stopColor: m[g],
                       stopOpacity: 0.05
                     }
                   )
                 ]
               },
-              `grad-${v}`
-            )) }) : null, G = () => /* @__PURE__ */ p(ee, { children: [
+              `grad-${g}`
+            )) }) : null, w = () => /* @__PURE__ */ p(te, { children: [
               /* @__PURE__ */ e(
-                K,
+                ee,
                 {
                   scale: u,
                   orientation: "bottom",
-                  transform: `translate(0,${i})`,
-                  label: P
+                  transform: `translate(0,${c})`,
+                  label: B
                 }
               ),
-              /* @__PURE__ */ e(K, { scale: n, orientation: "left", label: R })
+              /* @__PURE__ */ e(ee, { scale: n, orientation: "left", label: N })
             ] });
-            if (m) {
-              const h = o.map((D) => D.key), v = _e().keys(h).order(je).offset(Te), _ = t.map((D) => {
-                const Z = { [a]: String(D[a]) };
+            if (d) {
+              const h = o.map((D) => D.key), g = je().keys(h).order(Te).offset(Ye), _ = t.map((D) => {
+                const U = { [a]: String(D[a]) };
                 for (const O of o)
-                  Z[O.key] = Number(D[O.key]) || 0;
-                return Z;
-              }), Y = v(_), F = Me().curve(r).x((D, Z) => l(Z)).y0((D) => n(D[0])).y1((D) => n(D[1])), H = me().curve(r).x((D, Z) => l(Z)).y((D) => n(D[1]));
-              return /* @__PURE__ */ p(ee, { children: [
-                S(),
-                N && /* @__PURE__ */ e(
-                  he,
+                  U[O.key] = Number(D[O.key]) || 0;
+                return U;
+              }), Y = g(_), F = Ne().curve(r).x((D, U) => s(U)).y0((D) => n(D[0])).y1((D) => n(D[1])), K = he().curve(r).x((D, U) => s(U)).y((D) => n(D[1]));
+              return /* @__PURE__ */ p(te, { children: [
+                A(),
+                P && /* @__PURE__ */ e(
+                  fe,
                   {
-                    width: b,
-                    height: i,
+                    width: y,
+                    height: c,
                     yScale: n,
                     horizontal: !0
                   }
                 ),
-                [...Y].reverse().map((D, Z) => {
-                  const O = Y.length - 1 - Z, Ne = D, Le = F(Ne) ?? "", Se = H(Ne) ?? "", we = c ? `url(#${w}-gradient-${O})` : d[O];
+                [...Y].reverse().map((D, U) => {
+                  const O = Y.length - 1 - U, ke = D, Se = F(ke) ?? "", we = K(ke) ?? "", Ge = i ? `url(#${S}-gradient-${O})` : m[O];
                   return /* @__PURE__ */ p("g", { children: [
                     /* @__PURE__ */ e(
                       "path",
                       {
-                        d: Le,
-                        fill: we,
-                        opacity: c ? 1 : x
+                        d: Se,
+                        fill: Ge,
+                        opacity: i ? 1 : M
                       }
                     ),
                     /* @__PURE__ */ e(
                       "path",
                       {
-                        d: Se,
+                        d: we,
                         fill: "none",
-                        stroke: d[O],
-                        strokeWidth: M,
+                        stroke: m[O],
+                        strokeWidth: k,
                         strokeLinejoin: "round",
                         strokeLinecap: "round"
                       }
                     )
                   ] }, o[O].key);
                 }),
-                A && f(),
-                G()
+                v && f(),
+                w()
               ] });
             }
-            const C = Me().curve(r).defined((h) => h != null), J = me().curve(r).defined((h) => h != null);
-            return /* @__PURE__ */ p(ee, { children: [
-              S(),
-              N && /* @__PURE__ */ e(
-                he,
+            const $ = Ne().curve(r).defined((h) => h != null), Q = he().curve(r).defined((h) => h != null);
+            return /* @__PURE__ */ p(te, { children: [
+              A(),
+              P && /* @__PURE__ */ e(
+                fe,
                 {
-                  width: b,
-                  height: i,
+                  width: y,
+                  height: c,
                   yScale: n,
                   horizontal: !0
                 }
               ),
-              [...o].reverse().map((h, v) => {
-                const _ = o.length - 1 - v, Y = C.x((O) => s(O)).y0(i).y1((O) => n(Number(O[h.key]) || 0)), F = J.x((O) => s(O)).y((O) => n(Number(O[h.key]) || 0)), H = Y(t) ?? "", D = F(t) ?? "", Z = c ? `url(#${w}-gradient-${_})` : d[_];
+              [...o].reverse().map((h, g) => {
+                const _ = o.length - 1 - g, Y = $.x((O) => l(O)).y0(c).y1((O) => n(Number(O[h.key]) || 0)), F = Q.x((O) => l(O)).y((O) => n(Number(O[h.key]) || 0)), K = Y(t) ?? "", D = F(t) ?? "", U = i ? `url(#${S}-gradient-${_})` : m[_];
                 return /* @__PURE__ */ p("g", { children: [
                   /* @__PURE__ */ e(
                     "path",
                     {
-                      d: H,
-                      fill: Z,
-                      opacity: c ? 1 : x
+                      d: K,
+                      fill: U,
+                      opacity: i ? 1 : M
                     }
                   ),
                   /* @__PURE__ */ e(
@@ -710,25 +714,25 @@ const Ze = te.forwardRef(
                     {
                       d: D,
                       fill: "none",
-                      stroke: d[_],
-                      strokeWidth: M,
+                      stroke: m[_],
+                      strokeWidth: k,
                       strokeLinejoin: "round",
                       strokeLinecap: "round"
                     }
                   )
                 ] }, h.key);
               }),
-              A && f(),
-              G()
+              v && f(),
+              w()
             ] });
           } }),
-          A && /* @__PURE__ */ e(ie, { state: U }),
-          k && o.length > 1 && /* @__PURE__ */ e(
-            ce,
+          v && /* @__PURE__ */ e(ue, { state: j }),
+          R && o.length > 1 && /* @__PURE__ */ e(
+            ie,
             {
-              items: o.map((b, i) => ({
-                label: b.label,
-                color: d[i]
+              items: o.map((y, c) => ({
+                label: y.label,
+                color: m[c]
               })),
               className: "mt-ds-04"
             }
@@ -738,70 +742,71 @@ const Ze = te.forwardRef(
     );
   }
 );
-Ze.displayName = "AreaChart";
-const qe = te.forwardRef(
+qe.displayName = "AreaChart";
+const Je = ne.forwardRef(
   ({
     data: t,
     variant: a = "pie",
     innerRadius: o = 0.6,
-    padAngle: y = 0,
-    cornerRadius: m = 0,
-    height: x = 300,
-    showTooltip: c = !0,
-    showLegend: M = !1,
-    showLabels: z = !1,
-    animate: N = !0,
-    className: A,
-    centerLabel: k,
-    ...j
-  }, P) => {
-    const R = ve(null), [X, E] = de(0), [W, U] = de(null), { tooltip: I, show: T, hide: B } = fe(), q = oe(), d = N && !q;
-    ye(() => {
-      if (!R.current) return;
+    padAngle: x = 0,
+    cornerRadius: d = 0,
+    height: M = 300,
+    showTooltip: i = !0,
+    showLegend: k = !1,
+    showLabels: G = !1,
+    animate: P = !0,
+    className: v,
+    centerLabel: R,
+    ariaLabel: Z,
+    ...B
+  }, N) => {
+    const z = ye(null), [X, W] = me(0), [q, j] = me(null), { tooltip: T, show: V, hide: J } = pe(), E = le(), m = P && !E;
+    xe(() => {
+      if (!z.current) return;
       const n = new ResizeObserver((r) => {
         const f = r[0];
-        f && E(f.contentRect.width);
+        f && W(f.contentRect.width);
       });
-      return n.observe(R.current), () => n.disconnect();
+      return n.observe(z.current), () => n.disconnect();
     }, []);
-    const b = (X > 0 ? Math.min(X, x) : x) / 2, i = a === "donut" ? b * o : 0, V = t.map((n, r) => re(n.color, r)), $ = t.reduce((n, r) => n + r.value, 0), u = Ye().value((n) => n.value).padAngle(y).sort(null)(t), s = ge().innerRadius(i).outerRadius(b - 2).cornerRadius(m), l = i + (b - 2 - i) * 0.7, g = ge().innerRadius(l).outerRadius(l);
+    const y = (X > 0 ? Math.min(X, M) : M) / 2, c = a === "donut" ? y * o : 0, I = t.map((n, r) => ae(n.color, r)), C = t.reduce((n, r) => n + r.value, 0), u = Oe().value((n) => n.value).padAngle(x).sort(null)(t), l = ve().innerRadius(c).outerRadius(y - 2).cornerRadius(d), s = c + (y - 2 - c) * 0.7, b = ve().innerRadius(s).outerRadius(s);
     return /* @__PURE__ */ p(
-      ne.div,
+      re.div,
       {
         ref: (n) => {
-          R.current = n, typeof P == "function" ? P(n) : P && (P.current = n);
+          z.current = n, typeof N == "function" ? N(n) : N && (N.current = n);
         },
-        className: Q("relative w-full", A),
-        ...d ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: le.fade } : {},
-        ...se(j),
+        className: H("relative w-full", v),
+        ...m ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: se.fade } : {},
+        ...ce(B),
         children: [
-          X > 0 && /* @__PURE__ */ p(ee, { children: [
+          X > 0 && /* @__PURE__ */ p(te, { children: [
             /* @__PURE__ */ e(
               "svg",
               {
                 width: X,
-                height: x,
+                height: M,
                 role: "img",
-                "aria-label": "Pie chart",
-                children: /* @__PURE__ */ p("g", { transform: `translate(${X / 2},${x / 2})`, children: [
+                "aria-label": Z ?? "Pie chart",
+                children: /* @__PURE__ */ p("g", { transform: `translate(${X / 2},${M / 2})`, children: [
                   u.map((n, r) => {
-                    const f = s(n);
+                    const f = l(n);
                     if (!f) return null;
-                    const [S, G] = s.centroid(n), C = Math.atan2(G, S), J = Math.cos(C) * 4, h = Math.sin(C) * 4, v = W === r;
+                    const [A, w] = l.centroid(n), $ = Math.atan2(w, A), Q = Math.cos($) * 4, h = Math.sin($) * 4, g = q === r;
                     return /* @__PURE__ */ e(
                       "path",
                       {
                         d: f,
-                        fill: V[r],
+                        fill: I[r],
                         className: "cursor-pointer transition-transform",
                         style: {
-                          transform: v ? `translate(${J}px, ${h}px)` : void 0
+                          transform: g ? `translate(${Q}px, ${h}px)` : void 0
                         },
-                        onMouseEnter: () => U(r),
+                        onMouseEnter: () => j(r),
                         onMouseMove: (_) => {
-                          if (c) {
-                            const Y = _.currentTarget.closest("div")?.getBoundingClientRect(), F = $ > 0 ? (n.data.value / $ * 100).toFixed(1) : "0";
-                            T(
+                          if (i) {
+                            const Y = _.currentTarget.closest("div")?.getBoundingClientRect(), F = C > 0 ? (n.data.value / C * 100).toFixed(1) : "0";
+                            V(
                               _.clientX - (Y?.left ?? 0),
                               _.clientY - (Y?.top ?? 0),
                               /* @__PURE__ */ p("div", { children: [
@@ -817,51 +822,51 @@ const qe = te.forwardRef(
                           }
                         },
                         onMouseLeave: () => {
-                          U(null), B();
+                          j(null), J();
                         }
                       },
                       `slice-${n.data.label}-${r}`
                     );
                   }),
-                  z && u.map((n, r) => {
-                    const [f, S] = g.centroid(n), G = $ > 0 ? (n.data.value / $ * 100).toFixed(0) : "0";
-                    return $ > 0 && n.data.value / $ < 0.03 ? null : /* @__PURE__ */ p(
+                  G && u.map((n, r) => {
+                    const [f, A] = b.centroid(n), w = C > 0 ? (n.data.value / C * 100).toFixed(0) : "0";
+                    return C > 0 && n.data.value / C < 0.03 ? null : /* @__PURE__ */ p(
                       "text",
                       {
                         x: f,
-                        y: S,
+                        y: A,
                         textAnchor: "middle",
                         dominantBaseline: "central",
                         className: "pointer-events-none fill-accent-fg text-ds-xs font-medium",
                         children: [
-                          G,
+                          w,
                           "%"
                         ]
                       },
                       `label-${n.data.label}-${r}`
                     );
                   }),
-                  a === "donut" && k && i > 0 && /* @__PURE__ */ e(
+                  a === "donut" && R && c > 0 && /* @__PURE__ */ e(
                     "foreignObject",
                     {
-                      x: -i * 0.7,
-                      y: -i * 0.7,
-                      width: i * 1.4,
-                      height: i * 1.4,
-                      children: /* @__PURE__ */ e("div", { className: "flex h-full w-full items-center justify-center text-center text-surface-fg", children: k })
+                      x: -c * 0.7,
+                      y: -c * 0.7,
+                      width: c * 1.4,
+                      height: c * 1.4,
+                      children: /* @__PURE__ */ e("div", { className: "flex h-full w-full items-center justify-center text-center text-surface-fg", children: R })
                     }
                   )
                 ] })
               }
             ),
-            c && /* @__PURE__ */ e(ie, { state: I })
+            i && /* @__PURE__ */ e(ue, { state: T })
           ] }),
-          M && /* @__PURE__ */ e(
-            ce,
+          k && /* @__PURE__ */ e(
+            ie,
             {
               items: t.map((n, r) => ({
                 label: n.label,
-                color: V[r]
+                color: I[r]
               })),
               className: "mt-ds-04"
             }
@@ -871,150 +876,150 @@ const qe = te.forwardRef(
     );
   }
 );
-qe.displayName = "PieChart";
-const $e = { duration: 1, ease: "easeOut" }, Je = te.forwardRef(
+Je.displayName = "PieChart";
+const Ce = { duration: 1, ease: "easeOut" }, Qe = ne.forwardRef(
   ({
     data: t,
     variant: a = "line",
     width: o = 120,
-    height: y = 32,
-    color: m,
-    showLastDot: x = !1,
-    strokeWidth: c = 1.5,
-    animate: M = !0,
-    className: z,
-    ...N
-  }, A) => {
-    const k = re(m, 0), j = oe(), P = M && !j;
+    height: x = 32,
+    color: d,
+    showLastDot: M = !1,
+    strokeWidth: i = 1.5,
+    animate: k = !0,
+    className: G,
+    ...P
+  }, v) => {
+    const R = ae(d, 0), Z = le(), B = k && !Z;
     if (!t.length) return null;
-    const R = a === "bar" ? 1 : c, X = o - R * 2, E = y - R * 2, W = ae().domain([0, Math.max(t.length - 1, 1)]).range([R, R + X]), U = Math.min(...t), I = Math.max(...t), T = U === I ? [U - 1, I + 1] : [U, I], B = ae().domain(T).range([R + E, R]);
+    const N = a === "bar" ? 1 : i, z = o - N * 2, X = x - N * 2, W = oe().domain([0, Math.max(t.length - 1, 1)]).range([N, N + z]), q = Math.min(...t), j = Math.max(...t), T = q === j ? [q - 1, j + 1] : [q, j], V = oe().domain(T).range([N + X, N]);
     if (a === "bar") {
-      const V = Math.max(
+      const c = Math.max(
         1,
-        (X - 1 * (t.length - 1)) / t.length
-      ), $ = R + E;
+        (z - 1 * (t.length - 1)) / t.length
+      ), I = N + X;
       return /* @__PURE__ */ e(
         "svg",
         {
-          ref: A,
+          ref: v,
           width: o,
-          height: y,
+          height: x,
           role: "img",
           "aria-label": "Sparkline bar chart",
-          className: Q("inline-block align-middle", z),
-          ...N,
-          children: t.map((L, u) => {
-            const s = R + u * (V + 1), l = B(L), g = Math.max(1, $ - l);
+          className: H("inline-block align-middle", G),
+          ...P,
+          children: t.map((C, L) => {
+            const u = N + L * (c + 1), l = V(C), s = Math.max(1, I - l);
             return /* @__PURE__ */ e(
               "rect",
               {
-                x: s,
+                x: u,
                 y: l,
-                width: V,
-                height: g,
-                rx: Math.min(1, V / 2),
-                fill: k
+                width: c,
+                height: s,
+                rx: Math.min(1, c / 2),
+                fill: R
               },
-              u
+              L
             );
           })
         }
       );
     }
     if (a === "area") {
-      const i = Me().curve(ue).x((l, g) => W(g)).y0(R + E).y1((l) => B(l)), V = me().curve(ue).x((l, g) => W(g)).y((l) => B(l)), $ = i(t) ?? "", L = V(t) ?? "", u = W(t.length - 1), s = B(t[t.length - 1]);
+      const y = Ne().curve(de).x((l, s) => W(s)).y0(N + X).y1((l) => V(l)), c = he().curve(de).x((l, s) => W(s)).y((l) => V(l)), I = y(t) ?? "", C = c(t) ?? "", L = W(t.length - 1), u = V(t[t.length - 1]);
       return /* @__PURE__ */ p(
         "svg",
         {
-          ref: A,
+          ref: v,
           width: o,
-          height: y,
+          height: x,
           role: "img",
           "aria-label": "Sparkline area chart",
-          className: Q("inline-block align-middle", z),
-          ...N,
+          className: H("inline-block align-middle", G),
+          ...P,
           children: [
-            /* @__PURE__ */ e("path", { d: $, fill: k, opacity: 0.2 }),
-            P ? /* @__PURE__ */ e(
-              ne.path,
+            /* @__PURE__ */ e("path", { d: I, fill: R, opacity: 0.2 }),
+            B ? /* @__PURE__ */ e(
+              re.path,
               {
-                d: L,
+                d: C,
                 fill: "none",
-                stroke: k,
-                strokeWidth: c,
+                stroke: R,
+                strokeWidth: i,
                 strokeLinejoin: "round",
                 strokeLinecap: "round",
                 initial: { pathLength: 0 },
                 animate: { pathLength: 1 },
-                transition: $e
+                transition: Ce
               }
             ) : /* @__PURE__ */ e(
               "path",
               {
-                d: L,
+                d: C,
                 fill: "none",
-                stroke: k,
-                strokeWidth: c,
+                stroke: R,
+                strokeWidth: i,
                 strokeLinejoin: "round",
                 strokeLinecap: "round"
               }
             ),
-            x && /* @__PURE__ */ e(
+            M && /* @__PURE__ */ e(
               "circle",
               {
-                cx: u,
-                cy: s,
-                r: c + 1,
-                fill: k
+                cx: L,
+                cy: u,
+                r: i + 1,
+                fill: R
               }
             )
           ]
         }
       );
     }
-    const d = me().curve(ue).x((i, V) => W(V)).y((i) => B(i))(t) ?? "", w = W(t.length - 1), b = B(t[t.length - 1]);
+    const E = he().curve(de).x((y, c) => W(c)).y((y) => V(y))(t) ?? "", m = W(t.length - 1), S = V(t[t.length - 1]);
     return /* @__PURE__ */ p(
       "svg",
       {
-        ref: A,
+        ref: v,
         width: o,
-        height: y,
+        height: x,
         role: "img",
         "aria-label": "Sparkline chart",
-        className: Q("inline-block align-middle", z),
-        ...N,
+        className: H("inline-block align-middle", G),
+        ...P,
         children: [
-          P ? /* @__PURE__ */ e(
-            ne.path,
+          B ? /* @__PURE__ */ e(
+            re.path,
             {
-              d,
+              d: E,
               fill: "none",
-              stroke: k,
-              strokeWidth: c,
+              stroke: R,
+              strokeWidth: i,
               strokeLinejoin: "round",
               strokeLinecap: "round",
               initial: { pathLength: 0 },
               animate: { pathLength: 1 },
-              transition: $e
+              transition: Ce
             }
           ) : /* @__PURE__ */ e(
             "path",
             {
-              d,
+              d: E,
               fill: "none",
-              stroke: k,
-              strokeWidth: c,
+              stroke: R,
+              strokeWidth: i,
               strokeLinejoin: "round",
               strokeLinecap: "round"
             }
           ),
-          x && /* @__PURE__ */ e(
+          M && /* @__PURE__ */ e(
             "circle",
             {
-              cx: w,
-              cy: b,
-              r: c + 1,
-              fill: k
+              cx: m,
+              cy: S,
+              r: i + 1,
+              fill: R
             }
           )
         ]
@@ -1022,59 +1027,59 @@ const $e = { duration: 1, ease: "easeOut" }, Je = te.forwardRef(
     );
   }
 );
-Je.displayName = "Sparkline";
-const pe = (t) => t * Math.PI / 180, Qe = te.forwardRef(
+Qe.displayName = "Sparkline";
+const ge = (t) => t * Math.PI / 180, He = ne.forwardRef(
   ({
     value: t,
     max: a = 100,
     min: o = 0,
-    label: y,
-    valueLabel: m,
-    color: x,
-    trackColor: c = "var(--color-surface-border)",
-    height: M = 200,
-    startAngle: z = -120,
-    endAngle: N = 120,
-    thickness: A = 16,
-    animate: k = !0,
-    className: j,
-    ...P
-  }, R) => {
-    const X = oe(), E = Fe(X, k ? 600 : 0), W = k && !X, U = re(x, 0), I = M, T = I / 2, B = Math.min(Math.max(t, o), a), q = a === o ? 0 : (B - o) / (a - o), d = z + (N - z) * q, w = typeof m == "function" ? m(B) : typeof m == "string" ? m : String(B), b = ge().innerRadius(T - A).outerRadius(T).startAngle(pe(z)).endAngle(pe(N)).cornerRadius(A / 2), i = ge().innerRadius(T - A).outerRadius(T).startAngle(pe(z)).endAngle(pe(d)).cornerRadius(A / 2), V = b(null) ?? "", $ = i(null) ?? "";
+    label: x,
+    valueLabel: d,
+    color: M,
+    trackColor: i = "var(--color-surface-border)",
+    height: k = 200,
+    startAngle: G = -120,
+    endAngle: P = 120,
+    thickness: v = 16,
+    animate: R = !0,
+    className: Z,
+    ...B
+  }, N) => {
+    const z = le(), X = Ee(z, R ? 600 : 0), W = R && !z, q = ae(M, 0), j = k, T = j / 2, V = Math.min(Math.max(t, o), a), J = a === o ? 0 : (V - o) / (a - o), E = G + (P - G) * J, m = typeof d == "function" ? d(V) : typeof d == "string" ? d : String(V), S = ve().innerRadius(T - v).outerRadius(T).startAngle(ge(G)).endAngle(ge(P)).cornerRadius(v / 2), y = ve().innerRadius(T - v).outerRadius(T).startAngle(ge(G)).endAngle(ge(E)).cornerRadius(v / 2), c = S(null) ?? "", I = y(null) ?? "";
     return /* @__PURE__ */ e(
-      ne.div,
+      re.div,
       {
-        ref: R,
-        className: Q("inline-flex flex-col items-center", j),
-        ...W ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: le.fade } : {},
-        ...se(P),
+        ref: N,
+        className: H("inline-flex flex-col items-center", Z),
+        ...W ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: se.fade } : {},
+        ...ce(B),
         role: "meter",
-        "aria-valuenow": B,
+        "aria-valuenow": V,
         "aria-valuemin": o,
         "aria-valuemax": a,
-        "aria-label": y ?? "Gauge chart",
-        children: /* @__PURE__ */ e("svg", { width: I, height: I, role: "img", "aria-hidden": "true", children: /* @__PURE__ */ p("g", { transform: `translate(${T},${T})`, children: [
-          /* @__PURE__ */ e("path", { d: V, fill: c }),
+        "aria-label": x ?? "Gauge chart",
+        children: /* @__PURE__ */ e("svg", { width: j, height: j, role: "img", "aria-hidden": "true", children: /* @__PURE__ */ p("g", { transform: `translate(${T},${T})`, children: [
+          /* @__PURE__ */ e("path", { d: c, fill: i }),
           /* @__PURE__ */ e(
             "path",
             {
-              d: $,
-              fill: U,
-              style: E > 0 ? { transition: `d ${E}ms ease-out` } : void 0
+              d: I,
+              fill: q,
+              style: X > 0 ? { transition: `d ${X}ms ease-out` } : void 0
             }
           ),
           /* @__PURE__ */ e(
             "text",
             {
               x: 0,
-              y: y ? -4 : 0,
+              y: x ? -4 : 0,
               textAnchor: "middle",
               dominantBaseline: "central",
               className: "fill-surface-fg text-ds-2xl font-semibold",
-              children: w
+              children: m
             }
           ),
-          y && /* @__PURE__ */ e(
+          x && /* @__PURE__ */ e(
             "text",
             {
               x: 0,
@@ -1082,7 +1087,7 @@ const pe = (t) => t * Math.PI / 180, Qe = te.forwardRef(
               textAnchor: "middle",
               dominantBaseline: "central",
               className: "fill-surface-fg-muted text-ds-xs",
-              children: y
+              children: x
             }
           )
         ] }) })
@@ -1090,97 +1095,98 @@ const pe = (t) => t * Math.PI / 180, Qe = te.forwardRef(
     );
   }
 );
-Qe.displayName = "GaugeChart";
-const He = te.forwardRef(
+He.displayName = "GaugeChart";
+const Ke = ne.forwardRef(
   ({
     data: t,
     axes: a,
     series: o,
-    maxValue: y,
-    levels: m = 5,
-    fillOpacity: x = 0.25,
-    showDots: c = !1,
-    height: M = 300,
-    showTooltip: z = !0,
-    showLegend: N = !1,
-    animate: A = !0,
-    className: k,
-    ...j
-  }, P) => {
-    const R = ve(null), [X, E] = de(0), { tooltip: W, show: U, hide: I } = fe(), T = oe(), B = A && !T;
-    ye(() => {
-      if (!R.current) return;
-      const u = new ResizeObserver((s) => {
-        const l = s[0];
-        l && E(l.contentRect.width);
+    maxValue: x,
+    levels: d = 5,
+    fillOpacity: M = 0.25,
+    showDots: i = !1,
+    height: k = 300,
+    showTooltip: G = !0,
+    showLegend: P = !1,
+    animate: v = !0,
+    ariaLabel: R,
+    className: Z,
+    ...B
+  }, N) => {
+    const z = ye(null), [X, W] = me(0), { tooltip: q, show: j, hide: T } = pe(), V = le(), J = v && !V;
+    xe(() => {
+      if (!z.current) return;
+      const u = new ResizeObserver((l) => {
+        const s = l[0];
+        s && W(s.contentRect.width);
       });
-      return u.observe(R.current), () => u.disconnect();
+      return u.observe(z.current), () => u.disconnect();
     }, []);
-    const d = (X > 0 ? Math.min(X, M) : M) / 2 - 40, w = o.map((u, s) => re(u.color, s)), b = y ?? Math.max(
-      ...t.flatMap((u) => o.map((s) => Number(u[s.key]) || 0)),
+    const m = (X > 0 ? Math.min(X, k) : k) / 2 - 40, S = o.map((u, l) => ae(u.color, l)), y = x ?? Math.max(
+      ...t.flatMap((u) => o.map((l) => Number(u[l.key]) || 0)),
       1
-    ), i = 2 * Math.PI / a.length, V = Oe().radius((u) => d * u / b).angle((u, s) => s * i).curve(We), $ = (u) => a.map((s, l) => Number(t[l]?.[u]) || 0), L = (u, s) => {
-      const l = i * u - Math.PI / 2, g = d * s / b;
+    ), c = 2 * Math.PI / a.length, I = We().radius((u) => m * u / y).angle((u, l) => l * c).curve(Ie), C = (u) => a.map((l, s) => Number(t[s]?.[u]) || 0), L = (u, l) => {
+      const s = c * u - Math.PI / 2, b = m * l / y;
       return {
-        x: g * Math.cos(l),
-        y: g * Math.sin(l)
+        x: b * Math.cos(s),
+        y: b * Math.sin(s)
       };
     };
     return /* @__PURE__ */ p(
-      ne.div,
+      re.div,
       {
         ref: (u) => {
-          R.current = u, typeof P == "function" ? P(u) : P && (P.current = u);
+          z.current = u, typeof N == "function" ? N(u) : N && (N.current = u);
         },
-        className: Q("relative w-full", k),
-        ...B ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: le.fade } : {},
-        ...se(j),
+        className: H("relative w-full", Z),
+        ...J ? { initial: { opacity: 0, scale: 0.96 }, animate: { opacity: 1, scale: 1 }, transition: se.fade } : {},
+        ...ce(B),
         children: [
-          X > 0 && /* @__PURE__ */ p(ee, { children: [
+          X > 0 && /* @__PURE__ */ p(te, { children: [
             /* @__PURE__ */ e(
               "svg",
               {
                 width: X,
-                height: M,
+                height: k,
                 role: "img",
-                "aria-label": "Radar chart",
-                children: /* @__PURE__ */ p("g", { transform: `translate(${X / 2},${M / 2})`, children: [
-                  Array.from({ length: m }, (u, s) => {
-                    const l = d / m * (s + 1), g = a.map((n, r) => {
-                      const f = i * r - Math.PI / 2;
-                      return `${l * Math.cos(f)},${l * Math.sin(f)}`;
+                "aria-label": R ?? "Radar chart",
+                children: /* @__PURE__ */ p("g", { transform: `translate(${X / 2},${k / 2})`, children: [
+                  Array.from({ length: d }, (u, l) => {
+                    const s = m / d * (l + 1), b = a.map((n, r) => {
+                      const f = c * r - Math.PI / 2;
+                      return `${s * Math.cos(f)},${s * Math.sin(f)}`;
                     }).join(" ");
                     return /* @__PURE__ */ e(
                       "polygon",
                       {
-                        points: g,
+                        points: b,
                         fill: "none",
                         stroke: "var(--color-surface-border)",
                         strokeDasharray: "3,3",
                         strokeWidth: 1
                       },
-                      `grid-${s}`
+                      `grid-${l}`
                     );
                   }),
-                  a.map((u, s) => {
-                    const l = i * s - Math.PI / 2, g = d * Math.cos(l), n = d * Math.sin(l);
+                  a.map((u, l) => {
+                    const s = c * l - Math.PI / 2, b = m * Math.cos(s), n = m * Math.sin(s);
                     return /* @__PURE__ */ e(
                       "line",
                       {
                         x1: 0,
                         y1: 0,
-                        x2: g,
+                        x2: b,
                         y2: n,
                         stroke: "var(--color-surface-border)",
                         strokeWidth: 1
                       },
-                      `axis-${s}`
+                      `axis-${l}`
                     );
                   }),
-                  a.map((u, s) => {
-                    const l = i * s - Math.PI / 2, g = d + 18, n = g * Math.cos(l), r = g * Math.sin(l);
+                  a.map((u, l) => {
+                    const s = c * l - Math.PI / 2, b = m + 18, n = b * Math.cos(s), r = b * Math.sin(s);
                     let f = "middle";
-                    return Math.abs(Math.cos(l)) > 0.1 && (f = Math.cos(l) > 0 ? "start" : "end"), /* @__PURE__ */ e(
+                    return Math.abs(Math.cos(s)) > 0.1 && (f = Math.cos(s) > 0 ? "start" : "end"), /* @__PURE__ */ e(
                       "text",
                       {
                         x: n,
@@ -1190,11 +1196,11 @@ const He = te.forwardRef(
                         className: "fill-surface-fg-muted text-ds-xs",
                         children: u
                       },
-                      `label-${s}`
+                      `label-${l}`
                     );
                   }),
-                  Array.from({ length: m }, (u, s) => {
-                    const l = Math.round(b / m * (s + 1)), g = d / m * (s + 1), n = -Math.PI / 2, r = g * Math.cos(n) + 4, f = g * Math.sin(n);
+                  Array.from({ length: d }, (u, l) => {
+                    const s = Math.round(y / d * (l + 1)), b = m / d * (l + 1), n = -Math.PI / 2, r = b * Math.cos(n) + 4, f = b * Math.sin(n);
                     return /* @__PURE__ */ e(
                       "text",
                       {
@@ -1203,34 +1209,34 @@ const He = te.forwardRef(
                         textAnchor: "start",
                         dominantBaseline: "auto",
                         className: "fill-surface-fg-subtle text-ds-xs",
-                        children: l
+                        children: s
                       },
-                      `level-label-${s}`
+                      `level-label-${l}`
                     );
                   }),
-                  o.map((u, s) => {
-                    const l = $(u.key), g = V(l);
-                    return g ? /* @__PURE__ */ p("g", { children: [
+                  o.map((u, l) => {
+                    const s = C(u.key), b = I(s);
+                    return b ? /* @__PURE__ */ p("g", { children: [
                       /* @__PURE__ */ e(
                         "path",
                         {
-                          d: g,
-                          fill: w[s],
-                          fillOpacity: x,
-                          stroke: w[s],
+                          d: b,
+                          fill: S[l],
+                          fillOpacity: M,
+                          stroke: S[l],
                           strokeWidth: 2,
                           strokeLinejoin: "round"
                         }
                       ),
-                      c && l.map((n, r) => {
-                        const { x: f, y: S } = L(r, n);
+                      i && s.map((n, r) => {
+                        const { x: f, y: A } = L(r, n);
                         return /* @__PURE__ */ e(
                           "circle",
                           {
                             cx: f,
-                            cy: S,
+                            cy: A,
                             r: 4,
-                            fill: w[s],
+                            fill: S[l],
                             stroke: "var(--color-surface-base)",
                             strokeWidth: 2,
                             className: "transition-opacity"
@@ -1240,25 +1246,25 @@ const He = te.forwardRef(
                       })
                     ] }, u.key) : null;
                   }),
-                  z && a.map((u, s) => {
-                    const l = i * s - Math.PI / 2, g = d * Math.cos(l), n = d * Math.sin(l);
+                  G && a.map((u, l) => {
+                    const s = c * l - Math.PI / 2, b = m * Math.cos(s), n = m * Math.sin(s);
                     return /* @__PURE__ */ e(
                       "circle",
                       {
-                        cx: g,
+                        cx: b,
                         cy: n,
                         r: 16,
                         fill: "transparent",
                         className: "cursor-pointer",
                         onMouseMove: (r) => {
                           const f = r.currentTarget.closest("div")?.getBoundingClientRect();
-                          U(
+                          j(
                             r.clientX - (f?.left ?? 0),
                             r.clientY - (f?.top ?? 0),
                             /* @__PURE__ */ p("div", { children: [
                               /* @__PURE__ */ e("div", { className: "font-medium", children: u }),
-                              o.map((S, G) => {
-                                const C = Number(t[s]?.[S.key]) || 0;
+                              o.map((A, w) => {
+                                const $ = Number(t[l]?.[A.key]) || 0;
                                 return /* @__PURE__ */ p(
                                   "div",
                                   {
@@ -1268,39 +1274,39 @@ const He = te.forwardRef(
                                         "span",
                                         {
                                           className: "inline-block h-2 w-2 rounded-ds-full",
-                                          style: { backgroundColor: w[G] }
+                                          style: { backgroundColor: S[w] }
                                         }
                                       ),
                                       /* @__PURE__ */ p("span", { className: "text-surface-fg-muted", children: [
-                                        S.label,
+                                        A.label,
                                         ":"
                                       ] }),
                                       " ",
-                                      C.toLocaleString()
+                                      $.toLocaleString()
                                     ]
                                   },
-                                  S.key
+                                  A.key
                                 );
                               })
                             ] })
                           );
                         },
-                        onMouseLeave: I
+                        onMouseLeave: T
                       },
-                      `hover-${s}`
+                      `hover-${l}`
                     );
                   })
                 ] })
               }
             ),
-            z && /* @__PURE__ */ e(ie, { state: W })
+            G && /* @__PURE__ */ e(ue, { state: q })
           ] }),
-          N && /* @__PURE__ */ e(
-            ce,
+          P && /* @__PURE__ */ e(
+            ie,
             {
-              items: o.map((u, s) => ({
+              items: o.map((u, l) => ({
                 label: u.label,
-                color: w[s]
+                color: S[l]
               })),
               className: "mt-ds-04"
             }
@@ -1310,15 +1316,15 @@ const He = te.forwardRef(
     );
   }
 );
-He.displayName = "RadarChart";
+Ke.displayName = "RadarChart";
 export {
-  Ze as AreaChart,
-  Ee as BarChart,
-  xe as ChartContainer,
-  Qe as GaugeChart,
-  ce as Legend,
-  Ue as LineChart,
-  qe as PieChart,
-  He as RadarChart,
-  Je as Sparkline
+  qe as AreaChart,
+  Ue as BarChart,
+  be as ChartContainer,
+  He as GaugeChart,
+  ie as Legend,
+  Ze as LineChart,
+  Je as PieChart,
+  Ke as RadarChart,
+  Qe as Sparkline
 };