tekivex-ui 2.5.11 → 2.5.12

package/dist/charts.js

@@ -1,516 +1,552 @@
-import { jsx as t, jsxs as g, Fragment as R } from "react/jsx-runtime";
-import { ResponsiveContainer as v, AreaChart as E, CartesianGrid as D, XAxis as F, YAxis as K, Tooltip as L, Legend as w, Area as G, BarChart as q, Bar as H, LineChart as N, ReferenceLine as U, Line as V, PieChart as P, Pie as B, Cell as I, ScatterChart as X, ZAxis as Y, Scatter as Z, RadarChart as _, PolarGrid as J, PolarAngleAxis as Q, PolarRadiusAxis as tt, Radar as et } from "recharts";
-import { u as z } from "./index-iUUHRxqJ.js";
-import { useState as O, useEffect as $ } from "react";
-import { u as j } from "./index-BgHMZe4Z.js";
-function M(e) {
-  return [
-    e.primary,
-    e.secondary,
-    e.info,
-    e.success,
-    e.warning,
-    e.danger,
-    e.primary + "aa",
-    // primary at 67% opacity
-    e.secondary + "aa",
-    // secondary at 67% opacity
-    e.info + "aa",
-    // info at 67% opacity
-    e.success + "aa"
-    // success at 67% opacity
-  ];
+import { f as e } from "./themes-BbJanqiC.js";
+import { o as t } from "./hooks-6pRsPOyG.js";
+import { useEffect as n, useState as r } from "react";
+import { Fragment as i, jsx as a, jsxs as o } from "react/jsx-runtime";
+import { Area as s, AreaChart as c, Bar as l, BarChart as u, CartesianGrid as d, Cell as f, Legend as p, Line as m, LineChart as h, Pie as g, PieChart as _, PolarAngleAxis as v, PolarGrid as y, PolarRadiusAxis as b, Radar as x, RadarChart as S, ReferenceLine as C, ResponsiveContainer as w, Scatter as T, ScatterChart as E, Tooltip as D, XAxis as O, YAxis as k, ZAxis as A } from "recharts";
+//#region src/charts/shared.ts
+function j(e) {
+	return [
+		e.primary,
+		e.secondary,
+		e.info,
+		e.success,
+		e.warning,
+		e.danger,
+		e.primary + "aa",
+		e.secondary + "aa",
+		e.info + "aa",
+		e.success + "aa"
+	];
 }
-const T = { top: 10, right: 30, bottom: 10, left: 0 };
-function C(e) {
-  return {
-    contentStyle: {
-      backgroundColor: e.surface,
-      border: `1px solid ${e.border}`,
-      borderRadius: 8,
-      boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
-      color: e.text,
-      fontSize: 13
-    },
-    labelStyle: { color: e.textMuted, fontWeight: 600, marginBottom: 4 },
-    itemStyle: { color: e.text },
-    cursor: { fill: `${e.primary}15` }
-  };
+var M = {
+	top: 10,
+	right: 30,
+	bottom: 10,
+	left: 0
+};
+function N(e) {
+	return {
+		contentStyle: {
+			backgroundColor: e.surface,
+			border: `1px solid ${e.border}`,
+			borderRadius: 8,
+			boxShadow: "0 4px 12px rgba(0,0,0,0.15)",
+			color: e.text,
+			fontSize: 13
+		},
+		labelStyle: {
+			color: e.textMuted,
+			fontWeight: 600,
+			marginBottom: 4
+		},
+		itemStyle: { color: e.text },
+		cursor: { fill: `${e.primary}15` }
+	};
 }
-function nt({
-  data: e,
-  series: S,
-  xKey: f,
-  height: p = 300,
-  margin: d = T,
-  showGrid: y = !0,
-  showLegend: m = !0,
-  showTooltip: x = !0,
-  smooth: a = !0,
-  xTickFormatter: u,
-  yTickFormatter: o,
-  yDomain: l,
-  ariaLabel: h = "Area chart"
-}) {
-  const r = z(), n = M(r), i = C(r), k = { fill: r.textMuted, fontSize: 12 };
-  return /* @__PURE__ */ t("div", { role: "img", "aria-label": h, style: { width: "100%", height: p }, children: /* @__PURE__ */ t(v, { width: "100%", height: "100%", children: /* @__PURE__ */ g(E, { data: e, margin: d, children: [
-    y && /* @__PURE__ */ t(D, { strokeDasharray: "3 3", stroke: r.border, vertical: !1 }),
-    /* @__PURE__ */ t(
-      F,
-      {
-        dataKey: f,
-        tick: k,
-        axisLine: { stroke: r.border },
-        tickLine: !1,
-        tickFormatter: u
-      }
-    ),
-    /* @__PURE__ */ t(
-      K,
-      {
-        tick: k,
-        axisLine: !1,
-        tickLine: !1,
-        tickFormatter: o,
-        domain: l
-      }
-    ),
-    x && /* @__PURE__ */ t(
-      L,
-      {
-        contentStyle: i.contentStyle,
-        labelStyle: i.labelStyle,
-        itemStyle: i.itemStyle,
-        cursor: i.cursor
-      }
-    ),
-    m && /* @__PURE__ */ t(
-      w,
-      {
-        wrapperStyle: { fontSize: 13, color: r.textMuted, paddingTop: 8 }
-      }
-    ),
-    S.map((s, b) => {
-      const c = s.color ?? n[b % n.length];
-      return /* @__PURE__ */ t(
-        G,
-        {
-          type: a ? "monotone" : "linear",
-          dataKey: s.key,
-          name: s.label ?? s.key,
-          stroke: c,
-          strokeWidth: 2,
-          fill: c,
-          fillOpacity: s.fillOpacity ?? 0.2,
-          stackId: s.stacked ? "stack" : void 0,
-          dot: !1,
-          activeDot: { r: 5, strokeWidth: 0 }
-        },
-        s.key
-      );
-    })
-  ] }) }) });
+//#endregion
+//#region src/charts/TkxAreaChart.tsx
+function P({ data: t, series: n, xKey: r, height: i = 300, margin: l = M, showGrid: u = !0, showLegend: f = !0, showTooltip: m = !0, smooth: h = !0, xTickFormatter: g, yTickFormatter: _, yDomain: v, ariaLabel: y = "Area chart" }) {
+	let b = e(), x = j(b), S = N(b), C = {
+		fill: b.textMuted,
+		fontSize: 12
+	};
+	return /* @__PURE__ */ a("div", {
+		role: "img",
+		"aria-label": y,
+		style: {
+			width: "100%",
+			height: i
+		},
+		children: /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			children: /* @__PURE__ */ o(c, {
+				data: t,
+				margin: l,
+				children: [
+					u && /* @__PURE__ */ a(d, {
+						strokeDasharray: "3 3",
+						stroke: b.border,
+						vertical: !1
+					}),
+					/* @__PURE__ */ a(O, {
+						dataKey: r,
+						tick: C,
+						axisLine: { stroke: b.border },
+						tickLine: !1,
+						tickFormatter: g
+					}),
+					/* @__PURE__ */ a(k, {
+						tick: C,
+						axisLine: !1,
+						tickLine: !1,
+						tickFormatter: _,
+						domain: v
+					}),
+					m && /* @__PURE__ */ a(D, {
+						contentStyle: S.contentStyle,
+						labelStyle: S.labelStyle,
+						itemStyle: S.itemStyle,
+						cursor: S.cursor
+					}),
+					f && /* @__PURE__ */ a(p, { wrapperStyle: {
+						fontSize: 13,
+						color: b.textMuted,
+						paddingTop: 8
+					} }),
+					n.map((e, t) => {
+						let n = e.color ?? x[t % x.length];
+						return /* @__PURE__ */ a(s, {
+							type: h ? "monotone" : "linear",
+							dataKey: e.key,
+							name: e.label ?? e.key,
+							stroke: n,
+							strokeWidth: 2,
+							fill: n,
+							fillOpacity: e.fillOpacity ?? .2,
+							stackId: e.stacked ? "stack" : void 0,
+							dot: !1,
+							activeDot: {
+								r: 5,
+								strokeWidth: 0
+							}
+						}, e.key);
+					})
+				]
+			})
+		})
+	});
 }
-function ct({
-  data: e,
-  series: S,
-  xKey: f,
-  height: p = 300,
-  margin: d = T,
-  showGrid: y = !0,
-  showLegend: m = !0,
-  showTooltip: x = !0,
-  layout: a = "horizontal",
-  barSize: u,
-  xTickFormatter: o,
-  yTickFormatter: l,
-  ariaLabel: h = "Bar chart"
-}) {
-  const r = z(), n = M(r), i = C(r), k = { fill: r.textMuted, fontSize: 12 }, s = a === "vertical";
-  return /* @__PURE__ */ t("div", { role: "img", "aria-label": h, style: { width: "100%", height: p }, children: /* @__PURE__ */ t(v, { width: "100%", height: "100%", children: /* @__PURE__ */ g(q, { data: e, margin: d, layout: a, children: [
-    y && /* @__PURE__ */ t(
-      D,
-      {
-        strokeDasharray: "3 3",
-        stroke: r.border,
-        vertical: s,
-        horizontal: !s
-      }
-    ),
-    s ? /* @__PURE__ */ g(R, { children: [
-      /* @__PURE__ */ t(K, { dataKey: f, type: "category", tick: k, axisLine: !1, tickLine: !1, tickFormatter: o, width: 100 }),
-      /* @__PURE__ */ t(F, { type: "number", tick: k, axisLine: { stroke: r.border }, tickLine: !1, tickFormatter: l })
-    ] }) : /* @__PURE__ */ g(R, { children: [
-      /* @__PURE__ */ t(F, { dataKey: f, tick: k, axisLine: { stroke: r.border }, tickLine: !1, tickFormatter: o }),
-      /* @__PURE__ */ t(K, { tick: k, axisLine: !1, tickLine: !1, tickFormatter: l })
-    ] }),
-    x && /* @__PURE__ */ t(
-      L,
-      {
-        contentStyle: i.contentStyle,
-        labelStyle: i.labelStyle,
-        itemStyle: i.itemStyle,
-        cursor: { fill: `${r.surfaceAlt}` }
-      }
-    ),
-    m && /* @__PURE__ */ t(w, { wrapperStyle: { fontSize: 13, color: r.textMuted, paddingTop: 8 } }),
-    S.map((b, c) => {
-      const A = b.color ?? n[c % n.length];
-      return /* @__PURE__ */ t(
-        H,
-        {
-          dataKey: b.key,
-          name: b.label ?? b.key,
-          fill: A,
-          stackId: b.stackId,
-          maxBarSize: u ?? 40,
-          radius: b.radius ?? [4, 4, 0, 0]
-        },
-        b.key
-      );
-    })
-  ] }) }) });
+//#endregion
+//#region src/charts/TkxBarChart.tsx
+function F({ data: t, series: n, xKey: r, height: s = 300, margin: c = M, showGrid: f = !0, showLegend: m = !0, showTooltip: h = !0, layout: g = "horizontal", barSize: _, xTickFormatter: v, yTickFormatter: y, ariaLabel: b = "Bar chart" }) {
+	let x = e(), S = j(x), C = N(x), T = {
+		fill: x.textMuted,
+		fontSize: 12
+	}, E = g === "vertical";
+	return /* @__PURE__ */ a("div", {
+		role: "img",
+		"aria-label": b,
+		style: {
+			width: "100%",
+			height: s
+		},
+		children: /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			children: /* @__PURE__ */ o(u, {
+				data: t,
+				margin: c,
+				layout: g,
+				children: [
+					f && /* @__PURE__ */ a(d, {
+						strokeDasharray: "3 3",
+						stroke: x.border,
+						vertical: E,
+						horizontal: !E
+					}),
+					E ? /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a(k, {
+						dataKey: r,
+						type: "category",
+						tick: T,
+						axisLine: !1,
+						tickLine: !1,
+						tickFormatter: v,
+						width: 100
+					}), /* @__PURE__ */ a(O, {
+						type: "number",
+						tick: T,
+						axisLine: { stroke: x.border },
+						tickLine: !1,
+						tickFormatter: y
+					})] }) : /* @__PURE__ */ o(i, { children: [/* @__PURE__ */ a(O, {
+						dataKey: r,
+						tick: T,
+						axisLine: { stroke: x.border },
+						tickLine: !1,
+						tickFormatter: v
+					}), /* @__PURE__ */ a(k, {
+						tick: T,
+						axisLine: !1,
+						tickLine: !1,
+						tickFormatter: y
+					})] }),
+					h && /* @__PURE__ */ a(D, {
+						contentStyle: C.contentStyle,
+						labelStyle: C.labelStyle,
+						itemStyle: C.itemStyle,
+						cursor: { fill: `${x.surfaceAlt}` }
+					}),
+					m && /* @__PURE__ */ a(p, { wrapperStyle: {
+						fontSize: 13,
+						color: x.textMuted,
+						paddingTop: 8
+					} }),
+					n.map((e, t) => {
+						let n = e.color ?? S[t % S.length];
+						return /* @__PURE__ */ a(l, {
+							dataKey: e.key,
+							name: e.label ?? e.key,
+							fill: n,
+							stackId: e.stackId,
+							maxBarSize: _ ?? 40,
+							radius: e.radius ?? [
+								4,
+								4,
+								0,
+								0
+							]
+						}, e.key);
+					})
+				]
+			})
+		})
+	});
 }
-function dt({
-  data: e,
-  series: S,
-  xKey: f,
-  height: p = 300,
-  margin: d = T,
-  showGrid: y = !0,
-  showLegend: m = !0,
-  showTooltip: x = !0,
-  smooth: a = !0,
-  referenceLines: u = [],
-  xTickFormatter: o,
-  yTickFormatter: l,
-  yDomain: h,
-  connectNulls: r = !1,
-  ariaLabel: n = "Line chart"
-}) {
-  const i = z(), k = M(i), s = C(i), b = { fill: i.textMuted, fontSize: 12 };
-  return /* @__PURE__ */ t("div", { role: "img", "aria-label": n, style: { width: "100%", height: p }, children: /* @__PURE__ */ t(v, { width: "100%", height: "100%", children: /* @__PURE__ */ g(N, { data: e, margin: d, children: [
-    y && /* @__PURE__ */ t(D, { strokeDasharray: "3 3", stroke: i.border, vertical: !1 }),
-    /* @__PURE__ */ t(
-      F,
-      {
-        dataKey: f,
-        tick: b,
-        axisLine: { stroke: i.border },
-        tickLine: !1,
-        tickFormatter: o
-      }
-    ),
-    /* @__PURE__ */ t(
-      K,
-      {
-        tick: b,
-        axisLine: !1,
-        tickLine: !1,
-        tickFormatter: l,
-        domain: h
-      }
-    ),
-    x && /* @__PURE__ */ t(
-      L,
-      {
-        contentStyle: s.contentStyle,
-        labelStyle: s.labelStyle,
-        itemStyle: s.itemStyle,
-        cursor: { stroke: i.border, strokeWidth: 1 }
-      }
-    ),
-    m && /* @__PURE__ */ t(w, { wrapperStyle: { fontSize: 13, color: i.textMuted, paddingTop: 8 } }),
-    u.map((c, A) => /* @__PURE__ */ t(
-      U,
-      {
-        y: c.y,
-        x: c.x,
-        label: c.label ? { value: c.label, fill: i.textMuted, fontSize: 11 } : void 0,
-        stroke: c.color ?? i.border,
-        strokeDasharray: c.dashed ? "4 4" : void 0
-      },
-      A
-    )),
-    S.map((c, A) => {
-      const W = c.color ?? k[A % k.length];
-      return /* @__PURE__ */ t(
-        V,
-        {
-          type: a ? "monotone" : "linear",
-          dataKey: c.key,
-          name: c.label ?? c.key,
-          stroke: W,
-          strokeWidth: c.strokeWidth ?? 2,
-          strokeDasharray: c.dashed ? "6 3" : void 0,
-          dot: c.dot ?? !1,
-          activeDot: { r: 5, strokeWidth: 0, fill: W },
-          connectNulls: r
-        },
-        c.key
-      );
-    })
-  ] }) }) });
+//#endregion
+//#region src/charts/TkxLineChart.tsx
+function I({ data: t, series: n, xKey: r, height: i = 300, margin: s = M, showGrid: c = !0, showLegend: l = !0, showTooltip: u = !0, smooth: f = !0, referenceLines: g = [], xTickFormatter: _, yTickFormatter: v, yDomain: y, connectNulls: b = !1, ariaLabel: x = "Line chart" }) {
+	let S = e(), T = j(S), E = N(S), A = {
+		fill: S.textMuted,
+		fontSize: 12
+	};
+	return /* @__PURE__ */ a("div", {
+		role: "img",
+		"aria-label": x,
+		style: {
+			width: "100%",
+			height: i
+		},
+		children: /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			children: /* @__PURE__ */ o(h, {
+				data: t,
+				margin: s,
+				children: [
+					c && /* @__PURE__ */ a(d, {
+						strokeDasharray: "3 3",
+						stroke: S.border,
+						vertical: !1
+					}),
+					/* @__PURE__ */ a(O, {
+						dataKey: r,
+						tick: A,
+						axisLine: { stroke: S.border },
+						tickLine: !1,
+						tickFormatter: _
+					}),
+					/* @__PURE__ */ a(k, {
+						tick: A,
+						axisLine: !1,
+						tickLine: !1,
+						tickFormatter: v,
+						domain: y
+					}),
+					u && /* @__PURE__ */ a(D, {
+						contentStyle: E.contentStyle,
+						labelStyle: E.labelStyle,
+						itemStyle: E.itemStyle,
+						cursor: {
+							stroke: S.border,
+							strokeWidth: 1
+						}
+					}),
+					l && /* @__PURE__ */ a(p, { wrapperStyle: {
+						fontSize: 13,
+						color: S.textMuted,
+						paddingTop: 8
+					} }),
+					g.map((e, t) => /* @__PURE__ */ a(C, {
+						y: e.y,
+						x: e.x,
+						label: e.label ? {
+							value: e.label,
+							fill: S.textMuted,
+							fontSize: 11
+						} : void 0,
+						stroke: e.color ?? S.border,
+						strokeDasharray: e.dashed ? "4 4" : void 0
+					}, t)),
+					n.map((e, t) => {
+						let n = e.color ?? T[t % T.length];
+						return /* @__PURE__ */ a(m, {
+							type: f ? "monotone" : "linear",
+							dataKey: e.key,
+							name: e.label ?? e.key,
+							stroke: n,
+							strokeWidth: e.strokeWidth ?? 2,
+							strokeDasharray: e.dashed ? "6 3" : void 0,
+							dot: e.dot ?? !1,
+							activeDot: {
+								r: 5,
+								strokeWidth: 0,
+								fill: n
+							},
+							connectNulls: b
+						}, e.key);
+					})
+				]
+			})
+		})
+	});
 }
-function st({
-  data: e,
-  height: S = 300,
-  showLegend: f = !0,
-  showTooltip: p = !0,
-  showLabels: d = !1,
-  outerRadius: y = "70%",
-  startAngle: m = 90,
-  ariaLabel: x = "Pie chart"
-}) {
-  const a = z(), u = j(), o = M(a), l = C(a), [h, r] = O(u);
-  return $(() => {
-    if (u) {
-      r(!0);
-      return;
-    }
-    const n = requestAnimationFrame(() => r(!0));
-    return () => cancelAnimationFrame(n);
-  }, [u]), /* @__PURE__ */ t(
-    "div",
-    {
-      role: "img",
-      "aria-label": x,
-      style: { width: "100%", minWidth: 240, height: S, position: "relative" },
-      children: h && /* @__PURE__ */ t(v, { width: "100%", height: "100%", debounce: 50, children: /* @__PURE__ */ g(P, { children: [
-        p && /* @__PURE__ */ t(
-          L,
-          {
-            contentStyle: l.contentStyle,
-            labelStyle: l.labelStyle,
-            itemStyle: l.itemStyle
-          }
-        ),
-        f && /* @__PURE__ */ t(w, { wrapperStyle: { fontSize: 13, color: a.textMuted } }),
-        /* @__PURE__ */ t(
-          B,
-          {
-            data: e,
-            dataKey: "value",
-            nameKey: "name",
-            outerRadius: y,
-            startAngle: m,
-            endAngle: m - 360,
-            label: d ? ({ name: n, percent: i }) => `${n} (${(i * 100).toFixed(0)}%)` : void 0,
-            labelLine: d,
-            strokeWidth: 2,
-            stroke: a.bg,
-            children: e.map((n, i) => /* @__PURE__ */ t(
-              I,
-              {
-                fill: n.color ?? o[i % o.length]
-              },
-              n.name
-            ))
-          }
-        )
-      ] }) })
-    }
-  );
+//#endregion
+//#region src/charts/TkxPieChart.tsx
+function L({ data: i, height: s = 300, showLegend: c = !0, showTooltip: l = !0, showLabels: u = !1, outerRadius: d = "70%", startAngle: m = 90, ariaLabel: h = "Pie chart" }) {
+	let v = e(), y = t(), b = j(v), x = N(v), [S, C] = r(y);
+	return n(() => {
+		if (y) {
+			C(!0);
+			return;
+		}
+		let e = requestAnimationFrame(() => C(!0));
+		return () => cancelAnimationFrame(e);
+	}, [y]), /* @__PURE__ */ a("div", {
+		role: "img",
+		"aria-label": h,
+		style: {
+			width: "100%",
+			minWidth: 240,
+			height: s,
+			position: "relative"
+		},
+		children: S && /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			debounce: 50,
+			children: /* @__PURE__ */ o(_, { children: [
+				l && /* @__PURE__ */ a(D, {
+					contentStyle: x.contentStyle,
+					labelStyle: x.labelStyle,
+					itemStyle: x.itemStyle
+				}),
+				c && /* @__PURE__ */ a(p, { wrapperStyle: {
+					fontSize: 13,
+					color: v.textMuted
+				} }),
+				/* @__PURE__ */ a(g, {
+					data: i,
+					dataKey: "value",
+					nameKey: "name",
+					outerRadius: d,
+					startAngle: m,
+					endAngle: m - 360,
+					label: u ? ({ name: e, percent: t }) => `${e} (${(t * 100).toFixed(0)}%)` : void 0,
+					labelLine: u,
+					strokeWidth: 2,
+					stroke: v.bg,
+					children: i.map((e, t) => /* @__PURE__ */ a(f, { fill: e.color ?? b[t % b.length] }, e.name))
+				})
+			] })
+		})
+	});
 }
-function yt({
-  data: e,
-  height: S = 300,
-  showLegend: f = !0,
-  showTooltip: p = !0,
-  centerLabel: d,
-  centerSublabel: y,
-  innerRadius: m = "55%",
-  outerRadius: x = "75%",
-  startAngle: a = 90,
-  ariaLabel: u = "Donut chart"
-}) {
-  const o = z(), l = j(), h = M(o), r = C(o), [n, i] = O(l);
-  return $(() => {
-    if (l) {
-      i(!0);
-      return;
-    }
-    const k = requestAnimationFrame(() => i(!0));
-    return () => cancelAnimationFrame(k);
-  }, [l]), /* @__PURE__ */ g(
-    "div",
-    {
-      role: "img",
-      "aria-label": u,
-      style: { width: "100%", minWidth: 240, height: S, position: "relative" },
-      children: [
-        n && /* @__PURE__ */ t(v, { width: "100%", height: "100%", debounce: 50, children: /* @__PURE__ */ g(P, { children: [
-          p && /* @__PURE__ */ t(
-            L,
-            {
-              contentStyle: r.contentStyle,
-              labelStyle: r.labelStyle,
-              itemStyle: r.itemStyle
-            }
-          ),
-          f && /* @__PURE__ */ t(w, { wrapperStyle: { fontSize: 13, color: o.textMuted } }),
-          /* @__PURE__ */ t(
-            B,
-            {
-              data: e,
-              dataKey: "value",
-              nameKey: "name",
-              innerRadius: m,
-              outerRadius: x,
-              startAngle: a,
-              endAngle: a - 360,
-              strokeWidth: 3,
-              stroke: o.bg,
-              label: !1,
-              labelLine: !1,
-              children: e.map((k, s) => /* @__PURE__ */ t(I, { fill: k.color ?? h[s % h.length] }, k.name))
-            }
-          ),
-          (d || y) && /* @__PURE__ */ t("text", {})
-        ] }) }),
-        (d || y) && /* @__PURE__ */ g(
-          "div",
-          {
-            style: {
-              position: "absolute",
-              inset: 0,
-              display: "flex",
-              flexDirection: "column",
-              alignItems: "center",
-              justifyContent: "center",
-              pointerEvents: "none",
-              marginTop: f ? -24 : 0
-            },
-            children: [
-              d && /* @__PURE__ */ t("span", { style: { fontSize: 22, fontWeight: 700, color: o.text, lineHeight: 1 }, children: d }),
-              y && /* @__PURE__ */ t("span", { style: { fontSize: 13, color: o.textMuted, marginTop: 4 }, children: y })
-            ]
-          }
-        )
-      ]
-    }
-  );
+//#endregion
+//#region src/charts/TkxDonutChart.tsx
+function R({ data: i, height: s = 300, showLegend: c = !0, showTooltip: l = !0, centerLabel: u, centerSublabel: d, innerRadius: m = "55%", outerRadius: h = "75%", startAngle: v = 90, ariaLabel: y = "Donut chart" }) {
+	let b = e(), x = t(), S = j(b), C = N(b), [T, E] = r(x);
+	return n(() => {
+		if (x) {
+			E(!0);
+			return;
+		}
+		let e = requestAnimationFrame(() => E(!0));
+		return () => cancelAnimationFrame(e);
+	}, [x]), /* @__PURE__ */ o("div", {
+		role: "img",
+		"aria-label": y,
+		style: {
+			width: "100%",
+			minWidth: 240,
+			height: s,
+			position: "relative"
+		},
+		children: [T && /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			debounce: 50,
+			children: /* @__PURE__ */ o(_, { children: [
+				l && /* @__PURE__ */ a(D, {
+					contentStyle: C.contentStyle,
+					labelStyle: C.labelStyle,
+					itemStyle: C.itemStyle
+				}),
+				c && /* @__PURE__ */ a(p, { wrapperStyle: {
+					fontSize: 13,
+					color: b.textMuted
+				} }),
+				/* @__PURE__ */ a(g, {
+					data: i,
+					dataKey: "value",
+					nameKey: "name",
+					innerRadius: m,
+					outerRadius: h,
+					startAngle: v,
+					endAngle: v - 360,
+					strokeWidth: 3,
+					stroke: b.bg,
+					label: !1,
+					labelLine: !1,
+					children: i.map((e, t) => /* @__PURE__ */ a(f, { fill: e.color ?? S[t % S.length] }, e.name))
+				}),
+				(u || d) && /* @__PURE__ */ a("text", {})
+			] })
+		}), (u || d) && /* @__PURE__ */ o("div", {
+			style: {
+				position: "absolute",
+				inset: 0,
+				display: "flex",
+				flexDirection: "column",
+				alignItems: "center",
+				justifyContent: "center",
+				pointerEvents: "none",
+				marginTop: c ? -24 : 0
+			},
+			children: [u && /* @__PURE__ */ a("span", {
+				style: {
+					fontSize: 22,
+					fontWeight: 700,
+					color: b.text,
+					lineHeight: 1
+				},
+				children: u
+			}), d && /* @__PURE__ */ a("span", {
+				style: {
+					fontSize: 13,
+					color: b.textMuted,
+					marginTop: 4
+				},
+				children: d
+			})]
+		})]
+	});
 }
-function ut({
-  series: e,
-  height: S = 300,
-  margin: f = T,
-  showGrid: p = !0,
-  showLegend: d = !0,
-  showTooltip: y = !0,
-  xTickFormatter: m,
-  yTickFormatter: x,
-  zRange: a = [20, 400],
-  ariaLabel: u = "Scatter chart"
-}) {
-  const o = z(), l = M(o), h = C(o), r = { fill: o.textMuted, fontSize: 12 };
-  return /* @__PURE__ */ t("div", { role: "img", "aria-label": u, style: { width: "100%", height: S }, children: /* @__PURE__ */ t(v, { width: "100%", height: "100%", children: /* @__PURE__ */ g(X, { margin: f, children: [
-    p && /* @__PURE__ */ t(D, { strokeDasharray: "3 3", stroke: o.border }),
-    /* @__PURE__ */ t(
-      F,
-      {
-        type: "number",
-        dataKey: "x",
-        tick: r,
-        axisLine: { stroke: o.border },
-        tickLine: !1,
-        tickFormatter: m
-      }
-    ),
-    /* @__PURE__ */ t(
-      K,
-      {
-        type: "number",
-        dataKey: "y",
-        tick: r,
-        axisLine: !1,
-        tickLine: !1,
-        tickFormatter: x
-      }
-    ),
-    /* @__PURE__ */ t(Y, { type: "number", dataKey: "z", range: a }),
-    y && /* @__PURE__ */ t(
-      L,
-      {
-        contentStyle: h.contentStyle,
-        labelStyle: h.labelStyle,
-        itemStyle: h.itemStyle,
-        cursor: { strokeDasharray: "3 3" }
-      }
-    ),
-    d && /* @__PURE__ */ t(w, { wrapperStyle: { fontSize: 13, color: o.textMuted, paddingTop: 8 } }),
-    e.map((n, i) => /* @__PURE__ */ t(
-      Z,
-      {
-        name: n.name,
-        data: n.data,
-        fill: n.color ?? l[i % l.length],
-        fillOpacity: 0.8
-      },
-      n.name ?? i
-    ))
-  ] }) }) });
+//#endregion
+//#region src/charts/TkxScatterChart.tsx
+function z({ series: t, height: n = 300, margin: r = M, showGrid: i = !0, showLegend: s = !0, showTooltip: c = !0, xTickFormatter: l, yTickFormatter: u, zRange: f = [20, 400], ariaLabel: m = "Scatter chart" }) {
+	let h = e(), g = j(h), _ = N(h), v = {
+		fill: h.textMuted,
+		fontSize: 12
+	};
+	return /* @__PURE__ */ a("div", {
+		role: "img",
+		"aria-label": m,
+		style: {
+			width: "100%",
+			height: n
+		},
+		children: /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			children: /* @__PURE__ */ o(E, {
+				margin: r,
+				children: [
+					i && /* @__PURE__ */ a(d, {
+						strokeDasharray: "3 3",
+						stroke: h.border
+					}),
+					/* @__PURE__ */ a(O, {
+						type: "number",
+						dataKey: "x",
+						tick: v,
+						axisLine: { stroke: h.border },
+						tickLine: !1,
+						tickFormatter: l
+					}),
+					/* @__PURE__ */ a(k, {
+						type: "number",
+						dataKey: "y",
+						tick: v,
+						axisLine: !1,
+						tickLine: !1,
+						tickFormatter: u
+					}),
+					/* @__PURE__ */ a(A, {
+						type: "number",
+						dataKey: "z",
+						range: f
+					}),
+					c && /* @__PURE__ */ a(D, {
+						contentStyle: _.contentStyle,
+						labelStyle: _.labelStyle,
+						itemStyle: _.itemStyle,
+						cursor: { strokeDasharray: "3 3" }
+					}),
+					s && /* @__PURE__ */ a(p, { wrapperStyle: {
+						fontSize: 13,
+						color: h.textMuted,
+						paddingTop: 8
+					} }),
+					t.map((e, t) => /* @__PURE__ */ a(T, {
+						name: e.name,
+						data: e.data,
+						fill: e.color ?? g[t % g.length],
+						fillOpacity: .8
+					}, e.name ?? t))
+				]
+			})
+		})
+	});
 }
-function ht({
-  data: e,
-  series: S,
-  angleKey: f,
-  height: p = 300,
-  showLegend: d = !0,
-  showTooltip: y = !0,
-  outerRadius: m = "70%",
-  ariaLabel: x = "Radar chart"
-}) {
-  const a = z(), u = M(a), o = C(a);
-  return /* @__PURE__ */ t("div", { role: "img", "aria-label": x, style: { width: "100%", height: p }, children: /* @__PURE__ */ t(v, { width: "100%", height: "100%", children: /* @__PURE__ */ g(_, { data: e, outerRadius: m, children: [
-    /* @__PURE__ */ t(J, { stroke: a.border }),
-    /* @__PURE__ */ t(
-      Q,
-      {
-        dataKey: f,
-        tick: { fill: a.textMuted, fontSize: 12 }
-      }
-    ),
-    /* @__PURE__ */ t(
-      tt,
-      {
-        tick: { fill: a.textMuted, fontSize: 10 },
-        axisLine: !1,
-        tickLine: !1
-      }
-    ),
-    y && /* @__PURE__ */ t(
-      L,
-      {
-        contentStyle: o.contentStyle,
-        labelStyle: o.labelStyle,
-        itemStyle: o.itemStyle
-      }
-    ),
-    d && /* @__PURE__ */ t(w, { wrapperStyle: { fontSize: 13, color: a.textMuted } }),
-    S.map((l, h) => {
-      const r = l.color ?? u[h % u.length];
-      return /* @__PURE__ */ t(
-        et,
-        {
-          name: l.label ?? l.key,
-          dataKey: l.key,
-          stroke: r,
-          fill: r,
-          fillOpacity: l.fillOpacity ?? 0.2,
-          strokeWidth: 2
-        },
-        l.key
-      );
-    })
-  ] }) }) });
+//#endregion
+//#region src/charts/TkxRadarChart.tsx
+function B({ data: t, series: n, angleKey: r, height: i = 300, showLegend: s = !0, showTooltip: c = !0, outerRadius: l = "70%", ariaLabel: u = "Radar chart" }) {
+	let d = e(), f = j(d), m = N(d);
+	return /* @__PURE__ */ a("div", {
+		role: "img",
+		"aria-label": u,
+		style: {
+			width: "100%",
+			height: i
+		},
+		children: /* @__PURE__ */ a(w, {
+			width: "100%",
+			height: "100%",
+			children: /* @__PURE__ */ o(S, {
+				data: t,
+				outerRadius: l,
+				children: [
+					/* @__PURE__ */ a(y, { stroke: d.border }),
+					/* @__PURE__ */ a(v, {
+						dataKey: r,
+						tick: {
+							fill: d.textMuted,
+							fontSize: 12
+						}
+					}),
+					/* @__PURE__ */ a(b, {
+						tick: {
+							fill: d.textMuted,
+							fontSize: 10
+						},
+						axisLine: !1,
+						tickLine: !1
+					}),
+					c && /* @__PURE__ */ a(D, {
+						contentStyle: m.contentStyle,
+						labelStyle: m.labelStyle,
+						itemStyle: m.itemStyle
+					}),
+					s && /* @__PURE__ */ a(p, { wrapperStyle: {
+						fontSize: 13,
+						color: d.textMuted
+					} }),
+					n.map((e, t) => {
+						let n = e.color ?? f[t % f.length];
+						return /* @__PURE__ */ a(x, {
+							name: e.label ?? e.key,
+							dataKey: e.key,
+							stroke: n,
+							fill: n,
+							fillOpacity: e.fillOpacity ?? .2,
+							strokeWidth: 2
+						}, e.key);
+					})
+				]
+			})
+		})
+	});
 }
-export {
-  nt as TkxAreaChart,
-  ct as TkxBarChart,
-  yt as TkxDonutChart,
-  dt as TkxLineChart,
-  st as TkxPieChart,
-  ht as TkxRadarChart,
-  ut as TkxScatterChart
-};
+//#endregion
+export { P as TkxAreaChart, F as TkxBarChart, R as TkxDonutChart, I as TkxLineChart, L as TkxPieChart, B as TkxRadarChart, z as TkxScatterChart };