nave-ui-library 1.0.0-beta.30 → 1.0.0-beta.31

package/dist/react/index.cjs

@@ -59,6 +59,7 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 // src/index.ts
 var index_exports = {};
 __export(index_exports, {
+  AIProvider: () => AIProvider,
   Accordion: () => Accordion,
   AccordionContent: () => AccordionContent,
   AccordionItem: () => AccordionItem,
@@ -90,9 +91,11 @@ __export(index_exports, {
   Button: () => Button,
   Calendar: () => Calendar,
   Card: () => Card,
+  Charts: () => Charts,
   Checkbox: () => Checkbox,
   ColorExample: () => ColorExample,
   Combobox: () => Combobox,
+  DataInsights: () => DataInsights,
   DatePickerInput: () => DatePickerInput,
   DragSlider: () => DragSlider,
   Drawer: () => Drawer,
@@ -123,7 +126,10 @@ __export(index_exports, {
   DropdownMenuSubTrigger: () => DropdownMenuSubTrigger,
   DropdownMenuTrigger: () => DropdownMenuTrigger,
   EmptyState: () => EmptyState,
+  EmptyStateAI: () => EmptyStateAI,
+  ExplainCode: () => ExplainCode,
   FileUpload: () => FileUpload,
+  FormHelper: () => FormHelper,
   Icon: () => Icon,
   IconLabel: () => IconLabel,
   Input: () => Input,
@@ -132,6 +138,7 @@ __export(index_exports, {
   LastMovements: () => LastMovements,
   ListItem: () => ListItem,
   Loader: () => Loader,
+  ModuleBox: () => ModuleBox,
   Navbar: () => Navbar,
   NavbarLogo: () => NavbarLogo,
   NavbarMerchant: () => NavbarMerchant,
@@ -156,6 +163,7 @@ __export(index_exports, {
   Select: () => Select,
   Separator: () => Separator2,
   Sidebar: () => Sidebar,
+  SmartSearch: () => SmartSearch,
   Switch: () => Switch,
   Table: () => Table,
   TableBody: () => TableBody,
@@ -170,12 +178,16 @@ __export(index_exports, {
   TabsContent: () => TabsContent,
   TabsList: () => TabsList,
   TabsTrigger: () => TabsTrigger,
+  TagSuggest: () => TagSuggest,
+  TextAssist: () => TextAssist,
   Textarea: () => Textarea,
   ThemeProvider: () => ThemeProvider,
   Tooltip: () => Tooltip,
   TooltipContent: () => TooltipContent,
   TooltipProvider: () => TooltipProvider,
   TooltipTrigger: () => TooltipTrigger,
+  Tour: () => Tour,
+  TranslateToggle: () => TranslateToggle,
   UnknownPurchase: () => UnknownPurchase,
   accordionContentVariants: () => accordionContentVariants,
   accordionTriggerVariants: () => accordionTriggerVariants,
@@ -183,6 +195,7 @@ __export(index_exports, {
   buttonBaseClasses: () => buttonBaseClasses,
   promoBannerVariants: () => promoBannerVariants,
   resolveTokens: () => resolveTokens,
+  useAI: () => useAI,
   useTheme: () => useTheme
 });
 module.exports = __toCommonJS(index_exports);
@@ -4862,7 +4875,9 @@ function DragSlider({ children, className, tokens: customTokens }) {
   const styles = {
     "--ds-gap": (_b = mergedTokens == null ? void 0 : mergedTokens.gap) != null ? _b : "16px",
     "--ds-cursor": (_c = mergedTokens == null ? void 0 : mergedTokens.cursorGrab) != null ? _c : "grab",
-    "--ds-cursor-active": (_d = mergedTokens == null ? void 0 : mergedTokens.cursorGrabbing) != null ? _d : "grabbing"
+    "--ds-cursor-active": (_d = mergedTokens == null ? void 0 : mergedTokens.cursorGrabbing) != null ? _d : "grabbing",
+    scrollbarWidth: "none",
+    msOverflowStyle: "none"
   };
   const onMouseDown = (e) => {
     if (!sliderRef.current) return;
@@ -4884,24 +4899,55 @@ function DragSlider({ children, className, tokens: customTokens }) {
     const walk = (x - startX.current) * 1.5;
     sliderRef.current.scrollLeft = scrollLeft.current - walk;
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
-    "div",
-    {
-      ref: sliderRef,
-      style: styles,
-      className: cn(
-        "flex overflow-x-auto no-scrollbar select-none scroll-smooth",
-        "snap-x snap-mandatory",
-        "gap-[var(--ds-gap)] cursor-[var(--ds-cursor)]",
-        className
-      ),
-      onMouseDown,
-      onMouseLeave: stopDragging,
-      onMouseUp: stopDragging,
-      onMouseMove,
-      children: React5.Children.map(children, (child) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { "data-slot": "drag-slider-item", className: "shrink-0 snap-start", children: child }))
-    }
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: "relative w-full overflow-hidden", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("style", { dangerouslySetInnerHTML: { __html: `
+        [data-slot="drag-slider-container"]::-webkit-scrollbar {
+          display: none !important;
+        }
+      ` } }),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      "div",
+      {
+        className: "absolute right-0 top-0 bottom-0 w-20 z-10 pointer-events-none",
+        style: {
+          background: "linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.9))"
+        }
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+      "div",
+      {
+        ref: sliderRef,
+        style: styles,
+        "data-slot": "drag-slider-container",
+        className: cn(
+          "flex overflow-x-auto select-none scroll-smooth",
+          "snap-x snap-mandatory outline-none",
+          "gap-[var(--ds-gap)] cursor-[var(--ds-cursor)]",
+          "py-4 px-4",
+          // Padding aumentado para que respiren los items
+          className
+        ),
+        onMouseDown,
+        onMouseLeave: stopDragging,
+        onMouseUp: stopDragging,
+        onMouseMove,
+        children: React5.Children.map(children, (child, index) => /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+          "div",
+          {
+            "data-slot": "drag-slider-item",
+            className: cn(
+              "shrink-0 snap-start bg-white rounded-xl shadow-md",
+              // Margen extra al último para que no pegue contra el borde al scrollear
+              index === React5.Children.count(children) - 1 ? "mr-10" : ""
+            ),
+            children: child
+          },
+          index
+        ))
+      }
+    )
+  ] });
 }
 
 // src/components/base/data-display/cards-blocks/IntegrationCard.tsx
@@ -5283,11 +5329,560 @@ function AccordionContent(_a2) {
   );
 }
 
-// src/components/base/data-entry/inputs/Calendar.tsx
+// src/components/base/data-display/module-box/moduleBox.tsx
 var React9 = __toESM(require("react"), 1);
+var import_jsx_runtime22 = require("react/jsx-runtime");
+function ModuleBox(_a2) {
+  var _b = _a2, {
+    className,
+    title = "Title",
+    headerActions,
+    footerActions,
+    slotPlaceholder = "Slot",
+    tokens,
+    headerClassName,
+    slotClassName,
+    footerClassName,
+    children,
+    style
+  } = _b, props = __objRest(_b, [
+    "className",
+    "title",
+    "headerActions",
+    "footerActions",
+    "slotPlaceholder",
+    "tokens",
+    "headerClassName",
+    "slotClassName",
+    "footerClassName",
+    "children",
+    "style"
+  ]);
+  var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J;
+  const theme = useTheme();
+  const mergedTokens = (_a3 = resolveTokens({ componentName: "moduleBox", tokens }, theme)) != null ? _a3 : {};
+  const titleFontFamilyRaw = (_b2 = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _b2.fontFamily;
+  const titleFontFamily = typeof titleFontFamilyRaw === "string" ? titleFontFamilyRaw : (_c = titleFontFamilyRaw == null ? void 0 : titleFontFamilyRaw.base) != null ? _c : "inherit";
+  const styles = __spreadValues({
+    "--module-box-bg": (_d = mergedTokens == null ? void 0 : mergedTokens.backgroundColor) != null ? _d : "#FFFFFF",
+    "--module-box-border": (_e = mergedTokens == null ? void 0 : mergedTokens.borderColor) != null ? _e : "#E2E5E9",
+    "--module-box-radius": (_f = mergedTokens == null ? void 0 : mergedTokens.borderRadius) != null ? _f : "16px",
+    "--module-box-padding": (_g = mergedTokens == null ? void 0 : mergedTokens.padding) != null ? _g : "24px",
+    "--module-box-gap": (_h = mergedTokens == null ? void 0 : mergedTokens.gap) != null ? _h : "24px",
+    "--module-box-header-gap": (_j = (_i = mergedTokens == null ? void 0 : mergedTokens.header) == null ? void 0 : _i.gap) != null ? _j : "12px",
+    "--module-box-footer-gap": (_l = (_k = mergedTokens == null ? void 0 : mergedTokens.footer) == null ? void 0 : _k.gap) != null ? _l : "12px",
+    "--module-box-slot-bg": (_n = (_m = mergedTokens == null ? void 0 : mergedTokens.slot) == null ? void 0 : _m.background) != null ? _n : "#ECEAF3",
+    "--module-box-slot-border": (_p = (_o = mergedTokens == null ? void 0 : mergedTokens.slot) == null ? void 0 : _o.border) != null ? _p : "#652BDF",
+    "--module-box-slot-radius": (_r = (_q = mergedTokens == null ? void 0 : mergedTokens.slot) == null ? void 0 : _q.borderRadius) != null ? _r : "0px",
+    "--module-box-slot-padding": (_t = (_s = mergedTokens == null ? void 0 : mergedTokens.slot) == null ? void 0 : _s.padding) != null ? _t : "24px",
+    "--module-box-slot-min-h": (_v = (_u = mergedTokens == null ? void 0 : mergedTokens.slot) == null ? void 0 : _u.minHeight) != null ? _v : "112px",
+    "--module-box-slot-color": (_x = (_w = mergedTokens == null ? void 0 : mergedTokens.slot) == null ? void 0 : _w.color) != null ? _x : "#3A3F4B",
+    "--module-box-title-color": (_z = (_y = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _y.color) != null ? _z : "#020303",
+    "--module-box-title-font-family": titleFontFamily,
+    "--module-box-title-font-size": (_B = (_A = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _A.fontSize) != null ? _B : "18px",
+    "--module-box-title-font-weight": (_D = (_C = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _C.fontWeight) != null ? _D : 550,
+    "--module-box-title-font-style": (_F = (_E = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _E.fontStyle) != null ? _F : "normal",
+    "--module-box-title-line-height": (_H = (_G = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _G.lineHeight) != null ? _H : "130%",
+    "--module-box-title-letter-spacing": (_J = (_I = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _I.letterSpacing) != null ? _J : "-0.04em"
+  }, style);
+  const hasChildren = React9.Children.count(children) > 0;
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    "div",
+    __spreadProps(__spreadValues({
+      "data-slot": "module-box",
+      style: styles,
+      className: cn(
+        "w-full min-w-0 border rounded-[var(--module-box-radius)] bg-[var(--module-box-bg)] border-[var(--module-box-border)] p-[var(--module-box-padding)]",
+        className
+      )
+    }, props), {
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+        "div",
+        {
+          className: "flex flex-col",
+          style: { gap: "var(--module-box-gap)" },
+          children: [
+            (title || headerActions) && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+              "div",
+              {
+                className: cn(
+                  "flex items-center justify-between min-w-0",
+                  headerClassName
+                ),
+                style: { gap: "var(--module-box-header-gap)" },
+                children: [
+                  title && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+                    "h3",
+                    {
+                      className: "truncate",
+                      style: {
+                        color: "var(--module-box-title-color)",
+                        fontFamily: "var(--module-box-title-font-family)",
+                        fontSize: "var(--module-box-title-font-size)",
+                        fontWeight: "var(--module-box-title-font-weight)",
+                        fontStyle: "var(--module-box-title-font-style)",
+                        lineHeight: "var(--module-box-title-line-height)",
+                        letterSpacing: "var(--module-box-title-letter-spacing)",
+                        verticalAlign: "middle"
+                      },
+                      children: title
+                    }
+                  ),
+                  headerActions && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "shrink-0", children: headerActions })
+                ]
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+              "div",
+              {
+                "data-slot": "module-box-content",
+                className: cn(
+                  "w-full border border-dashed rounded-[var(--module-box-slot-radius)] border-[var(--module-box-slot-border)] bg-[var(--module-box-slot-bg)] p-[var(--module-box-slot-padding)] text-[var(--module-box-slot-color)]",
+                  !hasChildren && "min-h-[var(--module-box-slot-min-h)] flex items-center justify-center text-center",
+                  slotClassName
+                ),
+                children: hasChildren ? children : slotPlaceholder
+              }
+            ),
+            footerActions && /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+              "div",
+              {
+                className: cn(
+                  "flex items-center justify-end",
+                  footerClassName
+                ),
+                style: { gap: "var(--module-box-footer-gap)" },
+                children: footerActions
+              }
+            )
+          ]
+        }
+      )
+    })
+  );
+}
+
+// src/components/base/data-display/charts/Charts.tsx
+var React10 = __toESM(require("react"), 1);
+var import_recharts = require("recharts");
+var import_jsx_runtime23 = require("react/jsx-runtime");
+function Charts(_a2) {
+  var _b = _a2, {
+    className,
+    type = "bar",
+    data,
+    title,
+    subtitle,
+    showLegend = true,
+    showGrid = true,
+    showBaseline = true,
+    showXAxis = true,
+    showYAxis = false,
+    showTooltip = true,
+    height,
+    donutCenterValue,
+    donutCenterLabel,
+    legendTitle,
+    valueFormatter = (value) => `${value}`,
+    tokens,
+    style
+  } = _b, props = __objRest(_b, [
+    "className",
+    "type",
+    "data",
+    "title",
+    "subtitle",
+    "showLegend",
+    "showGrid",
+    "showBaseline",
+    "showXAxis",
+    "showYAxis",
+    "showTooltip",
+    "height",
+    "donutCenterValue",
+    "donutCenterLabel",
+    "legendTitle",
+    "valueFormatter",
+    "tokens",
+    "style"
+  ]);
+  var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y, _Z, __, _$, _aa, _ba, _ca, _da, _ea, _fa, _ga, _ha, _ia, _ja, _ka, _la, _ma, _na, _oa, _pa, _qa, _ra, _sa, _ta, _ua, _va, _wa, _xa, _ya, _za, _Aa, _Ba, _Ca, _Da, _Ea, _Fa, _Ga, _Ha;
+  const theme = useTheme();
+  const mergedTokens = (_a3 = resolveTokens({ componentName: "charts", tokens }, theme)) != null ? _a3 : {};
+  const uid = React10.useId();
+  const gradientId = `charts-line-gradient-${uid}`;
+  const computedHeight = height != null ? height : Number((_b2 = mergedTokens == null ? void 0 : mergedTokens.height) != null ? _b2 : 260);
+  const styles = __spreadValues({
+    "--charts-bg": (_c = mergedTokens == null ? void 0 : mergedTokens.backgroundColor) != null ? _c : "transparent",
+    "--charts-border": (_d = mergedTokens == null ? void 0 : mergedTokens.borderColor) != null ? _d : "transparent",
+    "--charts-radius": (_e = mergedTokens == null ? void 0 : mergedTokens.borderRadius) != null ? _e : "0px",
+    "--charts-padding": (_f = mergedTokens == null ? void 0 : mergedTokens.padding) != null ? _f : "0px",
+    "--charts-title-color": (_h = (_g = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _g.color) != null ? _h : "#020303",
+    "--charts-title-size": (_j = (_i = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _i.fontSize) != null ? _j : "16px",
+    "--charts-title-weight": (_l = (_k = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _k.fontWeight) != null ? _l : 550,
+    "--charts-subtitle-color": (_n = (_m = mergedTokens == null ? void 0 : mergedTokens.subtitle) == null ? void 0 : _m.color) != null ? _n : "#6E7991",
+    "--charts-subtitle-size": (_p = (_o = mergedTokens == null ? void 0 : mergedTokens.subtitle) == null ? void 0 : _o.fontSize) != null ? _p : "14px",
+    "--charts-subtitle-weight": (_r = (_q = mergedTokens == null ? void 0 : mergedTokens.subtitle) == null ? void 0 : _q.fontWeight) != null ? _r : 400,
+    "--charts-grid-color": (_t = (_s = mergedTokens == null ? void 0 : mergedTokens.grid) == null ? void 0 : _s.color) != null ? _t : "#E2E5E9",
+    "--charts-grid-dasharray": (_v = (_u = mergedTokens == null ? void 0 : mergedTokens.grid) == null ? void 0 : _u.dasharray) != null ? _v : "0",
+    "--charts-axis-line-color": (_x = (_w = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _w.lineColor) != null ? _x : "#E2E5E9",
+    "--charts-axis-label-color": (_z = (_y = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _y.labelColor) != null ? _z : "#9DA5B5",
+    "--charts-axis-label-size": (_B = (_A = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _A.fontSize) != null ? _B : 12,
+    "--charts-baseline-color": (_F = (_E = (_C = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _C.color) != null ? _E : (_D = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _D.lineColor) != null ? _F : "#E2E5E9",
+    "--charts-baseline-width": (_H = (_G = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _G.strokeWidth) != null ? _H : 1,
+    "--charts-baseline-dasharray": (_J = (_I = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _I.dasharray) != null ? _J : "0",
+    "--charts-legend-color": (_L = (_K = mergedTokens == null ? void 0 : mergedTokens.legend) == null ? void 0 : _K.color) != null ? _L : "#3A3F4B",
+    "--charts-legend-size": (_N = (_M = mergedTokens == null ? void 0 : mergedTokens.legend) == null ? void 0 : _M.fontSize) != null ? _N : 14,
+    "--charts-legend-dot-size": (_P = (_O = mergedTokens == null ? void 0 : mergedTokens.legend) == null ? void 0 : _O.dotSize) != null ? _P : 10,
+    "--charts-legend-gap": (_R = (_Q = mergedTokens == null ? void 0 : mergedTokens.legend) == null ? void 0 : _Q.gap) != null ? _R : 16,
+    "--charts-tooltip-bg": (_T = (_S = mergedTokens == null ? void 0 : mergedTokens.tooltip) == null ? void 0 : _S.background) != null ? _T : "#FFFFFF",
+    "--charts-tooltip-border": (_V = (_U = mergedTokens == null ? void 0 : mergedTokens.tooltip) == null ? void 0 : _U.borderColor) != null ? _V : "#E2E5E9",
+    "--charts-tooltip-radius": (_X = (_W = mergedTokens == null ? void 0 : mergedTokens.tooltip) == null ? void 0 : _W.radius) != null ? _X : "8px",
+    "--charts-tooltip-title": (_Z = (_Y = mergedTokens == null ? void 0 : mergedTokens.tooltip) == null ? void 0 : _Y.titleColor) != null ? _Z : "#3A3F4B",
+    "--charts-tooltip-value": (_$ = (__ = mergedTokens == null ? void 0 : mergedTokens.tooltip) == null ? void 0 : __.valueColor) != null ? _$ : "#020303",
+    "--charts-line-stroke": (_ba = (_aa = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _aa.stroke) != null ? _ba : "#652BDF",
+    "--charts-line-stroke-width": (_da = (_ca = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _ca.strokeWidth) != null ? _da : 2,
+    "--charts-line-area-from": (_fa = (_ea = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _ea.areaFrom) != null ? _fa : "#652BDF4D",
+    "--charts-line-area-to": (_ha = (_ga = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _ga.areaTo) != null ? _ha : "#652BDF00",
+    "--charts-bar-radius": (_ja = (_ia = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _ia.radius) != null ? _ja : 10,
+    "--charts-bar-gap": (_la = (_ka = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _ka.gap) != null ? _la : 8,
+    "--charts-bar-category-gap": (_na = (_ma = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _ma.categoryGap) != null ? _na : "16%",
+    "--charts-pie-stroke": (_pa = (_oa = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _oa.strokeColor) != null ? _pa : "#FFFFFF",
+    "--charts-pie-stroke-width": (_ra = (_qa = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _qa.strokeWidth) != null ? _ra : 2,
+    "--charts-donut-center-value-color": (_ta = (_sa = mergedTokens == null ? void 0 : mergedTokens.donut) == null ? void 0 : _sa.centerValueColor) != null ? _ta : "#3A3F4B",
+    "--charts-donut-center-value-size": (_va = (_ua = mergedTokens == null ? void 0 : mergedTokens.donut) == null ? void 0 : _ua.centerValueSize) != null ? _va : "24px",
+    "--charts-donut-center-label-color": (_xa = (_wa = mergedTokens == null ? void 0 : mergedTokens.donut) == null ? void 0 : _wa.centerLabelColor) != null ? _xa : "#9DA5B5",
+    "--charts-donut-center-label-size": (_za = (_ya = mergedTokens == null ? void 0 : mergedTokens.donut) == null ? void 0 : _ya.centerLabelSize) != null ? _za : "12px"
+  }, style);
+  const fallbackPalette = [
+    "#D8CFF3",
+    "#9A7BDB",
+    "#652BDF",
+    "#421B97",
+    "#1F0A4D"
+  ];
+  const candidatePalette = (_Da = type === "line" ? (_Aa = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _Aa.palette : type === "bar" ? (_Ba = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _Ba.palette : (_Ca = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _Ca.palette) != null ? _Da : mergedTokens == null ? void 0 : mergedTokens.palette;
+  const palette = Array.isArray(candidatePalette) && candidatePalette.length ? candidatePalette : fallbackPalette;
+  const getColor = (datum, index) => {
+    var _a4;
+    return (_a4 = datum.color) != null ? _a4 : palette[index % palette.length];
+  };
+  const legendItems = data.map((datum, index) => ({
+    label: datum.label,
+    color: getColor(datum, index)
+  }));
+  const renderTooltip = ({
+    active,
+    payload,
+    label
+  }) => {
+    var _a4, _b3, _c2;
+    if (!active || !(payload == null ? void 0 : payload.length)) return null;
+    const point = payload[0];
+    const value = Number((_a4 = point == null ? void 0 : point.value) != null ? _a4 : 0);
+    const pointLabel = (_c2 = label != null ? label : (_b3 = point == null ? void 0 : point.payload) == null ? void 0 : _b3.label) != null ? _c2 : "";
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+      "div",
+      {
+        className: "px-3 py-2 border shadow-sm",
+        style: {
+          background: "var(--charts-tooltip-bg)",
+          borderColor: "var(--charts-tooltip-border)",
+          borderRadius: "var(--charts-tooltip-radius)"
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "p",
+            {
+              style: {
+                color: "var(--charts-tooltip-title)",
+                fontSize: "12px",
+                fontWeight: 550
+              },
+              children: pointLabel
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "p",
+            {
+              style: {
+                color: "var(--charts-tooltip-value)",
+                fontSize: "14px",
+                fontWeight: 600
+              },
+              children: valueFormatter(value)
+            }
+          )
+        ]
+      }
+    );
+  };
+  const chartContent = (() => {
+    var _a4, _b3, _c2, _d2, _e2, _f2, _g2, _h2, _i2, _j2, _k2, _l2, _m2, _n2, _o2, _p2, _q2, _r2, _s2, _t2, _u2, _v2, _w2, _x2, _y2, _z2, _A2, _B2, _C2, _D2, _E2, _F2, _G2, _H2, _I2, _J2, _K2, _L2, _M2, _N2, _O2, _P2, _Q2, _R2, _S2, _T2;
+    if (!(data == null ? void 0 : data.length)) {
+      return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { className: "h-full w-full flex items-center justify-center text-[#9DA5B5] text-sm", children: "No data" });
+    }
+    if (type === "bar") {
+      return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+        import_recharts.BarChart,
+        {
+          data,
+          barGap: Number((_b3 = (_a4 = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _a4.gap) != null ? _b3 : 8),
+          barCategoryGap: String((_d2 = (_c2 = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _c2.categoryGap) != null ? _d2 : "16%"),
+          children: [
+            showGrid && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_recharts.CartesianGrid,
+              {
+                stroke: "var(--charts-grid-color)",
+                strokeDasharray: String((_f2 = (_e2 = mergedTokens == null ? void 0 : mergedTokens.grid) == null ? void 0 : _e2.dasharray) != null ? _f2 : "0"),
+                vertical: false
+              }
+            ),
+            showXAxis && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_recharts.XAxis,
+              {
+                dataKey: "label",
+                axisLine: { stroke: "var(--charts-axis-line-color)" },
+                tickLine: false,
+                tick: {
+                  fill: "var(--charts-axis-label-color)",
+                  fontSize: Number((_h2 = (_g2 = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _g2.fontSize) != null ? _h2 : 12)
+                }
+              }
+            ),
+            showYAxis && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_recharts.YAxis,
+              {
+                axisLine: { stroke: "var(--charts-axis-line-color)" },
+                tickLine: false,
+                tick: {
+                  fill: "var(--charts-axis-label-color)",
+                  fontSize: Number((_j2 = (_i2 = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _i2.fontSize) != null ? _j2 : 12)
+                }
+              }
+            ),
+            showBaseline && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_recharts.ReferenceLine,
+              {
+                y: 0,
+                stroke: "var(--charts-baseline-color)",
+                strokeWidth: Number((_l2 = (_k2 = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _k2.strokeWidth) != null ? _l2 : 1),
+                strokeDasharray: String((_n2 = (_m2 = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _m2.dasharray) != null ? _n2 : "0"),
+                ifOverflow: "visible"
+              }
+            ),
+            showTooltip && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.Tooltip, { cursor: false, content: renderTooltip }),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              import_recharts.Bar,
+              {
+                dataKey: "value",
+                radius: Number((_p2 = (_o2 = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _o2.radius) != null ? _p2 : 10),
+                maxBarSize: Number((_r2 = (_q2 = mergedTokens == null ? void 0 : mergedTokens.bar) == null ? void 0 : _q2.maxBarSize) != null ? _r2 : 56),
+                children: data.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.Cell, { fill: getColor(entry, index) }, `${entry.label}-${index}`))
+              }
+            )
+          ]
+        }
+      ) });
+    }
+    if (type === "line") {
+      return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_recharts.AreaChart, { data, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("linearGradient", { id: gradientId, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("stop", { offset: "0%", stopColor: "var(--charts-line-area-from)" }),
+          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("stop", { offset: "100%", stopColor: "var(--charts-line-area-to)" })
+        ] }) }),
+        showGrid && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_recharts.CartesianGrid,
+          {
+            stroke: "var(--charts-grid-color)",
+            strokeDasharray: String((_t2 = (_s2 = mergedTokens == null ? void 0 : mergedTokens.grid) == null ? void 0 : _s2.dasharray) != null ? _t2 : "0"),
+            vertical: false
+          }
+        ),
+        showXAxis && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_recharts.XAxis,
+          {
+            dataKey: "label",
+            axisLine: { stroke: "var(--charts-axis-line-color)" },
+            tickLine: false,
+            tick: {
+              fill: "var(--charts-axis-label-color)",
+              fontSize: Number((_v2 = (_u2 = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _u2.fontSize) != null ? _v2 : 12)
+            }
+          }
+        ),
+        showYAxis && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_recharts.YAxis,
+          {
+            axisLine: { stroke: "var(--charts-axis-line-color)" },
+            tickLine: false,
+            tick: {
+              fill: "var(--charts-axis-label-color)",
+              fontSize: Number((_x2 = (_w2 = mergedTokens == null ? void 0 : mergedTokens.axis) == null ? void 0 : _w2.fontSize) != null ? _x2 : 12)
+            }
+          }
+        ),
+        showBaseline && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_recharts.ReferenceLine,
+          {
+            y: 0,
+            stroke: "var(--charts-baseline-color)",
+            strokeWidth: Number((_z2 = (_y2 = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _y2.strokeWidth) != null ? _z2 : 1),
+            strokeDasharray: String((_B2 = (_A2 = mergedTokens == null ? void 0 : mergedTokens.baseline) == null ? void 0 : _A2.dasharray) != null ? _B2 : "0"),
+            ifOverflow: "visible"
+          }
+        ),
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.Tooltip, { cursor: false, content: renderTooltip }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_recharts.Area,
+          {
+            type: (_D2 = (_C2 = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _C2.curveType) != null ? _D2 : "monotone",
+            dataKey: "value",
+            stroke: "var(--charts-line-stroke)",
+            strokeWidth: Number((_F2 = (_E2 = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _E2.strokeWidth) != null ? _F2 : 2),
+            fill: `url(#${gradientId})`,
+            dot: false,
+            activeDot: {
+              r: Number((_H2 = (_G2 = mergedTokens == null ? void 0 : mergedTokens.line) == null ? void 0 : _G2.activeDotRadius) != null ? _H2 : 4),
+              fill: "var(--charts-line-stroke)"
+            }
+          }
+        )
+      ] }) });
+    }
+    const innerRadius = type === "donut" ? Number((_J2 = (_I2 = mergedTokens == null ? void 0 : mergedTokens.donut) == null ? void 0 : _I2.innerRadius) != null ? _J2 : 52) : Number((_L2 = (_K2 = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _K2.innerRadius) != null ? _L2 : 0);
+    const outerRadius = type === "donut" ? Number((_N2 = (_M2 = mergedTokens == null ? void 0 : mergedTokens.donut) == null ? void 0 : _M2.outerRadius) != null ? _N2 : 72) : Number((_P2 = (_O2 = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _O2.outerRadius) != null ? _P2 : 72);
+    return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "relative h-full w-full", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.ResponsiveContainer, { width: "100%", height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(import_recharts.PieChart, { children: [
+        showTooltip && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.Tooltip, { content: renderTooltip }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          import_recharts.Pie,
+          {
+            data,
+            dataKey: "value",
+            nameKey: "label",
+            cx: "50%",
+            cy: "50%",
+            innerRadius,
+            outerRadius,
+            paddingAngle: Number((_R2 = (_Q2 = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _Q2.paddingAngle) != null ? _R2 : 0),
+            stroke: "var(--charts-pie-stroke)",
+            strokeWidth: Number((_T2 = (_S2 = mergedTokens == null ? void 0 : mergedTokens.pie) == null ? void 0 : _S2.strokeWidth) != null ? _T2 : 2),
+            children: data.map((entry, index) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_recharts.Cell, { fill: getColor(entry, index) }, `${entry.label}-${index}`))
+          }
+        )
+      ] }) }),
+      type === "donut" && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "pointer-events-none absolute inset-0 flex flex-col items-center justify-center leading-none", children: [
+        donutCenterValue && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          "div",
+          {
+            style: {
+              color: "var(--charts-donut-center-value-color)",
+              fontSize: "var(--charts-donut-center-value-size)",
+              fontWeight: 600
+            },
+            children: donutCenterValue
+          }
+        ),
+        donutCenterLabel && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          "div",
+          {
+            style: {
+              color: "var(--charts-donut-center-label-color)",
+              fontSize: "var(--charts-donut-center-label-size)",
+              fontWeight: 500,
+              marginTop: 4
+            },
+            children: donutCenterLabel
+          }
+        )
+      ] })
+    ] });
+  })();
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+    "div",
+    __spreadProps(__spreadValues({
+      "data-slot": "charts",
+      style: styles,
+      className: cn(
+        "w-full min-w-0 border rounded-[var(--charts-radius)] bg-[var(--charts-bg)] border-[var(--charts-border)] p-[var(--charts-padding)]",
+        className
+      )
+    }, props), {
+      children: [
+        (title || subtitle) && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "mb-4", children: [
+          title && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "p",
+            {
+              style: {
+                color: "var(--charts-title-color)",
+                fontSize: "var(--charts-title-size)",
+                fontWeight: Number((_Fa = (_Ea = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _Ea.fontWeight) != null ? _Fa : 550)
+              },
+              children: title
+            }
+          ),
+          subtitle && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "p",
+            {
+              className: "mt-1",
+              style: {
+                color: "var(--charts-subtitle-color)",
+                fontSize: "var(--charts-subtitle-size)",
+                fontWeight: Number((_Ha = (_Ga = mergedTokens == null ? void 0 : mergedTokens.subtitle) == null ? void 0 : _Ga.fontWeight) != null ? _Ha : 400)
+              },
+              children: subtitle
+            }
+          )
+        ] }),
+        /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("div", { style: { height: computedHeight }, children: chartContent }),
+        showLegend && legendItems.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "mt-4 flex flex-wrap items-center justify-center gap-[var(--charts-legend-gap)]", children: [
+          legendTitle && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+            "span",
+            {
+              style: {
+                color: "var(--charts-legend-color)",
+                fontSize: "var(--charts-legend-size)",
+                fontWeight: 500
+              },
+              children: legendTitle
+            }
+          ),
+          legendItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "inline-flex items-center gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              "span",
+              {
+                className: "inline-block rounded-[2px]",
+                style: {
+                  backgroundColor: item.color,
+                  width: "var(--charts-legend-dot-size)",
+                  height: "var(--charts-legend-dot-size)"
+                }
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+              "span",
+              {
+                style: {
+                  color: "var(--charts-legend-color)",
+                  fontSize: "var(--charts-legend-size)",
+                  fontWeight: 500
+                },
+                children: item.label
+              }
+            )
+          ] }, item.label))
+        ] })
+      ]
+    })
+  );
+}
+
+// src/components/base/data-entry/inputs/Calendar.tsx
+var React11 = __toESM(require("react"), 1);
 var import_lucide_react4 = require("lucide-react");
 var import_react_day_picker = require("react-day-picker");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function Calendar(_a2) {
   var _b = _a2, {
     className,
@@ -5328,7 +5923,7 @@ function Calendar(_a2) {
     "--calendar-item-active-bg": (_r = (_q = (_p = mergedTokens == null ? void 0 : mergedTokens.item) == null ? void 0 : _p.active) == null ? void 0 : _q.background) != null ? _r : "#652BDF",
     "--calendar-item-active-text": (_u = (_t = (_s = mergedTokens == null ? void 0 : mergedTokens.item) == null ? void 0 : _s.active) == null ? void 0 : _t.color) != null ? _u : "#FFFFFF"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { "data-slot": "calendar", style: styles, className: "w-fit", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { "data-slot": "calendar", style: styles, className: "w-fit", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     import_react_day_picker.DayPicker,
     __spreadValues({
       showOutsideDays,
@@ -5368,7 +5963,7 @@ function Calendar(_a2) {
         Chevron: (_v) => {
           var _w = _v, { orientation, className: className2 } = _w, props2 = __objRest(_w, ["orientation", "className"]);
           const Icon2 = orientation === "left" ? import_lucide_react4.ChevronLeftIcon : orientation === "right" ? import_lucide_react4.ChevronRightIcon : import_lucide_react4.ChevronDownIcon;
-          return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(Icon2, __spreadValues({ className: cn("size-4", className2) }, props2));
+          return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon2, __spreadValues({ className: cn("size-4", className2) }, props2));
         },
         DayButton: CalendarDayButton
       }, components)
@@ -5385,12 +5980,12 @@ function CalendarDayButton(_a2) {
     "day",
     "modifiers"
   ]);
-  const ref = React9.useRef(null);
-  React9.useEffect(() => {
+  const ref = React11.useRef(null);
+  React11.useEffect(() => {
     var _a3;
     if (modifiers.focused) (_a3 = ref.current) == null ? void 0 : _a3.focus();
   }, [modifiers.focused]);
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
     "button",
     __spreadValues({
       ref,
@@ -5421,7 +6016,7 @@ function CalendarDayButton(_a2) {
 // src/components/base/data-entry/inputs/Combobox.tsx
 var Popover2 = __toESM(require("@radix-ui/react-popover"), 1);
 var import_lucide_react5 = require("lucide-react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 var inputBase = "ui-input w-full outline-none";
 var inputLabel = "leading-[1.3] tracking-[-0.04em]";
 var selectVariants = cva(inputBase, {
@@ -5504,9 +6099,9 @@ function Combobox({
     "--input-icon-size": sizeTokens == null ? void 0 : sizeTokens.iconSize
   };
   const selectedItem = items.find((i) => i.value === value);
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Popover2.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { style: styles, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("label", { className: inputLabel + " ui-input-label", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(Popover2.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Popover2.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { style: styles, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("label", { className: inputLabel + " ui-input-label", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Popover2.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
       "button",
       {
         disabled,
@@ -5517,8 +6112,8 @@ function Combobox({
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "truncate", children: (_M = selectedItem == null ? void 0 : selectedItem.label) != null ? _M : placeholder }),
-          /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "truncate", children: (_M = selectedItem == null ? void 0 : selectedItem.label) != null ? _M : placeholder }),
+          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
             import_lucide_react5.ChevronsUpDown,
             {
               className: "\r\n            h-4 w-4 shrink-0 ui-input-icon\r\n            "
@@ -5527,7 +6122,7 @@ function Combobox({
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
       Popover2.Content,
       {
         align: "start",
@@ -5536,12 +6131,12 @@ function Combobox({
         style: {
           width: "var(--radix-popover-trigger-width)"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("ul", { className: "max-h-60 overflow-auto", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("ul", { className: "max-h-60 overflow-auto", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
           "li",
           {
             onClick: () => onValueChange == null ? void 0 : onValueChange(item.value),
             className: "\r\n                flex items-center justify-between\r\n                text-[length:var(--input-font-size)] font-[var(--input-font-weight)]\r\n                h-10 px-3 rounded-[--input-radius] cursor-pointer\r\n                bg-[--input-bg]\r\n                hover:bg-[--input-hover-bg]\r\n                border-[--input-hover-border]\r\n                box-shadow-[0px_2px_4px_-1px_#0000000F,0px_4px_6px_-1px_#0000001A]\r\n              ",
-            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { children: item.label })
+            children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { children: item.label })
           },
           item.value
         )) })
@@ -5551,9 +6146,9 @@ function Combobox({
 }
 
 // src/components/base/data-entry/inputs/DatePicker.tsx
-var React10 = __toESM(require("react"), 1);
+var React12 = __toESM(require("react"), 1);
 var import_lucide_react6 = require("lucide-react");
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime26 = require("react/jsx-runtime");
 var inputBase2 = "ui-input w-full outline-none";
 var inputLabel2 = "leading-[1.3] tracking-[-0.04em]";
 var inputVariants = cva(inputBase2, {
@@ -5586,7 +6181,7 @@ function DatePickerInput(_a2) {
   ]);
   var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M;
   const theme = useTheme();
-  const inputRef = React10.useRef(null);
+  const inputRef = React12.useRef(null);
   const mergedTokens = (_a3 = resolveTokens({ componentName: "input", tokens }, theme)) != null ? _a3 : {};
   const sizeTokens = (_c = (_b2 = mergedTokens == null ? void 0 : mergedTokens.sizes) == null ? void 0 : _b2[size != null ? size : "medium"]) != null ? _c : {};
   const isFilled = Boolean((_d = props.value) != null ? _d : props.defaultValue);
@@ -5647,15 +6242,15 @@ function DatePickerInput(_a2) {
     /* Icon */
     "--input-icon-size": sizeTokens == null ? void 0 : sizeTokens.iconSize
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "div",
     {
       className: "flex flex-col gap-1.5 w-full",
       style: styles,
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("label", { className: inputLabel2 + " ui-input-label", children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)("div", { className: "relative", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("label", { className: inputLabel2 + " ui-input-label", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)("div", { className: "relative", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             "input",
             __spreadValues({
               ref: inputRef,
@@ -5667,14 +6262,14 @@ function DatePickerInput(_a2) {
               className: cn(inputVariants(), className, "text-left")
             }, props)
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             "div",
             {
               className: cn(
                 "absolute right-2 inset-y-0 flex items-center justify-center",
                 disabled && "pointer-events-none"
               ),
-              children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react6.Calendar, { className: "ui-input-icon" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_lucide_react6.Calendar, { className: "ui-input-icon" })
             }
           )
         ] })
@@ -5684,7 +6279,7 @@ function DatePickerInput(_a2) {
 }
 
 // src/components/base/data-entry/inputs/Input.tsx
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var inputBase3 = "ui-input w-full outline-none";
 var inputLabel3 = "leading-[1.3] tracking-[-0.04em]";
 var inputHelper = "leading-[1.3]";
@@ -5779,14 +6374,14 @@ function Input(_a2) {
     /* Padding */
     "--input-padding": sizeTokens.padding
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
     "div",
     {
       className: "flex flex-col gap-1.5 w-full",
       style: styles,
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("label", { className: inputLabel3 + " ui-input-label", children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("label", { className: inputLabel3 + " ui-input-label", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
           "input",
           __spreadValues({
             disabled,
@@ -5795,7 +6390,7 @@ function Input(_a2) {
             className: cn(inputVariants2(), className)
           }, props)
         ),
-        helperText && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+        helperText && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
           "span",
           {
             className: error ? inputHelperError + " ui-input-helper-error" : inputHelper + " ui-input-helper",
@@ -5809,7 +6404,7 @@ function Input(_a2) {
 
 // src/components/base/data-entry/inputs/Label.tsx
 var LabelPrimitive = __toESM(require("@radix-ui/react-label"), 1);
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 function Label2(_a2) {
   var _b = _a2, {
     className,
@@ -5829,7 +6424,7 @@ function Label2(_a2) {
     "--lbl-weight": (_d = mergedTokens == null ? void 0 : mergedTokens.fontWeight) != null ? _d : "500",
     "--lbl-padding": (_e = mergedTokens == null ? void 0 : mergedTokens.padding) != null ? _e : "0px"
   }, style);
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
     LabelPrimitive.Root,
     __spreadValues({
       "data-slot": "label",
@@ -5850,9 +6445,9 @@ function Label2(_a2) {
 }
 
 // src/components/base/data-entry/inputs/PasswordInput.tsx
-var React11 = __toESM(require("react"), 1);
+var React13 = __toESM(require("react"), 1);
 var import_lucide_react7 = require("lucide-react");
-var import_jsx_runtime27 = require("react/jsx-runtime");
+var import_jsx_runtime29 = require("react/jsx-runtime");
 var inputBase4 = "ui-input w-full outline-none";
 var inputLabel4 = "leading-[1.3] tracking-[-0.04em]";
 var inputHelper2 = "leading-[1.3]";
@@ -5887,7 +6482,7 @@ function PasswordInput(_a2) {
   ]);
   var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M;
   const theme = useTheme();
-  const inputRef = React11.useRef(null);
+  const inputRef = React13.useRef(null);
   const mergedTokens = (_a3 = resolveTokens({ componentName: "input", tokens }, theme)) != null ? _a3 : {};
   const sizeTokens = (_c = (_b2 = mergedTokens == null ? void 0 : mergedTokens.sizes) == null ? void 0 : _b2[size != null ? size : "medium"]) != null ? _c : {};
   const isFilled = Boolean((_d = props.value) != null ? _d : props.defaultValue);
@@ -5952,15 +6547,15 @@ function PasswordInput(_a2) {
     if (!inputRef.current) return;
     inputRef.current.type = inputRef.current.type === "password" ? "text" : "password";
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
     "div",
     {
       className: "flex flex-col gap-1.5 w-full",
       style: styles,
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("label", { className: inputLabel4 + " ui-input-label", children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "relative", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("label", { className: inputLabel4 + " ui-input-label", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "relative", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
             "input",
             __spreadValues({
               ref: inputRef,
@@ -5971,7 +6566,7 @@ function PasswordInput(_a2) {
               className: cn(inputVariants3(), className)
             }, props)
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
             "button",
             {
               type: "button",
@@ -5980,13 +6575,13 @@ function PasswordInput(_a2) {
               onClick: toggleVisibility,
               className: "ui-password-toggle absolute right-2 inset-y-0 flex items-center justify-center",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react7.Eye, { className: "ui-eye ui-input-icon" }),
-                /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(import_lucide_react7.EyeOff, { className: "ui-eye-off ui-input-icon" })
+                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react7.Eye, { className: "ui-eye ui-input-icon" }),
+                /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react7.EyeOff, { className: "ui-eye-off ui-input-icon" })
               ]
             }
           )
         ] }),
-        helperText && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        helperText && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
           "span",
           {
             className: error ? inputHelperError2 + " ui-input-helper-error" : inputHelper2 + " ui-input-helper",
@@ -5999,9 +6594,9 @@ function PasswordInput(_a2) {
 }
 
 // src/components/base/data-entry/inputs/SearchBar.tsx
-var React12 = __toESM(require("react"), 1);
+var React14 = __toESM(require("react"), 1);
 var import_lucide_react8 = require("lucide-react");
-var import_jsx_runtime28 = require("react/jsx-runtime");
+var import_jsx_runtime30 = require("react/jsx-runtime");
 var inputBase5 = "ui-input w-full outline-none pl-[44px] pr-[44px]";
 var inputVariants4 = cva(inputBase5, {
   variants: {},
@@ -6029,8 +6624,8 @@ function SearchBar(_a2) {
   ]);
   var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M;
   const theme = useTheme();
-  const inputRef = React12.useRef(null);
-  const clearRef = React12.useRef(null);
+  const inputRef = React14.useRef(null);
+  const clearRef = React14.useRef(null);
   const mergedTokens = (_a3 = resolveTokens({ componentName: "input", tokens }, theme)) != null ? _a3 : {};
   const sizeTokens = (_c = (_b2 = mergedTokens == null ? void 0 : mergedTokens.sizes) == null ? void 0 : _b2[size != null ? size : "medium"]) != null ? _c : {};
   const isFilled = Boolean((_d = props.value) != null ? _d : props.defaultValue);
@@ -6105,18 +6700,18 @@ function SearchBar(_a2) {
       inputRef.current.value.length === 0
     );
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative w-full", style: styles, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "relative w-full", style: styles, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       "div",
       {
         className: cn(
           "absolute inset-y-0 left-[12px] flex items-center pointer-events-none",
           disabled && "text-[--color-text-disabled] "
         ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react8.Search, { className: "ui-input-icon" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react8.Search, { className: "ui-input-icon" })
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       "input",
       __spreadValues({
         ref: inputRef,
@@ -6129,7 +6724,7 @@ function SearchBar(_a2) {
         className: cn(inputVariants4(), className)
       }, props)
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
       "button",
       {
         ref: clearRef,
@@ -6138,7 +6733,7 @@ function SearchBar(_a2) {
         disabled,
         onClick: clearSearch,
         className: "absolute right-2 inset-y-0 flex items-center justify-center",
-        children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react8.X, { className: "ui-input-icon" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_lucide_react8.X, { className: "ui-input-icon" })
       }
     )
   ] });
@@ -6147,7 +6742,7 @@ function SearchBar(_a2) {
 // src/components/base/data-entry/inputs/Select.tsx
 var Popover3 = __toESM(require("@radix-ui/react-popover"), 1);
 var import_lucide_react9 = require("lucide-react");
-var import_jsx_runtime29 = require("react/jsx-runtime");
+var import_jsx_runtime31 = require("react/jsx-runtime");
 var inputBase6 = "ui-input w-full outline-none";
 var inputLabel5 = "leading-[1.3] tracking-[-0.04em]";
 var selectVariants2 = cva(inputBase6, {
@@ -6230,9 +6825,9 @@ function Select({
     "--input-icon-size": sizeTokens == null ? void 0 : sizeTokens.iconSize
   };
   const selectedItem = items.find((i) => i.value === value);
-  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Popover3.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { style: styles, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("label", { className: inputLabel5 + " ui-input-label", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(Popover3.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Popover3.Root, { children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { style: styles, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("label", { className: inputLabel5 + " ui-input-label", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Popover3.Trigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
       "button",
       {
         disabled,
@@ -6243,8 +6838,8 @@ function Select({
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "truncate", children: (_M = selectedItem == null ? void 0 : selectedItem.label) != null ? _M : placeholder }),
-          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "truncate", children: (_M = selectedItem == null ? void 0 : selectedItem.label) != null ? _M : placeholder }),
+          /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
             import_lucide_react9.ChevronDownIcon,
             {
               className: "\r\n            shrink-0 ui-input-icon\r\n            transition-transform duration-200\r\n            group-data-[state=open]:rotate-90\r\n            "
@@ -6253,7 +6848,7 @@ function Select({
         ]
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
       Popover3.Content,
       {
         align: "start",
@@ -6262,12 +6857,12 @@ function Select({
         style: {
           width: "var(--radix-popover-trigger-width)"
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("ul", { className: "max-h-60 overflow-auto", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("ul", { className: "max-h-60 overflow-auto", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
           "li",
           {
             onClick: () => onValueChange == null ? void 0 : onValueChange(item.value),
             className: "\r\n                flex items-center justify-between\r\n                text-[length:var(--input-font-size)] font-[var(--input-font-weight)]\r\n                h-10 px-3 rounded-[--input-radius] cursor-pointer\r\n                bg-[--input-bg]\r\n                hover:bg-[--input-hover-bg]\r\n                border-[--input-hover-border]\r\n                box-shadow-[0px_2px_4px_-1px_#0000000F,0px_4px_6px_-1px_#0000001A]\r\n              ",
-            children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { children: item.label })
+            children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { children: item.label })
           },
           item.value
         )) })
@@ -6277,7 +6872,7 @@ function Select({
 }
 
 // src/components/base/data-entry/inputs/Textarea.tsx
-var import_jsx_runtime30 = require("react/jsx-runtime");
+var import_jsx_runtime32 = require("react/jsx-runtime");
 var inputBase7 = "ui-input w-full min-h-16 outline-none resize-y";
 var inputLabel6 = "leading-[1.3] tracking-[-0.04em]";
 var inputHelper3 = "leading-[1.3]";
@@ -6370,14 +6965,14 @@ function Textarea(_a2) {
     /* Padding */
     "--input-padding": sizeTokens.padding
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
     "div",
     {
       className: "flex flex-col gap-1.5 w-full",
       style: styles,
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("label", { className: inputLabel6 + " ui-input-label", children: label }),
-        /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("label", { className: inputLabel6 + " ui-input-label", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           "textarea",
           __spreadValues({
             "data-slot": "textarea",
@@ -6389,7 +6984,7 @@ function Textarea(_a2) {
             className: cn(inputVariants5(), className)
           }, props)
         ),
-        helperText && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
+        helperText && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
           "span",
           {
             className: error ? inputHelperError3 + " ui-input-helper-error" : inputHelper3 + " ui-input-helper",
@@ -6404,7 +6999,7 @@ function Textarea(_a2) {
 // src/components/base/data-entry/selection-controls/Checkbox.tsx
 var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
 var import_lucide_react10 = require("lucide-react");
-var import_jsx_runtime31 = require("react/jsx-runtime");
+var import_jsx_runtime33 = require("react/jsx-runtime");
 var checkboxLabel = "leading-[1.3]";
 var checkboxDescription = "leading-[1.3]";
 var checkboxBase = "inline-flex items-center justify-center shrink-0 border rounded-md transition-colors outline-none disabled:cursor-not-allowed";
@@ -6492,7 +7087,7 @@ function Checkbox(_a2) {
     "--checkbox-thumb-color": (_s = (_r = mergedTokens == null ? void 0 : mergedTokens.thumb) == null ? void 0 : _r.color) != null ? _s : "#A3AAB8",
     "--checkbox-thumb-disabled": (_u = (_t = mergedTokens == null ? void 0 : mergedTokens.disabled) == null ? void 0 : _t.thumb) != null ? _u : "#A3AAB8"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
     "label",
     {
       style: styles,
@@ -6501,7 +7096,7 @@ function Checkbox(_a2) {
         disabled && "cursor-not-allowed opacity-60"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
           CheckboxPrimitive.Root,
           __spreadProps(__spreadValues({
             disabled,
@@ -6513,11 +7108,11 @@ function Checkbox(_a2) {
               className
             )
           }, props), {
-            children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
               CheckboxPrimitive.Indicator,
               {
                 className: "\r\n          flex items-center justify-center\r\n          text-[color:var(--checkbox-thumb-color)]\r\n          data-[disabled]:text-[color:var(--checkbox-thumb-disabled)]\r\n           ",
-                children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(import_lucide_react10.Minus, { className: "h-[--checkbox-icon-size]   w-[--checkbox-icon-size] stroke-current" }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+                children: props.checked === "indeterminate" ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react10.Minus, { className: "h-[--checkbox-icon-size]   w-[--checkbox-icon-size] stroke-current" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
                   import_lucide_react10.CheckIcon,
                   {
                     className: "\r\n            h-[--checkbox-icon-size]\r\n            w-[--checkbox-icon-size]\r\n            stroke-current\r\n           "
@@ -6527,15 +7122,15 @@ function Checkbox(_a2) {
             )
           })
         ),
-        (label || description) && /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex flex-col gap-0.5", children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+        (label || description) && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex flex-col gap-0.5", children: [
+          label && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             "span",
             {
               className: checkboxLabel + " text-[color:var(--checkbox-label-color)] text-[length:var(--checkbox-label-font-size)] font-[var(--checkbox-label-font-weight)]",
               children: label
             }
           ),
-          description && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+          description && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
             "span",
             {
               className: checkboxDescription + " text-[color:var(--checkbox-description-color)] text-[length:var(--checkbox-description-font-size)] font-[var(--checkbox-description-font-weight)]",
@@ -6550,7 +7145,7 @@ function Checkbox(_a2) {
 
 // src/components/base/data-entry/selection-controls/Radio.tsx
 var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
-var import_jsx_runtime32 = require("react/jsx-runtime");
+var import_jsx_runtime34 = require("react/jsx-runtime");
 var radioBase = `
   shrink-0
   rounded-full
@@ -6600,7 +7195,7 @@ var radioVariants = cva(radioBase, {
 });
 function RadioGroup2(_a2) {
   var _b = _a2, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
     RadioGroupPrimitive.Root,
     __spreadValues({
       className: cn("grid gap-3", className)
@@ -6655,7 +7250,7 @@ function RadioItem2(_a2) {
     "--radio-label-color": sizeTokens.labelColor,
     "--radio-description-color": sizeTokens.descriptionColor
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
     "label",
     {
       style: styles,
@@ -6664,7 +7259,7 @@ function RadioItem2(_a2) {
         disabled && "cursor-not-allowed opacity-60"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
           RadioGroupPrimitive.Item,
           __spreadProps(__spreadValues({
             value,
@@ -6676,7 +7271,7 @@ function RadioItem2(_a2) {
               "focus-visible:ring-2 focus-visible:ring-[--radio-dot-on] focus-visible:ring-offset-2"
             )
           }, props), {
-            children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
               "span",
               {
                 className: cn(`
@@ -6695,15 +7290,15 @@ function RadioItem2(_a2) {
             ) })
           })
         ),
-        (label || description) && /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: "flex flex-col gap-0.5", children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+        (label || description) && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "flex flex-col gap-0.5", children: [
+          label && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
             "span",
             {
               className: radioLabel + " text-[color:var(--radio-label-color)] text-[length:var(--radio-label-font-size)] font-[var(--radio-label-font-weight)]",
               children: label
             }
           ),
-          description && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
+          description && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
             "span",
             {
               className: radioDescription + " text-[color:var(--radio-description-color)] text-[length:var(--radio-description-font-size)] font-[var(--radio-description-font-weight)]",
@@ -6718,7 +7313,7 @@ function RadioItem2(_a2) {
 
 // src/components/base/data-entry/selection-controls/Switch.tsx
 var SwitchPrimitive = __toESM(require("@radix-ui/react-switch"), 1);
-var import_jsx_runtime33 = require("react/jsx-runtime");
+var import_jsx_runtime35 = require("react/jsx-runtime");
 var switchBase = `
   bg-[--switch-background-color]
   inline-flex items-center rounded-full
@@ -6808,7 +7403,7 @@ var Switch = (_a2) => {
     // MOTION
     "--switch-transition-duration": (_E = (_D = mergedTokens == null ? void 0 : mergedTokens.motion) == null ? void 0 : _D.duration) != null ? _E : "200ms"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
     "label",
     {
       style: styles,
@@ -6817,7 +7412,7 @@ var Switch = (_a2) => {
         disabled && "cursor-not-allowed opacity-60"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
           SwitchPrimitive.Root,
           __spreadProps(__spreadValues({
             disabled,
@@ -6830,7 +7425,7 @@ var Switch = (_a2) => {
               "focus-visible:ring-2 focus-visible:ring-[--switch-active-background] focus-visible:ring-offset-2"
             )
           }, props), {
-            children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
               SwitchPrimitive.Thumb,
               {
                 "data-slot": "switch-thumb",
@@ -6850,15 +7445,15 @@ var Switch = (_a2) => {
             )
           })
         ),
-        (label || description) && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: "flex flex-col gap-0.5", children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+        (label || description) && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "flex flex-col gap-0.5", children: [
+          label && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "span",
             {
               className: labelStyle + " text-[color:var(--switch-label-color)] text-[length:var(--switch-label-font-size)] font-[var(--switch-label-font-weight)]",
               children: label
             }
           ),
-          description && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
+          description && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
             "span",
             {
               className: descriptionStyle + " text-[color:var(--switch-description-color)] text-[length:var(--switch-description-font-size)] font-[var(--switch-description-font-weight)]",
@@ -6874,7 +7469,7 @@ var Switch = (_a2) => {
 // src/components/base/navegation/Breadcrumb.tsx
 var import_react_slot7 = require("@radix-ui/react-slot");
 var import_lucide_react11 = require("lucide-react");
-var import_jsx_runtime34 = require("react/jsx-runtime");
+var import_jsx_runtime36 = require("react/jsx-runtime");
 var breadcrumbListVariants = cva(
   "flex flex-wrap items-center transition-colors",
   {
@@ -6920,7 +7515,7 @@ function Breadcrumb(_a2) {
     "--bc-sep-color": (_u = (_t = mergedTokens == null ? void 0 : mergedTokens.separator) == null ? void 0 : _t.color) != null ? _u : "#94a3b8",
     "--bc-sep-size": (_w = (_v = mergedTokens == null ? void 0 : mergedTokens.separator) == null ? void 0 : _v.size) != null ? _w : "14px"
   }, style);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "nav",
     __spreadValues({
       "aria-label": "breadcrumb",
@@ -6936,7 +7531,7 @@ function BreadcrumbList(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "ol",
     __spreadValues({
       "data-slot": "breadcrumb-list",
@@ -6946,7 +7541,7 @@ function BreadcrumbList(_a2) {
 }
 function BreadcrumbItem(_a2) {
   var _b = _a2, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "li",
     __spreadValues({
       "data-slot": "breadcrumb-item",
@@ -6963,7 +7558,7 @@ function BreadcrumbLink(_a2) {
     "className"
   ]);
   const Comp = asChild ? import_react_slot7.Slot : "a";
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     Comp,
     __spreadValues({
       "data-slot": "breadcrumb-link",
@@ -6979,7 +7574,7 @@ function BreadcrumbLink(_a2) {
 }
 function BreadcrumbPage(_a2) {
   var _b = _a2, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "span",
     __spreadValues({
       "data-slot": "breadcrumb-page",
@@ -7002,7 +7597,7 @@ function BreadcrumbSeparator(_a2) {
     "children",
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
     "li",
     __spreadProps(__spreadValues({
       "data-slot": "breadcrumb-separator",
@@ -7014,7 +7609,7 @@ function BreadcrumbSeparator(_a2) {
         className
       )
     }, props), {
-      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react11.ChevronRight, {})
+      children: children != null ? children : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react11.ChevronRight, {})
     })
   );
 }
@@ -7024,7 +7619,7 @@ function BreadcrumbEllipsis(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
     "span",
     __spreadProps(__spreadValues({
       "data-slot": "breadcrumb-ellipsis",
@@ -7033,18 +7628,18 @@ function BreadcrumbEllipsis(_a2) {
       className: cn("flex items-center justify-center", className)
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react11.MoreHorizontal, { className: "size-[var(--bc-sep-size)] text-[var(--bc-sep-color)]" }),
-        /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "sr-only", children: "More" })
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react11.MoreHorizontal, { className: "size-[var(--bc-sep-size)] text-[var(--bc-sep-color)]" }),
+        /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "sr-only", children: "More" })
       ]
     })
   );
 }
 
 // src/components/base/navegation/Drawer.tsx
-var React13 = __toESM(require("react"), 1);
+var React15 = __toESM(require("react"), 1);
 var import_vaul = require("vaul");
-var import_jsx_runtime35 = require("react/jsx-runtime");
-var DrawerStylesContext = React13.createContext(null);
+var import_jsx_runtime37 = require("react/jsx-runtime");
+var DrawerStylesContext = React15.createContext(null);
 var shadowClassName = "0px 2px 4px 0px #1212170A, 0px 5px 8px 0px #1212170A, 0px 10px 18px 0px #12121708, 0px 24px 48px 0px #12121708, 0px 0px 0px 1px #1212171A";
 function Drawer(_a2) {
   var _b = _a2, { tokens } = _b, props = __objRest(_b, ["tokens"]);
@@ -7053,7 +7648,7 @@ function Drawer(_a2) {
     { componentName: "drawer", tokens },
     theme
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(DrawerStylesContext.Provider, { value: mergedTokens, children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(import_vaul.Drawer.Root, __spreadValues({ "data-slot": "drawer" }, props)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DrawerStylesContext.Provider, { value: mergedTokens, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_vaul.Drawer.Root, __spreadValues({ "data-slot": "drawer" }, props)) });
 }
 var DrawerTrigger = import_vaul.Drawer.Trigger;
 var DrawerPortal = import_vaul.Drawer.Portal;
@@ -7065,13 +7660,13 @@ function DrawerOverlay(_a2) {
     "className"
   ]);
   var _a3, _b2, _c, _d, _e, _f;
-  const mergedTokens = React13.useContext(DrawerStylesContext);
+  const mergedTokens = React15.useContext(DrawerStylesContext);
   const styles = {
     "--drawer-overlay-bg": (_b2 = (_a3 = mergedTokens == null ? void 0 : mergedTokens.overlay) == null ? void 0 : _a3.background) != null ? _b2 : "#000",
     "--drawer-overlay-opacity": (_d = (_c = mergedTokens == null ? void 0 : mergedTokens.overlay) == null ? void 0 : _c.opacity) != null ? _d : "0.4",
     "--drawer-overlay-blur": (_f = (_e = mergedTokens == null ? void 0 : mergedTokens.overlay) == null ? void 0 : _e.backdropBlur) != null ? _f : "0px"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     import_vaul.Drawer.Overlay,
     __spreadValues({
       "data-slot": "drawer-overlay",
@@ -7100,7 +7695,7 @@ function DrawerContent(_a2) {
     "children"
   ]);
   var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l;
-  const mergedTokens = React13.useContext(DrawerStylesContext);
+  const mergedTokens = React15.useContext(DrawerStylesContext);
   const styles = {
     "--drawer-bg": (_b2 = (_a3 = mergedTokens == null ? void 0 : mergedTokens.content) == null ? void 0 : _a3.background) != null ? _b2 : "#fff",
     "--drawer-color": (_d = (_c = mergedTokens == null ? void 0 : mergedTokens.content) == null ? void 0 : _c.color) != null ? _d : "#0F172A",
@@ -7109,9 +7704,9 @@ function DrawerContent(_a2) {
     "--drawer-shadow": (_j = (_i = mergedTokens == null ? void 0 : mergedTokens.content) == null ? void 0 : _i.shadow) != null ? _j : shadowClassName,
     "--drawer-max-height": (_l = (_k = mergedTokens == null ? void 0 : mergedTokens.content) == null ? void 0 : _k.maxHeight) != null ? _l : "100vh"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(DrawerPortal, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(DrawerOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(DrawerPortal, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DrawerOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
       import_vaul.Drawer.Content,
       __spreadProps(__spreadValues({
         "data-slot": "drawer-content",
@@ -7152,7 +7747,7 @@ function DrawerContent(_a2) {
 }
 var DrawerHeader = (_a2) => {
   var _b = _a2, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "div",
     __spreadValues({
       className: cn("flex flex-col gap-1  px-6 pt-12", className)
@@ -7161,7 +7756,7 @@ var DrawerHeader = (_a2) => {
 };
 var DrawerBody = (_a2) => {
   var _b = _a2, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "div",
     __spreadValues({
       className: cn("flex flex-col flex-1 overflow-y-auto px-6 py-4", className)
@@ -7170,7 +7765,7 @@ var DrawerBody = (_a2) => {
 };
 var DrawerFooter = (_a2) => {
   var _b = _a2, { className } = _b, props = __objRest(_b, ["className"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     "div",
     __spreadValues({
       className: cn(
@@ -7187,7 +7782,7 @@ function DrawerCloseButton(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     import_vaul.Drawer.Close,
     __spreadProps(__spreadValues({
       "aria-label": "Cerrar",
@@ -7207,13 +7802,13 @@ function DrawerTitle(_a2) {
     "className"
   ]);
   var _a3, _b2, _c, _d, _e, _f;
-  const mergedTokens = React13.useContext(DrawerStylesContext);
+  const mergedTokens = React15.useContext(DrawerStylesContext);
   const style = {
     "--drawer-title-color": (_b2 = (_a3 = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _a3.color) != null ? _b2 : "#0F172A",
     "--drawer-title-size": (_d = (_c = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _c.fontSize) != null ? _d : "24px",
     "--drawer-title-weight": (_f = (_e = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _e.fontWeight) != null ? _f : "600"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     import_vaul.Drawer.Title,
     __spreadValues({
       style,
@@ -7231,12 +7826,12 @@ function DrawerDescription(_a2) {
     "className"
   ]);
   var _a3, _b2, _c, _d;
-  const mergedTokens = React13.useContext(DrawerStylesContext);
+  const mergedTokens = React15.useContext(DrawerStylesContext);
   const styles = {
     "--drawer-desc-color": (_b2 = (_a3 = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _a3.color) != null ? _b2 : "#6E7991",
     "--drawer-desc-size": (_d = (_c = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _c.fontSize) != null ? _d : "14px"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
     import_vaul.Drawer.Description,
     __spreadValues({
       style: styles,
@@ -7249,13 +7844,13 @@ function DrawerDescription(_a2) {
 }
 
 // src/components/base/navegation/ModalDialog.tsx
-var React14 = __toESM(require("react"), 1);
+var React16 = __toESM(require("react"), 1);
 var AlertDialogPrimitive = __toESM(require("@radix-ui/react-alert-dialog"), 1);
-var import_jsx_runtime36 = require("react/jsx-runtime");
-var AlertDialogStylesContext = React14.createContext(null);
-var AlertDialogLayoutContext = React14.createContext("left");
+var import_jsx_runtime38 = require("react/jsx-runtime");
+var AlertDialogStylesContext = React16.createContext(null);
+var AlertDialogLayoutContext = React16.createContext("left");
 function useAlertDialogLayout() {
-  return React14.useContext(AlertDialogLayoutContext);
+  return React16.useContext(AlertDialogLayoutContext);
 }
 var alignmentVariants = {
   left: {
@@ -7294,12 +7889,12 @@ function AlertDialog(_a2) {
     "--alert-description-font-size": (_s = (_r = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _r.fontSize) != null ? _s : "16px",
     "--alert-description-font-weight": (_u = (_t = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _t.fontWeight) != null ? _u : 400
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogStylesContext.Provider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogPrimitive.Root, __spreadValues({ "data-slot": "alert-dialog" }, props)) });
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogStylesContext.Provider, { value: styles, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogPrimitive.Root, __spreadValues({ "data-slot": "alert-dialog" }, props)) });
 }
 var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
 var AlertDialogPortal = AlertDialogPrimitive.Portal;
 function AlertDialogOverlay(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     AlertDialogPrimitive.Overlay,
     __spreadValues({
       "data-slot": "alert-dialog-overlay",
@@ -7319,11 +7914,11 @@ function AlertDialogContent(_a2) {
     "className",
     "alignment"
   ]);
-  const styles = React14.useContext(AlertDialogStylesContext);
+  const styles = React16.useContext(AlertDialogStylesContext);
   const align = alignmentVariants[alignment];
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogLayoutContext.Provider, { value: alignment, children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { style: styles != null ? styles : void 0, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogOverlay, {}),
-    /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogLayoutContext.Provider, { value: alignment, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { style: styles != null ? styles : void 0, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogOverlay, {}),
+    /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
       AlertDialogPrimitive.Content,
       __spreadValues({
         "data-slot": "alert-dialog-content",
@@ -7347,7 +7942,7 @@ function AlertDialogHeader(_a2) {
     "className"
   ]);
   const alignment = useAlertDialogLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "div",
     __spreadValues({
       "data-slot": "alert-dialog-header",
@@ -7367,7 +7962,7 @@ function AlertDialogFooter(_a2) {
     "className"
   ]);
   const alignment = useAlertDialogLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     "div",
     __spreadValues({
       "data-slot": "alert-dialog-footer",
@@ -7382,7 +7977,7 @@ function AlertDialogFooter(_a2) {
 }
 function AlertDialogTitle(props) {
   const alignment = useAlertDialogLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     AlertDialogPrimitive.Title,
     __spreadValues({
       "data-slot": "alert-dialog-title",
@@ -7396,7 +7991,7 @@ function AlertDialogTitle(props) {
 }
 function AlertDialogDescription(props) {
   const alignment = useAlertDialogLayout();
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
     AlertDialogPrimitive.Description,
     __spreadValues({
       "data-slot": "alert-dialog-description",
@@ -7414,7 +8009,7 @@ function AlertDialogAction(_a2) {
   } = _b, props = __objRest(_b, [
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogPrimitive.Action, __spreadProps(__spreadValues({ asChild: true }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Button, { variant: "primary", children }) }));
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogPrimitive.Action, __spreadProps(__spreadValues({ asChild: true }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { variant: "primary", children }) }));
 }
 function AlertDialogCancel(_a2) {
   var _b = _a2, {
@@ -7422,14 +8017,14 @@ function AlertDialogCancel(_a2) {
   } = _b, props = __objRest(_b, [
     "children"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(AlertDialogPrimitive.Cancel, __spreadProps(__spreadValues({ asChild: true }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Button, { variant: "secondary", children }) }));
+  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(AlertDialogPrimitive.Cancel, __spreadProps(__spreadValues({ asChild: true }, props), { children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { variant: "secondary", children }) }));
 }
 
 // src/components/base/navegation/Navbar.tsx
-var React15 = __toESM(require("react"), 1);
+var React17 = __toESM(require("react"), 1);
 var import_lucide_react12 = require("lucide-react");
-var import_jsx_runtime37 = require("react/jsx-runtime");
-var NavbarContext = React15.createContext(null);
+var import_jsx_runtime39 = require("react/jsx-runtime");
+var NavbarContext = React17.createContext(null);
 var Navbar = (({ children }) => {
   var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p;
   const theme = useTheme();
@@ -7447,7 +8042,7 @@ var Navbar = (({ children }) => {
     /* Motion */
     "--nb-motion": (_p = (_o = mergedTokens == null ? void 0 : mergedTokens.motion) == null ? void 0 : _o.duration) != null ? _p : "150ms"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(NavbarContext.Provider, { value: mergedTokens, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(NavbarContext.Provider, { value: mergedTokens, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
     "header",
     {
       style: styles,
@@ -7458,18 +8053,18 @@ var Navbar = (({ children }) => {
         "rounded-[var(--nb-radius)]",
         "transition-colors duration-[var(--nb-motion)]"
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "mx-auto h-full flex items-center justify-between px-6", children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "mx-auto h-full flex items-center justify-between px-6", children })
     }
   ) });
 });
-Navbar.Start = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center gap-6", children });
-Navbar.End = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center gap-4", children });
-Navbar.Slot = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center", children });
+Navbar.Start = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center gap-6", children });
+Navbar.End = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center gap-4", children });
+Navbar.Slot = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center", children });
 Navbar.Logo = NavbarLogo;
 Navbar.Merchant = NavbarMerchant;
 Navbar.User = NavbarUserMenu;
 function NavbarLogo() {
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Avatar, { children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(AvatarFallback, { children: "EM" }) }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Avatar, { children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AvatarFallback, { children: "EM" }) }) });
 }
 function NavbarMerchant({
   merchants = [],
@@ -7477,7 +8072,7 @@ function NavbarMerchant({
   onChange
 }) {
   var _a2, _b, _c, _d, _e, _f, _g, _h, _i;
-  const tokens = (_a2 = React15.useContext(NavbarContext)) != null ? _a2 : {};
+  const tokens = (_a2 = React17.useContext(NavbarContext)) != null ? _a2 : {};
   const styles = {
     /* Merchant */
     "--nb-merchant-color": (_c = (_b = tokens == null ? void 0 : tokens.merchant) == null ? void 0 : _b.color) != null ? _c : "#111827",
@@ -7488,19 +8083,19 @@ function NavbarMerchant({
   if (!merchants.length) return null;
   const current = merchants.find((m) => m.id === currentId);
   if (merchants.length === 1) {
-    return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { children: current == null ? void 0 : current.name });
+    return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { children: current == null ? void 0 : current.name });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(DropdownMenuTrigger, { className: "flex items-center gap-2 outline-none text-[color:var(--nb-merchant-color)] text-[length:var(--nb-merchant-font-size)] font-[var(--nb-merchant-font-weight)]", children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(DropdownMenuTrigger, { className: "flex items-center gap-2 outline-none text-[color:var(--nb-merchant-color)] text-[length:var(--nb-merchant-font-size)] font-[var(--nb-merchant-font-weight)]", children: [
       current == null ? void 0 : current.name,
-      /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react12.ChevronsUpDown, { className: "h-4 w-4 text-[color:var(--nb-icon-color)]" })
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react12.ChevronsUpDown, { className: "h-4 w-4 text-[color:var(--nb-icon-color)]" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DropdownMenuContent, { align: "start", children: merchants.map((m) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DropdownMenuItem, { onClick: () => onChange == null ? void 0 : onChange(m.id), children: m.name }, m.id)) })
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DropdownMenuContent, { align: "start", children: merchants.map((m) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DropdownMenuItem, { onClick: () => onChange == null ? void 0 : onChange(m.id), children: m.name }, m.id)) })
   ] }) });
 }
 function NavbarUserMenu({ user }) {
   var _a2, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o;
-  const tokens = (_a2 = React15.useContext(NavbarContext)) != null ? _a2 : {};
+  const tokens = (_a2 = React17.useContext(NavbarContext)) != null ? _a2 : {};
   const styles = {
     /* User */
     "--nb-user-name": (_c = (_b = tokens == null ? void 0 : tokens.user) == null ? void 0 : _b.nameColor) != null ? _c : "#111827",
@@ -7511,18 +8106,18 @@ function NavbarUserMenu({ user }) {
     "--nb-user-role-font-weight": (_m = (_l = tokens == null ? void 0 : tokens.user) == null ? void 0 : _l.roleFontWeight) != null ? _m : 400,
     "--nb-icon-color": (_o = (_n = tokens == null ? void 0 : tokens.container) == null ? void 0 : _n.iconColor) != null ? _o : "#9DA5B5"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(DropdownMenu, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(DropdownMenu, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
       DropdownMenuTrigger,
       {
         className: "\r\n          flex items-start gap-3\r\n          px-3 py-2\r\n          rounded-xl\r\n          outline-none\r\n          transition-colors\r\n          hover:bg-[var(--nb-trigger-hover)]\r\n          focus-visible:ring-2 focus-visible:ring-[var(--nb-focus)]\r\n          ",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Avatar, { size: "md", children: user.avatarUrl ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(AvatarImage, { src: user.avatarUrl }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(AvatarFallback, { children: user.name[0] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "flex flex-col text-left", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "text-[color:var(--nb-user-name)] text-[length:var(--nb-user-name-font-size)] font-[var(--nb-user-name-font-weight)] leading-none", children: user.name }),
-            user.role && /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "mt-0.5 text-[length:var(--nb-user-role-font-size)] leading-none text-[color:var(--nb-user-role)] font-[var(--nb-user-role-font-weight)]", children: user.role })
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(Avatar, { size: "md", children: user.avatarUrl ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AvatarImage, { src: user.avatarUrl }) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(AvatarFallback, { children: user.name[0] }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "flex flex-col text-left", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "text-[color:var(--nb-user-name)] text-[length:var(--nb-user-name-font-size)] font-[var(--nb-user-name-font-weight)] leading-none", children: user.name }),
+            user.role && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "mt-0.5 text-[length:var(--nb-user-role-font-size)] leading-none text-[color:var(--nb-user-role)] font-[var(--nb-user-role-font-weight)]", children: user.role })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
             import_lucide_react12.ChevronDown,
             {
               className: "\r\n                    ml-1\r\n                    h-4 w-4\r\n                    text-[color:var(--nb-icon-color)]\r\n                    translate-y-[0px]\r\n                     "
@@ -7531,13 +8126,13 @@ function NavbarUserMenu({ user }) {
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DropdownMenuContent, { align: "end", children: user.menu.map((item) => /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(DropdownMenuItem, { onClick: item.onClick, children: item.label }, item.id)) })
+    /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DropdownMenuContent, { align: "end", children: user.menu.map((item) => /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(DropdownMenuItem, { onClick: item.onClick, children: item.label }, item.id)) })
   ] }) });
 }
 
 // src/components/base/navegation/Pagination.tsx
 var import_lucide_react13 = require("lucide-react");
-var import_jsx_runtime38 = require("react/jsx-runtime");
+var import_jsx_runtime40 = require("react/jsx-runtime");
 function Pagination(_a2) {
   var _b = _a2, {
     className,
@@ -7582,7 +8177,7 @@ function Pagination(_a2) {
     "--pg-disabled-text": (_R = (_Q = (_P = mergedTokens == null ? void 0 : mergedTokens.item) == null ? void 0 : _P.disabled) == null ? void 0 : _Q.text) != null ? _R : "#9CA3AF",
     "--pg-disabled-opacity": (_U = (_T = (_S = mergedTokens == null ? void 0 : mergedTokens.item) == null ? void 0 : _S.disabled) == null ? void 0 : _T.opacity) != null ? _U : "0.5"
   }, style);
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     "nav",
     __spreadValues({
       role: "navigation",
@@ -7606,7 +8201,7 @@ function PaginationLink(_a2) {
     "isActive",
     "disabled"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     "a",
     __spreadValues({
       "data-slot": "pagination-link",
@@ -7637,7 +8232,7 @@ function PaginationContent(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     "ul",
     __spreadValues({
       "data-slot": "pagination-content",
@@ -7646,7 +8241,7 @@ function PaginationContent(_a2) {
   );
 }
 function PaginationItem(props) {
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("li", __spreadValues({ "data-slot": "pagination-item" }, props));
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("li", __spreadValues({ "data-slot": "pagination-item" }, props));
 }
 function PaginationPrevious(_a2) {
   var _b = _a2, {
@@ -7654,13 +8249,13 @@ function PaginationPrevious(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     PaginationLink,
     __spreadProps(__spreadValues({
       "aria-label": "Go to previous page",
       className: cn("gap-1 px-2.5", className)
     }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react13.ChevronLeftIcon, { style: { width: "var(--pg-icon-size)", height: "var(--pg-icon-size)" } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react13.ChevronLeftIcon, { style: { width: "var(--pg-icon-size)", height: "var(--pg-icon-size)" } })
     })
   );
 }
@@ -7670,13 +8265,13 @@ function PaginationNext(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
     PaginationLink,
     __spreadProps(__spreadValues({
       "aria-label": "Go to next page",
       className: cn("gap-1 px-2.5", className)
     }, props), {
-      children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react13.ChevronRightIcon, { style: { width: "var(--pg-icon-size)", height: "var(--pg-icon-size)" } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react13.ChevronRightIcon, { style: { width: "var(--pg-icon-size)", height: "var(--pg-icon-size)" } })
     })
   );
 }
@@ -7686,7 +8281,7 @@ function PaginationEllipsis(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
     "span",
     __spreadProps(__spreadValues({
       "data-slot": "pagination-ellipsis",
@@ -7696,8 +8291,8 @@ function PaginationEllipsis(_a2) {
       )
     }, props), {
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react13.MoreHorizontalIcon, { style: { width: "var(--pg-icon-size)", height: "var(--pg-icon-size)" } }),
-        /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "sr-only", children: "More pages" })
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react13.MoreHorizontalIcon, { style: { width: "var(--pg-icon-size)", height: "var(--pg-icon-size)" } }),
+        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "sr-only", children: "More pages" })
       ]
     })
   );
@@ -7705,7 +8300,7 @@ function PaginationEllipsis(_a2) {
 
 // src/components/base/navegation/Tabs.tsx
 var TabsPrimitive = __toESM(require("@radix-ui/react-tabs"), 1);
-var import_jsx_runtime39 = require("react/jsx-runtime");
+var import_jsx_runtime41 = require("react/jsx-runtime");
 function Tabs(_a2) {
   var _b = _a2, {
     className,
@@ -7752,7 +8347,7 @@ function Tabs(_a2) {
     "--tabs-list-border-radius": (_N = (_M = mergedTokens == null ? void 0 : mergedTokens.tabsList) == null ? void 0 : _M.radius) != null ? _N : "6px",
     "--tabs-trigger-border-radius": (_P = (_O = mergedTokens == null ? void 0 : mergedTokens.tabsList) == null ? void 0 : _O.radius) != null ? _P : "6px"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     TabsPrimitive.Root,
     __spreadValues({
       "data-slot": "tabs",
@@ -7768,7 +8363,7 @@ function TabsList(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     TabsPrimitive.List,
     __spreadValues({
       "data-slot": "tabs-list",
@@ -7796,7 +8391,7 @@ function TabsTrigger(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     TabsPrimitive.Trigger,
     __spreadValues({
       "data-slot": "tabs-trigger",
@@ -7844,7 +8439,7 @@ function TabsContent(_a2) {
   } = _b, props = __objRest(_b, [
     "className"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
     TabsPrimitive.Content,
     __spreadValues({
       "data-slot": "tabs-content",
@@ -7854,8 +8449,8 @@ function TabsContent(_a2) {
 }
 
 // src/components/base/navegation/Sidebar.tsx
-var import_jsx_runtime40 = require("react/jsx-runtime");
-var CollapseIconExpanded = () => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+var import_jsx_runtime42 = require("react/jsx-runtime");
+var CollapseIconExpanded = () => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
   "svg",
   {
     width: "20",
@@ -7864,25 +8459,25 @@ var CollapseIconExpanded = () => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
         "path",
         {
           d: "M12.2664 7.6831C12.5105 7.43903 12.9061 7.43903 13.1502 7.6831C13.3943 7.92718 13.3943 8.32282 13.1502 8.56689L11.7171 10L13.1502 11.4331C13.3943 11.6772 13.3943 12.0728 13.1502 12.3169C12.9061 12.561 12.5105 12.561 12.2664 12.3169L10.3914 10.4419C10.1474 10.1978 10.1474 9.80218 10.3914 9.55811L12.2664 7.6831Z",
           fill: "currentColor"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
         "path",
         {
           d: "M16.25 4.79167C16.25 4.21637 15.7836 3.75 15.2083 3.75H4.79167C4.21637 3.75 3.75 4.21637 3.75 4.79167V15.2083C3.75 15.7836 4.21637 16.25 4.79167 16.25H15.2083C15.7836 16.25 16.25 15.7836 16.25 15.2083V4.79167ZM17.5 15.2083C17.5 16.474 16.474 17.5 15.2083 17.5H4.79167C3.52601 17.5 2.5 16.474 2.5 15.2083V4.79167C2.5 3.52601 3.52601 2.5 4.79167 2.5H15.2083C16.474 2.5 17.5 3.52601 17.5 4.79167V15.2083Z",
           fill: "currentColor"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { d: "M7.5 3.125V16.875H6.25V3.125H7.5Z", fill: "currentColor" })
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("path", { d: "M7.5 3.125V16.875H6.25V3.125H7.5Z", fill: "currentColor" })
     ]
   }
 );
-var CollapseIconCollapsed = () => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+var CollapseIconCollapsed = () => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
   "svg",
   {
     width: "20",
@@ -7891,21 +8486,21 @@ var CollapseIconCollapsed = () => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)
     fill: "none",
     xmlns: "http://www.w3.org/2000/svg",
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
         "path",
         {
           d: "M11.4583 7.73217C11.2143 7.48809 10.8186 7.48809 10.5745 7.73217C10.3305 7.97625 10.3305 8.37188 10.5745 8.61596L12.0076 10.0491L10.5745 11.4822C10.3305 11.7262 10.3305 12.1219 10.5745 12.366C10.8186 12.61 11.2143 12.61 11.4583 12.366L13.3333 10.491C13.5774 10.2469 13.5774 9.85125 13.3333 9.60717L11.4583 7.73217Z",
           fill: "currentColor"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
         "path",
         {
           d: "M16.25 4.79167C16.25 4.21637 15.7836 3.75 15.2083 3.75H4.79167C4.21637 3.75 3.75 4.21637 3.75 4.79167V15.2083C3.75 15.7836 4.21637 16.25 4.79167 16.25H15.2083C15.7836 16.25 16.25 15.7836 16.25 15.2083V4.79167ZM17.5 15.2083C17.5 16.474 16.474 17.5 15.2083 17.5H4.79167C3.52601 17.5 2.5 16.474 2.5 15.2083V4.79167C2.5 3.52601 3.52601 2.5 4.79167 2.5H15.2083C16.474 2.5 17.5 3.52601 17.5 4.79167V15.2083Z",
           fill: "currentColor"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { d: "M7.5 3.125V16.875H6.25V3.125H7.5Z", fill: "currentColor" })
+      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("path", { d: "M7.5 3.125V16.875H6.25V3.125H7.5Z", fill: "currentColor" })
     ]
   }
 );
@@ -7959,7 +8554,7 @@ function Sidebar({
     "--sb-motion": (_ca = (_ba = mergedTokens == null ? void 0 : mergedTokens.motion) == null ? void 0 : _ba.duration) != null ? _ca : "250ms"
   };
   const resolvedSections = sections != null ? sections : items ? [{ id: "default", items }] : [];
-  return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
     "aside",
     {
       style: styles,
@@ -7971,13 +8566,13 @@ function Sidebar({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
           "div",
           {
             className: "flex items-center justify-between px-4 py-3",
             style: { minHeight: "var(--sb-header-h)" },
             children: [
-              !collapsed && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+              !collapsed && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                 "span",
                 {
                   className: "truncate",
@@ -7989,7 +8584,7 @@ function Sidebar({
                   children: title
                 }
               ),
-              onToggleCollapse && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+              onToggleCollapse && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                 "button",
                 {
                   type: "button",
@@ -8000,13 +8595,13 @@ function Sidebar({
                     collapsed && "mx-auto"
                   ),
                   "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar",
-                  children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(CollapseIconCollapsed, {}) : /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(CollapseIconExpanded, {})
+                  children: collapsed ? /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CollapseIconCollapsed, {}) : /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CollapseIconExpanded, {})
                 }
               )
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
           "nav",
           {
             className: "flex flex-col overflow-y-auto overflow-x-hidden",
@@ -8015,8 +8610,8 @@ function Sidebar({
               paddingLeft: "var(--sb-padding)",
               paddingRight: "var(--sb-padding)"
             },
-            children: resolvedSections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex flex-col gap-1", children: [
-              !collapsed && section.title && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
+            children: resolvedSections.map((section) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)("div", { className: "flex flex-col gap-1", children: [
+              !collapsed && section.title && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
                 "span",
                 {
                   className: "px-2 mb-1 font-bold uppercase tracking-wider",
@@ -8029,7 +8624,7 @@ function Sidebar({
               ),
               section.items.map((item) => {
                 const isActive = item.active;
-                return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
+                return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
                   "div",
                   {
                     onClick: () => item.href && (onItemClick == null ? void 0 : onItemClick(item.href)),
@@ -8042,8 +8637,8 @@ function Sidebar({
                       isActive ? "bg-[var(--sb-item-active-bg)] text-[var(--sb-item-active-color)]" : "text-[var(--sb-item-color)] hover:bg-[var(--sb-item-hover-bg)] hover:text-[var(--sb-item-hover-color)]"
                     ),
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: item.icon }),
-                      !collapsed && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "truncate", children: item.label })
+                      /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "flex h-5 w-5 shrink-0 items-center justify-center", children: item.icon }),
+                      !collapsed && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "truncate", children: item.label })
                     ]
                   },
                   item.id
@@ -8057,10 +8652,182 @@ function Sidebar({
   );
 }
 
+// src/components/base/navegation/Tour.tsx
+var import_jsx_runtime43 = require("react/jsx-runtime");
+function Tour(_a2) {
+  var _b = _a2, {
+    className,
+    currentStep,
+    totalSteps,
+    title,
+    description,
+    onBack,
+    onNext,
+    backLabel = "Atras",
+    nextLabel = "Siguiente",
+    disableBack = false,
+    disableNext = false,
+    showPointer = true,
+    tokens,
+    style
+  } = _b, props = __objRest(_b, [
+    "className",
+    "currentStep",
+    "totalSteps",
+    "title",
+    "description",
+    "onBack",
+    "onNext",
+    "backLabel",
+    "nextLabel",
+    "disableBack",
+    "disableNext",
+    "showPointer",
+    "tokens",
+    "style"
+  ]);
+  var _a3, _b2, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G, _H, _I, _J, _K, _L, _M, _N, _O, _P, _Q, _R, _S, _T, _U, _V, _W, _X, _Y;
+  const theme = useTheme();
+  const mergedTokens = (_a3 = resolveTokens({ componentName: "tour", tokens }, theme)) != null ? _a3 : {};
+  const safeCurrentStep = Math.min(Math.max(currentStep, 1), Math.max(totalSteps, 1));
+  const safeTotalSteps = Math.max(totalSteps, 1);
+  const styles = __spreadValues({
+    "--tour-bg": (_b2 = mergedTokens == null ? void 0 : mergedTokens.backgroundColor) != null ? _b2 : "#FFFFFF",
+    "--tour-border": (_c = mergedTokens == null ? void 0 : mergedTokens.borderColor) != null ? _c : "#E2E5E9",
+    "--tour-radius": (_d = mergedTokens == null ? void 0 : mergedTokens.borderRadius) != null ? _d : "12px",
+    "--tour-padding": (_e = mergedTokens == null ? void 0 : mergedTokens.padding) != null ? _e : "16px",
+    "--tour-shadow": (_f = mergedTokens == null ? void 0 : mergedTokens.shadow) != null ? _f : "0px 4px 12px rgba(18, 18, 23, 0.08)",
+    "--tour-gap": (_g = mergedTokens == null ? void 0 : mergedTokens.gap) != null ? _g : "12px",
+    "--tour-step-color": (_i = (_h = mergedTokens == null ? void 0 : mergedTokens.step) == null ? void 0 : _h.color) != null ? _i : "#6E7991",
+    "--tour-step-size": (_k = (_j = mergedTokens == null ? void 0 : mergedTokens.step) == null ? void 0 : _j.fontSize) != null ? _k : "14px",
+    "--tour-step-weight": (_m = (_l = mergedTokens == null ? void 0 : mergedTokens.step) == null ? void 0 : _l.fontWeight) != null ? _m : 550,
+    "--tour-step-line-height": (_o = (_n = mergedTokens == null ? void 0 : mergedTokens.step) == null ? void 0 : _n.lineHeight) != null ? _o : "130%",
+    "--tour-step-letter-spacing": (_q = (_p = mergedTokens == null ? void 0 : mergedTokens.step) == null ? void 0 : _p.letterSpacing) != null ? _q : "-0.04em",
+    "--tour-title-color": (_s = (_r = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _r.color) != null ? _s : "#020303",
+    "--tour-title-size": (_u = (_t = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _t.fontSize) != null ? _u : "16px",
+    "--tour-title-weight": (_w = (_v = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _v.fontWeight) != null ? _w : 550,
+    "--tour-title-line-height": (_y = (_x = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _x.lineHeight) != null ? _y : "130%",
+    "--tour-title-letter-spacing": (_A = (_z = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _z.letterSpacing) != null ? _A : "-0.04em",
+    "--tour-description-color": (_C = (_B = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _B.color) != null ? _C : "#6E7991",
+    "--tour-description-size": (_E = (_D = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _D.fontSize) != null ? _E : "14px",
+    "--tour-description-weight": (_G = (_F = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _F.fontWeight) != null ? _G : 400,
+    "--tour-description-line-height": (_I = (_H = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _H.lineHeight) != null ? _I : "130%",
+    "--tour-description-letter-spacing": (_K = (_J = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _J.letterSpacing) != null ? _K : "-0.04em",
+    "--tour-actions-gap": (_M = (_L = mergedTokens == null ? void 0 : mergedTokens.actions) == null ? void 0 : _L.gap) != null ? _M : "8px",
+    "--tour-arrow-size": (_O = (_N = mergedTokens == null ? void 0 : mergedTokens.arrow) == null ? void 0 : _N.size) != null ? _O : "12px",
+    "--tour-arrow-bg": (_Q = (_P = mergedTokens == null ? void 0 : mergedTokens.arrow) == null ? void 0 : _P.background) != null ? _Q : "#FFFFFF",
+    "--tour-arrow-border": (_S = (_R = mergedTokens == null ? void 0 : mergedTokens.arrow) == null ? void 0 : _R.borderColor) != null ? _S : "#E2E5E9"
+  }, style);
+  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "inline-block", style: styles, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+    "div",
+    __spreadProps(__spreadValues({
+      "data-slot": "tour",
+      className: cn(
+        "relative w-full min-w-[280px] max-w-[360px] border rounded-[var(--tour-radius)] bg-[var(--tour-bg)] border-[var(--tour-border)] p-[var(--tour-padding)] shadow-[var(--tour-shadow)]",
+        className
+      )
+    }, props), {
+      children: [
+        showPointer && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+          "svg",
+          {
+            "aria-hidden": true,
+            width: "15",
+            height: "7",
+            viewBox: "0 0 15 7",
+            fill: "none",
+            xmlns: "http://www.w3.org/2000/svg",
+            className: "absolute left-1/2 top-[-6px] z-10 -translate-x-1/2",
+            children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+              "path",
+              {
+                d: "M5.65683 0.585783C6.43788 -0.195265 7.70421 -0.195265 8.48526 0.585783L14.1421 6.24264H7.07104H-2.2769e-05L5.65683 0.585783Z",
+                fill: "var(--tour-arrow-bg)"
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex flex-col", style: { gap: "var(--tour-gap)" }, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
+            "p",
+            {
+              className: "m-0",
+              style: {
+                color: "var(--tour-step-color)",
+                fontSize: "var(--tour-step-size)",
+                fontWeight: Number((_U = (_T = mergedTokens == null ? void 0 : mergedTokens.step) == null ? void 0 : _T.fontWeight) != null ? _U : 550),
+                lineHeight: "var(--tour-step-line-height)",
+                letterSpacing: "var(--tour-step-letter-spacing)"
+              },
+              children: [
+                safeCurrentStep,
+                "/",
+                safeTotalSteps
+              ]
+            }
+          ),
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "space-y-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+              "h3",
+              {
+                className: "m-0",
+                style: {
+                  color: "var(--tour-title-color)",
+                  fontSize: "var(--tour-title-size)",
+                  fontWeight: Number((_W = (_V = mergedTokens == null ? void 0 : mergedTokens.title) == null ? void 0 : _V.fontWeight) != null ? _W : 550),
+                  lineHeight: "var(--tour-title-line-height)",
+                  letterSpacing: "var(--tour-title-letter-spacing)"
+                },
+                children: title
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+              "p",
+              {
+                className: "m-0",
+                style: {
+                  color: "var(--tour-description-color)",
+                  fontSize: "var(--tour-description-size)",
+                  fontWeight: Number((_Y = (_X = mergedTokens == null ? void 0 : mergedTokens.description) == null ? void 0 : _X.fontWeight) != null ? _Y : 400),
+                  lineHeight: "var(--tour-description-line-height)",
+                  letterSpacing: "var(--tour-description-letter-spacing)"
+                },
+                children: description
+              }
+            )
+          ] }),
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "mt-2 flex items-center justify-between", style: { gap: "var(--tour-actions-gap)" }, children: [
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+              Button,
+              {
+                variant: "secondary",
+                size: "small",
+                onClick: onBack,
+                disabled: disableBack,
+                children: backLabel
+              }
+            ),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+              Button,
+              {
+                variant: "primary",
+                size: "small",
+                onClick: onNext,
+                disabled: disableNext,
+                children: nextLabel
+              }
+            )
+          ] })
+        ] })
+      ]
+    })
+  ) });
+}
+
 // src/components/base/foundations/icon/Icon.tsx
-var React16 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 var import_react_slot8 = require("@radix-ui/react-slot");
-var import_jsx_runtime41 = require("react/jsx-runtime");
+var import_jsx_runtime44 = require("react/jsx-runtime");
 function Icon(_a2) {
   var _b = _a2, {
     className,
@@ -8096,7 +8863,7 @@ function Icon(_a2) {
     "--icon-color": finalColor
   }, style);
   const Comp = asChild ? import_react_slot8.Slot : "span";
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
     Comp,
     __spreadProps(__spreadValues({
       "data-slot": "icon",
@@ -8107,7 +8874,7 @@ function Icon(_a2) {
         className
       )
     }, props), {
-      children: React16.isValidElement(children) ? React16.cloneElement(children, {
+      children: React18.isValidElement(children) ? React18.cloneElement(children, {
         width: (_f = (_e = children.props) == null ? void 0 : _e.width) != null ? _f : finalSize,
         height: (_h = (_g = children.props) == null ? void 0 : _g.height) != null ? _h : finalSize,
         stroke: "currentColor",
@@ -8119,14 +8886,14 @@ function Icon(_a2) {
 }
 
 // src/components/base/foundations/icon/IconLabel.tsx
-var import_jsx_runtime42 = require("react/jsx-runtime");
+var import_jsx_runtime45 = require("react/jsx-runtime");
 function IconLabel({
   icon,
   label,
   iconPosition = "left",
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
     "div",
     {
       className: cn(
@@ -8135,7 +8902,7 @@ function IconLabel({
       ),
       children: [
         iconPosition === "left" && icon,
-        /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "leading-none", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("span", { className: "leading-none", children: label }),
         iconPosition === "right" && icon
       ]
     }
@@ -8144,7 +8911,7 @@ function IconLabel({
 
 // src/components/base/layout/Separator.tsx
 var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
-var import_jsx_runtime43 = require("react/jsx-runtime");
+var import_jsx_runtime46 = require("react/jsx-runtime");
 function Separator2(_a2) {
   var _b = _a2, {
     className,
@@ -8170,7 +8937,7 @@ function Separator2(_a2) {
     "--separator-color": (_g = mergedTokens == null ? void 0 : mergedTokens.color) != null ? _g : "#E5E7EB",
     "--separator-opacity": (_h = mergedTokens == null ? void 0 : mergedTokens.opacity) != null ? _h : "1"
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
     SeparatorPrimitive.Root,
     __spreadValues({
       "data-slot": "separator",
@@ -8193,7 +8960,7 @@ function Separator2(_a2) {
 
 // src/components/widgets/last-movements/LastMovements.tsx
 var import_lucide_react14 = require("lucide-react");
-var import_jsx_runtime44 = require("react/jsx-runtime");
+var import_jsx_runtime47 = require("react/jsx-runtime");
 function LastMovements({
   title,
   period,
@@ -8208,19 +8975,19 @@ function LastMovements({
   errorContent,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
     Card,
     {
       variant: "primary",
       title,
       className: "w-full",
-      action: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Popover, { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "flex items-center gap-1", children: [
-          onDateChange && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Button, { variant: "primary", size: "small", children: [
+      action: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(Popover, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "flex items-center gap-1", children: [
+          onDateChange && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)(Button, { variant: "primary", size: "small", children: [
             date ? date.toLocaleDateString() : period,
-            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react14.ChevronsUpDown, { className: "ml-2 h-4 w-4" })
+            /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_lucide_react14.ChevronsUpDown, { className: "ml-2 h-4 w-4" })
           ] }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("button", { type: "button", onClick: () => onExpandedChange == null ? void 0 : onExpandedChange(!expanded), children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("button", { type: "button", onClick: () => onExpandedChange == null ? void 0 : onExpandedChange(!expanded), children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(
             import_lucide_react14.ChevronDownIcon,
             {
               className: cn(
@@ -8231,9 +8998,9 @@ function LastMovements({
           ) }),
           headerExtra
         ] }),
-        onDateChange && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(PopoverContent, { className: "w-auto p-0", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(Calendar, { mode: "single", selected: date, onSelect: onDateChange }) })
+        onDateChange && /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(PopoverContent, { className: "w-auto p-0", children: /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(Calendar, { mode: "single", selected: date, onSelect: onDateChange }) })
       ] }),
-      children: expanded && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { className: "divide-y", children: [
+      children: expanded && /* @__PURE__ */ (0, import_jsx_runtime47.jsxs)("div", { className: "divide-y", children: [
         state === "loading" && loadingContent,
         state === "empty" && emptyContent,
         state === "error" && errorContent,
@@ -8245,7 +9012,7 @@ function LastMovements({
 
 // src/components/widgets/unknown-purchase/UnknownPurchase.tsx
 var import_lucide_react15 = require("lucide-react");
-var import_jsx_runtime45 = require("react/jsx-runtime");
+var import_jsx_runtime48 = require("react/jsx-runtime");
 function UnknownPurchase({
   title,
   totalAmount,
@@ -8257,15 +9024,15 @@ function UnknownPurchase({
   emptyContent,
   errorContent
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
     Card,
     {
       variant: "primary",
       title,
       className: "w-full",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(Popover, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("div", { className: "mb-4", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(Popover, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
             Button,
             {
               variant: "secondary",
@@ -8279,11 +9046,11 @@ function UnknownPurchase({
               },
               children: [
                 date ? date.toLocaleDateString() : "Este mes",
-                /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_lucide_react15.ChevronsUpDown, { className: "ml-2 h-4 w-4 text-gray-300" })
+                /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_lucide_react15.ChevronsUpDown, { className: "ml-2 h-4 w-4 text-gray-300" })
               ]
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(PopoverContent, { className: "w-auto p-0", children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(PopoverContent, { className: "w-auto p-0", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
             Calendar,
             {
               mode: "single",
@@ -8292,18 +9059,18 @@ function UnknownPurchase({
             }
           ) })
         ] }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "min-h-[100px] flex flex-col justify-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "min-h-[100px] flex flex-col justify-center", children: [
           state === "loading" && loadingContent,
           state === "empty" && emptyContent,
           state === "error" && errorContent,
-          state === "default" && /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(import_jsx_runtime45.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "mb-4", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-sm text-gray-500", children: "Monto total desconocido" }),
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-xl font-semibold text-gray-900", children: totalAmount })
+          state === "default" && /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(import_jsx_runtime48.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { className: "mb-4", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: "text-sm text-gray-500", children: "Monto total desconocido" }),
+              /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: "text-xl font-semibold text-gray-900", children: totalAmount })
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { children: [
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-sm text-gray-500", children: "Total de compras desconocidas" }),
-              /* @__PURE__ */ (0, import_jsx_runtime45.jsx)("p", { className: "text-xl font-semibold text-gray-900", children: totalCount })
+            /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: "text-sm text-gray-500", children: "Total de compras desconocidas" }),
+              /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("p", { className: "text-xl font-semibold text-gray-900", children: totalCount })
             ] })
           ] })
         ] })
@@ -8312,6 +9079,527 @@ function UnknownPurchase({
   );
 }
 
+// src/components/widgets/ai/SmartSearch.tsx
+var React20 = __toESM(require("react"), 1);
+
+// src/ai/AIProvider.tsx
+var React19 = __toESM(require("react"), 1);
+var import_jsx_runtime49 = require("react/jsx-runtime");
+var AIContext = React19.createContext(null);
+function AIProvider({ request, children }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(AIContext.Provider, { value: request, children });
+}
+function useAI() {
+  return React19.useContext(AIContext);
+}
+
+// src/components/widgets/ai/SmartSearch.tsx
+var import_jsx_runtime50 = require("react/jsx-runtime");
+function SmartSearch(_a2) {
+  var _b = _a2, {
+    value,
+    defaultValue,
+    onValueChange,
+    onSelect,
+    suggestions,
+    minChars = 2,
+    debounceMs = 300,
+    request,
+    context
+  } = _b, props = __objRest(_b, [
+    "value",
+    "defaultValue",
+    "onValueChange",
+    "onSelect",
+    "suggestions",
+    "minChars",
+    "debounceMs",
+    "request",
+    "context"
+  ]);
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const isControlled = value !== void 0;
+  const [internalValue, setInternalValue] = React20.useState(defaultValue != null ? defaultValue : "");
+  const [items, setItems] = React20.useState([]);
+  const [loading, setLoading] = React20.useState(false);
+  const query = isControlled ? value != null ? value : "" : internalValue;
+  const updateValue = (next) => {
+    if (!isControlled) {
+      setInternalValue(next);
+    }
+    onValueChange == null ? void 0 : onValueChange(next);
+  };
+  React20.useEffect(() => {
+    const trimmed = query.trim();
+    if (trimmed.length < minChars) {
+      setItems([]);
+      return;
+    }
+    const timer = setTimeout(async () => {
+      var _a3;
+      if (requestFn) {
+        setLoading(true);
+        try {
+          const response = await requestFn({
+            task: "smartSearch",
+            input: trimmed,
+            context
+          });
+          setItems((_a3 = response == null ? void 0 : response.output) != null ? _a3 : []);
+        } catch (e) {
+          setItems([]);
+        } finally {
+          setLoading(false);
+        }
+      } else if (suggestions == null ? void 0 : suggestions.length) {
+        setItems(
+          suggestions.filter(
+            (item) => item.toLowerCase().includes(trimmed.toLowerCase())
+          )
+        );
+      }
+    }, debounceMs);
+    return () => clearTimeout(timer);
+  }, [query, minChars, debounceMs, requestFn, context, suggestions]);
+  return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+      SearchBar,
+      __spreadProps(__spreadValues({}, props), {
+        value: query,
+        onChange: (event) => updateValue(event.target.value)
+      })
+    ),
+    (loading || items.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Card, { className: "mt-2 w-full", children: [
+      loading && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "text-sm text-muted", children: "Buscando sugerencias..." }),
+      !loading && items.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("p", { className: "text-sm text-muted", children: "Sin resultados." }),
+      !loading && items.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("ul", { className: "flex flex-col gap-2", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("li", { children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
+        "button",
+        {
+          type: "button",
+          onClick: () => {
+            updateValue(item);
+            onSelect == null ? void 0 : onSelect(item);
+            setItems([]);
+          },
+          className: "w-full text-left text-sm hover:underline",
+          children: item
+        }
+      ) }, item)) })
+    ] })
+  ] });
+}
+
+// src/components/widgets/ai/TextAssist.tsx
+var React21 = __toESM(require("react"), 1);
+var import_jsx_runtime51 = require("react/jsx-runtime");
+function TextAssist(_a2) {
+  var _b = _a2, {
+    value,
+    defaultValue,
+    onValueChange,
+    actions = ["rewrite", "summarize", "tone"],
+    tone = "neutral",
+    request,
+    context
+  } = _b, props = __objRest(_b, [
+    "value",
+    "defaultValue",
+    "onValueChange",
+    "actions",
+    "tone",
+    "request",
+    "context"
+  ]);
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const isControlled = value !== void 0;
+  const [internalValue, setInternalValue] = React21.useState(defaultValue != null ? defaultValue : "");
+  const [loadingAction, setLoadingAction] = React21.useState(null);
+  const text = isControlled ? value != null ? value : "" : internalValue;
+  const updateValue = (next) => {
+    if (!isControlled) {
+      setInternalValue(next);
+    }
+    onValueChange == null ? void 0 : onValueChange(next);
+  };
+  const runAction = async (action) => {
+    if (!requestFn || !text.trim()) return;
+    setLoadingAction(action);
+    try {
+      const response = await requestFn({
+        task: "textAssist",
+        input: text,
+        context: __spreadValues({
+          action,
+          tone
+        }, context != null ? context : {})
+      });
+      if (response == null ? void 0 : response.output) {
+        updateValue(response.output);
+      }
+    } finally {
+      setLoadingAction(null);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "w-full space-y-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      Textarea,
+      __spreadProps(__spreadValues({}, props), {
+        value: text,
+        onChange: (event) => updateValue(event.target.value)
+      })
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "flex flex-wrap gap-2", children: actions.map((action) => /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
+      Button,
+      {
+        size: "small",
+        variant: "secondary",
+        disabled: !requestFn || !text.trim() || loadingAction !== null,
+        onClick: () => runAction(action),
+        children: loadingAction === action ? "Procesando..." : action === "rewrite" ? "Reescribir" : action === "summarize" ? "Resumir" : "Cambiar tono"
+      },
+      action
+    )) }),
+    !requestFn && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "text-xs text-muted", children: "Configura un AIProvider para activar las acciones." })
+  ] });
+}
+
+// src/components/widgets/ai/FormHelper.tsx
+var React22 = __toESM(require("react"), 1);
+var import_jsx_runtime52 = require("react/jsx-runtime");
+function FormHelper({
+  values,
+  rules,
+  request,
+  context,
+  title = "Sugerencias del formulario"
+}) {
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const [loading, setLoading] = React22.useState(false);
+  const [suggestions, setSuggestions] = React22.useState([]);
+  const run = async () => {
+    var _a2;
+    if (!requestFn) return;
+    setLoading(true);
+    try {
+      const response = await requestFn({
+        task: "formHelper",
+        data: { values, rules },
+        context
+      });
+      setSuggestions((_a2 = response == null ? void 0 : response.output) != null ? _a2 : []);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)(Card, { className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("h4", { className: "text-sm font-semibold", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          onClick: run,
+          disabled: !requestFn || loading,
+          children: loading ? "Revisando..." : "Revisar"
+        }
+      )
+    ] }),
+    !requestFn && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("p", { className: "mt-2 text-xs text-muted", children: "Configura un AIProvider para generar sugerencias." }),
+    suggestions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("ul", { className: "mt-3 flex flex-col gap-2 text-sm", children: suggestions.map((item, index) => /* @__PURE__ */ (0, import_jsx_runtime52.jsxs)("li", { children: [
+      "\u2022 ",
+      item
+    ] }, `${item}-${index}`)) })
+  ] });
+}
+
+// src/components/widgets/ai/TagSuggest.tsx
+var React23 = __toESM(require("react"), 1);
+var import_jsx_runtime53 = require("react/jsx-runtime");
+function TagSuggest({
+  value,
+  onChange,
+  request,
+  context,
+  placeholder = "Agregar etiqueta"
+}) {
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const [inputValue, setInputValue] = React23.useState("");
+  const [suggestions, setSuggestions] = React23.useState([]);
+  const [loading, setLoading] = React23.useState(false);
+  const tags = value != null ? value : [];
+  const addTag = (tag) => {
+    if (!tag.trim()) return;
+    if (tags.includes(tag)) return;
+    onChange == null ? void 0 : onChange([...tags, tag]);
+    setInputValue("");
+  };
+  const fetchSuggestions = async () => {
+    var _a2;
+    if (!requestFn || !inputValue.trim()) return;
+    setLoading(true);
+    try {
+      const response = await requestFn({
+        task: "tagSuggest",
+        input: inputValue.trim(),
+        context
+      });
+      setSuggestions((_a2 = response == null ? void 0 : response.output) != null ? _a2 : []);
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "w-full space-y-3", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex gap-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        Input,
+        {
+          value: inputValue,
+          onChange: (event) => setInputValue(event.target.value),
+          placeholder
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { size: "small", variant: "secondary", onClick: fetchSuggestions, children: loading ? "Buscando..." : "Sugerir" }),
+      /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          onClick: () => addTag(inputValue.trim()),
+          disabled: !inputValue.trim(),
+          children: "Agregar"
+        }
+      )
+    ] }),
+    suggestions.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex flex-wrap gap-2", children: suggestions.map((item) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
+      "button",
+      {
+        type: "button",
+        onClick: () => addTag(item),
+        className: "text-left",
+        children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Badge, { size: "small", tone: "brand", children: item })
+      },
+      item
+    )) }),
+    tags.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex flex-wrap gap-2", children: tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Badge, { size: "small", tone: "neutral", children: tag }, tag)) }),
+    !requestFn && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-xs text-muted", children: "Configura un AIProvider para obtener sugerencias." })
+  ] });
+}
+
+// src/components/widgets/ai/EmptyStateAI.tsx
+var React24 = __toESM(require("react"), 1);
+var import_jsx_runtime54 = require("react/jsx-runtime");
+function EmptyStateAI({
+  context,
+  request,
+  onAction,
+  actionLabel = "Ver recomendaciones",
+  align = "center"
+}) {
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const [loading, setLoading] = React24.useState(false);
+  const [title, setTitle] = React24.useState("Sin informaci\xF3n");
+  const [description, setDescription] = React24.useState(
+    "Genera un mensaje personalizado con IA."
+  );
+  const run = async () => {
+    var _a2, _b;
+    if (!requestFn) return;
+    setLoading(true);
+    try {
+      const response = await requestFn(
+        {
+          task: "emptyState",
+          context
+        }
+      );
+      if ((_a2 = response == null ? void 0 : response.output) == null ? void 0 : _a2.title) {
+        setTitle(response.output.title);
+      }
+      if ((_b = response == null ? void 0 : response.output) == null ? void 0 : _b.description) {
+        setDescription(response.output.description);
+      }
+    } finally {
+      setLoading(false);
+    }
+  };
+  React24.useEffect(() => {
+    run();
+  }, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+    EmptyState,
+    {
+      title,
+      description,
+      align,
+      actions: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          onClick: onAction != null ? onAction : run,
+          disabled: !requestFn || loading,
+          children: loading ? "Generando..." : actionLabel
+        }
+      )
+    }
+  );
+}
+
+// src/components/widgets/ai/DataInsights.tsx
+var React25 = __toESM(require("react"), 1);
+var import_jsx_runtime55 = require("react/jsx-runtime");
+function DataInsights({
+  data,
+  request,
+  context,
+  title = "Insights"
+}) {
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const [loading, setLoading] = React25.useState(false);
+  const [summary, setSummary] = React25.useState("");
+  const run = async () => {
+    var _a2;
+    if (!requestFn) return;
+    setLoading(true);
+    try {
+      const response = await requestFn({
+        task: "dataInsights",
+        data,
+        context
+      });
+      setSummary((_a2 = response == null ? void 0 : response.output) != null ? _a2 : "");
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(Card, { className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("h4", { className: "text-sm font-semibold", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          onClick: run,
+          disabled: !requestFn || loading,
+          children: loading ? "Analizando..." : "Analizar"
+        }
+      )
+    ] }),
+    !requestFn && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "mt-2 text-xs text-muted", children: "Configura un AIProvider para generar insights." }),
+    summary && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "mt-3 text-sm", children: summary })
+  ] });
+}
+
+// src/components/widgets/ai/TranslateToggle.tsx
+var React26 = __toESM(require("react"), 1);
+var import_jsx_runtime56 = require("react/jsx-runtime");
+function TranslateToggle({
+  text,
+  from = "es",
+  to = "en",
+  request,
+  context,
+  title = "Traducci\xF3n"
+}) {
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const [loading, setLoading] = React26.useState(false);
+  const [translated, setTranslated] = React26.useState(null);
+  const toggle = async () => {
+    var _a2;
+    if (!requestFn) return;
+    if (translated) {
+      setTranslated(null);
+      return;
+    }
+    setLoading(true);
+    try {
+      const response = await requestFn({
+        task: "translate",
+        input: text,
+        context: __spreadValues({ from, to }, context != null ? context : {})
+      });
+      setTranslated((_a2 = response == null ? void 0 : response.output) != null ? _a2 : "");
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Card, { className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("h4", { className: "text-sm font-semibold", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          onClick: toggle,
+          disabled: !requestFn || loading,
+          children: loading ? "Traduciendo..." : translated ? "Ver original" : "Traducir"
+        }
+      )
+    ] }),
+    !requestFn && /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: "mt-2 text-xs text-muted", children: "Configura un AIProvider para traducir." }),
+    /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("p", { className: "mt-3 text-sm whitespace-pre-wrap", children: translated != null ? translated : text })
+  ] });
+}
+
+// src/components/widgets/ai/ExplainCode.tsx
+var React27 = __toESM(require("react"), 1);
+var import_jsx_runtime57 = require("react/jsx-runtime");
+function ExplainCode({
+  code,
+  language = "tsx",
+  request,
+  context,
+  title = "Explicaci\xF3n de c\xF3digo"
+}) {
+  const ai = useAI();
+  const requestFn = request != null ? request : ai;
+  const [loading, setLoading] = React27.useState(false);
+  const [explanation, setExplanation] = React27.useState("");
+  const run = async () => {
+    var _a2;
+    if (!requestFn) return;
+    setLoading(true);
+    try {
+      const response = await requestFn({
+        task: "explainCode",
+        input: code,
+        context: __spreadValues({ language }, context != null ? context : {})
+      });
+      setExplanation((_a2 = response == null ? void 0 : response.output) != null ? _a2 : "");
+    } finally {
+      setLoading(false);
+    }
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)(Card, { className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsxs)("div", { className: "flex items-center justify-between", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("h4", { className: "text-sm font-semibold", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime57.jsx)(
+        Button,
+        {
+          size: "small",
+          variant: "secondary",
+          onClick: run,
+          disabled: !requestFn || loading,
+          children: loading ? "Explicando..." : "Explicar"
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("pre", { className: "mt-3 rounded-md bg-neutral-100 p-3 text-xs overflow-auto", children: /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("code", { children: code }) }),
+    !requestFn && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: "mt-2 text-xs text-muted", children: "Configura un AIProvider para explicar el c\xF3digo." }),
+    explanation && /* @__PURE__ */ (0, import_jsx_runtime57.jsx)("p", { className: "mt-3 text-sm", children: explanation })
+  ] });
+}
+
 // src/theme/themeDefault.ts
 var themeDefault = {
   name: "mockup-default",
@@ -10039,7 +11327,7 @@ async function resolveTheme(channelId) {
 }
 
 // src/theme/server/setTheme.tsx
-var import_jsx_runtime46 = require("react/jsx-runtime");
+var import_jsx_runtime58 = require("react/jsx-runtime");
 var themeCache = /* @__PURE__ */ new Map();
 var EMPTY_THEME = themeDefault;
 function setTheme({ channelId, theme, children }) {
@@ -10067,15 +11355,15 @@ function setTheme({ channelId, theme, children }) {
     };
   }, [channelId, theme]);
   console.log("Rendering setTheme with channelId:", channelId, "and finalTheme:", finalTheme);
-  return /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ThemeContext.Provider, { value: finalTheme != null ? finalTheme : EMPTY_THEME.tokens, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(ThemeContext.Provider, { value: finalTheme != null ? finalTheme : EMPTY_THEME.tokens, children });
 }
 
 // src/theme/client/ThemeProvider.tsx
-var import_jsx_runtime47 = require("react/jsx-runtime");
+var import_jsx_runtime59 = require("react/jsx-runtime");
 function ThemeProvider({
   channelId,
   theme,
   children
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_jsx_runtime47.Fragment, { children: setTheme({ channelId, theme, children }) });
+  return /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_jsx_runtime59.Fragment, { children: setTheme({ channelId, theme, children }) });
 }