@clickpalm/react 1.3.8 → 1.3.10

package/dist/index.mjs

@@ -656,6 +656,29 @@ var Copy = (props) => {
   );
 };
 
+// src/components/Icon/Svgs/Download.tsx
+import { jsx as jsx16 } from "react/jsx-runtime";
+var Download = (props) => /* @__PURE__ */ jsx16(
+  "svg",
+  {
+    width: "15",
+    height: "15",
+    viewBox: "0 0 15 15",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    ...props,
+    children: /* @__PURE__ */ jsx16(
+      "path",
+      {
+        d: "M7.50005 1.04999C7.74858 1.04999 7.95005 1.25146 7.95005 1.49999V8.41359L10.1819 6.18179C10.3576 6.00605 10.6425 6.00605 10.8182 6.18179C10.994 6.35753 10.994 6.64245 10.8182 6.81819L7.81825 9.81819C7.64251 9.99392 7.35759 9.99392 7.18185 9.81819L4.18185 6.81819C4.00611 6.64245 4.00611 6.35753 4.18185 6.18179C4.35759 6.00605 4.64251 6.00605 4.81825 6.18179L7.05005 8.41359V1.49999C7.05005 1.25146 7.25152 1.04999 7.50005 1.04999ZM2.5 10C2.77614 10 3 10.2239 3 10.5V12C3 12.5539 3.44565 13 3.99635 13H11.0012C11.5529 13 12 12.5528 12 12V10.5C12 10.2239 12.2239 10 12.5 10C12.7761 10 13 10.2239 13 10.5V12C13 13.1041 12.1062 14 11.0012 14H3.99635C2.89019 14 2 13.103 2 12V10.5C2 10.2239 2.22386 10 2.5 10Z",
+        fill: "currentColor",
+        "fill-rule": "evenodd",
+        "clip-rule": "evenodd"
+      }
+    )
+  }
+);
+
 // src/components/Icon/icons.ts
 var iconMap = {
   TriangleDown,
@@ -669,6 +692,7 @@ var iconMap = {
   Calendar,
   Closed,
   Dots,
+  Download,
   Filter,
   Hamburger,
   Pencil,
@@ -682,7 +706,7 @@ var iconMap = {
 };
 
 // src/components/Icon/index.tsx
-import { jsx as jsx16 } from "react/jsx-runtime";
+import { jsx as jsx17 } from "react/jsx-runtime";
 var colorMap = {
   black: "#000000",
   green: "#78CB63",
@@ -695,7 +719,7 @@ function Icon({ name, size = 24, color = "black", ...rest }) {
     return null;
   }
   const fillColor = colorMap[color];
-  return /* @__PURE__ */ jsx16(
+  return /* @__PURE__ */ jsx17(
     IconComponent,
     {
       width: size,
@@ -902,7 +926,7 @@ var StyledLabel = styled("label", {
 });
 
 // src/components/Calendar/index.tsx
-import { jsx as jsx17, jsxs as jsxs2 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs2 } from "react/jsx-runtime";
 calendarStyles();
 var Calendar2 = ({ label, onChange }) => {
   const [selected, setSelected] = useState(void 0);
@@ -921,8 +945,8 @@ var Calendar2 = ({ label, onChange }) => {
     }
   }, [selected]);
   return /* @__PURE__ */ jsxs2("div", { children: [
-    /* @__PURE__ */ jsx17(StyledLabel, { children: label }),
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx18(StyledLabel, { children: label }),
+    /* @__PURE__ */ jsx18(
       DayPicker,
       {
         className: !open ? "calendar-root-collapsed" : "",
@@ -953,20 +977,20 @@ var Calendar2 = ({ label, onChange }) => {
           MonthCaption: ({ calendarMonth, displayIndex, ...safeprops }) => {
             const displayMonth = calendarMonth.date;
             return /* @__PURE__ */ jsxs2("div", { ...safeprops, children: [
-              /* @__PURE__ */ jsx17("div", { children: /* @__PURE__ */ jsx17(
+              /* @__PURE__ */ jsx18("div", { children: /* @__PURE__ */ jsx18(
                 Button,
                 {
                   variant: "secondary",
                   size: "sm",
                   onClick: () => setOpen(!open),
-                  children: /* @__PURE__ */ jsx17(StyledButton2, { isOpen: open, children: /* @__PURE__ */ jsx17(Icon, { name: "TriangleUp", size: 16 }) })
+                  children: /* @__PURE__ */ jsx18(StyledButton2, { isOpen: open, children: /* @__PURE__ */ jsx18(Icon, { name: "TriangleUp", size: 16 }) })
                 }
               ) }),
-              /* @__PURE__ */ jsx17("div", { className: "calendar-month_caption", children: /* @__PURE__ */ jsx17("div", { className: "calendar-caption_label", role: "heading", "aria-level": 2, children: format(displayMonth, "MMMM 'de' yyyy", { locale: ptBR }).replace(/^./, (c) => c.toUpperCase()) }) })
+              /* @__PURE__ */ jsx18("div", { className: "calendar-month_caption", children: /* @__PURE__ */ jsx18("div", { className: "calendar-caption_label", role: "heading", "aria-level": 2, children: format(displayMonth, "MMMM 'de' yyyy", { locale: ptBR }).replace(/^./, (c) => c.toUpperCase()) }) })
             ] });
           },
-          PreviousMonthButton: (props) => /* @__PURE__ */ jsx17(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx17(Icon, { name: "TriangleLeft", size: 16 }) }),
-          NextMonthButton: (props) => /* @__PURE__ */ jsx17(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx17(Icon, { name: "TriangleRight", size: 16 }) })
+          PreviousMonthButton: (props) => /* @__PURE__ */ jsx18(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx18(Icon, { name: "TriangleLeft", size: 16 }) }),
+          NextMonthButton: (props) => /* @__PURE__ */ jsx18(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx18(Icon, { name: "TriangleRight", size: 16 }) })
         }
       }
     )
@@ -1090,12 +1114,12 @@ var Span = styled("span", {
 });
 
 // src/components/Checkbox/index.tsx
-import { jsx as jsx18, jsxs as jsxs3 } from "react/jsx-runtime";
+import { jsx as jsx19, jsxs as jsxs3 } from "react/jsx-runtime";
 var Checkbox2 = forwardRef2(
   ({ label, checked, onCheckedChange, errorMessage, ...rest }, ref) => {
     return /* @__PURE__ */ jsxs3("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
       /* @__PURE__ */ jsxs3(StyledWrapper, { hasError: !!errorMessage, children: [
-        /* @__PURE__ */ jsx18(
+        /* @__PURE__ */ jsx19(
           CheckboxContainer,
           {
             ref,
@@ -1103,12 +1127,12 @@ var Checkbox2 = forwardRef2(
             onCheckedChange,
             hasError: !!errorMessage,
             ...rest,
-            children: /* @__PURE__ */ jsx18(CheckboxIndicator, { children: /* @__PURE__ */ jsx18(Icon, { name: "Check", size: 16, color: "white" }) })
+            children: /* @__PURE__ */ jsx19(CheckboxIndicator, { children: /* @__PURE__ */ jsx19(Icon, { name: "Check", size: 16, color: "white" }) })
           }
         ),
-        /* @__PURE__ */ jsx18(CheckboxLabel, { children: label })
+        /* @__PURE__ */ jsx19(CheckboxLabel, { children: label })
       ] }),
-      errorMessage && /* @__PURE__ */ jsx18(Span, { children: errorMessage })
+      errorMessage && /* @__PURE__ */ jsx19(Span, { children: errorMessage })
     ] });
   }
 );
@@ -1260,7 +1284,7 @@ var CharCounter = styled(Span2, {
 });
 
 // src/components/Input/index.tsx
-import { jsx as jsx19, jsxs as jsxs4 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs4 } from "react/jsx-runtime";
 var Input2 = forwardRef3(
   ({ prefix, suffix, label, maxLength, showCounter = false, errorMessage, noMargin = false, redBorder, ...props }, forwardedRef) => {
     const getDisplayValue = (value) => {
@@ -1307,7 +1331,7 @@ var Input2 = forwardRef3(
       return type?.displayName === "Button";
     };
     return /* @__PURE__ */ jsxs4(StyledWrapper2, { children: [
-      label && /* @__PURE__ */ jsx19(Label, { children: label }),
+      label && /* @__PURE__ */ jsx20(Label, { children: label }),
       /* @__PURE__ */ jsxs4(
         TextInputContainer,
         {
@@ -1318,8 +1342,8 @@ var Input2 = forwardRef3(
           onClick: handleContainerClick,
           redBorder,
           children: [
-            !!prefix && /* @__PURE__ */ jsx19(Prefix, { children: prefix }),
-            /* @__PURE__ */ jsx19(
+            !!prefix && /* @__PURE__ */ jsx20(Prefix, { children: prefix }),
+            /* @__PURE__ */ jsx20(
               Input,
               {
                 ref: inputRef,
@@ -1331,12 +1355,12 @@ var Input2 = forwardRef3(
                 onChange: handleChange
               }
             ),
-            !!suffix && /* @__PURE__ */ jsx19(Suffix, { children: suffix })
+            !!suffix && /* @__PURE__ */ jsx20(Suffix, { children: suffix })
           ]
         }
       ),
       /* @__PURE__ */ jsxs4(Footer, { children: [
-        errorMessage && /* @__PURE__ */ jsx19(Span2, { children: errorMessage }),
+        errorMessage && /* @__PURE__ */ jsx20(Span2, { children: errorMessage }),
         showCounter && maxLength && /* @__PURE__ */ jsxs4(CharCounter, { hasReachedMax: maxLength ? charCount >= maxLength : false, children: [
           charCount,
           "/",
@@ -1477,7 +1501,7 @@ var SelectContainer = styled("div", {
 });
 
 // src/components/Datepicker/CustomSelect/index.tsx
-import { jsx as jsx20, jsxs as jsxs5 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs5 } from "react/jsx-runtime";
 var CustomSelect = ({
   options = [],
   value,
@@ -1509,9 +1533,9 @@ var CustomSelect = ({
   return /* @__PURE__ */ jsxs5(SelectContainer, { color, isOpen, ref: selectRef, children: [
     /* @__PURE__ */ jsxs5(SelectValueButton, { onClick: handleToggle, children: [
       selectedLabel,
-      /* @__PURE__ */ jsx20(IconWrapper, { children: /* @__PURE__ */ jsx20(Icon, { name: "TriangleDown", size: 16 }) })
+      /* @__PURE__ */ jsx21(IconWrapper, { children: /* @__PURE__ */ jsx21(Icon, { name: "TriangleDown", size: 16 }) })
     ] }),
-    isOpen && /* @__PURE__ */ jsx20(SelectOptionsList, { onMouseDown: (e) => e.preventDefault(), children: options.map((option) => /* @__PURE__ */ jsx20(
+    isOpen && /* @__PURE__ */ jsx21(SelectOptionsList, { onMouseDown: (e) => e.preventDefault(), children: options.map((option) => /* @__PURE__ */ jsx21(
       SelectOptionItem,
       {
         selected: option.value === value,
@@ -1525,7 +1549,7 @@ var CustomSelect = ({
 };
 
 // src/components/Datepicker/DatePickerSelectAdapter.tsx
-import { jsx as jsx21 } from "react/jsx-runtime";
+import { jsx as jsx22 } from "react/jsx-runtime";
 function DatePickerSelectAdapter(props) {
   const { options, value, onChange } = props;
   const handleValueChange = (newValue) => {
@@ -1548,7 +1572,7 @@ function DatePickerSelectAdapter(props) {
   if (isYearDropdown) {
     selectOptions.reverse();
   }
-  return /* @__PURE__ */ jsx21(
+  return /* @__PURE__ */ jsx22(
     CustomSelect,
     {
       color: "black",
@@ -1651,7 +1675,7 @@ var datePickerStyles = globalCss({
 });
 
 // src/components/Datepicker/index.tsx
-import { jsx as jsx22, jsxs as jsxs6 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs6 } from "react/jsx-runtime";
 datePickerStyles();
 var oneYearMore = new Date((/* @__PURE__ */ new Date()).getFullYear() + 1, 11);
 var Datepicker = forwardRef4(({ label, placeholder, value, onChange, errorMessage, endDate = oneYearMore }, ref) => {
@@ -1685,7 +1709,7 @@ var Datepicker = forwardRef4(({ label, placeholder, value, onChange, errorMessag
   }, [open, selected]);
   const isOpenWithError = open && errorMessage ? true : false;
   return /* @__PURE__ */ jsxs6("div", { children: [
-    /* @__PURE__ */ jsx22(
+    /* @__PURE__ */ jsx23(
       Input2,
       {
         ref: inputRef,
@@ -1694,13 +1718,13 @@ var Datepicker = forwardRef4(({ label, placeholder, value, onChange, errorMessag
         onFocus: () => setOpen(true),
         value: value || "",
         readOnly: true,
-        suffix: /* @__PURE__ */ jsx22(Icon, { name: "Calendar", size: 16 }),
+        suffix: /* @__PURE__ */ jsx23(Icon, { name: "Calendar", size: 16 }),
         noMargin: true,
         errorMessage: open ? "" : errorMessage,
         redBorder: isOpenWithError
       }
     ),
-    open && /* @__PURE__ */ jsx22(
+    open && /* @__PURE__ */ jsx23(
       "div",
       {
         ref: calendarRef,
@@ -1712,7 +1736,7 @@ var Datepicker = forwardRef4(({ label, placeholder, value, onChange, errorMessag
           boxShadow: "0 2px 8px rgba(0,0,0,0.15)",
           borderRadius: "8px"
         },
-        children: /* @__PURE__ */ jsx22(
+        children: /* @__PURE__ */ jsx23(
           DayPicker2,
           {
             mode: "single",
@@ -1726,8 +1750,8 @@ var Datepicker = forwardRef4(({ label, placeholder, value, onChange, errorMessag
             startMonth: new Date(1915, 0),
             endMonth: endDate,
             components: {
-              PreviousMonthButton: (props) => /* @__PURE__ */ jsx22(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx22(Icon, { name: "TriangleLeft", size: 16 }) }),
-              NextMonthButton: (props) => /* @__PURE__ */ jsx22(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx22(Icon, { name: "TriangleRight", size: 16 }) }),
+              PreviousMonthButton: (props) => /* @__PURE__ */ jsx23(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx23(Icon, { name: "TriangleLeft", size: 16 }) }),
+              NextMonthButton: (props) => /* @__PURE__ */ jsx23(Button, { size: "sm", variant: "secondary", ...props, children: /* @__PURE__ */ jsx23(Icon, { name: "TriangleRight", size: 16 }) }),
               Dropdown: DatePickerSelectAdapter
             }
           }
@@ -1740,7 +1764,7 @@ Datepicker.displayName = "Datepicker";
 
 // src/components/Hr.tsx
 import { forwardRef as forwardRef5 } from "react";
-import { jsx as jsx23 } from "react/jsx-runtime";
+import { jsx as jsx24 } from "react/jsx-runtime";
 var StyledHr = styled("hr", {
   border: "none",
   height: "1px",
@@ -1757,7 +1781,7 @@ var StyledHr = styled("hr", {
   }
 });
 var Hr = forwardRef5(function Hr2({ children, ...props }, ref) {
-  return /* @__PURE__ */ jsx23(StyledHr, { ref, ...props, children });
+  return /* @__PURE__ */ jsx24(StyledHr, { ref, ...props, children });
 });
 Hr.displayName = "Hr";
 
@@ -1834,19 +1858,19 @@ var StyledChildren = styled("div", {
 });
 
 // src/components/Modal/index.tsx
-import { jsx as jsx24, jsxs as jsxs7 } from "react/jsx-runtime";
+import { jsx as jsx25, jsxs as jsxs7 } from "react/jsx-runtime";
 var Modal = ({ open, onOpenChange, title, description, children }) => {
-  return /* @__PURE__ */ jsx24(Dialog2.Root, { open, onOpenChange, modal: true, children: /* @__PURE__ */ jsxs7(Dialog2.Portal, { children: [
-    /* @__PURE__ */ jsx24(StyledOverlay, {}),
+  return /* @__PURE__ */ jsx25(Dialog2.Root, { open, onOpenChange, modal: true, children: /* @__PURE__ */ jsxs7(Dialog2.Portal, { children: [
+    /* @__PURE__ */ jsx25(StyledOverlay, {}),
     /* @__PURE__ */ jsxs7(StyledContent, { children: [
       /* @__PURE__ */ jsxs7(Wrapper, { children: [
-        /* @__PURE__ */ jsx24(StyledTitle, { children: title }),
-        /* @__PURE__ */ jsx24(StyledClose, { asChild: true, "aria-label": "Close", children: /* @__PURE__ */ jsx24(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx24(Icon, { name: "Closed", size: 8 }) }) })
+        /* @__PURE__ */ jsx25(StyledTitle, { children: title }),
+        /* @__PURE__ */ jsx25(StyledClose, { asChild: true, "aria-label": "Close", children: /* @__PURE__ */ jsx25(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx25(Icon, { name: "Closed", size: 8 }) }) })
       ] }),
-      /* @__PURE__ */ jsx24(StyledDivider, {}),
+      /* @__PURE__ */ jsx25(StyledDivider, {}),
       /* @__PURE__ */ jsxs7("div", { children: [
-        description && /* @__PURE__ */ jsx24(StyledDescription, { children: description }),
-        /* @__PURE__ */ jsx24(StyledChildren, { children })
+        description && /* @__PURE__ */ jsx25(StyledDescription, { children: description }),
+        /* @__PURE__ */ jsx25(StyledChildren, { children })
       ] })
     ] })
   ] }) });
@@ -1883,7 +1907,7 @@ var StyledIndicator = styled(Progress.Indicator, {
 });
 
 // src/components/ProgressBar/index.tsx
-import { jsx as jsx25, jsxs as jsxs8 } from "react/jsx-runtime";
+import { jsx as jsx26, jsxs as jsxs8 } from "react/jsx-runtime";
 var ProgressBar = ({ label, value = 0, max = 100, ...rest }) => {
   const [progress2, setProgress] = useState5(0);
   useEffect5(() => {
@@ -1892,14 +1916,14 @@ var ProgressBar = ({ label, value = 0, max = 100, ...rest }) => {
   }, [value]);
   const valueLabel = `${Math.round(progress2 / max * 100)}%`;
   return /* @__PURE__ */ jsxs8(StyledWrapper3, { children: [
-    /* @__PURE__ */ jsx25("label", { style: { fontSize: 16, alignSelf: "flex-start", color: "black" }, children: label }),
-    /* @__PURE__ */ jsx25(
+    /* @__PURE__ */ jsx26("label", { style: { fontSize: 16, alignSelf: "flex-start", color: "black" }, children: label }),
+    /* @__PURE__ */ jsx26(
       StyledRoot,
       {
         value: progress2,
         "aria-valuetext": valueLabel,
         ...rest,
-        children: /* @__PURE__ */ jsx25(
+        children: /* @__PURE__ */ jsx26(
           StyledIndicator,
           {
             style: { transform: `translateX(-${100 - progress2}%)` }
@@ -2006,7 +2030,7 @@ var Span3 = styled("span", {
 });
 
 // src/components/Radio/index.tsx
-import { jsx as jsx26, jsxs as jsxs9 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs9 } from "react/jsx-runtime";
 var Radio = forwardRef6(({
   labels,
   value,
@@ -2016,7 +2040,7 @@ var Radio = forwardRef6(({
   errorMessage
 }, ref) => {
   return /* @__PURE__ */ jsxs9("form", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
-    /* @__PURE__ */ jsx26(
+    /* @__PURE__ */ jsx27(
       StyledRoot2,
       {
         ref,
@@ -2027,27 +2051,27 @@ var Radio = forwardRef6(({
         required,
         loop: true,
         children: labels.map((label, index) => /* @__PURE__ */ jsxs9(Wrapper2, { children: [
-          /* @__PURE__ */ jsx26(
+          /* @__PURE__ */ jsx27(
             StyledItem,
             {
               value: label,
               id: `radio-${index}`,
               "aria-label": label,
               hasError: !!errorMessage,
-              children: /* @__PURE__ */ jsx26(StyledIndicator2, {})
+              children: /* @__PURE__ */ jsx27(StyledIndicator2, {})
             }
           ),
-          /* @__PURE__ */ jsx26(ItemLabel, { htmlFor: `radio-${index}`, children: label })
+          /* @__PURE__ */ jsx27(ItemLabel, { htmlFor: `radio-${index}`, children: label })
         ] }, label))
       }
     ),
-    errorMessage && /* @__PURE__ */ jsx26(Span3, { children: errorMessage })
+    errorMessage && /* @__PURE__ */ jsx27(Span3, { children: errorMessage })
   ] });
 });
 Radio.displayName = "Radio";
 
 // src/components/Spacing.tsx
-import { jsx as jsx27 } from "react/jsx-runtime";
+import { jsx as jsx28 } from "react/jsx-runtime";
 var spacingMap = {
   xs: 8,
   sm: 12,
@@ -2059,7 +2083,7 @@ var spacingMap = {
 };
 var Spacing = ({ size, axis = "vertical" }) => {
   const style = axis === "vertical" ? { height: spacingMap[size], width: "100%" } : { width: spacingMap[size], height: "100%" };
-  return /* @__PURE__ */ jsx27("div", { style, "data-testid": `spacing-${size}-${axis}` });
+  return /* @__PURE__ */ jsx28("div", { style, "data-testid": `spacing-${size}-${axis}` });
 };
 
 // src/components/Switch/index.tsx
@@ -2160,7 +2184,7 @@ var Span4 = styled("span", {
 });
 
 // src/components/Switch/index.tsx
-import { jsx as jsx28, jsxs as jsxs10 } from "react/jsx-runtime";
+import { jsx as jsx29, jsxs as jsxs10 } from "react/jsx-runtime";
 var Switch2 = forwardRef7(({
   label,
   checked,
@@ -2173,7 +2197,7 @@ var Switch2 = forwardRef7(({
 }, ref) => {
   return /* @__PURE__ */ jsxs10("div", { style: { display: "flex", flexDirection: "column", alignItems: "flex-start" }, children: [
     /* @__PURE__ */ jsxs10(Wrapper3, { hasError: !!errorMessage, children: [
-      /* @__PURE__ */ jsx28(
+      /* @__PURE__ */ jsx29(
         StyledRoot3,
         {
           ref,
@@ -2184,12 +2208,12 @@ var Switch2 = forwardRef7(({
           hasError: !!errorMessage,
           disabled,
           required,
-          children: /* @__PURE__ */ jsx28(StyledThumb, {})
+          children: /* @__PURE__ */ jsx29(StyledThumb, {})
         }
       ),
-      label && /* @__PURE__ */ jsx28(Label2, { htmlFor: id, children: label })
+      label && /* @__PURE__ */ jsx29(Label2, { htmlFor: id, children: label })
     ] }),
-    errorMessage && /* @__PURE__ */ jsx28(Span4, { children: errorMessage })
+    errorMessage && /* @__PURE__ */ jsx29(Span4, { children: errorMessage })
   ] });
 });
 Switch2.displayName = "Switch";
@@ -2249,7 +2273,6 @@ var TabsTrigger = styled(Tabs.Trigger, {
   whiteSpace: "nowrap",
   textOverflow: "ellipsis",
   overflow: "hidden",
-  userSelect: "none",
   background: "$gray100",
   backgroundImage: "linear-gradient(to bottom, $clickpalm_mid, $clickpalm_superDark)",
   WebkitBackgroundClip: "text",
@@ -2276,9 +2299,9 @@ var TabsContent = styled(Tabs.Content, {
 });
 
 // src/components/Tabs/index.tsx
-import { Fragment, jsx as jsx29, jsxs as jsxs11 } from "react/jsx-runtime";
+import { Fragment, jsx as jsx30, jsxs as jsxs11 } from "react/jsx-runtime";
 var TabsItem = ({ children }) => {
-  return /* @__PURE__ */ jsx29(Fragment, { children });
+  return /* @__PURE__ */ jsx30(Fragment, { children });
 };
 var Tabs2 = ({ defaultValue, colorContent, children, value, onValueChange }) => {
   const items = [];
@@ -2337,21 +2360,21 @@ var Tabs2 = ({ defaultValue, colorContent, children, value, onValueChange }) =>
       onValueChange,
       children: [
         /* @__PURE__ */ jsxs11("div", { style: { display: "flex", alignItems: "center", gap: "8px" }, children: [
-          hasOverflow && /* @__PURE__ */ jsx29(
+          hasOverflow && /* @__PURE__ */ jsx30(
             Button,
             {
               variant: "secondary",
               size: "sm",
               onClick: () => scroll("left"),
-              children: /* @__PURE__ */ jsx29(Icon, { name: "TriangleLeft", size: 64 })
+              children: /* @__PURE__ */ jsx30(Icon, { name: "TriangleLeft", size: 64 })
             }
           ),
-          /* @__PURE__ */ jsx29(
+          /* @__PURE__ */ jsx30(
             TabsList,
             {
               ref: listRef,
               scrollable: hasOverflow,
-              children: items.map((item) => /* @__PURE__ */ jsx29(
+              children: items.map((item) => /* @__PURE__ */ jsx30(
                 TabsTrigger,
                 {
                   value: item.value,
@@ -2362,17 +2385,17 @@ var Tabs2 = ({ defaultValue, colorContent, children, value, onValueChange }) =>
               ))
             }
           ),
-          hasOverflow && /* @__PURE__ */ jsx29(
+          hasOverflow && /* @__PURE__ */ jsx30(
             Button,
             {
               variant: "secondary",
               size: "sm",
               onClick: () => scroll("right"),
-              children: /* @__PURE__ */ jsx29(Icon, { name: "TriangleRight", size: 64 })
+              children: /* @__PURE__ */ jsx30(Icon, { name: "TriangleRight", size: 64 })
             }
           )
         ] }),
-        items.map((item) => /* @__PURE__ */ jsx29(
+        items.map((item) => /* @__PURE__ */ jsx30(
           TabsContent,
           {
             colorContent,
@@ -2390,7 +2413,7 @@ Tabs2.Item = TabsItem;
 
 // src/components/TextArea.tsx
 import { forwardRef as forwardRef8, useEffect as useEffect6, useState as useState7 } from "react";
-import { jsx as jsx30, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs12 } from "react/jsx-runtime";
 var Wrapper4 = styled("div", {
   display: "flex",
   flexDirection: "column"
@@ -2504,8 +2527,8 @@ var TextArea = forwardRef8(
       setCharCount(props.value?.toString().length || 0);
     }, [props.value]);
     return /* @__PURE__ */ jsxs12(Wrapper4, { children: [
-      label && /* @__PURE__ */ jsx30(StyledLabel2, { htmlFor: textAreaId, children: label }),
-      /* @__PURE__ */ jsx30(
+      label && /* @__PURE__ */ jsx31(StyledLabel2, { htmlFor: textAreaId, children: label }),
+      /* @__PURE__ */ jsx31(
         TextAreaElement,
         {
           id: textAreaId,
@@ -2523,7 +2546,7 @@ var TextArea = forwardRef8(
         }
       ),
       /* @__PURE__ */ jsxs12(Footer2, { children: [
-        errorMessage && /* @__PURE__ */ jsx30(Span5, { children: errorMessage }),
+        errorMessage && /* @__PURE__ */ jsx31(Span5, { children: errorMessage }),
         showCounter && maxLength && /* @__PURE__ */ jsxs12(CharCounter2, { hasReachedMax: maxLength ? charCount >= maxLength : false, children: [
           charCount,
           "/",
@@ -2587,7 +2610,7 @@ var TooltipArrow = styled(RadixTooltip.Arrow, {
 
 // src/components/Tooltip/index.tsx
 import { useState as useState8, useEffect as useEffect7 } from "react";
-import { jsx as jsx31, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx32, jsxs as jsxs13 } from "react/jsx-runtime";
 var Tooltip = ({
   content,
   children,
@@ -2610,11 +2633,11 @@ var Tooltip = ({
       setOpen(!open);
     }
   };
-  return /* @__PURE__ */ jsx31(RadixTooltip2.Provider, { children: /* @__PURE__ */ jsxs13(RadixTooltip2.Root, { open, onOpenChange: setOpen, delayDuration, children: [
-    /* @__PURE__ */ jsx31(TooltipTrigger, { asChild: true, onClick: handleClick, children }),
+  return /* @__PURE__ */ jsx32(RadixTooltip2.Provider, { children: /* @__PURE__ */ jsxs13(RadixTooltip2.Root, { open, onOpenChange: setOpen, delayDuration, children: [
+    /* @__PURE__ */ jsx32(TooltipTrigger, { asChild: true, onClick: handleClick, children }),
     /* @__PURE__ */ jsxs13(TooltipContent, { side, sideOffset, children: [
       content,
-      /* @__PURE__ */ jsx31(TooltipArrow, {})
+      /* @__PURE__ */ jsx32(TooltipArrow, {})
     ] })
   ] }) });
 };
@@ -2698,9 +2721,9 @@ var Spinner = styled("span", {
 });
 
 // src/components/Loader/index.tsx
-import { jsx as jsx32 } from "react/jsx-runtime";
+import { jsx as jsx33 } from "react/jsx-runtime";
 var Loader = ({ show, fullscreen = false }) => {
-  return /* @__PURE__ */ jsx32(Overlay2, { show, fullscreen, children: /* @__PURE__ */ jsx32(SpinnerContainer, { children: /* @__PURE__ */ jsx32(Spinner, {}) }) });
+  return /* @__PURE__ */ jsx33(Overlay2, { show, fullscreen, children: /* @__PURE__ */ jsx33(SpinnerContainer, { children: /* @__PURE__ */ jsx33(Spinner, {}) }) });
 };
 Loader.displayName = "Loader";
 
@@ -2769,7 +2792,7 @@ var applyMask = (value, maskType) => {
 };
 
 // src/components/MaskedInput/index.tsx
-import { jsx as jsx33 } from "react/jsx-runtime";
+import { jsx as jsx34 } from "react/jsx-runtime";
 var MaskedInput = forwardRef9(
   ({ maskType, onChange, ...props }, ref) => {
     const [value, setValue] = useState9("");
@@ -2806,7 +2829,7 @@ var MaskedInput = forwardRef9(
         onChange(syntheticEvent);
       }
     };
-    return /* @__PURE__ */ jsx33(
+    return /* @__PURE__ */ jsx34(
       Input2,
       {
         ...props,
@@ -2907,27 +2930,27 @@ var IconButton = styled("button", {
 });
 
 // src/components/Dropdown/index.tsx
-import { jsx as jsx34, jsxs as jsxs14 } from "react/jsx-runtime";
+import { jsx as jsx35, jsxs as jsxs14 } from "react/jsx-runtime";
 var Dropdown = ({ children }) => {
   const childrenArray = Children2.toArray(children);
   return /* @__PURE__ */ jsxs14(DropdownMenu2.Root, { modal: false, children: [
-    /* @__PURE__ */ jsx34(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ jsx34(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx34(Icon, { name: "Dots", size: 16 }) }) }),
-    /* @__PURE__ */ jsx34(DropdownMenu2.Portal, { children: /* @__PURE__ */ jsx34(StyledContent2, { sideOffset: 5, align: "end", children: childrenArray.map((child, index) => /* @__PURE__ */ jsxs14(Fragment2, { children: [
+    /* @__PURE__ */ jsx35(DropdownMenu2.Trigger, { asChild: true, children: /* @__PURE__ */ jsx35(Button, { variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx35(Icon, { name: "Dots", size: 16 }) }) }),
+    /* @__PURE__ */ jsx35(DropdownMenu2.Portal, { children: /* @__PURE__ */ jsx35(StyledContent2, { sideOffset: 5, align: "end", children: childrenArray.map((child, index) => /* @__PURE__ */ jsxs14(Fragment2, { children: [
       child,
-      index < childrenArray.length - 1 && /* @__PURE__ */ jsx34(DropdownSeparator, {})
+      index < childrenArray.length - 1 && /* @__PURE__ */ jsx35(DropdownSeparator, {})
     ] }, index)) }) })
   ] });
 };
 var DropdownSeparator = StyledSeparator;
 var DropdownItem = React3.forwardRef(({ children, ...props }, forwardedRef) => {
-  return /* @__PURE__ */ jsx34(StyledItem2, { ...props, ref: forwardedRef, children });
+  return /* @__PURE__ */ jsx35(StyledItem2, { ...props, ref: forwardedRef, children });
 });
 Dropdown.displayName = "Dropdown";
 DropdownItem.displayName = "DropdownItem";
 DropdownSeparator.displayName = "DropdownSeparator";
 
 // src/components/Box.tsx
-import { jsx as jsx35 } from "react/jsx-runtime";
+import { jsx as jsx36 } from "react/jsx-runtime";
 var StyledBox = styled("div", {
   padding: "$5",
   borderRadius: "$md",
@@ -2949,12 +2972,12 @@ var StyledBox = styled("div", {
   }
 });
 var Box = (props) => {
-  return /* @__PURE__ */ jsx35(StyledBox, { ...props });
+  return /* @__PURE__ */ jsx36(StyledBox, { ...props });
 };
 Box.displayName = "Box";
 
 // src/components/Paragraph.tsx
-import { jsx as jsx36 } from "react/jsx-runtime";
+import { jsx as jsx37 } from "react/jsx-runtime";
 var StyledParagraph = styled("p", {
   fontFamily: "$default",
   lineHeight: "$short",
@@ -2996,13 +3019,13 @@ var StyledParagraph = styled("p", {
   }
 });
 var Paragraph = (props) => {
-  return /* @__PURE__ */ jsx36(StyledParagraph, { ...props });
+  return /* @__PURE__ */ jsx37(StyledParagraph, { ...props });
 };
 Paragraph.displayName = "Paragraph";
 
 // src/components/Heading.tsx
 import { forwardRef as forwardRef10 } from "react";
-import { jsx as jsx37 } from "react/jsx-runtime";
+import { jsx as jsx38 } from "react/jsx-runtime";
 var StyledHeading = styled("h2", {
   fontFamily: "$default",
   lineHeight: "$shorter",
@@ -3035,7 +3058,7 @@ var StyledHeading = styled("h2", {
 });
 var Heading = forwardRef10(
   function Heading2({ children, bold = false, ...props }, ref) {
-    return /* @__PURE__ */ jsx37(StyledHeading, { ref, bold, ...props, children });
+    return /* @__PURE__ */ jsx38(StyledHeading, { ref, bold, ...props, children });
   }
 );
 Heading.displayName = "Heading";
@@ -3175,7 +3198,7 @@ var Span6 = styled("span", {
 });
 
 // src/components/Select/index.tsx
-import { jsx as jsx38, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx39, jsxs as jsxs15 } from "react/jsx-runtime";
 var Select2 = forwardRef11(
   ({
     value,
@@ -3191,7 +3214,7 @@ var Select2 = forwardRef11(
   }, ref) => {
     const [open, setOpen] = useState10(false);
     return /* @__PURE__ */ jsxs15(StyledWrapper4, { css: css2, className, style, children: [
-      label && /* @__PURE__ */ jsx38(Label3, { children: label }),
+      label && /* @__PURE__ */ jsx39(Label3, { children: label }),
       /* @__PURE__ */ jsxs15(
         CustomSelect2.Root,
         {
@@ -3201,14 +3224,14 @@ var Select2 = forwardRef11(
           ...rest,
           children: [
             /* @__PURE__ */ jsxs15(StyledTrigger, { "aria-label": label, hasError: !!errorMessage, ref, children: [
-              /* @__PURE__ */ jsx38(CustomSelect2.Value, { placeholder }),
-              /* @__PURE__ */ jsx38(StyledIcon, { open, children: /* @__PURE__ */ jsx38(TriangleDownIcon, {}) })
+              /* @__PURE__ */ jsx39(CustomSelect2.Value, { placeholder }),
+              /* @__PURE__ */ jsx39(StyledIcon, { open, children: /* @__PURE__ */ jsx39(TriangleDownIcon, {}) })
             ] }),
-            errorMessage && /* @__PURE__ */ jsx38(Span6, { children: errorMessage }),
-            /* @__PURE__ */ jsx38(CustomSelect2.Portal, { children: /* @__PURE__ */ jsxs15(StyledContent3, { side: "bottom", align: "start", position: "popper", children: [
-              /* @__PURE__ */ jsx38(CustomSelect2.ScrollUpButton, { children: /* @__PURE__ */ jsx38(TriangleUpIcon, {}) }),
-              /* @__PURE__ */ jsx38(StyledViewport, { children: items.map((item) => /* @__PURE__ */ jsx38(StyledItem3, { value: item.value, children: /* @__PURE__ */ jsx38(StyledItemText, { children: item.label }) }, item.value)) }),
-              /* @__PURE__ */ jsx38(CustomSelect2.ScrollDownButton, { children: /* @__PURE__ */ jsx38(TriangleDownIcon, {}) })
+            errorMessage && /* @__PURE__ */ jsx39(Span6, { children: errorMessage }),
+            /* @__PURE__ */ jsx39(CustomSelect2.Portal, { children: /* @__PURE__ */ jsxs15(StyledContent3, { side: "bottom", align: "start", position: "popper", children: [
+              /* @__PURE__ */ jsx39(CustomSelect2.ScrollUpButton, { children: /* @__PURE__ */ jsx39(TriangleUpIcon, {}) }),
+              /* @__PURE__ */ jsx39(StyledViewport, { children: items.map((item) => /* @__PURE__ */ jsx39(StyledItem3, { value: item.value, children: /* @__PURE__ */ jsx39(StyledItemText, { children: item.label }) }, item.value)) }),
+              /* @__PURE__ */ jsx39(CustomSelect2.ScrollDownButton, { children: /* @__PURE__ */ jsx39(TriangleDownIcon, {}) })
             ] }) })
           ]
         }
@@ -3292,9 +3315,9 @@ var Value2 = styled("div", {
 });
 
 // src/components/LabelledValue/index.tsx
-import { jsx as jsx39, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx40, jsxs as jsxs16 } from "react/jsx-runtime";
 function LabelledValue({ position = "vertical", withRow = false, children }) {
-  return /* @__PURE__ */ jsx39(Container, { position, children: Children3.map(children, (child) => {
+  return /* @__PURE__ */ jsx40(Container, { position, children: Children3.map(children, (child) => {
     if (isValidElement2(child)) {
       return cloneElement(child, { position, withRow });
     }
@@ -3303,8 +3326,8 @@ function LabelledValue({ position = "vertical", withRow = false, children }) {
 }
 function Item4({ label, value, position = "vertical", withRow = false }) {
   return /* @__PURE__ */ jsxs16(ItemWrapper, { position, withRow, children: [
-    /* @__PURE__ */ jsx39(Label4, { children: label }),
-    /* @__PURE__ */ jsx39(Value2, { children: value })
+    /* @__PURE__ */ jsx40(Label4, { children: label }),
+    /* @__PURE__ */ jsx40(Value2, { children: value })
   ] });
 }
 LabelledValue.Item = Item4;
@@ -3376,10 +3399,10 @@ var Span7 = styled("span", {
 });
 
 // src/components/OneTimePassword/index.tsx
-import { jsx as jsx40, jsxs as jsxs17 } from "react/jsx-runtime";
+import { jsx as jsx41, jsxs as jsxs17 } from "react/jsx-runtime";
 var OneTimePassword = ({ label, length, value, errorMessage, onValueChange, ...rootProps }) => {
-  return /* @__PURE__ */ jsx40(Container2, { children: /* @__PURE__ */ jsxs17(StyledWrapper5, { children: [
-    /* @__PURE__ */ jsx40(StyledLabel3, { children: label }),
+  return /* @__PURE__ */ jsx41(Container2, { children: /* @__PURE__ */ jsxs17(StyledWrapper5, { children: [
+    /* @__PURE__ */ jsx41(StyledLabel3, { children: label }),
     /* @__PURE__ */ jsxs17(
       StyledRoot4,
       {
@@ -3388,12 +3411,12 @@ var OneTimePassword = ({ label, length, value, errorMessage, onValueChange, ...r
         ...rootProps,
         style: { "--otp-length": length },
         children: [
-          Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx40(StyledInput, {}, index)),
-          /* @__PURE__ */ jsx40(OneTimePasswordField2.HiddenInput, {})
+          Array.from({ length }).map((_, index) => /* @__PURE__ */ jsx41(StyledInput, {}, index)),
+          /* @__PURE__ */ jsx41(OneTimePasswordField2.HiddenInput, {})
         ]
       }
     ),
-    errorMessage && /* @__PURE__ */ jsx40(Span7, { children: errorMessage })
+    errorMessage && /* @__PURE__ */ jsx41(Span7, { children: errorMessage })
   ] }) });
 };
 OneTimePassword.displayName = "OneTimePasswordInput";
@@ -3563,7 +3586,7 @@ var toast = {
 };
 
 // src/components/Toast/index.tsx
-import { jsx as jsx41, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx42, jsxs as jsxs18 } from "react/jsx-runtime";
 var Toast = () => {
   const [messages, setMessages] = React4.useState([]);
   const [paused, setPaused] = React4.useState(false);
@@ -3594,10 +3617,10 @@ var Toast = () => {
         onResume: () => setPaused(false),
         children: [
           /* @__PURE__ */ jsxs18(ToastContent, { children: [
-            /* @__PURE__ */ jsx41(ToastTitle, { children: message.title }),
-            message.description && /* @__PURE__ */ jsx41(ToastDescription, { children: message.description })
+            /* @__PURE__ */ jsx42(ToastTitle, { children: message.title }),
+            message.description && /* @__PURE__ */ jsx42(ToastDescription, { children: message.description })
           ] }),
-          /* @__PURE__ */ jsx41(ToastAction, { altText: "Fechar", asChild: true, children: /* @__PURE__ */ jsx41(
+          /* @__PURE__ */ jsx42(ToastAction, { altText: "Fechar", asChild: true, children: /* @__PURE__ */ jsx42(
             "button",
             {
               style: {
@@ -3607,15 +3630,15 @@ var Toast = () => {
                 alignItems: "center"
               },
               onClick: () => removeToast(message.id),
-              children: /* @__PURE__ */ jsx41(Icon, { name: "Closed", size: 16, height: 14, width: 14 })
+              children: /* @__PURE__ */ jsx42(Icon, { name: "Closed", size: 16, height: 14, width: 14 })
             }
           ) }),
-          /* @__PURE__ */ jsx41(ToastProgress, { paused, variant: message.variant })
+          /* @__PURE__ */ jsx42(ToastProgress, { paused, variant: message.variant })
         ]
       },
       message.id
     )),
-    /* @__PURE__ */ jsx41(ToastViewport, {})
+    /* @__PURE__ */ jsx42(ToastViewport, {})
   ] });
 };
 
@@ -3850,14 +3873,14 @@ var StepLabel = styled("span", {
 });
 
 // src/components/MultiStep/index.tsx
-import { jsx as jsx42, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx43, jsxs as jsxs19 } from "react/jsx-runtime";
 var MultiStep = ({
   steps,
   currentStep,
   orientation = "horizontal",
   variant
 }) => {
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx43(
     Wrapper5,
     {
       orientation,
@@ -3865,7 +3888,7 @@ var MultiStep = ({
         const isFirst = index === 0;
         const isLast = index === steps.length - 1;
         return /* @__PURE__ */ jsxs19(StepItem, { orientation, children: [
-          /* @__PURE__ */ jsx42(
+          /* @__PURE__ */ jsx43(
             StepCircle,
             {
               orientation,
@@ -3876,7 +3899,7 @@ var MultiStep = ({
               children: index + 1
             }
           ),
-          /* @__PURE__ */ jsx42(
+          /* @__PURE__ */ jsx43(
             StepLabel,
             {
               orientation,
@@ -3900,8 +3923,7 @@ var CarouselContainer = styled("div", {
   flexDirection: "column",
   alignItems: "center",
   width: "100%",
-  maxWidth: "720px",
-  userSelect: "none"
+  maxWidth: "720px"
 });
 var Wrapper6 = styled("div", {
   display: "flex",
@@ -3995,12 +4017,19 @@ var DotButton = styled("button", {
     borderColor: "$ignite_dark"
   }
 });
+var Ellipsis = styled("span", {
+  color: "$ignite_light",
+  textDecoration: "none",
+  height: "9px",
+  display: "flex",
+  alignItems: "center"
+});
 var CarouselItemContainer = styled("div", {
   width: "100%"
 });
 
 // src/components/Carousel/index.tsx
-import { jsx as jsx43, jsxs as jsxs20 } from "react/jsx-runtime";
+import { jsx as jsx44, jsxs as jsxs20 } from "react/jsx-runtime";
 var SWIPE_THRESHOLD = 50;
 var Carousel = ({ title, variant, children }) => {
   const items = Children4.toArray(children);
@@ -4034,6 +4063,8 @@ var Carousel = ({ title, variant, children }) => {
     setTouchStartX(null);
     setTouchEndX(null);
   };
+  const activeItem = items[activeIndex];
+  const itemTitle = activeItem.props.title;
   return /* @__PURE__ */ jsxs20(
     CarouselContainer,
     {
@@ -4043,9 +4074,9 @@ var Carousel = ({ title, variant, children }) => {
       children: [
         /* @__PURE__ */ jsxs20(Wrapper6, { variant, children: [
           /* @__PURE__ */ jsxs20(CarouselHeader, { children: [
-            /* @__PURE__ */ jsx43(Title2, { children: title }),
+            /* @__PURE__ */ jsx44(Title2, { children: itemTitle ?? title }),
             /* @__PURE__ */ jsxs20(Navigation, { children: [
-              /* @__PURE__ */ jsx43(
+              /* @__PURE__ */ jsx44(
                 Button,
                 {
                   size: "sm",
@@ -4053,10 +4084,10 @@ var Carousel = ({ title, variant, children }) => {
                   "aria-label": "Previous Slide",
                   onClick: prev,
                   tabIndex: 0,
-                  children: /* @__PURE__ */ jsx43(Icon, { name: "TriangleLeft", size: 16, color: variant === "purple" ? "white" : "black" })
+                  children: /* @__PURE__ */ jsx44(Icon, { name: "TriangleLeft", size: 16, color: variant === "purple" ? "white" : "black" })
                 }
               ),
-              /* @__PURE__ */ jsx43(
+              /* @__PURE__ */ jsx44(
                 Button,
                 {
                   size: "sm",
@@ -4064,15 +4095,15 @@ var Carousel = ({ title, variant, children }) => {
                   "aria-label": "Previous Slide",
                   onClick: next,
                   tabIndex: 0,
-                  children: /* @__PURE__ */ jsx43(Icon, { name: "TriangleRight", size: 16, color: variant === "purple" ? "white" : "black" })
+                  children: /* @__PURE__ */ jsx44(Icon, { name: "TriangleRight", size: 16, color: variant === "purple" ? "white" : "black" })
                 }
               )
             ] })
           ] }),
-          /* @__PURE__ */ jsx43(Spacing, { size: "xs" }),
-          /* @__PURE__ */ jsx43(Hr, { variant }),
-          /* @__PURE__ */ jsx43(Spacing, { size: "xs" }),
-          /* @__PURE__ */ jsx43(
+          /* @__PURE__ */ jsx44(Spacing, { size: "xs" }),
+          /* @__PURE__ */ jsx44(Hr, { variant }),
+          /* @__PURE__ */ jsx44(Spacing, { size: "xs" }),
+          /* @__PURE__ */ jsx44(
             CarouselContent,
             {
               onTouchStart,
@@ -4089,29 +4120,43 @@ var Carousel = ({ title, variant, children }) => {
             }
           )
         ] }),
-        /* @__PURE__ */ jsx43(Spacing, { size: "md" }),
-        /* @__PURE__ */ jsx43(DotsContainer, { children: /* @__PURE__ */ jsx43(Dots2, { role: "tablist", "aria-label": "Carousel Pagination", children: items.map((_, idx) => /* @__PURE__ */ jsx43(
-          DotButton,
-          {
-            active: idx === activeIndex,
-            "aria-label": `Go to slide ${idx + 1}`,
-            "aria-selected": idx === activeIndex,
-            role: "tab",
-            onClick: () => setActiveIndex(idx),
-            type: "button"
-          },
-          idx
-        )) }) })
+        /* @__PURE__ */ jsx44(Spacing, { size: "md" }),
+        /* @__PURE__ */ jsx44(DotsContainer, { children: /* @__PURE__ */ jsx44(Dots2, { role: "tablist", "aria-label": "Carousel Pagination", children: getPaginationItems(items.length, activeIndex).map(
+          (page, index) => typeof page === "number" ? /* @__PURE__ */ jsx44(
+            DotButton,
+            {
+              active: page === activeIndex,
+              "aria-label": `Go to slide ${page + 1}`,
+              "aria-selected": page === activeIndex,
+              role: "tab",
+              onClick: () => setActiveIndex(page),
+              type: "button"
+            },
+            page
+          ) : /* @__PURE__ */ jsx44(Ellipsis, { children: "..." }, `ellipsis-${index}`)
+        ) }) })
       ]
     }
   );
 };
-var CarouselItem = ({ children, style, ...props }) => /* @__PURE__ */ jsx43(CarouselItemContainer, { ...props, style: { ...style }, children });
+var getPaginationItems = (totalItems, activeIndex) => {
+  if (totalItems <= 10) {
+    return Array.from({ length: totalItems }, (_, i) => i);
+  }
+  if (activeIndex < 7) {
+    return [0, 1, 2, 3, 4, 5, 6, "...", totalItems - 1];
+  }
+  if (activeIndex >= totalItems - 5) {
+    return [0, "...", totalItems - 5, totalItems - 4, totalItems - 3, totalItems - 2, totalItems - 1];
+  }
+  return [0, "...", activeIndex - 2, activeIndex - 1, activeIndex, activeIndex + 1, activeIndex + 2, "...", totalItems - 1];
+};
+var CarouselItem = ({ children, style, title, ...props }) => /* @__PURE__ */ jsx44(CarouselItemContainer, { ...props, style: { ...style }, children });
 Carousel.Item = CarouselItem;
 
 // src/components/PasswordInput.tsx
 import { forwardRef as forwardRef12, useImperativeHandle as useImperativeHandle2, useRef as useRef7, useState as useState13 } from "react";
-import { jsx as jsx44 } from "react/jsx-runtime";
+import { jsx as jsx45 } from "react/jsx-runtime";
 var ToggleButton = styled("button", {
   all: "unset",
   cursor: "pointer",
@@ -4140,7 +4185,7 @@ var PasswordInput = forwardRef12(
         }
       }, 0);
     };
-    return /* @__PURE__ */ jsx44(
+    return /* @__PURE__ */ jsx45(
       Input2,
       {
         ...props,
@@ -4148,14 +4193,14 @@ var PasswordInput = forwardRef12(
         type: visible ? "text" : "password",
         value,
         onChange,
-        suffix: /* @__PURE__ */ jsx44(
+        suffix: /* @__PURE__ */ jsx45(
           ToggleButton,
           {
             type: "button",
             onClick: handleToggleVisibility,
             onMouseDown: (e) => e.preventDefault(),
             "aria-label": visible ? "Ocultar senha" : "Mostrar senha",
-            children: visible ? /* @__PURE__ */ jsx44(Icon, { name: "EyeClosed", size: 16, color: "black" }) : /* @__PURE__ */ jsx44(Icon, { name: "EyeOpen", size: 16, color: "black" })
+            children: visible ? /* @__PURE__ */ jsx45(Icon, { name: "EyeClosed", size: 16, color: "black" }) : /* @__PURE__ */ jsx45(Icon, { name: "EyeOpen", size: 16, color: "black" })
           }
         )
       }
@@ -4252,18 +4297,18 @@ var OptionsButton = styled(Button, {
 });
 
 // src/components/Accordion/index.tsx
-import { jsx as jsx45, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx46, jsxs as jsxs21 } from "react/jsx-runtime";
 var Accordion2 = React6.forwardRef(
   ({ title, children, dropdownItems }, ref) => {
-    return /* @__PURE__ */ jsx45(AccordionContainer, { type: "single", collapsible: true, ref, children: /* @__PURE__ */ jsxs21(AccordionItem, { value: "item-1", children: [
+    return /* @__PURE__ */ jsx46(AccordionContainer, { type: "single", collapsible: true, ref, children: /* @__PURE__ */ jsxs21(AccordionItem, { value: "item-1", children: [
       /* @__PURE__ */ jsxs21(AccordionHeader, { children: [
-        /* @__PURE__ */ jsx45(AccordionTrigger, { children: /* @__PURE__ */ jsx45("span", { children: title }) }),
+        /* @__PURE__ */ jsx46(AccordionTrigger, { children: /* @__PURE__ */ jsx46("span", { children: title }) }),
         /* @__PURE__ */ jsxs21(TriggerContent, { children: [
           dropdownItems && dropdownItems,
-          /* @__PURE__ */ jsx45(RadixAccordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx45(StyledButton, { as: "div", variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx45(AccordionChevron, { name: "TriangleDown", size: 16, "aria-hidden": true }) }) })
+          /* @__PURE__ */ jsx46(RadixAccordion.Trigger, { asChild: true, children: /* @__PURE__ */ jsx46(StyledButton, { as: "div", variant: "secondary", size: "sm", children: /* @__PURE__ */ jsx46(AccordionChevron, { name: "TriangleDown", size: 16, "aria-hidden": true }) }) })
         ] })
       ] }),
-      /* @__PURE__ */ jsx45(RadixAccordion.Content, { asChild: true, children: /* @__PURE__ */ jsx45(AccordionContent, { children }) })
+      /* @__PURE__ */ jsx46(RadixAccordion.Content, { asChild: true, children: /* @__PURE__ */ jsx46(AccordionContent, { children }) })
     ] }) });
   }
 );