@axtec/components 0.1.7 → 0.1.10

package/dist/index61.js

@@ -1,239 +1,221 @@
-import { jsxs as s, jsx as e } from "react/jsx-runtime";
-import { useState as q } from "react";
-import { ResponsiveContainer as M, BarChart as E, CartesianGrid as w, XAxis as y, YAxis as b, Tooltip as T, Legend as L, Bar as F, Cell as P, LineChart as J, Line as z, ComposedChart as O } from "recharts";
-import { cn as i } from "./index3.js";
-const Q = (a) => a >= 1e6 ? `$${(a / 1e6).toFixed(1)}M` : a >= 1e3 ? `$${(a / 1e3).toFixed(0)}K` : `$${a}`, C = ({
-  data: a,
-  type: R = "bar",
-  height: g = 300,
-  primaryColor: v = "var(--color-primary-500, #1DA061)",
-  primaryColorHover: j = "var(--color-primary-700, #168a52)",
-  secondaryColor: f = "var(--color-primary-300, #6FCF97)",
-  showGrid: K = !0,
-  showLegend: W = !1,
-  showXAxis: N = !0,
-  showYAxis: D = !0,
-  valueFormatter: h = Q,
-  title: o,
-  subtitle: x,
-  headerColor: n,
-  interactive: m = !1,
-  onHover: p,
-  minimal: t = !1,
-  emptyMessage: V = "No data available",
-  className: S
+import { jsx as e, jsxs as m, Fragment as f } from "react/jsx-runtime";
+import { useState as b, useContext as v, createContext as w } from "react";
+import { cn as l } from "./index3.js";
+import { ChevronRightIcon as N, ChevronLeftIcon as y } from "@heroicons/react/24/outline";
+const g = w(null), p = () => {
+  const t = v(g);
+  if (!t) throw new Error("useSidebar must be used within a <Sidebar>");
+  return t;
+}, O = ({
+  children: t,
+  defaultOpen: r = !0,
+  open: a,
+  onOpenChange: s,
+  inline: i = !1,
+  className: c
 }) => {
-  const [$, A] = q(-1), l = a.map((r) => ({
-    name: r.label,
-    value: r.value,
-    secondary: r.secondaryValue
-  })), B = (r) => {
-    m && r && typeof r.activeTooltipIndex == "number" && r.activeTooltipIndex !== $ && (A(r.activeTooltipIndex), p == null || p(r.activeTooltipIndex, a[r.activeTooltipIndex] || null));
-  }, _ = () => {
-    m && (A(-1), p == null || p(-1, null));
-  }, u = {
-    tick: { fontSize: 11, fill: "#64748b" },
-    axisLine: { stroke: "#e2e8f0" },
-    tickLine: { stroke: "#e2e8f0" }
-  }, k = {
-    hide: !0
-  };
-  if (!a || a.length === 0)
-    return /* @__PURE__ */ s("div", { className: i("w-full", S), children: [
-      (o || n) && /* @__PURE__ */ s(
-        "div",
-        {
-          className: i(
-            "px-5 py-4 rounded-t-2xl",
-            n ? "text-white" : "bg-slate-100"
-          ),
-          style: n ? { backgroundColor: n } : void 0,
-          children: [
-            o && /* @__PURE__ */ e("h3", { className: "text-lg font-bold", children: o }),
-            x && /* @__PURE__ */ e("p", { className: i("text-xs", n ? "opacity-80" : "text-slate-500"), children: x })
-          ]
-        }
+  const [o, d] = b(r), n = a !== void 0 ? a : o, x = (h) => {
+    s ? s(h) : d(h);
+  }, u = () => x(!n);
+  return /* @__PURE__ */ e(g.Provider, { value: { isOpen: n, setIsOpen: x, toggle: u }, children: /* @__PURE__ */ e(
+    "div",
+    {
+      className: l(
+        "flex flex-col justify-between bg-slate-50 border-r border-slate-200 transition-all duration-300 ease-in-out",
+        i ? "relative h-full" : "hidden md:flex fixed top-0 left-0 z-10 h-screen",
+        n ? "w-64" : "w-16",
+        c
       ),
-      /* @__PURE__ */ e(
-        "div",
-        {
-          className: i(
-            "flex items-center justify-center bg-slate-50 rounded-xl",
-            o || n ? "rounded-t-none" : ""
-          ),
-          style: { height: g },
-          children: /* @__PURE__ */ e("p", { className: "text-slate-500 text-sm", children: V })
-        }
-      )
-    ] });
-  const I = () => {
-    const r = t ? { top: 5, right: 5, left: 5, bottom: 5 } : { top: 20, right: 20, left: 20, bottom: N ? 60 : 20 };
-    return R === "bar" ? /* @__PURE__ */ s(
-      E,
+      children: /* @__PURE__ */ e("div", { className: "flex flex-col h-full", children: t })
+    }
+  ) });
+}, E = ({
+  children: t,
+  showToggle: r = !0,
+  className: a
+}) => {
+  const { isOpen: s, toggle: i } = p();
+  return /* @__PURE__ */ m(
+    "div",
+    {
+      className: l(
+        "flex items-center border-b border-slate-200 h-16",
+        s ? "px-4 justify-between" : "px-2 justify-center",
+        a
+      ),
+      children: [
+        s && t,
+        r && /* @__PURE__ */ e(
+          "button",
+          {
+            onClick: i,
+            className: "p-2 rounded-lg hover:bg-slate-200 transition-colors cursor-pointer flex-shrink-0",
+            "aria-label": s ? "Collapse sidebar" : "Expand sidebar",
+            children: s ? /* @__PURE__ */ e(y, { className: "h-5 w-5 text-slate-500" }) : /* @__PURE__ */ e(N, { className: "h-5 w-5 text-slate-500" })
+          }
+        )
+      ]
+    }
+  );
+}, F = ({ children: t, className: r }) => /* @__PURE__ */ e("nav", { className: l("flex-1 py-4", r), children: /* @__PURE__ */ e("ul", { className: "flex flex-col space-y-1 px-2", children: t }) }), z = ({ label: t, children: r, className: a }) => {
+  const { isOpen: s } = p();
+  return /* @__PURE__ */ m("div", { className: l("mt-4 first:mt-0", a), children: [
+    t && s && /* @__PURE__ */ e("div", { className: "px-3 mb-2 text-xs font-semibold uppercase tracking-wider text-slate-400", children: t }),
+    !t && s && /* @__PURE__ */ e("div", { className: "border-t border-slate-200 mx-3 mb-2" }),
+    /* @__PURE__ */ e("ul", { className: "flex flex-col space-y-1", children: r })
+  ] });
+}, B = ({
+  label: t,
+  icon: r,
+  active: a = !1,
+  href: s,
+  onClick: i,
+  as: c,
+  badge: o,
+  className: d
+}) => {
+  const { isOpen: n } = p(), x = l(
+    "flex items-center rounded-lg transition-all duration-200 cursor-pointer group w-full",
+    n ? "px-3 py-2.5" : "px-2 py-2.5 justify-center",
+    a ? "bg-accent-tint text-accent-tint-dark" : "text-slate-600 hover:bg-slate-200 hover:text-slate-900",
+    d
+  ), u = /* @__PURE__ */ m(f, { children: [
+    r && /* @__PURE__ */ e(
+      r,
       {
-        data: l,
-        margin: r,
-        onMouseMove: B,
-        onMouseLeave: _,
+        className: l(
+          "h-5 w-5 flex-shrink-0 transition-colors",
+          a ? "text-primary-500" : "text-slate-500 group-hover:text-slate-700"
+        )
+      }
+    ),
+    n && /* @__PURE__ */ e(
+      "span",
+      {
+        className: l(
+          "ml-3 text-sm font-medium truncate",
+          a ? "text-accent-tint-dark" : ""
+        ),
+        children: t
+      }
+    ),
+    n && o !== void 0 && /* @__PURE__ */ e("span", { className: "ml-auto text-xs font-semibold bg-accent-tint text-accent-tint-dark rounded-full px-2 py-0.5", children: o })
+  ] });
+  return s && c ? /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(c, { href: s, className: x, title: n ? void 0 : t, children: u }) }) : s ? /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e("a", { href: s, className: x, title: n ? void 0 : t, onClick: i, children: u }) }) : /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
+    "button",
+    {
+      onClick: i,
+      className: x,
+      title: n ? void 0 : t,
+      children: u
+    }
+  ) });
+}, G = ({
+  label: t,
+  icon: r,
+  active: a = !1,
+  defaultOpen: s = !1,
+  children: i,
+  className: c
+}) => {
+  const { isOpen: o } = p(), [d, n] = b(s);
+  return /* @__PURE__ */ m("li", { className: c, children: [
+    /* @__PURE__ */ m(
+      "button",
+      {
+        onClick: () => n(!d),
+        className: l(
+          "flex items-center rounded-lg transition-all duration-200 cursor-pointer group w-full",
+          o ? "px-3 py-2.5" : "px-2 py-2.5 justify-center",
+          a ? "text-accent-tint-dark" : "text-slate-600 hover:bg-slate-200 hover:text-slate-900"
+        ),
+        title: o ? void 0 : t,
         children: [
-          K && !t && /* @__PURE__ */ e(w, { strokeDasharray: "3 3", stroke: "#f1f5f9" }),
-          N && !t && /* @__PURE__ */ e(
-            y,
+          r && /* @__PURE__ */ e(
+            r,
             {
-              dataKey: "name",
-              ...u,
-              angle: -45,
-              textAnchor: "end",
-              interval: 0
+              className: l(
+                "h-5 w-5 flex-shrink-0 transition-colors",
+                a ? "text-primary-500" : "text-slate-500 group-hover:text-slate-700"
+              )
             }
           ),
-          t && /* @__PURE__ */ e(y, { ...k }),
-          D && !t && /* @__PURE__ */ e(b, { ...u, tickFormatter: h }),
-          t && /* @__PURE__ */ e(b, { ...k }),
-          !t && /* @__PURE__ */ e(
-            T,
-            {
-              formatter: (d) => [h(Number(d) || 0), "Value"],
-              contentStyle: {
-                backgroundColor: "white",
-                border: "1px solid #e2e8f0",
-                borderRadius: "8px",
-                fontSize: "12px"
+          o && /* @__PURE__ */ m(f, { children: [
+            /* @__PURE__ */ e("span", { className: "ml-3 text-sm font-medium truncate", children: t }),
+            /* @__PURE__ */ e(
+              N,
+              {
+                className: l(
+                  "ml-auto h-4 w-4 text-slate-400 transition-transform duration-200",
+                  d && "rotate-90"
+                )
               }
-            }
-          ),
-          W && /* @__PURE__ */ e(L, {}),
-          /* @__PURE__ */ e(F, { dataKey: "value", radius: [4, 4, 0, 0], children: l.map((d, c) => /* @__PURE__ */ e(
-            P,
-            {
-              fill: m && $ === c ? j : v
-            },
-            `cell-${c}`
-          )) })
+            )
+          ] })
         ]
       }
-    ) : R === "line" ? /* @__PURE__ */ s(J, { data: l, margin: r, children: [
-      K && !t && /* @__PURE__ */ e(w, { strokeDasharray: "3 3", stroke: "#f1f5f9" }),
-      N && !t && /* @__PURE__ */ e(
-        y,
-        {
-          dataKey: "name",
-          ...u,
-          angle: -45,
-          textAnchor: "end",
-          interval: 0
-        }
-      ),
-      t && /* @__PURE__ */ e(y, { ...k }),
-      D && !t && /* @__PURE__ */ e(b, { ...u, tickFormatter: h }),
-      t && /* @__PURE__ */ e(b, { ...k }),
-      !t && /* @__PURE__ */ e(
-        T,
-        {
-          formatter: (d) => [h(Number(d) || 0), "Value"],
-          contentStyle: {
-            backgroundColor: "white",
-            border: "1px solid #e2e8f0",
-            borderRadius: "8px",
-            fontSize: "12px"
-          }
-        }
-      ),
-      W && /* @__PURE__ */ e(L, {}),
-      /* @__PURE__ */ e(
-        z,
-        {
-          type: "monotone",
-          dataKey: "value",
-          stroke: v,
-          strokeWidth: 2,
-          dot: { fill: v, strokeWidth: 2, r: 4 },
-          activeDot: { r: 6, stroke: v, strokeWidth: 2, fill: "#fff" }
-        }
-      ),
-      l.some((d) => d.secondary !== void 0) && /* @__PURE__ */ e(
-        z,
-        {
-          type: "monotone",
-          dataKey: "secondary",
-          stroke: f,
-          strokeWidth: 2,
-          dot: { fill: f, strokeWidth: 2, r: 4 },
-          activeDot: { r: 6, stroke: f, strokeWidth: 2, fill: "#fff" }
-        }
-      )
-    ] }) : /* @__PURE__ */ s(O, { data: l, margin: r, children: [
-      K && !t && /* @__PURE__ */ e(w, { strokeDasharray: "3 3", stroke: "#f1f5f9" }),
-      N && !t && /* @__PURE__ */ e(
-        y,
-        {
-          dataKey: "name",
-          ...u,
-          angle: -45,
-          textAnchor: "end",
-          interval: 0
-        }
-      ),
-      t && /* @__PURE__ */ e(y, { ...k }),
-      D && !t && /* @__PURE__ */ e(b, { ...u, tickFormatter: h }),
-      t && /* @__PURE__ */ e(b, { ...k }),
-      !t && /* @__PURE__ */ e(
-        T,
-        {
-          formatter: (d, c) => [
-            h(Number(d)),
-            c === "value" ? "Primary" : "Secondary"
-          ],
-          contentStyle: {
-            backgroundColor: "white",
-            border: "1px solid #e2e8f0",
-            borderRadius: "8px",
-            fontSize: "12px"
-          }
-        }
-      ),
-      W && /* @__PURE__ */ e(L, {}),
-      /* @__PURE__ */ e(F, { dataKey: "value", radius: [4, 4, 0, 0], children: l.map((d, c) => /* @__PURE__ */ e(
-        P,
-        {
-          fill: m && $ === c ? j : v
-        },
-        `cell-${c}`
-      )) }),
-      l.some((d) => d.secondary !== void 0) && /* @__PURE__ */ e(
-        z,
-        {
-          type: "monotone",
-          dataKey: "secondary",
-          stroke: f,
-          strokeWidth: 2,
-          dot: { fill: f, strokeWidth: 2, r: 4 },
-          activeDot: { r: 6, stroke: f, strokeWidth: 2, fill: "#fff" }
-        }
-      )
-    ] });
-  };
-  return n ? /* @__PURE__ */ s(
-    "div",
-    {
-      className: i("rounded-2xl overflow-hidden border border-slate-200 shadow-sm", S),
-      children: [
-        /* @__PURE__ */ s("div", { className: "px-5 py-4", style: { backgroundColor: n }, children: [
-          o && /* @__PURE__ */ e("h3", { className: "text-lg font-bold text-white", children: o }),
-          x && /* @__PURE__ */ e("p", { className: "text-xs text-white/80", children: x })
-        ] }),
-        /* @__PURE__ */ e("div", { className: "bg-white p-5", children: /* @__PURE__ */ e("div", { style: { height: g }, children: /* @__PURE__ */ e(M, { width: "100%", height: "100%", children: I() }) }) })
-      ]
-    }
-  ) : o ? /* @__PURE__ */ s("div", { className: i("w-full", S), children: [
-    /* @__PURE__ */ s("div", { className: "mb-4", children: [
-      /* @__PURE__ */ e("h3", { className: "text-lg font-semibold text-slate-900", children: o }),
-      x && /* @__PURE__ */ e("p", { className: "text-sm text-slate-500", children: x })
+    ),
+    o && d && /* @__PURE__ */ e("ul", { className: "mt-1 ml-4 pl-3 border-l border-slate-200 space-y-1", children: i })
+  ] });
+}, H = ({ children: t, className: r }) => /* @__PURE__ */ e("div", { className: l("p-3", r), children: t }), P = ({
+  icon: t,
+  title: r,
+  description: a,
+  buttonLabel: s,
+  onAction: i,
+  children: c,
+  className: o
+}) => {
+  const { isOpen: d } = p();
+  if (!d)
+    return i ? /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: i,
+        className: l(
+          "w-full p-2 rounded-lg bg-primary-500 text-white hover:bg-primary-600 transition-colors cursor-pointer flex items-center justify-center",
+          o
+        ),
+        title: r,
+        children: t ? /* @__PURE__ */ e(t, { className: "h-5 w-5" }) : /* @__PURE__ */ e("span", { className: "text-xs font-bold", children: r.charAt(0) })
+      }
+    ) : /* @__PURE__ */ e(
+      "div",
+      {
+        className: l(
+          "w-full p-2 rounded-lg bg-primary-500 text-white flex items-center justify-center",
+          o
+        ),
+        title: r,
+        children: t ? /* @__PURE__ */ e(t, { className: "h-5 w-5" }) : /* @__PURE__ */ e("span", { className: "text-xs font-bold", children: r.charAt(0) })
+      }
+    );
+  const n = c || s && i;
+  return /* @__PURE__ */ m("div", { className: l("p-4 rounded-xl bg-gradient-to-br from-primary-500 to-primary-500/80 text-white", o), children: [
+    /* @__PURE__ */ m("div", { className: l("flex items-center gap-2", (a || n) && "mb-2"), children: [
+      t && /* @__PURE__ */ e(t, { className: "h-5 w-5" }),
+      /* @__PURE__ */ e("span", { className: "font-semibold text-sm", children: r })
     ] }),
-    /* @__PURE__ */ e("div", { style: { height: g }, children: /* @__PURE__ */ e(M, { width: "100%", height: "100%", children: I() }) })
-  ] }) : /* @__PURE__ */ e("div", { className: i("w-full", S), style: { height: g }, children: /* @__PURE__ */ e(M, { width: "100%", height: "100%", children: I() }) });
+    a && /* @__PURE__ */ e("p", { className: l("text-xs text-white/90", n && "mb-3"), children: a }),
+    c || (s && i ? /* @__PURE__ */ e(
+      "button",
+      {
+        onClick: i,
+        className: "w-full bg-white text-primary-600 px-3 py-2 rounded-lg font-semibold text-sm hover:bg-white/90 transition-colors cursor-pointer",
+        children: s
+      }
+    ) : null)
+  ] });
 };
 export {
-  C as StatisticsChart
+  O as Sidebar,
+  P as SidebarCard,
+  H as SidebarFooter,
+  G as SidebarGroup,
+  E as SidebarHeader,
+  B as SidebarItem,
+  F as SidebarNav,
+  z as SidebarSection,
+  p as useSidebar
 };
 //# sourceMappingURL=index61.js.map

package/dist/index61.js.map

@@ -1 +1 @@
-{"version":3,"file":"index61.js","sources":["../src/components/StatisticsChart/StatisticsChart.tsx"],"sourcesContent":["import { useState } from 'react'\nimport {\n  BarChart,\n  Bar,\n  LineChart,\n  Line,\n  ComposedChart,\n  XAxis,\n  YAxis,\n  CartesianGrid,\n  Tooltip,\n  ResponsiveContainer,\n  Legend,\n  Cell,\n} from 'recharts'\nimport { cn } from '@/lib/utils'\n\nexport interface StatisticsChartDataPoint {\n  label: string\n  value: number\n  secondaryValue?: number\n}\n\nexport interface StatisticsChartProps {\n  data: StatisticsChartDataPoint[]\n  type?: 'bar' | 'line' | 'composed'\n  /** Chart height in pixels */\n  height?: number\n  /** Primary color for bars/lines */\n  primaryColor?: string\n  /** Primary color on hover (for interactive mode) */\n  primaryColorHover?: string\n  /** Secondary color for second data series */\n  secondaryColor?: string\n  /** Show grid lines */\n  showGrid?: boolean\n  /** Show legend */\n  showLegend?: boolean\n  /** Show X axis */\n  showXAxis?: boolean\n  /** Show Y axis */\n  showYAxis?: boolean\n  /** Custom value formatter for tooltips and axis */\n  valueFormatter?: (value: number) => string\n  /** Chart title */\n  title?: string\n  /** Chart subtitle */\n  subtitle?: string\n  /** Header background color (creates a colored header block) */\n  headerColor?: string\n  /** Enable interactive hover mode (highlights bars, can trigger onHover) */\n  interactive?: boolean\n  /** Callback when hovering over a data point */\n  onHover?: (index: number, dataPoint: StatisticsChartDataPoint | null) => void\n  /** Minimal mode - no axes, compact display */\n  minimal?: boolean\n  /** Empty state message */\n  emptyMessage?: string\n  className?: string\n}\n\nconst defaultFormatter = (value: number) => {\n  if (value >= 1000000) {\n    return `$${(value / 1000000).toFixed(1)}M`\n  } else if (value >= 1000) {\n    return `$${(value / 1000).toFixed(0)}K`\n  }\n  return `$${value}`\n}\n\nexport const StatisticsChart = ({\n  data,\n  type = 'bar',\n  height = 300,\n  primaryColor = 'var(--color-primary-500, #1DA061)',\n  primaryColorHover = 'var(--color-primary-700, #168a52)',\n  secondaryColor = 'var(--color-primary-300, #6FCF97)',\n  showGrid = true,\n  showLegend = false,\n  showXAxis = true,\n  showYAxis = true,\n  valueFormatter = defaultFormatter,\n  title,\n  subtitle,\n  headerColor,\n  interactive = false,\n  onHover,\n  minimal = false,\n  emptyMessage = 'No data available',\n  className,\n}: StatisticsChartProps) => {\n  const [hoveredIndex, setHoveredIndex] = useState(-1)\n\n  const chartData = data.map((item) => ({\n    name: item.label,\n    value: item.value,\n    secondary: item.secondaryValue,\n  }))\n\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  const handleMouseMove = (e: any) => {\n    if (interactive && e && typeof e.activeTooltipIndex === 'number') {\n      if (e.activeTooltipIndex !== hoveredIndex) {\n        setHoveredIndex(e.activeTooltipIndex)\n        onHover?.(e.activeTooltipIndex, data[e.activeTooltipIndex] || null)\n      }\n    }\n  }\n\n  const handleMouseLeave = () => {\n    if (interactive) {\n      setHoveredIndex(-1)\n      onHover?.(-1, null)\n    }\n  }\n\n  const commonAxisProps = {\n    tick: { fontSize: 11, fill: '#64748b' },\n    axisLine: { stroke: '#e2e8f0' },\n    tickLine: { stroke: '#e2e8f0' },\n  }\n\n  const minimalAxisProps = {\n    hide: true,\n  }\n\n  // Empty state\n  if (!data || data.length === 0) {\n    return (\n      <div className={cn('w-full', className)}>\n        {(title || headerColor) && (\n          <div\n            className={cn(\n              'px-5 py-4 rounded-t-2xl',\n              headerColor ? 'text-white' : 'bg-slate-100'\n            )}\n            style={headerColor ? { backgroundColor: headerColor } : undefined}\n          >\n            {title && <h3 className=\"text-lg font-bold\">{title}</h3>}\n            {subtitle && (\n              <p className={cn('text-xs', headerColor ? 'opacity-80' : 'text-slate-500')}>\n                {subtitle}\n              </p>\n            )}\n          </div>\n        )}\n        <div\n          className={cn(\n            'flex items-center justify-center bg-slate-50 rounded-xl',\n            title || headerColor ? 'rounded-t-none' : ''\n          )}\n          style={{ height }}\n        >\n          <p className=\"text-slate-500 text-sm\">{emptyMessage}</p>\n        </div>\n      </div>\n    )\n  }\n\n  const renderChart = () => {\n    const margin = minimal\n      ? { top: 5, right: 5, left: 5, bottom: 5 }\n      : { top: 20, right: 20, left: 20, bottom: showXAxis ? 60 : 20 }\n\n    if (type === 'bar') {\n      return (\n        <BarChart\n          data={chartData}\n          margin={margin}\n          onMouseMove={handleMouseMove}\n          onMouseLeave={handleMouseLeave}\n        >\n          {showGrid && !minimal && <CartesianGrid strokeDasharray=\"3 3\" stroke=\"#f1f5f9\" />}\n          {showXAxis && !minimal && (\n            <XAxis\n              dataKey=\"name\"\n              {...commonAxisProps}\n              angle={-45}\n              textAnchor=\"end\"\n              interval={0}\n            />\n          )}\n          {minimal && <XAxis {...minimalAxisProps} />}\n          {showYAxis && !minimal && (\n            <YAxis {...commonAxisProps} tickFormatter={valueFormatter} />\n          )}\n          {minimal && <YAxis {...minimalAxisProps} />}\n          {!minimal && (\n            <Tooltip\n              formatter={(value) => [valueFormatter(Number(value) || 0), 'Value']}\n              contentStyle={{\n                backgroundColor: 'white',\n                border: '1px solid #e2e8f0',\n                borderRadius: '8px',\n                fontSize: '12px',\n              }}\n            />\n          )}\n          {showLegend && <Legend />}\n          <Bar dataKey=\"value\" radius={[4, 4, 0, 0]}>\n            {chartData.map((_, index) => (\n              <Cell\n                key={`cell-${index}`}\n                fill={interactive && hoveredIndex === index ? primaryColorHover : primaryColor}\n              />\n            ))}\n          </Bar>\n        </BarChart>\n      )\n    }\n\n    if (type === 'line') {\n      return (\n        <LineChart data={chartData} margin={margin}>\n          {showGrid && !minimal && <CartesianGrid strokeDasharray=\"3 3\" stroke=\"#f1f5f9\" />}\n          {showXAxis && !minimal && (\n            <XAxis\n              dataKey=\"name\"\n              {...commonAxisProps}\n              angle={-45}\n              textAnchor=\"end\"\n              interval={0}\n            />\n          )}\n          {minimal && <XAxis {...minimalAxisProps} />}\n          {showYAxis && !minimal && (\n            <YAxis {...commonAxisProps} tickFormatter={valueFormatter} />\n          )}\n          {minimal && <YAxis {...minimalAxisProps} />}\n          {!minimal && (\n            <Tooltip\n              formatter={(value) => [valueFormatter(Number(value) || 0), 'Value']}\n              contentStyle={{\n                backgroundColor: 'white',\n                border: '1px solid #e2e8f0',\n                borderRadius: '8px',\n                fontSize: '12px',\n              }}\n            />\n          )}\n          {showLegend && <Legend />}\n          <Line\n            type=\"monotone\"\n            dataKey=\"value\"\n            stroke={primaryColor}\n            strokeWidth={2}\n            dot={{ fill: primaryColor, strokeWidth: 2, r: 4 }}\n            activeDot={{ r: 6, stroke: primaryColor, strokeWidth: 2, fill: '#fff' }}\n          />\n          {chartData.some((d) => d.secondary !== undefined) && (\n            <Line\n              type=\"monotone\"\n              dataKey=\"secondary\"\n              stroke={secondaryColor}\n              strokeWidth={2}\n              dot={{ fill: secondaryColor, strokeWidth: 2, r: 4 }}\n              activeDot={{ r: 6, stroke: secondaryColor, strokeWidth: 2, fill: '#fff' }}\n            />\n          )}\n        </LineChart>\n      )\n    }\n\n    // Composed chart (bar + line)\n    return (\n      <ComposedChart data={chartData} margin={margin}>\n        {showGrid && !minimal && <CartesianGrid strokeDasharray=\"3 3\" stroke=\"#f1f5f9\" />}\n        {showXAxis && !minimal && (\n          <XAxis\n            dataKey=\"name\"\n            {...commonAxisProps}\n            angle={-45}\n            textAnchor=\"end\"\n            interval={0}\n          />\n        )}\n        {minimal && <XAxis {...minimalAxisProps} />}\n        {showYAxis && !minimal && (\n          <YAxis {...commonAxisProps} tickFormatter={valueFormatter} />\n        )}\n        {minimal && <YAxis {...minimalAxisProps} />}\n        {!minimal && (\n          <Tooltip\n            formatter={(value, name) => [\n              valueFormatter(Number(value)),\n              name === 'value' ? 'Primary' : 'Secondary',\n            ]}\n            contentStyle={{\n              backgroundColor: 'white',\n              border: '1px solid #e2e8f0',\n              borderRadius: '8px',\n              fontSize: '12px',\n            }}\n          />\n        )}\n        {showLegend && <Legend />}\n        <Bar dataKey=\"value\" radius={[4, 4, 0, 0]}>\n          {chartData.map((_, index) => (\n            <Cell\n              key={`cell-${index}`}\n              fill={interactive && hoveredIndex === index ? primaryColorHover : primaryColor}\n            />\n          ))}\n        </Bar>\n        {chartData.some((d) => d.secondary !== undefined) && (\n          <Line\n            type=\"monotone\"\n            dataKey=\"secondary\"\n            stroke={secondaryColor}\n            strokeWidth={2}\n            dot={{ fill: secondaryColor, strokeWidth: 2, r: 4 }}\n            activeDot={{ r: 6, stroke: secondaryColor, strokeWidth: 2, fill: '#fff' }}\n          />\n        )}\n      </ComposedChart>\n    )\n  }\n\n  // With colored header\n  if (headerColor) {\n    return (\n      <div\n        className={cn('rounded-2xl overflow-hidden border border-slate-200 shadow-sm', className)}\n      >\n        <div className=\"px-5 py-4\" style={{ backgroundColor: headerColor }}>\n          {title && <h3 className=\"text-lg font-bold text-white\">{title}</h3>}\n          {subtitle && <p className=\"text-xs text-white/80\">{subtitle}</p>}\n        </div>\n        <div className=\"bg-white p-5\">\n          <div style={{ height }}>\n            <ResponsiveContainer width=\"100%\" height=\"100%\">\n              {renderChart()}\n            </ResponsiveContainer>\n          </div>\n        </div>\n      </div>\n    )\n  }\n\n  // With title (no colored header)\n  if (title) {\n    return (\n      <div className={cn('w-full', className)}>\n        <div className=\"mb-4\">\n          <h3 className=\"text-lg font-semibold text-slate-900\">{title}</h3>\n          {subtitle && <p className=\"text-sm text-slate-500\">{subtitle}</p>}\n        </div>\n        <div style={{ height }}>\n          <ResponsiveContainer width=\"100%\" height=\"100%\">\n            {renderChart()}\n          </ResponsiveContainer>\n        </div>\n      </div>\n    )\n  }\n\n  // Basic chart only\n  return (\n    <div className={cn('w-full', className)} style={{ height }}>\n      <ResponsiveContainer width=\"100%\" height=\"100%\">\n        {renderChart()}\n      </ResponsiveContainer>\n    </div>\n  )\n}\n"],"names":["defaultFormatter","value","StatisticsChart","data","type","height","primaryColor","primaryColorHover","secondaryColor","showGrid","showLegend","showXAxis","showYAxis","valueFormatter","title","subtitle","headerColor","interactive","onHover","minimal","emptyMessage","className","hoveredIndex","setHoveredIndex","useState","chartData","item","handleMouseMove","e","handleMouseLeave","commonAxisProps","minimalAxisProps","cn","jsxs","jsx","renderChart","margin","BarChart","CartesianGrid","XAxis","YAxis","Tooltip","Legend","Bar","_","index","Cell","LineChart","Line","ComposedChart","name","ResponsiveContainer"],"mappings":"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"}
+{"version":3,"file":"index61.js","sources":["../src/components/Sidebar/Sidebar.tsx"],"sourcesContent":["import {\n  createContext,\n  useContext,\n  useState,\n  type ReactNode,\n  type ComponentType,\n  type SVGProps,\n  type MouseEvent,\n} from 'react'\nimport { cn } from '@/lib/utils'\nimport {\n  ChevronLeftIcon,\n  ChevronRightIcon,\n} from '@heroicons/react/24/outline'\n\n// ─── Context ────────────────────────────────────────────────────────────────\n\ninterface SidebarContextValue {\n  isOpen: boolean\n  setIsOpen: (open: boolean) => void\n  toggle: () => void\n}\n\nconst SidebarContext = createContext<SidebarContextValue | null>(null)\n\nexport const useSidebar = () => {\n  const ctx = useContext(SidebarContext)\n  if (!ctx) throw new Error('useSidebar must be used within a <Sidebar>')\n  return ctx\n}\n\n// ─── Sidebar (root) ─────────────────────────────────────────────────────────\n\nexport interface SidebarProps {\n  children: ReactNode\n  /** Start collapsed */\n  defaultOpen?: boolean\n  /** Controlled open state */\n  open?: boolean\n  /** Controlled callback */\n  onOpenChange?: (open: boolean) => void\n  /** Render inline (relative position) instead of fixed — useful for embedding in a layout container */\n  inline?: boolean\n  className?: string\n}\n\nexport const Sidebar = ({\n  children,\n  defaultOpen = true,\n  open,\n  onOpenChange,\n  inline = false,\n  className,\n}: SidebarProps) => {\n  const [internalOpen, setInternalOpen] = useState(defaultOpen)\n  const isOpen = open !== undefined ? open : internalOpen\n\n  const setIsOpen = (value: boolean) => {\n    if (onOpenChange) onOpenChange(value)\n    else setInternalOpen(value)\n  }\n\n  const toggle = () => setIsOpen(!isOpen)\n\n  return (\n    <SidebarContext.Provider value={{ isOpen, setIsOpen, toggle }}>\n      <div\n        className={cn(\n          'flex flex-col justify-between bg-slate-50 border-r border-slate-200 transition-all duration-300 ease-in-out',\n          inline\n            ? 'relative h-full'\n            : 'hidden md:flex fixed top-0 left-0 z-10 h-screen',\n          isOpen ? 'w-64' : 'w-16',\n          className\n        )}\n      >\n        <div className=\"flex flex-col h-full\">\n          {children}\n        </div>\n      </div>\n    </SidebarContext.Provider>\n  )\n}\n\n// ─── SidebarHeader ──────────────────────────────────────────────────────────\n\nexport interface SidebarHeaderProps {\n  children?: ReactNode\n  /** Show the built-in collapse toggle button (default: true) */\n  showToggle?: boolean\n  className?: string\n}\n\nexport const SidebarHeader = ({\n  children,\n  showToggle = true,\n  className,\n}: SidebarHeaderProps) => {\n  const { isOpen, toggle } = useSidebar()\n\n  return (\n    <div\n      className={cn(\n        'flex items-center border-b border-slate-200 h-16',\n        isOpen ? 'px-4 justify-between' : 'px-2 justify-center',\n        className\n      )}\n    >\n      {isOpen && children}\n      {showToggle && (\n        <button\n          onClick={toggle}\n          className=\"p-2 rounded-lg hover:bg-slate-200 transition-colors cursor-pointer flex-shrink-0\"\n          aria-label={isOpen ? 'Collapse sidebar' : 'Expand sidebar'}\n        >\n          {isOpen ? (\n            <ChevronLeftIcon className=\"h-5 w-5 text-slate-500\" />\n          ) : (\n            <ChevronRightIcon className=\"h-5 w-5 text-slate-500\" />\n          )}\n        </button>\n      )}\n    </div>\n  )\n}\n\n// ─── SidebarNav ─────────────────────────────────────────────────────────────\n\nexport interface SidebarNavProps {\n  children: ReactNode\n  className?: string\n}\n\nexport const SidebarNav = ({ children, className }: SidebarNavProps) => (\n  <nav className={cn('flex-1 py-4', className)}>\n    <ul className=\"flex flex-col space-y-1 px-2\">\n      {children}\n    </ul>\n  </nav>\n)\n\n// ─── SidebarSection ─────────────────────────────────────────────────────────\n\nexport interface SidebarSectionProps {\n  /** Section label (hidden when collapsed) */\n  label?: string\n  children: ReactNode\n  className?: string\n}\n\nexport const SidebarSection = ({ label, children, className }: SidebarSectionProps) => {\n  const { isOpen } = useSidebar()\n\n  return (\n    <div className={cn('mt-4 first:mt-0', className)}>\n      {label && isOpen && (\n        <div className=\"px-3 mb-2 text-xs font-semibold uppercase tracking-wider text-slate-400\">\n          {label}\n        </div>\n      )}\n      {!label && isOpen && <div className=\"border-t border-slate-200 mx-3 mb-2\" />}\n      <ul className=\"flex flex-col space-y-1\">\n        {children}\n      </ul>\n    </div>\n  )\n}\n\n// ─── SidebarItem ────────────────────────────────────────────────────────────\n\ntype HeroIcon = ComponentType<SVGProps<SVGSVGElement> & { title?: string; titleId?: string }>\n\nexport interface SidebarItemProps {\n  /** Menu item label */\n  label: string\n  /** Heroicon component */\n  icon?: HeroIcon\n  /** Whether this item is currently active */\n  active?: boolean\n  /** URL — renders as an anchor. Omit for button behavior. */\n  href?: string\n  /** Click handler */\n  onClick?: (e: MouseEvent) => void\n  /** Custom link renderer for framework integration (Next.js Link, React Router, etc.) */\n  as?: ComponentType<{ href: string; className: string; title?: string; children: ReactNode }>\n  /** Badge count shown to the right of the label */\n  badge?: number | string\n  className?: string\n}\n\nexport const SidebarItem = ({\n  label,\n  icon: Icon,\n  active = false,\n  href,\n  onClick,\n  as: LinkComponent,\n  badge,\n  className,\n}: SidebarItemProps) => {\n  const { isOpen } = useSidebar()\n\n  const itemClasses = cn(\n    'flex items-center rounded-lg transition-all duration-200 cursor-pointer group w-full',\n    isOpen ? 'px-3 py-2.5' : 'px-2 py-2.5 justify-center',\n    active\n      ? 'bg-accent-tint text-accent-tint-dark'\n      : 'text-slate-600 hover:bg-slate-200 hover:text-slate-900',\n    className\n  )\n\n  const content = (\n    <>\n      {Icon && (\n        <Icon\n          className={cn(\n            'h-5 w-5 flex-shrink-0 transition-colors',\n            active ? 'text-primary-500' : 'text-slate-500 group-hover:text-slate-700'\n          )}\n        />\n      )}\n      {isOpen && (\n        <span\n          className={cn(\n            'ml-3 text-sm font-medium truncate',\n            active ? 'text-accent-tint-dark' : ''\n          )}\n        >\n          {label}\n        </span>\n      )}\n      {isOpen && badge !== undefined && (\n        <span className=\"ml-auto text-xs font-semibold bg-accent-tint text-accent-tint-dark rounded-full px-2 py-0.5\">\n          {badge}\n        </span>\n      )}\n    </>\n  )\n\n  // Use custom link component (e.g. Next.js <Link>)\n  if (href && LinkComponent) {\n    return (\n      <li>\n        <LinkComponent href={href} className={itemClasses} title={!isOpen ? label : undefined}>\n          {content}\n        </LinkComponent>\n      </li>\n    )\n  }\n\n  // Plain anchor\n  if (href) {\n    return (\n      <li>\n        <a href={href} className={itemClasses} title={!isOpen ? label : undefined} onClick={onClick}>\n          {content}\n        </a>\n      </li>\n    )\n  }\n\n  // Button\n  return (\n    <li>\n      <button\n        onClick={onClick}\n        className={itemClasses}\n        title={!isOpen ? label : undefined}\n      >\n        {content}\n      </button>\n    </li>\n  )\n}\n\n// ─── SidebarGroup (collapsible sub-menu) ────────────────────────────────────\n\nexport interface SidebarGroupProps {\n  /** Group label */\n  label: string\n  /** Heroicon component */\n  icon?: HeroIcon\n  /** Whether any child item is active (highlights the group) */\n  active?: boolean\n  /** Start expanded */\n  defaultOpen?: boolean\n  children: ReactNode\n  className?: string\n}\n\nexport const SidebarGroup = ({\n  label,\n  icon: Icon,\n  active = false,\n  defaultOpen = false,\n  children,\n  className,\n}: SidebarGroupProps) => {\n  const { isOpen: sidebarOpen } = useSidebar()\n  const [expanded, setExpanded] = useState(defaultOpen)\n\n  return (\n    <li className={className}>\n      <button\n        onClick={() => setExpanded(!expanded)}\n        className={cn(\n          'flex items-center rounded-lg transition-all duration-200 cursor-pointer group w-full',\n          sidebarOpen ? 'px-3 py-2.5' : 'px-2 py-2.5 justify-center',\n          active\n            ? 'text-accent-tint-dark'\n            : 'text-slate-600 hover:bg-slate-200 hover:text-slate-900'\n        )}\n        title={!sidebarOpen ? label : undefined}\n      >\n        {Icon && (\n          <Icon\n            className={cn(\n              'h-5 w-5 flex-shrink-0 transition-colors',\n              active ? 'text-primary-500' : 'text-slate-500 group-hover:text-slate-700'\n            )}\n          />\n        )}\n        {sidebarOpen && (\n          <>\n            <span className=\"ml-3 text-sm font-medium truncate\">{label}</span>\n            <ChevronRightIcon\n              className={cn(\n                'ml-auto h-4 w-4 text-slate-400 transition-transform duration-200',\n                expanded && 'rotate-90'\n              )}\n            />\n          </>\n        )}\n      </button>\n      {sidebarOpen && expanded && (\n        <ul className=\"mt-1 ml-4 pl-3 border-l border-slate-200 space-y-1\">\n          {children}\n        </ul>\n      )}\n    </li>\n  )\n}\n\n// ─── SidebarFooter ──────────────────────────────────────────────────────────\n\nexport interface SidebarFooterProps {\n  children: ReactNode\n  className?: string\n}\n\nexport const SidebarFooter = ({ children, className }: SidebarFooterProps) => (\n  <div className={cn('p-3', className)}>\n    {children}\n  </div>\n)\n\n// ─── SidebarCard ────────────────────────────────────────────────────────────\n\nexport interface SidebarCardProps {\n  /** Icon shown in both states */\n  icon?: HeroIcon\n  /** Title for the card */\n  title: string\n  /** Description text */\n  description?: string\n  /** Optional button label */\n  buttonLabel?: string\n  /** Optional button click handler */\n  onAction?: () => void\n  /** Custom content (replaces the button when sidebar is open) */\n  children?: ReactNode\n  className?: string\n}\n\nexport const SidebarCard = ({\n  icon: Icon,\n  title,\n  description,\n  buttonLabel,\n  onAction,\n  children,\n  className,\n}: SidebarCardProps) => {\n  const { isOpen } = useSidebar()\n\n  if (!isOpen) {\n    // Collapsed: show icon button if there's an action, otherwise just the icon\n    if (onAction) {\n      return (\n        <button\n          onClick={onAction}\n          className={cn(\n            'w-full p-2 rounded-lg bg-primary-500 text-white hover:bg-primary-600 transition-colors cursor-pointer flex items-center justify-center',\n            className\n          )}\n          title={title}\n        >\n          {Icon ? <Icon className=\"h-5 w-5\" /> : <span className=\"text-xs font-bold\">{title.charAt(0)}</span>}\n        </button>\n      )\n    }\n    return (\n      <div\n        className={cn(\n          'w-full p-2 rounded-lg bg-primary-500 text-white flex items-center justify-center',\n          className\n        )}\n        title={title}\n      >\n        {Icon ? <Icon className=\"h-5 w-5\" /> : <span className=\"text-xs font-bold\">{title.charAt(0)}</span>}\n      </div>\n    )\n  }\n\n  const hasBody = children || (buttonLabel && onAction)\n\n  return (\n    <div className={cn('p-4 rounded-xl bg-gradient-to-br from-primary-500 to-primary-500/80 text-white', className)}>\n      <div className={cn('flex items-center gap-2', (description || hasBody) && 'mb-2')}>\n        {Icon && <Icon className=\"h-5 w-5\" />}\n        <span className=\"font-semibold text-sm\">{title}</span>\n      </div>\n      {description && (\n        <p className={cn('text-xs text-white/90', hasBody && 'mb-3')}>{description}</p>\n      )}\n      {children ? (\n        children\n      ) : buttonLabel && onAction ? (\n        <button\n          onClick={onAction}\n          className=\"w-full bg-white text-primary-600 px-3 py-2 rounded-lg font-semibold text-sm hover:bg-white/90 transition-colors cursor-pointer\"\n        >\n          {buttonLabel}\n        </button>\n      ) : null}\n    </div>\n  )\n}\n"],"names":["SidebarContext","createContext","useSidebar","ctx","useContext","Sidebar","children","defaultOpen","open","onOpenChange","inline","className","internalOpen","setInternalOpen","useState","isOpen","setIsOpen","value","toggle","jsx","cn","SidebarHeader","showToggle","jsxs","ChevronLeftIcon","ChevronRightIcon","SidebarNav","SidebarSection","label","SidebarItem","Icon","active","href","onClick","LinkComponent","badge","itemClasses","content","Fragment","SidebarGroup","sidebarOpen","expanded","setExpanded","SidebarFooter","SidebarCard","title","description","buttonLabel","onAction","hasBody"],"mappings":"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"}