@actioneer/ads 0.4.0 → 0.5.0

package/components/chart.js

@@ -1,33 +1,25 @@
 "use client";
-import { jsxs as y, jsx as e, Fragment as G } from "react/jsx-runtime";
-import * as k from "react";
-import { ResponsiveContainer as $, LineChart as re, Tooltip as F, Line as U, AreaChart as ae, Area as ne, CartesianGrid as Y, XAxis as H, YAxis as I, BarChart as ie, Bar as Z, Cell as X, ComposedChart as oe, ScatterChart as le, Scatter as se, PieChart as ce, Pie as de, RadarChart as me, PolarGrid as fe, PolarAngleAxis as q, PolarRadiusAxis as ue, Radar as he, RadialBarChart as xe, RadialBar as ve, Treemap as ge, FunnelChart as be, Funnel as pe, LabelList as ye, ReferenceArea as ke, ReferenceLine as Ne, ReferenceDot as we } from "recharts";
-import { MotionConfig as Ae, AnimatePresence as Ce, motion as Re } from "motion/react";
+import { jsxs as y, jsx as e, Fragment as E } from "react/jsx-runtime";
+import * as N from "react";
+import { ResponsiveContainer as B, LineChart as te, Tooltip as F, Line as U, AreaChart as re, Area as ae, CartesianGrid as Y, XAxis as H, YAxis as I, BarChart as ne, Bar as Z, Cell as X, ComposedChart as ie, ScatterChart as oe, Scatter as le, PieChart as se, Pie as ce, RadarChart as de, PolarGrid as me, PolarAngleAxis as q, PolarRadiusAxis as fe, Radar as ue, RadialBarChart as he, RadialBar as xe, Treemap as ge, FunnelChart as ve, Funnel as be, LabelList as pe, ReferenceArea as ye, ReferenceLine as Ne, ReferenceDot as ke } from "recharts";
+import { MotionConfig as we, AnimatePresence as Ae, motion as Ce } from "motion/react";
 import { cn as C } from "../lib/cn.js";
-import { floatVariants as Fe } from "../lib/motion.js";
-const J = (r) => `var(--color-chart-${r % 6 + 1})`, E = [
-  "var(--color-ink-950)",
-  "var(--color-ink-700)",
-  "var(--color-ink-500)",
-  "var(--color-ink-400)",
-  "var(--color-ink-300)",
-  "var(--color-ink-200)",
-  "var(--color-ink-100)"
-], B = (r) => E[r % E.length], _ = "var(--color-chart-3)", S = {
+import { floatVariants as Re } from "../lib/motion.js";
+const W = (r) => `var(--color-chart-${r % 6 + 1})`, j = (r) => W(r), _ = "var(--color-ink-300)", S = {
   primary: { ref: "var(--brand)", pill: "bg-fill text-fill-foreground" },
   success: { ref: "var(--color-success-600)", pill: "bg-success-50 text-success-700" },
   warning: { ref: "var(--color-warning-500)", pill: "bg-warning-50 text-warning-700" },
   danger: { ref: "var(--color-danger-500)", pill: "bg-danger-50 text-danger-700" },
   info: { ref: "var(--color-info-500)", pill: "bg-info-50 text-info-700" }
-}, L = (r) => new Intl.NumberFormat("en-US", { notation: "compact", maximumFractionDigits: 1 }).format(r), Q = (r, n) => {
+}, L = (r) => new Intl.NumberFormat("en-US", { notation: "compact", maximumFractionDigits: 1 }).format(r), J = (r, n) => {
   const a = [];
   for (const i of r)
     for (const t of Object.keys(i))
       t !== n && typeof i[t] == "number" && !a.includes(t) && a.push(t);
   return a;
 };
-function T({ x: r, y: n, payload: a, anchor: i, dy: t, format: s }) {
-  const c = (a == null ? void 0 : a.value) ?? "", m = s ? s(c) : c;
+function T({ x: r, y: n, payload: a, anchor: i, dy: t, format: l }) {
+  const c = (a == null ? void 0 : a.value) ?? "", m = l ? l(c) : c;
   return /* @__PURE__ */ e("text", { x: r, y: n, dy: t, textAnchor: i, className: "fill-tertiary text-xs tabular-nums", children: m });
 }
 function M({
@@ -36,31 +28,31 @@ function M({
   label: a,
   format: i,
   labelKey: t,
-  renderer: s
+  renderer: l
 }) {
-  var x, u;
+  var v, u;
   const c = (n ?? []).map((d, p) => {
-    const h = d.payload && typeof d.payload == "object" ? d.payload : void 0;
+    const x = d.payload && typeof d.payload == "object" ? d.payload : void 0;
     return {
       key: d.dataKey ?? p,
       name: d.name ?? d.dataKey ?? p,
       value: d.value,
       color: d.color,
-      datum: h
+      datum: x
     };
-  }), m = t ? (u = (x = c[0]) == null ? void 0 : x.datum) == null ? void 0 : u[t] : void 0, f = {
+  }), m = t ? (u = (v = c[0]) == null ? void 0 : v.datum) == null ? void 0 : u[t] : void 0, f = {
     active: !!r,
     label: typeof m == "string" || typeof m == "number" ? m : a,
     items: c,
     formatValue: i
   };
-  if (s) return /* @__PURE__ */ e(G, { children: s(f) });
+  if (l) return /* @__PURE__ */ e(E, { children: l(f) });
   if (!f.active || !c.length) return null;
-  const l = c.length === 1, g = f.label ?? (l ? c[0].name : void 0);
+  const o = c.length === 1, b = f.label ?? (o ? c[0].name : void 0);
   return /* @__PURE__ */ y("div", { className: "rounded-md bg-foreground px-2.5 py-1.5 text-xs text-background", children: [
-    /* @__PURE__ */ e("div", { className: C("text-xs font-medium tracking-wide uppercase text-background/60", !l && "mb-1"), children: g }),
+    /* @__PURE__ */ e("div", { className: C("text-xs font-medium tracking-wide uppercase text-background/60", !o && "mb-1"), children: b }),
     c.map((d) => /* @__PURE__ */ y("div", { className: "flex items-center gap-1.5", children: [
-      !l && /* @__PURE__ */ y(G, { children: [
+      !o && /* @__PURE__ */ y(E, { children: [
         /* @__PURE__ */ e("span", { "aria-hidden": !0, className: "size-1.5 rounded-dot", style: { background: d.color } }),
         /* @__PURE__ */ e("span", { className: "text-background/70", children: d.name })
       ] }),
@@ -69,25 +61,25 @@ function M({
   ] });
 }
 const V = "pointer-events-none inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium whitespace-nowrap";
-function Me({ viewBox: r, label: n, color: a, axis: i }) {
+function Fe({ viewBox: r, label: n, color: a, axis: i }) {
   const t = r ?? {};
   return i === "y" ? /* @__PURE__ */ e("foreignObject", { x: t.x ?? 0, y: (t.y ?? 0) - 10, width: t.width ?? 0, height: 20, className: "overflow-visible", children: /* @__PURE__ */ e("div", { className: "flex h-full items-center justify-end pr-1", children: /* @__PURE__ */ e("span", { className: C(V, S[a].pill), children: n }) }) }) : /* @__PURE__ */ e("foreignObject", { x: (t.x ?? 0) - 90, y: (t.y ?? 0) - 10, width: 180, height: 20, className: "overflow-visible", children: /* @__PURE__ */ e("div", { className: "flex h-full items-center justify-center", children: /* @__PURE__ */ e("span", { className: C(V, S[a].pill), children: n }) }) });
 }
-function Le({ viewBox: r, label: n, color: a }) {
+function Me({ viewBox: r, label: n, color: a }) {
   const i = r ?? {};
   return /* @__PURE__ */ e("foreignObject", { x: i.x ?? 0, y: i.y ?? 0, width: i.width ?? 0, height: 28, className: "overflow-visible", children: /* @__PURE__ */ e("div", { className: "flex h-full items-center pl-1.5", children: /* @__PURE__ */ e("span", { className: C(V, S[a].pill), children: n }) }) });
 }
-function Oe({
+function Le({
   cx: r,
   cy: n,
   n: a,
   ann: i,
   onEnter: t,
-  onLeave: s
+  onLeave: l
 }) {
-  const [c, m] = k.useState(!1);
+  const [c, m] = N.useState(!1);
   if (r == null || n == null || !Number.isFinite(r) || !Number.isFinite(n)) return /* @__PURE__ */ e("g", {});
-  const f = () => t({ ann: i, n: a, cx: r, cy: n }), l = () => s();
+  const f = () => t({ ann: i, n: a, cx: r, cy: n }), o = () => l();
   return /* @__PURE__ */ y(
     "g",
     {
@@ -96,12 +88,12 @@ function Oe({
       "aria-label": `Annotation ${a}: ${i.label}`,
       className: "cursor-default outline-none [transform-box:fill-box] origin-center transition-transform ease-out [transition-duration:var(--duration-fast)] hover:scale-110 focus-visible:scale-110",
       onMouseEnter: f,
-      onMouseLeave: l,
+      onMouseLeave: o,
       onFocus: () => {
         m(!0), f();
       },
       onBlur: () => {
-        m(!1), l();
+        m(!1), o();
       },
       children: [
         c && /* @__PURE__ */ e("circle", { cx: r, cy: n, r: 12, fill: "none", stroke: "var(--ring)", strokeWidth: 2 }),
@@ -122,8 +114,8 @@ function Oe({
     }
   );
 }
-function Se({ hovered: r, frameWidth: n, format: a }) {
-  return /* @__PURE__ */ e(Ae, { reducedMotion: "user", children: /* @__PURE__ */ e(Ce, { children: r && /* @__PURE__ */ e(
+function Oe({ hovered: r, frameWidth: n, format: a }) {
+  return /* @__PURE__ */ e(we, { reducedMotion: "user", children: /* @__PURE__ */ e(Ae, { children: r && /* @__PURE__ */ e(
     "div",
     {
       className: "pointer-events-none absolute z-10",
@@ -132,9 +124,9 @@ function Se({ hovered: r, frameWidth: n, format: a }) {
         top: r.cy - 16
       },
       children: /* @__PURE__ */ y(
-        Re.div,
+        Ce.div,
         {
-          variants: Fe,
+          variants: Re,
           initial: "hidden",
           animate: "visible",
           exit: "hidden",
@@ -164,42 +156,42 @@ function Se({ hovered: r, frameWidth: n, format: a }) {
     }
   ) }) });
 }
-function K(r) {
-  const [n, a] = k.useState(null), i = k.useCallback(() => a(null), []), { back: t, front: s } = k.useMemo(() => {
+function Q(r) {
+  const [n, a] = N.useState(null), i = N.useCallback(() => a(null), []), { back: t, front: l } = N.useMemo(() => {
     const c = [], m = [];
     let f = 0;
-    return (r ?? []).forEach((l, g) => {
-      const x = l.color ?? "primary";
-      if (l.kind === "band") {
-        const u = l.axis ?? "y";
+    return (r ?? []).forEach((o, b) => {
+      const v = o.color ?? "primary";
+      if (o.kind === "band") {
+        const u = o.axis ?? "y";
         c.push(
           /* @__PURE__ */ e(
-            ke,
+            ye,
             {
-              ...u === "y" ? { y1: l.from, y2: l.to } : { x1: l.from, x2: l.to },
-              fill: S[x].ref,
+              ...u === "y" ? { y1: o.from, y2: o.to } : { x1: o.from, x2: o.to },
+              fill: S[v].ref,
               fillOpacity: 0.06,
               stroke: "none",
               ifOverflow: u === "y" ? "extendDomain" : "visible",
-              label: l.label ? /* @__PURE__ */ e(Le, { label: l.label, color: x }) : void 0
+              label: o.label ? /* @__PURE__ */ e(Me, { label: o.label, color: v }) : void 0
             },
-            `ann-${g}`
+            `ann-${b}`
           )
         );
-      } else if (l.kind === "line") {
-        const u = l.axis ?? "y";
+      } else if (o.kind === "line") {
+        const u = o.axis ?? "y";
         m.push(
           /* @__PURE__ */ e(
             Ne,
             {
-              ...u === "y" ? { y: l.value } : { x: l.value },
-              stroke: S[x].ref,
+              ...u === "y" ? { y: o.value } : { x: o.value },
+              stroke: S[v].ref,
               strokeWidth: 1,
               strokeDasharray: "4 4",
               ifOverflow: u === "y" ? "extendDomain" : "visible",
-              label: l.label ? /* @__PURE__ */ e(Me, { label: l.label, color: x, axis: u }) : void 0
+              label: o.label ? /* @__PURE__ */ e(Fe, { label: o.label, color: v, axis: u }) : void 0
             },
-            `ann-${g}`
+            `ann-${b}`
           )
         );
       } else {
@@ -207,22 +199,22 @@ function K(r) {
         const u = f;
         m.push(
           /* @__PURE__ */ e(
-            we,
+            ke,
             {
-              x: l.x,
-              y: l.y,
+              x: o.x,
+              y: o.y,
               ifOverflow: "visible",
-              shape: (d) => /* @__PURE__ */ e(Oe, { cx: d.cx, cy: d.cy, n: u, ann: l, onEnter: a, onLeave: i })
+              shape: (d) => /* @__PURE__ */ e(Le, { cx: d.cx, cy: d.cy, n: u, ann: o, onEnter: a, onLeave: i })
             },
-            `ann-${g}`
+            `ann-${b}`
           )
         );
       }
     }), { back: c, front: m };
   }, [r, i]);
-  return { back: t, front: s, hovered: n };
+  return { back: t, front: l, hovered: n };
 }
-function W({
+function z({
   items: r,
   align: n = "end",
   className: a
@@ -237,48 +229,48 @@ function W({
     t.label
   ] }, t.label)) });
 }
-const D = k.forwardRef(
-  ({ className: r, height: n, legendItems: a, hovered: i, format: t, children: s, ...c }, m) => {
-    var g;
-    const f = k.useRef(null);
-    return /* @__PURE__ */ y("div", { ref: (x) => {
-      f.current = x, typeof m == "function" ? m(x) : m && (m.current = x);
+const $ = N.forwardRef(
+  ({ className: r, height: n, legendItems: a, hovered: i, format: t, children: l, ...c }, m) => {
+    var b;
+    const f = N.useRef(null);
+    return /* @__PURE__ */ y("div", { ref: (v) => {
+      f.current = v, typeof m == "function" ? m(v) : m && (m.current = v);
     }, className: C("relative w-full font-sans", r), ...c, children: [
-      a && /* @__PURE__ */ e(W, { items: a }),
-      /* @__PURE__ */ e($, { width: "100%", height: n, children: s }),
-      /* @__PURE__ */ e(Se, { hovered: i, frameWidth: ((g = f.current) == null ? void 0 : g.clientWidth) ?? 0, format: t })
+      a && /* @__PURE__ */ e(z, { items: a }),
+      /* @__PURE__ */ e(B, { width: "100%", height: n, children: l }),
+      /* @__PURE__ */ e(Oe, { hovered: i, frameWidth: ((b = f.current) == null ? void 0 : b.clientWidth) ?? 0, format: t })
     ] });
   }
 );
-D.displayName = "ChartFrame";
-function z(r) {
+$.displayName = "ChartFrame";
+function P(r) {
   const {
     data: n,
     categoryKey: a,
     series: i,
     seriesLabels: t,
-    highlight: s,
+    highlight: l,
     annotations: c,
     grid: m = !0,
     legend: f,
-    showYAxis: l = !0,
-    formatValue: g,
-    xScale: x = "category",
+    showYAxis: o = !0,
+    formatValue: b,
+    xScale: v = "category",
     xDomain: u,
     yDomain: d,
     xTickFormatter: p,
-    yTickFormatter: h,
-    yAxisWidth: o = 44
-  } = r, v = k.useMemo(() => i ?? Q(n, a), [i, n, a]), b = g ?? L, N = h ?? ((R) => typeof R == "number" ? b(R) : R), O = K(c), w = (R, P) => s && v.includes(s) ? R === s ? "var(--color-chart-1)" : _ : J(P), A = (R) => (t == null ? void 0 : t[R]) ?? R, te = f ?? v.length > 1 ? v.map((R, P) => ({ label: A(R), color: w(R, P) })) : null;
-  return { names: v, format: b, layers: O, legendItems: te, furniture: [
+    yTickFormatter: x,
+    yAxisWidth: s = 44
+  } = r, g = N.useMemo(() => i ?? J(n, a), [i, n, a]), h = b ?? L, k = x ?? ((R) => typeof R == "number" ? h(R) : R), O = Q(c), w = (R, G) => l && g.includes(l) ? R === l ? "var(--color-chart-1)" : _ : W(G), A = (R) => (t == null ? void 0 : t[R]) ?? R, ee = f ?? g.length > 1 ? g.map((R, G) => ({ label: A(R), color: w(R, G) })) : null;
+  return { names: g, format: h, layers: O, legendItems: ee, furniture: [
     m ? /* @__PURE__ */ e(Y, { vertical: !1, stroke: "var(--border)" }, "grid") : null,
     /* @__PURE__ */ e(
       H,
       {
         dataKey: a,
-        type: x === "time" ? "number" : "category",
-        scale: x === "time" ? "time" : "auto",
-        domain: x === "time" ? u ?? ["dataMin", "dataMax"] : u,
+        type: v === "time" ? "number" : "category",
+        scale: v === "time" ? "time" : "auto",
+        domain: v === "time" ? u ?? ["dataMin", "dataMax"] : u,
         allowDataOverflow: !!u,
         axisLine: !1,
         tickLine: !1,
@@ -288,26 +280,26 @@ function z(r) {
       },
       "x"
     ),
-    l ? /* @__PURE__ */ e(
+    o ? /* @__PURE__ */ e(
       I,
       {
-        width: o,
+        width: s,
         domain: d,
         allowDataOverflow: !!d,
         axisLine: !1,
         tickLine: !1,
         tickMargin: 6,
-        tick: /* @__PURE__ */ e(T, { anchor: "end", dy: "0.32em", format: N })
+        tick: /* @__PURE__ */ e(T, { anchor: "end", dy: "0.32em", format: k })
       },
       "y"
     ) : null
   ], colorFor: w, labelFor: A };
 }
-const j = { top: 20, right: 12, bottom: 4, left: 0 }, Te = k.forwardRef(
-  ({ height: r = 280, curve: n = "natural", forecastKeys: a, className: i, ...t }, s) => {
-    const { names: c, format: m, layers: f, legendItems: l, furniture: g, colorFor: x, labelFor: u } = z(t);
-    return /* @__PURE__ */ e(D, { ref: s, className: i, height: r, legendItems: l, hovered: f.hovered, format: m, children: /* @__PURE__ */ y(re, { data: t.data, margin: j, children: [
-      g,
+const D = { top: 20, right: 12, bottom: 4, left: 0 }, Se = N.forwardRef(
+  ({ height: r = 280, curve: n = "natural", forecastKeys: a, className: i, ...t }, l) => {
+    const { names: c, format: m, layers: f, legendItems: o, furniture: b, colorFor: v, labelFor: u } = P(t);
+    return /* @__PURE__ */ e($, { ref: l, className: i, height: r, legendItems: o, hovered: f.hovered, format: m, children: /* @__PURE__ */ y(te, { data: t.data, margin: D, children: [
+      b,
       t.tooltip !== !1 && /* @__PURE__ */ e(
         F,
         {
@@ -329,7 +321,7 @@ const j = { top: 20, right: 12, bottom: 4, left: 0 }, Te = k.forwardRef(
           dataKey: d,
           name: u(d),
           type: n,
-          stroke: x(d, p),
+          stroke: v(d, p),
           strokeWidth: 2,
           strokeDasharray: a != null && a.includes(d) ? "6 4" : void 0,
           dot: !1,
@@ -342,61 +334,61 @@ const j = { top: 20, right: 12, bottom: 4, left: 0 }, Te = k.forwardRef(
     ] }) });
   }
 );
-Te.displayName = "LineChart";
-const Be = k.forwardRef(
-  ({ height: r = 280, curve: n = "natural", stacked: a = !1, forecastKeys: i, className: t, ...s }, c) => {
-    const { names: m, format: f, layers: l, legendItems: g, furniture: x, colorFor: u, labelFor: d } = z(s), p = k.useId().replace(/[^a-zA-Z0-9]/g, "");
-    return /* @__PURE__ */ e(D, { ref: c, className: t, height: r, legendItems: g, hovered: l.hovered, format: f, children: /* @__PURE__ */ y(ae, { data: s.data, margin: j, children: [
-      /* @__PURE__ */ e("defs", { children: m.map((h, o) => /* @__PURE__ */ y("linearGradient", { id: `${p}-${o}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-        /* @__PURE__ */ e("stop", { offset: "0%", stopColor: u(h, o), stopOpacity: 0.18 }),
-        /* @__PURE__ */ e("stop", { offset: "100%", stopColor: u(h, o), stopOpacity: 0.02 })
-      ] }, h)) }),
-      x,
-      s.tooltip !== !1 && /* @__PURE__ */ e(
+Se.displayName = "LineChart";
+const Te = N.forwardRef(
+  ({ height: r = 280, curve: n = "natural", stacked: a = !1, forecastKeys: i, className: t, ...l }, c) => {
+    const { names: m, format: f, layers: o, legendItems: b, furniture: v, colorFor: u, labelFor: d } = P(l), p = N.useId().replace(/[^a-zA-Z0-9]/g, "");
+    return /* @__PURE__ */ e($, { ref: c, className: t, height: r, legendItems: b, hovered: o.hovered, format: f, children: /* @__PURE__ */ y(re, { data: l.data, margin: D, children: [
+      /* @__PURE__ */ e("defs", { children: m.map((x, s) => /* @__PURE__ */ y("linearGradient", { id: `${p}-${s}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+        /* @__PURE__ */ e("stop", { offset: "0%", stopColor: u(x, s), stopOpacity: 0.18 }),
+        /* @__PURE__ */ e("stop", { offset: "100%", stopColor: u(x, s), stopOpacity: 0.02 })
+      ] }, x)) }),
+      v,
+      l.tooltip !== !1 && /* @__PURE__ */ e(
         F,
         {
           content: /* @__PURE__ */ e(
             M,
             {
               format: f,
-              renderer: s.tooltip
+              renderer: l.tooltip
             }
           ),
           cursor: { stroke: "var(--border-strong)" },
           isAnimationActive: !1
         }
       ),
-      l.back,
-      m.map((h, o) => /* @__PURE__ */ e(
-        ne,
+      o.back,
+      m.map((x, s) => /* @__PURE__ */ e(
+        ae,
         {
-          dataKey: h,
-          name: d(h),
+          dataKey: x,
+          name: d(x),
           type: n,
           stackId: a ? "stack" : void 0,
-          stroke: u(h, o),
+          stroke: u(x, s),
           strokeWidth: 2,
-          strokeDasharray: i != null && i.includes(h) ? "6 4" : void 0,
-          fill: `url(#${p}-${o})`,
+          strokeDasharray: i != null && i.includes(x) ? "6 4" : void 0,
+          fill: `url(#${p}-${s})`,
           activeDot: { r: 4, strokeWidth: 2, stroke: "var(--background)" },
           isAnimationActive: !1
         },
-        h
+        x
       )),
-      l.front
+      o.front
     ] }) });
   }
 );
-Be.displayName = "AreaChart";
-const $e = k.forwardRef(
+Te.displayName = "AreaChart";
+const Be = N.forwardRef(
   ({
     height: r = 280,
     stacked: n = !1,
     layout: a = "vertical",
     className: i,
     ...t
-  }, s) => {
-    const { names: c, format: m, layers: f, legendItems: l, furniture: g, colorFor: x, labelFor: u } = z(t), d = a === "horizontal", p = t.xTickFormatter ?? ((v) => typeof v == "number" ? m(v) : v), h = [
+  }, l) => {
+    const { names: c, format: m, layers: f, legendItems: o, furniture: b, colorFor: v, labelFor: u } = P(t), d = a === "horizontal", p = t.xTickFormatter ?? ((g) => typeof g == "number" ? m(g) : g), x = [
       t.grid !== !1 ? /* @__PURE__ */ e(
         Y,
         {
@@ -440,16 +432,16 @@ const $e = k.forwardRef(
         },
         "y"
       ) : null
-    ], o = t.highlight && c.length === 1 && !c.includes(t.highlight) ? t.highlight : null;
-    return /* @__PURE__ */ e(D, { ref: s, className: i, height: r, legendItems: l, hovered: f.hovered, format: m, children: /* @__PURE__ */ y(
-      ie,
+    ], s = t.highlight && c.length === 1 && !c.includes(t.highlight) ? t.highlight : null;
+    return /* @__PURE__ */ e($, { ref: l, className: i, height: r, legendItems: o, hovered: f.hovered, format: m, children: /* @__PURE__ */ y(
+      ne,
       {
         data: t.data,
         layout: d ? "vertical" : "horizontal",
-        margin: j,
+        margin: D,
         barCategoryGap: "24%",
         children: [
-          d ? h : g,
+          d ? x : b,
           t.tooltip !== !1 && /* @__PURE__ */ e(
             F,
             {
@@ -465,27 +457,27 @@ const $e = k.forwardRef(
             }
           ),
           f.back,
-          c.map((v, b) => {
-            const N = n ? b === c.length - 1 : !0, O = d ? [0, 4, 4, 0] : [4, 4, 0, 0];
+          c.map((g, h) => {
+            const k = n ? h === c.length - 1 : !0, O = d ? [0, 4, 4, 0] : [4, 4, 0, 0];
             return /* @__PURE__ */ e(
               Z,
               {
-                dataKey: v,
-                name: u(v),
+                dataKey: g,
+                name: u(g),
                 stackId: n ? "stack" : void 0,
-                fill: x(v, b),
-                radius: N ? O : 0,
+                fill: v(g, h),
+                radius: k ? O : 0,
                 maxBarSize: 48,
                 isAnimationActive: !1,
-                children: o && t.data.map((w) => /* @__PURE__ */ e(
+                children: s && t.data.map((w) => /* @__PURE__ */ e(
                   X,
                   {
-                    fill: w[t.categoryKey] === o ? "var(--color-chart-1)" : _
+                    fill: w[t.categoryKey] === s ? "var(--color-chart-1)" : _
                   },
                   String(w[t.categoryKey])
                 ))
               },
-              v
+              g
             );
           }),
           f.front
@@ -494,11 +486,11 @@ const $e = k.forwardRef(
     ) });
   }
 );
-$e.displayName = "BarChart";
-const ee = k.forwardRef(
-  ({ height: r = 280, lineKeys: n, dualAxis: a = !1, stacked: i = !1, forecastKeys: t, className: s, ...c }, m) => {
-    const { names: f, format: l, layers: g, legendItems: x, furniture: u, colorFor: d, labelFor: p } = z(c), h = f.filter((o) => !n.includes(o));
-    return /* @__PURE__ */ e(D, { ref: m, className: s, height: r, legendItems: x, hovered: g.hovered, format: l, children: /* @__PURE__ */ y(oe, { data: c.data, margin: j, barCategoryGap: "24%", children: [
+Be.displayName = "BarChart";
+const K = N.forwardRef(
+  ({ height: r = 280, lineKeys: n, dualAxis: a = !1, stacked: i = !1, forecastKeys: t, className: l, ...c }, m) => {
+    const { names: f, format: o, layers: b, legendItems: v, furniture: u, colorFor: d, labelFor: p } = P(c), x = f.filter((s) => !n.includes(s));
+    return /* @__PURE__ */ e($, { ref: m, className: l, height: r, legendItems: v, hovered: b.hovered, format: o, children: /* @__PURE__ */ y(ie, { data: c.data, margin: D, barCategoryGap: "24%", children: [
       u,
       a && /* @__PURE__ */ e(
         I,
@@ -514,7 +506,7 @@ const ee = k.forwardRef(
             {
               anchor: "start",
               dy: "0.32em",
-              format: (o) => typeof o == "number" ? l(o) : o
+              format: (s) => typeof s == "number" ? o(s) : s
             }
           )
         }
@@ -525,7 +517,7 @@ const ee = k.forwardRef(
           content: /* @__PURE__ */ e(
             M,
             {
-              format: l,
+              format: o,
               renderer: c.tooltip
             }
           ),
@@ -533,87 +525,87 @@ const ee = k.forwardRef(
           isAnimationActive: !1
         }
       ),
-      g.back,
-      h.map((o) => {
-        const v = f.indexOf(o), b = i ? o === h[h.length - 1] : !0;
+      b.back,
+      x.map((s) => {
+        const g = f.indexOf(s), h = i ? s === x[x.length - 1] : !0;
         return /* @__PURE__ */ e(
           Z,
           {
-            dataKey: o,
-            name: p(o),
+            dataKey: s,
+            name: p(s),
             stackId: i ? "stack" : void 0,
-            fill: d(o, v),
-            radius: b ? [4, 4, 0, 0] : 0,
+            fill: d(s, g),
+            radius: h ? [4, 4, 0, 0] : 0,
             maxBarSize: 48,
             isAnimationActive: !1
           },
-          o
+          s
         );
       }),
-      n.map((o) => {
-        const v = f.indexOf(o);
+      n.map((s) => {
+        const g = f.indexOf(s);
         return /* @__PURE__ */ e(
           U,
           {
-            dataKey: o,
-            name: p(o),
+            dataKey: s,
+            name: p(s),
             yAxisId: a ? "right" : void 0,
             type: "natural",
-            stroke: d(o, v),
+            stroke: d(s, g),
             strokeWidth: 2,
-            strokeDasharray: t != null && t.includes(o) ? "6 4" : void 0,
+            strokeDasharray: t != null && t.includes(s) ? "6 4" : void 0,
             dot: !1,
             activeDot: { r: 4, strokeWidth: 2, stroke: "var(--background)" },
             isAnimationActive: !1
           },
-          o
+          s
         );
       }),
-      g.front
+      b.front
     ] }) });
   }
 );
-ee.displayName = "ComboChart";
-const De = k.forwardRef(
-  (r, n) => /* @__PURE__ */ e(ee, { ref: n, ...r })
+K.displayName = "ComboChart";
+const $e = N.forwardRef(
+  (r, n) => /* @__PURE__ */ e(K, { ref: n, ...r })
 );
-De.displayName = "ComposedChart";
-const je = k.forwardRef(
+$e.displayName = "ComposedChart";
+const De = N.forwardRef(
   ({
     data: r,
     xKey: n,
     yKey: a,
     labelKey: i,
     annotations: t,
-    height: s = 280,
+    height: l = 280,
     grid: c = !0,
     showYAxis: m = !0,
     formatValue: f,
-    xScale: l = "number",
-    xDomain: g,
-    yDomain: x,
+    xScale: o = "number",
+    xDomain: b,
+    yDomain: v,
     xTickFormatter: u,
     yTickFormatter: d,
     yAxisWidth: p = 44,
-    tooltip: h,
-    className: o
-  }, v) => {
-    const b = f ?? L, N = u ?? ((A) => typeof A == "number" ? L(A) : A), O = d ?? ((A) => typeof A == "number" ? b(A) : A), w = K(t);
-    return /* @__PURE__ */ e(D, { ref: v, className: o, height: s, legendItems: null, hovered: w.hovered, format: b, children: /* @__PURE__ */ y(le, { margin: j, children: [
+    tooltip: x,
+    className: s
+  }, g) => {
+    const h = f ?? L, k = u ?? ((A) => typeof A == "number" ? L(A) : A), O = d ?? ((A) => typeof A == "number" ? h(A) : A), w = Q(t);
+    return /* @__PURE__ */ e($, { ref: g, className: s, height: l, legendItems: null, hovered: w.hovered, format: h, children: /* @__PURE__ */ y(oe, { margin: D, children: [
       c && /* @__PURE__ */ e(Y, { vertical: !1, stroke: "var(--border)" }),
       /* @__PURE__ */ e(
         H,
         {
           type: "number",
           dataKey: n,
-          scale: l === "time" ? "time" : "auto",
-          domain: g ?? (l === "time" ? ["dataMin", "dataMax"] : ["auto", "auto"]),
-          allowDataOverflow: !!g,
+          scale: o === "time" ? "time" : "auto",
+          domain: b ?? (o === "time" ? ["dataMin", "dataMax"] : ["auto", "auto"]),
+          allowDataOverflow: !!b,
           axisLine: !1,
           tickLine: !1,
           minTickGap: 28,
           tickMargin: 10,
-          tick: /* @__PURE__ */ e(T, { anchor: "middle", dy: 0, format: N })
+          tick: /* @__PURE__ */ e(T, { anchor: "middle", dy: 0, format: k })
         }
       ),
       m && /* @__PURE__ */ e(
@@ -622,23 +614,23 @@ const je = k.forwardRef(
           type: "number",
           dataKey: a,
           width: p,
-          domain: x,
-          allowDataOverflow: !!x,
+          domain: v,
+          allowDataOverflow: !!v,
           axisLine: !1,
           tickLine: !1,
           tickMargin: 6,
           tick: /* @__PURE__ */ e(T, { anchor: "end", dy: "0.32em", format: O })
         }
       ),
-      h !== !1 && /* @__PURE__ */ e(
+      x !== !1 && /* @__PURE__ */ e(
         F,
         {
           content: /* @__PURE__ */ e(
             M,
             {
-              format: b,
+              format: h,
               labelKey: i,
-              renderer: h
+              renderer: x
             }
           ),
           cursor: { stroke: "var(--border-strong)", strokeDasharray: "4 4" },
@@ -647,7 +639,7 @@ const je = k.forwardRef(
       ),
       w.back,
       /* @__PURE__ */ e(
-        se,
+        le,
         {
           data: r,
           fill: "var(--color-chart-1)",
@@ -659,44 +651,44 @@ const je = k.forwardRef(
     ] }) });
   }
 );
-je.displayName = "ScatterChart";
-const Ie = k.forwardRef(
+De.displayName = "ScatterChart";
+const je = N.forwardRef(
   ({
     data: r,
     nameKey: n,
     valueKey: a,
     donut: i = !0,
     centerLabel: t,
-    highlight: s,
+    highlight: l,
     height: c = 260,
     legend: m = !0,
     formatValue: f,
-    tooltip: l,
-    className: g
-  }, x) => {
-    const u = f ?? L, d = r.reduce((o, v) => o + (typeof v[a] == "number" ? v[a] : 0), 0), p = (o, v) => s ? o === s ? "var(--color-chart-1)" : B(Math.min(v + 3, E.length - 1)) : B(v), h = m ? r.map((o, v) => ({
-      label: `${o[n]} · ${d ? Math.round(Number(o[a]) / d * 100) : 0}%`,
-      color: p(String(o[n]), v)
+    tooltip: o,
+    className: b
+  }, v) => {
+    const u = f ?? L, d = r.reduce((g, h) => g + (typeof h[a] == "number" ? h[a] : 0), 0), p = (g, h) => W(h), x = (g) => l && g !== l ? 0.3 : 1, s = m ? r.map((g, h) => ({
+      label: `${g[n]} · ${d ? Math.round(Number(g[a]) / d * 100) : 0}%`,
+      color: p(String(g[n]), h)
     })) : null;
-    return /* @__PURE__ */ y("div", { ref: x, className: C("relative w-full font-sans", g), children: [
-      h && /* @__PURE__ */ e(W, { items: h }),
+    return /* @__PURE__ */ y("div", { ref: v, className: C("relative w-full font-sans", b), children: [
+      s && /* @__PURE__ */ e(z, { items: s }),
       /* @__PURE__ */ y("div", { className: "relative", children: [
-        /* @__PURE__ */ e($, { width: "100%", height: c, children: /* @__PURE__ */ y(ce, { margin: { top: 8, right: 8, bottom: 8, left: 8 }, children: [
-          l !== !1 && /* @__PURE__ */ e(
+        /* @__PURE__ */ e(B, { width: "100%", height: c, children: /* @__PURE__ */ y(se, { margin: { top: 8, right: 8, bottom: 8, left: 8 }, children: [
+          o !== !1 && /* @__PURE__ */ e(
             F,
             {
               content: /* @__PURE__ */ e(
                 M,
                 {
                   format: u,
-                  renderer: l
+                  renderer: o
                 }
               ),
               isAnimationActive: !1
             }
           ),
           /* @__PURE__ */ e(
-            de,
+            ce,
             {
               data: r,
               dataKey: a,
@@ -707,7 +699,14 @@ const Ie = k.forwardRef(
               cornerRadius: i ? 4 : 2,
               stroke: "none",
               isAnimationActive: !1,
-              children: r.map((o, v) => /* @__PURE__ */ e(X, { fill: p(String(o[n]), v) }, String(o[n])))
+              children: r.map((g, h) => /* @__PURE__ */ e(
+                X,
+                {
+                  fill: p(String(g[n]), h),
+                  fillOpacity: x(String(g[n]))
+                },
+                String(g[n])
+              ))
             }
           )
         ] }) }),
@@ -719,36 +718,36 @@ const Ie = k.forwardRef(
     ] });
   }
 );
-Ie.displayName = "PieChart";
-const We = k.forwardRef(
+je.displayName = "PieChart";
+const Ie = N.forwardRef(
   ({
     data: r,
     categoryKey: n,
     series: a,
     seriesLabels: i,
     highlight: t,
-    maxValue: s,
+    maxValue: l,
     height: c = 300,
     legend: m,
     formatValue: f,
-    tooltip: l,
-    className: g
-  }, x) => {
-    const u = k.useMemo(
-      () => a ?? Q(r, n),
+    tooltip: o,
+    className: b
+  }, v) => {
+    const u = N.useMemo(
+      () => a ?? J(r, n),
       [n, r, a]
-    ), d = f ?? L, p = s ?? Math.max(
+    ), d = f ?? L, p = l ?? Math.max(
       1,
       ...r.flatMap(
-        (b) => u.map(
-          (N) => typeof b[N] == "number" ? b[N] : 0
+        (h) => u.map(
+          (k) => typeof h[k] == "number" ? h[k] : 0
         )
       )
-    ), h = (b) => (i == null ? void 0 : i[b]) ?? b, o = (b, N) => t && u.includes(t) ? b === t ? "var(--color-chart-1)" : _ : J(N), v = m ?? u.length > 1 ? u.map((b, N) => ({ label: h(b), color: o(b, N) })) : null;
-    return /* @__PURE__ */ y("div", { ref: x, className: C("relative w-full font-sans", g), children: [
-      v && /* @__PURE__ */ e(W, { items: v, align: "center" }),
-      /* @__PURE__ */ e("div", { className: "mx-auto w-full max-w-[520px]", children: /* @__PURE__ */ e($, { width: "100%", height: c, children: /* @__PURE__ */ y(
-        me,
+    ), x = (h) => (i == null ? void 0 : i[h]) ?? h, s = (h, k) => t && u.includes(t) ? h === t ? "var(--color-chart-1)" : _ : W(k), g = m ?? u.length > 1 ? u.map((h, k) => ({ label: x(h), color: s(h, k) })) : null;
+    return /* @__PURE__ */ y("div", { ref: v, className: C("relative w-full font-sans", b), children: [
+      g && /* @__PURE__ */ e(z, { items: g, align: "center" }),
+      /* @__PURE__ */ e("div", { className: "mx-auto w-full max-w-[520px]", children: /* @__PURE__ */ e(B, { width: "100%", height: c, children: /* @__PURE__ */ y(
+        de,
         {
           data: r,
           cx: "50%",
@@ -756,7 +755,7 @@ const We = k.forwardRef(
           outerRadius: "68%",
           margin: { top: 10, right: 56, bottom: 16, left: 56 },
           children: [
-            /* @__PURE__ */ e(fe, { stroke: "var(--border)", radialLines: !0 }),
+            /* @__PURE__ */ e(me, { stroke: "var(--border)", radialLines: !0 }),
             /* @__PURE__ */ e(
               q,
               {
@@ -765,7 +764,7 @@ const We = k.forwardRef(
               }
             ),
             /* @__PURE__ */ e(
-              ue,
+              fe,
               {
                 angle: 90,
                 domain: [0, p],
@@ -774,32 +773,32 @@ const We = k.forwardRef(
                 tickLine: !1
               }
             ),
-            l !== !1 && /* @__PURE__ */ e(
+            o !== !1 && /* @__PURE__ */ e(
               F,
               {
                 content: /* @__PURE__ */ e(
                   M,
                   {
                     format: d,
-                    renderer: l
+                    renderer: o
                   }
                 ),
                 isAnimationActive: !1
               }
             ),
-            u.map((b, N) => /* @__PURE__ */ e(
-              he,
+            u.map((h, k) => /* @__PURE__ */ e(
+              ue,
               {
-                dataKey: b,
-                name: h(b),
-                stroke: o(b, N),
-                fill: o(b, N),
-                fillOpacity: t ? b === t ? 0.16 : 0.05 : 0.1,
+                dataKey: h,
+                name: x(h),
+                stroke: s(h, k),
+                fill: s(h, k),
+                fillOpacity: t ? h === t ? 0.16 : 0.05 : 0.1,
                 strokeWidth: 2,
-                dot: { r: 2.5, fill: o(b, N), strokeWidth: 0 },
+                dot: { r: 2.5, fill: s(h, k), strokeWidth: 0 },
                 isAnimationActive: !1
               },
-              b
+              h
             ))
           ]
         }
@@ -807,35 +806,35 @@ const We = k.forwardRef(
     ] });
   }
 );
-We.displayName = "RadarChart";
-const ze = k.forwardRef(
+Ie.displayName = "RadarChart";
+const We = N.forwardRef(
   ({
     data: r,
     nameKey: n,
     valueKey: a,
     maxValue: i = 100,
     centerLabel: t,
-    height: s = 280,
+    height: l = 280,
     legend: c = !0,
     formatValue: m,
     tooltip: f,
-    className: l
-  }, g) => {
-    const x = m ?? L, u = r.map((h, o) => ({
-      ...h,
-      name: String(h[n]),
-      fill: B(o)
+    className: o
+  }, b) => {
+    const v = m ?? L, u = r.map((x, s) => ({
+      ...x,
+      name: String(x[n]),
+      fill: j(s)
     })), d = u.length ? u.reduce(
-      (h, o) => h + (typeof o[a] == "number" ? o[a] : 0),
+      (x, s) => x + (typeof s[a] == "number" ? s[a] : 0),
       0
-    ) / u.length : 0, p = c ? u.map((h, o) => ({
-      label: String(h[n]),
-      color: B(o)
+    ) / u.length : 0, p = c ? u.map((x, s) => ({
+      label: String(x[n]),
+      color: j(s)
     })) : null;
-    return /* @__PURE__ */ y("div", { ref: g, className: C("relative w-full font-sans", l), children: [
+    return /* @__PURE__ */ y("div", { ref: b, className: C("relative w-full font-sans", o), children: [
       /* @__PURE__ */ y("div", { className: "relative mx-auto w-full max-w-[420px]", children: [
-        /* @__PURE__ */ e($, { width: "100%", height: s, children: /* @__PURE__ */ y(
-          xe,
+        /* @__PURE__ */ e(B, { width: "100%", height: l, children: /* @__PURE__ */ y(
+          he,
           {
             data: u,
             innerRadius: "48%",
@@ -851,7 +850,7 @@ const ze = k.forwardRef(
                   content: /* @__PURE__ */ e(
                     M,
                     {
-                      format: x,
+                      format: v,
                       renderer: f
                     }
                   ),
@@ -859,7 +858,7 @@ const ze = k.forwardRef(
                 }
               ),
               /* @__PURE__ */ e(
-                ve,
+                xe,
                 {
                   dataKey: a,
                   background: { fill: "var(--muted)" },
@@ -872,28 +871,28 @@ const ze = k.forwardRef(
           }
         ) }),
         /* @__PURE__ */ y("div", { className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center", children: [
-          /* @__PURE__ */ e("div", { className: "text-xl font-bold text-foreground tabular-nums", children: x(Math.round(d)) }),
+          /* @__PURE__ */ e("div", { className: "text-xl font-bold text-foreground tabular-nums", children: v(Math.round(d)) }),
           t && /* @__PURE__ */ e("div", { className: "mt-0.5 text-xs font-medium tracking-wide uppercase text-tertiary", children: t })
         ] })
       ] }),
-      p && /* @__PURE__ */ e(W, { items: p, align: "center", className: "mb-0 mt-3" })
+      p && /* @__PURE__ */ e(z, { items: p, align: "center", className: "mb-0 mt-3" })
     ] });
   }
 );
-ze.displayName = "RadialBarChart";
-function Pe({
+We.displayName = "RadialBarChart";
+function ze({
   x: r = 0,
   y: n = 0,
   width: a = 0,
   height: i = 0,
   depth: t = 0,
-  index: s = 0,
+  index: l = 0,
   name: c,
   value: m,
   format: f = L
 }) {
   if (t === 0) return /* @__PURE__ */ e("g", {});
-  const l = t === 0 ? "transparent" : B(s), g = t > 0 && s < 4, x = a > 72 && i > 38;
+  const o = t === 0 ? "transparent" : j(l), b = t > 0 && l < 4, v = a > 72 && i > 38;
   return /* @__PURE__ */ y("g", { children: [
     /* @__PURE__ */ e(
       "rect",
@@ -904,12 +903,12 @@ function Pe({
         height: i,
         rx: 6,
         ry: 6,
-        fill: l,
+        fill: o,
         stroke: "var(--background)",
         strokeWidth: 4
       }
     ),
-    x && /* @__PURE__ */ e(
+    v && /* @__PURE__ */ e(
       "foreignObject",
       {
         x: r + 8,
@@ -923,7 +922,7 @@ function Pe({
             {
               className: C(
                 "truncate text-xs font-semibold",
-                g ? "text-background" : "text-foreground"
+                b ? "text-background" : "text-foreground"
               ),
               children: c
             }
@@ -933,7 +932,7 @@ function Pe({
             {
               className: C(
                 "text-xs tabular-nums",
-                g ? "text-background/70" : "text-tertiary"
+                b ? "text-background/70" : "text-tertiary"
               ),
               children: f(m)
             }
@@ -943,53 +942,53 @@ function Pe({
     )
   ] });
 }
-function Ge(r, n, a) {
-  const i = [], t = (s) => {
-    const c = Array.isArray(s.children) ? s.children : void 0;
+function Pe(r, n, a) {
+  const i = [], t = (l) => {
+    const c = Array.isArray(l.children) ? l.children : void 0;
     if (c != null && c.length) {
       c.forEach(t);
       return;
     }
-    typeof s[a] == "number" && i.push({
-      ...s,
-      name: String(s[n] ?? ""),
-      value: s[a]
+    typeof l[a] == "number" && i.push({
+      ...l,
+      name: String(l[n] ?? ""),
+      value: l[a]
     });
   };
   return r.forEach(t), i.length ? i : r;
 }
-const Ee = k.forwardRef(
+const Ge = N.forwardRef(
   ({
     data: r,
     nameKey: n,
     valueKey: a,
     height: i = 280,
     formatValue: t,
-    tooltip: s,
+    tooltip: l,
     className: c
   }, m) => {
-    const f = t ?? L, l = k.useMemo(
-      () => Ge(r, n, a),
+    const f = t ?? L, o = N.useMemo(
+      () => Pe(r, n, a),
       [r, n, a]
     );
-    return /* @__PURE__ */ e("div", { ref: m, className: C("relative w-full font-sans", c), children: /* @__PURE__ */ e($, { width: "100%", height: i, children: /* @__PURE__ */ e(
+    return /* @__PURE__ */ e("div", { ref: m, className: C("relative w-full font-sans", c), children: /* @__PURE__ */ e(B, { width: "100%", height: i, children: /* @__PURE__ */ e(
       ge,
       {
-        data: l,
+        data: o,
         nameKey: n,
         dataKey: a,
         type: "flat",
         aspectRatio: 1.6,
-        content: /* @__PURE__ */ e(Pe, { format: f }),
+        content: /* @__PURE__ */ e(ze, { format: f }),
         isAnimationActive: !1,
-        children: s !== !1 && /* @__PURE__ */ e(
+        children: l !== !1 && /* @__PURE__ */ e(
           F,
           {
             content: /* @__PURE__ */ e(
               M,
               {
                 format: f,
-                renderer: s
+                renderer: l
               }
             ),
             isAnimationActive: !1
@@ -999,39 +998,39 @@ const Ee = k.forwardRef(
     ) }) });
   }
 );
-Ee.displayName = "TreemapChart";
-const Ve = k.forwardRef(
+Ge.displayName = "TreemapChart";
+const Ee = N.forwardRef(
   ({
     data: r,
     nameKey: n,
     valueKey: a,
     height: i = 280,
     formatValue: t,
-    label: s,
+    label: l,
     labelWidth: c = 176,
     tooltip: m,
     className: f
-  }, l) => {
+  }, o) => {
     var d;
-    const g = t ?? L, x = Number(((d = r[0]) == null ? void 0 : d[a]) ?? 0), u = (p) => {
+    const b = t ?? L, v = Number(((d = r[0]) == null ? void 0 : d[a]) ?? 0), u = (p) => {
       var A;
-      const h = p.index ?? 0, o = r[h];
-      if (!o) return /* @__PURE__ */ e("g", {});
-      const v = Number(o[a]), b = Number(((A = r[h - 1]) == null ? void 0 : A[a]) ?? v), N = x ? v / x * 100 : 0, O = b ? v / b * 100 : 0, w = {
-        datum: o,
-        index: h,
-        name: String(o[n]),
-        value: v,
-        conversionFromFirst: N,
+      const x = p.index ?? 0, s = r[x];
+      if (!s) return /* @__PURE__ */ e("g", {});
+      const g = Number(s[a]), h = Number(((A = r[x - 1]) == null ? void 0 : A[a]) ?? g), k = v ? g / v * 100 : 0, O = h ? g / h * 100 : 0, w = {
+        datum: s,
+        index: x,
+        name: String(s[n]),
+        value: g,
+        conversionFromFirst: k,
         conversionFromPrevious: O,
-        dropOffFromPrevious: h === 0 ? 0 : 100 - O,
+        dropOffFromPrevious: x === 0 ? 0 : 100 - O,
         x: Number(p.x ?? 0),
         y: Number(p.y ?? 0),
         width: Number(p.width ?? 0),
         height: Number(p.height ?? 0),
-        formatValue: g
+        formatValue: b
       };
-      return s === !1 ? /* @__PURE__ */ e("g", {}) : s ? /* @__PURE__ */ e(G, { children: s(w) }) : /* @__PURE__ */ y(
+      return l === !1 ? /* @__PURE__ */ e("g", {}) : l ? /* @__PURE__ */ e(E, { children: l(w) }) : /* @__PURE__ */ y(
         "text",
         {
           x: w.x + w.width + 12,
@@ -1043,23 +1042,23 @@ const Ve = k.forwardRef(
             /* @__PURE__ */ e("tspan", { className: "fill-primary font-medium", children: w.name }),
             /* @__PURE__ */ y("tspan", { className: "fill-secondary", children: [
               " · ",
-              g(v)
+              b(g)
             ] }),
             /* @__PURE__ */ y("tspan", { className: "fill-tertiary", children: [
               " · ",
-              Math.round(N),
+              Math.round(k),
               "%"
             ] })
           ]
         }
       );
     };
-    return /* @__PURE__ */ e("div", { ref: l, className: C("relative w-full font-sans", f), children: /* @__PURE__ */ e($, { width: "100%", height: i, children: /* @__PURE__ */ y(
-      be,
+    return /* @__PURE__ */ e("div", { ref: o, className: C("relative w-full font-sans", f), children: /* @__PURE__ */ e(B, { width: "100%", height: i, children: /* @__PURE__ */ y(
+      ve,
       {
         margin: {
           top: 8,
-          right: s === !1 ? 8 : c,
+          right: l === !1 ? 8 : c,
           bottom: 8,
           left: 8
         },
@@ -1070,33 +1069,33 @@ const Ve = k.forwardRef(
               content: /* @__PURE__ */ e(
                 M,
                 {
-                  format: g,
+                  format: b,
                   renderer: m
                 }
               ),
               isAnimationActive: !1
             }
           ),
-          /* @__PURE__ */ y(pe, { data: r, dataKey: a, nameKey: n, isAnimationActive: !1, children: [
-            r.map((p, h) => /* @__PURE__ */ e(X, { fill: B(h) }, String(p[n]))),
-            /* @__PURE__ */ e(ye, { position: "right", content: u })
+          /* @__PURE__ */ y(be, { data: r, dataKey: a, nameKey: n, isAnimationActive: !1, children: [
+            r.map((p, x) => /* @__PURE__ */ e(X, { fill: j(x) }, String(p[n]))),
+            /* @__PURE__ */ e(pe, { position: "right", content: u })
           ] })
         ]
       }
     ) }) });
   }
 );
-Ve.displayName = "FunnelChart";
+Ee.displayName = "FunnelChart";
 export {
-  Be as AreaChart,
-  $e as BarChart,
-  ee as ComboChart,
-  De as ComposedChart,
-  Ve as FunnelChart,
-  Te as LineChart,
-  Ie as PieChart,
-  We as RadarChart,
-  ze as RadialBarChart,
-  je as ScatterChart,
-  Ee as TreemapChart
+  Te as AreaChart,
+  Be as BarChart,
+  K as ComboChart,
+  $e as ComposedChart,
+  Ee as FunnelChart,
+  Se as LineChart,
+  je as PieChart,
+  Ie as RadarChart,
+  We as RadialBarChart,
+  De as ScatterChart,
+  Ge as TreemapChart
 };