@mlw-packages/react-components 1.5.5 → 1.5.7

package/dist/index.mjs

@@ -499,13 +499,13 @@ var buttonVariantsBase = cva(
       variant: {
         default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
         destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
-        outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
+        outline: "bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
         secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
         ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
         link: "text-primary underline-offset-4 hover:underline"
       },
       size: {
-        default: "h-9 px-4 py-2 has-[>svg]:px-3",
+        default: " px-4 py-2 has-[>svg]:px-3",
         sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
         lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
         icon: "size-9"
@@ -551,7 +551,7 @@ var ButtonGroupBase = React.forwardRef(
           return React.cloneElement(typedChild, {
             className: cn(
               typedChild.props.className,
-              "rounded-none border-0",
+              "rounded-none",
               index === 0 && orientation === "horizontal" && "rounded-l-md",
               index === 0 && orientation === "vertical" && "rounded-t-md",
               index === React.Children.count(children) - 1 && orientation === "horizontal" && "rounded-r-md",
@@ -1419,34 +1419,39 @@ var DialogOverlayBase = React8.forwardRef(({ className, testid: dataTestId = "di
   }
 ));
 DialogOverlayBase.displayName = DialogPrimitive.Overlay.displayName;
-var DialogContentBase = React8.forwardRef(({ className, children, testid: dataTestId = "dialog-content", ...props }, ref) => /* @__PURE__ */ jsxs5(DialogPortalBase, { children: [
-  /* @__PURE__ */ jsx11(DialogOverlayBase, {}),
-  /* @__PURE__ */ jsxs5(
-    DialogPrimitive.Content,
-    {
-      ref,
-      className: cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-        className
-      ),
-      "data-testid": dataTestId,
-      ...props,
-      children: [
-        children,
-        /* @__PURE__ */ jsxs5(DialogPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground", children: [
-          /* @__PURE__ */ jsx11(XIcon, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx11("span", { className: "sr-only", children: "Close" })
-        ] })
-      ]
-    }
-  )
-] }));
+var DialogContentBase = React8.forwardRef(
+  ({ className, children, testid: dataTestId = "dialog-content", ...props }, ref) => /* @__PURE__ */ jsxs5(DialogPortalBase, { children: [
+    /* @__PURE__ */ jsx11(DialogOverlayBase, {}),
+    /* @__PURE__ */ jsxs5(
+      DialogPrimitive.Content,
+      {
+        ref,
+        className: cn(
+          "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg max-h-[100dvh] overflow-hidden",
+          className
+        ),
+        "data-testid": dataTestId,
+        ...props,
+        children: [
+          children,
+          /* @__PURE__ */ jsxs5(DialogPrimitive.Close, { className: "absolute right-3 top-3 sm:right-4 sm:top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground z-10 touch-manipulation", children: [
+            /* @__PURE__ */ jsx11(XIcon, { className: "h-5 w-5 sm:h-4 sm:w-4" }),
+            /* @__PURE__ */ jsx11("span", { className: "sr-only", children: "Close" })
+          ] })
+        ]
+      }
+    )
+  ] })
+);
 DialogContentBase.displayName = DialogPrimitive.Content.displayName;
 var DialogHeaderBase = React8.forwardRef(({ className, testid: dataTestId = "dialog-header", ...props }, ref) => /* @__PURE__ */ jsx11(
   "div",
   {
     ref,
-    className: cn("flex flex-col space-y-1.5 text-center sm:text-left", className),
+    className: cn(
+      "flex flex-col space-y-1.5 text-center sm:text-left",
+      className
+    ),
     "data-testid": dataTestId,
     ...props
   }
@@ -1456,7 +1461,10 @@ var DialogFooterBase = React8.forwardRef(({ className, testid: dataTestId = "dia
   "div",
   {
     ref,
-    className: cn("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", className),
+    className: cn(
+      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
+      className
+    ),
     "data-testid": dataTestId,
     ...props
   }
@@ -1466,7 +1474,10 @@ var DialogTitleBase = React8.forwardRef(({ className, testid: dataTestId = "dial
   DialogPrimitive.Title,
   {
     ref,
-    className: cn("text-lg font-semibold leading-none tracking-tight", className),
+    className: cn(
+      "text-lg font-semibold leading-none tracking-tight",
+      className
+    ),
     "data-testid": dataTestId,
     ...props
   }
@@ -2130,7 +2141,7 @@ var InputBase = React12.forwardRef(
               {
                 type,
                 className: cn(
-                  "w-full flex-1 text-sm py-1.5 px-3 focus:outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 bg-background text-foreground",
+                  "w-full flex-1 text-sm py-2 px-3 focus:outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 bg-background text-foreground",
                   className
                 ),
                 ref,
@@ -2205,7 +2216,7 @@ function ComboboxBase({
                 role: "combobox",
                 "aria-expanded": open,
                 className: cn(
-                  "flex items-start gap-2 justify-between h-full",
+                  "flex items-start gap-2 justify-between h-full border border-input",
                   errorMessage && "border-red-500"
                 ),
                 "data-testid": testIds.trigger ?? "combobox-trigger",
@@ -2554,17 +2565,188 @@ function InputOTPSeparatorBase({ ...props }) {
   return /* @__PURE__ */ jsx25("div", { "data-slot": "input-otp-separator", role: "separator", ...props, children: /* @__PURE__ */ jsx25(MinusIcon, {}) });
 }
 
+// src/components/ui/LoadingBase.tsx
+import * as React16 from "react";
+import { cva as cva3 } from "class-variance-authority";
+import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
+var loadingVariants = cva3(
+  "rounded-full border-2 animate-spin border-muted border-t-primary",
+  {
+    variants: {
+      size: {
+        sm: "h-4 w-4",
+        md: "h-6 w-6",
+        lg: "h-8 w-8",
+        xl: "h-12 w-12 border-[3px]"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var dotsVariants = cva3(
+  "flex items-center justify-center",
+  {
+    variants: {
+      size: {
+        sm: "gap-1",
+        md: "gap-1.5",
+        lg: "gap-2",
+        xl: "gap-2.5"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var dotVariants = cva3(
+  "rounded-full bg-gradient-to-r from-primary to-primary/70 shadow-sm",
+  {
+    variants: {
+      size: {
+        sm: "h-1.5 w-2",
+        md: "h-2.5 w-2.5",
+        lg: "h-2.5 w-3",
+        xl: "h-3.5 w-4"
+      }
+    },
+    defaultVariants: {
+      size: "md"
+    }
+  }
+);
+var LoadingBase = React16.forwardRef(
+  ({ className, size, message, overlay = false, variant = "spinner", ...props }, ref) => {
+    React16.useEffect(() => {
+      const style = document.createElement("style");
+      style.textContent = `
+        @keyframes dotBounce {
+          0%, 80%, 100% {
+            transform: translateY(0);
+            opacity: 0.8;
+          }
+          40% {
+            transform:  translateY(-8px);
+            opacity: 1;
+          }
+        }
+      `;
+      document.head.appendChild(style);
+      return () => {
+        if (document.head.contains(style)) {
+          document.head.removeChild(style);
+        }
+      };
+    }, []);
+    const renderSpinner = () => {
+      if (variant === "dots") {
+        return /* @__PURE__ */ jsxs16("div", { className: cn(dotsVariants({ size })), "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsx26(
+            "div",
+            {
+              className: cn(dotVariants({ size })),
+              style: {
+                animation: "dotBounce 1.4s ease-in-out infinite",
+                animationDelay: "0ms",
+                transform: "translateY(0px)"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx26(
+            "div",
+            {
+              className: cn(dotVariants({ size })),
+              style: {
+                animation: "dotBounce 1.4s ease-in-out infinite",
+                animationDelay: "0.16s",
+                transform: "translateY(0px)"
+              }
+            }
+          ),
+          /* @__PURE__ */ jsx26(
+            "div",
+            {
+              className: cn(dotVariants({ size })),
+              style: {
+                animation: "dotBounce 1.4s ease-in-out infinite",
+                animationDelay: "0.32s",
+                transform: "translateY(0px)"
+              }
+            }
+          )
+        ] });
+      }
+      return /* @__PURE__ */ jsx26(
+        "div",
+        {
+          className: cn(loadingVariants({ size })),
+          style: {
+            animation: "spin 1s linear infinite"
+          },
+          "aria-hidden": "true"
+        }
+      );
+    };
+    const loadingContent = /* @__PURE__ */ jsxs16("div", { className: "flex flex-col items-center gap-4", children: [
+      renderSpinner(),
+      message && /* @__PURE__ */ jsx26("p", { className: "text-sm font-medium text-muted-foreground animate-pulse", children: message })
+    ] });
+    if (overlay) {
+      return /* @__PURE__ */ jsx26(
+        "div",
+        {
+          ref,
+          className: cn(
+            "fixed inset-0 z-50 flex items-center justify-center",
+            "bg-background/80 dark:bg-background/60",
+            "backdrop-blur-md backdrop-saturate-150",
+            "transition-all duration-300 ease-in-out",
+            "animate-in fade-in-0",
+            className
+          ),
+          role: "status",
+          "aria-label": message || "Carregando",
+          ...props,
+          children: /* @__PURE__ */ jsx26("div", { className: cn(
+            "relative p-8 rounded-2xl",
+            "bg-card/90 dark:bg-card/95",
+            "border border-border/50",
+            "shadow-2xl shadow-black/10 dark:shadow-black/30",
+            "backdrop-blur-xl backdrop-saturate-150",
+            "animate-in zoom-in-95 fade-in-0 duration-300",
+            "text-center space-y-4"
+          ), children: loadingContent })
+        }
+      );
+    }
+    return /* @__PURE__ */ jsx26(
+      "div",
+      {
+        ref,
+        className: cn("flex items-center justify-center", className),
+        role: "status",
+        "aria-label": message || "Carregando",
+        ...props,
+        children: loadingContent
+      }
+    );
+  }
+);
+LoadingBase.displayName = "LoadingBase";
+
 // src/components/ui/NavigationMenuBase.tsx
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 import { CaretDownIcon as CaretDownIcon2 } from "@phosphor-icons/react";
-import { jsx as jsx26, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
 function NavigationMenuBase({
   className,
   children,
   viewport = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     NavigationMenuPrimitive.Root,
     {
       "data-slot": "navigation-menu",
@@ -2576,7 +2758,7 @@ function NavigationMenuBase({
       ...props,
       children: [
         children,
-        viewport && /* @__PURE__ */ jsx26(NavigationMenuViewportBase, {})
+        viewport && /* @__PURE__ */ jsx27(NavigationMenuViewportBase, {})
       ]
     }
   );
@@ -2585,7 +2767,7 @@ function NavigationMenuListBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     NavigationMenuPrimitive.List,
     {
       "data-slot": "navigation-menu-list",
@@ -2601,7 +2783,7 @@ function NavigationMenuItemBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     NavigationMenuPrimitive.Item,
     {
       "data-slot": "navigation-menu-item",
@@ -2615,7 +2797,7 @@ function NavigationMenuTriggerBase({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs16(
+  return /* @__PURE__ */ jsxs17(
     NavigationMenuPrimitive.Trigger,
     {
       "data-slot": "navigation-menu-trigger",
@@ -2623,7 +2805,7 @@ function NavigationMenuTriggerBase({
       ...props,
       children: [
         children,
-        /* @__PURE__ */ jsx26(
+        /* @__PURE__ */ jsx27(
           CaretDownIcon2,
           {
             className: "relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180",
@@ -2638,7 +2820,7 @@ function NavigationMenuContentBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     NavigationMenuPrimitive.Content,
     {
       "data-slot": "navigation-menu-content",
@@ -2655,7 +2837,7 @@ function NavigationMenuViewportBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx26("div", { className: cn("absolute top-full left-0 isolate z-50 flex justify-center"), children: /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27("div", { className: cn("absolute top-full left-0 isolate z-50 flex justify-center"), children: /* @__PURE__ */ jsx27(
     NavigationMenuPrimitive.Viewport,
     {
       "data-slot": "navigation-menu-viewport",
@@ -2671,7 +2853,7 @@ function NavigationMenuLinkBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     NavigationMenuPrimitive.Link,
     {
       "data-slot": "navigation-menu-link",
@@ -2687,7 +2869,7 @@ function NavigationMenuIndicatorBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx26(
+  return /* @__PURE__ */ jsx27(
     NavigationMenuPrimitive.Indicator,
     {
       "data-slot": "navigation-menu-indicator",
@@ -2696,21 +2878,21 @@ function NavigationMenuIndicatorBase({
         className
       ),
       ...props,
-      children: /* @__PURE__ */ jsx26("div", { className: "bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md" })
+      children: /* @__PURE__ */ jsx27("div", { className: "bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md" })
     }
   );
 }
 
 // src/components/ui/ProgressBase.tsx
-import * as React16 from "react";
+import * as React17 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { jsx as jsx27, jsxs as jsxs17 } from "react/jsx-runtime";
-var ProgressBase = React16.forwardRef(({ className, value, label, leftIcon, rightIcon, ...props }, ref) => {
-  return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
-    label && /* @__PURE__ */ jsx27(LabelBase_default, { className: "py-2", children: label }),
-    /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
-      leftIcon && /* @__PURE__ */ jsx27("div", { className: "flex items-center justify-center", children: leftIcon }),
-      /* @__PURE__ */ jsx27(
+import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
+var ProgressBase = React17.forwardRef(({ className, value, label, leftIcon, rightIcon, ...props }, ref) => {
+  return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
+    label && /* @__PURE__ */ jsx28(LabelBase_default, { className: "py-2", children: label }),
+    /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
+      leftIcon && /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-center", children: leftIcon }),
+      /* @__PURE__ */ jsx28(
         ProgressPrimitive.Root,
         {
           ref,
@@ -2720,7 +2902,7 @@ var ProgressBase = React16.forwardRef(({ className, value, label, leftIcon, righ
           ),
           value,
           ...props,
-          children: /* @__PURE__ */ jsx27(
+          children: /* @__PURE__ */ jsx28(
             ProgressPrimitive.Indicator,
             {
               className: "h-full w-full flex-1 bg-primary transition-all duration-500 ease-in-out",
@@ -2729,7 +2911,7 @@ var ProgressBase = React16.forwardRef(({ className, value, label, leftIcon, righ
           )
         }
       ),
-      rightIcon && /* @__PURE__ */ jsx27("div", { className: "flex items-center justify-center", children: rightIcon })
+      rightIcon && /* @__PURE__ */ jsx28("div", { className: "flex items-center justify-center", children: rightIcon })
     ] })
   ] });
 });
@@ -2740,9 +2922,9 @@ var ProgressSegmentsBase = ({
   value
 }) => {
   const filled = Math.round(value / 100 * segments);
-  return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
-    label && /* @__PURE__ */ jsx27(LabelBase_default, { className: "py-2", children: label }),
-    /* @__PURE__ */ jsx27("div", { className: "flex gap-1 w-full", children: Array.from({ length: segments }).map((_, idx) => /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
+    label && /* @__PURE__ */ jsx28(LabelBase_default, { className: "py-2", children: label }),
+    /* @__PURE__ */ jsx28("div", { className: "flex gap-1 w-full", children: Array.from({ length: segments }).map((_, idx) => /* @__PURE__ */ jsx28(
       "div",
       {
         className: cn(
@@ -2754,7 +2936,7 @@ var ProgressSegmentsBase = ({
     )) })
   ] });
 };
-var ArrowRightIcon2 = () => /* @__PURE__ */ jsx27(
+var ArrowRightIcon2 = () => /* @__PURE__ */ jsx28(
   "svg",
   {
     className: "w-6 h-6 text-zinc-400 transition-transform duration-300 group-hover:translate-x-1",
@@ -2763,7 +2945,7 @@ var ArrowRightIcon2 = () => /* @__PURE__ */ jsx27(
     strokeWidth: 2,
     viewBox: "0 0 24 24",
     xmlns: "http://www.w3.org/2000/svg",
-    children: /* @__PURE__ */ jsx27("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" })
+    children: /* @__PURE__ */ jsx28("path", { strokeLinecap: "round", strokeLinejoin: "round", d: "M9 5l7 7-7 7" })
   }
 );
 var ProgressPanelsBase = ({
@@ -2771,13 +2953,13 @@ var ProgressPanelsBase = ({
   steps,
   currentStep
 }) => {
-  return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-1 w-full", children: [
-    label && /* @__PURE__ */ jsx27(LabelBase_default, { className: "py-2", children: label }),
-    /* @__PURE__ */ jsx27("div", { className: "flex w-full gap-1 rounded-lg overflow-hidden", children: steps.map((step, idx) => {
+  return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-1 w-full", children: [
+    label && /* @__PURE__ */ jsx28(LabelBase_default, { className: "py-2", children: label }),
+    /* @__PURE__ */ jsx28("div", { className: "flex w-full gap-1 rounded-lg overflow-hidden", children: steps.map((step, idx) => {
       const isActive = idx === currentStep;
       const isLast = idx === steps.length - 1;
-      return /* @__PURE__ */ jsxs17(React16.Fragment, { children: [
-        /* @__PURE__ */ jsxs17(
+      return /* @__PURE__ */ jsxs18(React17.Fragment, { children: [
+        /* @__PURE__ */ jsxs18(
           "div",
           {
             className: cn(
@@ -2788,12 +2970,12 @@ var ProgressPanelsBase = ({
             ),
             style: { flex: "1 1 0" },
             children: [
-              /* @__PURE__ */ jsx27("span", { className: "truncate", children: step }),
-              isActive && /* @__PURE__ */ jsx27("div", { className: "absolute bottom-0 left-0 h-1 w-full animate-pulse rounded-b-lg" })
+              /* @__PURE__ */ jsx28("span", { className: "truncate", children: step }),
+              isActive && /* @__PURE__ */ jsx28("div", { className: "absolute bottom-0 left-0 h-1 w-full animate-pulse rounded-b-lg" })
             ]
           }
         ),
-        !isLast && /* @__PURE__ */ jsx27("div", { className: "flex items-center px-2 group", children: /* @__PURE__ */ jsx27(ArrowRightIcon2, {}) })
+        !isLast && /* @__PURE__ */ jsx28("div", { className: "flex items-center px-2 group", children: /* @__PURE__ */ jsx28(ArrowRightIcon2, {}) })
       ] }, idx);
     }) })
   ] });
@@ -2803,11 +2985,11 @@ var ProgressCirclesBase = ({
   steps,
   currentStep
 }) => {
-  return /* @__PURE__ */ jsxs17("div", { className: "flex flex-col gap-2 w-full", children: [
-    label && /* @__PURE__ */ jsx27("label", { className: "py-2 text-base font-semibold text-gray-700 dark:text-gray-300", children: label }),
-    /* @__PURE__ */ jsxs17("div", { className: "relative flex items-center justify-between w-full", children: [
-      /* @__PURE__ */ jsx27("div", { className: "absolute top-5 left-0 w-full h-1 bg-zinc-200 dark:bg-zinc-700" }),
-      /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-2 w-full", children: [
+    label && /* @__PURE__ */ jsx28("label", { className: "py-2 text-base font-semibold text-gray-700 dark:text-gray-300", children: label }),
+    /* @__PURE__ */ jsxs18("div", { className: "relative flex items-center justify-between w-full", children: [
+      /* @__PURE__ */ jsx28("div", { className: "absolute top-5 left-0 w-full h-1 bg-zinc-200 dark:bg-zinc-700" }),
+      /* @__PURE__ */ jsx28(
         "div",
         {
           className: "absolute top-5 left-0 h-1 bg-primary transition-all duration-300",
@@ -2818,13 +3000,13 @@ var ProgressCirclesBase = ({
       ),
       steps.map((step, idx) => {
         const isActive = idx <= currentStep;
-        return /* @__PURE__ */ jsxs17(
+        return /* @__PURE__ */ jsxs18(
           "div",
           {
             className: "relative flex flex-col items-center w-10",
             style: { zIndex: isActive ? 10 : 1 },
             children: [
-              /* @__PURE__ */ jsx27(
+              /* @__PURE__ */ jsx28(
                 "div",
                 {
                   className: cn(
@@ -2834,7 +3016,7 @@ var ProgressCirclesBase = ({
                   children: idx + 1
                 }
               ),
-              /* @__PURE__ */ jsx27("span", { className: "text-xs text-center font-medium mt-1 max-w-[80px] break-words", children: step })
+              /* @__PURE__ */ jsx28("span", { className: "text-xs text-center font-medium mt-1 max-w-[80px] break-words", children: step })
             ]
           },
           idx
@@ -2845,24 +3027,24 @@ var ProgressCirclesBase = ({
 };
 
 // src/components/ui/ScrollareaBase.tsx
-import * as React17 from "react";
+import * as React18 from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx28, jsxs as jsxs18 } from "react/jsx-runtime";
-var ScrollAreaBase = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs18(
+import { jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
+var ScrollAreaBase = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs19(
   ScrollAreaPrimitive.Root,
   {
     ref,
     className: cn("relative overflow-hidden", className),
     ...props,
     children: [
-      /* @__PURE__ */ jsx28(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
-      /* @__PURE__ */ jsx28(ScrollBarBase, {}),
-      /* @__PURE__ */ jsx28(ScrollAreaPrimitive.Corner, {})
+      /* @__PURE__ */ jsx29(ScrollAreaPrimitive.Viewport, { className: "h-full w-full rounded-[inherit]", children }),
+      /* @__PURE__ */ jsx29(ScrollBarBase, {}),
+      /* @__PURE__ */ jsx29(ScrollAreaPrimitive.Corner, {})
     ]
   }
 ));
 ScrollAreaBase.displayName = ScrollAreaPrimitive.Root.displayName;
-var ScrollBarBase = React17.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx28(
+var ScrollBarBase = React18.forwardRef(({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ jsx29(
   ScrollAreaPrimitive.ScrollAreaScrollbar,
   {
     ref,
@@ -2874,21 +3056,21 @@ var ScrollBarBase = React17.forwardRef(({ className, orientation = "vertical", .
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx28(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
+    children: /* @__PURE__ */ jsx29(ScrollAreaPrimitive.ScrollAreaThumb, { className: "relative flex-1 rounded-full bg-border" })
   }
 ));
 ScrollBarBase.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // src/components/ui/SelectBase.tsx
-import * as React18 from "react";
+import * as React19 from "react";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { CheckIcon as CheckIcon5, CaretDownIcon as CaretDownIcon3, CaretUpIcon } from "@phosphor-icons/react";
 import { motion as motion4, AnimatePresence as AnimatePresence3 } from "framer-motion";
-import { Fragment as Fragment2, jsx as jsx29, jsxs as jsxs19 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx30, jsxs as jsxs20 } from "react/jsx-runtime";
 var SelectBase = SelectPrimitive.Root;
 var SelectGroupBase = SelectPrimitive.Group;
 var SelectValueBase = SelectPrimitive.Value;
-var SelectTriggerBase = React18.forwardRef(({ className, children, open, ...props }, ref) => /* @__PURE__ */ jsxs19(
+var SelectTriggerBase = React19.forwardRef(({ className, children, open, ...props }, ref) => /* @__PURE__ */ jsxs20(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -2899,20 +3081,20 @@ var SelectTriggerBase = React18.forwardRef(({ className, children, open, ...prop
     ...props,
     children: [
       children,
-      /* @__PURE__ */ jsx29(
+      /* @__PURE__ */ jsx30(
         motion4.span,
         {
           animate: { rotate: open ? 180 : 0 },
           transition: { duration: 0.3 },
           className: "flex items-center",
-          children: /* @__PURE__ */ jsx29(CaretDownIcon3, { className: "h-4 w-4 opacity-50" })
+          children: /* @__PURE__ */ jsx30(CaretDownIcon3, { className: "h-4 w-4 opacity-50" })
         }
       )
     ]
   }
 ));
 SelectTriggerBase.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButtonBase = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
+var SelectScrollUpButtonBase = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -2921,11 +3103,11 @@ var SelectScrollUpButtonBase = React18.forwardRef(({ className, ...props }, ref)
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx29(CaretUpIcon, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx30(CaretUpIcon, { className: "h-4 w-4" })
   }
 ));
 SelectScrollUpButtonBase.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButtonBase = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
+var SelectScrollDownButtonBase = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -2934,11 +3116,11 @@ var SelectScrollDownButtonBase = React18.forwardRef(({ className, ...props }, re
       className
     ),
     ...props,
-    children: /* @__PURE__ */ jsx29(CaretDownIcon3, { className: "h-4 w-4" })
+    children: /* @__PURE__ */ jsx30(CaretDownIcon3, { className: "h-4 w-4" })
   }
 ));
 SelectScrollDownButtonBase.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContentBase = React18.forwardRef(({ className, children, position = "popper", testid: dataTestId = "select-content", ...props }, ref) => /* @__PURE__ */ jsx29(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx29(AnimatePresence3, { children: /* @__PURE__ */ jsx29(
+var SelectContentBase = React19.forwardRef(({ className, children, position = "popper", testid: dataTestId = "select-content", ...props }, ref) => /* @__PURE__ */ jsx30(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx30(AnimatePresence3, { children: /* @__PURE__ */ jsx30(
   SelectPrimitive.Content,
   {
     ref,
@@ -2950,16 +3132,16 @@ var SelectContentBase = React18.forwardRef(({ className, children, position = "p
     "data-testid": dataTestId,
     ...props,
     asChild: true,
-    children: /* @__PURE__ */ jsx29(
+    children: /* @__PURE__ */ jsx30(
       motion4.div,
       {
         initial: { opacity: 0, scale: 0.95 },
         animate: { opacity: 1, scale: 1 },
         exit: { opacity: 0, scale: 0.95 },
         transition: { duration: 0.2 },
-        children: /* @__PURE__ */ jsxs19(Fragment2, { children: [
-          /* @__PURE__ */ jsx29(SelectScrollUpButtonBase, {}),
-          /* @__PURE__ */ jsx29(
+        children: /* @__PURE__ */ jsxs20(Fragment2, { children: [
+          /* @__PURE__ */ jsx30(SelectScrollUpButtonBase, {}),
+          /* @__PURE__ */ jsx30(
             SelectPrimitive.Viewport,
             {
               className: cn(
@@ -2969,14 +3151,14 @@ var SelectContentBase = React18.forwardRef(({ className, children, position = "p
               children
             }
           ),
-          /* @__PURE__ */ jsx29(SelectScrollDownButtonBase, {})
+          /* @__PURE__ */ jsx30(SelectScrollDownButtonBase, {})
         ] })
       }
     )
   }
 ) }) }));
 SelectContentBase.displayName = SelectPrimitive.Content.displayName;
-var SelectLabelBase = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
+var SelectLabelBase = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
   SelectPrimitive.Label,
   {
     ref,
@@ -2985,7 +3167,7 @@ var SelectLabelBase = React18.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 SelectLabelBase.displayName = SelectPrimitive.Label.displayName;
-var SelectItemBase = React18.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs19(
+var SelectItemBase = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs20(
   SelectPrimitive.Item,
   {
     ref,
@@ -2995,13 +3177,13 @@ var SelectItemBase = React18.forwardRef(({ className, children, ...props }, ref)
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsx29("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx29(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx29(CheckIcon5, { className: "h-4 w-4" }) }) }),
-      /* @__PURE__ */ jsx29(SelectPrimitive.ItemText, { children })
+      /* @__PURE__ */ jsx30("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsx30(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ jsx30(CheckIcon5, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ jsx30(SelectPrimitive.ItemText, { children })
     ]
   }
 ));
 SelectItemBase.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparatorBase = React18.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx29(
+var SelectSeparatorBase = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx30(
   SelectPrimitive.Separator,
   {
     ref,
@@ -3012,14 +3194,14 @@ var SelectSeparatorBase = React18.forwardRef(({ className, ...props }, ref) => /
 SelectSeparatorBase.displayName = SelectPrimitive.Separator.displayName;
 
 // src/components/ui/SeparatorBase.tsx
-import * as React19 from "react";
+import * as React20 from "react";
 import * as SeparatorPrimitive from "@radix-ui/react-separator";
 import { motion as motion5 } from "framer-motion";
-import { jsx as jsx30 } from "react/jsx-runtime";
-var SeparatorBase = React19.forwardRef(
+import { jsx as jsx31 } from "react/jsx-runtime";
+var SeparatorBase = React20.forwardRef(
   ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => {
     const isHorizontal = orientation === "horizontal";
-    return /* @__PURE__ */ jsx30(
+    return /* @__PURE__ */ jsx31(
       SeparatorPrimitive.Root,
       {
         ref,
@@ -3027,7 +3209,7 @@ var SeparatorBase = React19.forwardRef(
         orientation,
         asChild: true,
         ...props,
-        children: /* @__PURE__ */ jsx30(
+        children: /* @__PURE__ */ jsx31(
           motion5.div,
           {
             className: cn(
@@ -3047,16 +3229,16 @@ var SeparatorBase = React19.forwardRef(
 SeparatorBase.displayName = SeparatorPrimitive.Root.displayName;
 
 // src/components/ui/SheetBase.tsx
-import * as React20 from "react";
+import * as React21 from "react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
-import { cva as cva3 } from "class-variance-authority";
+import { cva as cva4 } from "class-variance-authority";
 import { XIcon as XIcon3 } from "@phosphor-icons/react";
-import { jsx as jsx31, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
 var SheetBase = SheetPrimitive.Root;
 var SheetTriggerBase = SheetPrimitive.Trigger;
 var SheetCloseBase = SheetPrimitive.Close;
 var SheetPortalBase = SheetPrimitive.Portal;
-var SheetOverlayBase = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
+var SheetOverlayBase = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
   SheetPrimitive.Overlay,
   {
     className: cn(
@@ -3068,7 +3250,7 @@ var SheetOverlayBase = React20.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SheetOverlayBase.displayName = SheetPrimitive.Overlay.displayName;
-var sheetVariants = cva3(
+var sheetVariants = cva4(
   "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",
   {
     variants: {
@@ -3084,18 +3266,18 @@ var sheetVariants = cva3(
     }
   }
 );
-var SheetContentBase = React20.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs20(SheetPortalBase, { children: [
-  /* @__PURE__ */ jsx31(SheetOverlayBase, {}),
-  /* @__PURE__ */ jsxs20(
+var SheetContentBase = React21.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs21(SheetPortalBase, { children: [
+  /* @__PURE__ */ jsx32(SheetOverlayBase, {}),
+  /* @__PURE__ */ jsxs21(
     SheetPrimitive.Content,
     {
       ref,
       className: cn(sheetVariants({ side }), className),
       ...props,
       children: [
-        /* @__PURE__ */ jsxs20(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
-          /* @__PURE__ */ jsx31(XIcon3, { className: "h-4 w-4" }),
-          /* @__PURE__ */ jsx31("span", { className: "sr-only", children: "Close" })
+        /* @__PURE__ */ jsxs21(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary", children: [
+          /* @__PURE__ */ jsx32(XIcon3, { className: "h-4 w-4" }),
+          /* @__PURE__ */ jsx32("span", { className: "sr-only", children: "Close" })
         ] }),
         children
       ]
@@ -3106,7 +3288,7 @@ SheetContentBase.displayName = SheetPrimitive.Content.displayName;
 var SheetHeaderBase = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx31(
+}) => /* @__PURE__ */ jsx32(
   "div",
   {
     className: cn(
@@ -3120,7 +3302,7 @@ SheetHeaderBase.displayName = "SheetHeaderBase";
 var SheetFooterBase = ({
   className,
   ...props
-}) => /* @__PURE__ */ jsx31(
+}) => /* @__PURE__ */ jsx32(
   "div",
   {
     className: cn(
@@ -3131,7 +3313,7 @@ var SheetFooterBase = ({
   }
 );
 SheetFooterBase.displayName = "SheetFooterBase";
-var SheetTitleBase = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
+var SheetTitleBase = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
   SheetPrimitive.Title,
   {
     ref,
@@ -3140,7 +3322,7 @@ var SheetTitleBase = React20.forwardRef(({ className, ...props }, ref) => /* @__
   }
 ));
 SheetTitleBase.displayName = SheetPrimitive.Title.displayName;
-var SheetDescriptionBase = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx31(
+var SheetDescriptionBase = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx32(
   SheetPrimitive.Description,
   {
     ref,
@@ -3151,16 +3333,16 @@ var SheetDescriptionBase = React20.forwardRef(({ className, ...props }, ref) =>
 SheetDescriptionBase.displayName = SheetPrimitive.Description.displayName;
 
 // src/components/ui/SidebarBase.tsx
-import * as React22 from "react";
+import * as React23 from "react";
 import { Slot as Slot5 } from "@radix-ui/react-slot";
-import { cva as cva4 } from "class-variance-authority";
+import { cva as cva5 } from "class-variance-authority";
 
 // src/hooks/use-mobile.tsx
-import * as React21 from "react";
+import * as React22 from "react";
 var MOBILE_BREAKPOINT = 768;
 function useIsMobile() {
-  const [isMobile, setIsMobile] = React21.useState(void 0);
-  React21.useEffect(() => {
+  const [isMobile, setIsMobile] = React22.useState(void 0);
+  React22.useEffect(() => {
     const mql = window.matchMedia(`(max-width: ${MOBILE_BREAKPOINT - 1}px)`);
     const onChange = () => {
       setIsMobile(window.innerWidth < MOBILE_BREAKPOINT);
@@ -3173,12 +3355,12 @@ function useIsMobile() {
 }
 
 // src/components/ui/SkeletonBase.tsx
-import { jsx as jsx32 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 function SkeletonBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsx33(
     "div",
     {
       className: cn("animate-pulse  bg-primary/10", className),
@@ -3189,16 +3371,16 @@ function SkeletonBase({
 
 // src/components/ui/SidebarBase.tsx
 import { SidebarSimpleIcon } from "@phosphor-icons/react";
-import { jsx as jsx33, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs22 } from "react/jsx-runtime";
 var SIDEBAR_COOKIE_NAME = "sidebar:state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = "16rem";
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_WIDTH_ICON = "3rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarContext = React22.createContext(null);
+var SidebarContext = React23.createContext(null);
 function UseSideBarBase() {
-  const context = React22.useContext(SidebarContext);
+  const context = React23.useContext(SidebarContext);
   if (!context) {
     throw new Error(
       "UseSideBarBase must be used within a SidebarProviderBase."
@@ -3206,7 +3388,7 @@ function UseSideBarBase() {
   }
   return context;
 }
-var SidebarProviderBase = React22.forwardRef(
+var SidebarProviderBase = React23.forwardRef(
   ({
     defaultOpen = true,
     open: openProp,
@@ -3217,10 +3399,10 @@ var SidebarProviderBase = React22.forwardRef(
     ...props
   }, ref) => {
     const isMobile = useIsMobile();
-    const [openMobile, setOpenMobile] = React22.useState(false);
-    const [_open, _setOpen] = React22.useState(defaultOpen);
+    const [openMobile, setOpenMobile] = React23.useState(false);
+    const [_open, _setOpen] = React23.useState(defaultOpen);
     const open = openProp ?? _open;
-    const setOpen = React22.useCallback(
+    const setOpen = React23.useCallback(
       (value) => {
         const openState = typeof value === "function" ? value(open) : value;
         if (setOpenProp) {
@@ -3232,10 +3414,10 @@ var SidebarProviderBase = React22.forwardRef(
       },
       [setOpenProp, open]
     );
-    const toggleSidebar = React22.useCallback(() => {
+    const toggleSidebar = React23.useCallback(() => {
       return isMobile ? setOpenMobile((open2) => !open2) : setOpen((open2) => !open2);
     }, [isMobile, setOpen, setOpenMobile]);
-    React22.useEffect(() => {
+    React23.useEffect(() => {
       const handleKeyDown = (event) => {
         if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
           event.preventDefault();
@@ -3246,7 +3428,7 @@ var SidebarProviderBase = React22.forwardRef(
       return () => window.removeEventListener("keydown", handleKeyDown);
     }, [toggleSidebar]);
     const state = open ? "expanded" : "collapsed";
-    const contextValue = React22.useMemo(
+    const contextValue = React23.useMemo(
       () => ({
         state,
         open,
@@ -3258,7 +3440,7 @@ var SidebarProviderBase = React22.forwardRef(
       }),
       [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
     );
-    return /* @__PURE__ */ jsx33(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx33(TooltipProviderBase, { delayDuration: 0, children: /* @__PURE__ */ jsx33(
+    return /* @__PURE__ */ jsx34(SidebarContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx34(TooltipProviderBase, { delayDuration: 0, children: /* @__PURE__ */ jsx34(
       "div",
       {
         style: {
@@ -3278,7 +3460,7 @@ var SidebarProviderBase = React22.forwardRef(
   }
 );
 SidebarProviderBase.displayName = "SidebarProviderBase";
-var SidebarBase = React22.forwardRef(
+var SidebarBase = React23.forwardRef(
   ({
     side = "left",
     variant = "sidebar",
@@ -3289,7 +3471,7 @@ var SidebarBase = React22.forwardRef(
   }, ref) => {
     const { isMobile, state, openMobile, setOpenMobile } = UseSideBarBase();
     if (collapsible === "none") {
-      return /* @__PURE__ */ jsx33(
+      return /* @__PURE__ */ jsx34(
         "div",
         {
           className: cn(
@@ -3303,7 +3485,7 @@ var SidebarBase = React22.forwardRef(
       );
     }
     if (isMobile) {
-      return /* @__PURE__ */ jsx33(SheetBase, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsx33(
+      return /* @__PURE__ */ jsx34(SheetBase, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: /* @__PURE__ */ jsx34(
         SheetContentBase,
         {
           "data-sidebar": "sidebar",
@@ -3313,11 +3495,11 @@ var SidebarBase = React22.forwardRef(
             "--sidebar-width": SIDEBAR_WIDTH_MOBILE
           },
           side,
-          children: /* @__PURE__ */ jsx33("div", { className: "flex h-full w-full flex-col", children })
+          children: /* @__PURE__ */ jsx34("div", { className: "flex h-full w-full flex-col", children })
         }
       ) });
     }
-    return /* @__PURE__ */ jsxs21(
+    return /* @__PURE__ */ jsxs22(
       "div",
       {
         ref,
@@ -3327,7 +3509,7 @@ var SidebarBase = React22.forwardRef(
         "data-variant": variant,
         "data-side": side,
         children: [
-          /* @__PURE__ */ jsx33(
+          /* @__PURE__ */ jsx34(
             "div",
             {
               className: cn(
@@ -3338,7 +3520,7 @@ var SidebarBase = React22.forwardRef(
               )
             }
           ),
-          /* @__PURE__ */ jsx33(
+          /* @__PURE__ */ jsx34(
             "div",
             {
               className: cn(
@@ -3349,7 +3531,7 @@ var SidebarBase = React22.forwardRef(
                 className
               ),
               ...props,
-              children: /* @__PURE__ */ jsx33(
+              children: /* @__PURE__ */ jsx34(
                 "div",
                 {
                   "data-sidebar": "sidebar",
@@ -3365,9 +3547,9 @@ var SidebarBase = React22.forwardRef(
   }
 );
 SidebarBase.displayName = "SidebarBase";
-var SidebarTriggerBase = React22.forwardRef(({ className, onClick, ...props }, ref) => {
+var SidebarTriggerBase = React23.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggleSidebar } = UseSideBarBase();
-  return /* @__PURE__ */ jsx33("div", { children: /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsx34("div", { children: /* @__PURE__ */ jsxs22(
     ButtonBase,
     {
       ref,
@@ -3381,16 +3563,16 @@ var SidebarTriggerBase = React22.forwardRef(({ className, onClick, ...props }, r
       },
       ...props,
       children: [
-        /* @__PURE__ */ jsx33("span", { className: "sr-only", children: "Toggle SidebarBase" }),
-        /* @__PURE__ */ jsx33(SidebarSimpleIcon, {})
+        /* @__PURE__ */ jsx34("span", { className: "sr-only", children: "Toggle SidebarBase" }),
+        /* @__PURE__ */ jsx34(SidebarSimpleIcon, {})
       ]
     }
   ) });
 });
 SidebarTriggerBase.displayName = "SidebarTriggerBase";
-var SidebarRailBase = React22.forwardRef(({ className, ...props }, ref) => {
+var SidebarRailBase = React23.forwardRef(({ className, ...props }, ref) => {
   const { toggleSidebar } = UseSideBarBase();
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     "button",
     {
       ref,
@@ -3413,8 +3595,8 @@ var SidebarRailBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarRailBase.displayName = "SidebarRailBase";
-var SidebarInsetBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarInsetBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     "main",
     {
       ref,
@@ -3428,8 +3610,8 @@ var SidebarInsetBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarInsetBase.displayName = "SidebarInsetBase";
-var SidebarInputBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarInputBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     InputBase,
     {
       ref,
@@ -3443,8 +3625,8 @@ var SidebarInputBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarInputBase.displayName = "SidebarInputBase";
-var SidebarHeaderBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarHeaderBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     "div",
     {
       ref,
@@ -3455,8 +3637,8 @@ var SidebarHeaderBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarHeaderBase.displayName = "SidebarHeaderBase";
-var SidebarFooterBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarFooterBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     "div",
     {
       ref,
@@ -3467,8 +3649,8 @@ var SidebarFooterBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarFooterBase.displayName = "SidebarFooterBase";
-var SidebarSeparatorBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarSeparatorBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     SeparatorBase,
     {
       ref,
@@ -3479,8 +3661,8 @@ var SidebarSeparatorBase = React22.forwardRef(({ className, ...props }, ref) =>
   );
 });
 SidebarSeparatorBase.displayName = "SidebarSeparatorBase";
-var SidebarContentBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarContentBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     "div",
     {
       ref,
@@ -3494,8 +3676,8 @@ var SidebarContentBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarContentBase.displayName = "SidebarContentBase";
-var SidebarGroupBase = React22.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx33(
+var SidebarGroupBase = React23.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx34(
     "div",
     {
       ref,
@@ -3506,9 +3688,9 @@ var SidebarGroupBase = React22.forwardRef(({ className, ...props }, ref) => {
   );
 });
 SidebarGroupBase.displayName = "SidebarGroupBase";
-var SidebarGroupLabelBase = React22.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupLabelBase = React23.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? Slot5 : "div";
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     Comp,
     {
       ref,
@@ -3523,9 +3705,9 @@ var SidebarGroupLabelBase = React22.forwardRef(({ className, asChild = false, ..
   );
 });
 SidebarGroupLabelBase.displayName = "SidebarGroupLabelBase";
-var SidebarGroupActionBase = React22.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupActionBase = React23.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? Slot5 : "button";
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     Comp,
     {
       ref,
@@ -3542,7 +3724,7 @@ var SidebarGroupActionBase = React22.forwardRef(({ className, asChild = false, .
   );
 });
 SidebarGroupActionBase.displayName = "SidebarGroupActionBase";
-var SidebarGroupContentBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SidebarGroupContentBase = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   "div",
   {
     ref,
@@ -3552,7 +3734,7 @@ var SidebarGroupContentBase = React22.forwardRef(({ className, ...props }, ref)
   }
 ));
 SidebarGroupContentBase.displayName = "SidebarGroupContentBase";
-var SidebarMenuBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SidebarMenuBase = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   "ul",
   {
     ref,
@@ -3562,7 +3744,7 @@ var SidebarMenuBase = React22.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 SidebarMenuBase.displayName = "SidebarMenuBase";
-var SidebarMenuItemBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SidebarMenuItemBase = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   "li",
   {
     ref,
@@ -3572,7 +3754,7 @@ var SidebarMenuItemBase = React22.forwardRef(({ className, ...props }, ref) => /
   }
 ));
 SidebarMenuItemBase.displayName = "SidebarMenuItemBase";
-var sidebarMenuButtonVariants = cva4(
+var sidebarMenuButtonVariants = cva5(
   "peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-none ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-[[data-sidebar=menu-action]]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:!size-8 group-data-[collapsible=icon]:!p-2 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0",
   {
     variants: {
@@ -3592,7 +3774,7 @@ var sidebarMenuButtonVariants = cva4(
     }
   }
 );
-var SidebarMenuButtonBase = React22.forwardRef(
+var SidebarMenuButtonBase = React23.forwardRef(
   ({
     asChild = false,
     isActive = false,
@@ -3604,7 +3786,7 @@ var SidebarMenuButtonBase = React22.forwardRef(
   }, ref) => {
     const Comp = asChild ? Slot5 : "button";
     const { isMobile, state } = UseSideBarBase();
-    const button = /* @__PURE__ */ jsx33(
+    const button = /* @__PURE__ */ jsx34(
       Comp,
       {
         ref,
@@ -3623,9 +3805,9 @@ var SidebarMenuButtonBase = React22.forwardRef(
         children: tooltip
       };
     }
-    return /* @__PURE__ */ jsxs21(TooltipBase, { children: [
-      /* @__PURE__ */ jsx33(TooltipTriggerBase, { asChild: true, children: button }),
-      /* @__PURE__ */ jsx33(
+    return /* @__PURE__ */ jsxs22(TooltipBase, { children: [
+      /* @__PURE__ */ jsx34(TooltipTriggerBase, { asChild: true, children: button }),
+      /* @__PURE__ */ jsx34(
         TooltipContentBase,
         {
           side: "right",
@@ -3638,9 +3820,9 @@ var SidebarMenuButtonBase = React22.forwardRef(
   }
 );
 SidebarMenuButtonBase.displayName = "SidebarMenuButtonBase";
-var SidebarMenuActionBase = React22.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+var SidebarMenuActionBase = React23.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
   const Comp = asChild ? Slot5 : "button";
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     Comp,
     {
       ref,
@@ -3661,7 +3843,7 @@ var SidebarMenuActionBase = React22.forwardRef(({ className, asChild = false, sh
   );
 });
 SidebarMenuActionBase.displayName = "SidebarMenuActionBase";
-var SidebarMenuBadgeBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SidebarMenuBadgeBase = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   "div",
   {
     ref,
@@ -3679,11 +3861,11 @@ var SidebarMenuBadgeBase = React22.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SidebarMenuBadgeBase.displayName = "SidebarMenuBadgeBase";
-var SidebarMenuSkeletonBase = React22.forwardRef(({ className, showIcon = false, ...props }, ref) => {
-  const width = React22.useMemo(() => {
+var SidebarMenuSkeletonBase = React23.forwardRef(({ className, showIcon = false, ...props }, ref) => {
+  const width = React23.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
-  return /* @__PURE__ */ jsxs21(
+  return /* @__PURE__ */ jsxs22(
     "div",
     {
       ref,
@@ -3691,14 +3873,14 @@ var SidebarMenuSkeletonBase = React22.forwardRef(({ className, showIcon = false,
       className: cn("flex h-8 items-center gap-2 rounded-md px-2", className),
       ...props,
       children: [
-        showIcon && /* @__PURE__ */ jsx33(
+        showIcon && /* @__PURE__ */ jsx34(
           SkeletonBase,
           {
             className: "size-4 rounded-md",
             "data-sidebar": "menu-skeleton-icon"
           }
         ),
-        /* @__PURE__ */ jsx33(
+        /* @__PURE__ */ jsx34(
           SkeletonBase,
           {
             className: "h-4 max-w-[--skeleton-width] flex-1",
@@ -3713,7 +3895,7 @@ var SidebarMenuSkeletonBase = React22.forwardRef(({ className, showIcon = false,
   );
 });
 SidebarMenuSkeletonBase.displayName = "SidebarMenuSkeletonBase";
-var SidebarMenuSubBase = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
+var SidebarMenuSubBase = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx34(
   "ul",
   {
     ref,
@@ -3727,11 +3909,11 @@ var SidebarMenuSubBase = React22.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 SidebarMenuSubBase.displayName = "SidebarMenuSubBase";
-var SidebarMenuSubItemBase = React22.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx33("li", { ref, ...props }));
+var SidebarMenuSubItemBase = React23.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx34("li", { ref, ...props }));
 SidebarMenuSubItemBase.displayName = "SidebarMenuSubItemBase";
-var SidebarMenuSubButtonBase = React22.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
+var SidebarMenuSubButtonBase = React23.forwardRef(({ asChild = false, size = "md", isActive, className, ...props }, ref) => {
   const Comp = asChild ? Slot5 : "a";
-  return /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsx34(
     Comp,
     {
       ref,
@@ -3753,10 +3935,10 @@ var SidebarMenuSubButtonBase = React22.forwardRef(({ asChild = false, size = "md
 SidebarMenuSubButtonBase.displayName = "SidebarMenuSubButtonBase";
 
 // src/components/ui/SliderBase.tsx
-import * as React23 from "react";
+import * as React24 from "react";
 import * as SliderPrimitive from "@radix-ui/react-slider";
-import { jsx as jsx34, jsxs as jsxs22 } from "react/jsx-runtime";
-var SlideBase = React23.forwardRef(
+import { jsx as jsx35, jsxs as jsxs23 } from "react/jsx-runtime";
+var SlideBase = React24.forwardRef(
   ({
     className,
     orientation = "horizontal",
@@ -3766,7 +3948,7 @@ var SlideBase = React23.forwardRef(
     ...props
   }, ref) => {
     const isVertical = orientation === "vertical";
-    return /* @__PURE__ */ jsxs22(
+    return /* @__PURE__ */ jsxs23(
       "div",
       {
         className: cn(
@@ -3774,8 +3956,8 @@ var SlideBase = React23.forwardRef(
           isVertical ? "h-full " : "w-full"
         ),
         children: [
-          label && /* @__PURE__ */ jsx34(LabelBase_default, { className: "py-2", children: label }),
-          /* @__PURE__ */ jsxs22(
+          label && /* @__PURE__ */ jsx35(LabelBase_default, { className: "py-2", children: label }),
+          /* @__PURE__ */ jsxs23(
             "div",
             {
               className: cn(
@@ -3783,8 +3965,8 @@ var SlideBase = React23.forwardRef(
                 isVertical ? "flex-col  h-full" : "flex-row items-center w-full"
               ),
               children: [
-                leftIcon && /* @__PURE__ */ jsx34("div", { className: "flex items-center justify-center", children: leftIcon }),
-                /* @__PURE__ */ jsxs22(
+                leftIcon && /* @__PURE__ */ jsx35("div", { className: "flex items-center justify-center", children: leftIcon }),
+                /* @__PURE__ */ jsxs23(
                   SliderPrimitive.Root,
                   {
                     ref,
@@ -3796,14 +3978,14 @@ var SlideBase = React23.forwardRef(
                     ),
                     ...props,
                     children: [
-                      /* @__PURE__ */ jsx34(
+                      /* @__PURE__ */ jsx35(
                         SliderPrimitive.Track,
                         {
                           className: cn(
                             "relative overflow-hidden bg-primary/20 rounded-full",
                             isVertical ? "w-1.5 h-full" : "h-1.5 w-full"
                           ),
-                          children: /* @__PURE__ */ jsx34(
+                          children: /* @__PURE__ */ jsx35(
                             SliderPrimitive.Range,
                             {
                               className: cn(
@@ -3814,7 +3996,7 @@ var SlideBase = React23.forwardRef(
                           )
                         }
                       ),
-                      /* @__PURE__ */ jsx34(
+                      /* @__PURE__ */ jsx35(
                         SliderPrimitive.Thumb,
                         {
                           className: cn(
@@ -3827,7 +4009,7 @@ var SlideBase = React23.forwardRef(
                     ]
                   }
                 ),
-                rightIcon && /* @__PURE__ */ jsx34("div", { className: "flex items-center justify-center", children: rightIcon })
+                rightIcon && /* @__PURE__ */ jsx35("div", { className: "flex items-center justify-center", children: rightIcon })
               ]
             }
           )
@@ -3847,10 +4029,10 @@ import {
   SpinnerIcon
 } from "@phosphor-icons/react";
 import { Toaster as Sonner, toast as sonnertoast } from "sonner";
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 var iconBaseClass = "w-5 h-auto";
 var Toaster = ({ testId, ...props }) => {
-  return /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsx36(
     Sonner,
     {
       className: "toaster group",
@@ -3897,33 +4079,33 @@ var Toaster = ({ testId, ...props }) => {
 };
 var toast = {
   success: (message) => sonnertoast.success(message, {
-    icon: /* @__PURE__ */ jsx35(CheckCircleIcon, { className: `${iconBaseClass} text-green-600`, weight: "fill" }),
+    icon: /* @__PURE__ */ jsx36(CheckCircleIcon, { className: `${iconBaseClass} text-green-600`, weight: "fill" }),
     className: "sonner-success"
   }),
   error: (message) => sonnertoast.error(message, {
-    icon: /* @__PURE__ */ jsx35(XCircleIcon, { className: `${iconBaseClass} text-red-600`, weight: "fill" }),
+    icon: /* @__PURE__ */ jsx36(XCircleIcon, { className: `${iconBaseClass} text-red-600`, weight: "fill" }),
     className: "sonner-error"
   }),
   warning: (message) => sonnertoast.warning(message, {
-    icon: /* @__PURE__ */ jsx35(WarningIcon, { className: `${iconBaseClass} text-yellow-600`, weight: "fill" }),
+    icon: /* @__PURE__ */ jsx36(WarningIcon, { className: `${iconBaseClass} text-yellow-600`, weight: "fill" }),
     className: "sonner-WarningIcon"
   }),
   info: (message) => sonnertoast.info(message, {
-    icon: /* @__PURE__ */ jsx35(InfoIcon, { className: `${iconBaseClass} text-blue-600`, weight: "fill" }),
+    icon: /* @__PURE__ */ jsx36(InfoIcon, { className: `${iconBaseClass} text-blue-600`, weight: "fill" }),
     className: "sonner-InfoIcon"
   }),
   loading: (message) => sonnertoast(message, {
-    icon: /* @__PURE__ */ jsx35(SpinnerIcon, { className: `${iconBaseClass} animate-spin text-neutral-500`, weight: "fill" }),
+    icon: /* @__PURE__ */ jsx36(SpinnerIcon, { className: `${iconBaseClass} animate-spin text-neutral-500`, weight: "fill" }),
     className: "sonner-loading"
   })
 };
 
 // src/components/ui/SwitchBase.tsx
-import * as React24 from "react";
+import * as React25 from "react";
 import * as SwitchPrimitives from "@radix-ui/react-switch";
-import { jsx as jsx36 } from "react/jsx-runtime";
-var SwitchBase = React24.forwardRef(({ className, testid: dataTestId = "switch-base", ...props }, ref) => {
-  return /* @__PURE__ */ jsx36(
+import { jsx as jsx37 } from "react/jsx-runtime";
+var SwitchBase = React25.forwardRef(({ className, testid: dataTestId = "switch-base", ...props }, ref) => {
+  return /* @__PURE__ */ jsx37(
     SwitchPrimitives.Root,
     {
       ...props,
@@ -3933,7 +4115,7 @@ var SwitchBase = React24.forwardRef(({ className, testid: dataTestId = "switch-b
         className
       ),
       "data-testid": dataTestId,
-      children: /* @__PURE__ */ jsx36(
+      children: /* @__PURE__ */ jsx37(
         SwitchPrimitives.Thumb,
         {
           className: cn(
@@ -3951,9 +4133,9 @@ var SwitchBase = React24.forwardRef(({ className, testid: dataTestId = "switch-b
 SwitchBase.displayName = SwitchPrimitives.Root.displayName;
 
 // src/components/ui/TableBase.tsx
-import * as React25 from "react";
-import { jsx as jsx37 } from "react/jsx-runtime";
-var TableBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx37(
+import * as React26 from "react";
+import { jsx as jsx38 } from "react/jsx-runtime";
+var TableBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38("div", { className: "relative w-full overflow-auto", children: /* @__PURE__ */ jsx38(
   "table",
   {
     ref,
@@ -3962,9 +4144,9 @@ var TableBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE_
   }
 ) }));
 TableBase.displayName = "TableBase";
-var TableHeaderBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
+var TableHeaderBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38("thead", { ref, className: cn("[&_tr]:border-b", className), ...props }));
 TableHeaderBase.displayName = "TableHeaderBase";
-var TableBodyBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
+var TableBodyBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
   "tbody",
   {
     ref,
@@ -3973,7 +4155,7 @@ var TableBodyBase = React25.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 TableBodyBase.displayName = "TableBodyBase";
-var TableFooterBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
+var TableFooterBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
   "tfoot",
   {
     ref,
@@ -3985,7 +4167,7 @@ var TableFooterBase = React25.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 TableFooterBase.displayName = "TableFooterBase";
-var TableRowBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
+var TableRowBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
   "tr",
   {
     ref,
@@ -3997,7 +4179,7 @@ var TableRowBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 TableRowBase.displayName = "TableRowBase";
-var TableHeadBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
+var TableHeadBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
   "th",
   {
     ref,
@@ -4009,7 +4191,7 @@ var TableHeadBase = React25.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 TableHeadBase.displayName = "TableHeadBase";
-var TableCellBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
+var TableCellBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
   "td",
   {
     ref,
@@ -4021,7 +4203,7 @@ var TableCellBase = React25.forwardRef(({ className, ...props }, ref) => /* @__P
   }
 ));
 TableCellBase.displayName = "TableCellBase";
-var TableCaptionBase = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx37(
+var TableCaptionBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
   "caption",
   {
     ref,
@@ -4032,11 +4214,11 @@ var TableCaptionBase = React25.forwardRef(({ className, ...props }, ref) => /* @
 TableCaptionBase.displayName = "TableCaptionBase";
 
 // src/components/ui/TabsBase.tsx
-import * as React26 from "react";
+import * as React27 from "react";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-import { jsx as jsx38 } from "react/jsx-runtime";
+import { jsx as jsx39 } from "react/jsx-runtime";
 var TabsBase = TabsPrimitive.Root;
-var TabsListBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var TabsListBase = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   TabsPrimitive.List,
   {
     ref,
@@ -4048,7 +4230,7 @@ var TabsListBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 TabsListBase.displayName = TabsPrimitive.List.displayName;
-var TabsTriggerBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var TabsTriggerBase = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   TabsPrimitive.Trigger,
   {
     ref,
@@ -4066,7 +4248,7 @@ var TabsTriggerBase = React26.forwardRef(({ className, ...props }, ref) => /* @_
     ...props
   }
 ));
-var TabsContentBase = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx38(
+var TabsContentBase = React27.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx39(
   TabsPrimitive.Content,
   {
     ref,
@@ -4081,10 +4263,10 @@ var TabsContentBase = React26.forwardRef(({ className, ...props }, ref) => /* @_
 TabsContentBase.displayName = TabsPrimitive.Content.displayName;
 
 // src/components/ui/TextAreaBase.tsx
-import * as React27 from "react";
-import { jsx as jsx39 } from "react/jsx-runtime";
-var TextAreaBase = React27.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx39(
+import * as React28 from "react";
+import { jsx as jsx40 } from "react/jsx-runtime";
+var TextAreaBase = React28.forwardRef(({ className, ...props }, ref) => {
+  return /* @__PURE__ */ jsx40(
     "textarea",
     {
       className: cn(
@@ -4102,8 +4284,8 @@ TextAreaBase.displayName = "TextAreaBase";
 import { CheckIcon as CheckIcon6, MoonIcon, SunIcon } from "@phosphor-icons/react";
 
 // src/components/theme-provider.tsx
-import { createContext as createContext3, useContext as useContext4, useEffect as useEffect5, useState as useState6 } from "react";
-import { jsx as jsx40 } from "react/jsx-runtime";
+import { createContext as createContext3, useContext as useContext4, useEffect as useEffect6, useState as useState6 } from "react";
+import { jsx as jsx41 } from "react/jsx-runtime";
 var initialState = {
   theme: "system",
   setTheme: () => null
@@ -4116,7 +4298,7 @@ function ThemeProviderBase({
   ...props
 }) {
   const [theme, setThemeState] = useState6(defaultTheme);
-  useEffect5(() => {
+  useEffect6(() => {
     const root = window.document.documentElement;
     root.classList.remove(
       "light",
@@ -4142,7 +4324,7 @@ function ThemeProviderBase({
       document.body.style.color = "";
     }
   }, [theme]);
-  useEffect5(() => {
+  useEffect6(() => {
     const stored = localStorage.getItem(storageKey);
     if (stored) setThemeState(stored);
   }, [storageKey]);
@@ -4153,7 +4335,7 @@ function ThemeProviderBase({
     setThemeState(newTheme);
   };
   const value = { theme, setTheme };
-  return /* @__PURE__ */ jsx40(ThemeProviderContext.Provider, { ...props, value, children });
+  return /* @__PURE__ */ jsx41(ThemeProviderContext.Provider, { ...props, value, children });
 }
 var useTheme = () => {
   const context = useContext4(ThemeProviderContext);
@@ -4163,7 +4345,7 @@ var useTheme = () => {
 };
 
 // src/components/mode-toggle.tsx
-import { Fragment as Fragment3, jsx as jsx41, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
 var themeLabels = {
   light: "Light",
   dark: "Dark",
@@ -4180,30 +4362,30 @@ function ModeToggleBase({
 }) {
   const { setTheme, theme: currentTheme } = useTheme();
   const isDark = currentTheme?.includes("dark") || currentTheme === "system" && typeof window !== "undefined" && window.matchMedia("(prefers-color-scheme: dark)").matches;
-  return /* @__PURE__ */ jsxs23(DropDownMenuBase, { children: [
-    /* @__PURE__ */ jsx41(DropDownMenuTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs24(DropDownMenuBase, { children: [
+    /* @__PURE__ */ jsx42(DropDownMenuTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs24(
       ButtonBase,
       {
         variant: "ghost",
         size: "icon",
         className: "relative overflow-hidden border-transparent",
         children: [
-          /* @__PURE__ */ jsxs23(Fragment3, { children: [
-            /* @__PURE__ */ jsx41(SunIcon, { className: `h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-90 scale-0" : "rotate-0 scale-100"}` }),
-            /* @__PURE__ */ jsx41(MoonIcon, { className: `absolute h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-0 scale-100" : "rotate-90 scale-0"}` })
+          /* @__PURE__ */ jsxs24(Fragment3, { children: [
+            /* @__PURE__ */ jsx42(SunIcon, { className: `h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-90 scale-0" : "rotate-0 scale-100"}` }),
+            /* @__PURE__ */ jsx42(MoonIcon, { className: `absolute h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-0 scale-100" : "rotate-90 scale-0"}` })
           ] }),
-          /* @__PURE__ */ jsx41("span", { className: "sr-only", children: "Toggle theme" })
+          /* @__PURE__ */ jsx42("span", { className: "sr-only", children: "Toggle theme" })
         ]
       }
     ) }),
-    /* @__PURE__ */ jsx41(DropDownMenuContentBase, { align: "end", className: "border-border bg-popover text-popover-foreground", children: themes.map((theme) => /* @__PURE__ */ jsxs23(
+    /* @__PURE__ */ jsx42(DropDownMenuContentBase, { align: "end", className: "border-border bg-popover text-popover-foreground", children: themes.map((theme) => /* @__PURE__ */ jsxs24(
       DropDownMenuItemBase,
       {
         onClick: () => setTheme(theme),
         className: "flex items-center justify-between hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
         children: [
           themeLabels[theme],
-          currentTheme === theme && /* @__PURE__ */ jsx41(CheckIcon6, { className: "h-4 w-4 opacity-100" })
+          currentTheme === theme && /* @__PURE__ */ jsx42(CheckIcon6, { className: "h-4 w-4 opacity-100" })
         ]
       },
       theme
@@ -4215,114 +4397,101 @@ function ModeToggleBase({
 import { add, format } from "date-fns";
 
 // src/components/date-time-picker/calendar.tsx
-import * as React28 from "react";
+import * as React29 from "react";
 import { DayPicker as DayPicker2 } from "react-day-picker";
-import { CaretLeftIcon as CaretLeftIcon2, CaretRightIcon as CaretRightIcon5, XIcon as XIcon4, CalendarIcon } from "@phosphor-icons/react";
-import { motion as motion6 } from "framer-motion";
-import { jsx as jsx42, jsxs as jsxs24 } from "react/jsx-runtime";
-var variants = {
-  enter: (direction) => ({
-    opacity: 0,
-    x: direction > 0 ? 30 : -30
-  }),
-  center: {
-    opacity: 1,
-    x: 0
-  },
-  exit: (direction) => ({
-    opacity: 0,
-    x: direction > 0 ? -30 : 30
-  })
-};
+import {
+  CaretLeftIcon as CaretLeftIcon2,
+  CaretRightIcon as CaretRightIcon5,
+  XIcon as XIcon4,
+  CalendarIcon
+} from "@phosphor-icons/react";
+import { AnimatePresence as AnimatePresence4 } from "framer-motion";
+import { jsx as jsx43, jsxs as jsxs25 } from "react/jsx-runtime";
 function CalendarBase2({
   className,
   classNames,
   showOutsideDays = true,
   ...props
 }) {
-  const [month, setMonth] = React28.useState(
+  const [month, setMonth] = React29.useState(
     props.month || props.defaultMonth || /* @__PURE__ */ new Date()
   );
-  const [direction, setDirection] = React28.useState(1);
+  const [direction, setDirection] = React29.useState(1);
   const handleMonthChange = (newMonth) => {
     const isNext = newMonth > month ? 1 : -1;
     setDirection(isNext);
     setMonth(newMonth);
     props.onMonthChange?.(newMonth);
   };
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx43(
     "div",
     {
       className: cn(
-        "rounded-xl border bg-background p-3 shadow-sm overflow-hidden",
+        "rounded-2xl border bg-background p-4 shadow-lg overflow-hidden w-full h-full flex flex-col",
         className
       ),
-      children: /* @__PURE__ */ jsx42(
-        motion6.div,
+      children: /* @__PURE__ */ jsx43("div", { className: "relative flex-1 flex flex-col min-h-0", children: /* @__PURE__ */ jsx43(AnimatePresence4, { initial: false, mode: "wait", custom: direction, children: /* @__PURE__ */ jsx43(
+        "div",
         {
-          variants,
-          initial: "enter",
-          animate: "center",
-          exit: "exit",
-          custom: direction,
-          transition: { duration: 0.3, ease: "easeInOut" },
-          style: { position: "relative" },
-          children: /* @__PURE__ */ jsx42(
+          className: "w-full h-full flex flex-col",
+          children: /* @__PURE__ */ jsx43(
             DayPicker2,
             {
               showOutsideDays,
               month,
               onMonthChange: handleMonthChange,
-              className: "w-full",
+              className: "w-full h-full min-w-0 flex flex-col",
               classNames: {
-                months: "flex items-center flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
-                month: "space-y-4",
-                caption: "flex justify-center pt-1 relative items-center",
-                caption_label: "text-sm font-medium",
+                months: "flex items-center flex-col sm:flex-row space-y-2 sm:space-x-2 sm:space-y-0 flex-1",
+                month: "space-y-2 min-w-0 flex-1 flex flex-col",
+                caption: "flex justify-center pt-1 relative items-center h-[10%] min-h-[2rem] mb-2",
+                caption_label: "text-[clamp(0.875rem,2.5vw,1.25rem)] font-semibold truncate px-10 tracking-tight",
                 nav: "space-x-1 flex items-center",
                 nav_button: cn(
                   buttonVariantsBase({ variant: "outline" }),
-                  "h-7 w-7 bg-transparent p-0 opacity-50 hover:opacity-100"
+                  "h-8 w-8 bg-background p-0 opacity-60 hover:opacity-100 hover:bg-muted flex-shrink-0 touch-manipulation transition-all duration-200 ease-out hover:scale-105 active:scale-95",
+                  "[@media(min-width:400px)]:h-9 [@media(min-width:400px)]:w-9"
                 ),
-                nav_button_previous: "absolute left-1",
-                nav_button_next: "absolute right-1",
-                table: "w-full border-collapse space-y-1",
-                head_row: "flex",
-                head_cell: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
-                row: "flex w-full mt-2",
+                nav_button_previous: "absolute left-0",
+                nav_button_next: "absolute right-0",
+                table: "w-full border-collapse min-w-0 flex-1 flex flex-col",
+                head_row: "flex w-full gap-1 mb-1",
+                head_cell: "text-muted-foreground rounded-md flex-1 min-w-0 font-semibold text-[clamp(0.625rem,1.5vw,0.75rem)] text-center pb-1 uppercase tracking-wider",
+                row: "flex w-full flex-1 gap-1",
                 cell: cn(
-                  "h-9 w-9 text-center text-sm p-0 relative",
-                  "[&:has([aria-selected].day-range-end)]:rounded-r-md",
-                  "[&:has([aria-selected].day-range-start)]:rounded-l-md",
+                  "flex-1 min-w-0 aspect-square text-center p-0 relative",
+                  "[&:has([aria-selected].day-range-end)]:rounded-r-lg",
+                  "[&:has([aria-selected].day-range-start)]:rounded-l-lg",
                   "[&:has([aria-selected].day-outside)]:bg-muted/50",
                   "[&:has([aria-selected])]:bg-muted",
-                  "first:[&:has([aria-selected])]:rounded-l-md",
-                  "last:[&:has([aria-selected])]:rounded-r-md",
+                  "first:[&:has([aria-selected])]:rounded-l-lg",
+                  "last:[&:has([aria-selected])]:rounded-r-lg",
                   "focus-within:relative focus-within:z-20"
                 ),
                 day: cn(
                   buttonVariantsBase({ variant: "ghost" }),
-                  "h-9 w-9 p-0 font-normal rounded-md",
-                  "aria-selected:opacity-100 hover:bg-muted"
+                  "w-full h-full p-0 rounded-lg",
+                  "aria-selected:opacity-100 hover:bg-muted text-[clamp(0.75rem,2vw,1rem)] flex items-center justify-center",
+                  "touch-manipulation transition-all duration-200 ease-out hover:scale-105 active:scale-95"
                 ),
-                day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90",
-                day_today: "bg-muted text-foreground dark:bg-muted dark:text-foreground",
-                day_outside: "day-outside text-gray-500 opacity-50 aria-selected:bg-muted/50 aria-selected:text-black",
-                day_disabled: "text-gray-500",
+                day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold",
+                day_today: "bg-muted text-foreground font-bold ring-2 ring-primary/30 ring-inset",
+                day_outside: "day-outside text-muted-foreground/40 opacity-40 aria-selected:bg-muted/50 aria-selected:text-foreground",
+                day_disabled: "text-muted-foreground/30 opacity-40 cursor-not-allowed",
                 day_range_middle: "aria-selected:bg-muted aria-selected:text-foreground",
                 day_hidden: "invisible",
                 ...classNames
               },
               components: {
-                IconLeft: () => /* @__PURE__ */ jsx42(CaretLeftIcon2, { className: "h-4 w-4" }),
-                IconRight: () => /* @__PURE__ */ jsx42(CaretRightIcon5, { className: "h-4 w-4" })
+                IconLeft: () => /* @__PURE__ */ jsx43(CaretLeftIcon2, { className: "h-4 w-4" }),
+                IconRight: () => /* @__PURE__ */ jsx43(CaretRightIcon5, { className: "h-4 w-4" })
               },
               ...props
             }
           )
         },
         month.toISOString()
-      )
+      ) }) })
     }
   );
 }
@@ -4330,14 +4499,15 @@ CalendarBase2.displayName = "CalendarBase";
 
 // src/components/date-time-picker/DateTimePicker.tsx
 import { ptBR } from "date-fns/locale";
-import { useEffect as useEffect6, useState as useState8 } from "react";
+import { useEffect as useEffect7, useState as useState8 } from "react";
 
 // src/components/date-time-picker/TimePicker.tsx
-import { ClockIcon } from "@phosphor-icons/react";
-import * as React30 from "react";
+import { motion as motion6, AnimatePresence as AnimatePresence5 } from "framer-motion";
+import * as React31 from "react";
 
 // src/components/date-time-picker/TimePickerInput.tsx
-import React29 from "react";
+import { CaretUpIcon as CaretUpIcon2, CaretDownIcon as CaretDownIcon4 } from "@phosphor-icons/react";
+import React30 from "react";
 
 // src/components/date-time-picker/time-picker-utils.ts
 function isValidHour(value) {
@@ -4479,8 +4649,8 @@ function display12HourValue(hours) {
 }
 
 // src/components/date-time-picker/TimePickerInput.tsx
-import { jsx as jsx43 } from "react/jsx-runtime";
-var TimePickerInput = React29.forwardRef(
+import { jsx as jsx44, jsxs as jsxs26 } from "react/jsx-runtime";
+var TimePickerInput = React30.forwardRef(
   ({
     className,
     type = "tel",
@@ -4495,11 +4665,14 @@ var TimePickerInput = React29.forwardRef(
     period,
     onLeftFocus,
     onRightFocus,
+    showArrows = true,
+    label,
     ...props
   }, ref) => {
-    const [flag, setFlag] = React29.useState(false);
-    const [prevIntKey, setPrevIntKey] = React29.useState("0");
-    React29.useEffect(() => {
+    const [flag, setFlag] = React30.useState(false);
+    const [prevIntKey, setPrevIntKey] = React30.useState("0");
+    const [isFocused, setIsFocused] = React30.useState(false);
+    React30.useEffect(() => {
       if (flag) {
         const timer = setTimeout(() => {
           setFlag(false);
@@ -4507,7 +4680,7 @@ var TimePickerInput = React29.forwardRef(
         return () => clearTimeout(timer);
       }
     }, [flag]);
-    const calculatedValue = React29.useMemo(() => {
+    const calculatedValue = React30.useMemo(() => {
       return getDateByType(date, picker);
     }, [date, picker]);
     const calculateNewValue = (key) => {
@@ -4517,6 +4690,13 @@ var TimePickerInput = React29.forwardRef(
       }
       return !flag ? "0" + key : calculatedValue.slice(1, 2) + key;
     };
+    const handleArrowClick = (direction) => {
+      const step = direction === "up" ? 1 : -1;
+      const newValue = getArrowByType(calculatedValue, step, picker);
+      if (flag) setFlag(false);
+      const tempDate = new Date(date);
+      setDate(setDateByType(tempDate, newValue, picker, period));
+    };
     const handleKeyDown = (e) => {
       if (e.key === "Tab") return;
       e.preventDefault();
@@ -4538,173 +4718,399 @@ var TimePickerInput = React29.forwardRef(
         setDate(setDateByType(tempDate, newValue, picker, period));
       }
     };
-    return /* @__PURE__ */ jsx43(
-      InputBase,
-      {
-        ref,
-        id: id || picker,
-        name: name || picker,
-        className: cn(
-          "focus:bg-accent focus:text-accent-foreground w-[48px] text-center font-mono text-base tabular-nums caret-transparent [&::-webkit-inner-spin-button]:appearance-none",
-          className
-        ),
-        value: value || calculatedValue,
-        onChange: (e) => {
-          e.preventDefault();
-          onChange?.(e);
-        },
-        type,
-        inputMode: "decimal",
-        onKeyDown: (e) => {
-          onKeyDown?.(e);
-          handleKeyDown(e);
-        },
-        ...props
+    const getPickerLabel = () => {
+      if (label) return label;
+      switch (picker) {
+        case "hours":
+        case "12hours":
+          return "Horas";
+        case "minutes":
+          return "Minutos";
+        case "seconds":
+          return "Segundos";
+        default:
+          return "";
       }
-    );
-  }
-);
-TimePickerInput.displayName = "TimePickerInput";
-
-// src/components/date-time-picker/TimePicker.tsx
-import { jsx as jsx44, jsxs as jsxs25 } from "react/jsx-runtime";
-function TimePicker({ date, setDate, hideSeconds }) {
-  const minuteRef = React30.useRef(null);
-  const hourRef = React30.useRef(null);
-  const secondRef = React30.useRef(null);
-  return /* @__PURE__ */ jsxs25("div", { className: "flex items-end gap-2", children: [
-    /* @__PURE__ */ jsxs25("div", { className: "grid gap-1 text-center", children: [
-      /* @__PURE__ */ jsx44(LabelBase_default, { htmlFor: "hours", className: "text-xs", children: "Horas" }),
-      /* @__PURE__ */ jsx44(
-        TimePickerInput,
-        {
-          picker: "hours",
-          date,
-          setDate,
-          ref: hourRef,
-          onRightFocus: () => minuteRef.current?.focus()
-        }
-      )
-    ] }),
-    /* @__PURE__ */ jsxs25("div", { className: "grid gap-1 text-center", children: [
-      /* @__PURE__ */ jsx44(LabelBase_default, { htmlFor: "minutes", className: "text-xs", children: "Minutos" }),
-      /* @__PURE__ */ jsx44(
-        TimePickerInput,
+    };
+    const getAriaLabel = () => {
+      const baseLabel = getPickerLabel();
+      return `${baseLabel}, valor atual: ${calculatedValue}.`;
+    };
+    return /* @__PURE__ */ jsxs26("div", { className: "relative group flex flex-col items-center", children: [
+      getPickerLabel() && /* @__PURE__ */ jsx44(
+        "label",
         {
-          picker: "minutes",
-          date,
-          setDate,
-          ref: minuteRef,
-          onLeftFocus: () => hourRef.current?.focus(),
-          onRightFocus: () => secondRef.current?.focus()
+          htmlFor: id || picker,
+          className: "text-xs sm:text-sm font-medium text-muted-foreground mb-1 sm:mb-2 select-none",
+          children: getPickerLabel()
         }
-      )
-    ] }),
-    !hideSeconds && /* @__PURE__ */ jsxs25("div", { className: "grid gap-1 text-center", children: [
-      /* @__PURE__ */ jsx44(LabelBase_default, { htmlFor: "seconds", className: "text-xs", children: "Segundos" }),
-      /* @__PURE__ */ jsx44(
-        TimePickerInput,
+      ),
+      /* @__PURE__ */ jsxs26(
+        "div",
         {
-          picker: "seconds",
-          date,
-          setDate,
-          ref: secondRef,
-          onLeftFocus: () => minuteRef.current?.focus()
+          className: cn(
+            "relative flex flex-col items-center",
+            "transition-all duration-200"
+          ),
+          children: [
+            showArrows && /* @__PURE__ */ jsx44(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleArrowClick("up"),
+                className: cn(
+                  "flex items-center justify-center w-10 sm:w-12 h-5 sm:h-6 mb-1",
+                  "rounded-t",
+                  "bg-background hover:bg-accent active:bg-accent/80 transition-colors",
+                  "text-muted-foreground hover:text-foreground",
+                  "focus:outline-none focus:ring-1 focus:ring-ring",
+                  "touch-manipulation",
+                  isFocused && "border-ring"
+                ),
+                tabIndex: -1,
+                "aria-label": `Incrementar ${getPickerLabel().toLowerCase()}`,
+                children: /* @__PURE__ */ jsx44(CaretUpIcon2, { size: 14, className: "sm:w-4 sm:h-4" })
+              }
+            ),
+            /* @__PURE__ */ jsxs26("div", { className: "relative", children: [
+              /* @__PURE__ */ jsx44(
+                "input",
+                {
+                  ref,
+                  id: id || picker,
+                  name: name || picker,
+                  className: cn(
+                    "w-16 sm:w-20 h-10 sm:h-12 text-center font-mono text-lg sm:text-xl font-semibold",
+                    "border-2 rounded-lg",
+                    "bg-background text-foreground",
+                    "transition-all duration-200",
+                    "focus:outline-none focus:ring-2 focus:ring-ring focus:border-ring",
+                    "selection:bg-primary selection:text-primary-foreground",
+                    "touch-manipulation",
+                    showArrows && "rounded-lg",
+                    isFocused && "ring-2 ring-ring border-ring shadow-md",
+                    className
+                  ),
+                  value: value || calculatedValue,
+                  onChange: (e) => {
+                    e.preventDefault();
+                    onChange?.(e);
+                  },
+                  onFocus: (e) => {
+                    setIsFocused(true);
+                    props.onFocus?.(e);
+                    e.target.select();
+                  },
+                  onBlur: (e) => {
+                    setIsFocused(false);
+                    props.onBlur?.(e);
+                  },
+                  type,
+                  inputMode: "decimal",
+                  onKeyDown: (e) => {
+                    onKeyDown?.(e);
+                    handleKeyDown(e);
+                  },
+                  "aria-label": getAriaLabel(),
+                  "aria-describedby": `${id || picker}-help`,
+                  autoComplete: "off",
+                  spellCheck: false,
+                  ...props
+                }
+              ),
+              isFocused && /* @__PURE__ */ jsx44("div", { className: "absolute inset-0 rounded-lg ring-2 ring-primary/20 pointer-events-none animate-pulse" })
+            ] }),
+            showArrows && /* @__PURE__ */ jsx44(
+              "button",
+              {
+                type: "button",
+                onClick: () => handleArrowClick("down"),
+                className: cn(
+                  "flex items-center justify-center w-10 sm:w-12 h-5 sm:h-6 mt-1",
+                  "rounded-b",
+                  "bg-background hover:bg-accent active:bg-accent/80 transition-colors",
+                  "text-muted-foreground hover:text-foreground",
+                  "focus:outline-none focus:ring-1 focus:ring-ring",
+                  "touch-manipulation",
+                  isFocused && "border-ring"
+                ),
+                tabIndex: -1,
+                "aria-label": `Decrementar ${getPickerLabel().toLowerCase()}`,
+                children: /* @__PURE__ */ jsx44(CaretDownIcon4, { size: 14, className: "sm:w-4 sm:h-4" })
+              }
+            )
+          ]
         }
       )
-    ] }),
-    /* @__PURE__ */ jsx44("div", { className: "flex h-10 items-center", children: /* @__PURE__ */ jsx44(ClockIcon, { className: "ml-2 h-4 w-4" }) })
-  ] });
-}
+    ] });
+  }
+);
+TimePickerInput.displayName = "TimePickerInput";
 
-// src/components/date-time-picker/DateTimePicker.tsx
-import { CalendarIcon as CalendarIcon2 } from "@phosphor-icons/react";
-import { Fragment as Fragment4, jsx as jsx45, jsxs as jsxs26 } from "react/jsx-runtime";
-function DateTimePicker({
-  label,
+// src/components/date-time-picker/TimePicker.tsx
+import { Fragment as Fragment4, jsx as jsx45, jsxs as jsxs27 } from "react/jsx-runtime";
+function TimePicker({
   date,
-  onChange,
+  setDate,
   hideSeconds,
-  fromDate,
-  toDate,
-  disabled,
-  dialogTitle
+  enableButton
+}) {
+  const minuteRef = React31.useRef(null);
+  const hourRef = React31.useRef(null);
+  const secondRef = React31.useRef(null);
+  const containerVariants = {
+    hidden: { opacity: 0, y: 10 },
+    visible: {
+      opacity: 1,
+      y: 0,
+      transition: {
+        duration: 0.3,
+        staggerChildren: 0.1
+      }
+    }
+  };
+  const itemVariants2 = {
+    hidden: { opacity: 0, y: 10 },
+    visible: { opacity: 1, y: 0 }
+  };
+  return /* @__PURE__ */ jsxs27(
+    motion6.div,
+    {
+      variants: containerVariants,
+      initial: "hidden",
+      animate: "visible",
+      className: "flex items-end justify-center gap-2 sm:gap-3 p-2 sm:p-3 md:p-4 rounded-lg bg-muted/20 border border-border/50 w-full max-w-full overflow-hidden",
+      children: [
+        /* @__PURE__ */ jsx45(
+          motion6.div,
+          {
+            variants: itemVariants2,
+            className: "grid gap-1 sm:gap-2 text-center flex-shrink-0 min-w-0",
+            children: /* @__PURE__ */ jsx45(
+              TimePickerInput,
+              {
+                picker: "hours",
+                date,
+                setDate,
+                ref: hourRef,
+                onRightFocus: () => minuteRef.current?.focus(),
+                enableButton
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx45(
+          motion6.div,
+          {
+            variants: itemVariants2,
+            className: "grid gap-1 sm:gap-2 text-center flex-shrink-0 min-w-0",
+            children: /* @__PURE__ */ jsx45(
+              TimePickerInput,
+              {
+                picker: "minutes",
+                date,
+                setDate,
+                ref: minuteRef,
+                onLeftFocus: () => hourRef.current?.focus(),
+                onRightFocus: () => secondRef.current?.focus(),
+                enableButton
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx45(AnimatePresence5, { children: !hideSeconds && /* @__PURE__ */ jsx45(Fragment4, { children: /* @__PURE__ */ jsx45(
+          motion6.div,
+          {
+            variants: itemVariants2,
+            initial: "hidden",
+            animate: "visible",
+            exit: "hidden",
+            className: "grid gap-1 sm:gap-2 text-center flex-shrink-0 min-w-0",
+            children: /* @__PURE__ */ jsx45(
+              TimePickerInput,
+              {
+                picker: "seconds",
+                date,
+                setDate,
+                ref: secondRef,
+                onLeftFocus: () => minuteRef.current?.focus(),
+                enableButton
+              }
+            )
+          }
+        ) }) })
+      ]
+    }
+  );
+}
+
+// src/components/date-time-picker/DateTimePicker.tsx
+import { CalendarBlankIcon, ClockIcon } from "@phosphor-icons/react";
+import { jsx as jsx46, jsxs as jsxs28 } from "react/jsx-runtime";
+function DateTimePicker({
+  label,
+  date,
+  onChange,
+  hideSeconds,
+  hideHour,
+  hideMinute,
+  fromDate,
+  toDate,
+  disabled,
+  className
 }) {
   const [internalDate, setInternalDate] = useState8(date);
+  const [open, setOpen] = useState8(false);
+  const [timePickerOpen, setTimePickerOpen] = useState8(false);
   const handleSelect = (newDay) => {
     if (!newDay) return;
     if (!internalDate) {
       setInternalDate(newDay);
+      onChange(newDay);
       return;
     }
     const diff = newDay.getTime() - internalDate.getTime();
     const diffInDays = diff / (1e3 * 60 * 60 * 24);
     const newDateFull = add(internalDate, { days: Math.ceil(diffInDays) });
     setInternalDate(newDateFull);
+    onChange(newDateFull);
   };
-  const [open, setOpen] = useState8(false);
-  useEffect6(() => {
+  const handleTimeChange = (newDate) => {
+    setInternalDate(newDate);
+    onChange(newDate);
+  };
+  const getTimeFormat = () => {
+    if (hideHour && hideMinute) return "";
+    if (hideHour) return hideSeconds ? "mm" : "mm:ss";
+    if (hideMinute) return hideSeconds ? "HH" : "HH':00'";
+    return hideSeconds ? "HH:mm" : "HH:mm:ss";
+  };
+  const getDisplayFormat = () => {
+    const timeFormat = getTimeFormat();
+    if (!timeFormat) return "PPP";
+    return `PPP - ${timeFormat}`;
+  };
+  useEffect7(() => {
     if (date) {
       setInternalDate(date);
     }
   }, [date, open]);
-  return /* @__PURE__ */ jsxs26(Fragment4, { children: [
-    label && /* @__PURE__ */ jsx45(LabelBase_default, { className: "mb-[-1rem] pl-2", children: label }),
-    /* @__PURE__ */ jsxs26(DialogBase, { open, onOpenChange: setOpen, children: [
-      /* @__PURE__ */ jsx45(DialogTriggerBase, { disabled, asChild: true, children: /* @__PURE__ */ jsxs26(
+  return /* @__PURE__ */ jsxs28("div", { className: cn("space-y-2 w-full sm:w-auto", className), children: [
+    label && /* @__PURE__ */ jsx46(LabelBase_default, { children: label }),
+    /* @__PURE__ */ jsxs28(PopoverBase, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx46(PopoverTriggerBase, { disabled, asChild: true, children: /* @__PURE__ */ jsxs28(
         ButtonBase,
         {
-          variant: "default",
+          variant: "outline",
           size: "lg",
           className: cn(
-            "w-full justify-start text-left font-normal text-zinc-950",
+            "w-full justify-start text-left min-w-0 overflow-hidden",
+            "min-h-[44px] sm:min-h-[48px] px-3 sm:px-4",
+            "text-sm sm:text-base",
             !date && "text-muted-foreground"
           ),
           children: [
-            date ? format(date, "PPP - HH:mm", { locale: ptBR }) : /* @__PURE__ */ jsx45("span", { className: "text-zinc-400", children: "Pick a date" }),
-            /* @__PURE__ */ jsx45(CalendarIcon2, { className: "ml-auto text-gray-500", size: 24 })
+            /* @__PURE__ */ jsx46("span", { className: "truncate flex-1", children: date ? format(date, getDisplayFormat(), { locale: ptBR }) : "Pick a date" }),
+            /* @__PURE__ */ jsx46(CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
           ]
         }
       ) }),
-      /* @__PURE__ */ jsxs26(DialogContentBase, { children: [
-        /* @__PURE__ */ jsx45(DialogHeaderBase, { children: /* @__PURE__ */ jsx45(DialogTitleBase, { className: "text-xl font-semibold", children: dialogTitle ?? "Selecione a data" }) }),
-        /* @__PURE__ */ jsx45(
-          CalendarBase2,
-          {
-            mode: "single",
-            locale: ptBR,
-            selected: internalDate,
-            onSelect: (d) => handleSelect(d),
-            initialFocus: true,
-            fromDate,
-            toDate
-          }
-        ),
-        /* @__PURE__ */ jsx45("div", { className: "border-border flex justify-center border-t p-3", children: /* @__PURE__ */ jsx45(
-          TimePicker,
-          {
-            setDate: setInternalDate,
-            date: internalDate,
-            hideSeconds
-          }
-        ) }),
-        /* @__PURE__ */ jsx45(
-          ButtonBase,
-          {
-            onClick: () => {
-              onChange(internalDate);
-              setOpen(false);
-            },
-            children: "Salvar"
-          }
-        )
-      ] })
+      /* @__PURE__ */ jsx46(
+        PopoverContentBase,
+        {
+          className: "w-full p-0",
+          align: "center",
+          sideOffset: 4,
+          side: "bottom",
+          avoidCollisions: true,
+          collisionPadding: 8,
+          children: /* @__PURE__ */ jsxs28("div", { className: "flex flex-col space-y-2 sm:space-y-3 p-2 sm:p-3 md:p-4 max-h-[calc(100vh-4rem)] overflow-y-auto", children: [
+            /* @__PURE__ */ jsx46(
+              CalendarBase2,
+              {
+                mode: "single",
+                locale: ptBR,
+                selected: internalDate,
+                onSelect: (d) => handleSelect(d),
+                initialFocus: true,
+                fromDate,
+                toDate,
+                className: "w-full"
+              }
+            ),
+            !(hideHour && hideMinute) && /* @__PURE__ */ jsx46("div", { className: "flex justify-center w-full px-2", children: /* @__PURE__ */ jsxs28(
+              PopoverBase,
+              {
+                open: timePickerOpen,
+                onOpenChange: setTimePickerOpen,
+                children: [
+                  /* @__PURE__ */ jsx46(PopoverTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs28(
+                    ButtonBase,
+                    {
+                      variant: "outline",
+                      size: "default",
+                      className: cn(
+                        "flex items-center justify-center gap-1.5 sm:gap-2",
+                        "px-2 sm:px-3 py-1.5 sm:py-2",
+                        "text-sm sm:text-base font-semibold w-full max-w-xs",
+                        "border-2 border-primary/20 rounded-lg",
+                        "bg-primary/5 hover:bg-primary/10 hover:border-primary/30",
+                        "transition-all duration-200",
+                        "shadow-sm hover:shadow-md active:scale-[0.98]",
+                        "min-h-[36px] sm:min-h-[40px]"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx46(ClockIcon, { className: "text-primary/70 flex-shrink-0 w-4 h-4 sm:w-5 sm:h-5" }),
+                        /* @__PURE__ */ jsx46("span", { className: "text-foreground truncate", children: internalDate ? format(internalDate, getTimeFormat() || "HH:mm", {
+                          locale: ptBR
+                        }) : "00:00" })
+                      ]
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx46(
+                    PopoverContentBase,
+                    {
+                      className: "w-[calc(100vw-2rem)] max-w-sm p-3 sm:p-3 rounded-md",
+                      align: "center",
+                      side: "top",
+                      sideOffset: 8,
+                      avoidCollisions: true,
+                      collisionPadding: 8,
+                      children: /* @__PURE__ */ jsxs28("div", { className: "flex flex-col items-center space-y-2 sm:space-y-3", children: [
+                        /* @__PURE__ */ jsx46("h4", { className: "text-sm sm:text-base font-medium text-center", children: "Alterar Hor\xE1rio" }),
+                        /* @__PURE__ */ jsx46(
+                          TimePicker,
+                          {
+                            setDate: handleTimeChange,
+                            date: internalDate,
+                            hideSeconds
+                          }
+                        ),
+                        /* @__PURE__ */ jsx46(
+                          ButtonBase,
+                          {
+                            size: "sm",
+                            variant: "destructive",
+                            onClick: () => setTimePickerOpen(false),
+                            className: "w-full text-xs sm:text-sm min-h-[36px] sm:min-h-[40px]",
+                            children: "Fechar"
+                          }
+                        )
+                      ] })
+                    }
+                  )
+                ]
+              }
+            ) })
+          ] })
+        }
+      )
     ] })
   ] });
 }
 
 // src/components/selects/Select.tsx
-import { Fragment as Fragment5, jsx as jsx46, jsxs as jsxs27 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx47, jsxs as jsxs29 } from "react/jsx-runtime";
 function Select({
   items,
   groupItems,
@@ -4713,9 +5119,9 @@ function Select({
   errorMessage,
   testIds = {}
 }) {
-  return /* @__PURE__ */ jsxs27("div", { "data-testid": testIds.root ?? "select-root", children: [
-    /* @__PURE__ */ jsxs27(SelectBase, { onValueChange: onChange, "data-testid": testIds.base ?? "select-base", children: [
-      /* @__PURE__ */ jsx46(
+  return /* @__PURE__ */ jsxs29("div", { "data-testid": testIds.root ?? "select-root", children: [
+    /* @__PURE__ */ jsxs29(SelectBase, { onValueChange: onChange, "data-testid": testIds.base ?? "select-base", children: [
+      /* @__PURE__ */ jsx47(
         SelectTriggerBase,
         {
           className: cn(
@@ -4723,7 +5129,7 @@ function Select({
             errorMessage && "border-red-500"
           ),
           "data-testid": testIds.trigger ?? "select-trigger",
-          children: /* @__PURE__ */ jsx46(
+          children: /* @__PURE__ */ jsx47(
             SelectValueBase,
             {
               placeholder,
@@ -4732,9 +5138,9 @@ function Select({
           )
         }
       ),
-      /* @__PURE__ */ jsx46(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ jsx46(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ jsx46(Fragment5, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ jsxs27(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: [
-        /* @__PURE__ */ jsx46(SelectLabelBase, { "data-testid": testIds.label ?? "select-label", children: key }),
-        groupItems[key].map((item) => /* @__PURE__ */ jsx46(
+      /* @__PURE__ */ jsx47(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ jsx47(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ jsx47(Fragment5, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ jsxs29(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: [
+        /* @__PURE__ */ jsx47(SelectLabelBase, { "data-testid": testIds.label ?? "select-label", children: key }),
+        groupItems[key].map((item) => /* @__PURE__ */ jsx47(
           SelectItemBase,
           {
             value: item.value,
@@ -4743,7 +5149,7 @@ function Select({
           },
           item.value
         ))
-      ] }, key)) }) : /* @__PURE__ */ jsx46(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: items.map((item) => /* @__PURE__ */ jsx46(
+      ] }, key)) }) : /* @__PURE__ */ jsx47(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: items.map((item) => /* @__PURE__ */ jsx47(
         SelectItemBase,
         {
           value: item.value,
@@ -4753,7 +5159,7 @@ function Select({
         item.value
       )) }) }) })
     ] }),
-    errorMessage && /* @__PURE__ */ jsx46(
+    errorMessage && /* @__PURE__ */ jsx47(
       "p",
       {
         className: "text-sm text-red-500",
@@ -4765,9 +5171,9 @@ function Select({
 }
 
 // src/components/ui/DestructiveDialog.tsx
-import * as React31 from "react";
+import * as React32 from "react";
 import { XCircleIcon as XCircleIcon2 } from "@phosphor-icons/react";
-import { jsx as jsx47, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs30 } from "react/jsx-runtime";
 var DestructiveDialog = ({
   title,
   description,
@@ -4778,10 +5184,10 @@ var DestructiveDialog = ({
 }) => {
   const titleId = "destructive-dialog-title";
   const descriptionId = "destructive-dialog-description";
-  const triggerEl = React31.isValidElement(children) ? /* @__PURE__ */ jsx47(AlertDialogTriggerBase, { asChild: true, children }) : /* @__PURE__ */ jsx47(AlertDialogTriggerBase, { children: /* @__PURE__ */ jsx47(ButtonBase, { variant: "destructive", children: triggerContent ?? "Excluir" }) });
-  return /* @__PURE__ */ jsxs28(AlertDialogBase, { children: [
+  const triggerEl = React32.isValidElement(children) ? /* @__PURE__ */ jsx48(AlertDialogTriggerBase, { asChild: true, children }) : /* @__PURE__ */ jsx48(AlertDialogTriggerBase, { children: /* @__PURE__ */ jsx48(ButtonBase, { variant: "destructive", children: triggerContent ?? "Excluir" }) });
+  return /* @__PURE__ */ jsxs30(AlertDialogBase, { children: [
     triggerEl,
-    /* @__PURE__ */ jsxs28(
+    /* @__PURE__ */ jsxs30(
       AlertDialogContentBase,
       {
         role: "alertdialog",
@@ -4790,10 +5196,10 @@ var DestructiveDialog = ({
         "aria-describedby": descriptionId,
         className: cn("border border-destructive bg-background"),
         children: [
-          /* @__PURE__ */ jsxs28("div", { className: "flex items-start gap-4", children: [
-            /* @__PURE__ */ jsx47("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ jsx47(XCircleIcon2, { className: "w-6 h-6 text-destructive" }) }),
-            /* @__PURE__ */ jsxs28("div", { className: "flex-1", children: [
-              /* @__PURE__ */ jsx47(
+          /* @__PURE__ */ jsxs30("div", { className: "flex items-start gap-4", children: [
+            /* @__PURE__ */ jsx48("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ jsx48(XCircleIcon2, { className: "w-6 h-6 text-destructive" }) }),
+            /* @__PURE__ */ jsxs30("div", { className: "flex-1", children: [
+              /* @__PURE__ */ jsx48(
                 AlertDialogTitleBase,
                 {
                   id: titleId,
@@ -4801,7 +5207,7 @@ var DestructiveDialog = ({
                   children: title
                 }
               ),
-              /* @__PURE__ */ jsx47(
+              /* @__PURE__ */ jsx48(
                 AlertDialogDescriptionBase,
                 {
                   id: descriptionId,
@@ -4811,8 +5217,8 @@ var DestructiveDialog = ({
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsxs28(AlertDialogFooterBase, { className: "mt-2 flex justify-end gap-3", children: [
-            /* @__PURE__ */ jsx47(
+          /* @__PURE__ */ jsxs30(AlertDialogFooterBase, { className: "mt-2 flex justify-end gap-3", children: [
+            /* @__PURE__ */ jsx48(
               AlertDialogCancelBase,
               {
                 onClick: onCancel,
@@ -4823,7 +5229,7 @@ var DestructiveDialog = ({
                 children: "Cancelar"
               }
             ),
-            /* @__PURE__ */ jsx47(
+            /* @__PURE__ */ jsx48(
               AlertDialogActionBase,
               {
                 onClick: onConfirm,
@@ -4839,6 +5245,1467 @@ var DestructiveDialog = ({
     )
   ] });
 };
+
+// src/components/charts/components/controls/PeriodsDropdown.tsx
+import { useState as useState9, useRef as useRef2, useEffect as useEffect8 } from "react";
+import { motion as motion7, AnimatePresence as AnimatePresence6 } from "framer-motion";
+import { DotsThreeIcon as DotsThreeIcon2 } from "@phosphor-icons/react/dist/ssr";
+import { Check } from "@phosphor-icons/react/dist/ssr";
+import { jsx as jsx49, jsxs as jsxs31 } from "react/jsx-runtime";
+var menuVariants = {
+  hidden: { opacity: 0, y: -6, scale: 0.98 },
+  visible: { opacity: 1, y: 0, scale: 1 },
+  exit: { opacity: 0, y: -6, scale: 0.98 }
+};
+var itemVariants = {
+  hidden: { opacity: 0, x: -6 },
+  visible: { opacity: 1, x: 0 }
+};
+function PeriodsDropdown({
+  processedData,
+  onOpenPeriod,
+  rightOffset,
+  topOffset,
+  activePeriod,
+  activePeriods
+}) {
+  const periods = processedData.map((d) => String(d.name));
+  const [open, setOpen] = useState9(false);
+  const wrapperRef = useRef2(null);
+  const firstItemRef = useRef2(null);
+  const listRef = useRef2(null);
+  useEffect8(() => {
+    const handleClickOutside = (e) => {
+      if (!wrapperRef.current) return;
+      if (!wrapperRef.current.contains(e.target)) setOpen(false);
+    };
+    const handleEscape = (e) => {
+      if (e.key === "Escape") setOpen(false);
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    document.addEventListener("keydown", handleEscape);
+    return () => {
+      document.removeEventListener("mousedown", handleClickOutside);
+      document.removeEventListener("keydown", handleEscape);
+    };
+  }, []);
+  useEffect8(() => {
+    if (open && firstItemRef.current) {
+      firstItemRef.current.focus();
+    }
+  }, [open]);
+  function handleSelect(p) {
+    onOpenPeriod(p);
+    setOpen(false);
+  }
+  const containerStyle = typeof rightOffset === "number" ? { position: "relative", zIndex: 30 } : { position: "relative", zIndex: 30 };
+  return /* @__PURE__ */ jsxs31("div", { ref: wrapperRef, style: containerStyle, className: "mr-4", children: [
+    /* @__PURE__ */ jsxs31(
+      "button",
+      {
+        className: "relative p-2.5 rounded-md hover:bg-accent/10 focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-accent/50 transition flex items-center justify-center",
+        "aria-expanded": open,
+        "aria-haspopup": "menu",
+        "aria-controls": "periods-menu",
+        onClick: () => setOpen((v) => !v),
+        onKeyDown: (e) => {
+          if (e.key === "ArrowDown") setOpen(true);
+          if (e.key === "Enter" || e.key === " ") {
+            e.preventDefault();
+            setOpen((v) => !v);
+          }
+        },
+        title: open ? "Fechar lista de per\xEDodos" : "Abrir lista de per\xEDodos",
+        children: [
+          /* @__PURE__ */ jsx49(DotsThreeIcon2, { size: 18 }),
+          /* @__PURE__ */ jsx49("span", { className: "sr-only", children: open ? "Fechar per\xEDodos" : "Abrir per\xEDodos" }),
+          periods.length > 0 && /* @__PURE__ */ jsx49("span", { className: "absolute -top-1 -right-1 bg-accent text-foreground text-xs rounded-full w-5 h-5 flex items-center justify-center ring-1 ring-border", children: periods.length })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx49(AnimatePresence6, { children: open && /* @__PURE__ */ jsxs31(
+      motion7.div,
+      {
+        initial: "hidden",
+        animate: "visible",
+        exit: "exit",
+        variants: menuVariants,
+        transition: { type: "spring", stiffness: 500, damping: 30 },
+        className: "bg-card border border-border rounded-lg shadow-lg overflow-hidden ring-1 ring-black/5",
+        style: {
+          minWidth: 200,
+          maxHeight: 260,
+          overflow: "hidden",
+          position: "absolute",
+          top: typeof topOffset === "number" ? topOffset : "calc(100% + 6px)",
+          right: typeof rightOffset === "number" ? rightOffset : 0
+        },
+        role: "menu",
+        "aria-orientation": "vertical",
+        id: "periods-menu",
+        children: [
+          /* @__PURE__ */ jsx49("div", { className: "px-3 py-2 text-sm font-medium text-muted-foreground", children: "Per\xEDodos" }),
+          /* @__PURE__ */ jsx49("div", { className: "h-px bg-border" }),
+          /* @__PURE__ */ jsx49(
+            "div",
+            {
+              ref: listRef,
+              className: "flex flex-col p-2 gap-1",
+              style: { maxHeight: 200, overflowY: "auto" },
+              children: periods.map((p, idx) => /* @__PURE__ */ jsxs31(
+                motion7.button,
+                {
+                  className: "flex items-center justify-between w-full text-left px-3 py-2.5 rounded focus:outline-none transition-colors " + (activePeriods && activePeriods.includes(p) || p === activePeriod ? "bg-accent/10 font-medium" : "hover:bg-accent/15 focus-visible:ring-2 focus-visible:ring-accent/30"),
+                  variants: itemVariants,
+                  initial: "hidden",
+                  animate: "visible",
+                  whileTap: { scale: 0.98 },
+                  onClick: () => handleSelect(p),
+                  ref: idx === 0 ? firstItemRef : void 0,
+                  role: "menuitem",
+                  "aria-checked": activePeriods && activePeriods.includes(p) || p === activePeriod,
+                  children: [
+                    /* @__PURE__ */ jsx49("span", { className: "truncate", children: p }),
+                    (activePeriods && activePeriods.includes(p) || p === activePeriod) && /* @__PURE__ */ jsx49("span", { className: "ml-2 text-primary flex items-center", children: /* @__PURE__ */ jsx49(Check, { size: 16, weight: "bold" }) })
+                  ]
+                },
+                p
+              ))
+            }
+          )
+        ]
+      }
+    ) })
+  ] });
+}
+var PeriodsDropdown_default = PeriodsDropdown;
+
+// src/components/charts/components/controls/ShowOnly.tsx
+import { motion as motion8 } from "framer-motion";
+import { Eye, EyeSlash } from "@phosphor-icons/react";
+import { Fragment as Fragment6, jsx as jsx50, jsxs as jsxs32 } from "react/jsx-runtime";
+var ShowOnly = ({
+  showOnlyHighlighted,
+  setShowOnlyHighlighted,
+  highlightedSeriesSize
+}) => {
+  const hasHighlights = highlightedSeriesSize > 0;
+  if (!hasHighlights) return null;
+  return /* @__PURE__ */ jsx50("div", { className: "ml-auto flex items-center gap-2", children: /* @__PURE__ */ jsx50(
+    motion8.div,
+    {
+      whileTap: { scale: hasHighlights ? 0.985 : 1 },
+      whileHover: { y: hasHighlights ? -2 : 0 },
+      children: /* @__PURE__ */ jsx50(
+        ButtonBase,
+        {
+          variant: "secondary",
+          onClick: () => hasHighlights && setShowOnlyHighlighted((v) => !v),
+          "aria-pressed": showOnlyHighlighted,
+          "aria-label": showOnlyHighlighted ? "Exibir todos" : "Mostrar somente destacados",
+          title: showOnlyHighlighted ? "Exibir todos" : "Mostrar somente destacados",
+          disabled: !hasHighlights,
+          className: cn(
+            "flex items-center justify-center gap-2 text-sm h-8 min-w-[2rem] px-2.5 rounded-md transition-shadow",
+            "focus:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-primary/60",
+            !hasHighlights ? "opacity-60 cursor-not-allowed pointer-events-none" : showOnlyHighlighted ? "bg-primary/10 text-primary shadow-sm border border-primary/20" : "bg-transparent text-muted-foreground border border-transparent hover:bg-muted/10 hover:text-foreground"
+          ),
+          children: showOnlyHighlighted ? /* @__PURE__ */ jsxs32(Fragment6, { children: [
+            /* @__PURE__ */ jsx50(EyeSlash, { size: 16, weight: "regular" }),
+            /* @__PURE__ */ jsx50("span", { className: "sr-only", children: "Exibir todos" })
+          ] }) : /* @__PURE__ */ jsxs32(Fragment6, { children: [
+            /* @__PURE__ */ jsx50(Eye, { size: 16, weight: "bold" }),
+            /* @__PURE__ */ jsx50("span", { className: "sr-only", children: "Mostrar somente destacados" })
+          ] })
+        }
+      )
+    }
+  ) });
+};
+var ShowOnly_default = ShowOnly;
+
+// src/components/charts/components/controls/Highlights.tsx
+import { motion as motion9, AnimatePresence as AnimatePresence7 } from "framer-motion";
+import { CheckIcon as CheckIcon7 } from "@phosphor-icons/react/dist/ssr";
+import { jsx as jsx51, jsxs as jsxs33 } from "react/jsx-runtime";
+var Highlights = ({
+  allKeys,
+  mapperConfig,
+  finalColors,
+  highlightedSeries,
+  toggleHighlight,
+  containerWidth
+}) => {
+  const count = allKeys.length || 1;
+  const available = containerWidth && containerWidth > 0 ? containerWidth : 600;
+  const perPill = Math.floor(available / count);
+  const showFullLabel = perPill >= 96;
+  const showShortLabel = perPill >= 64;
+  const containerVariants = {
+    hidden: { opacity: 0 },
+    visible: { opacity: 1, transition: { staggerChildren: 0.03 } }
+  };
+  return /* @__PURE__ */ jsx51(
+    motion9.div,
+    {
+      className: "flex-1 flex items-center gap-2 flex-wrap",
+      initial: "hidden",
+      animate: "visible",
+      variants: containerVariants,
+      children: /* @__PURE__ */ jsx51(AnimatePresence7, { initial: false, mode: "popLayout", children: allKeys.map((k) => {
+        const isHighlighted = highlightedSeries.has(k);
+        const label = mapperConfig[k]?.label ?? k;
+        const color = finalColors[k];
+        const pillClasses = cn(
+          "inline-flex items-center gap-2 px-3 py-1 rounded-full text-sm border transition-all select-none relative overflow-hidden",
+          isHighlighted ? "pr-8" : "",
+          isHighlighted ? "bg-card/95 border-2 text-foreground shadow-[0_6px_18px_rgba(0,0,0,0.12)]" : "bg-muted/10 border-border text-muted-foreground hover:bg-muted/5"
+        );
+        return /* @__PURE__ */ jsx51(
+          motion9.div,
+          {
+            layout: true,
+            initial: "hidden",
+            animate: "visible",
+            exit: "exit",
+            children: /* @__PURE__ */ jsx51(
+              ButtonBase,
+              {
+                asChild: true,
+                variant: "ghost",
+                onClick: () => toggleHighlight(k),
+                title: isHighlighted ? `Desativar ${label}` : `Ativar ${label}`,
+                className: pillClasses,
+                style: { minWidth: showFullLabel ? void 0 : 36 },
+                "aria-pressed": isHighlighted,
+                children: /* @__PURE__ */ jsxs33(
+                  motion9.button,
+                  {
+                    whileHover: { scale: isHighlighted ? 1.04 : 1.03 },
+                    whileTap: { scale: 0.96 },
+                    animate: isHighlighted ? { scale: 1.02 } : { scale: 1 },
+                    className: "flex items-center gap-2 min-w-0 pr-2",
+                    children: [
+                      /* @__PURE__ */ jsx51(
+                        motion9.span,
+                        {
+                          className: cn("w-3 h-3 rounded-sm flex-shrink-0 border"),
+                          style: {
+                            backgroundColor: color,
+                            borderColor: isHighlighted ? color : "transparent",
+                            boxShadow: isHighlighted ? `0 6px 20px ${color}33` : void 0
+                          },
+                          layout: true,
+                          initial: { scale: 0.8, opacity: 0.9 },
+                          animate: { scale: 1, opacity: 1 },
+                          transition: { type: "spring", stiffness: 400, damping: 30 }
+                        }
+                      ),
+                      showFullLabel ? /* @__PURE__ */ jsx51(motion9.span, { className: "truncate max-w-[10rem] pr-2", layout: true, children: label }) : showShortLabel ? /* @__PURE__ */ jsx51(
+                        motion9.span,
+                        {
+                          className: "truncate max-w-[6rem] text-xs pr-2",
+                          layout: true,
+                          children: label
+                        }
+                      ) : null,
+                      /* @__PURE__ */ jsx51(
+                        motion9.span,
+                        {
+                          "aria-hidden": true,
+                          initial: { opacity: 0, scale: 0.6 },
+                          animate: isHighlighted ? { opacity: 1, scale: 1 } : { opacity: 0, scale: 0.6 },
+                          transition: { type: "spring", stiffness: 450, damping: 28 },
+                          className: cn(
+                            "pointer-events-none absolute right-2  -translate-y-1/2 text-xs text-foreground flex items-center justify-center",
+                            isHighlighted ? "" : "opacity-0 pointer-events-none"
+                          ),
+                          style: { width: 18, height: 18 },
+                          children: /* @__PURE__ */ jsx51(CheckIcon7, {})
+                        }
+                      )
+                    ]
+                  }
+                )
+              }
+            )
+          },
+          `pill-${k}`
+        );
+      }) })
+    }
+  );
+};
+var Highlights_default = Highlights;
+
+// src/components/charts/components/controls/CloseAllButton.tsx
+import { XIcon as XIcon5 } from "@phosphor-icons/react/dist/ssr";
+import { jsx as jsx52, jsxs as jsxs34 } from "react/jsx-runtime";
+var CloseAllButton = ({
+  count,
+  onCloseAll,
+  position = "top-center",
+  variant = "floating"
+}) => {
+  if (count <= 1) return null;
+  const getPositionClasses = () => {
+    if (variant === "inline") return "";
+    switch (position) {
+      case "top-left":
+        return "fixed top-6 left-6 z-50";
+      case "top-right":
+        return "fixed top-6 right-6 z-50";
+      case "top-center":
+        return "fixed top-6 left-1/2 transform -translate-x-1/2 z-50";
+      default:
+        return "fixed top-6 left-1/2 transform -translate-x-1/2 z-50";
+    }
+  };
+  const getVariantClasses = () => {
+    if (variant === "inline") {
+      return "text-xs px-2 py-1 h-auto bg-card border border-border shadow-sm hover:bg-accent";
+    }
+    return `
+      rounded-full px-4 py-2.5
+      text-white font-semibold text-sm
+      transition-all duration-200 ease-in-out
+      hover:scale-105 active:scale-95 hover:shadow-2xl
+      flex items-center gap-2.5
+      group
+      min-w-max
+    `;
+  };
+  if (variant === "inline") {
+    return /* @__PURE__ */ jsx52("div", { className: "absolute top-4 right-4 z-30", children: /* @__PURE__ */ jsxs34(
+      ButtonBase,
+      {
+        variant: "ghost",
+        size: "sm",
+        onClick: onCloseAll,
+        className: getVariantClasses(),
+        children: [
+          /* @__PURE__ */ jsx52(XIcon5, { size: 12, className: "mr-1" }),
+          "Fechar Todos"
+        ]
+      }
+    ) });
+  }
+  return /* @__PURE__ */ jsx52(
+    "div",
+    {
+      className: `${getPositionClasses()} animate-in fade-in slide-in-from-top-2 duration-300`,
+      children: /* @__PURE__ */ jsx52("div", { children: /* @__PURE__ */ jsxs34(
+        ButtonBase,
+        {
+          onClick: onCloseAll,
+          size: "sm",
+          className: `bg-red-600 hover:bg-red-700${getVariantClasses()}`,
+          children: [
+            /* @__PURE__ */ jsx52(
+              XIcon5,
+              {
+                size: 18,
+                className: "\n              group-hover:rotate-90 transition-all duration-300 ease-out\n              drop-shadow-sm\n            "
+              }
+            ),
+            /* @__PURE__ */ jsx52("span", { className: "min-w-0 tracking-wide", children: "Fechar Todos" }),
+            /* @__PURE__ */ jsx52("div", { className: "mb-1 mx-2", children: count })
+          ]
+        }
+      ) })
+    }
+  );
+};
+var CloseAllButton_default = CloseAllButton;
+
+// src/components/charts/components/tooltips/DraggableTooltip.tsx
+import React34, {
+  useEffect as useEffect9,
+  useRef as useRef3,
+  useState as useState10,
+  useCallback as useCallback6,
+  useMemo as useMemo5
+} from "react";
+import { motion as motion10, AnimatePresence as AnimatePresence8 } from "framer-motion";
+import { DotsSixVerticalIcon } from "@phosphor-icons/react";
+import { XIcon as XIcon6 } from "@phosphor-icons/react/dist/ssr";
+import { Fragment as Fragment7, jsx as jsx53, jsxs as jsxs35 } from "react/jsx-runtime";
+var ALIGNMENT_THRESHOLD = 25;
+var GUIDE_THRESHOLD = 60;
+var STRONG_SNAP_THRESHOLD = 35;
+var PRECISION_SNAP_THRESHOLD = 8;
+var TOOLTIP_DIMENSIONS = { width: 224, height: 120 };
+var tooltipVariants = {
+  hidden: {
+    opacity: 0,
+    scale: 0.96,
+    transition: { type: "spring", stiffness: 400, damping: 28 }
+  },
+  visible: {
+    opacity: 1,
+    scale: 1,
+    transition: { type: "spring", stiffness: 300, damping: 28 }
+  },
+  exit: {
+    opacity: 0,
+    scale: 0.96,
+    transition: { type: "spring", stiffness: 400, damping: 28 }
+  }
+};
+var guideVariants = {
+  hidden: {
+    opacity: 0,
+    transition: { type: "spring", stiffness: 220, damping: 24 }
+  },
+  visible: {
+    opacity: 0.95,
+    transition: { type: "spring", stiffness: 220, damping: 24 }
+  },
+  exit: {
+    opacity: 0,
+    transition: { type: "spring", stiffness: 220, damping: 24 }
+  }
+};
+var guideDotVariants = {
+  hidden: {
+    scale: 0.6,
+    opacity: 0,
+    transition: { type: "spring", stiffness: 400, damping: 24 }
+  },
+  visible: {
+    scale: 1,
+    opacity: 0.9,
+    transition: { type: "spring", stiffness: 400, damping: 24 }
+  },
+  exit: {
+    opacity: 0,
+    scale: 0.6,
+    transition: { type: "spring", stiffness: 400, damping: 24 }
+  }
+};
+var DraggableTooltipComponent = ({
+  id,
+  data,
+  position,
+  title,
+  dataKeys,
+  finalColors,
+  onMouseDown,
+  onClose,
+  periodLabel = "Per\xEDodo Selecionado",
+  dataLabel = "Dados do Per\xEDodo",
+  showCloseAllButton = false,
+  globalTooltipCount,
+  onCloseAll,
+  closeAllButtonPosition = "top-center",
+  closeAllButtonVariant = "floating",
+  onPositionChange,
+  highlightedSeries,
+  toggleHighlight,
+  showOnlyHighlighted
+}) => {
+  const visibleKeys = useMemo5(
+    () => showOnlyHighlighted && highlightedSeries && highlightedSeries.size > 0 ? dataKeys.filter((k) => highlightedSeries.has(k)) : dataKeys,
+    [showOnlyHighlighted, highlightedSeries, dataKeys]
+  );
+  const TotalDisplay = React34.memo(
+    ({ data: data2, visibleKeys: visibleKeys2 }) => {
+      const total = useMemo5(() => {
+        const numeric = visibleKeys2.map((k) => data2[k]).filter((v) => typeof v === "number");
+        return numeric.reduce((s, v) => s + (v || 0), 0);
+      }, [data2, visibleKeys2]);
+      return /* @__PURE__ */ jsxs35("div", { className: "text-sm", children: [
+        /* @__PURE__ */ jsx53("div", { className: "text-sm text-muted-foreground", children: "Total" }),
+        /* @__PURE__ */ jsx53(
+          "div",
+          {
+            className: `text-base font-semibold ${total < 0 ? "text-destructive" : "text-foreground"}`,
+            children: total.toLocaleString("pt-BR")
+          }
+        )
+      ] });
+    }
+  );
+  const [localPos, setLocalPos] = useState10(position);
+  const [dragging, setDragging] = useState10(false);
+  const offsetRef = useRef3({ x: 0, y: 0 });
+  const lastMouse = useRef3({ x: 0, y: 0 });
+  const [alignmentGuides, setAlignmentGuides] = useState10([]);
+  const [globalTooltipCountLocal, setGlobalTooltipCountLocal] = useState10(0);
+  useEffect9(() => setLocalPos(position), [position]);
+  const getAllTooltips = useCallback6(() => {
+    const response = [];
+    const ev = new CustomEvent("requestGlobalTooltips", {
+      detail: { requesterId: id, response }
+    });
+    window.dispatchEvent(ev);
+    return response;
+  }, [id]);
+  const updateAlignmentGuides = useCallback6(
+    (currentPosition) => {
+      const allTooltips = getAllTooltips();
+      const otherTooltips = allTooltips.filter((t) => t.id !== id);
+      const guides = [];
+      otherTooltips.forEach((tooltip) => {
+        const topDiff = Math.abs(currentPosition.top - tooltip.position.top);
+        if (topDiff <= GUIDE_THRESHOLD) {
+          guides.push({
+            type: "horizontal",
+            position: tooltip.position.top,
+            sourceTooltip: {
+              top: currentPosition.top,
+              left: currentPosition.left,
+              width: TOOLTIP_DIMENSIONS.width,
+              height: TOOLTIP_DIMENSIONS.height
+            },
+            targetTooltip: {
+              top: tooltip.position.top,
+              left: tooltip.position.left,
+              width: TOOLTIP_DIMENSIONS.width,
+              height: TOOLTIP_DIMENSIONS.height
+            }
+          });
+        }
+        const leftDiff = Math.abs(currentPosition.left - tooltip.position.left);
+        if (leftDiff <= GUIDE_THRESHOLD) {
+          guides.push({
+            type: "vertical",
+            position: tooltip.position.left,
+            sourceTooltip: {
+              top: currentPosition.top,
+              left: currentPosition.left,
+              width: TOOLTIP_DIMENSIONS.width,
+              height: TOOLTIP_DIMENSIONS.height
+            },
+            targetTooltip: {
+              top: tooltip.position.top,
+              left: tooltip.position.left,
+              width: TOOLTIP_DIMENSIONS.width,
+              height: TOOLTIP_DIMENSIONS.height
+            }
+          });
+        }
+      });
+      setAlignmentGuides(guides);
+    },
+    [getAllTooltips, id]
+  );
+  const snapToGuides = useCallback6(
+    (position2) => {
+      const snappedPosition = { ...position2 };
+      let hasSnapped = false;
+      alignmentGuides.forEach((guide) => {
+        if (guide.type === "horizontal") {
+          const diff = Math.abs(position2.top - guide.position);
+          if (diff <= PRECISION_SNAP_THRESHOLD) {
+            snappedPosition.top = guide.position;
+            hasSnapped = true;
+          }
+        } else {
+          const diff = Math.abs(position2.left - guide.position);
+          if (diff <= PRECISION_SNAP_THRESHOLD) {
+            snappedPosition.left = guide.position;
+            hasSnapped = true;
+          }
+        }
+      });
+      if (!hasSnapped) {
+        alignmentGuides.forEach((guide) => {
+          if (guide.type === "horizontal") {
+            const diff = Math.abs(position2.top - guide.position);
+            if (diff <= STRONG_SNAP_THRESHOLD)
+              snappedPosition.top = guide.position;
+          } else {
+            const diff = Math.abs(position2.left - guide.position);
+            if (diff <= STRONG_SNAP_THRESHOLD)
+              snappedPosition.left = guide.position;
+          }
+        });
+      }
+      alignmentGuides.forEach((guide) => {
+        if (guide.type === "horizontal") {
+          const diff = Math.abs(position2.top - guide.position);
+          if (diff <= ALIGNMENT_THRESHOLD && snappedPosition.top === position2.top)
+            snappedPosition.top = guide.position;
+        } else {
+          const diff = Math.abs(position2.left - guide.position);
+          if (diff <= ALIGNMENT_THRESHOLD && snappedPosition.left === position2.left)
+            snappedPosition.left = guide.position;
+        }
+      });
+      return snappedPosition;
+    },
+    [alignmentGuides]
+  );
+  useEffect9(() => {
+    let rafId = null;
+    const handleMouseMove = (e) => {
+      if (!dragging) return;
+      lastMouse.current = { x: e.clientX, y: e.clientY };
+      if (rafId) cancelAnimationFrame(rafId);
+      rafId = requestAnimationFrame(() => {
+        const newLeft = lastMouse.current.x - offsetRef.current.x;
+        const newTop = lastMouse.current.y - offsetRef.current.y;
+        const rawPosition = {
+          top: Math.max(0, Math.min(newTop, window.innerHeight - 200)),
+          left: Math.max(0, Math.min(newLeft, window.innerWidth - 250))
+        };
+        updateAlignmentGuides(rawPosition);
+        const snapped = snapToGuides(rawPosition);
+        setLocalPos(snapped);
+        if (onPositionChange) onPositionChange(id, snapped);
+      });
+    };
+    const handleMouseUp = () => {
+      if (dragging) {
+        setDragging(false);
+        setAlignmentGuides([]);
+        if (rafId) cancelAnimationFrame(rafId);
+      }
+    };
+    if (dragging) {
+      document.addEventListener("mousemove", handleMouseMove, {
+        passive: true
+      });
+      document.addEventListener("mouseup", handleMouseUp);
+      document.body.style.cursor = "grabbing";
+      document.body.style.userSelect = "none";
+    }
+    return () => {
+      if (rafId) cancelAnimationFrame(rafId);
+      document.removeEventListener("mousemove", handleMouseMove);
+      document.removeEventListener("mouseup", handleMouseUp);
+      document.body.style.cursor = "";
+      document.body.style.userSelect = "";
+    };
+  }, [dragging, snapToGuides, updateAlignmentGuides, id, onPositionChange]);
+  useEffect9(() => {
+    const handleCloseAll = () => onClose(id);
+    const handleRequestTooltipCount = () => {
+      window.dispatchEvent(
+        new CustomEvent("tooltipCountResponse", { detail: { count: 1 } })
+      );
+    };
+    const handleRequestGlobalTooltips = (event) => {
+      const customEvent = event;
+      const detail = customEvent.detail;
+      if (detail?.response && detail.requesterId && detail.requesterId !== id) {
+        detail.response.push({ id, position: localPos });
+      }
+    };
+    const events = [
+      { name: "closeAllTooltips", handler: handleCloseAll },
+      { name: "requestTooltipCount", handler: handleRequestTooltipCount },
+      {
+        name: "requestGlobalTooltips",
+        handler: handleRequestGlobalTooltips
+      }
+    ];
+    events.forEach(({ name, handler }) => {
+      window.addEventListener(name, handler);
+    });
+    return () => {
+      events.forEach(({ name, handler }) => {
+        window.removeEventListener(name, handler);
+      });
+    };
+  }, [id, localPos, onClose]);
+  useEffect9(() => {
+    if (dragging) return;
+    let total = 0;
+    const timeoutId = setTimeout(() => {
+      const handleCountResponse = (event) => {
+        const customEvent = event;
+        total += customEvent.detail.count || 0;
+      };
+      window.addEventListener("tooltipCountResponse", handleCountResponse);
+      window.dispatchEvent(new CustomEvent("requestTooltipCount"));
+      const cleanupTimeout = setTimeout(() => {
+        window.removeEventListener("tooltipCountResponse", handleCountResponse);
+        setGlobalTooltipCountLocal(total);
+      }, 50);
+      return () => clearTimeout(cleanupTimeout);
+    }, 0);
+    return () => clearTimeout(timeoutId);
+  }, [localPos, dragging]);
+  useEffect9(() => {
+    const recount = () => {
+      if (dragging) return;
+      let total = 0;
+      const handleCountResponse = (event) => {
+        const customEvent = event;
+        total += customEvent.detail.count || 0;
+      };
+      window.addEventListener("tooltipCountResponse", handleCountResponse);
+      window.dispatchEvent(new CustomEvent("requestTooltipCount"));
+      setTimeout(() => {
+        window.removeEventListener("tooltipCountResponse", handleCountResponse);
+        setGlobalTooltipCountLocal(total);
+      }, 50);
+    };
+    window.addEventListener("recountTooltips", recount);
+    return () => window.removeEventListener("recountTooltips", recount);
+  }, [dragging]);
+  const handleMouseDownLocal = useCallback6(
+    (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      const rect = e.currentTarget.getBoundingClientRect();
+      offsetRef.current = { x: e.clientX - rect.left, y: e.clientY - rect.top };
+      setDragging(true);
+      onMouseDown?.(id, e);
+    },
+    [id, onMouseDown]
+  );
+  const handleTouchStartLocal = useCallback6(
+    (e) => {
+      e.stopPropagation();
+      const touch = e.touches[0];
+      if (!touch) return;
+      const rect = e.currentTarget.getBoundingClientRect();
+      offsetRef.current = {
+        x: touch.clientX - rect.left,
+        y: touch.clientY - rect.top
+      };
+      setDragging(true);
+      onMouseDown?.(id, e);
+    },
+    [id, onMouseDown]
+  );
+  const handleCloseClick = useCallback6(
+    (e) => {
+      e.stopPropagation();
+      onClose(id);
+    },
+    [id, onClose]
+  );
+  return /* @__PURE__ */ jsxs35(Fragment7, { children: [
+    dragging && alignmentGuides.map((guide, index) => {
+      const isHorizontal = guide.type === "horizontal";
+      const color = isHorizontal ? "#3b82f6" : "#ef4444";
+      const startX = isHorizontal ? Math.min(
+        guide.sourceTooltip.left + guide.sourceTooltip.width / 2,
+        guide.targetTooltip.left + guide.targetTooltip.width / 2
+      ) : guide.sourceTooltip.left + guide.sourceTooltip.width / 2;
+      const endX = isHorizontal ? Math.max(
+        guide.sourceTooltip.left + guide.sourceTooltip.width / 2,
+        guide.targetTooltip.left + guide.targetTooltip.width / 2
+      ) : guide.targetTooltip.left + guide.targetTooltip.width / 2;
+      const startY = isHorizontal ? guide.sourceTooltip.top + guide.sourceTooltip.height / 2 : Math.min(
+        guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
+        guide.targetTooltip.top + guide.targetTooltip.height / 2
+      );
+      const endY = isHorizontal ? guide.targetTooltip.top + guide.targetTooltip.height / 2 : Math.max(
+        guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
+        guide.targetTooltip.top + guide.targetTooltip.height / 2
+      );
+      return /* @__PURE__ */ jsxs35("div", { children: [
+        /* @__PURE__ */ jsx53(
+          motion10.div,
+          {
+            className: "fixed pointer-events-none z-30",
+            variants: guideVariants,
+            initial: "hidden",
+            animate: "visible",
+            exit: "exit",
+            style: {
+              left: startX,
+              top: startY,
+              width: isHorizontal ? endX - startX : 2,
+              height: isHorizontal ? 2 : endY - startY,
+              backgroundColor: color,
+              boxShadow: `0 0 8px ${color}60`,
+              borderStyle: "dashed",
+              borderWidth: "1px",
+              borderColor: color,
+              transform: "translateZ(0)"
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx53(
+          motion10.div,
+          {
+            className: "fixed pointer-events-none z-31",
+            variants: guideDotVariants,
+            initial: "hidden",
+            animate: "visible",
+            exit: "exit",
+            style: {
+              left: guide.sourceTooltip.left + guide.sourceTooltip.width / 2 - 4,
+              top: guide.sourceTooltip.top + guide.sourceTooltip.height / 2 - 4,
+              width: "8px",
+              height: "8px",
+              backgroundColor: color,
+              borderRadius: "50%",
+              boxShadow: `0 0 4px ${color}80`
+            }
+          }
+        ),
+        /* @__PURE__ */ jsx53(
+          motion10.div,
+          {
+            className: "fixed pointer-events-none z-31",
+            variants: guideDotVariants,
+            initial: "hidden",
+            animate: "visible",
+            exit: "exit",
+            style: {
+              left: guide.targetTooltip.left + guide.targetTooltip.width / 2 - 4,
+              top: guide.targetTooltip.top + guide.targetTooltip.height / 2 - 4,
+              width: "8px",
+              height: "8px",
+              backgroundColor: color,
+              borderRadius: "50%",
+              boxShadow: `0 0 4px ${color}80`
+            }
+          }
+        )
+      ] }, index);
+    }),
+    /* @__PURE__ */ jsx53(AnimatePresence8, { children: /* @__PURE__ */ jsxs35(
+      motion10.div,
+      {
+        className: "fixed bg-card border border-border rounded-lg shadow-lg z-50 min-w-80 select-none",
+        variants: tooltipVariants,
+        initial: "hidden",
+        animate: "visible",
+        exit: "exit",
+        style: {
+          top: localPos.top,
+          left: localPos.left,
+          cursor: dragging ? "grabbing" : "grab",
+          transform: "translateZ(0)"
+        },
+        onClick: (e) => e.stopPropagation(),
+        role: "dialog",
+        "aria-label": title ? `Tooltip ${title}` : `Tooltip ${data.name}`,
+        children: [
+          /* @__PURE__ */ jsxs35(
+            "div",
+            {
+              className: "flex items-center justify-between p-3 pb-2 border-b bg-muted/20 rounded-t-lg",
+              onMouseDown: handleMouseDownLocal,
+              onTouchStart: handleTouchStartLocal,
+              style: { touchAction: "none" },
+              children: [
+                /* @__PURE__ */ jsx53(DotsSixVerticalIcon, { size: 16 }),
+                /* @__PURE__ */ jsx53("div", { className: "flex flex-col gap-1", children: title && /* @__PURE__ */ jsx53("div", { className: "flex items-center gap-2 pb-0.5", children: /* @__PURE__ */ jsx53("p", { className: "font-bold text-foreground text-base", children: title }) }) }),
+                /* @__PURE__ */ jsx53(
+                  "button",
+                  {
+                    onClick: handleCloseClick,
+                    className: "text-muted-foreground hover:text-destructive ml-2 text-sm hover:bg-destructive/10 rounded p-1",
+                    title: "Fechar este tooltip",
+                    children: /* @__PURE__ */ jsx53(XIcon6, { size: 14 })
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx53("div", { className: "px-3 py-2 bg-accent/5 border-l-4 border-primary", children: /* @__PURE__ */ jsxs35("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs35("div", { children: [
+              /* @__PURE__ */ jsx53("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide", children: periodLabel }),
+              /* @__PURE__ */ jsx53("p", { className: "font-bold text-lg text-foreground mt-1 truncate", children: data.name })
+            ] }),
+            /* @__PURE__ */ jsx53("div", { className: "text-right", children: /* @__PURE__ */ jsx53(TotalDisplay, { data, visibleKeys }) })
+          ] }) }),
+          /* @__PURE__ */ jsxs35("div", { className: "p-3 pt-2 space-y-2", children: [
+            /* @__PURE__ */ jsx53("p", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2", children: dataLabel }),
+            useMemo5(
+              () => visibleKeys.map((key) => {
+                const value = data[key];
+                if (value === void 0) return null;
+                const numericKeys = dataKeys.filter(
+                  (k) => typeof data[k] === "number"
+                );
+                const absDenominator = numericKeys.reduce(
+                  (s, k) => s + Math.abs(Number(data[k]) || 0),
+                  0
+                );
+                const val = typeof value === "number" ? value : Number(value) || 0;
+                const pct = absDenominator > 0 ? Math.abs(val) / absDenominator * 100 : 0;
+                const isDimmed = highlightedSeries && highlightedSeries.size > 0 && !highlightedSeries.has(key);
+                const isHighlighted = highlightedSeries && highlightedSeries.has(key);
+                return /* @__PURE__ */ jsxs35(
+                  "div",
+                  {
+                    role: "button",
+                    tabIndex: 0,
+                    onKeyDown: (e) => {
+                      if (e.key === "Enter" || e.key === " ") {
+                        e.preventDefault();
+                        toggleHighlight?.(key);
+                      }
+                    },
+                    onClick: () => toggleHighlight?.(key),
+                    className: `flex flex-col gap-1 text-sm mb-1 p-2 rounded transition-colors cursor-pointer bg-muted/20`,
+                    style: {
+                      boxShadow: isHighlighted ? `0 6px 18px ${finalColors[key] || "#666"}33` : void 0,
+                      border: isHighlighted ? `1px solid ${finalColors[key] || "#666"}22` : void 0
+                    },
+                    children: [
+                      /* @__PURE__ */ jsxs35("div", { className: "flex items-center justify-between", children: [
+                        /* @__PURE__ */ jsxs35("div", { className: "flex items-center gap-2", children: [
+                          /* @__PURE__ */ jsx53(
+                            "div",
+                            {
+                              className: "w-3 h-3 rounded-sm shadow-sm",
+                              style: {
+                                backgroundColor: finalColors[key] || "#666"
+                              }
+                            }
+                          ),
+                          /* @__PURE__ */ jsx53(
+                            "span",
+                            {
+                              className: `font-medium text-foreground truncate`,
+                              children: key.charAt(0).toUpperCase() + key.slice(1)
+                            }
+                          )
+                        ] }),
+                        /* @__PURE__ */ jsxs35("div", { className: "flex items-baseline gap-2", children: [
+                          /* @__PURE__ */ jsx53(
+                            "span",
+                            {
+                              className: `font-semibold tabular-nums ${val < 0 ? "text-destructive" : "text-foreground"}`,
+                              children: val.toLocaleString("pt-BR")
+                            }
+                          ),
+                          /* @__PURE__ */ jsx53("span", { className: "text-xs text-muted-foreground", children: absDenominator > 0 ? `${pct.toFixed(1)}%` : "-" })
+                        ] })
+                      ] }),
+                      /* @__PURE__ */ jsx53("div", { className: "w-full bg-muted rounded-full h-1 overflow-hidden", children: /* @__PURE__ */ jsx53(
+                        "div",
+                        {
+                          className: "h-1 rounded-full",
+                          style: {
+                            width: `${Math.max(0, Math.min(100, pct))}%`,
+                            opacity: isDimmed ? 0.35 : 1,
+                            background: finalColors[key] || "#666",
+                            transition: "none"
+                          }
+                        }
+                      ) })
+                    ]
+                  },
+                  key
+                );
+              }),
+              [
+                visibleKeys,
+                data,
+                dataKeys,
+                highlightedSeries,
+                toggleHighlight,
+                finalColors
+              ]
+            ),
+            /* @__PURE__ */ jsx53("div", { className: "mt-3 pt-2 border-t", children: /* @__PURE__ */ jsxs35("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [
+              "Clique no ",
+              /* @__PURE__ */ jsx53(XIcon6, { size: 12 }),
+              " para remover"
+            ] }) })
+          ] })
+        ]
+      },
+      id
+    ) }),
+    showCloseAllButton && onCloseAll && /* @__PURE__ */ jsx53(
+      CloseAllButton_default,
+      {
+        count: typeof globalTooltipCount === "number" ? globalTooltipCount : globalTooltipCountLocal,
+        onCloseAll,
+        position: closeAllButtonPosition,
+        variant: closeAllButtonVariant
+      }
+    )
+  ] });
+};
+var DraggableTooltip = React34.memo(DraggableTooltipComponent);
+DraggableTooltip.displayName = "DraggableTooltip";
+var DraggableTooltip_default = DraggableTooltip;
+
+// src/components/charts/components/tooltips/TooltipWithTotal.tsx
+import { jsx as jsx54, jsxs as jsxs36 } from "react/jsx-runtime";
+var RechartTooltipWithTotal = ({
+  active,
+  payload,
+  label,
+  finalColors = {},
+  periodLabel = "Per\xEDodo",
+  totalLabel = "Total"
+}) => {
+  if (!active || !payload || payload.length === 0) return null;
+  const numeric = payload.filter(
+    (p) => typeof p.value === "number" && Number.isFinite(p.value)
+  );
+  const total = numeric.reduce((sum, p) => sum + (p.value || 0), 0);
+  const isTotalNegative = total < 0;
+  const absDenominator = numeric.reduce(
+    (sum, p) => sum + Math.abs(typeof p.value === "number" ? p.value : 0),
+    0
+  );
+  return /* @__PURE__ */ jsxs36(
+    "div",
+    {
+      role: "dialog",
+      "aria-label": `Tooltip ${label ?? ""}`,
+      className: "bg-card border border-border rounded-lg p-3 shadow-2xl max-w-xs",
+      style: { minWidth: 220 },
+      children: [
+        /* @__PURE__ */ jsxs36("div", { className: "flex items-start justify-between mb-2", children: [
+          /* @__PURE__ */ jsxs36("div", { className: "pr-2", children: [
+            /* @__PURE__ */ jsx54("p", { className: "text-xs text-muted-foreground", children: periodLabel }),
+            /* @__PURE__ */ jsx54("p", { className: "font-medium text-foreground truncate", children: label })
+          ] }),
+          /* @__PURE__ */ jsxs36("div", { className: "text-right ml-3", children: [
+            /* @__PURE__ */ jsx54("p", { className: "text-xs text-muted-foreground", children: totalLabel }),
+            /* @__PURE__ */ jsx54(
+              "p",
+              {
+                className: `text-sm font-semibold ${isTotalNegative ? "text-rose-500" : "text-foreground"}`,
+                children: total.toLocaleString("pt-BR")
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ jsx54("div", { className: "flex flex-col gap-2", children: payload.map((entry, index) => {
+          const value = typeof entry.value === "number" ? entry.value : 0;
+          const pct = absDenominator > 0 ? Math.abs(value) / absDenominator * 100 : 0;
+          const baseColor = finalColors[entry.dataKey] || entry.color || "#999";
+          const isNeg = value < 0;
+          return /* @__PURE__ */ jsxs36("div", { className: "flex flex-col gap-1", children: [
+            /* @__PURE__ */ jsxs36("div", { className: "flex items-center justify-between text-sm", children: [
+              /* @__PURE__ */ jsxs36("div", { className: "flex items-center gap-2 truncate", children: [
+                /* @__PURE__ */ jsx54(
+                  "span",
+                  {
+                    className: "w-3 h-3 rounded-sm flex-shrink-0",
+                    style: { backgroundColor: baseColor },
+                    "aria-hidden": true
+                  }
+                ),
+                /* @__PURE__ */ jsx54("span", { className: "text-muted-foreground truncate", children: entry.name })
+              ] }),
+              /* @__PURE__ */ jsxs36("div", { className: "flex items-baseline gap-3 ml-3", children: [
+                /* @__PURE__ */ jsx54(
+                  "span",
+                  {
+                    className: `${isNeg ? "text-rose-500" : "text-foreground"} font-medium`,
+                    children: value.toLocaleString("pt-BR")
+                  }
+                ),
+                /* @__PURE__ */ jsx54("span", { className: "text-xs text-muted-foreground", children: absDenominator > 0 ? `${pct.toFixed(1)}%` : "-" })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsx54("div", { className: "w-full bg-muted rounded-full h-1 overflow-hidden", children: /* @__PURE__ */ jsx54(
+              "div",
+              {
+                className: "h-1 rounded-full transition-all duration-300",
+                style: {
+                  width: `${Math.max(0, Math.min(100, pct))}%`,
+                  background: baseColor
+                }
+              }
+            ) })
+          ] }, index);
+        }) })
+      ]
+    }
+  );
+};
+var TooltipWithTotal_default = RechartTooltipWithTotal;
+
+// src/components/charts/components/tooltips/TooltipSimple.tsx
+import { jsx as jsx55, jsxs as jsxs37 } from "react/jsx-runtime";
+var TooltipSimple = ({
+  active,
+  payload,
+  label,
+  finalColors = {},
+  periodLabel = "Per\xEDodo"
+}) => {
+  if (!active || !payload || payload.length === 0) return null;
+  return /* @__PURE__ */ jsxs37(
+    "div",
+    {
+      role: "dialog",
+      "aria-label": `Tooltip ${label ?? ""}`,
+      className: "bg-card border border-border rounded-lg p-3 shadow-2xl max-w-[280px]",
+      style: { minWidth: 220 },
+      children: [
+        /* @__PURE__ */ jsx55("div", { className: "mb-2", children: /* @__PURE__ */ jsx55("div", { className: "flex items-center justify-between gap-3", children: /* @__PURE__ */ jsxs37("div", { className: "min-w-0", children: [
+          /* @__PURE__ */ jsx55("p", { className: "text-xs text-muted-foreground", children: periodLabel }),
+          /* @__PURE__ */ jsx55("p", { className: "font-medium text-foreground truncate", children: label })
+        ] }) }) }),
+        /* @__PURE__ */ jsx55("div", { className: "divide-y divide-border rounded-md overflow-hidden", children: payload.map((entry, index) => {
+          const value = typeof entry.value === "number" ? entry.value : 0;
+          const color = finalColors[entry.dataKey] || entry.color || "#999";
+          return /* @__PURE__ */ jsxs37(
+            "div",
+            {
+              className: "flex items-center justify-between text-sm px-2 py-2 bg-card/0 hover:bg-muted transition-colors",
+              children: [
+                /* @__PURE__ */ jsxs37("div", { className: "flex items-center gap-3 min-w-0", children: [
+                  /* @__PURE__ */ jsx55(
+                    "span",
+                    {
+                      className: "w-3 h-3 rounded-sm flex-shrink-0 border border-border/20",
+                      style: { backgroundColor: color },
+                      "aria-hidden": true
+                    }
+                  ),
+                  /* @__PURE__ */ jsx55("span", { className: "text-muted-foreground truncate", children: entry.name })
+                ] }),
+                /* @__PURE__ */ jsx55("div", { className: "ml-3", children: /* @__PURE__ */ jsx55(
+                  "span",
+                  {
+                    className: `font-medium tabular-nums ${value < 0 ? "text-destructive" : "text-foreground"}`,
+                    children: value.toLocaleString("pt-BR")
+                  }
+                ) })
+              ]
+            },
+            index
+          );
+        }) })
+      ]
+    }
+  );
+};
+var TooltipSimple_default = TooltipSimple;
+
+// src/components/charts/utils/helpers.ts
+var formatFieldName = (fieldName) => {
+  return fieldName.replace(/([A-Z])/g, " $1").replace(/[_-]/g, " ").replace(/\b\w/g, (l) => l.toUpperCase()).trim();
+};
+var detectDataFields = (data, xAxisKey) => {
+  if (!data || data.length === 0) return [];
+  const firstItem = data[0];
+  return Object.keys(firstItem).filter(
+    (key) => key !== xAxisKey && typeof firstItem[key] === "number"
+  );
+};
+var detectXAxis = (data) => {
+  if (!data || data.length === 0) return "name";
+  const firstItem = data[0];
+  const stringFields = Object.keys(firstItem).filter(
+    (key) => typeof firstItem[key] === "string" || typeof firstItem[key] === "number" && String(firstItem[key]).length <= 4
+  );
+  return stringFields[0] || Object.keys(firstItem)[0] || "name";
+};
+var generateAdditionalColors = (baseColors, count) => {
+  const hexToRgb = (hex) => {
+    const clean = hex.replace("#", "");
+    const bigint = parseInt(
+      clean.length === 3 ? clean.split("").map((c) => c + c).join("") : clean,
+      16
+    );
+    return { r: bigint >> 16 & 255, g: bigint >> 8 & 255, b: bigint & 255 };
+  };
+  const rgbToHsl = ({ r, g, b }) => {
+    r /= 255;
+    g /= 255;
+    b /= 255;
+    const max = Math.max(r, g, b), min = Math.min(r, g, b);
+    let h = 0;
+    let s = 0;
+    const l = (max + min) / 2;
+    if (max !== min) {
+      const d = max - min;
+      s = l > 0.5 ? d / (2 - max - min) : d / (max + min);
+      switch (max) {
+        case r:
+          h = (g - b) / d + (g < b ? 6 : 0);
+          break;
+        case g:
+          h = (b - r) / d + 2;
+          break;
+        case b:
+          h = (r - g) / d + 4;
+          break;
+      }
+      h /= 6;
+    }
+    return {
+      h: Math.round(h * 360),
+      s: Math.round(s * 100),
+      l: Math.round(l * 100)
+    };
+  };
+  const hslToHex = (h, s, l) => {
+    s /= 100;
+    l /= 100;
+    const k = (n) => (n + h / 30) % 5;
+    const a = s * Math.min(l, 1 - l);
+    const f = (n) => {
+      const color = l - a * Math.max(-1, Math.min(k(n) - 3, Math.min(9 - k(n), 1)));
+      return Math.round(255 * color).toString(16).padStart(2, "0");
+    };
+    return `#${f(0)}${f(8)}${f(4)}`;
+  };
+  const anchors = baseColors.map((c) => rgbToHsl(hexToRgb(c)));
+  const colors2 = [...baseColors];
+  let i = 0;
+  while (colors2.length < count) {
+    const anchor = anchors[i % anchors.length];
+    const step = Math.floor(i / anchors.length + 1);
+    const hueOffset = step * 25 * (i % 2 === 0 ? 1 : -1);
+    const satOffset = i % 3 === 0 ? -6 : 6;
+    const lightOffset = i % 4 === 0 ? 6 : -4;
+    const newH = (anchor.h + hueOffset + 360) % 360;
+    const newS = Math.max(30, Math.min(95, anchor.s + satOffset));
+    const newL = Math.max(25, Math.min(45, anchor.l + lightOffset));
+    colors2.push(hslToHex(newH, newS, newL));
+    i += 1;
+  }
+  return colors2.slice(0, count);
+};
+var niceCeil = (value) => {
+  if (!isFinite(value) || value <= 0) return 1;
+  const pow = Math.pow(10, Math.floor(Math.log10(value)));
+  const normalized = value / pow;
+  const multipliers = [
+    1,
+    1.25,
+    1.5,
+    2,
+    2.5,
+    3,
+    4,
+    5,
+    7.5,
+    10,
+    15,
+    20,
+    25,
+    50,
+    100
+  ];
+  for (const m of multipliers) {
+    if (m >= normalized) return Math.ceil(m * pow);
+  }
+  return Math.ceil(100 * pow);
+};
+var compactTick = (value) => {
+  if (value >= 1e9)
+    return (value / 1e9).toFixed(1).replace(/\.0$/, "") + "B";
+  if (value >= 1e6)
+    return (value / 1e6).toFixed(1).replace(/\.0$/, "") + "M";
+  if (value >= 1e3) return (value / 1e3).toFixed(1).replace(/\.0$/, "") + "K";
+  return String(value);
+};
+var resolveContainerPaddingLeft = (padding, containerPaddingLeft, defaultLeft = 16) => {
+  if (typeof padding === "number") return padding;
+  if (padding && typeof padding === "object" && padding.left != null)
+    return padding.left;
+  if (typeof containerPaddingLeft === "number") return containerPaddingLeft;
+  return defaultLeft;
+};
+var resolveChartMargins = (margins, chartMargins, showLabels) => {
+  const defaultRight = 30;
+  const defaultLeft = 20;
+  const topDefault = showLabels ? 48 : 20;
+  const bottomDefault = 5;
+  return {
+    top: margins?.top ?? chartMargins?.top ?? topDefault,
+    right: margins?.right ?? chartMargins?.right ?? defaultRight,
+    left: margins?.left ?? chartMargins?.left ?? defaultLeft,
+    bottom: margins?.bottom ?? chartMargins?.bottom ?? bottomDefault
+  };
+};
+
+// src/components/charts/utils/pillLabelRenderer.tsx
+import { jsx as jsx56, jsxs as jsxs38 } from "react/jsx-runtime";
+var formatCompactNumber = (value) => {
+  const isNegative = value < 0;
+  const absValue = Math.abs(value);
+  let formatted;
+  if (absValue >= 1e9) {
+    formatted = (absValue / 1e9).toFixed(1).replace(/\.0$/, "") + "B";
+  } else if (absValue >= 1e6) {
+    formatted = (absValue / 1e6).toFixed(1).replace(/\.0$/, "") + "M";
+  } else if (absValue >= 1e3) {
+    formatted = (absValue / 1e3).toFixed(1).replace(/\.0$/, "") + "K";
+  } else {
+    formatted = absValue.toString();
+  }
+  return isNegative ? `-${formatted}` : formatted;
+};
+var parseNumber = (v) => {
+  if (typeof v === "number") return v;
+  if (typeof v === "string" && v.trim() !== "" && !Number.isNaN(Number(v)))
+    return Number(v);
+  return void 0;
+};
+var renderPillLabel = (color, variant) => {
+  return (props) => {
+    const { x, y, value } = props;
+    const text = typeof value === "number" ? formatCompactNumber(value) : String(value ?? "");
+    const paddingX = 8;
+    const approxCharWidth = 7;
+    const pillWidth = Math.max(
+      40,
+      String(text).length * approxCharWidth + paddingX * 2
+    );
+    const pillHeight = 20;
+    const xNum = parseNumber(x);
+    const px = parseNumber(props.x);
+    const pWidth = parseNumber(props.width);
+    const vb = props.viewBox;
+    const cxNum = parseNumber(props.cx);
+    let centerX;
+    if (typeof px === "number" && typeof pWidth === "number") {
+      centerX = px + pWidth / 2;
+    } else if (typeof xNum === "number" && typeof pWidth === "number") {
+      centerX = xNum + pWidth / 2;
+    } else if (typeof cxNum === "number") {
+      centerX = cxNum;
+    } else if (vb && typeof vb.x === "number" && typeof vb.width === "number" && typeof props.index === "number") {
+      const approxCols = Math.max(1, props.index + 1);
+      const colWidth = vb.width / approxCols;
+      centerX = vb.x + colWidth * (props.index + 0.5);
+    } else if (vb && typeof vb.x === "number" && typeof vb.width === "number") {
+      centerX = vb.x + vb.width / 2;
+    } else {
+      centerX = typeof props.index === "number" ? props.index * 40 + 24 : 0;
+    }
+    if (vb && typeof vb.x === "number" && typeof vb.width === "number") {
+      const minX = vb.x + 0 + pillWidth / 22;
+      const maxX = vb.x + vb.width - 2 - pillWidth / 2;
+      centerX = Math.max(minX, Math.min(maxX, centerX));
+    }
+    const yNum = parseNumber(y);
+    const py = parseNumber(props.y);
+    const cyNum = parseNumber(props.cy);
+    const centerY = yNum ?? (typeof py === "number" ? py : vb && typeof vb.y === "number" && typeof vb.height === "number" ? vb.y + vb.height / 2 : typeof cyNum === "number" ? cyNum : 0);
+    const rectX = centerX - pillWidth / 2;
+    const rectY = centerY - pillHeight - 6;
+    const textX = centerX;
+    const textY = rectY + pillHeight / 2 + 3;
+    const rectFill = variant === "filled" ? color : variant === "soft" ? `${color}20` : "#ffffff";
+    const rectStroke = variant === "outline" ? `${color}CC` : void 0;
+    const numValue = parseNumber(value);
+    const isNegative = typeof numValue === "number" && numValue < 0;
+    let textColor;
+    if (isNegative) {
+      textColor = "#dc2626";
+    } else {
+      if (variant === "filled") {
+        textColor = "#ffffff";
+      } else {
+        textColor = "#374151";
+      }
+    }
+    return /* @__PURE__ */ jsxs38("g", { children: [
+      /* @__PURE__ */ jsx56(
+        "rect",
+        {
+          x: rectX,
+          y: rectY,
+          rx: pillHeight / 2,
+          width: pillWidth,
+          height: pillHeight,
+          fill: rectFill,
+          stroke: rectStroke,
+          strokeWidth: rectStroke ? 1 : 0
+        }
+      ),
+      /* @__PURE__ */ jsx56(
+        "text",
+        {
+          x: textX,
+          y: textY - 3,
+          fill: textColor,
+          fontSize: 13,
+          fontWeight: 700,
+          textAnchor: "middle",
+          dominantBaseline: "central",
+          letterSpacing: 0.2,
+          children: text
+        }
+      )
+    ] });
+  };
+};
+var pillLabelRenderer_default = renderPillLabel;
+
+// src/hooks/use-drag.tsx
+import { useState as useState11, useCallback as useCallback7, useRef as useRef4, useEffect as useEffect10 } from "react";
+var useDrag = (options = {}) => {
+  const [isDragging, setIsDragging] = useState11(null);
+  const [positions, setPositions] = useState11({});
+  const dragStartPos = useRef4(null);
+  const dragId = useRef4(null);
+  const handleMouseDown = useCallback7((id, e) => {
+    e.preventDefault();
+    const currentPosition = positions[id] || { top: 0, left: 0 };
+    dragStartPos.current = {
+      x: e.clientX,
+      y: e.clientY,
+      elementX: currentPosition.left,
+      elementY: currentPosition.top
+    };
+    dragId.current = id;
+    setIsDragging(id);
+    options.onDragStart?.(id);
+  }, [positions, options]);
+  const handleMouseMove = useCallback7((e) => {
+    if (!isDragging || !dragStartPos.current || !dragId.current) return;
+    const deltaX = e.clientX - dragStartPos.current.x;
+    const deltaY = e.clientY - dragStartPos.current.y;
+    const newPosition = {
+      left: dragStartPos.current.elementX + deltaX,
+      top: dragStartPos.current.elementY + deltaY
+    };
+    newPosition.left = Math.max(0, Math.min(window.innerWidth - 300, newPosition.left));
+    newPosition.top = Math.max(0, Math.min(window.innerHeight - 200, newPosition.top));
+    setPositions((prev) => ({
+      ...prev,
+      [dragId.current]: newPosition
+    }));
+    options.onDrag?.(dragId.current, newPosition);
+  }, [isDragging, options]);
+  const handleMouseUp = useCallback7(() => {
+    if (dragId.current) {
+      options.onDragEnd?.(dragId.current);
+    }
+    setIsDragging(null);
+    dragStartPos.current = null;
+    dragId.current = null;
+  }, [options]);
+  useEffect10(() => {
+    if (isDragging) {
+      document.addEventListener("mousemove", handleMouseMove);
+      document.addEventListener("mouseup", handleMouseUp);
+      document.body.style.userSelect = "none";
+      return () => {
+        document.removeEventListener("mousemove", handleMouseMove);
+        document.removeEventListener("mouseup", handleMouseUp);
+        document.body.style.userSelect = "";
+      };
+    }
+  }, [isDragging, handleMouseMove, handleMouseUp]);
+  const setPosition = useCallback7((id, position) => {
+    setPositions((prev) => ({
+      ...prev,
+      [id]: position
+    }));
+  }, []);
+  const getPosition = useCallback7((id) => {
+    return positions[id] || { top: 0, left: 0 };
+  }, [positions]);
+  const isElementDragging = useCallback7((id) => {
+    return isDragging === id;
+  }, [isDragging]);
+  return {
+    handleMouseDown,
+    getPosition,
+    setPosition,
+    isElementDragging,
+    isDragging: isDragging !== null
+  };
+};
 export {
   AlertDialogActionBase,
   AlertDialogBase,
@@ -4877,6 +6744,7 @@ export {
   CarouselNextBase,
   CarouselPrevious,
   CheckboxBase,
+  CloseAllButton_default as CloseAllButton,
   CollapsibleBase,
   CollapsibleContentBase,
   CollapsibleTriggerBase,
@@ -4917,6 +6785,7 @@ export {
   DialogPortalBase,
   DialogTitleBase,
   DialogTriggerBase,
+  DraggableTooltip_default as DraggableTooltip,
   DrawerBase,
   DrawerCloseBase,
   DrawerContentBase,
@@ -4942,6 +6811,7 @@ export {
   DropDownMenuSubContentBase,
   DropDownMenuSubTriggerBase,
   DropDownMenuTriggerBase,
+  Highlights_default as Highlights,
   HoverCardBase,
   HoverCardContentBase,
   HoverCardTriggerBase,
@@ -4951,6 +6821,7 @@ export {
   InputOTPSeparatorBase,
   InputOTPSlotBase,
   LabelBase_default as LabelBase,
+  LoadingBase,
   ModeToggleBase,
   MultiCombobox,
   NavigationMenuBase,
@@ -4961,6 +6832,7 @@ export {
   NavigationMenuListBase,
   NavigationMenuTriggerBase,
   NavigationMenuViewportBase,
+  PeriodsDropdown_default as PeriodsDropdown,
   PopoverAnchorBase,
   PopoverBase,
   PopoverContentBase,
@@ -4993,6 +6865,7 @@ export {
   SheetPortalBase,
   SheetTitleBase,
   SheetTriggerBase,
+  ShowOnly_default as ShowOnly,
   SidebarBase,
   SidebarContentBase,
   SidebarFooterBase,
@@ -5039,11 +6912,23 @@ export {
   TooltipBase,
   TooltipContentBase,
   TooltipProviderBase,
+  TooltipSimple_default as TooltipSimple,
   TooltipTriggerBase,
+  TooltipWithTotal_default as TooltipWithTotal,
   UseSideBarBase,
   badgeVariants,
   buttonVariantsBase,
+  compactTick,
+  detectDataFields,
+  detectXAxis,
+  formatFieldName,
+  generateAdditionalColors,
+  niceCeil,
+  pillLabelRenderer_default as renderPillLabel,
+  resolveChartMargins,
+  resolveContainerPaddingLeft,
   toast,
+  useDrag,
   useIsMobile,
   useTheme
 };