@mlw-packages/react-components 1.7.4 → 1.7.5

package/dist/index.mjs

@@ -492,7 +492,8 @@ function cn(...inputs) {
 }
 
 // src/components/ui/form/ButtonBase.tsx
-import { jsx } from "react/jsx-runtime";
+import { CircleNotchIcon } from "@phosphor-icons/react";
+import { jsx, jsxs } from "react/jsx-runtime";
 var buttonVariantsBase = cva(
   "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive active:scale-95",
   {
@@ -527,16 +528,38 @@ var ButtonBase = React.forwardRef(
     size,
     asChild = false,
     testid = `button-${variant ?? "default"}`,
+    isLoading = false,
+    children,
     ...props
   }, ref) => {
     const Comp = asChild ? Slot : "button";
-    return /* @__PURE__ */ jsx(
+    const mergedDisabled = Boolean(props.disabled) || isLoading;
+    const isActivelyLoading = isLoading && !props.disabled;
+    return /* @__PURE__ */ jsxs(
       Comp,
       {
-        className: cn(buttonVariantsBase({ variant, size, className })),
+        className: cn(
+          buttonVariantsBase({ variant, size, className }),
+          "relative"
+        ),
         ref,
         "data-testid": testid ?? `button-${variant ?? "default"}`,
-        ...props
+        "aria-busy": isActivelyLoading || void 0,
+        disabled: mergedDisabled,
+        ...props,
+        children: [
+          children,
+          isActivelyLoading && /* @__PURE__ */ jsxs("span", { className: "absolute inset-0 flex items-center justify-center pointer-events-none rounded-md", children: [
+            /* @__PURE__ */ jsx("span", { className: "absolute inset-0 rounded-md backdrop-blur overflow-hidden" }),
+            /* @__PURE__ */ jsx(
+              CircleNotchIcon,
+              {
+                weight: "bold",
+                className: "relative animate-spin h-4 w-4 text-current"
+              }
+            )
+          ] })
+        ]
       }
     );
   }
@@ -579,7 +602,7 @@ ButtonGroupBase.displayName = "ButtonGroup";
 import * as React2 from "react";
 import * as DialogPrimitive from "@radix-ui/react-dialog";
 import { XIcon } from "@phosphor-icons/react";
-import { jsx as jsx2, jsxs } from "react/jsx-runtime";
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 var DialogBase = DialogPrimitive.Root;
 var DialogTriggerBase = DialogPrimitive.Trigger;
 var DialogPortalBase = DialogPrimitive.Portal;
@@ -598,9 +621,9 @@ var DialogOverlayBase = React2.forwardRef(({ className, testid: dataTestId = "di
 ));
 DialogOverlayBase.displayName = DialogPrimitive.Overlay.displayName;
 var DialogContentBase = React2.forwardRef(
-  ({ className, children, testid: dataTestId = "dialog-content", ...props }, ref) => /* @__PURE__ */ jsxs(DialogPortalBase, { children: [
+  ({ className, children, testid: dataTestId = "dialog-content", ...props }, ref) => /* @__PURE__ */ jsxs2(DialogPortalBase, { children: [
     /* @__PURE__ */ jsx2(DialogOverlayBase, {}),
-    /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsxs2(
       DialogPrimitive.Content,
       {
         ref,
@@ -612,7 +635,7 @@ var DialogContentBase = React2.forwardRef(
         ...props,
         children: [
           children,
-          /* @__PURE__ */ jsxs(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__ */ jsxs2(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__ */ jsx2(XIcon, { className: "h-5 w-5 sm:h-4 sm:w-4" }),
             /* @__PURE__ */ jsx2("span", { className: "sr-only", children: "Close" })
           ] })
@@ -712,7 +735,7 @@ var ErrorMessage = ({ error }) => {
 var ErrorMessage_default = ErrorMessage;
 
 // src/components/ui/form/InputBase.tsx
-import { jsx as jsx5, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx5, jsxs as jsxs3 } from "react/jsx-runtime";
 var InputBase = React4.forwardRef(
   ({
     className,
@@ -725,9 +748,9 @@ var InputBase = React4.forwardRef(
     error,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsxs2("div", { className: "flex flex-col w-full min-w-[150px]", children: [
+    return /* @__PURE__ */ jsxs3("div", { className: "flex flex-col w-full min-w-[150px]", children: [
       label && /* @__PURE__ */ jsx5(LabelBase_default, { className: labelClassname, children: label }),
-      /* @__PURE__ */ jsxs2(
+      /* @__PURE__ */ jsxs3(
         "div",
         {
           className: cn(
@@ -768,7 +791,7 @@ import * as React5 from "react";
 import { Command as CommandPrimitive } from "cmdk";
 import { MagnifyingGlassIcon } from "@phosphor-icons/react";
 import { motion, AnimatePresence } from "framer-motion";
-import { jsx as jsx6, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx6, jsxs as jsxs4 } from "react/jsx-runtime";
 var CommandBase = React5.forwardRef(({ className, testid: dataTestId = "command-base", ...props }, ref) => /* @__PURE__ */ jsx6(
   CommandPrimitive,
   {
@@ -802,7 +825,7 @@ var CommandDialogBase = ({ children, open, ...props }) => {
     "command-dialog"
   ) }) }) });
 };
-var CommandInputBase = React5.forwardRef(({ className, testid: dataTestId = "command-input", ...props }, ref) => /* @__PURE__ */ jsxs3("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
+var CommandInputBase = React5.forwardRef(({ className, testid: dataTestId = "command-input", ...props }, ref) => /* @__PURE__ */ jsxs4("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
   /* @__PURE__ */ jsx6(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 text-primary" }),
   /* @__PURE__ */ jsx6(
     CommandPrimitive.Input,
@@ -926,7 +949,7 @@ PopoverContentBase.displayName = PopoverPrimitive.Content.displayName;
 import { motion as motion2 } from "framer-motion";
 import { useState } from "react";
 import { CaretDownIcon, CheckIcon } from "@phosphor-icons/react";
-import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx8, jsxs as jsxs5 } from "react/jsx-runtime";
 function ComboboxBase({
   items,
   renderSelected,
@@ -939,19 +962,19 @@ function ComboboxBase({
   testIds = {}
 }) {
   const [open, setOpen] = useState(false);
-  return /* @__PURE__ */ jsxs4(
+  return /* @__PURE__ */ jsxs5(
     "div",
     {
       className: "col-span-1 w-full",
       "data-testid": testIds.root ?? "combobox-base-root",
       children: [
-        /* @__PURE__ */ jsxs4(PopoverBase, { open, onOpenChange: setOpen, modal: true, children: [
+        /* @__PURE__ */ jsxs5(PopoverBase, { open, onOpenChange: setOpen, modal: true, children: [
           /* @__PURE__ */ jsx8(
             PopoverTriggerBase,
             {
               asChild: true,
               className: "flex w-full justify-between dark:bg-[hsl(231,15%,19%)]",
-              children: /* @__PURE__ */ jsxs4(
+              children: /* @__PURE__ */ jsxs5(
                 ButtonBase,
                 {
                   variant: "select",
@@ -985,7 +1008,7 @@ function ComboboxBase({
             {
               className: "max-h-[--radix-popover-content-available-height] w-[--radix-popover-trigger-width] p-0 border-none",
               "data-testid": testIds.popover ?? "combobox-popover",
-              children: /* @__PURE__ */ jsxs4(
+              children: /* @__PURE__ */ jsxs5(
                 CommandBase,
                 {
                   className: "dark:text-white hover:bg-rsecondary",
@@ -999,11 +1022,11 @@ function ComboboxBase({
                         "data-testid": testIds.search ?? "combobox-search"
                       }
                     ),
-                    /* @__PURE__ */ jsxs4(CommandListBase, { "data-testid": testIds.list ?? "combobox-list", children: [
+                    /* @__PURE__ */ jsxs5(CommandListBase, { "data-testid": testIds.list ?? "combobox-list", children: [
                       /* @__PURE__ */ jsx8(CommandEmptyBase, { "data-testid": testIds.empty ?? "combobox-empty", children: "Nenhum dado encontrado" }),
                       /* @__PURE__ */ jsx8(CommandGroupBase, { "data-testid": testIds.group ?? "combobox-group", children: items.map((item) => {
                         const isSelected = checkIsSelected(item.value);
-                        return /* @__PURE__ */ jsxs4(
+                        return /* @__PURE__ */ jsxs5(
                           CommandItemBase,
                           {
                             keywords: [item.label],
@@ -1057,7 +1080,7 @@ function ComboboxBase({
 }
 
 // src/components/selects/Combobox.tsx
-import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx9, jsxs as jsxs6 } from "react/jsx-runtime";
 function Combobox({
   items,
   selected,
@@ -1091,7 +1114,7 @@ function Combobox({
     },
     [selected, onChange]
   );
-  return /* @__PURE__ */ jsxs5("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
+  return /* @__PURE__ */ jsxs6("div", { className: cn("flex flex-col gap-1 w-full min-w-[150px]", className), children: [
     label && /* @__PURE__ */ jsx9(LabelBase_default, { className: labelClassname, children: label }),
     /* @__PURE__ */ jsx9(
       ComboboxBase,
@@ -1112,7 +1135,7 @@ function Combobox({
 import { useCallback as useCallback2, useMemo as useMemo2 } from "react";
 import { XIcon as XIcon2 } from "@phosphor-icons/react";
 import { motion as motion3, AnimatePresence as AnimatePresence2 } from "framer-motion";
-import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx10, jsxs as jsxs7 } from "react/jsx-runtime";
 function MultiCombobox({
   items,
   selected,
@@ -1173,7 +1196,7 @@ function MultiCombobox({
       {
         "data-testid": testIds.selectedWrapper ?? "combobox-selected-wrapper",
         className: "flex w-full flex-wrap gap-2 overflow-hidden ",
-        children: /* @__PURE__ */ jsx10(AnimatePresence2, { mode: "popLayout", children: selectedItems.map((item) => /* @__PURE__ */ jsxs6(
+        children: /* @__PURE__ */ jsx10(AnimatePresence2, { mode: "popLayout", children: selectedItems.map((item) => /* @__PURE__ */ jsxs7(
           motion3.div,
           {
             layout: true,
@@ -1211,7 +1234,7 @@ function MultiCombobox({
       }
     );
   }, [handleSelection, placeholder, selectedItems, testIds]);
-  return /* @__PURE__ */ jsxs6(
+  return /* @__PURE__ */ jsxs7(
     "div",
     {
       className: cn("flex flex-col gap-1 w-full min-w-[150px]", className),
@@ -1267,19 +1290,19 @@ TooltipContentBase.displayName = TooltipPrimitive.Content.displayName;
 // src/components/ui/FilterBase.tsx
 var import_colors = __toESM(require_colors2());
 import { FunnelSimpleIcon, PlusIcon, TrashIcon } from "@phosphor-icons/react";
-import { jsx as jsx12, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 
 // src/components/ui/SelectBase.tsx
 import * as React8 from "react";
 import * as SelectPrimitive from "@radix-ui/react-select";
 import { CheckIcon as CheckIcon2, CaretDownIcon as CaretDownIcon2, CaretUpIcon } from "@phosphor-icons/react";
 import { motion as motion4, AnimatePresence as AnimatePresence3 } from "framer-motion";
-import { Fragment, jsx as jsx13, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
 var SelectBase = SelectPrimitive.Root;
 var SelectGroupBase = SelectPrimitive.Group;
 var SelectValueBase = SelectPrimitive.Value;
-var SelectTriggerBase = React8.forwardRef(({ className, children, open, error, ...props }, ref) => /* @__PURE__ */ jsxs8("div", { className: cn("w-full", error && "mb-0"), children: [
-  /* @__PURE__ */ jsxs8(
+var SelectTriggerBase = React8.forwardRef(({ className, children, open, error, ...props }, ref) => /* @__PURE__ */ jsxs9("div", { className: cn("w-full", error && "mb-0"), children: [
+  /* @__PURE__ */ jsxs9(
     SelectPrimitive.Trigger,
     {
       ref,
@@ -1358,7 +1381,7 @@ var SelectContentBase = React8.forwardRef(
           animate: { opacity: 1, scale: 1 },
           exit: { opacity: 0, scale: 0.95 },
           transition: { duration: 0.2 },
-          children: /* @__PURE__ */ jsxs8(Fragment, { children: [
+          children: /* @__PURE__ */ jsxs9(Fragment, { children: [
             /* @__PURE__ */ jsx13(SelectScrollUpButtonBase, {}),
             /* @__PURE__ */ jsx13(
               SelectPrimitive.Viewport,
@@ -1397,7 +1420,7 @@ var SelectItemBase = React8.forwardRef(({ className, children, ...props }, ref)
     ),
     ...props,
     asChild: true,
-    children: /* @__PURE__ */ jsxs8(
+    children: /* @__PURE__ */ jsxs9(
       motion4.div,
       {
         whileHover: { x: 4 },
@@ -1438,14 +1461,14 @@ import * as React9 from "react";
 import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import { CheckIcon as CheckIcon3, CaretRightIcon, CircleIcon } from "@phosphor-icons/react";
 import { motion as motion5, AnimatePresence as AnimatePresence4 } from "framer-motion";
-import { jsx as jsx14, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
 var DropDownMenuBase = DropdownMenuPrimitive.Root;
 var DropDownMenuTriggerBase = DropdownMenuPrimitive.Trigger;
 var DropDownMenuGroupBase = DropdownMenuPrimitive.Group;
 var DropDownMenuPortalBase = DropdownMenuPrimitive.Portal;
 var DropDownMenuSubBase = DropdownMenuPrimitive.Sub;
 var DropDownMenuRadioGroupBase = DropdownMenuPrimitive.RadioGroup;
-var DropDownMenuSubTriggerBase = React9.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropDownMenuSubTriggerBase = React9.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.SubTrigger,
   {
     ref,
@@ -1506,7 +1529,7 @@ var DropDownMenuContentBase = React9.forwardRef(
   ) })
 );
 DropDownMenuContentBase.displayName = DropdownMenuPrimitive.Content.displayName;
-var DropDownMenuItemBase = React9.forwardRef(({ className, inset, leftIcon, rightIcon, children, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropDownMenuItemBase = React9.forwardRef(({ className, inset, leftIcon, rightIcon, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.Item,
   {
     ref,
@@ -1517,7 +1540,7 @@ var DropDownMenuItemBase = React9.forwardRef(({ className, inset, leftIcon, righ
     ),
     ...props,
     children: [
-      /* @__PURE__ */ jsxs9("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxs10("div", { className: "flex items-center gap-2", children: [
         leftIcon && /* @__PURE__ */ jsx14("span", { className: "[&>svg]:size-4", children: leftIcon }),
         children
       ] }),
@@ -1526,7 +1549,7 @@ var DropDownMenuItemBase = React9.forwardRef(({ className, inset, leftIcon, righ
   }
 ));
 DropDownMenuItemBase.displayName = DropdownMenuPrimitive.Item.displayName;
-var DropDownMenuCheckboxItemBase = React9.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropDownMenuCheckboxItemBase = React9.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.CheckboxItem,
   {
     ref,
@@ -1543,7 +1566,7 @@ var DropDownMenuCheckboxItemBase = React9.forwardRef(({ className, children, che
   }
 ));
 DropDownMenuCheckboxItemBase.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
-var DropDownMenuRadioItemBase = React9.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs9(
+var DropDownMenuRadioItemBase = React9.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs10(
   DropdownMenuPrimitive.RadioItem,
   {
     ref,
@@ -1657,7 +1680,7 @@ var useTheme = () => {
 };
 
 // src/components/mode-toggle.tsx
-import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx16, jsxs as jsxs11 } from "react/jsx-runtime";
 var themeLabels = {
   light: "Light",
   dark: "Dark",
@@ -1674,15 +1697,15 @@ 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__ */ jsxs10(DropDownMenuBase, { children: [
-    /* @__PURE__ */ jsx16(DropDownMenuTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs10(
+  return /* @__PURE__ */ jsxs11(DropDownMenuBase, { children: [
+    /* @__PURE__ */ jsx16(DropDownMenuTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs11(
       ButtonBase,
       {
         variant: "ghost",
         size: "icon",
         className: "relative overflow-hidden border-transparent",
         children: [
-          /* @__PURE__ */ jsxs10(Fragment2, { children: [
+          /* @__PURE__ */ jsxs11(Fragment2, { children: [
             /* @__PURE__ */ jsx16(
               SunIcon,
               {
@@ -1705,7 +1728,7 @@ function ModeToggleBase({
       {
         align: "end",
         className: "border-border bg-popover text-popover-foreground",
-        children: themes.map((theme) => /* @__PURE__ */ jsxs10(
+        children: themes.map((theme) => /* @__PURE__ */ jsxs11(
           DropDownMenuItemBase,
           {
             onClick: () => setTheme(theme),
@@ -1725,8 +1748,8 @@ function ModeToggleBase({
 // src/components/ui/layout/ScrollareaBase.tsx
 import * as React10 from "react";
 import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
-import { jsx as jsx17, jsxs as jsxs11 } from "react/jsx-runtime";
-var ScrollAreaBase = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs11(
+import { jsx as jsx17, jsxs as jsxs12 } from "react/jsx-runtime";
+var ScrollAreaBase = React10.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs12(
   ScrollAreaPrimitive.Root,
   {
     ref,
@@ -1758,17 +1781,18 @@ var ScrollBarBase = React10.forwardRef(({ className, orientation = "vertical", .
 ScrollBarBase.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
 
 // src/components/selects/Select.tsx
-import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs12 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx18, jsxs as jsxs13 } from "react/jsx-runtime";
 function Select({
   items,
   groupItems,
   placeholder,
   onChange,
   error,
-  testIds = {}
+  testIds = {},
+  disabled
 }) {
-  return /* @__PURE__ */ jsxs12("div", { "data-testid": testIds.root ?? "select-root", children: [
-    /* @__PURE__ */ jsxs12(
+  return /* @__PURE__ */ jsxs13("div", { "data-testid": testIds.root ?? "select-root", children: [
+    /* @__PURE__ */ jsxs13(
       SelectBase,
       {
         onValueChange: onChange,
@@ -1782,6 +1806,7 @@ function Select({
                 error && "border-red-500"
               ),
               "data-testid": testIds.trigger ?? "select-trigger",
+              disabled,
               children: /* @__PURE__ */ jsx18(
                 SelectValueBase,
                 {
@@ -1791,7 +1816,7 @@ function Select({
               )
             }
           ),
-          /* @__PURE__ */ jsx18(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ jsx18(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ jsx18(Fragment3, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ jsxs12(
+          /* @__PURE__ */ jsx18(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ jsx18(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ jsx18(Fragment3, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ jsxs13(
             SelectGroupBase,
             {
               "data-testid": testIds.group ?? "select-group",
@@ -2004,7 +2029,7 @@ import { useState as useState4, useRef, useEffect as useEffect3 } from "react";
 import { motion as motion6, AnimatePresence as AnimatePresence5 } from "framer-motion";
 import { DotsThreeIcon } from "@phosphor-icons/react/dist/ssr";
 import { Check } from "@phosphor-icons/react/dist/ssr";
-import { jsx as jsx19, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs14 } from "react/jsx-runtime";
 var menuVariants = {
   hidden: { opacity: 0, y: -6, scale: 0.98 },
   visible: { opacity: 1, y: 0, scale: 1 },
@@ -2052,8 +2077,8 @@ function PeriodsDropdown({
     setOpen(false);
   }
   const containerStyle = typeof rightOffset === "number" ? { position: "relative", zIndex: 30 } : { position: "relative", zIndex: 30 };
-  return /* @__PURE__ */ jsxs13("div", { ref: wrapperRef, style: containerStyle, className: "mr-4", children: [
-    /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14("div", { ref: wrapperRef, style: containerStyle, className: "mr-4", children: [
+    /* @__PURE__ */ jsxs14(
       "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",
@@ -2076,7 +2101,7 @@ function PeriodsDropdown({
         ]
       }
     ),
-    /* @__PURE__ */ jsx19(AnimatePresence5, { children: open && /* @__PURE__ */ jsxs13(
+    /* @__PURE__ */ jsx19(AnimatePresence5, { children: open && /* @__PURE__ */ jsxs14(
       motion6.div,
       {
         initial: "hidden",
@@ -2105,7 +2130,7 @@ function PeriodsDropdown({
               ref: listRef,
               className: "flex flex-col p-2 gap-1",
               style: { maxHeight: 200, overflowY: "auto" },
-              children: periods.map((p, idx) => /* @__PURE__ */ jsxs13(
+              children: periods.map((p, idx) => /* @__PURE__ */ jsxs14(
                 motion6.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"),
@@ -2136,7 +2161,7 @@ var PeriodsDropdown_default = PeriodsDropdown;
 // src/components/charts/components/controls/ShowOnly.tsx
 import { motion as motion7 } from "framer-motion";
 import { Eye, EyeSlash } from "@phosphor-icons/react";
-import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx20, jsxs as jsxs15 } from "react/jsx-runtime";
 var ShowOnly = ({
   showOnlyHighlighted,
   setShowOnlyHighlighted,
@@ -2163,10 +2188,10 @@ var ShowOnly = ({
             "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__ */ jsxs14(Fragment4, { children: [
+          children: showOnlyHighlighted ? /* @__PURE__ */ jsxs15(Fragment4, { children: [
             /* @__PURE__ */ jsx20(EyeSlash, { size: 16, weight: "regular" }),
             /* @__PURE__ */ jsx20("span", { className: "sr-only", children: "Exibir todos" })
-          ] }) : /* @__PURE__ */ jsxs14(Fragment4, { children: [
+          ] }) : /* @__PURE__ */ jsxs15(Fragment4, { children: [
             /* @__PURE__ */ jsx20(Eye, { size: 16, weight: "bold" }),
             /* @__PURE__ */ jsx20("span", { className: "sr-only", children: "Mostrar somente destacados" })
           ] })
@@ -2180,7 +2205,7 @@ var ShowOnly_default = ShowOnly;
 // src/components/charts/components/controls/Highlights.tsx
 import { motion as motion8, AnimatePresence as AnimatePresence6 } from "framer-motion";
 import { CheckIcon as CheckIcon5 } from "@phosphor-icons/react/dist/ssr";
-import { jsx as jsx21, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs16 } from "react/jsx-runtime";
 var Highlights = ({
   allKeys,
   mapperConfig,
@@ -2231,7 +2256,7 @@ var Highlights = ({
                 className: pillClasses,
                 style: { minWidth: showFullLabel ? void 0 : 36 },
                 "aria-pressed": isHighlighted,
-                children: /* @__PURE__ */ jsxs15(
+                children: /* @__PURE__ */ jsxs16(
                   motion8.button,
                   {
                     whileHover: { scale: isHighlighted ? 1.04 : 1.03 },
@@ -2293,7 +2318,7 @@ var Highlights_default = Highlights;
 
 // src/components/charts/components/controls/CloseAllButton.tsx
 import { XIcon as XIcon3 } from "@phosphor-icons/react/dist/ssr";
-import { jsx as jsx22, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx22, jsxs as jsxs17 } from "react/jsx-runtime";
 var CloseAllButton = ({
   count,
   onCloseAll,
@@ -2329,7 +2354,7 @@ var CloseAllButton = ({
     `;
   };
   if (variant === "inline") {
-    return /* @__PURE__ */ jsx22("div", { className: "absolute top-4 right-4 z-30", children: /* @__PURE__ */ jsxs16(
+    return /* @__PURE__ */ jsx22("div", { className: "absolute top-4 right-4 z-30", children: /* @__PURE__ */ jsxs17(
       ButtonBase,
       {
         variant: "ghost",
@@ -2347,7 +2372,7 @@ var CloseAllButton = ({
     "div",
     {
       className: `${getPositionClasses()} animate-in fade-in slide-in-from-top-2 duration-300`,
-      children: /* @__PURE__ */ jsx22("div", { children: /* @__PURE__ */ jsxs16(
+      children: /* @__PURE__ */ jsx22("div", { children: /* @__PURE__ */ jsxs17(
         ButtonBase,
         {
           onClick: onCloseAll,
@@ -2382,7 +2407,7 @@ import React12, {
 import { motion as motion9, AnimatePresence as AnimatePresence7 } from "framer-motion";
 import { DotsSixVerticalIcon } from "@phosphor-icons/react";
 import { XIcon as XIcon4 } from "@phosphor-icons/react/dist/ssr";
-import { Fragment as Fragment5, jsx as jsx23, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment5, jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
 var ALIGNMENT_THRESHOLD = 25;
 var GUIDE_THRESHOLD = 60;
 var STRONG_SNAP_THRESHOLD = 35;
@@ -2475,7 +2500,7 @@ var DraggableTooltipComponent = ({
       dataKey: "total",
       name: "Total"
     }) : defaultTotalFormatted;
-    return /* @__PURE__ */ jsxs17("div", { className: "text-sm", children: [
+    return /* @__PURE__ */ jsxs18("div", { className: "text-sm", children: [
       /* @__PURE__ */ jsx23("div", { className: "text-sm text-muted-foreground", children: "Total" }),
       /* @__PURE__ */ jsx23(
         "div",
@@ -2739,7 +2764,7 @@ var DraggableTooltipComponent = ({
     },
     [id, onClose]
   );
-  return /* @__PURE__ */ jsxs17(Fragment5, { children: [
+  return /* @__PURE__ */ jsxs18(Fragment5, { children: [
     dragging && alignmentGuides.map((guide, index) => {
       const isHorizontal = guide.type === "horizontal";
       const color = isHorizontal ? "#3b82f6" : "#ef4444";
@@ -2759,7 +2784,7 @@ var DraggableTooltipComponent = ({
         guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
         guide.targetTooltip.top + guide.targetTooltip.height / 2
       );
-      return /* @__PURE__ */ jsxs17("div", { children: [
+      return /* @__PURE__ */ jsxs18("div", { children: [
         /* @__PURE__ */ jsx23(
           motion9.div,
           {
@@ -2822,7 +2847,7 @@ var DraggableTooltipComponent = ({
         )
       ] }, index);
     }),
-    /* @__PURE__ */ jsx23(AnimatePresence7, { children: /* @__PURE__ */ jsxs17(
+    /* @__PURE__ */ jsx23(AnimatePresence7, { children: /* @__PURE__ */ jsxs18(
       motion9.div,
       {
         className: "fixed bg-card border border-border rounded-lg shadow-lg z-50 min-w-80 select-none",
@@ -2840,7 +2865,7 @@ var DraggableTooltipComponent = ({
         role: "dialog",
         "aria-label": title ? `Tooltip ${title}` : `Tooltip ${data.name}`,
         children: [
-          /* @__PURE__ */ jsxs17(
+          /* @__PURE__ */ jsxs18(
             "div",
             {
               className: "flex items-center justify-between p-3 pb-2 border-b bg-muted/20 rounded-t-lg",
@@ -2862,8 +2887,8 @@ var DraggableTooltipComponent = ({
               ]
             }
           ),
-          /* @__PURE__ */ jsx23("div", { className: "px-3 py-2 bg-accent/5 border-l-4 border-primary", children: /* @__PURE__ */ jsxs17("div", { className: "flex items-center justify-between gap-2", children: [
-            /* @__PURE__ */ jsxs17("div", { children: [
+          /* @__PURE__ */ jsx23("div", { className: "px-3 py-2 bg-accent/5 border-l-4 border-primary", children: /* @__PURE__ */ jsxs18("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ jsxs18("div", { children: [
               /* @__PURE__ */ jsx23("span", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide", children: periodLabel }),
               /* @__PURE__ */ jsx23("p", { className: "font-bold text-lg text-foreground mt-1 truncate", children: categoryFormatter ? categoryFormatter(String(data.name)) : data.name })
             ] }),
@@ -2876,7 +2901,7 @@ var DraggableTooltipComponent = ({
               }
             ) })
           ] }) }),
-          /* @__PURE__ */ jsxs17("div", { className: "p-3 pt-2 space-y-2", children: [
+          /* @__PURE__ */ jsxs18("div", { className: "p-3 pt-2 space-y-2", children: [
             /* @__PURE__ */ jsx23("p", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2", children: dataLabel }),
             useMemo4(
               () => visibleKeys.map((key) => {
@@ -2900,7 +2925,7 @@ var DraggableTooltipComponent = ({
                 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__ */ jsxs17(
+                return /* @__PURE__ */ jsxs18(
                   "div",
                   {
                     role: "button",
@@ -2918,8 +2943,8 @@ var DraggableTooltipComponent = ({
                       border: isHighlighted ? `1px solid ${finalColors[key] || "#666"}22` : void 0
                     },
                     children: [
-                      /* @__PURE__ */ jsxs17("div", { className: "flex items-center justify-between", children: [
-                        /* @__PURE__ */ jsxs17("div", { className: "flex items-center gap-2", children: [
+                      /* @__PURE__ */ jsxs18("div", { className: "flex items-center justify-between", children: [
+                        /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2", children: [
                           /* @__PURE__ */ jsx23(
                             "div",
                             {
@@ -2937,7 +2962,7 @@ var DraggableTooltipComponent = ({
                             }
                           )
                         ] }),
-                        /* @__PURE__ */ jsxs17("div", { className: "flex items-baseline gap-2", children: [
+                        /* @__PURE__ */ jsxs18("div", { className: "flex items-baseline gap-2", children: [
                           /* @__PURE__ */ jsx23(
                             "span",
                             {
@@ -2975,7 +3000,7 @@ var DraggableTooltipComponent = ({
                 valueFormatter2
               ]
             ),
-            /* @__PURE__ */ jsx23("div", { className: "mt-3 pt-2 border-t", children: /* @__PURE__ */ jsxs17("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [
+            /* @__PURE__ */ jsx23("div", { className: "mt-3 pt-2 border-t", children: /* @__PURE__ */ jsxs18("p", { className: "text-xs text-muted-foreground flex items-center gap-1", children: [
               "Clique no ",
               /* @__PURE__ */ jsx23(XIcon4, { size: 12 }),
               " para remover"
@@ -3001,7 +3026,7 @@ DraggableTooltip.displayName = "DraggableTooltip";
 var DraggableTooltip_default = DraggableTooltip;
 
 // src/components/charts/components/tooltips/TooltipWithTotal.tsx
-import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
 var RechartTooltipWithTotal = ({
   active,
   payload,
@@ -3041,7 +3066,7 @@ var RechartTooltipWithTotal = ({
     (sum, p) => sum + Math.abs(typeof p.value === "number" ? p.value : 0),
     0
   );
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     "div",
     {
       role: "dialog",
@@ -3049,12 +3074,12 @@ var RechartTooltipWithTotal = ({
       className: "bg-card border border-border rounded-lg p-3 shadow-2xl max-w-xs",
       style: { minWidth: 220 },
       children: [
-        /* @__PURE__ */ jsxs18("div", { className: "flex items-start justify-between mb-2", children: [
-          /* @__PURE__ */ jsxs18("div", { className: "pr-2", children: [
+        /* @__PURE__ */ jsxs19("div", { className: "flex items-start justify-between mb-2", children: [
+          /* @__PURE__ */ jsxs19("div", { className: "pr-2", children: [
             /* @__PURE__ */ jsx24("p", { className: "text-xs text-muted-foreground", children: periodLabel }),
             /* @__PURE__ */ jsx24("p", { className: "font-medium text-foreground truncate", children: displayLabel })
           ] }),
-          /* @__PURE__ */ jsxs18("div", { className: "text-right ml-3", children: [
+          /* @__PURE__ */ jsxs19("div", { className: "text-right ml-3", children: [
             /* @__PURE__ */ jsx24("p", { className: "text-xs text-muted-foreground", children: totalLabel }),
             /* @__PURE__ */ jsx24(
               "p",
@@ -3088,9 +3113,9 @@ var RechartTooltipWithTotal = ({
             dataKey: entry.dataKey,
             name: entry.name
           }) : defaultFormatted;
-          return /* @__PURE__ */ jsxs18("div", { className: "flex flex-col gap-1", children: [
-            /* @__PURE__ */ jsxs18("div", { className: "flex items-center justify-between text-sm", children: [
-              /* @__PURE__ */ jsxs18("div", { className: "flex items-center gap-2 truncate", children: [
+          return /* @__PURE__ */ jsxs19("div", { className: "flex flex-col gap-1", children: [
+            /* @__PURE__ */ jsxs19("div", { className: "flex items-center justify-between text-sm", children: [
+              /* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-2 truncate", children: [
                 /* @__PURE__ */ jsx24(
                   "span",
                   {
@@ -3101,7 +3126,7 @@ var RechartTooltipWithTotal = ({
                 ),
                 /* @__PURE__ */ jsx24("span", { className: "text-muted-foreground truncate", children: entry.name })
               ] }),
-              /* @__PURE__ */ jsxs18("div", { className: "flex items-baseline gap-3 ml-3", children: [
+              /* @__PURE__ */ jsxs19("div", { className: "flex items-baseline gap-3 ml-3", children: [
                 /* @__PURE__ */ jsx24(
                   "span",
                   {
@@ -3131,7 +3156,7 @@ var RechartTooltipWithTotal = ({
 var TooltipWithTotal_default = RechartTooltipWithTotal;
 
 // src/components/charts/components/tooltips/TooltipSimple.tsx
-import { jsx as jsx25, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
 var TooltipSimple = ({
   active,
   payload,
@@ -3143,7 +3168,7 @@ var TooltipSimple = ({
 }) => {
   if (!active || !payload || payload.length === 0) return null;
   const displayLabel = categoryFormatter ? categoryFormatter(String(label ?? "")) : label;
-  return /* @__PURE__ */ jsxs19(
+  return /* @__PURE__ */ jsxs20(
     "div",
     {
       role: "dialog",
@@ -3151,7 +3176,7 @@ var TooltipSimple = ({
       className: "bg-card border border-border rounded-lg p-3 shadow-2xl max-w-[280px]",
       style: { minWidth: 220 },
       children: [
-        /* @__PURE__ */ jsx25("div", { className: "mb-2", children: /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-between gap-3", children: /* @__PURE__ */ jsxs19("div", { className: "min-w-0", children: [
+        /* @__PURE__ */ jsx25("div", { className: "mb-2", children: /* @__PURE__ */ jsx25("div", { className: "flex items-center justify-between gap-3", children: /* @__PURE__ */ jsxs20("div", { className: "min-w-0", children: [
           /* @__PURE__ */ jsx25("p", { className: "text-xs text-muted-foreground", children: periodLabel }),
           /* @__PURE__ */ jsx25("p", { className: "font-medium text-foreground truncate", children: displayLabel })
         ] }) }) }),
@@ -3176,12 +3201,12 @@ var TooltipSimple = ({
             dataKey: entry.dataKey,
             name: entry.name
           }) : defaultFormatted;
-          return /* @__PURE__ */ jsxs19(
+          return /* @__PURE__ */ jsxs20(
             "div",
             {
               className: "flex items-center justify-between text-sm px-2 py-2 bg-card/0 hover:bg-muted transition-colors",
               children: [
-                /* @__PURE__ */ jsxs19("div", { className: "flex items-center gap-3 min-w-0", children: [
+                /* @__PURE__ */ jsxs20("div", { className: "flex items-center gap-3 min-w-0", children: [
                   /* @__PURE__ */ jsx25(
                     "span",
                     {
@@ -3211,7 +3236,7 @@ var TooltipSimple = ({
 var TooltipSimple_default = TooltipSimple;
 
 // src/components/charts/utils/pillLabelRenderer.tsx
-import { jsx as jsx26, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
 var formatCompactNumber = (value) => {
   const isNegative = value < 0;
   const absValue = Math.abs(value);
@@ -3305,7 +3330,7 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
         textColor = "#374151";
       }
     }
-    return /* @__PURE__ */ jsxs20("g", { children: [
+    return /* @__PURE__ */ jsxs21("g", { children: [
       /* @__PURE__ */ jsx26(
         "rect",
         {
@@ -3339,7 +3364,7 @@ var renderPillLabel = (color, variant, valueFormatter2) => {
 var pillLabelRenderer_default = renderPillLabel;
 
 // src/components/charts/Chart.tsx
-import { jsx as jsx27, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
 var DEFAULT_COLORS = ["#55af7d", "#8e68ff", "#2273e1"];
 var Chart = ({
   data,
@@ -3771,7 +3796,7 @@ var Chart = ({
         overflowY: "hidden",
         minWidth: 0
       },
-      children: /* @__PURE__ */ jsxs21(
+      children: /* @__PURE__ */ jsxs22(
         "div",
         {
           className: cn("rounded-lg bg-card p-2 relative", className),
@@ -3792,7 +3817,7 @@ var Chart = ({
                 children: /* @__PURE__ */ jsx27("h3", { className: titleClassName, children: title })
               }
             ),
-            allKeys.length > 0 && (finalEnableHighlights || finalEnableShowOnly) && /* @__PURE__ */ jsxs21(
+            allKeys.length > 0 && (finalEnableHighlights || finalEnableShowOnly) && /* @__PURE__ */ jsxs22(
               "div",
               {
                 className: "flex items-center w-full",
@@ -3867,7 +3892,7 @@ var Chart = ({
                 )
               }
             ),
-            /* @__PURE__ */ jsx27(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs21(
+            /* @__PURE__ */ jsx27(ResponsiveContainer, { width: "100%", height, children: /* @__PURE__ */ jsxs22(
               ComposedChart,
               {
                 data: processedData,
@@ -3928,9 +3953,7 @@ var Chart = ({
                       label: yAxisLabel ? {
                         value: yAxisLabel,
                         angle: -90,
-                        // Render the label to the left (outside) of the chart area
-                        // to avoid overlapping the Y values / bars.
-                        position: "left",
+                        position: "leftTop",
                         style: {
                           fontSize: 12,
                           fill: "hsl(var(--muted-foreground))",
@@ -4151,7 +4174,7 @@ import {
   Legend as Legend2,
   LabelList as LabelList2
 } from "recharts";
-import { jsx as jsx28, jsxs as jsxs22 } from "react/jsx-runtime";
+import { jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
 var DEFAULT_COLORS2 = ["#55af7d", "#8e68ff", "#2273e1"];
 var BarChart = ({
   data,
@@ -4572,10 +4595,10 @@ var BarChart = ({
     label
   }) => {
     if (!active || !payload) return null;
-    return /* @__PURE__ */ jsxs22("div", { className: "bg-card border border-border rounded-lg p-3 shadow-lg", children: [
+    return /* @__PURE__ */ jsxs23("div", { className: "bg-card border border-border rounded-lg p-3 shadow-lg", children: [
       /* @__PURE__ */ jsx28("p", { className: "font-medium text-foreground mb-2", children: label }),
       payload.map(
-        (entry, index) => /* @__PURE__ */ jsxs22("div", { className: "flex items-center gap-2 text-sm", children: [
+        (entry, index) => /* @__PURE__ */ jsxs23("div", { className: "flex items-center gap-2 text-sm", children: [
           /* @__PURE__ */ jsx28(
             "div",
             {
@@ -4583,7 +4606,7 @@ var BarChart = ({
               style: { backgroundColor: entry.color }
             }
           ),
-          /* @__PURE__ */ jsxs22("span", { className: "text-muted-foreground", children: [
+          /* @__PURE__ */ jsxs23("span", { className: "text-muted-foreground", children: [
             entry.name,
             ":"
           ] }),
@@ -4604,7 +4627,7 @@ var BarChart = ({
         return `${baseClasses} text-left`;
     }
   };
-  return /* @__PURE__ */ jsxs22(
+  return /* @__PURE__ */ jsxs23(
     "div",
     {
       className: cn("rounded-lg bg-card p-4 relative", className),
@@ -4614,7 +4637,7 @@ var BarChart = ({
       },
       children: [
         title && /* @__PURE__ */ jsx28("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ jsx28("h3", { className: getTitleClassName(titlePosition), children: title }) }),
-        /* @__PURE__ */ jsxs22(
+        /* @__PURE__ */ jsxs23(
           RechartsBarChart,
           {
             data: processedData,
@@ -4727,7 +4750,7 @@ var BarChart = ({
             guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
             guide.targetTooltip.top + guide.targetTooltip.height / 2
           );
-          return /* @__PURE__ */ jsxs22("div", { children: [
+          return /* @__PURE__ */ jsxs23("div", { children: [
             /* @__PURE__ */ jsx28(
               "div",
               {
@@ -4825,7 +4848,7 @@ import {
   Legend as Legend3,
   LabelList as LabelList3
 } from "recharts";
-import { jsx as jsx29, jsxs as jsxs23 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
 var defaultData = [
   { name: "A", value: 100 },
   { name: "B", value: 200 },
@@ -5207,7 +5230,7 @@ var CustomLineChart = ({
         return "text-left";
     }
   };
-  return /* @__PURE__ */ jsx29("div", { className: cn("relative", className), children: /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsx29("div", { className: cn("relative", className), children: /* @__PURE__ */ jsxs24(
     "div",
     {
       className: "rounded-lg bg-card p-4 relative border border-border",
@@ -5218,7 +5241,7 @@ var CustomLineChart = ({
       onClick: handleChartBackgroundClick,
       children: [
         title && /* @__PURE__ */ jsx29("div", { style: { paddingLeft: `${resolvedContainerPaddingLeft}px` }, children: /* @__PURE__ */ jsx29("div", { className: cn("mb-4", getTitleClass()), children: /* @__PURE__ */ jsx29("h3", { className: "text-lg font-semibold text-foreground", children: title }) }) }),
-        /* @__PURE__ */ jsxs23(
+        /* @__PURE__ */ jsxs24(
           RechartsLineChart,
           {
             data,
@@ -5309,7 +5332,7 @@ var CustomLineChart = ({
             guide.sourceTooltip.top + guide.sourceTooltip.height / 2,
             guide.targetTooltip.top + guide.targetTooltip.height / 2
           );
-          return /* @__PURE__ */ jsxs23("div", { children: [
+          return /* @__PURE__ */ jsxs24("div", { children: [
             /* @__PURE__ */ jsx29(
               "div",
               {
@@ -5402,7 +5425,7 @@ import {
   Tooltip as Tooltip4,
   Legend as Legend4
 } from "recharts";
-import { jsx as jsx30, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
 var defaultData2 = [
   { name: "Vendas", value: 4e3 },
   { name: "Marketing", value: 3e3 },
@@ -5469,7 +5492,7 @@ var CustomPieChart = ({
   centerY = "50%"
 }) => {
   const finalColors = colors2 || DEFAULT_COLORS4;
-  return /* @__PURE__ */ jsx30("div", { className: cn("w-full rounded-lg bg-card p-4", className), children: /* @__PURE__ */ jsx30(ResponsiveContainer2, { width, height, children: /* @__PURE__ */ jsxs24(RechartsPieChart, { children: [
+  return /* @__PURE__ */ jsx30("div", { className: cn("w-full rounded-lg bg-card p-4", className), children: /* @__PURE__ */ jsx30(ResponsiveContainer2, { width, height, children: /* @__PURE__ */ jsxs25(RechartsPieChart, { children: [
     /* @__PURE__ */ jsx30(
       Pie,
       {
@@ -5965,7 +5988,7 @@ import {
   FilePptIcon,
   FileDocIcon
 } from "@phosphor-icons/react";
-import { Fragment as Fragment6, jsx as jsx35, jsxs as jsxs25 } from "react/jsx-runtime";
+import { Fragment as Fragment6, jsx as jsx35, jsxs as jsxs26 } from "react/jsx-runtime";
 var formatFileSize = (bytes) => {
   if (bytes === 0) return "0 Bytes";
   const k = 1024;
@@ -6175,7 +6198,7 @@ var FileUploader = React18.forwardRef(
     };
     const acceptString = accept.join(",");
     const defaultSubtext = dropzoneSubtext || `Formatos: ${accept.join(", ")}. M\xE1ximo: ${formatFileSize(maxSize)}`;
-    return /* @__PURE__ */ jsx35("div", { ref, className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxs25(
+    return /* @__PURE__ */ jsx35("div", { ref, className: cn("w-full", className), ...props, children: /* @__PURE__ */ jsxs26(
       motion10.div,
       {
         className: cn(
@@ -6266,7 +6289,7 @@ var FileUploader = React18.forwardRef(
               children: defaultSubtext
             }
           ),
-          /* @__PURE__ */ jsx35(AnimatePresence8, { children: files.length > 0 && /* @__PURE__ */ jsxs25(
+          /* @__PURE__ */ jsx35(AnimatePresence8, { children: files.length > 0 && /* @__PURE__ */ jsxs26(
             motion10.div,
             {
               initial: { opacity: 0, scale: 0.8, y: 10 },
@@ -6284,7 +6307,7 @@ var FileUploader = React18.forwardRef(
               transition: { duration: 0.3 },
               children: [
                 /* @__PURE__ */ jsx35("div", { className: "h-4 w-4 text-primary flex items-center justify-center", children: /* @__PURE__ */ jsx35(CheckIcon6, { size: 16, className: "text-emerald-500" }) }),
-                /* @__PURE__ */ jsxs25(
+                /* @__PURE__ */ jsxs26(
                   motion10.span,
                   {
                     className: "text-sm font-semibold text-primary",
@@ -6307,15 +6330,15 @@ var FileUploader = React18.forwardRef(
               initial: animate ? { opacity: 0, y: 10 } : false,
               animate: { opacity: 1, y: 0 },
               transition: { delay: 0.3 },
-              children: /* @__PURE__ */ jsxs25("div", { children: [
-                /* @__PURE__ */ jsxs25("h4", { className: "mb-3 text-sm font-medium text-muted-foreground", children: [
+              children: /* @__PURE__ */ jsxs26("div", { children: [
+                /* @__PURE__ */ jsxs26("h4", { className: "mb-3 text-sm font-medium text-muted-foreground", children: [
                   "Arquivos selecionados (",
                   files.length,
                   "/",
                   maxFiles,
                   ")"
                 ] }),
-                /* @__PURE__ */ jsx35("div", { className: "space-y-2 overflow-y-auto max-h-44", children: /* @__PURE__ */ jsx35(AnimatePresence8, { mode: "popLayout", children: files.map((file, index) => /* @__PURE__ */ jsxs25(
+                /* @__PURE__ */ jsx35("div", { className: "space-y-2 overflow-y-auto max-h-44", children: /* @__PURE__ */ jsx35(AnimatePresence8, { mode: "popLayout", children: files.map((file, index) => /* @__PURE__ */ jsxs26(
                   motion10.div,
                   {
                     layout: true,
@@ -6349,7 +6372,7 @@ var FileUploader = React18.forwardRef(
                         // Ícone baseado no tipo de arquivo
                         getFileTypeIcon(file)
                       ) }),
-                      /* @__PURE__ */ jsxs25("div", { className: "min-w-0 flex-1", children: [
+                      /* @__PURE__ */ jsxs26("div", { className: "min-w-0 flex-1", children: [
                         /* @__PURE__ */ jsx35(
                           "p",
                           {
@@ -6358,9 +6381,9 @@ var FileUploader = React18.forwardRef(
                             children: file.name
                           }
                         ),
-                        /* @__PURE__ */ jsxs25("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
+                        /* @__PURE__ */ jsxs26("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
                           /* @__PURE__ */ jsx35("span", { children: formatFileSize(file.size) }),
-                          file.type && /* @__PURE__ */ jsxs25(Fragment6, { children: [
+                          file.type && /* @__PURE__ */ jsxs26(Fragment6, { children: [
                             /* @__PURE__ */ jsx35("span", { children: "\u2022" }),
                             /* @__PURE__ */ jsx35("span", { className: "uppercase", children: getFileExtension(file.name) })
                           ] })
@@ -6405,7 +6428,7 @@ FileUploader.displayName = "FileUploader";
 // src/components/ui/feedback/AlertDialogBase.tsx
 import * as React19 from "react";
 import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
-import { jsx as jsx36, jsxs as jsxs26 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
 var AlertDialogBase = AlertDialogPrimitive.Root;
 var AlertDialogTriggerBase = AlertDialogPrimitive.Trigger;
 var AlertDialogPortalBase = AlertDialogPrimitive.Portal;
@@ -6422,7 +6445,7 @@ var AlertDialogOverlayBase = React19.forwardRef(({ className, testid = "alertdia
   }
 ));
 AlertDialogOverlayBase.displayName = AlertDialogPrimitive.Overlay.displayName;
-var AlertDialogContentBase = React19.forwardRef(({ className, testid = "alertdialog-content", ...props }, ref) => /* @__PURE__ */ jsxs26(AlertDialogPortalBase, { children: [
+var AlertDialogContentBase = React19.forwardRef(({ className, testid = "alertdialog-content", ...props }, ref) => /* @__PURE__ */ jsxs27(AlertDialogPortalBase, { children: [
   /* @__PURE__ */ jsx36(AlertDialogOverlayBase, {}),
   /* @__PURE__ */ jsx36(
     AlertDialogPrimitive.Content,
@@ -6510,7 +6533,7 @@ AlertDialogCancelBase.displayName = AlertDialogPrimitive.Cancel.displayName;
 // src/components/ui/feedback/DestructiveDialog.tsx
 import * as React20 from "react";
 import { XCircleIcon } from "@phosphor-icons/react";
-import { jsx as jsx37, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs28 } from "react/jsx-runtime";
 var DestructiveDialog = ({
   title,
   description,
@@ -6520,21 +6543,21 @@ var DestructiveDialog = ({
   triggerContent
 }) => {
   const triggerEl = React20.isValidElement(children) ? /* @__PURE__ */ jsx37(AlertDialogTriggerBase, { asChild: true, children }) : /* @__PURE__ */ jsx37(AlertDialogTriggerBase, { children: /* @__PURE__ */ jsx37(ButtonBase, { variant: "destructive", children: triggerContent ?? "Excluir" }) });
-  return /* @__PURE__ */ jsxs27(AlertDialogBase, { children: [
+  return /* @__PURE__ */ jsxs28(AlertDialogBase, { children: [
     triggerEl,
-    /* @__PURE__ */ jsxs27(
+    /* @__PURE__ */ jsxs28(
       AlertDialogContentBase,
       {
         className: cn("border border-destructive bg-background"),
         children: [
-          /* @__PURE__ */ jsxs27("div", { className: "flex items-start gap-4", children: [
+          /* @__PURE__ */ jsxs28("div", { className: "flex items-start gap-4", children: [
             /* @__PURE__ */ jsx37("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ jsx37(XCircleIcon, { className: "w-6 h-6 text-destructive" }) }),
-            /* @__PURE__ */ jsxs27("div", { className: "flex-1", children: [
+            /* @__PURE__ */ jsxs28("div", { className: "flex-1", children: [
               /* @__PURE__ */ jsx37(AlertDialogTitleBase, { className: "text-lg sm:text-xl font-semibold text-destructive", children: title }),
               /* @__PURE__ */ jsx37(AlertDialogDescriptionBase, { className: "mt-2 text-sm text-muted-foreground", children: description })
             ] })
           ] }),
-          /* @__PURE__ */ jsxs27(AlertDialogFooterBase, { className: "mt-2 flex justify-end gap-3", children: [
+          /* @__PURE__ */ jsxs28(AlertDialogFooterBase, { className: "mt-2 flex justify-end gap-3", children: [
             /* @__PURE__ */ jsx37(
               AlertDialogCancelBase,
               {
@@ -6566,7 +6589,7 @@ var DestructiveDialog = ({
 // src/components/ui/feedback/LoadingBase.tsx
 import * as React21 from "react";
 import { cva as cva3 } from "class-variance-authority";
-import { jsx as jsx38, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx38, jsxs as jsxs29 } from "react/jsx-runtime";
 var loadingVariants = cva3(
   "rounded-full border-2 animate-spin border-muted border-t-primary",
   {
@@ -6640,7 +6663,7 @@ var LoadingBase = React21.forwardRef(
     }, []);
     const renderSpinner = () => {
       if (variant === "dots") {
-        return /* @__PURE__ */ jsxs28("div", { className: cn(dotsVariants({ size })), "aria-hidden": "true", children: [
+        return /* @__PURE__ */ jsxs29("div", { className: cn(dotsVariants({ size })), "aria-hidden": "true", children: [
           /* @__PURE__ */ jsx38(
             "div",
             {
@@ -6687,7 +6710,7 @@ var LoadingBase = React21.forwardRef(
         }
       );
     };
-    const loadingContent = /* @__PURE__ */ jsxs28("div", { className: "flex flex-col items-center gap-4", children: [
+    const loadingContent = /* @__PURE__ */ jsxs29("div", { className: "flex flex-col items-center gap-4", children: [
       renderSpinner(),
       message && /* @__PURE__ */ jsx38("p", { className: "text-sm font-medium text-muted-foreground animate-pulse", children: message })
     ] });
@@ -6738,7 +6761,7 @@ LoadingBase.displayName = "LoadingBase";
 import * as React22 from "react";
 import * as DialogPrimitive2 from "@radix-ui/react-dialog";
 import { XIcon as XIcon6 } from "@phosphor-icons/react";
-import { jsx as jsx39, jsxs as jsxs29 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs30 } from "react/jsx-runtime";
 var ModalBase = DialogPrimitive2.Root;
 var ModalTriggerBase = DialogPrimitive2.Trigger;
 var ModalPortalBase = DialogPrimitive2.Portal;
@@ -6768,7 +6791,7 @@ var ModalContentBase = React22.forwardRef(
   }, ref) => {
     const sizeClass = size === "sm" ? "max-w-md" : size === "lg" ? "max-w-4xl" : size === "full" ? "w-full max-w-[calc(100%-2rem)]" : "max-w-2xl";
     const positionClass = centered ? "left-[50%] top-[50%] translate-x-[-50%] translate-y-[-50%]" : "left-[50%] top-20 translate-x-[-50%] translate-y-0 sm:translate-y-0";
-    return /* @__PURE__ */ jsxs29(ModalPortalBase, { children: [
+    return /* @__PURE__ */ jsxs30(ModalPortalBase, { children: [
       /* @__PURE__ */ jsx39(
         ModalOverlayBase,
         {
@@ -6794,7 +6817,7 @@ var ModalContentBase = React22.forwardRef(
           }
         }
       ),
-      /* @__PURE__ */ jsxs29(
+      /* @__PURE__ */ jsxs30(
         DialogPrimitive2.Content,
         {
           ref,
@@ -6809,7 +6832,7 @@ var ModalContentBase = React22.forwardRef(
           ...props,
           children: [
             children,
-            /* @__PURE__ */ jsxs29(DialogPrimitive2.Close, { className: "absolute right-3 top-3 sm:right-4 sm:top-4 rounded-md bg-muted/10 p-1.5 opacity-80 hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none z-10 hover:bg-muted/20 transition-colors", children: [
+            /* @__PURE__ */ jsxs30(DialogPrimitive2.Close, { className: "absolute right-3 top-3 sm:right-4 sm:top-4 rounded-md bg-muted/10 p-1.5 opacity-80 hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none z-10 hover:bg-muted/20 transition-colors", children: [
               /* @__PURE__ */ jsx39(XIcon6, { className: "h-5 w-5 sm:h-4 sm:w-4 text-foreground" }),
               /* @__PURE__ */ jsx39("span", { className: "sr-only", children: "Close" })
             ] })
@@ -6873,7 +6896,7 @@ ModalDescriptionBase.displayName = DialogPrimitive2.Description.displayName;
 // src/components/ui/feedback/ProgressBase.tsx
 import * as React23 from "react";
 import * as ProgressPrimitive from "@radix-ui/react-progress";
-import { jsx as jsx40, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs31 } from "react/jsx-runtime";
 var ProgressBase = React23.forwardRef(
   ({
     className,
@@ -6923,15 +6946,15 @@ var ProgressBase = React23.forwardRef(
         );
       case "bar":
       default:
-        return /* @__PURE__ */ jsxs30("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
+        return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
           label && /* @__PURE__ */ jsx40(LabelBase_default, { className: "py-2", children: label }),
-          /* @__PURE__ */ jsxs30("div", { className: "flex items-center gap-2", children: [
-            showValue && valuePosition === "left" && /* @__PURE__ */ jsxs30("div", { className: "w-12 text-sm text-right font-extrabold", children: [
+          /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-2", children: [
+            showValue && valuePosition === "left" && /* @__PURE__ */ jsxs31("div", { className: "w-12 text-sm text-right font-extrabold", children: [
               Math.round(value || 0),
               "%"
             ] }),
             leftIcon && /* @__PURE__ */ jsx40("div", { className: "flex items-center justify-center", children: leftIcon }),
-            /* @__PURE__ */ jsxs30(
+            /* @__PURE__ */ jsxs31(
               ProgressPrimitive.Root,
               {
                 ref,
@@ -6947,7 +6970,6 @@ var ProgressBase = React23.forwardRef(
                     {
                       className: cn(
                         "h-full transition-all duration-500 ease-in-out rounded-lg",
-                        // quando não usa autocolor, Indicator deve mostrar a cor primária
                         autocolor && autocolor.length >= 2 ? "bg-transparent" : "bg-primary"
                       ),
                       style: { width: `${indicatorWidth}%` }
@@ -6984,13 +7006,13 @@ var ProgressBase = React23.forwardRef(
                     {
                       "aria-hidden": "true",
                       className: "absolute top-0 bottom-0 w-0.5 bg-black/70 transition-all duration-500 ease-in-out pointer-events-none",
-                      style: { left: `100%` },
-                      children: value > 115 && /* @__PURE__ */ jsx40("div", { className: "absolute left-full ml-2 top-1/2 -translate-y-1/2 text-xs whitespace-nowrap font-extrabold", children: `+${Math.round(
+                      style: { left: `${100 / value * 100}%` },
+                      children: value > 120 && /* @__PURE__ */ jsx40("div", { className: "absolute left-full ml-2 top-1/2 -translate-y-1/2 text-xs whitespace-nowrap font-extrabold", children: `+${Math.round(
                         value - 100
                       )}%` })
                     }
                   ),
-                  showValue && valuePosition === "inside" && /* @__PURE__ */ jsxs30(
+                  showValue && valuePosition === "inside" && /* @__PURE__ */ jsxs31(
                     "span",
                     {
                       className: "absolute inset-0 flex items-center justify-center text-sm select-none pointer-events-none text-secondary font-extrabold",
@@ -7004,7 +7026,7 @@ var ProgressBase = React23.forwardRef(
                 ]
               }
             ),
-            showValue && valuePosition === "right" && /* @__PURE__ */ jsxs30("div", { className: "w-12 text-sm font-extrabold text-left", children: [
+            showValue && valuePosition === "right" && /* @__PURE__ */ jsxs31("div", { className: "w-12 text-sm font-extrabold text-left", children: [
               Math.round(value || 0),
               "%"
             ] }),
@@ -7021,7 +7043,7 @@ var ProgressSegmentsBase = ({
   value
 }) => {
   const filled = Math.round(value / 100 * segments);
-  return /* @__PURE__ */ jsxs30("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
+  return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
     label && /* @__PURE__ */ jsx40(LabelBase_default, { className: "py-2", children: label }),
     /* @__PURE__ */ jsx40("div", { className: "flex gap-1 w-full", children: Array.from({ length: segments }).map((_, idx) => /* @__PURE__ */ jsx40(
       "div",
@@ -7052,13 +7074,13 @@ var ProgressPanelsBase = ({
   steps,
   currentStep
 }) => {
-  return /* @__PURE__ */ jsxs30("div", { className: "flex flex-col gap-1 w-full", children: [
+  return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col gap-1 w-full", children: [
     label && /* @__PURE__ */ jsx40(LabelBase_default, { className: "py-2", children: label }),
     /* @__PURE__ */ jsx40("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__ */ jsxs30(React23.Fragment, { children: [
-        /* @__PURE__ */ jsxs30(
+      return /* @__PURE__ */ jsxs31(React23.Fragment, { children: [
+        /* @__PURE__ */ jsxs31(
           "div",
           {
             className: cn(
@@ -7084,9 +7106,9 @@ var ProgressCirclesBase = ({
   steps,
   currentStep
 }) => {
-  return /* @__PURE__ */ jsxs30("div", { className: "flex flex-col gap-2 w-full", children: [
+  return /* @__PURE__ */ jsxs31("div", { className: "flex flex-col gap-2 w-full", children: [
     label && /* @__PURE__ */ jsx40("label", { className: "py-2 text-base font-semibold text-gray-700 dark:text-gray-300", children: label }),
-    /* @__PURE__ */ jsxs30("div", { className: "relative flex items-center justify-between w-full", children: [
+    /* @__PURE__ */ jsxs31("div", { className: "relative flex items-center justify-between w-full", children: [
       /* @__PURE__ */ jsx40("div", { className: "absolute top-5 left-0 w-full h-1 bg-zinc-200 dark:bg-zinc-700" }),
       /* @__PURE__ */ jsx40(
         "div",
@@ -7099,7 +7121,7 @@ var ProgressCirclesBase = ({
       ),
       steps.map((step, idx) => {
         const isActive = idx <= currentStep;
-        return /* @__PURE__ */ jsxs30(
+        return /* @__PURE__ */ jsxs31(
           "div",
           {
             className: "relative flex flex-col items-center w-10",
@@ -7249,13 +7271,13 @@ CheckboxBase.displayName = CheckboxPrimitive.Root.displayName;
 import * as React25 from "react";
 import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
 import { CaretUpDownIcon } from "@phosphor-icons/react";
-import { jsx as jsx44, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs32 } from "react/jsx-runtime";
 var CollapsibleBase = React25.forwardRef(({ ...props }, ref) => {
   return /* @__PURE__ */ jsx44(CollapsiblePrimitive.Root, { ref, "data-slot": "collapsible", ...props });
 });
 CollapsibleBase.displayName = CollapsiblePrimitive.Root.displayName;
 var CollapsibleTriggerBase = React25.forwardRef(({ className, children, leftIcon, showCaret = true, ...props }, ref) => {
-  return /* @__PURE__ */ jsxs31(
+  return /* @__PURE__ */ jsxs32(
     CollapsiblePrimitive.CollapsibleTrigger,
     {
       ref,
@@ -7266,7 +7288,7 @@ var CollapsibleTriggerBase = React25.forwardRef(({ className, children, leftIcon
       "data-slot": "collapsible-trigger",
       ...props,
       children: [
-        /* @__PURE__ */ jsxs31("div", { className: "flex items-center gap-2", children: [
+        /* @__PURE__ */ jsxs32("div", { className: "flex items-center gap-2", children: [
           leftIcon && /* @__PURE__ */ jsx44("span", { className: "flex-shrink-0 [&>svg]:size-4", children: leftIcon }),
           /* @__PURE__ */ jsx44("span", { children })
         ] }),
@@ -7295,7 +7317,7 @@ CollapsibleContentBase.displayName = CollapsiblePrimitive.CollapsibleContent.dis
 
 // src/components/ui/form/DebounceInput.tsx
 import { useEffect as useEffect10, useState as useState11 } from "react";
-import { CircleNotchIcon } from "@phosphor-icons/react";
+import { CircleNotchIcon as CircleNotchIcon2 } from "@phosphor-icons/react";
 import { jsx as jsx45 } from "react/jsx-runtime";
 
 // src/components/ui/form/HoverCardBase.tsx
@@ -7338,7 +7360,7 @@ function HoverCardContentBase({
 import * as React26 from "react";
 import { OTPInput, OTPInputContext } from "input-otp";
 import { MinusIcon } from "@phosphor-icons/react";
-import { jsx as jsx47, jsxs as jsxs32 } from "react/jsx-runtime";
+import { jsx as jsx47, jsxs as jsxs33 } from "react/jsx-runtime";
 function InputOTPBase({
   className,
   containerClassName,
@@ -7374,7 +7396,7 @@ function InputOTPSlotBase({
 }) {
   const inputOTPContext = React26.useContext(OTPInputContext);
   const { char, hasFakeCaret, isActive } = inputOTPContext?.slots[index] ?? {};
-  return /* @__PURE__ */ jsxs32(
+  return /* @__PURE__ */ jsxs33(
     "div",
     {
       "data-slot": "input-otp-slot",
@@ -7398,7 +7420,7 @@ function InputOTPSeparatorBase({ ...props }) {
 // src/components/ui/form/SliderBase.tsx
 import * as React27 from "react";
 import * as SliderPrimitive from "@radix-ui/react-slider";
-import { jsx as jsx48, jsxs as jsxs33 } from "react/jsx-runtime";
+import { jsx as jsx48, jsxs as jsxs34 } from "react/jsx-runtime";
 var SlideBase = React27.forwardRef(
   ({
     className,
@@ -7409,13 +7431,13 @@ var SlideBase = React27.forwardRef(
     ...props
   }, ref) => {
     const isVertical = orientation === "vertical";
-    return /* @__PURE__ */ jsxs33(
+    return /* @__PURE__ */ jsxs34(
       "div",
       {
         className: cn("flex flex-col gap-1", isVertical ? "h-full " : "w-full"),
         children: [
           label && /* @__PURE__ */ jsx48(LabelBase_default, { className: "py-2", children: label }),
-          /* @__PURE__ */ jsxs33(
+          /* @__PURE__ */ jsxs34(
             "div",
             {
               className: cn(
@@ -7424,7 +7446,7 @@ var SlideBase = React27.forwardRef(
               ),
               children: [
                 leftIcon && /* @__PURE__ */ jsx48("div", { className: "flex items-center justify-center", children: leftIcon }),
-                /* @__PURE__ */ jsxs33(
+                /* @__PURE__ */ jsxs34(
                   SliderPrimitive.Root,
                   {
                     ref,
@@ -8240,7 +8262,7 @@ SwitchBase.displayName = SwitchPrimitives.Root.displayName;
 import * as React30 from "react";
 import { motion as motion12 } from "framer-motion";
 import { TrashIcon as TrashIcon2 } from "@phosphor-icons/react";
-import { jsx as jsx51, jsxs as jsxs34 } from "react/jsx-runtime";
+import { jsx as jsx51, jsxs as jsxs35 } from "react/jsx-runtime";
 var TextAreaBase = React30.forwardRef(
   ({ className, clearable = false, onClear, ...props }, ref) => {
     const [isFocused, setIsFocused] = React30.useState(false);
@@ -8288,7 +8310,7 @@ var TextAreaBase = React30.forwardRef(
     React30.useEffect(() => {
       setHasContent(!!props.value || !!props.defaultValue);
     }, [props.value, props.defaultValue]);
-    return /* @__PURE__ */ jsxs34("div", { className: "relative", children: [
+    return /* @__PURE__ */ jsxs35("div", { className: "relative", children: [
       /* @__PURE__ */ jsx51(
         "textarea",
         {
@@ -8312,7 +8334,7 @@ var TextAreaBase = React30.forwardRef(
           ...props
         }
       ),
-      clearable && hasContent && /* @__PURE__ */ jsx51(TooltipProviderBase, { children: /* @__PURE__ */ jsxs34(
+      clearable && hasContent && /* @__PURE__ */ jsx51(TooltipProviderBase, { children: /* @__PURE__ */ jsxs35(
         TooltipBase,
         {
           open: showConfirmTooltip,
@@ -8339,14 +8361,14 @@ var TextAreaBase = React30.forwardRef(
                 children: /* @__PURE__ */ jsx51(TrashIcon2, { size: 16, weight: "regular" })
               }
             ) }),
-            /* @__PURE__ */ jsxs34(
+            /* @__PURE__ */ jsxs35(
               TooltipContentBase,
               {
                 side: "left",
                 className: "bg-background border border-border shadow-lg p-3 flex flex-col gap-2",
                 children: [
                   /* @__PURE__ */ jsx51("p", { className: "text-sm text-foreground font-medium mb-1", children: "Limpar todo o texto?" }),
-                  /* @__PURE__ */ jsxs34("div", { className: "flex gap-2", children: [
+                  /* @__PURE__ */ jsxs35("div", { className: "flex gap-2", children: [
                     /* @__PURE__ */ jsx51(
                       "button",
                       {
@@ -8392,7 +8414,7 @@ var TextAreaBase = React30.forwardRef(
           children: /* @__PURE__ */ jsx51("div", { className: "absolute inset-0 rounded-lg bg-gradient-to-r from-ring/20 via-ring/10 to-ring/20 blur-sm" })
         }
       ),
-      isFocused && hasContent && props.maxLength && /* @__PURE__ */ jsxs34(
+      isFocused && hasContent && props.maxLength && /* @__PURE__ */ jsxs35(
         motion12.div,
         {
           initial: { opacity: 0, y: -10 },
@@ -8415,7 +8437,7 @@ TextAreaBase.displayName = "TextAreaBase";
 import * as React31 from "react";
 import useEmblaCarousel from "embla-carousel-react";
 import { ArrowLeftIcon as ArrowLeftIcon2, ArrowRightIcon as ArrowRightIcon2 } from "@phosphor-icons/react";
-import { jsx as jsx52, jsxs as jsxs35 } from "react/jsx-runtime";
+import { jsx as jsx52, jsxs as jsxs36 } from "react/jsx-runtime";
 var CarouselContext = React31.createContext(null);
 function useCarousel() {
   const context = React31.useContext(CarouselContext);
@@ -8558,7 +8580,7 @@ function CarouselPrevious({
   ...props
 }) {
   const { orientation, scrollPrev, canScrollPrev } = useCarousel();
-  return /* @__PURE__ */ jsxs35(
+  return /* @__PURE__ */ jsxs36(
     ButtonBase,
     {
       "data-slot": "carousel-previous",
@@ -8586,7 +8608,7 @@ function CarouselNextBase({
   ...props
 }) {
   const { orientation, scrollNext, canScrollNext } = useCarousel();
-  return /* @__PURE__ */ jsxs35(
+  return /* @__PURE__ */ jsxs36(
     ButtonBase,
     {
       "data-slot": "carousel-next",
@@ -8782,7 +8804,7 @@ TabsContentBase.displayName = TabsPrimitive.Content.displayName;
 // src/components/ui/navigation/BreadcrumbBase.tsx
 import { Slot as Slot4 } from "@radix-ui/react-slot";
 import { CaretRightIcon as CaretRightIcon3, DotsThreeIcon as DotsThreeIcon3 } from "@phosphor-icons/react";
-import { jsx as jsx56, jsxs as jsxs36 } from "react/jsx-runtime";
+import { jsx as jsx56, jsxs as jsxs37 } from "react/jsx-runtime";
 function BreadcrumbBase({ ...props }) {
   return /* @__PURE__ */ jsx56("nav", { "aria-label": "breadcrumb", "data-slot": "breadcrumb", ...props });
 }
@@ -8858,7 +8880,7 @@ function BreadcrumbEllipsisBase({
   className,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs36(
+  return /* @__PURE__ */ jsxs37(
     "span",
     {
       "data-slot": "breadcrumb-ellipsis",
@@ -8877,14 +8899,14 @@ function BreadcrumbEllipsisBase({
 // src/components/ui/navigation/NavigationMenuBase.tsx
 import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
 import { CaretDownIcon as CaretDownIcon3 } from "@phosphor-icons/react";
-import { jsx as jsx57, jsxs as jsxs37 } from "react/jsx-runtime";
+import { jsx as jsx57, jsxs as jsxs38 } from "react/jsx-runtime";
 function NavigationMenuBase({
   className,
   children,
   viewport = true,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs37(
+  return /* @__PURE__ */ jsxs38(
     NavigationMenuPrimitive.Root,
     {
       "data-slot": "navigation-menu",
@@ -8935,7 +8957,7 @@ function NavigationMenuTriggerBase({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs37(
+  return /* @__PURE__ */ jsxs38(
     NavigationMenuPrimitive.Trigger,
     {
       "data-slot": "navigation-menu-trigger",
@@ -9048,7 +9070,7 @@ import * as React36 from "react";
 import * as SheetPrimitive from "@radix-ui/react-dialog";
 import { cva as cva4 } from "class-variance-authority";
 import { XIcon as XIcon8 } from "@phosphor-icons/react";
-import { jsx as jsx58, jsxs as jsxs38 } from "react/jsx-runtime";
+import { jsx as jsx58, jsxs as jsxs39 } from "react/jsx-runtime";
 var SheetBase = SheetPrimitive.Root;
 var SheetTriggerBase = SheetPrimitive.Trigger;
 var SheetCloseBase = SheetPrimitive.Close;
@@ -9081,16 +9103,16 @@ var sheetVariants = cva4(
     }
   }
 );
-var SheetContentBase = React36.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs38(SheetPortalBase, { children: [
+var SheetContentBase = React36.forwardRef(({ side = "right", className, children, ...props }, ref) => /* @__PURE__ */ jsxs39(SheetPortalBase, { children: [
   /* @__PURE__ */ jsx58(SheetOverlayBase, {}),
-  /* @__PURE__ */ jsxs38(
+  /* @__PURE__ */ jsxs39(
     SheetPrimitive.Content,
     {
       ref,
       className: cn(sheetVariants({ side }), className),
       ...props,
       children: [
-        /* @__PURE__ */ jsxs38(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__ */ jsxs39(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__ */ jsx58(XIcon8, { className: "h-4 w-4" }),
           /* @__PURE__ */ jsx58("span", { className: "sr-only", children: "Close" })
         ] }),
@@ -9149,7 +9171,7 @@ SheetDescriptionBase.displayName = SheetPrimitive.Description.displayName;
 
 // src/components/ui/navigation/SidebarBase.tsx
 import { SidebarSimpleIcon } from "@phosphor-icons/react";
-import { jsx as jsx59, jsxs as jsxs39 } from "react/jsx-runtime";
+import { jsx as jsx59, jsxs as jsxs40 } from "react/jsx-runtime";
 var SIDEBAR_COOKIE_NAME = "sidebar:state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH = "16rem";
@@ -9277,7 +9299,7 @@ var SidebarBase = React37.forwardRef(
         }
       ) });
     }
-    return /* @__PURE__ */ jsxs39(
+    return /* @__PURE__ */ jsxs40(
       "div",
       {
         ref,
@@ -9327,7 +9349,7 @@ var SidebarBase = React37.forwardRef(
 SidebarBase.displayName = "SidebarBase";
 var SidebarTriggerBase = React37.forwardRef(({ className, onClick, ...props }, ref) => {
   const { toggleSidebar } = UseSideBarBase();
-  return /* @__PURE__ */ jsx59("div", { children: /* @__PURE__ */ jsxs39(
+  return /* @__PURE__ */ jsx59("div", { children: /* @__PURE__ */ jsxs40(
     ButtonBase,
     {
       ref,
@@ -9583,7 +9605,7 @@ var SidebarMenuButtonBase = React37.forwardRef(
         children: tooltip
       };
     }
-    return /* @__PURE__ */ jsxs39(TooltipBase, { children: [
+    return /* @__PURE__ */ jsxs40(TooltipBase, { children: [
       /* @__PURE__ */ jsx59(TooltipTriggerBase, { asChild: true, children: button }),
       /* @__PURE__ */ jsx59(
         TooltipContentBase,
@@ -9643,7 +9665,7 @@ var SidebarMenuSkeletonBase = React37.forwardRef(({ className, showIcon = false,
   const width = React37.useMemo(() => {
     return `${Math.floor(Math.random() * 40) + 50}%`;
   }, []);
-  return /* @__PURE__ */ jsxs39(
+  return /* @__PURE__ */ jsxs40(
     "div",
     {
       ref,
@@ -9714,7 +9736,7 @@ SidebarMenuSubButtonBase.displayName = "SidebarMenuSubButtonBase";
 
 // src/components/ui/overlays/DrawerBase.tsx
 import { Drawer as DrawerPrimitive } from "vaul";
-import { jsx as jsx60, jsxs as jsxs40 } from "react/jsx-runtime";
+import { jsx as jsx60, jsxs as jsxs41 } from "react/jsx-runtime";
 function DrawerBase({
   ...props
 }) {
@@ -9756,9 +9778,9 @@ function DrawerContentBase({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs40(DrawerPortalBase, { children: [
+  return /* @__PURE__ */ jsxs41(DrawerPortalBase, { children: [
     /* @__PURE__ */ jsx60(DrawerOverlayBase, {}),
-    /* @__PURE__ */ jsxs40(
+    /* @__PURE__ */ jsxs41(
       DrawerPrimitive.Content,
       {
         "data-slot": "drawer-content",
@@ -9895,7 +9917,7 @@ var useTooltip = () => {
 
 // src/components/ui/UniversalTooltipRenderer.tsx
 import { XIcon as XIcon9 } from "@phosphor-icons/react/dist/ssr";
-import { jsx as jsx62, jsxs as jsxs41 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs42 } from "react/jsx-runtime";
 var UniversalTooltipRenderer = ({
   className,
   showCloseButton = true,
@@ -9912,8 +9934,8 @@ var UniversalTooltipRenderer = ({
     clearAllTooltips
   } = useUniversalTooltip();
   const { removeTooltip, handleElementMouseDown } = useTooltip();
-  return /* @__PURE__ */ jsxs41("div", { className: cn("fixed inset-0 pointer-events-none z-50", className), children: [
-    showCloseAllButton && tooltips.length > 1 && /* @__PURE__ */ jsx62("div", { className: "fixed top-6 left-1/2 transform -translate-x-1/2 z-50 pointer-events-auto animate-in fade-in slide-in-from-top-2 duration-300", children: /* @__PURE__ */ jsxs41(
+  return /* @__PURE__ */ jsxs42("div", { className: cn("fixed inset-0 pointer-events-none z-50", className), children: [
+    showCloseAllButton && tooltips.length > 1 && /* @__PURE__ */ jsx62("div", { className: "fixed top-6 left-1/2 transform -translate-x-1/2 z-50 pointer-events-auto animate-in fade-in slide-in-from-top-2 duration-300", children: /* @__PURE__ */ jsxs42(
       "button",
       {
         onClick: clearAllTooltips,
@@ -9935,7 +9957,7 @@ var UniversalTooltipRenderer = ({
       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__ */ jsxs41("div", { className: "pointer-events-none", children: [
+      return /* @__PURE__ */ jsxs42("div", { className: "pointer-events-none", children: [
         /* @__PURE__ */ jsx62(
           "div",
           {
@@ -9989,7 +10011,7 @@ var UniversalTooltipRenderer = ({
         )
       ] }, index);
     }),
-    tooltips.map((tooltip) => /* @__PURE__ */ jsxs41(
+    tooltips.map((tooltip) => /* @__PURE__ */ jsxs42(
       "div",
       {
         className: cn(
@@ -10003,8 +10025,8 @@ var UniversalTooltipRenderer = ({
         },
         onMouseDown: (e) => handleElementMouseDown(tooltip.id, e),
         children: [
-          /* @__PURE__ */ jsxs41("div", { className: "flex items-center justify-between p-3 border-b bg-muted/20 rounded-t-lg", children: [
-            /* @__PURE__ */ jsxs41("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs42("div", { className: "flex items-center justify-between p-3 border-b bg-muted/20 rounded-t-lg", children: [
+            /* @__PURE__ */ jsxs42("div", { className: "flex items-center gap-2", children: [
               /* @__PURE__ */ jsx62("div", { className: "w-2 h-2 bg-primary rounded-full" }),
               /* @__PURE__ */ jsx62("span", { className: "text-sm font-medium text-muted-foreground", children: "Tooltip" })
             ] }),
@@ -10044,7 +10066,7 @@ import {
   CalendarIcon
 } from "@phosphor-icons/react";
 import { AnimatePresence as AnimatePresence9 } from "framer-motion";
-import { jsx as jsx63, jsxs as jsxs42 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs43 } from "react/jsx-runtime";
 function CalendarBase2({
   className,
   classNames,
@@ -10065,7 +10087,7 @@ function CalendarBase2({
     "div",
     {
       className: cn(
-        "rounded-md border bg-background p-2 overflow-hidden flex flex-col",
+        "rounded-md border bg-background p-2 sm:p-3 md:p-4 overflow-hidden flex flex-col",
         className
       ),
       children: /* @__PURE__ */ jsx63("div", { className: "relative flex-1 flex flex-col min-h-0", children: /* @__PURE__ */ jsx63(AnimatePresence9, { initial: false, mode: "wait", custom: direction, children: /* @__PURE__ */ jsx63(
@@ -10078,43 +10100,38 @@ function CalendarBase2({
               showOutsideDays,
               month,
               onMonthChange: handleMonthChange,
-              className: "w-full h-full min-w-0 flex flex-col",
+              className: "w-full h-full flex flex-col",
               classNames: {
-                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",
+                months: "flex flex-col sm:flex-row gap-3 sm:gap-4 w-full",
+                month: "flex-1 min-w-0",
+                caption: "flex items-center justify-between gap-2 pr-1 min-h-[2.25rem] mb-2",
+                caption_label: "text-[clamp(0.85rem,1.4vw,1.125rem)] sm:text-[clamp(0.9rem,1.6vw,1.125rem)] font-semibold capitalize text-left",
+                nav: "flex items-center gap-2",
                 nav_button: cn(
                   buttonVariantsBase({ variant: "outline" }),
-                  "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"
+                  "h-8 w-8 sm:h-9 sm:w-9 md:h-10 md:w-10 flex items-center justify-center p-0 rounded-md transition-transform duration-150 ease-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/40 active:scale-95"
                 ),
-                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",
+                nav_button_previous: "",
+                nav_button_next: "",
+                table: "w-full min-w-0 flex-1 grid grid-rows-[auto_1fr] gap-2",
+                head_row: "grid grid-cols-7 gap-1 mb-1",
+                head_cell: "text-muted-foreground rounded-md font-semibold text-[clamp(0.575rem,1.2vw,0.75rem)] sm:text-[clamp(0.65rem,1.1vw,0.825rem)] text-center pb-1 uppercase tracking-wider",
+                row: "grid grid-cols-7 gap-1",
                 cell: cn(
-                  "flex-1 min-w-0 aspect-square text-center p-0 relative",
+                  "min-w-0 h-9 sm:h-10 md:h-11 p-0 relative flex items-center justify-center",
                   "[&: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-lg",
-                  "last:[&:has([aria-selected])]:rounded-r-lg",
-                  "focus-within:relative focus-within:z-20"
+                  "[&:has([aria-selected])]:bg-muted"
                 ),
                 day: cn(
                   buttonVariantsBase({ variant: "ghost" }),
-                  "w-full h-full p-0",
-                  "aria-selected:opacity-100 hover:bg-muted flex items-center justify-center",
-                  " transition-all duration-200 ease-out hover:scale-105 active:scale-95"
+                  "w-full h-full p-0 m-0 flex items-center justify-center text-[clamp(0.775rem,1.2vw,0.95rem)] sm:text-sm",
+                  "aria-selected:opacity-100 hover:bg-muted transition-all duration-150 ease-out active:scale-95"
                 ),
                 day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white",
                 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_outside: "text-muted-foreground/40 opacity-60 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",
@@ -10287,7 +10304,7 @@ function display12HourValue(hours) {
 }
 
 // src/components/picker/TimePickerInput.tsx
-import { jsx as jsx64, jsxs as jsxs43 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs44 } from "react/jsx-runtime";
 var TimePickerInput = React40.forwardRef(
   ({
     className,
@@ -10374,7 +10391,7 @@ var TimePickerInput = React40.forwardRef(
       const baseLabel = getPickerLabel();
       return `${baseLabel}, valor atual: ${calculatedValue}.`;
     };
-    return /* @__PURE__ */ jsxs43("div", { className: "relative group flex flex-col items-center", children: [
+    return /* @__PURE__ */ jsxs44("div", { className: "relative group flex flex-col items-center", children: [
       getPickerLabel() && /* @__PURE__ */ jsx64(
         "label",
         {
@@ -10383,7 +10400,7 @@ var TimePickerInput = React40.forwardRef(
           children: getPickerLabel()
         }
       ),
-      /* @__PURE__ */ jsxs43(
+      /* @__PURE__ */ jsxs44(
         "div",
         {
           className: cn(
@@ -10410,7 +10427,7 @@ var TimePickerInput = React40.forwardRef(
                 children: /* @__PURE__ */ jsx64(CaretUpIcon2, { size: 14, className: "sm:w-4 sm:h-4" })
               }
             ),
-            /* @__PURE__ */ jsxs43("div", { className: "relative", children: [
+            /* @__PURE__ */ jsxs44("div", { className: "relative", children: [
               /* @__PURE__ */ jsx64(
                 "input",
                 {
@@ -10486,7 +10503,7 @@ var TimePickerInput = React40.forwardRef(
 TimePickerInput.displayName = "TimePickerInput";
 
 // src/components/picker/TimePicker.tsx
-import { Fragment as Fragment8, jsx as jsx65, jsxs as jsxs44 } from "react/jsx-runtime";
+import { Fragment as Fragment8, jsx as jsx65, jsxs as jsxs45 } from "react/jsx-runtime";
 function TimePicker({
   date,
   setDate,
@@ -10511,7 +10528,7 @@ function TimePicker({
     hidden: { opacity: 0, y: 10 },
     visible: { opacity: 1, y: 0 }
   };
-  return /* @__PURE__ */ jsxs44(
+  return /* @__PURE__ */ jsxs45(
     motion14.div,
     {
       variants: containerVariants,
@@ -10584,7 +10601,7 @@ function TimePicker({
 
 // src/components/picker/DateTimePicker.tsx
 import { CalendarBlankIcon, ClockIcon } from "@phosphor-icons/react";
-import { jsx as jsx66, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs46 } from "react/jsx-runtime";
 function DateTimePicker({
   label,
   date,
@@ -10640,23 +10657,40 @@ function DateTimePicker({
       setInternalDate(date);
     }
   }, [date, open]);
-  return /* @__PURE__ */ jsxs45("div", { className: cn("space-y-2 w-full sm:w-auto", className), children: [
+  return /* @__PURE__ */ jsxs46("div", { className: cn("space-y-2 w-full sm:w-auto", className), children: [
     label && /* @__PURE__ */ jsx66(LabelBase_default, { children: label }),
-    /* @__PURE__ */ jsxs45(PopoverBase, { open, onOpenChange: setOpen, children: [
-      /* @__PURE__ */ jsx66(PopoverTriggerBase, { disabled, asChild: true, children: /* @__PURE__ */ jsxs45(
-        ButtonBase,
+    /* @__PURE__ */ jsxs46(PopoverBase, { open, onOpenChange: setOpen, children: [
+      /* @__PURE__ */ jsx66(
+        PopoverTriggerBase,
         {
-          variant: "outline",
-          className: cn(
-            "w-full justify-start text-left min-w-0 overflow-hidden",
-            !date && "text-muted-foreground/"
-          ),
-          children: [
-            /* @__PURE__ */ jsx66("span", { className: "truncate flex-1", children: date ? format(date, getDisplayFormat(), { locale: ptBR }) : "Selecione uma data" }),
-            /* @__PURE__ */ jsx66(CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
-          ]
+          disabled,
+          asChild: true,
+          className: cn(error && "border-red-500"),
+          children: /* @__PURE__ */ jsxs46(
+            ButtonBase,
+            {
+              variant: "outline",
+              className: cn(
+                "w-full justify-start text-left min-w-0 overflow-hidden ",
+                !date && "text-muted-foreground"
+              ),
+              children: [
+                /* @__PURE__ */ jsx66(
+                  "span",
+                  {
+                    className: cn(
+                      "truncate flex-1",
+                      !date && "text-muted-foreground"
+                    ),
+                    children: date ? format(date, getDisplayFormat(), { locale: ptBR }) : "Selecione uma data"
+                  }
+                ),
+                /* @__PURE__ */ jsx66(CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
+              ]
+            }
+          )
         }
-      ) }),
+      ),
       /* @__PURE__ */ jsx66(ErrorMessage_default, { error }),
       /* @__PURE__ */ jsx66(
         PopoverContentBase,
@@ -10667,7 +10701,7 @@ function DateTimePicker({
           side: "bottom",
           avoidCollisions: true,
           collisionPadding: 8,
-          children: /* @__PURE__ */ jsxs45("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: [
+          children: /* @__PURE__ */ jsxs46("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__ */ jsx66(
               CalendarBase2,
               {
@@ -10676,6 +10710,7 @@ function DateTimePicker({
                 selected: internalDate,
                 onSelect: (d) => handleSelect(d),
                 initialFocus: true,
+                defaultMonth: fromDate ?? toDate ?? internalDate,
                 fromDate,
                 toDate,
                 className: cn(
@@ -10684,13 +10719,13 @@ function DateTimePicker({
                 )
               }
             ),
-            !hideTime && !(hideHour && hideMinute) && /* @__PURE__ */ jsx66("div", { className: "flex justify-center w-full px-2", children: /* @__PURE__ */ jsxs45(
+            !hideTime && !(hideHour && hideMinute) && /* @__PURE__ */ jsx66("div", { className: "flex justify-center w-full px-2", children: /* @__PURE__ */ jsxs46(
               PopoverBase,
               {
                 open: timePickerOpen,
                 onOpenChange: setTimePickerOpen,
                 children: [
-                  /* @__PURE__ */ jsx66(PopoverTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs45(
+                  /* @__PURE__ */ jsx66(PopoverTriggerBase, { asChild: true, children: /* @__PURE__ */ jsxs46(
                     ButtonBase,
                     {
                       variant: "outline",
@@ -10722,7 +10757,7 @@ function DateTimePicker({
                       sideOffset: 8,
                       avoidCollisions: true,
                       collisionPadding: 8,
-                      children: /* @__PURE__ */ jsxs45("div", { className: "flex flex-col items-center space-y-2 sm:space-y-3", children: [
+                      children: /* @__PURE__ */ jsxs46("div", { className: "flex flex-col items-center space-y-2 sm:space-y-3", children: [
                         /* @__PURE__ */ jsx66("h4", { className: "text-sm sm:text-base font-medium text-center", children: "Alterar Hor\xE1rio" }),
                         /* @__PURE__ */ jsx66(
                           TimePicker,
@@ -10760,6 +10795,8 @@ import * as React42 from "react";
 import {
   DayPicker as DayPicker3
 } from "react-day-picker";
+import ptBR2 from "date-fns/locale/pt-BR";
+import { format as format2 } from "date-fns";
 import {
   CaretLeftIcon as CaretLeftIcon3,
   CaretRightIcon as CaretRightIcon5,
@@ -10767,7 +10804,8 @@ import {
 } from "@phosphor-icons/react";
 import { motion as motion15, AnimatePresence as AnimatePresence11, useAnimation } from "framer-motion";
 import { CalendarDotIcon } from "@phosphor-icons/react/dist/ssr";
-import { jsx as jsx67, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx67, jsxs as jsxs47 } from "react/jsx-runtime";
+var dateFnsLocale = ptBR2?.default ?? ptBR2;
 function RangePicker({
   value,
   onChange,
@@ -10790,14 +10828,14 @@ function RangePicker({
     setRange(void 0);
     onChange?.(void 0);
   };
-  return /* @__PURE__ */ jsxs46(PopoverBase, { open, onOpenChange: setOpen, children: [
+  return /* @__PURE__ */ jsxs47(PopoverBase, { open, onOpenChange: setOpen, children: [
     /* @__PURE__ */ jsx67(PopoverTriggerBase, { asChild: true, children: /* @__PURE__ */ jsx67(
       motion15.div,
       {
         whileTap: { scale: 0.97 },
         whileHover: { scale: open ? 1.03 : 1.01 },
         transition: { type: "spring", stiffness: 300, damping: 20 },
-        children: /* @__PURE__ */ jsxs46(
+        children: /* @__PURE__ */ jsxs47(
           ButtonBase,
           {
             variant: "outline",
@@ -10809,7 +10847,9 @@ function RangePicker({
                   className: "text-sm font-medium",
                   transition: { duration: 0.2 },
                   animate: controls,
-                  children: range?.from && range?.to ? `${range.from.toLocaleDateString()} - ${range.to.toLocaleDateString()}` : label
+                  children: range?.from && range?.to ? `${format2(range.from, "P", {
+                    locale: dateFnsLocale
+                  })} - ${format2(range.to, "P", { locale: dateFnsLocale })}` : label
                 }
               ),
               /* @__PURE__ */ jsx67(
@@ -10831,7 +10871,7 @@ function RangePicker({
       {
         asChild: true,
         className: "w-auto min-w-[250px] p-0 shadow-xl  overflow-y-hidden",
-        children: /* @__PURE__ */ jsxs46(
+        children: /* @__PURE__ */ jsxs47(
           motion15.div,
           {
             initial: { opacity: 0, y: 16 },
@@ -10853,46 +10893,42 @@ function RangePicker({
                       mode: "range",
                       selected: range,
                       onSelect: handleSelect,
+                      locale: dateFnsLocale,
                       showOutsideDays: true,
                       fromDate: minDate,
                       toDate: maxDate,
                       className: "min-w-0 flex flex-col",
                       classNames: {
-                        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",
+                        months: "flex flex-col sm:flex-row gap-3 sm:gap-4 w-full",
+                        month: "flex-1 min-w-0",
+                        caption: "flex items-center justify-between gap-2 pr-1 min-h-[2.25rem] mb-2",
+                        caption_label: "text-[clamp(0.85rem,1.4vw,1.125rem)] sm:text-[clamp(0.9rem,1.6vw,1.125rem)] font-semibold capitalize text-left",
+                        nav: "flex items-center gap-2",
                         nav_button: cn(
                           buttonVariantsBase({ variant: "outline" }),
-                          "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"
+                          "h-8 w-8 sm:h-9 sm:w-9 md:h-10 md:w-10 flex items-center justify-center p-0 rounded-md transition-transform duration-150 ease-out focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-primary/40 active:scale-95"
                         ),
-                        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",
+                        nav_button_previous: "",
+                        nav_button_next: "",
+                        table: "w-full min-w-0 flex-1 grid grid-rows-[auto_1fr] gap-2",
+                        head_row: "grid grid-cols-7 gap-1 mb-1",
+                        head_cell: "text-muted-foreground rounded-md font-semibold text-[clamp(0.575rem,1.2vw,0.75rem)] sm:text-[clamp(0.65rem,1.1vw,0.825rem)] text-center pb-1 uppercase tracking-wider",
+                        row: "grid grid-cols-7 gap-1",
                         cell: cn(
-                          "flex-1 min-w-0 aspect-square text-center  relative",
+                          "min-w-0 h-9 p-0 relative flex items-center justify-center",
                           "[&: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-lg",
-                          "last:[&:has([aria-selected])]:rounded-r-lg",
-                          "focus-within:relative focus-within:z-20"
+                          "[&:has([aria-selected])]:bg-muted"
                         ),
                         day: cn(
                           buttonVariantsBase({ variant: "ghost" }),
-                          "w-full h-full min-w-9",
-                          "aria-selected:opacity-100 hover:bg-muted flex items-center justify-center p-1",
-                          "transition-all duration-200 ease-out !scale-100 aria-selected:!scale-100 hover:!scale-100 active:!scale-100"
+                          "w-full h-full p-0 m-0 flex items-center justify-center text-[clamp(0.775rem,1.2vw,0.95rem)] sm:text-sm",
+                          "aria-selected:opacity-100 hover:bg-muted transition-all duration-150 ease-out active:scale-95"
                         ),
-                        day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white !scale-100 p-1 !border-0 !outline-none",
-                        day_today: "bg-muted text-foreground font-bold ring-2 ring-primary/50 ring-inset p-1 !border-0 !outline-none",
-                        day_outside: "day-outside text-muted-foreground/40 opacity-40 aria-selected:bg-muted/50 aria-selected:text-foreground",
+                        day_selected: "bg-primary text-primary-foreground hover:bg-primary/90 focus:bg-primary/90 font-semibold hover:text-white",
+                        day_today: "bg-muted text-foreground font-bold ring-2 ring-primary/30 ring-inset",
+                        day_outside: "text-muted-foreground/40 opacity-60 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"
@@ -10905,7 +10941,7 @@ function RangePicker({
                   )
                 }
               ) }),
-              /* @__PURE__ */ jsxs46("div", { className: "flex justify-end gap-2 px-4 pb-4", children: [
+              /* @__PURE__ */ jsxs47("div", { className: "flex justify-end gap-2 px-4 pb-4", children: [
                 /* @__PURE__ */ jsx67("div", { style: { display: "inline-block" }, children: /* @__PURE__ */ jsx67(
                   motion15.div,
                   {
@@ -10972,7 +11008,7 @@ RangePicker.displayName = "RangePicker";
 // src/components/ui/navigation/ContextMenuBase.tsx
 import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
 import { CaretRightIcon as CaretRightIcon6, CheckIcon as CheckIcon9, CircleIcon as CircleIcon2 } from "@phosphor-icons/react";
-import { jsx as jsx68, jsxs as jsxs47 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs48 } from "react/jsx-runtime";
 function ContextMenuBase(props) {
   return /* @__PURE__ */ jsx68(ContextMenuPrimitive.Root, { "data-slot": "context-menu", ...props });
 }
@@ -10997,7 +11033,7 @@ function ContextMenuSubTriggerBase({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs47(
+  return /* @__PURE__ */ jsxs48(
     ContextMenuPrimitive.SubTrigger,
     {
       "data-slot": "context-menu-sub-trigger",
@@ -11093,7 +11129,7 @@ function ContextMenuCheckboxItemBase({
   checked,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs47(
+  return /* @__PURE__ */ jsxs48(
     ContextMenuPrimitive.CheckboxItem,
     {
       "data-slot": "context-menu-checkbox-item",
@@ -11119,7 +11155,7 @@ function ContextMenuRadioItemBase({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ jsxs47(
+  return /* @__PURE__ */ jsxs48(
     ContextMenuPrimitive.RadioItem,
     {
       "data-slot": "context-menu-radio-item",
@@ -11181,6 +11217,320 @@ function ContextMenuShortcutBase({
   );
 }
 
+// src/components/ui/CodeBlock.tsx
+import {
+  ArrowRightIcon as ArrowRightIcon3,
+  ArrowsOutIcon,
+  CheckIcon as CheckIcon10,
+  CodeIcon,
+  CopyIcon as CopyIcon2,
+  DownloadIcon,
+  FileArchiveIcon,
+  FolderIcon,
+  GearIcon as GearIcon2,
+  TerminalIcon
+} from "@phosphor-icons/react";
+import React43 from "react";
+import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
+import { jsx as jsx69, jsxs as jsxs49 } from "react/jsx-runtime";
+var CodeBlock = ({
+  language,
+  filename,
+  code,
+  highlightLines = [],
+  tabs = [],
+  breadcrumb = [],
+  showStats = true
+}) => {
+  const [copied, setCopied] = React43.useState(false);
+  const [activeTab, setActiveTab] = React43.useState(0);
+  const [isExpanded, setIsExpanded] = React43.useState(false);
+  const tabsExist = tabs.length > 0;
+  const cssVars = React43.useMemo(
+    () => ({
+      container: {
+        backgroundColor: "hsl(var(--card))",
+        borderColor: "hsl(var(--border))"
+      },
+      header: {
+        backgroundColor: "hsl(var(--popover))",
+        borderBottomColor: "hsl(var(--border))"
+      },
+      filename: { color: "hsl(var(--card-foreground))" },
+      mutedText: { color: "hsl(var(--muted-foreground))" },
+      icon: { color: "hsl(var(--muted-foreground))" },
+      lineNumbers: {
+        color: "hsl(var(--muted-foreground))",
+        borderRight: `1px solid hsl(var(--border))`
+      },
+      highlightBorder: `3px solid hsl(var(--primary))`
+    }),
+    []
+  );
+  const sanitizeCode = (input) => {
+    if (!input) return "";
+    let out = input.replace(
+      /(^['"]use client['"];?\s*|\b'use client';|\b"use client";)/g,
+      ""
+    );
+    out = out.replace(/style=\{[\s\S]*?\}/g, "");
+    out = out.replace(/style=(["'`])(?:\\.|(?!\1)[\s\S])*?\1/g, "");
+    return out;
+  };
+  const getActiveRawCode = () => (tabsExist ? tabs[activeTab].code : code) || "";
+  const activeRawCode = getActiveRawCode();
+  const activeCodeSanitized = sanitizeCode(activeRawCode);
+  const copyToClipboard = async () => {
+    const textToCopy = activeCodeSanitized;
+    if (textToCopy) {
+      await navigator.clipboard.writeText(textToCopy);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+    }
+  };
+  const downloadCode = () => {
+    const textToDownload = activeCodeSanitized;
+    const activeFilename = tabsExist ? tabs[activeTab].name : filename;
+    if (textToDownload) {
+      const blob = new Blob([textToDownload], { type: "text/plain" });
+      const url = URL.createObjectURL(blob);
+      const a = document.createElement("a");
+      a.href = url;
+      a.download = activeFilename;
+      document.body.appendChild(a);
+      a.click();
+      document.body.removeChild(a);
+      URL.revokeObjectURL(url);
+    }
+  };
+  const activeLanguage = tabsExist ? tabs[activeTab].language || language : language;
+  const activeHighlightLines = tabsExist ? tabs[activeTab].highlightLines || [] : highlightLines;
+  const getLanguageIcon = (lang) => {
+    switch (lang.toLowerCase()) {
+      case "javascript":
+      case "jsx":
+      case "typescript":
+      case "tsx":
+        return /* @__PURE__ */ jsx69(CodeIcon, { size: "1em", className: "text-yellow-400" });
+      case "bash":
+      case "shell":
+        return /* @__PURE__ */ jsx69(TerminalIcon, { size: "1em", className: "text-green-400" });
+      default:
+        return /* @__PURE__ */ jsx69(FileArchiveIcon, { size: "1em", className: "text-blue-400" });
+    }
+  };
+  const getCodeStats = (source) => {
+    const lines = source.split("\n").length;
+    const chars = source.length;
+    const words = source.split(/\s+/).filter((word) => word.length > 0).length;
+    return { lines, chars, words };
+  };
+  const stats = showStats ? getCodeStats(activeCodeSanitized) : null;
+  return /* @__PURE__ */ jsxs49(
+    "div",
+    {
+      className: `relative w-full rounded-xl overflow-hidden shadow-sm border no-underline-code`,
+      style: cssVars.container,
+      children: [
+        /* @__PURE__ */ jsx69("style", { children: `.no-underline-code a { text-decoration: none !important; text-shadow: none !important; box-shadow: none !important; } .no-underline-code code a { text-decoration: none !important; }` }),
+        /* @__PURE__ */ jsxs49("div", { className: `flex items-stretch min-h-[3rem]`, style: cssVars.header, children: [
+          /* @__PURE__ */ jsxs49("div", { className: "flex-1 flex items-center min-w-0 px-3", children: [
+            /* @__PURE__ */ jsxs49("div", { className: "flex gap-2 mr-3 shrink-0", children: [
+              /* @__PURE__ */ jsx69("div", { className: "w-3 h-3 rounded-full bg-red-500" }),
+              /* @__PURE__ */ jsx69("div", { className: "w-3 h-3 rounded-full bg-yellow-500" }),
+              /* @__PURE__ */ jsx69("div", { className: "w-3 h-3 rounded-full bg-green-500" })
+            ] }),
+            breadcrumb.length > 0 && /* @__PURE__ */ jsxs49("div", { className: "flex items-center min-w-0", children: [
+              /* @__PURE__ */ jsx69(FolderIcon, { size: "1em", style: cssVars.icon }),
+              /* @__PURE__ */ jsx69("div", { className: "flex items-center min-w-0 ml-2", children: breadcrumb.map((crumb, index) => /* @__PURE__ */ jsxs49(React43.Fragment, { children: [
+                /* @__PURE__ */ jsx69(
+                  "span",
+                  {
+                    className: "text-xs truncate",
+                    style: cssVars.mutedText,
+                    children: crumb
+                  }
+                ),
+                index < breadcrumb.length - 1 && /* @__PURE__ */ jsx69(
+                  ArrowRightIcon3,
+                  {
+                    size: "0.75em",
+                    style: cssVars.icon,
+                    className: "shrink-0 mx-1"
+                  }
+                )
+              ] }, index)) })
+            ] })
+          ] }),
+          /* @__PURE__ */ jsxs49("div", { className: "flex items-center justify-end shrink-0 px-2", children: [
+            stats && /* @__PURE__ */ jsxs49(
+              "div",
+              {
+                className: `text-xs mx-2 truncate hidden md:block`,
+                style: cssVars.mutedText,
+                children: [
+                  stats.lines,
+                  "L \u2022 ",
+                  stats.words,
+                  "W"
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxs49("div", { className: "flex", children: [
+              /* @__PURE__ */ jsx69(
+                "button",
+                {
+                  onClick: () => setIsExpanded(!isExpanded),
+                  className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
+                  title: "Toggle fullscreen",
+                  children: /* @__PURE__ */ jsx69(ArrowsOutIcon, { size: "1em", style: cssVars.icon })
+                }
+              ),
+              /* @__PURE__ */ jsx69(
+                "button",
+                {
+                  onClick: downloadCode,
+                  className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
+                  title: "Download code",
+                  children: /* @__PURE__ */ jsx69(DownloadIcon, { size: "1em", style: cssVars.icon })
+                }
+              ),
+              /* @__PURE__ */ jsx69(
+                "button",
+                {
+                  onClick: copyToClipboard,
+                  className: `p-2 transition-colors hover:bg-gray-200 dark:hover:bg-slate-700`,
+                  title: "Copy code",
+                  children: copied ? /* @__PURE__ */ jsx69(
+                    CheckIcon10,
+                    {
+                      size: "1em",
+                      style: { color: "hsl(var(--primary))" }
+                    }
+                  ) : /* @__PURE__ */ jsx69(CopyIcon2, { size: "1em", style: cssVars.icon })
+                }
+              )
+            ] })
+          ] })
+        ] }),
+        tabsExist && /* @__PURE__ */ jsx69(
+          "div",
+          {
+            className: `flex border-b overflow-x-auto`,
+            style: {
+              borderColor: "hsl(var(--border))",
+              backgroundColor: "hsl(var(--popover))"
+            },
+            children: tabs.map((tab, index) => /* @__PURE__ */ jsxs49(
+              "button",
+              {
+                onClick: () => setActiveTab(index),
+                className: `flex items-center gap-2 px-4 py-2 text-sm transition-all duration-200 border-b-2 shrink-0 ${activeTab === index ? "border-blue-500" : "border-transparent"}`,
+                style: activeTab === index ? {
+                  backgroundColor: "hsl(var(--card))",
+                  color: "hsl(var(--card-foreground))"
+                } : void 0,
+                children: [
+                  getLanguageIcon(tab.language || language),
+                  /* @__PURE__ */ jsx69("span", { className: "truncate max-w-[10rem]", children: tab.name })
+                ]
+              },
+              index
+            ))
+          }
+        ),
+        !tabsExist && filename && /* @__PURE__ */ jsx69(
+          "div",
+          {
+            className: "flex items-center px-3 py-2 border-b",
+            style: {
+              borderColor: "hsl(var(--border))",
+              backgroundColor: "hsl(var(--popover))"
+            },
+            children: /* @__PURE__ */ jsxs49("div", { className: "flex items-center gap-2 min-w-0", children: [
+              getLanguageIcon(language),
+              /* @__PURE__ */ jsx69(
+                "span",
+                {
+                  className: "text-sm font-medium truncate",
+                  style: cssVars.filename,
+                  children: filename
+                }
+              )
+            ] })
+          }
+        ),
+        /* @__PURE__ */ jsx69(
+          "div",
+          {
+            className: `relative ${isExpanded ? "max-h-screen overflow-auto" : "max-h-96 overflow-auto"}`,
+            children: /* @__PURE__ */ jsx69(
+              SyntaxHighlighter,
+              {
+                language: activeLanguage,
+                customStyle: {
+                  margin: 0,
+                  padding: "1rem",
+                  fontSize: "0.875rem",
+                  lineHeight: "1.5",
+                  backgroundColor: "hsl(var(--card))"
+                },
+                wrapLines: true,
+                showLineNumbers: true,
+                lineNumberStyle: {
+                  ...cssVars.lineNumbers,
+                  minWidth: "3em",
+                  paddingRight: "1em",
+                  marginRight: "1em"
+                },
+                lineProps: (lineNumber) => ({
+                  style: {
+                    backgroundColor: activeHighlightLines.includes(lineNumber) ? "hsl(var(--highlight))" : "transparent",
+                    display: "block",
+                    width: "100%",
+                    borderLeft: activeHighlightLines.includes(lineNumber) ? cssVars.highlightBorder : "none",
+                    paddingLeft: "0.5rem"
+                  }
+                }),
+                PreTag: "div",
+                children: String(activeCodeSanitized)
+              }
+            )
+          }
+        ),
+        showStats && stats && /* @__PURE__ */ jsxs49(
+          "div",
+          {
+            className: "px-3 py-2 border-t text-xs flex items-center justify-between min-h-[2.5rem]",
+            style: {
+              borderTopColor: "hsl(var(--border))",
+              backgroundColor: "hsl(var(--popover))",
+              color: "hsl(var(--muted-foreground))"
+            },
+            children: [
+              /* @__PURE__ */ jsxs49("div", { className: "flex items-center gap-3 min-w-0", children: [
+                /* @__PURE__ */ jsx69("span", { className: "truncate", children: activeLanguage.toUpperCase() }),
+                /* @__PURE__ */ jsxs49("span", { className: "truncate hidden sm:inline", children: [
+                  stats.lines,
+                  " lines"
+                ] }),
+                /* @__PURE__ */ jsxs49("span", { className: "truncate hidden md:inline", children: [
+                  stats.chars,
+                  " chars"
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxs49("div", { className: "flex items-center gap-1 shrink-0", children: [
+                /* @__PURE__ */ jsx69(GearIcon2, { size: "0.75em", style: cssVars.icon }),
+                /* @__PURE__ */ jsx69("span", { children: "UTF-8" })
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+
 // src/hooks/use-drag.tsx
 import { useState as useState20, useCallback as useCallback12, useRef as useRef8, useEffect as useEffect18 } from "react";
 var useDrag = (options = {}) => {
@@ -11303,6 +11653,7 @@ export {
   CheckboxBase,
   CloseAllButton_default as CloseAllButton,
   CloseButton,
+  CodeBlock,
   CollapsibleBase,
   CollapsibleContentBase,
   CollapsibleTriggerBase,