@efiche/design 0.2.12 → 0.2.14

package/dist/index.js

@@ -48,301 +48,17 @@ var useTheme = () => {
   return ctx;
 };
 
-// src/components/Charts/LineChart.tsx
-import { useEffect, useRef, useState as useState2 } from "react";
-import {
-  LineChart as RechartsLineChart,
-  Line,
-  XAxis,
-  YAxis,
-  CartesianGrid,
-  Tooltip,
-  Legend
-} from "recharts";
-
-// src/components/Charts/chartUtils.ts
-var CHART_COLORS = [
-  "#3b82f6",
-  // blue
-  "#22c55e",
-  // green
-  "#f59e0b",
-  // amber
-  "#ef4444",
-  // red
-  "#8b5cf6",
-  // violet
-  "#06b6d4",
-  // cyan
-  "#f97316",
-  // orange
-  "#ec4899"
-  // pink
-];
-function getChartTheme(theme) {
-  const isDark = theme === "dark";
-  return {
-    gridColor: isDark ? "#334155" : "#e2e8f0",
-    axisStroke: isDark ? "#94a3b8" : "#64748b",
-    axisTick: { fill: isDark ? "#94a3b8" : "#64748b", fontSize: 12 },
-    primaryColor: isDark ? "#60a5fa" : "#3b82f6",
-    tooltipStyle: {
-      backgroundColor: isDark ? "#1e293b" : "#ffffff",
-      border: `1px solid ${isDark ? "#334155" : "#e2e8f0"}`,
-      borderRadius: "6px",
-      color: isDark ? "#f1f5f9" : "#0f172a",
-      fontSize: "0.8125rem"
-    }
-  };
-}
-
-// src/components/Charts/LineChart.tsx
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
-var LineChart = ({
-  data,
-  xKey,
-  lines,
-  height = 250,
-  legend = false,
-  grid = true,
-  theme = "light",
-  className,
-  style
-}) => {
-  const containerRef = useRef(null);
-  const [width, setWidth] = useState2(0);
-  const { gridColor, axisStroke, axisTick, tooltipStyle } = getChartTheme(theme);
-  useEffect(() => {
-    if (!containerRef.current) return;
-    const measure = () => setWidth(containerRef.current.offsetWidth);
-    measure();
-    const ro = new ResizeObserver(measure);
-    ro.observe(containerRef.current);
-    return () => ro.disconnect();
-  }, []);
-  return /* @__PURE__ */ jsx2("div", { ref: containerRef, className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: width > 0 && /* @__PURE__ */ jsxs(RechartsLineChart, { width, height, data, children: [
-    grid && /* @__PURE__ */ jsx2(CartesianGrid, { strokeDasharray: "3 3", stroke: gridColor }),
-    /* @__PURE__ */ jsx2(XAxis, { dataKey: xKey, stroke: axisStroke, tick: axisTick }),
-    /* @__PURE__ */ jsx2(YAxis, { stroke: axisStroke, tick: axisTick }),
-    /* @__PURE__ */ jsx2(Tooltip, { contentStyle: tooltipStyle }),
-    legend && /* @__PURE__ */ jsx2(Legend, {}),
-    lines.map((line, i) => {
-      var _a, _b;
-      const color = (_a = line.color) != null ? _a : CHART_COLORS[i % CHART_COLORS.length];
-      return /* @__PURE__ */ jsx2(
-        Line,
-        {
-          type: "monotone",
-          dataKey: line.dataKey,
-          name: (_b = line.label) != null ? _b : line.dataKey,
-          stroke: color,
-          strokeWidth: 2,
-          dot: { fill: color, r: 4 },
-          activeDot: { r: 6 },
-          isAnimationActive: false
-        },
-        line.dataKey
-      );
-    })
-  ] }) });
-};
-var LineChart_default = LineChart;
-
-// src/components/Charts/BarChart.tsx
-import { useEffect as useEffect2, useRef as useRef2, useState as useState3 } from "react";
-import {
-  BarChart as RechartsBarChart,
-  Bar,
-  XAxis as XAxis2,
-  YAxis as YAxis2,
-  CartesianGrid as CartesianGrid2,
-  Tooltip as Tooltip2,
-  Legend as Legend2
-} from "recharts";
-import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
-var BarChart = ({
-  data,
-  xKey,
-  bars,
-  height = 250,
-  legend = false,
-  grid = true,
-  theme = "light",
-  className,
-  style
-}) => {
-  const containerRef = useRef2(null);
-  const [width, setWidth] = useState3(0);
-  const { gridColor, axisStroke, axisTick, tooltipStyle } = getChartTheme(theme);
-  useEffect2(() => {
-    if (!containerRef.current) return;
-    const measure = () => setWidth(containerRef.current.offsetWidth);
-    measure();
-    const ro = new ResizeObserver(measure);
-    ro.observe(containerRef.current);
-    return () => ro.disconnect();
-  }, []);
-  return /* @__PURE__ */ jsx3("div", { ref: containerRef, className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: width > 0 && /* @__PURE__ */ jsxs2(RechartsBarChart, { width, height, data, children: [
-    grid && /* @__PURE__ */ jsx3(CartesianGrid2, { strokeDasharray: "3 3", stroke: gridColor }),
-    /* @__PURE__ */ jsx3(XAxis2, { dataKey: xKey, stroke: axisStroke, tick: axisTick }),
-    /* @__PURE__ */ jsx3(YAxis2, { stroke: axisStroke, tick: axisTick }),
-    /* @__PURE__ */ jsx3(Tooltip2, { contentStyle: tooltipStyle }),
-    legend && /* @__PURE__ */ jsx3(Legend2, {}),
-    bars.map((bar, i) => {
-      var _a, _b;
-      const color = (_a = bar.color) != null ? _a : CHART_COLORS[i % CHART_COLORS.length];
-      const isLast = i === bars.length - 1;
-      return /* @__PURE__ */ jsx3(
-        Bar,
-        {
-          dataKey: bar.dataKey,
-          name: (_b = bar.label) != null ? _b : bar.dataKey,
-          fill: color,
-          stackId: bar.stackId,
-          radius: bar.stackId && !isLast ? [0, 0, 0, 0] : [4, 4, 0, 0],
-          isAnimationActive: false
-        },
-        bar.dataKey
-      );
-    })
-  ] }) });
-};
-var BarChart_default = BarChart;
-
-// src/components/Charts/AreaChart.tsx
-import { useEffect as useEffect3, useRef as useRef3, useState as useState4 } from "react";
-import {
-  AreaChart as RechartsAreaChart,
-  Area,
-  XAxis as XAxis3,
-  YAxis as YAxis3,
-  CartesianGrid as CartesianGrid3,
-  Tooltip as Tooltip3,
-  Legend as Legend3
-} from "recharts";
-import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var AreaChart = ({
-  data,
-  xKey,
-  areas,
-  height = 250,
-  legend = false,
-  grid = true,
-  theme = "light",
-  className,
-  style
-}) => {
-  const containerRef = useRef3(null);
-  const [width, setWidth] = useState4(0);
-  const { gridColor, axisStroke, axisTick, tooltipStyle } = getChartTheme(theme);
-  useEffect3(() => {
-    if (!containerRef.current) return;
-    const measure = () => setWidth(containerRef.current.offsetWidth);
-    measure();
-    const ro = new ResizeObserver(measure);
-    ro.observe(containerRef.current);
-    return () => ro.disconnect();
-  }, []);
-  return /* @__PURE__ */ jsx4("div", { ref: containerRef, className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: width > 0 && /* @__PURE__ */ jsxs3(RechartsAreaChart, { width, height, data, children: [
-    grid && /* @__PURE__ */ jsx4(CartesianGrid3, { strokeDasharray: "3 3", stroke: gridColor }),
-    /* @__PURE__ */ jsx4(XAxis3, { dataKey: xKey, stroke: axisStroke, tick: axisTick }),
-    /* @__PURE__ */ jsx4(YAxis3, { stroke: axisStroke, tick: axisTick }),
-    /* @__PURE__ */ jsx4(Tooltip3, { contentStyle: tooltipStyle }),
-    legend && /* @__PURE__ */ jsx4(Legend3, {}),
-    areas.map((area, i) => {
-      var _a, _b, _c;
-      const color = (_a = area.color) != null ? _a : CHART_COLORS[i % CHART_COLORS.length];
-      const opacity = (_b = area.fillOpacity) != null ? _b : area.stackId ? 0.4 : 0.15;
-      return /* @__PURE__ */ jsx4(
-        Area,
-        {
-          type: "monotone",
-          dataKey: area.dataKey,
-          name: (_c = area.label) != null ? _c : area.dataKey,
-          stroke: color,
-          fill: color,
-          fillOpacity: opacity,
-          strokeWidth: 2,
-          stackId: area.stackId,
-          isAnimationActive: false
-        },
-        area.dataKey
-      );
-    })
-  ] }) });
-};
-var AreaChart_default = AreaChart;
-
-// src/components/Charts/PieChart.tsx
-import { useEffect as useEffect4, useRef as useRef4, useState as useState5 } from "react";
-import {
-  PieChart as RechartsPieChart,
-  Pie,
-  Tooltip as Tooltip4,
-  Legend as Legend4
-} from "recharts";
-import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
-var PieChart = ({
-  data,
-  height = 250,
-  donut = false,
-  legend = false,
-  label = false,
-  theme = "light",
-  className,
-  style
-}) => {
-  const containerRef = useRef4(null);
-  const [width, setWidth] = useState5(0);
-  const { tooltipStyle } = getChartTheme(theme);
-  useEffect4(() => {
-    if (!containerRef.current) return;
-    const measure = () => setWidth(containerRef.current.offsetWidth);
-    measure();
-    const ro = new ResizeObserver(measure);
-    ro.observe(containerRef.current);
-    return () => ro.disconnect();
-  }, []);
-  const dataWithColors = data.map((item, i) => {
-    var _a;
-    return __spreadProps(__spreadValues({}, item), {
-      fill: (_a = item.fill) != null ? _a : CHART_COLORS[i % CHART_COLORS.length]
-    });
-  });
-  const outerRadius = 90;
-  const innerRadius = donut ? 55 : 0;
-  return /* @__PURE__ */ jsx5("div", { ref: containerRef, className, style: __spreadValues({ minWidth: 250, width: "100%" }, style), children: width > 0 && /* @__PURE__ */ jsxs4(RechartsPieChart, { width, height, children: [
-    /* @__PURE__ */ jsx5(
-      Pie,
-      {
-        data: dataWithColors,
-        cx: "50%",
-        cy: "50%",
-        outerRadius,
-        innerRadius,
-        dataKey: "value",
-        label: label ? ({ name, percent }) => `${name} ${((percent != null ? percent : 0) * 100).toFixed(0)}%` : void 0,
-        labelLine: label,
-        isAnimationActive: false
-      }
-    ),
-    /* @__PURE__ */ jsx5(Tooltip4, { contentStyle: tooltipStyle }),
-    legend && /* @__PURE__ */ jsx5(Legend4, {})
-  ] }) });
-};
-var PieChart_default = PieChart;
-
 // src/components/Accordion/Accordion.tsx
-import { useState as useState6 } from "react";
+import { useState as useState2 } from "react";
 import { ChevronDown } from "lucide-react";
-import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 var Accordion = ({ items, defaultValue, multiple = false }) => {
-  const [open, setOpen] = useState6(() => {
+  const [open, setOpen] = useState2(() => {
     if (!defaultValue) return /* @__PURE__ */ new Set();
     if (Array.isArray(defaultValue)) return new Set(defaultValue);
     return /* @__PURE__ */ new Set([defaultValue]);
   });
-  const [hovered, setHovered] = useState6(null);
+  const [hovered, setHovered] = useState2(null);
   const toggle = (value) => {
     setOpen((prev) => {
       const next = new Set(prev);
@@ -355,7 +71,7 @@ var Accordion = ({ items, defaultValue, multiple = false }) => {
       return next;
     });
   };
-  return /* @__PURE__ */ jsx6("div", { style: {
+  return /* @__PURE__ */ jsx2("div", { style: {
     border: "1px solid var(--ds-border, #e2e8f0)",
     borderRadius: "0.5rem",
     overflow: "hidden"
@@ -363,14 +79,14 @@ var Accordion = ({ items, defaultValue, multiple = false }) => {
     const isOpen = open.has(item.value);
     const isHovered = hovered === item.value;
     const isLast = index === items.length - 1;
-    return /* @__PURE__ */ jsxs5(
+    return /* @__PURE__ */ jsxs(
       "div",
       {
         style: {
           borderBottom: isLast ? "none" : "1px solid var(--ds-border, #e2e8f0)"
         },
         children: [
-          /* @__PURE__ */ jsxs5(
+          /* @__PURE__ */ jsxs(
             "button",
             {
               style: {
@@ -393,8 +109,8 @@ var Accordion = ({ items, defaultValue, multiple = false }) => {
               onMouseLeave: () => setHovered(null),
               "aria-expanded": isOpen,
               children: [
-                /* @__PURE__ */ jsx6("span", { children: item.trigger }),
-                /* @__PURE__ */ jsx6(
+                /* @__PURE__ */ jsx2("span", { children: item.trigger }),
+                /* @__PURE__ */ jsx2(
                   ChevronDown,
                   {
                     size: 16,
@@ -409,11 +125,11 @@ var Accordion = ({ items, defaultValue, multiple = false }) => {
               ]
             }
           ),
-          /* @__PURE__ */ jsx6("div", { style: {
+          /* @__PURE__ */ jsx2("div", { style: {
             maxHeight: isOpen ? "300px" : "0",
             overflow: "hidden",
             transition: "max-height 0.25s ease"
-          }, children: /* @__PURE__ */ jsx6("div", { style: {
+          }, children: /* @__PURE__ */ jsx2("div", { style: {
             padding: "0 1rem 1rem",
             fontSize: "0.875rem",
             color: "var(--ds-text-secondary, #64748b)"
@@ -428,7 +144,7 @@ var Accordion_default = Accordion;
 
 // src/components/Alert/Alert.tsx
 import { Info, CheckCircle2, AlertTriangle, AlertCircle } from "lucide-react";
-import { jsx as jsx7, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 var variantMap = {
   info: { bg: "var(--ds-info-bg, #eff6ff)", border: "var(--ds-info, #3b82f6)", icon: "var(--ds-info, #3b82f6)", title: "var(--ds-info-title, #1e3a8a)", desc: "var(--ds-info-desc, #1e40af)" },
   success: { bg: "var(--ds-success-bg, #f0fdf4)", border: "var(--ds-success, #22c55e)", icon: "var(--ds-success, #22c55e)", title: "var(--ds-success-title, #14532d)", desc: "var(--ds-success-desc, #166534)" },
@@ -436,14 +152,14 @@ var variantMap = {
   danger: { bg: "var(--ds-danger-bg, #fef2f2)", border: "var(--ds-danger, #ef4444)", icon: "var(--ds-danger, #ef4444)", title: "var(--ds-danger-title, #7f1d1d)", desc: "var(--ds-danger-desc, #991b1b)" }
 };
 var icons = {
-  info: /* @__PURE__ */ jsx7(Info, { size: 16 }),
-  success: /* @__PURE__ */ jsx7(CheckCircle2, { size: 16 }),
-  warning: /* @__PURE__ */ jsx7(AlertTriangle, { size: 16 }),
-  danger: /* @__PURE__ */ jsx7(AlertCircle, { size: 16 })
+  info: /* @__PURE__ */ jsx3(Info, { size: 16 }),
+  success: /* @__PURE__ */ jsx3(CheckCircle2, { size: 16 }),
+  warning: /* @__PURE__ */ jsx3(AlertTriangle, { size: 16 }),
+  danger: /* @__PURE__ */ jsx3(AlertCircle, { size: 16 })
 };
 var Alert = ({ variant = "info", title, description }) => {
   const v = variantMap[variant];
-  return /* @__PURE__ */ jsxs6("div", { role: "alert", style: {
+  return /* @__PURE__ */ jsxs2("div", { role: "alert", style: {
     display: "flex",
     gap: "0.75rem",
     padding: "1rem",
@@ -451,23 +167,23 @@ var Alert = ({ variant = "info", title, description }) => {
     borderLeft: `4px solid ${v.border}`,
     backgroundColor: v.bg
   }, children: [
-    /* @__PURE__ */ jsx7("span", { style: { flexShrink: 0, marginTop: "0.125rem", color: v.icon }, children: icons[variant] }),
-    /* @__PURE__ */ jsxs6("div", { style: { flex: 1 }, children: [
-      /* @__PURE__ */ jsx7("p", { style: { fontWeight: 600, fontSize: "0.875rem", marginBottom: "0.25rem", marginTop: 0, color: v.title }, children: title }),
-      /* @__PURE__ */ jsx7("p", { style: { fontSize: "0.875rem", margin: 0, color: v.desc }, children: description })
+    /* @__PURE__ */ jsx3("span", { style: { flexShrink: 0, marginTop: "0.125rem", color: v.icon }, children: icons[variant] }),
+    /* @__PURE__ */ jsxs2("div", { style: { flex: 1 }, children: [
+      /* @__PURE__ */ jsx3("p", { style: { fontWeight: 600, fontSize: "0.875rem", marginBottom: "0.25rem", marginTop: 0, color: v.title }, children: title }),
+      /* @__PURE__ */ jsx3("p", { style: { fontSize: "0.875rem", margin: 0, color: v.desc }, children: description })
     ] })
   ] });
 };
 var Alert_default = Alert;
 
 // src/components/Avatar/Avatar.tsx
-import { jsx as jsx8 } from "react/jsx-runtime";
+import { jsx as jsx4 } from "react/jsx-runtime";
 var sizeMap = {
   sm: { width: "2rem", height: "2rem", fontSize: "0.625rem" },
   md: { width: "2.5rem", height: "2.5rem", fontSize: "0.875rem" },
   lg: { width: "4rem", height: "4rem", fontSize: "1.25rem" }
 };
-var Avatar = ({ fallback, size = "md", style, className }) => /* @__PURE__ */ jsx8(
+var Avatar = ({ fallback, size = "md", style, className }) => /* @__PURE__ */ jsx4(
   "div",
   {
     className,
@@ -489,7 +205,7 @@ var Avatar = ({ fallback, size = "md", style, className }) => /* @__PURE__ */ js
 var Avatar_default = Avatar;
 
 // src/components/Badge/Badge.tsx
-import { jsx as jsx9 } from "react/jsx-runtime";
+import { jsx as jsx5 } from "react/jsx-runtime";
 var variantMap2 = {
   default: { backgroundColor: "var(--ds-primary, #3b82f6)", color: "#fff" },
   secondary: { backgroundColor: "var(--ds-muted, #f1f5f9)", color: "var(--ds-text-secondary, #64748b)" },
@@ -504,7 +220,7 @@ var sizeMap2 = {
   md: { padding: "0.25rem 0.625rem", fontSize: "0.75rem" },
   lg: { padding: "0.375rem 0.875rem", fontSize: "0.875rem" }
 };
-var Badge = ({ variant = "default", size = "md", children, style }) => /* @__PURE__ */ jsx9("span", { style: __spreadValues(__spreadValues(__spreadValues({
+var Badge = ({ variant = "default", size = "md", children, style }) => /* @__PURE__ */ jsx5("span", { style: __spreadValues(__spreadValues(__spreadValues({
   display: "inline-flex",
   alignItems: "center",
   gap: "0.25rem",
@@ -515,12 +231,12 @@ var Badge = ({ variant = "default", size = "md", children, style }) => /* @__PUR
 var Badge_default = Badge;
 
 // src/components/Breadcrumb/Breadcrumb.tsx
-import { useState as useState7 } from "react";
+import { useState as useState3 } from "react";
 import { ChevronRight } from "lucide-react";
-import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
 var Breadcrumb = ({ items }) => {
-  const [hovered, setHovered] = useState7(null);
-  return /* @__PURE__ */ jsx10("nav", { "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsx10("ol", { style: {
+  const [hovered, setHovered] = useState3(null);
+  return /* @__PURE__ */ jsx6("nav", { "aria-label": "Breadcrumb", children: /* @__PURE__ */ jsx6("ol", { style: {
     display: "flex",
     flexWrap: "wrap",
     alignItems: "center",
@@ -531,8 +247,8 @@ var Breadcrumb = ({ items }) => {
   }, children: items.map((item, i) => {
     const isLast = i === items.length - 1;
     const isHovered = hovered === item.label;
-    return /* @__PURE__ */ jsxs7("li", { style: { display: "flex", alignItems: "center" }, children: [
-      i > 0 && /* @__PURE__ */ jsx10(
+    return /* @__PURE__ */ jsxs3("li", { style: { display: "flex", alignItems: "center" }, children: [
+      i > 0 && /* @__PURE__ */ jsx6(
         ChevronRight,
         {
           size: 14,
@@ -540,11 +256,11 @@ var Breadcrumb = ({ items }) => {
           style: { color: "var(--ds-text-secondary, #64748b)", margin: "0 0.25rem", flexShrink: 0 }
         }
       ),
-      isLast || !item.href ? /* @__PURE__ */ jsx10("span", { style: {
+      isLast || !item.href ? /* @__PURE__ */ jsx6("span", { style: {
         color: isLast ? "var(--ds-text-primary, #0f172a)" : "var(--ds-text-secondary, #64748b)",
         fontWeight: isLast ? 500 : void 0,
         cursor: isLast ? "default" : void 0
-      }, children: item.label }) : /* @__PURE__ */ jsx10(
+      }, children: item.label }) : /* @__PURE__ */ jsx6(
         "a",
         {
           href: item.href,
@@ -565,8 +281,8 @@ var Breadcrumb_default = Breadcrumb;
 
 // src/components/Button/Button.tsx
 import { LoaderCircle } from "lucide-react";
-import { useState as useState8 } from "react";
-import { Fragment, jsx as jsx11, jsxs as jsxs8 } from "react/jsx-runtime";
+import { useState as useState4 } from "react";
+import { Fragment, jsx as jsx7, jsxs as jsxs4 } from "react/jsx-runtime";
 var variantStyles = {
   solid: { backgroundColor: "var(--ds-primary, #3b82f6)", color: "#fff", borderColor: "transparent" },
   outline: { backgroundColor: "transparent", color: "var(--ds-primary, #3b82f6)", borderColor: "var(--ds-primary, #3b82f6)" },
@@ -628,7 +344,7 @@ var Button = (_a) => {
     "size",
     "style"
   ]);
-  const [hovered, setHovered] = useState8(false);
+  const [hovered, setHovered] = useState4(false);
   const resolvedVariant = variant != null ? variant : danger ? "danger" : warning ? "warning" : info ? "info" : success ? "success" : ghost ? "ghost" : outline ? "outline" : "solid";
   const resolvedSize = size != null ? size : small ? "sm" : large ? "lg" : "md";
   const isDisabled = disabled || loading;
@@ -646,9 +362,9 @@ var Button = (_a) => {
     opacity: isDisabled ? 0.5 : 1,
     pointerEvents: loading ? "none" : void 0
   }, variantStyles[resolvedVariant]), sizeStyles[resolvedSize]), hovered && !isDisabled ? variantHoverStyles[resolvedVariant] : {}), styleProp);
-  return /* @__PURE__ */ jsxs8(Fragment, { children: [
-    /* @__PURE__ */ jsx11("style", { href: "ds-spin", precedence: "low", children: `@keyframes ds-spin { to { transform: rotate(360deg); } }` }),
-    /* @__PURE__ */ jsxs8(
+  return /* @__PURE__ */ jsxs4(Fragment, { children: [
+    /* @__PURE__ */ jsx7("style", { href: "ds-spin", precedence: "low", children: `@keyframes ds-spin { to { transform: rotate(360deg); } }` }),
+    /* @__PURE__ */ jsxs4(
       "button",
       __spreadProps(__spreadValues({
         disabled: isDisabled,
@@ -657,7 +373,7 @@ var Button = (_a) => {
         onMouseLeave: () => setHovered(false)
       }, props), {
         children: [
-          loading ? /* @__PURE__ */ jsx11(
+          loading ? /* @__PURE__ */ jsx7(
             LoaderCircle,
             {
               "aria-hidden": true,
@@ -675,10 +391,10 @@ var Button = (_a) => {
 var Button_default = Button;
 
 // src/components/Card/Card.tsx
-import { jsx as jsx12 } from "react/jsx-runtime";
+import { jsx as jsx8 } from "react/jsx-runtime";
 var Card = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx12("div", __spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsx8("div", __spreadValues({ style: __spreadValues({
     border: "1px solid var(--ds-border, #e2e8f0)",
     borderRadius: "0.5rem",
     backgroundColor: "var(--ds-card, #ffffff)"
@@ -686,7 +402,7 @@ var Card = (_a) => {
 };
 var CardHeader = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx12("div", __spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsx8("div", __spreadValues({ style: __spreadValues({
     display: "flex",
     flexDirection: "column",
     gap: "0.375rem",
@@ -695,7 +411,7 @@ var CardHeader = (_a) => {
 };
 var CardTitle = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx12("h3", __spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsx8("h3", __spreadValues({ style: __spreadValues({
     fontSize: "1rem",
     fontWeight: 600,
     color: "var(--ds-text-primary, #0f172a)",
@@ -705,7 +421,7 @@ var CardTitle = (_a) => {
 };
 var CardDescription = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx12("p", __spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsx8("p", __spreadValues({ style: __spreadValues({
     fontSize: "0.875rem",
     color: "var(--ds-text-secondary, #64748b)",
     margin: 0
@@ -713,11 +429,11 @@ var CardDescription = (_a) => {
 };
 var CardContent = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx12("div", __spreadValues({ style: __spreadValues({ padding: "1.5rem" }, style) }, props));
+  return /* @__PURE__ */ jsx8("div", __spreadValues({ style: __spreadValues({ padding: "1.5rem" }, style) }, props));
 };
 var CardFooter = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx12("div", __spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsx8("div", __spreadValues({ style: __spreadValues({
     display: "flex",
     alignItems: "center",
     padding: "0 1.5rem 1.5rem"
@@ -725,8 +441,8 @@ var CardFooter = (_a) => {
 };
 
 // src/components/Checkbox/Checkbox.tsx
-import { useState as useState9 } from "react";
-import { jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
+import { useState as useState5 } from "react";
+import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
 var Checkbox = ({
   label,
   checked,
@@ -735,7 +451,7 @@ var Checkbox = ({
   id,
   onChange
 }) => {
-  const [internal, setInternal] = useState9(defaultChecked);
+  const [internal, setInternal] = useState5(defaultChecked);
   const isChecked = checked !== void 0 ? checked : internal;
   const handleChange = () => {
     if (disabled) return;
@@ -743,7 +459,7 @@ var Checkbox = ({
     setInternal(next);
     onChange == null ? void 0 : onChange(next);
   };
-  return /* @__PURE__ */ jsxs9("label", { htmlFor: id, style: {
+  return /* @__PURE__ */ jsxs5("label", { htmlFor: id, style: {
     display: "inline-flex",
     alignItems: "center",
     gap: "0.5rem",
@@ -751,7 +467,7 @@ var Checkbox = ({
     userSelect: "none",
     opacity: disabled ? 0.5 : 1
   }, children: [
-    /* @__PURE__ */ jsx13(
+    /* @__PURE__ */ jsx9(
       "input",
       {
         type: "checkbox",
@@ -762,7 +478,7 @@ var Checkbox = ({
         style: { position: "absolute", opacity: 0, width: 0, height: 0 }
       }
     ),
-    /* @__PURE__ */ jsx13("span", { style: {
+    /* @__PURE__ */ jsx9("span", { style: {
       width: "1.125rem",
       height: "1.125rem",
       border: `2px solid ${isChecked ? "var(--ds-primary, #3b82f6)" : "var(--ds-border, #e2e8f0)"}`,
@@ -773,25 +489,25 @@ var Checkbox = ({
       flexShrink: 0,
       transition: "background-color 0.15s, border-color 0.15s",
       backgroundColor: isChecked ? "var(--ds-primary, #3b82f6)" : "var(--ds-card, #fff)"
-    }, children: isChecked && /* @__PURE__ */ jsx13("svg", { viewBox: "0 0 12 10", fill: "none", style: { width: "0.625rem", height: "0.625rem" }, children: /* @__PURE__ */ jsx13("path", { d: "M1 5l3.5 3.5L11 1", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
-    label && /* @__PURE__ */ jsx13("span", { style: { fontSize: "0.875rem", color: "var(--ds-text-primary, #0f172a)" }, children: label })
+    }, children: isChecked && /* @__PURE__ */ jsx9("svg", { viewBox: "0 0 12 10", fill: "none", style: { width: "0.625rem", height: "0.625rem" }, children: /* @__PURE__ */ jsx9("path", { d: "M1 5l3.5 3.5L11 1", stroke: "white", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
+    label && /* @__PURE__ */ jsx9("span", { style: { fontSize: "0.875rem", color: "var(--ds-text-primary, #0f172a)" }, children: label })
   ] });
 };
 var Checkbox_default = Checkbox;
 
 // src/components/CopyButton/CopyButton.tsx
 import { Check, Copy } from "lucide-react";
-import { useState as useState10 } from "react";
-import { jsx as jsx14 } from "react/jsx-runtime";
+import { useState as useState6 } from "react";
+import { jsx as jsx10 } from "react/jsx-runtime";
 var CopyButton = ({ text }) => {
-  const [copied, setCopied] = useState10(false);
-  const [hovered, setHovered] = useState10(false);
+  const [copied, setCopied] = useState6(false);
+  const [hovered, setHovered] = useState6(false);
   const handleCopy = () => {
     navigator.clipboard.writeText(text);
     setCopied(true);
     setTimeout(() => setCopied(false), 2e3);
   };
-  return /* @__PURE__ */ jsx14(
+  return /* @__PURE__ */ jsx10(
     "button",
     {
       onClick: handleCopy,
@@ -810,7 +526,7 @@ var CopyButton = ({ text }) => {
         cursor: "pointer",
         transition: "background-color 0.15s, color 0.15s"
       },
-      children: copied ? /* @__PURE__ */ jsx14(Check, { style: { width: "1rem", height: "1rem" } }) : /* @__PURE__ */ jsx14(Copy, { style: { width: "1rem", height: "1rem" } })
+      children: copied ? /* @__PURE__ */ jsx10(Check, { style: { width: "1rem", height: "1rem" } }) : /* @__PURE__ */ jsx10(Copy, { style: { width: "1rem", height: "1rem" } })
     }
   );
 };
@@ -818,19 +534,19 @@ var CopyButton_default = CopyButton;
 
 // src/components/FileUpload/FileUpload.tsx
 import { Upload } from "lucide-react";
-import { useRef as useRef5, useState as useState11 } from "react";
-import { jsx as jsx15, jsxs as jsxs10 } from "react/jsx-runtime";
+import { useRef, useState as useState7 } from "react";
+import { jsx as jsx11, jsxs as jsxs6 } from "react/jsx-runtime";
 var FileUpload = ({ accept, multiple, disabled, onFileSelect }) => {
-  const [isDragging, setIsDragging] = useState11(false);
-  const [isHovered, setIsHovered] = useState11(false);
-  const [fileNames, setFileNames] = useState11([]);
-  const inputRef = useRef5(null);
+  const [isDragging, setIsDragging] = useState7(false);
+  const [isHovered, setIsHovered] = useState7(false);
+  const [fileNames, setFileNames] = useState7([]);
+  const inputRef = useRef(null);
   const handleFiles = (list) => {
     setFileNames(Array.from(list).map((f) => f.name));
     onFileSelect == null ? void 0 : onFileSelect(list);
   };
   const isActive = isDragging || isHovered;
-  return /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs6(
     "div",
     {
       onClick: () => {
@@ -864,7 +580,7 @@ var FileUpload = ({ accept, multiple, disabled, onFileSelect }) => {
         opacity: disabled ? 0.5 : 1
       },
       children: [
-        /* @__PURE__ */ jsx15(
+        /* @__PURE__ */ jsx11(
           "input",
           {
             ref: inputRef,
@@ -876,9 +592,9 @@ var FileUpload = ({ accept, multiple, disabled, onFileSelect }) => {
             onChange: (e) => e.target.files && handleFiles(e.target.files)
           }
         ),
-        /* @__PURE__ */ jsx15(Upload, { size: 32, style: { color: "var(--ds-text-secondary, #64748b)" } }),
-        fileNames.length > 0 ? /* @__PURE__ */ jsx15("p", { style: { fontSize: "0.875rem", color: "var(--ds-primary, #3b82f6)", fontWeight: 500, margin: 0 }, children: fileNames.join(", ") }) : /* @__PURE__ */ jsxs10("p", { style: { fontSize: "0.875rem", color: "var(--ds-text-secondary, #64748b)", margin: 0 }, children: [
-          /* @__PURE__ */ jsx15("strong", { children: "Click to upload" }),
+        /* @__PURE__ */ jsx11(Upload, { size: 32, style: { color: "var(--ds-text-secondary, #64748b)" } }),
+        fileNames.length > 0 ? /* @__PURE__ */ jsx11("p", { style: { fontSize: "0.875rem", color: "var(--ds-primary, #3b82f6)", fontWeight: 500, margin: 0 }, children: fileNames.join(", ") }) : /* @__PURE__ */ jsxs6("p", { style: { fontSize: "0.875rem", color: "var(--ds-text-secondary, #64748b)", margin: 0 }, children: [
+          /* @__PURE__ */ jsx11("strong", { children: "Click to upload" }),
           " or drag and drop"
         ] })
       ]
@@ -888,7 +604,7 @@ var FileUpload = ({ accept, multiple, disabled, onFileSelect }) => {
 var FileUpload_default = FileUpload;
 
 // src/components/Input/Input.tsx
-import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
 var inputCSS = `
 [data-ds-input]::placeholder { color: var(--ds-text-secondary, #64748b); }
 [data-ds-input]:focus { outline: none; border-color: var(--ds-primary, #3b82f6); box-shadow: 0 0 0 3px rgb(59 130 246 / 0.15); }
@@ -898,10 +614,10 @@ var inputCSS = `
 `;
 var Input = (_a) => {
   var _b = _a, { error, success, leftIcon, rightIcon, style } = _b, props = __objRest(_b, ["error", "success", "leftIcon", "rightIcon", "style"]);
-  return /* @__PURE__ */ jsxs11(Fragment2, { children: [
-    /* @__PURE__ */ jsx16("style", { href: "ds-input", precedence: "low", children: inputCSS }),
-    /* @__PURE__ */ jsxs11("div", { style: { position: "relative", display: "flex", alignItems: "center", width: "100%" }, children: [
-      leftIcon && /* @__PURE__ */ jsx16("span", { style: {
+  return /* @__PURE__ */ jsxs7(Fragment2, { children: [
+    /* @__PURE__ */ jsx12("style", { href: "ds-input", precedence: "low", children: inputCSS }),
+    /* @__PURE__ */ jsxs7("div", { style: { position: "relative", display: "flex", alignItems: "center", width: "100%" }, children: [
+      leftIcon && /* @__PURE__ */ jsx12("span", { style: {
         position: "absolute",
         left: "0.625rem",
         display: "flex",
@@ -909,7 +625,7 @@ var Input = (_a) => {
         color: "var(--ds-text-secondary, #64748b)",
         pointerEvents: "none"
       }, children: leftIcon }),
-      /* @__PURE__ */ jsx16(
+      /* @__PURE__ */ jsx12(
         "input",
         __spreadValues({
           "data-ds-input": "",
@@ -932,7 +648,7 @@ var Input = (_a) => {
           }, style)
         }, props)
       ),
-      rightIcon && /* @__PURE__ */ jsx16("span", { style: {
+      rightIcon && /* @__PURE__ */ jsx12("span", { style: {
         position: "absolute",
         right: "0.625rem",
         display: "flex",
@@ -946,10 +662,10 @@ var Input = (_a) => {
 var Input_default = Input;
 
 // src/components/Label/Label.tsx
-import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
 var Label = (_a) => {
   var _b = _a, { children, required, style } = _b, props = __objRest(_b, ["children", "required", "style"]);
-  return /* @__PURE__ */ jsxs12("label", __spreadProps(__spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsxs8("label", __spreadProps(__spreadValues({ style: __spreadValues({
     display: "block",
     fontSize: "0.875rem",
     fontWeight: 500,
@@ -957,29 +673,29 @@ var Label = (_a) => {
     marginBottom: "0.375rem"
   }, style) }, props), { children: [
     children,
-    required && /* @__PURE__ */ jsx17("span", { style: { color: "var(--ds-danger, #ef4444)", marginLeft: "0.25rem" }, children: "*" })
+    required && /* @__PURE__ */ jsx13("span", { style: { color: "var(--ds-danger, #ef4444)", marginLeft: "0.25rem" }, children: "*" })
   ] }));
 };
 var Label_default = Label;
 
 // src/components/PasswordInput/PasswordInput.tsx
 import { Eye, EyeOff } from "lucide-react";
-import { useState as useState12 } from "react";
-import { jsx as jsx18 } from "react/jsx-runtime";
+import { useState as useState8 } from "react";
+import { jsx as jsx14 } from "react/jsx-runtime";
 var PasswordInput = (props) => {
-  const [visible, setVisible] = useState12(false);
-  return /* @__PURE__ */ jsx18(
+  const [visible, setVisible] = useState8(false);
+  return /* @__PURE__ */ jsx14(
     Input_default,
     __spreadProps(__spreadValues({}, props), {
       type: visible ? "text" : "password",
-      rightIcon: /* @__PURE__ */ jsx18(
+      rightIcon: /* @__PURE__ */ jsx14(
         "button",
         {
           type: "button",
           onClick: () => setVisible((v) => !v),
           style: { background: "none", border: "none", cursor: "pointer", padding: 0, display: "flex", pointerEvents: "all" },
           tabIndex: -1,
-          children: visible ? /* @__PURE__ */ jsx18(EyeOff, { size: 16 }) : /* @__PURE__ */ jsx18(Eye, { size: 16 })
+          children: visible ? /* @__PURE__ */ jsx14(EyeOff, { size: 16 }) : /* @__PURE__ */ jsx14(Eye, { size: 16 })
         }
       )
     })
@@ -988,10 +704,10 @@ var PasswordInput = (props) => {
 var PasswordInput_default = PasswordInput;
 
 // src/components/Progress/Progress.tsx
-import { jsx as jsx19 } from "react/jsx-runtime";
+import { jsx as jsx15 } from "react/jsx-runtime";
 var Progress = ({ value = 0 }) => {
   const pct = Math.min(100, Math.max(0, value));
-  return /* @__PURE__ */ jsx19(
+  return /* @__PURE__ */ jsx15(
     "div",
     {
       role: "progressbar",
@@ -1005,7 +721,7 @@ var Progress = ({ value = 0 }) => {
         borderRadius: "9999px",
         overflow: "hidden"
       },
-      children: /* @__PURE__ */ jsx19("div", { style: {
+      children: /* @__PURE__ */ jsx15("div", { style: {
         height: "100%",
         width: `${pct}%`,
         backgroundColor: "var(--ds-primary, #3b82f6)",
@@ -1018,8 +734,8 @@ var Progress = ({ value = 0 }) => {
 var Progress_default = Progress;
 
 // src/components/RadioGroup/RadioGroup.tsx
-import { useState as useState13 } from "react";
-import { jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
+import { useState as useState9 } from "react";
+import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
 var RadioGroup = ({
   options,
   name,
@@ -1028,16 +744,16 @@ var RadioGroup = ({
   disabled,
   onChange
 }) => {
-  const [internal, setInternal] = useState13(defaultValue);
+  const [internal, setInternal] = useState9(defaultValue);
   const selected = value !== void 0 ? value : internal;
   const handleChange = (val) => {
     if (disabled) return;
     setInternal(val);
     onChange == null ? void 0 : onChange(val);
   };
-  return /* @__PURE__ */ jsx20("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: options.map((option) => {
+  return /* @__PURE__ */ jsx16("div", { style: { display: "flex", flexDirection: "column", gap: "0.5rem" }, children: options.map((option) => {
     const isSelected = selected === option.value;
-    return /* @__PURE__ */ jsxs13("label", { style: {
+    return /* @__PURE__ */ jsxs9("label", { style: {
       display: "inline-flex",
       alignItems: "center",
       gap: "0.5rem",
@@ -1045,7 +761,7 @@ var RadioGroup = ({
       userSelect: "none",
       opacity: disabled ? 0.5 : 1
     }, children: [
-      /* @__PURE__ */ jsx20(
+      /* @__PURE__ */ jsx16(
         "input",
         {
           type: "radio",
@@ -1057,7 +773,7 @@ var RadioGroup = ({
           style: { position: "absolute", opacity: 0, width: 0, height: 0 }
         }
       ),
-      /* @__PURE__ */ jsx20("span", { style: {
+      /* @__PURE__ */ jsx16("span", { style: {
         width: "1.125rem",
         height: "1.125rem",
         borderRadius: "9999px",
@@ -1068,13 +784,13 @@ var RadioGroup = ({
         flexShrink: 0,
         backgroundColor: "var(--ds-card, #fff)",
         transition: "border-color 0.15s"
-      }, children: isSelected && /* @__PURE__ */ jsx20("span", { style: {
+      }, children: isSelected && /* @__PURE__ */ jsx16("span", { style: {
         width: "0.5rem",
         height: "0.5rem",
         borderRadius: "9999px",
         backgroundColor: "var(--ds-primary, #3b82f6)"
       } }) }),
-      /* @__PURE__ */ jsx20("span", { style: { fontSize: "0.875rem", color: "var(--ds-text-primary, #0f172a)" }, children: option.label })
+      /* @__PURE__ */ jsx16("span", { style: { fontSize: "0.875rem", color: "var(--ds-text-primary, #0f172a)" }, children: option.label })
     ] }, option.value);
   }) });
 };
@@ -1082,8 +798,8 @@ var RadioGroup_default = RadioGroup;
 
 // src/components/Select/Select.tsx
 import { Check as Check2, ChevronDown as ChevronDown2 } from "lucide-react";
-import { useEffect as useEffect5, useRef as useRef6, useState as useState14 } from "react";
-import { Fragment as Fragment3, jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
+import { useEffect, useRef as useRef2, useState as useState10 } from "react";
+import { Fragment as Fragment3, jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
 var selectCSS = `
 [data-ds-select-trigger]:focus { outline: none; border-color: var(--ds-primary, #3b82f6); box-shadow: 0 0 0 3px rgb(59 130 246 / 0.15); }
 `;
@@ -1096,10 +812,10 @@ var Select = ({
   onChange
 }) => {
   var _a;
-  const [internal, setInternal] = useState14(defaultValue);
-  const [open, setOpen] = useState14(false);
-  const [hoveredOption, setHoveredOption] = useState14(null);
-  const ref = useRef6(null);
+  const [internal, setInternal] = useState10(defaultValue);
+  const [open, setOpen] = useState10(false);
+  const [hoveredOption, setHoveredOption] = useState10(null);
+  const ref = useRef2(null);
   const selected = value !== void 0 ? value : internal;
   const selectedLabel = (_a = options.find((o) => o.value === selected)) == null ? void 0 : _a.label;
   const handleSelect = (val) => {
@@ -1107,22 +823,22 @@ var Select = ({
     setOpen(false);
     onChange == null ? void 0 : onChange(val);
   };
-  useEffect5(() => {
+  useEffect(() => {
     const handleOutside = (e) => {
       if (ref.current && !ref.current.contains(e.target)) setOpen(false);
     };
     document.addEventListener("mousedown", handleOutside);
     return () => document.removeEventListener("mousedown", handleOutside);
   }, []);
-  return /* @__PURE__ */ jsxs14(Fragment3, { children: [
-    /* @__PURE__ */ jsx21("style", { href: "ds-select", precedence: "low", children: selectCSS }),
-    /* @__PURE__ */ jsxs14("div", { ref, style: {
+  return /* @__PURE__ */ jsxs10(Fragment3, { children: [
+    /* @__PURE__ */ jsx17("style", { href: "ds-select", precedence: "low", children: selectCSS }),
+    /* @__PURE__ */ jsxs10("div", { ref, style: {
       position: "relative",
       width: "100%",
       opacity: disabled ? 0.5 : 1,
       pointerEvents: disabled ? "none" : void 0
     }, children: [
-      /* @__PURE__ */ jsxs14(
+      /* @__PURE__ */ jsxs10(
         "button",
         {
           type: "button",
@@ -1148,8 +864,8 @@ var Select = ({
             fontFamily: "inherit"
           },
           children: [
-            /* @__PURE__ */ jsx21("span", { style: { color: selectedLabel ? "var(--ds-text-primary, #0f172a)" : "var(--ds-text-secondary, #64748b)" }, children: selectedLabel != null ? selectedLabel : placeholder }),
-            /* @__PURE__ */ jsx21(
+            /* @__PURE__ */ jsx17("span", { style: { color: selectedLabel ? "var(--ds-text-primary, #0f172a)" : "var(--ds-text-secondary, #64748b)" }, children: selectedLabel != null ? selectedLabel : placeholder }),
+            /* @__PURE__ */ jsx17(
               ChevronDown2,
               {
                 size: 16,
@@ -1164,7 +880,7 @@ var Select = ({
           ]
         }
       ),
-      open && /* @__PURE__ */ jsx21("div", { style: {
+      open && /* @__PURE__ */ jsx17("div", { style: {
         position: "absolute",
         top: "calc(100% + 0.25rem)",
         left: 0,
@@ -1178,7 +894,7 @@ var Select = ({
       }, children: options.map((option) => {
         const isSelected = selected === option.value;
         const isHovered = hoveredOption === option.value;
-        return /* @__PURE__ */ jsxs14(
+        return /* @__PURE__ */ jsxs10(
           "div",
           {
             onClick: () => handleSelect(option.value),
@@ -1197,7 +913,7 @@ var Select = ({
               transition: "background-color 0.1s"
             },
             children: [
-              isSelected ? /* @__PURE__ */ jsx21(Check2, { size: 14, style: { color: "var(--ds-primary, #3b82f6)", flexShrink: 0 } }) : /* @__PURE__ */ jsx21("span", { style: { width: 14, flexShrink: 0 } }),
+              isSelected ? /* @__PURE__ */ jsx17(Check2, { size: 14, style: { color: "var(--ds-primary, #3b82f6)", flexShrink: 0 } }) : /* @__PURE__ */ jsx17("span", { style: { width: 14, flexShrink: 0 } }),
               option.label
             ]
           },
@@ -1210,13 +926,13 @@ var Select = ({
 var Select_default = Select;
 
 // src/components/Skeleton/Skeleton.tsx
-import { Fragment as Fragment4, jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
-var Skeleton = ({ height = "1rem", width = "100%", circle = false }) => /* @__PURE__ */ jsxs15(Fragment4, { children: [
-  /* @__PURE__ */ jsx22("style", { href: "ds-skeleton", precedence: "low", children: `
+import { Fragment as Fragment4, jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
+var Skeleton = ({ height = "1rem", width = "100%", circle = false }) => /* @__PURE__ */ jsxs11(Fragment4, { children: [
+  /* @__PURE__ */ jsx18("style", { href: "ds-skeleton", precedence: "low", children: `
             @keyframes ds-pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
             [data-ds-skeleton] { animation: ds-pulse 1.5s ease-in-out infinite; }
         ` }),
-  /* @__PURE__ */ jsx22(
+  /* @__PURE__ */ jsx18(
     "div",
     {
       "data-ds-skeleton": "",
@@ -1233,8 +949,8 @@ var Skeleton = ({ height = "1rem", width = "100%", circle = false }) => /* @__PU
 var Skeleton_default = Skeleton;
 
 // src/components/Slider/Slider.tsx
-import { useState as useState15 } from "react";
-import { Fragment as Fragment5, jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
+import { useState as useState11 } from "react";
+import { Fragment as Fragment5, jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
 var sliderCSS = `
 [data-ds-slider] {
     -webkit-appearance: none;
@@ -1285,7 +1001,7 @@ var Slider = ({
   disabled,
   onChange
 }) => {
-  const [internal, setInternal] = useState15(defaultValue);
+  const [internal, setInternal] = useState11(defaultValue);
   const current = value !== void 0 ? value : internal;
   const fill = `${(current - min) / (max - min) * 100}%`;
   const handleChange = (e) => {
@@ -1293,13 +1009,13 @@ var Slider = ({
     setInternal(val);
     onChange == null ? void 0 : onChange(val);
   };
-  return /* @__PURE__ */ jsxs16(Fragment5, { children: [
-    /* @__PURE__ */ jsx23("style", { href: "ds-slider", precedence: "low", children: sliderCSS }),
-    /* @__PURE__ */ jsx23("div", { style: {
+  return /* @__PURE__ */ jsxs12(Fragment5, { children: [
+    /* @__PURE__ */ jsx19("style", { href: "ds-slider", precedence: "low", children: sliderCSS }),
+    /* @__PURE__ */ jsx19("div", { style: {
       width: "100%",
       padding: "0.25rem 0",
       opacity: disabled ? 0.5 : 1
-    }, children: /* @__PURE__ */ jsx23(
+    }, children: /* @__PURE__ */ jsx19(
       "input",
       {
         type: "range",
@@ -1319,11 +1035,11 @@ var Slider_default = Slider;
 
 // src/components/Spinner/Spinner.tsx
 import { Loader2 } from "lucide-react";
-import { Fragment as Fragment6, jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
 var sizePx = { sm: 16, md: 24, lg: 32 };
-var Spinner = ({ size = "md" }) => /* @__PURE__ */ jsxs17(Fragment6, { children: [
-  /* @__PURE__ */ jsx24("style", { href: "ds-spin", precedence: "low", children: `@keyframes ds-spin { to { transform: rotate(360deg); } }` }),
-  /* @__PURE__ */ jsx24(
+var Spinner = ({ size = "md" }) => /* @__PURE__ */ jsxs13(Fragment6, { children: [
+  /* @__PURE__ */ jsx20("style", { href: "ds-spin", precedence: "low", children: `@keyframes ds-spin { to { transform: rotate(360deg); } }` }),
+  /* @__PURE__ */ jsx20(
     Loader2,
     {
       size: sizePx[size],
@@ -1335,8 +1051,8 @@ var Spinner = ({ size = "md" }) => /* @__PURE__ */ jsxs17(Fragment6, { children:
 var Spinner_default = Spinner;
 
 // src/components/Switch/Switch.tsx
-import { useState as useState16 } from "react";
-import { jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
+import { useState as useState12 } from "react";
+import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
 var Switch = ({
   label,
   checked,
@@ -1345,7 +1061,7 @@ var Switch = ({
   id,
   onChange
 }) => {
-  const [internal, setInternal] = useState16(defaultChecked);
+  const [internal, setInternal] = useState12(defaultChecked);
   const isOn = checked !== void 0 ? checked : internal;
   const handleToggle = () => {
     if (disabled) return;
@@ -1353,7 +1069,7 @@ var Switch = ({
     setInternal(next);
     onChange == null ? void 0 : onChange(next);
   };
-  return /* @__PURE__ */ jsxs18("label", { htmlFor: id, style: {
+  return /* @__PURE__ */ jsxs14("label", { htmlFor: id, style: {
     display: "inline-flex",
     alignItems: "center",
     gap: "0.625rem",
@@ -1361,7 +1077,7 @@ var Switch = ({
     userSelect: "none",
     opacity: disabled ? 0.5 : 1
   }, children: [
-    /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx21(
       "input",
       {
         type: "checkbox",
@@ -1372,7 +1088,7 @@ var Switch = ({
         style: { position: "absolute", opacity: 0, width: 0, height: 0 }
       }
     ),
-    /* @__PURE__ */ jsx25("span", { style: {
+    /* @__PURE__ */ jsx21("span", { style: {
       width: "2.75rem",
       height: "1.5rem",
       borderRadius: "9999px",
@@ -1380,7 +1096,7 @@ var Switch = ({
       position: "relative",
       transition: "background-color 0.2s",
       flexShrink: 0
-    }, children: /* @__PURE__ */ jsx25("span", { style: {
+    }, children: /* @__PURE__ */ jsx21("span", { style: {
       position: "absolute",
       top: "0.175rem",
       left: "0.175rem",
@@ -1392,41 +1108,41 @@ var Switch = ({
       transition: "transform 0.2s",
       transform: isOn ? "translateX(1.25rem)" : "translateX(0)"
     } }) }),
-    label && /* @__PURE__ */ jsx25("span", { style: { fontSize: "0.875rem", color: "var(--ds-text-primary, #0f172a)" }, children: label })
+    label && /* @__PURE__ */ jsx21("span", { style: { fontSize: "0.875rem", color: "var(--ds-text-primary, #0f172a)" }, children: label })
   ] });
 };
 var Switch_default = Switch;
 
 // src/components/Table/Table.tsx
-import { Fragment as Fragment7, jsx as jsx26, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx22, jsxs as jsxs15 } from "react/jsx-runtime";
 var tableCSS = `
 [data-ds-table-row]:hover [data-ds-table-cell] { background-color: var(--ds-muted, #f1f5f9); }
 `;
 var Table = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsxs19(Fragment7, { children: [
-    /* @__PURE__ */ jsx26("style", { href: "ds-table", precedence: "low", children: tableCSS }),
-    /* @__PURE__ */ jsx26("div", { style: {
+  return /* @__PURE__ */ jsxs15(Fragment7, { children: [
+    /* @__PURE__ */ jsx22("style", { href: "ds-table", precedence: "low", children: tableCSS }),
+    /* @__PURE__ */ jsx22("div", { style: {
       width: "100%",
       overflowX: "auto",
       border: "1px solid var(--ds-border, #e2e8f0)",
       borderRadius: "0.5rem"
-    }, children: /* @__PURE__ */ jsx26("table", __spreadValues({ style: __spreadValues({
+    }, children: /* @__PURE__ */ jsx22("table", __spreadValues({ style: __spreadValues({
       width: "100%",
       borderCollapse: "collapse",
       fontSize: "0.875rem"
     }, style) }, props)) })
   ] });
 };
-var TableHead = (props) => /* @__PURE__ */ jsx26("thead", __spreadValues({}, props));
-var TableBody = (props) => /* @__PURE__ */ jsx26("tbody", __spreadValues({}, props));
+var TableHead = (props) => /* @__PURE__ */ jsx22("thead", __spreadValues({}, props));
+var TableBody = (props) => /* @__PURE__ */ jsx22("tbody", __spreadValues({}, props));
 var TableRow = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx26("tr", __spreadValues({ "data-ds-table-row": "", style }, props));
+  return /* @__PURE__ */ jsx22("tr", __spreadValues({ "data-ds-table-row": "", style }, props));
 };
 var TableHeader = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx26("th", __spreadValues({ style: __spreadValues({
+  return /* @__PURE__ */ jsx22("th", __spreadValues({ style: __spreadValues({
     padding: "0.75rem 1rem",
     textAlign: "left",
     fontWeight: 500,
@@ -1438,7 +1154,7 @@ var TableHeader = (_a) => {
 };
 var TableCell = (_a) => {
   var _b = _a, { style } = _b, props = __objRest(_b, ["style"]);
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx22(
     "td",
     __spreadValues({
       "data-ds-table-cell": "",
@@ -1453,15 +1169,15 @@ var TableCell = (_a) => {
 };
 
 // src/components/Tabs/Tabs.tsx
-import { useState as useState17 } from "react";
-import { jsx as jsx27, jsxs as jsxs20 } from "react/jsx-runtime";
+import { useState as useState13 } from "react";
+import { jsx as jsx23, jsxs as jsxs16 } from "react/jsx-runtime";
 var Tabs = ({ tabs, defaultValue }) => {
   var _a, _b;
-  const [active, setActive] = useState17((_b = defaultValue != null ? defaultValue : (_a = tabs[0]) == null ? void 0 : _a.value) != null ? _b : "");
-  const [hovered, setHovered] = useState17(null);
+  const [active, setActive] = useState13((_b = defaultValue != null ? defaultValue : (_a = tabs[0]) == null ? void 0 : _a.value) != null ? _b : "");
+  const [hovered, setHovered] = useState13(null);
   const activeTab = tabs.find((t) => t.value === active);
-  return /* @__PURE__ */ jsxs20("div", { style: { display: "flex", flexDirection: "column" }, children: [
-    /* @__PURE__ */ jsx27("div", { role: "tablist", style: {
+  return /* @__PURE__ */ jsxs16("div", { style: { display: "flex", flexDirection: "column" }, children: [
+    /* @__PURE__ */ jsx23("div", { role: "tablist", style: {
       display: "inline-flex",
       backgroundColor: "var(--ds-muted, #f1f5f9)",
       borderRadius: "0.5rem",
@@ -1470,7 +1186,7 @@ var Tabs = ({ tabs, defaultValue }) => {
     }, children: tabs.map((tab) => {
       const isActive = active === tab.value;
       const isHovered = hovered === tab.value;
-      return /* @__PURE__ */ jsxs20(
+      return /* @__PURE__ */ jsxs16(
         "button",
         {
           role: "tab",
@@ -1495,14 +1211,14 @@ var Tabs = ({ tabs, defaultValue }) => {
             whiteSpace: "nowrap"
           },
           children: [
-            tab.icon && /* @__PURE__ */ jsx27("span", { style: { display: "flex", alignItems: "center" }, children: tab.icon }),
+            tab.icon && /* @__PURE__ */ jsx23("span", { style: { display: "flex", alignItems: "center" }, children: tab.icon }),
             tab.label
           ]
         },
         tab.value
       );
     }) }),
-    /* @__PURE__ */ jsx27("div", { role: "tabpanel", style: {
+    /* @__PURE__ */ jsx23("div", { role: "tabpanel", style: {
       paddingTop: "1rem",
       fontSize: "0.875rem",
       color: "var(--ds-text-secondary, #64748b)"
@@ -1512,7 +1228,7 @@ var Tabs = ({ tabs, defaultValue }) => {
 var Tabs_default = Tabs;
 
 // src/components/Textarea/Textarea.tsx
-import { Fragment as Fragment8, jsx as jsx28, jsxs as jsxs21 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx24, jsxs as jsxs17 } from "react/jsx-runtime";
 var textareaCSS = `
 [data-ds-textarea]::placeholder { color: var(--ds-text-secondary, #64748b); }
 [data-ds-textarea]:focus { outline: none; border-color: var(--ds-primary, #3b82f6); box-shadow: 0 0 0 3px rgb(59 130 246 / 0.15); }
@@ -1522,9 +1238,9 @@ var textareaCSS = `
 `;
 var Textarea = (_a) => {
   var _b = _a, { error, style } = _b, props = __objRest(_b, ["error", "style"]);
-  return /* @__PURE__ */ jsxs21(Fragment8, { children: [
-    /* @__PURE__ */ jsx28("style", { href: "ds-textarea", precedence: "low", children: textareaCSS }),
-    /* @__PURE__ */ jsx28(
+  return /* @__PURE__ */ jsxs17(Fragment8, { children: [
+    /* @__PURE__ */ jsx24("style", { href: "ds-textarea", precedence: "low", children: textareaCSS }),
+    /* @__PURE__ */ jsx24(
       "textarea",
       __spreadValues({
         "data-ds-textarea": "",
@@ -1550,8 +1266,8 @@ var Textarea = (_a) => {
 var Textarea_default = Textarea;
 
 // src/components/Tooltip/Tooltip.tsx
-import { useState as useState18 } from "react";
-import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs22 } from "react/jsx-runtime";
+import { useState as useState14 } from "react";
+import { Fragment as Fragment9, jsx as jsx25, jsxs as jsxs18 } from "react/jsx-runtime";
 var positionStyle = {
   top: { bottom: "calc(100% + 8px)", left: "50%", transform: "translateX(-50%)" },
   bottom: { top: "calc(100% + 8px)", left: "50%", transform: "translateX(-50%)" },
@@ -1569,11 +1285,11 @@ var tooltipCSS = `
 [data-ds-tt="left"]::before   { left: 100%;   top: 50%;   transform: translateY(-50%); border-left-color:   var(--ds-tooltip-bg, #0f172a); }
 [data-ds-tt="right"]::before  { right: 100%;  top: 50%;   transform: translateY(-50%); border-right-color:  var(--ds-tooltip-bg, #0f172a); }
 `;
-var Tooltip5 = ({ content, children, position = "top" }) => {
-  const [visible, setVisible] = useState18(false);
-  return /* @__PURE__ */ jsxs22(Fragment9, { children: [
-    /* @__PURE__ */ jsx29("style", { href: "ds-tooltip", precedence: "low", children: tooltipCSS }),
-    /* @__PURE__ */ jsxs22(
+var Tooltip = ({ content, children, position = "top" }) => {
+  const [visible, setVisible] = useState14(false);
+  return /* @__PURE__ */ jsxs18(Fragment9, { children: [
+    /* @__PURE__ */ jsx25("style", { href: "ds-tooltip", precedence: "low", children: tooltipCSS }),
+    /* @__PURE__ */ jsxs18(
       "span",
       {
         style: { position: "relative", display: "inline-flex" },
@@ -1583,7 +1299,7 @@ var Tooltip5 = ({ content, children, position = "top" }) => {
         onBlur: () => setVisible(false),
         children: [
           children,
-          /* @__PURE__ */ jsx29(
+          /* @__PURE__ */ jsx25(
             "span",
             {
               role: "tooltip",
@@ -1610,14 +1326,12 @@ var Tooltip5 = ({ content, children, position = "top" }) => {
     )
   ] });
 };
-var Tooltip_default = Tooltip5;
+var Tooltip_default = Tooltip;
 export {
   Accordion_default as Accordion,
   Alert_default as Alert,
-  AreaChart_default as AreaChart,
   Avatar_default as Avatar,
   Badge_default as Badge,
-  BarChart_default as BarChart,
   Breadcrumb_default as Breadcrumb,
   Button_default as Button,
   Card,
@@ -1631,9 +1345,7 @@ export {
   FileUpload_default as FileUpload,
   Input_default as Input,
   Label_default as Label,
-  LineChart_default as LineChart,
   PasswordInput_default as PasswordInput,
-  PieChart_default as PieChart,
   Progress_default as Progress,
   RadioGroup_default as RadioGroup,
   Select_default as Select,