@mw-kit/mw-ui 1.8.21 → 1.9.0

package/dist/index.js

@@ -49,6 +49,7 @@ __export(index_exports, {
   MwPlaceholder: () => Placeholder_default,
   MwProgressBar: () => ProgressBar_default,
   MwScrollContainer: () => ScrollContainer_default,
+  MwSelect: () => Select_default3,
   MwSignature: () => Signature_default,
   MwTabs: () => Tabs_default,
   MwTextArea: () => TextArea_default,
@@ -698,36 +699,36 @@ var positions = {
   `
 };
 var pointerPositions = {
-  "top right": (distance, size3) => import_styled_components2.css`
+  "top right": (distance, size4) => import_styled_components2.css`
     top: ${distance};
-    left: calc(${size3} / 2 * -1);
+    left: calc(${size4} / 2 * -1);
   `,
-  "top left": (distance, size3) => import_styled_components2.css`
+  "top left": (distance, size4) => import_styled_components2.css`
     top: ${distance};
-    right: calc(${size3} / 2 * -1);
+    right: calc(${size4} / 2 * -1);
   `,
-  "bottom right": (distance, size3) => import_styled_components2.css`
+  "bottom right": (distance, size4) => import_styled_components2.css`
     bottom: ${distance};
-    left: calc(${size3} / 2 * -1);
+    left: calc(${size4} / 2 * -1);
   `,
-  "bottom left": (distance, size3) => import_styled_components2.css`
+  "bottom left": (distance, size4) => import_styled_components2.css`
     bottom: ${distance};
-    right: calc(${size3} / 2 * -1);
+    right: calc(${size4} / 2 * -1);
   `,
-  "right top": (distance, size3) => import_styled_components2.css`
-    bottom: calc(${size3} / 2 * -1);
+  "right top": (distance, size4) => import_styled_components2.css`
+    bottom: calc(${size4} / 2 * -1);
     right: ${distance};
   `,
-  "right bottom": (distance, size3) => import_styled_components2.css`
-    top: calc(${size3} / 2 * -1);
+  "right bottom": (distance, size4) => import_styled_components2.css`
+    top: calc(${size4} / 2 * -1);
     right: ${distance};
   `,
-  "left top": (distance, size3) => import_styled_components2.css`
-    bottom: calc(${size3} / 2 * -1);
+  "left top": (distance, size4) => import_styled_components2.css`
+    bottom: calc(${size4} / 2 * -1);
     left: ${distance};
   `,
-  "left bottom": (distance, size3) => import_styled_components2.css`
-    top: calc(${size3} / 2 * -1);
+  "left bottom": (distance, size4) => import_styled_components2.css`
+    top: calc(${size4} / 2 * -1);
     left: ${distance};
   `
 };
@@ -817,7 +818,7 @@ var Container = import_styled_components2.default.div`
     distance: "s1",
     ...pointer === true ? {} : pointer
   };
-  const size3 = typeof config.size === "function" ? config.size(theme4) : isKeyOf(theme4.spacings, config.size) ? theme4.spacings[config.size] : config.size;
+  const size4 = typeof config.size === "function" ? config.size(theme4) : isKeyOf(theme4.spacings, config.size) ? theme4.spacings[config.size] : config.size;
   const distance = typeof config.distance === "function" ? config.distance(theme4) : isKeyOf(theme4.spacings, config.distance) ? theme4.spacings[config.distance] : config.distance;
   const color = typeof config.color === "function" ? config.color(theme4) : isKeyOf(theme4.colors, config.color) ? theme4.colors[config.color] : config.color;
   return import_styled_components2.css`
@@ -826,10 +827,10 @@ var Container = import_styled_components2.default.div`
 
         position: absolute;
 
-        ${pointerPositions[position](distance, size3)}
+        ${pointerPositions[position](distance, size4)}
 
-        width: ${size3};
-        height: ${size3};
+        width: ${size4};
+        height: ${size4};
 
         transform: rotate(45deg);
 
@@ -970,7 +971,7 @@ var loader = import_styled_components3.keyframes`
 `;
 var Container2 = import_styled_components3.default.div`
   ${({
-  $size: size3,
+  $size: size4,
   $borderSize: borderSize,
   $bgColor: bgColor,
   $color: color,
@@ -978,9 +979,9 @@ var Container2 = import_styled_components3.default.div`
   $filled: filled,
   $zIndex: zIndex
 }) => {
-  const s = borderSize || size3;
+  const s = borderSize || size4;
   borderSize = s ? `calc(${s} * 0.0757)` : "5px";
-  size3 = size3 || "48px";
+  size4 = size4 || "48px";
   color = color || "blue";
   bgColor = bgColor || color;
   const beforeColor = isKeyOf(theme4.colors, bgColor) ? theme4.getColor(bgColor, 25) : color;
@@ -1008,10 +1009,10 @@ var Container2 = import_styled_components3.default.div`
         position: absolute;
         content: '';
 
-        top: calc(50% - ${size3} / 2);
-        left: calc(50% - ${size3} / 2);
-        width: ${size3};
-        height: ${size3};
+        top: calc(50% - ${size4} / 2);
+        left: calc(50% - ${size4} / 2);
+        width: ${size4};
+        height: ${size4};
         border-radius: 50%;
         border-width: ${borderSize};
         border-style: solid;
@@ -1032,7 +1033,7 @@ var Container2 = import_styled_components3.default.div`
 var Loader = ({
   color,
   bgColor,
-  size: size3,
+  size: size4,
   borderSize,
   filled,
   zIndex,
@@ -1044,7 +1045,7 @@ var Loader = ({
       ...props,
       $color: color,
       $bgColor: bgColor,
-      $size: size3,
+      $size: size4,
       $borderSize: borderSize,
       $filled: filled,
       $zIndex: zIndex
@@ -1098,13 +1099,13 @@ var Button = import_styled_components4.default.button`
   position: relative;
   user-select: none;
 
-  ${({ $size: size3, theme: theme4 }) => {
+  ${({ $size: size4, theme: theme4 }) => {
   const { sizes: sizes3 } = theme4.components.button;
   return import_styled_components4.css`
-      font-size: ${sizes3[size3].fontSize};
-      line-height: ${sizes3[size3].lineHeight};
-      min-width: ${sizes3[size3].minWidth};
-      min-height: ${sizes3[size3].minHeight};
+      font-size: ${sizes3[size4].fontSize};
+      line-height: ${sizes3[size4].lineHeight};
+      min-width: ${sizes3[size4].minWidth};
+      min-height: ${sizes3[size4].minHeight};
     `;
 }};
 
@@ -1188,13 +1189,13 @@ var Button = import_styled_components4.default.button`
 // src/components/Button/index.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var Button2 = (props) => {
-  const { children, content, ...styled79 } = props;
+  const { children, content, ...styled85 } = props;
   const defaultValues = {
-    $appearance: styled79.appearance || "solid",
-    $color: styled79.color,
-    $loading: styled79.loading ? +styled79.loading : 0,
-    $size: styled79.size || "small",
-    type: styled79.type || "button"
+    $appearance: styled85.appearance || "solid",
+    $color: styled85.color,
+    $loading: styled85.loading ? +styled85.loading : 0,
+    $size: styled85.size || "small",
+    type: styled85.type || "button"
   };
   const htmlProps = filterObject(props, ["size", "appearance", "color", "loading", "content"]);
   const loaderSize = sizes[defaultValues.$size].lineHeight;
@@ -1221,10 +1222,10 @@ var Button2 = (props) => {
 var Button_default = Button2;
 
 // src/components/Calendar/index.tsx
-var import_react19 = __toESM(require("react"));
+var import_react21 = __toESM(require("react"));
 
 // src/components/Calendar/components/Basic/index.tsx
-var import_react10 = __toESM(require("react"));
+var import_react12 = __toESM(require("react"));
 
 // src/components/Calendar/constants.ts
 var months = [
@@ -1248,13 +1249,86 @@ var inputTimeWidth = {
 };
 
 // src/components/Calendar/components/Basic/components/Main/index.tsx
-var import_react9 = __toESM(require("react"));
+var import_react11 = __toESM(require("react"));
 
-// src/hooks/onClickOut.ts
+// src/hooks/useDebouncedCallback/index.ts
 var import_react3 = require("react");
-var useOnClickOut = (callback) => {
-  const [ref, setRef] = (0, import_react3.useState)(null);
+var debounce = (fn, delay) => {
+  let timeout = null;
+  let lastArgs = null;
+  const debounced = (...args) => {
+    lastArgs = args;
+    if (timeout !== null) {
+      clearTimeout(timeout);
+    }
+    timeout = setTimeout(() => {
+      if (lastArgs !== null) {
+        fn(...lastArgs);
+        lastArgs = null;
+      }
+      timeout = null;
+    }, delay);
+  };
+  debounced.cancel = () => {
+    if (timeout !== null) {
+      clearTimeout(timeout);
+      timeout = null;
+    }
+    lastArgs = null;
+  };
+  debounced.flush = () => {
+    if (timeout !== null) {
+      clearTimeout(timeout);
+      timeout = null;
+    }
+    if (lastArgs !== null) {
+      fn(...lastArgs);
+      lastArgs = null;
+    }
+  };
+  return debounced;
+};
+var useDebouncedCallback = (callback, delay) => {
+  const debounced = (0, import_react3.useMemo)(() => debounce(callback, delay), [callback, delay]);
   (0, import_react3.useEffect)(() => {
+    return () => {
+      debounced.cancel();
+    };
+  }, [debounced]);
+  return debounced;
+};
+var useDebouncedCallback_default = useDebouncedCallback;
+
+// src/hooks/useDebouncedState/index.ts
+var import_react4 = require("react");
+var useDebouncedState = (initial, onUpdate, ms) => {
+  const [state, setState] = (0, import_react4.useState)({ current: initial, debounced: initial });
+  const onUpdateSearch = useDebouncedCallback_default(
+    (0, import_react4.useCallback)((search) => {
+      onUpdate();
+      setState((prev) => ({ ...prev, debounced: search }));
+    }, []),
+    ms
+  );
+  const setCurrent = (input) => {
+    setState((prev) => ({ ...prev, current: input }));
+    onUpdateSearch(input);
+  };
+  const setDebounced = (value) => {
+    setState({ current: value, debounced: value });
+  };
+  return {
+    current: [state.current, setCurrent],
+    debounced: [state.debounced, setDebounced]
+  };
+};
+var useDebouncedState_default = useDebouncedState;
+
+// src/hooks/useOnClickOut/index.ts
+var import_react5 = require("react");
+var useOnClickOut = (callback) => {
+  const [ref, setRef] = (0, import_react5.useState)(null);
+  (0, import_react5.useEffect)(() => {
     const listener = (event) => {
       if (!ref || ref.contains(event.target)) {
         return;
@@ -1270,10 +1344,10 @@ var useOnClickOut = (callback) => {
   }, [ref, callback]);
   return setRef;
 };
-var onClickOut_default = useOnClickOut;
+var useOnClickOut_default = useOnClickOut;
 
 // src/theme/index.tsx
-var import_react5 = require("react");
+var import_react7 = require("react");
 var import_styled_components6 = require("styled-components");
 
 // src/assets/helpers.ts
@@ -1322,7 +1396,7 @@ var theme2 = {
 var theme_default2 = theme2;
 
 // src/theme/globals.tsx
-var import_react4 = __toESM(require("react"));
+var import_react6 = __toESM(require("react"));
 var import_styled_components5 = require("styled-components");
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var Allura = import_styled_components5.createGlobalStyle`
@@ -1680,7 +1754,7 @@ var Lato = import_styled_components5.createGlobalStyle`
   }
 `;
 var Globals = () => {
-  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react4.default.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_react6.default.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Allura, {}),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(GreatVibes, {}),
     /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Pacifico, {}),
@@ -1721,7 +1795,7 @@ var theme3 = {
   components: theme_default2
 };
 var ThemeProvider = (props) => {
-  const value = (0, import_react5.useMemo)(() => {
+  const value = (0, import_react7.useMemo)(() => {
     return {
       ...theme3,
       assetUrl: (asset) => assetUrl(asset, props.assetBaseUrl)
@@ -8748,14 +8822,14 @@ var getInitialCalendar = (date, min, max) => {
 };
 
 // src/components/Calendar/components/Basic/components/MonthPicker/index.tsx
-var import_react8 = require("react");
+var import_react10 = require("react");
 
 // src/components/Menu/index.tsx
-var import_react7 = __toESM(require("react"));
+var import_react9 = __toESM(require("react"));
 var import_semantic_ui_react2 = require("semantic-ui-react");
 
 // src/components/ScrollContainer/index.tsx
-var import_react6 = __toESM(require("react"));
+var import_react8 = __toESM(require("react"));
 
 // src/components/ScrollContainer/styles/BeforeAfterContainer/index.ts
 var import_styled_components8 = __toESM(require("styled-components"));
@@ -8878,7 +8952,7 @@ var RelativeContainer_default = RelativeContainer;
 // src/components/ScrollContainer/index.tsx
 var import_jsx_runtime294 = require("react/jsx-runtime");
 var isAfterBefore = (props) => {
-  return !import_react6.default.isValidElement(props);
+  return !import_react8.default.isValidElement(props);
 };
 var getBeforeAfter = (props) => {
   if (!props) return null;
@@ -8894,12 +8968,12 @@ var getBeforeAfter = (props) => {
   );
   return /* @__PURE__ */ (0, import_jsx_runtime294.jsx)(BeforeAfterContainer_default, { ...args });
 };
-var ScrollContainer = import_react6.default.forwardRef(
+var ScrollContainer = import_react8.default.forwardRef(
   (props, ref) => {
     const { loading } = props;
     const onScrollEnd = props.onScrollEnd || (() => {
     });
-    const [, setLastPagination] = (0, import_react6.useState)(/* @__PURE__ */ new Date());
+    const [, setLastPagination] = (0, import_react8.useState)(/* @__PURE__ */ new Date());
     const onScroll = (event) => {
       if (event.target !== event.currentTarget) return;
       const target = event.nativeEvent.target;
@@ -9091,8 +9165,8 @@ var isVisible = (elem, bound) => {
 };
 var MenuComponent = (props, ref) => {
   const { close, options, children, highlight } = { ...props };
-  const [scrollRef, setScrollRef] = (0, import_react7.useState)(null);
-  (0, import_react7.useEffect)(() => {
+  const [scrollRef, setScrollRef] = (0, import_react9.useState)(null);
+  (0, import_react9.useEffect)(() => {
     if (!scrollRef || highlight === void 0) return;
     const element = scrollRef.children[highlight];
     if (!element) return;
@@ -9123,7 +9197,7 @@ var MenuComponent = (props, ref) => {
       $bordered: props.bordered,
       $containerSpacing: props.containerSpacing,
       $itemSpacing: props.itemSpacing,
-      children: /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(import_react7.default.Fragment, { children: [
+      children: /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(import_react9.default.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(
           ScrollContainer_default,
           {
@@ -9183,8 +9257,8 @@ var MenuComponent = (props, ref) => {
               const label = option.label;
               const labelOptions = filterObject(option, ["onClick", "label", "rules"]);
               labelOptions.disabled = disabled;
-              const LabelComponent = typeof label === "function" ? label : () => /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(import_react7.default.Fragment, { children: label });
-              return /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(import_react7.default.Fragment, { children: [
+              const LabelComponent = typeof label === "function" ? label : () => /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(import_react9.default.Fragment, { children: label });
+              return /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(import_react9.default.Fragment, { children: [
                 /* @__PURE__ */ (0, import_jsx_runtime295.jsx)(OptionContent, { children: /* @__PURE__ */ (0, import_jsx_runtime295.jsxs)(
                   Option,
                   {
@@ -9208,7 +9282,7 @@ var MenuComponent = (props, ref) => {
     }
   );
 };
-var Menu = import_react7.default.forwardRef(MenuComponent);
+var Menu = import_react9.default.forwardRef(MenuComponent);
 var Menu_default2 = Menu;
 
 // src/components/Calendar/components/Basic/styles.ts
@@ -9312,8 +9386,8 @@ var NavBtn = import_styled_components13.default.button`
 var import_jsx_runtime296 = require("react/jsx-runtime");
 var MonthPicker = (props) => {
   const { setValue, close, min, max, year: initialYear, ...menuProps } = props;
-  const [year, setYear] = (0, import_react8.useState)(initialYear);
-  (0, import_react8.useEffect)(() => {
+  const [year, setYear] = (0, import_react10.useState)(initialYear);
+  (0, import_react10.useEffect)(() => {
     setYear(initialYear);
   }, [props.open, initialYear]);
   return /* @__PURE__ */ (0, import_jsx_runtime296.jsx)(
@@ -9415,9 +9489,9 @@ var Container6 = import_styled_components14.default.div`
     display: block;
     border-radius: 100%;
 
-    ${({ $size: size3 }) => import_styled_components14.css`
-      width: ${sizes2[size3]};
-      height: ${sizes2[size3]};
+    ${({ $size: size4 }) => import_styled_components14.css`
+      width: ${sizes2[size4]};
+      height: ${sizes2[size4]};
     `};
 
     background-color: ${({ theme: { colors: colors2 }, $type: type }) => colors2[types[type]]};
@@ -9427,7 +9501,7 @@ var Container6 = import_styled_components14.default.div`
 // src/components/Indicator/index.tsx
 var import_jsx_runtime297 = require("react/jsx-runtime");
 var Indicator = ({
-  size: size3,
+  size: size4,
   type,
   labelColor,
   ...props
@@ -9436,7 +9510,7 @@ var Indicator = ({
     Container6,
     {
       ...{
-        $size: size3 || "small",
+        $size: size4 || "small",
         $type: type || "default",
         $labelColor: labelColor || "darkBlue",
         ...props
@@ -9579,11 +9653,11 @@ var DayIndicator = (0, import_styled_components15.default)(Indicator_default).at
 
 // src/components/Calendar/components/Basic/components/Main/index.tsx
 var import_jsx_runtime298 = require("react/jsx-runtime");
-var Main = import_react9.default.forwardRef(
+var Main = import_react11.default.forwardRef(
   (props, ref) => {
     const { getDay, initialMonth } = props;
-    const [selectOpen, setSelectOpen] = (0, import_react9.useState)(false);
-    const [loading, setLoading] = (0, import_react9.useState)(false);
+    const [selectOpen, setSelectOpen] = (0, import_react11.useState)(false);
+    const [loading, setLoading] = (0, import_react11.useState)(false);
     const onChangeMonth = (() => {
       const { onChangeMonth: onChangeMonth2 } = props;
       if (!onChangeMonth2) return async () => {
@@ -9604,7 +9678,7 @@ var Main = import_react9.default.forwardRef(
       date.setHours(0, 0, 0, 0);
       return date;
     })() : void 0;
-    const [calendar, _setCalendar] = props.calendar || (0, import_react9.useState)(getInitialCalendar(initialMonth, min, max));
+    const [calendar, _setCalendar] = props.calendar || (0, import_react11.useState)(getInitialCalendar(initialMonth, min, max));
     const setCalendar = (value) => {
       _setCalendar((prev) => {
         const newv = typeof value === "function" ? value(prev) : value;
@@ -9612,7 +9686,7 @@ var Main = import_react9.default.forwardRef(
       });
     };
     const isControlled = props.calendar !== void 0;
-    (0, import_react9.useEffect)(() => {
+    (0, import_react11.useEffect)(() => {
       if (isControlled) return;
       setCalendar(getInitialCalendar(initialMonth, min, max));
     }, [
@@ -9621,7 +9695,7 @@ var Main = import_react9.default.forwardRef(
       min?.toISOString(),
       max?.toISOString()
     ]);
-    (0, import_react9.useEffect)(() => {
+    (0, import_react11.useEffect)(() => {
       const [first, last] = [
         calendar.weeks[0],
         calendar.weeks[calendar.weeks.length - 1]
@@ -9671,7 +9745,7 @@ var Main = import_react9.default.forwardRef(
         /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(Header, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(MonthContainer, { children: [
             getPrev(),
-            /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)("div", { ref: onClickOut_default(() => setSelectOpen(false)), children: [
+            /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)("div", { ref: useOnClickOut_default(() => setSelectOpen(false)), children: [
               (() => {
                 if (min !== void 0 && max !== void 0 && min.getFullYear() === max.getFullYear() && min.getMonth() === max.getMonth()) {
                   return /* @__PURE__ */ (0, import_jsx_runtime298.jsxs)(MonthName, { children: [
@@ -9782,7 +9856,7 @@ var Main_default = Main;
 
 // src/components/Calendar/components/Basic/index.tsx
 var import_jsx_runtime299 = require("react/jsx-runtime");
-var BasicCalendar = import_react10.default.forwardRef(
+var BasicCalendar = import_react12.default.forwardRef(
   (props, ref) => {
     const containerProps = filterObject(props, [
       "initialMonth",
@@ -9810,22 +9884,22 @@ BasicCalendar.displayName = "BasicCalendar";
 var Basic_default = BasicCalendar;
 
 // src/components/Calendar/components/Interval/index.tsx
-var import_react16 = __toESM(require("react"));
+var import_react18 = __toESM(require("react"));
 
 // src/components/Calendar/components/Interval/components/Main/index.tsx
-var import_react15 = __toESM(require("react"));
+var import_react17 = __toESM(require("react"));
 
 // src/components/Input/components/Time/index.tsx
-var import_react14 = __toESM(require("react"));
+var import_react16 = __toESM(require("react"));
 
 // src/components/Input/components/Input/index.tsx
-var import_react13 = __toESM(require("react"));
+var import_react15 = __toESM(require("react"));
 
 // src/components/Form/index.tsx
-var import_react12 = __toESM(require("react"));
+var import_react14 = __toESM(require("react"));
 
 // src/components/Form/context.tsx
-var import_react11 = __toESM(require("react"));
+var import_react13 = __toESM(require("react"));
 var import_jsx_runtime300 = require("react/jsx-runtime");
 var defaultValue = {
   isRequired: () => false,
@@ -9833,9 +9907,9 @@ var defaultValue = {
   isViewMode: () => false,
   isDisabled: () => false
 };
-var Context = import_react11.default.createContext({ ...defaultValue });
+var Context = import_react13.default.createContext({ ...defaultValue });
 var useContext = (name) => {
-  const context = import_react11.default.useContext(Context);
+  const context = import_react13.default.useContext(Context);
   return {
     isRequired: () => false,
     isInvalid: () => false,
@@ -9863,7 +9937,7 @@ var context_default = useContext;
 // src/components/Form/index.tsx
 var import_jsx_runtime301 = require("react/jsx-runtime");
 var Form = Object.assign(
-  import_react12.default.forwardRef(
+  import_react14.default.forwardRef(
     Object.assign(
       (props, ref) => {
         const formProps = filterObject(props, ["isRequired", "isInvalid", "isViewMode", "isDisabled"]);
@@ -10225,7 +10299,7 @@ var setMask = (event, handler, setValue, maskFn) => {
     target.setSelectionRange(start, end);
   }
 };
-var Input2 = import_react13.default.forwardRef(
+var Input2 = import_react15.default.forwardRef(
   (props, ref) => {
     const {
       label,
@@ -10245,9 +10319,9 @@ var Input2 = import_react13.default.forwardRef(
     const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
       props.name
     );
-    const isComposing = (0, import_react13.useRef)(false);
-    const maskFn = (0, import_react13.useMemo)(() => getMask(props.mask), [props.mask]);
-    (0, import_react13.useEffect)(() => {
+    const isComposing = (0, import_react15.useRef)(false);
+    const maskFn = (0, import_react15.useMemo)(() => getMask(props.mask), [props.mask]);
+    (0, import_react15.useEffect)(() => {
       if (isComposing.current) return;
       if (!isString(props.value)) return;
       const masked = maskFn(props.value);
@@ -10393,7 +10467,7 @@ var Input2 = import_react13.default.forwardRef(
           viewMode ? /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(ViewModeContainer, { children: inputProps.value || props.children }) : /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(InputContainer, { $width: props.inputWidth, children: [
             /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Input, { ...inputProps, ref }),
             props.children && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(ChildrenContainer, { children: props.children }),
-            /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(IconContainer, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Icon_default, { type: "jsx", icon: /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Loader_default, { size: "14px" }), width: "14px" }) : /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(import_react13.default.Fragment, { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(IconContainer, { children: loading ? /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Icon_default, { type: "jsx", icon: /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(Loader_default, { size: "14px" }), width: "14px" }) : /* @__PURE__ */ (0, import_jsx_runtime303.jsxs)(import_react15.default.Fragment, { children: [
               onDirty && /* @__PURE__ */ (0, import_jsx_runtime303.jsx)(
                 Icon_default,
                 {
@@ -10464,7 +10538,7 @@ var getDate = (value) => {
   date.setHours(h, m, s, 0);
   return date;
 };
-var Time = import_react14.default.forwardRef(
+var Time = import_react16.default.forwardRef(
   (props, ref) => {
     const { value, seconds } = props;
     const _onKeyDown = props.onKeyDown || (() => {
@@ -10618,15 +10692,15 @@ var LabelContainer2 = import_styled_components19.default.div`
 
 // src/components/Calendar/components/Interval/components/Main/index.tsx
 var import_jsx_runtime305 = require("react/jsx-runtime");
-var Main2 = import_react15.default.forwardRef(
+var Main2 = import_react17.default.forwardRef(
   (props, ref) => {
     const { initialMonth, initialValue, min, max } = props;
-    const [value, setValue] = props.value || (0, import_react15.useState)(getValue(initialValue || [], min, max));
-    const [invalid, setInvalid] = props.invalid || (0, import_react15.useState)([false, false]);
-    const [time, setTime] = (0, import_react15.useState)(() => {
+    const [value, setValue] = props.value || (0, import_react17.useState)(getValue(initialValue || [], min, max));
+    const [invalid, setInvalid] = props.invalid || (0, import_react17.useState)([false, false]);
+    const [time, setTime] = (0, import_react17.useState)(() => {
       return value.map(getTimeFromDate);
     });
-    const [calendar1, _setCalendar1] = (0, import_react15.useState)(() => {
+    const [calendar1, _setCalendar1] = (0, import_react17.useState)(() => {
       const calendar12 = getInitialCalendar(value[0] || initialMonth, min, max);
       return calendar12;
     });
@@ -10636,7 +10710,7 @@ var Main2 = import_react15.default.forwardRef(
         return newv.month === prev.month && newv.year === prev.year ? prev : newv;
       });
     };
-    const [calendar2, _setCalendar2] = (0, import_react15.useState)(() => {
+    const [calendar2, _setCalendar2] = (0, import_react17.useState)(() => {
       const calendar22 = getCalendar2(calendar1);
       return calendar22;
     });
@@ -10646,14 +10720,14 @@ var Main2 = import_react15.default.forwardRef(
         return newv.month === prev.month && newv.year === prev.year ? prev : newv;
       });
     };
-    const [hoverDay, setHoverDay] = (0, import_react15.useState)(null);
-    (0, import_react15.useEffect)(() => {
+    const [hoverDay, setHoverDay] = (0, import_react17.useState)(null);
+    (0, import_react17.useEffect)(() => {
       const calendar12 = getInitialCalendar(value[0] || initialMonth, min, max);
       const calendar22 = getCalendar2(calendar12);
       setCalendar1(calendar12);
       setCalendar2(calendar22);
     }, [initialMonth?.toISOString(), min?.toISOString(), max?.toISOString()]);
-    (0, import_react15.useEffect)(() => {
+    (0, import_react17.useEffect)(() => {
       const timeProps = getTimeProps(props.time, value);
       setHoverDay(null);
       if (value[0]) {
@@ -10847,7 +10921,7 @@ var Main_default2 = Main2;
 
 // src/components/Calendar/components/Interval/index.tsx
 var import_jsx_runtime306 = require("react/jsx-runtime");
-var CalendarInterval = import_react16.default.forwardRef(
+var CalendarInterval = import_react18.default.forwardRef(
   (props, ref) => {
     const containerProps = filterObject(props, [
       "initialMonth",
@@ -10881,15 +10955,15 @@ CalendarInterval.displayName = "CalendarInterval";
 var Interval_default = CalendarInterval;
 
 // src/components/Calendar/components/Single/index.tsx
-var import_react18 = __toESM(require("react"));
+var import_react20 = __toESM(require("react"));
 
 // src/components/Calendar/components/Single/components/Main/index.tsx
-var import_react17 = __toESM(require("react"));
+var import_react19 = __toESM(require("react"));
 var import_jsx_runtime307 = require("react/jsx-runtime");
-var SingleCalendar = import_react17.default.forwardRef(
+var SingleCalendar = import_react19.default.forwardRef(
   (props, ref) => {
     const { initialValue, min, max } = props;
-    const [value, setValue] = props.value || (0, import_react17.useState)(
+    const [value, setValue] = props.value || (0, import_react19.useState)(
       initialValue && !isNaN(initialValue.getTime()) && isDateBetween(initialValue, min, max) ? initialValue : null
     );
     const timeProps = (() => {
@@ -10897,9 +10971,9 @@ var SingleCalendar = import_react17.default.forwardRef(
       if (typeof props.time === "function") return props.time(value);
       return props.time;
     })();
-    const [invalid, setInvalid] = props.invalid || (0, import_react17.useState)(false);
-    const [time, setTime] = (0, import_react17.useState)(getTimeFromDate(value));
-    (0, import_react17.useEffect)(() => {
+    const [invalid, setInvalid] = props.invalid || (0, import_react19.useState)(false);
+    const [time, setTime] = (0, import_react19.useState)(getTimeFromDate(value));
+    (0, import_react19.useEffect)(() => {
       setInvalid(isInvalid(value, time, timeProps, min, max));
     }, [value, time, timeProps]);
     const _getDay = props.getDay || (() => ({}));
@@ -10969,7 +11043,7 @@ var Main_default3 = SingleCalendar;
 
 // src/components/Calendar/components/Single/index.tsx
 var import_jsx_runtime308 = require("react/jsx-runtime");
-var CalendarSingle = import_react18.default.forwardRef(
+var CalendarSingle = import_react20.default.forwardRef(
   (props, ref) => {
     const containerProps = filterObject(props, [
       "initialMonth",
@@ -11007,7 +11081,7 @@ var Single_default = CalendarSingle;
 
 // src/components/Calendar/index.tsx
 var import_jsx_runtime309 = require("react/jsx-runtime");
-var Calendar = import_react19.default.forwardRef(
+var Calendar = import_react21.default.forwardRef(
   (props, ref) => {
     switch (props.type) {
       case "basic": {
@@ -11035,21 +11109,21 @@ var Container7 = import_styled_components20.default.div`
   border-left-width: 5px;
   padding: 14px;
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components20.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components20.css`
       width: 394px;
       height: 99px;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components20.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components20.css`
       width: 394px;
       height: 131px;
     `}
     
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components20.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components20.css`
       width: 394px;
     `}
 
-  ${({ $size: size3 }) => size3 === "big" && import_styled_components20.css`
+  ${({ $size: size4 }) => size4 === "big" && import_styled_components20.css`
       width: 414px;
       height: 324px;
     `}
@@ -11077,13 +11151,13 @@ var Container7 = import_styled_components20.default.div`
 
 // src/components/Card/index.tsx
 var import_jsx_runtime310 = require("react/jsx-runtime");
-var Card = ({ borderType, size: size3, ...rest }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime310.jsx)(Container7, { $borderType: borderType, $size: size3, ...rest });
+var Card = ({ borderType, size: size4, ...rest }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime310.jsx)(Container7, { $borderType: borderType, $size: size4, ...rest });
 };
 var Card_default = Card;
 
 // src/components/Filters/Button/index.tsx
-var import_react20 = require("react");
+var import_react22 = require("react");
 
 // src/components/Filters/Button/styles.ts
 var import_styled_components21 = __toESM(require("styled-components"));
@@ -11110,11 +11184,11 @@ var Container8 = import_styled_components21.default.div`
 var import_jsx_runtime311 = require("react/jsx-runtime");
 var Button3 = (props) => {
   const { getContent } = props;
-  const [open, setOpen] = (0, import_react20.useState)(false);
+  const [open, setOpen] = (0, import_react22.useState)(false);
   const close = () => setOpen(false);
   const onClick = props.disabled ? void 0 : () => setOpen((prev) => !prev);
   const buttonProps = filterObject(props, ["getContent", "gap"]);
-  return /* @__PURE__ */ (0, import_jsx_runtime311.jsxs)("div", { ref: onClickOut_default(close), children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime311.jsxs)("div", { ref: useOnClickOut_default(close), children: [
     /* @__PURE__ */ (0, import_jsx_runtime311.jsxs)(Container8, { ...buttonProps, ...{ onClick }, $gap: props.gap, children: [
       props.children,
       /* @__PURE__ */ (0, import_jsx_runtime311.jsx)(
@@ -11132,13 +11206,13 @@ var Button3 = (props) => {
 var Button_default2 = Button3;
 
 // src/components/Filters/AppliedFilters/components/Menu/index.tsx
-var import_react42 = require("react");
+var import_react44 = require("react");
 
 // src/components/Input/index.tsx
-var import_react41 = __toESM(require("react"));
+var import_react43 = __toESM(require("react"));
 
 // src/components/Input/components/Checkbox/index.tsx
-var import_react21 = __toESM(require("react"));
+var import_react23 = __toESM(require("react"));
 
 // src/components/Input/components/Checkbox/styles.ts
 var import_styled_components22 = __toESM(require("styled-components"));
@@ -11339,7 +11413,7 @@ var DefaultLabel = (props) => {
     }
   );
 };
-var Checkbox = import_react21.default.forwardRef(
+var Checkbox = import_react23.default.forwardRef(
   (props, ref) => {
     const { padding, bordered } = props;
     const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
@@ -11401,7 +11475,7 @@ Checkbox.displayName = "Checkbox";
 var Checkbox_default = Checkbox;
 
 // src/components/Input/components/Date/index.tsx
-var import_react22 = __toESM(require("react"));
+var import_react24 = __toESM(require("react"));
 
 // src/components/Input/components/Date/functions.ts
 var JSDate = Date;
@@ -11463,12 +11537,12 @@ var mask2 = (v) => {
   else if (v.length < 5) return v.substring(0, 2) + "/" + v.substring(2);
   else return v.substring(0, 2) + "/" + v.substring(2, 4) + "/" + v.substring(4);
 };
-var Date2 = import_react22.default.forwardRef(
+var Date2 = import_react24.default.forwardRef(
   (props, ref) => {
     const { picker, value, min, max } = props;
     const setValue = props.setValue || (() => {
     });
-    const [open, setOpen] = (0, import_react22.useState)(false);
+    const [open, setOpen] = (0, import_react24.useState)(false);
     const _onKeyDown = props.onKeyDown || (() => {
     });
     const onKeyDown = (event) => {
@@ -11513,7 +11587,7 @@ var Date2 = import_react22.default.forwardRef(
       "min",
       "max"
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime313.jsxs)(RelativeContainer2, { ref: onClickOut_default(() => setOpen(false)), children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime313.jsxs)(RelativeContainer2, { ref: useOnClickOut_default(() => setOpen(false)), children: [
       /* @__PURE__ */ (0, import_jsx_runtime313.jsx)(
         Input_default,
         {
@@ -11554,7 +11628,7 @@ Date2.displayName = "Date";
 var Date_default = Date2;
 
 // src/components/Input/components/DateIntervalPicker/index.tsx
-var import_react23 = __toESM(require("react"));
+var import_react25 = __toESM(require("react"));
 
 // src/components/Input/components/DateIntervalPicker/functions.ts
 var validate = ([start, end], min, max) => {
@@ -11841,12 +11915,12 @@ var LabelText2 = import_styled_components24.default.label`
 
 // src/components/Input/components/DateIntervalPicker/index.tsx
 var import_jsx_runtime314 = require("react/jsx-runtime");
-var Component = import_react23.default.forwardRef(
+var Component = import_react25.default.forwardRef(
   (props, ref) => {
     const center = props.center || { x: 50, y: 50 };
     const value = parse(props.value);
-    const [open, setOpen] = (0, import_react23.useState)(null);
-    const [intervalType, setIntervalType] = (0, import_react23.useState)(
+    const [open, setOpen] = (0, import_react25.useState)(null);
+    const [intervalType, setIntervalType] = (0, import_react25.useState)(
       props.only || "day"
     );
     const config = intervalTypes[intervalType];
@@ -11857,7 +11931,7 @@ var Component = import_react23.default.forwardRef(
       );
       props.setValue(parsed);
     };
-    (0, import_react23.useEffect)(() => {
+    (0, import_react25.useEffect)(() => {
       if (props.min && props.max && props.min > props.max) {
         throw Error("Min prop must be less than Max");
       }
@@ -11922,7 +11996,7 @@ var Component = import_react23.default.forwardRef(
     return /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(
       RelativeContainer3,
       {
-        ref: onClickOut_default(() => setOpen(null)),
+        ref: useOnClickOut_default(() => setOpen(null)),
         $invalid: invalid,
         children: [
           props.label ? /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(LabelText2, { $required: props.required, children: [
@@ -11942,7 +12016,7 @@ var Component = import_react23.default.forwardRef(
                   if (intervalType === "custom") return label;
                   const incrementProps = getArrowProps("increment");
                   const decrementProps = getArrowProps("decrement");
-                  return /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(import_react23.default.Fragment, { children: [
+                  return /* @__PURE__ */ (0, import_jsx_runtime314.jsxs)(import_react25.default.Fragment, { children: [
                     /* @__PURE__ */ (0, import_jsx_runtime314.jsx)(
                       Button4,
                       {
@@ -12071,7 +12145,7 @@ var DatePicker = Object.assign(Component, {
 var DateIntervalPicker_default = DatePicker;
 
 // src/components/Input/components/DatePicker/index.tsx
-var import_react24 = __toESM(require("react"));
+var import_react26 = __toESM(require("react"));
 
 // src/components/Input/components/DatePicker/styles.ts
 var import_styled_components25 = __toESM(require("styled-components"));
@@ -12148,13 +12222,13 @@ var Button5 = import_styled_components25.default.button`
 
 // src/components/Input/components/DatePicker/index.tsx
 var import_jsx_runtime315 = require("react/jsx-runtime");
-var DatePicker2 = import_react24.default.forwardRef(
+var DatePicker2 = import_react26.default.forwardRef(
   (props, ref) => {
     const { picker, value, setValue, min, max } = props;
     const disabled = props.disabled || props.loading;
     const today = dateToIsoString(/* @__PURE__ */ new Date());
-    const [open, setOpen] = (0, import_react24.useState)(false);
-    (0, import_react24.useEffect)(() => {
+    const [open, setOpen] = (0, import_react26.useState)(false);
+    (0, import_react26.useEffect)(() => {
       const date = isoStringToDate(value);
       if (!date) {
         setValue(dateToIsoString(getMiddle(min, max)));
@@ -12186,7 +12260,7 @@ var DatePicker2 = import_react24.default.forwardRef(
       "min",
       "max"
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime315.jsxs)(RelativeContainer4, { ref: onClickOut_default(() => setOpen(false)), children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime315.jsxs)(RelativeContainer4, { ref: useOnClickOut_default(() => setOpen(false)), children: [
       /* @__PURE__ */ (0, import_jsx_runtime315.jsx)(Input_default, { ...inputProps, type: "text", icon, ref, htmlDisabled: true }),
       /* @__PURE__ */ (0, import_jsx_runtime315.jsxs)(
         Container10,
@@ -12273,7 +12347,7 @@ DatePicker2.displayName = "DatePicker";
 var DatePicker_default = DatePicker2;
 
 // src/components/Input/components/DateTime/index.tsx
-var import_react25 = __toESM(require("react"));
+var import_react27 = __toESM(require("react"));
 
 // src/components/Input/components/DateTime/styles.ts
 var import_styled_components26 = __toESM(require("styled-components"));
@@ -12434,13 +12508,13 @@ var steps = {
     }
   }
 };
-var DateTime = import_react25.default.forwardRef(
+var DateTime = import_react27.default.forwardRef(
   (props, ref) => {
     const { picker, value, min, max } = props;
     const step = steps[props.step || "day"];
     const setValue = props.setValue || (() => {
     });
-    const [open, setOpen] = (0, import_react25.useState)(false);
+    const [open, setOpen] = (0, import_react27.useState)(false);
     const _onKeyDown = props.onKeyDown || (() => {
     });
     const onKeyDown = (event) => {
@@ -12518,7 +12592,7 @@ var DateTime = import_react25.default.forwardRef(
       "min",
       "max"
     ]);
-    return /* @__PURE__ */ (0, import_jsx_runtime316.jsxs)(RelativeContainer5, { ref: onClickOut_default(() => setOpen(false)), children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime316.jsxs)(RelativeContainer5, { ref: useOnClickOut_default(() => setOpen(false)), children: [
       /* @__PURE__ */ (0, import_jsx_runtime316.jsx)(
         Input_default,
         {
@@ -12561,11 +12635,11 @@ DateTime.displayName = "DateTime";
 var DateTime_default = DateTime;
 
 // src/components/Input/components/Password/index.tsx
-var import_react26 = __toESM(require("react"));
+var import_react28 = __toESM(require("react"));
 var import_jsx_runtime317 = require("react/jsx-runtime");
-var Password = import_react26.default.forwardRef(
+var Password = import_react28.default.forwardRef(
   (props, ref) => {
-    const [visibility, setVisibility] = (0, import_react26.useState)("hidden");
+    const [visibility, setVisibility] = (0, import_react28.useState)("hidden");
     const icons2 = {
       visible: {
         icon: "eye_off",
@@ -12600,7 +12674,7 @@ Password.displayName = "Password";
 var Password_default = Password;
 
 // src/components/Input/components/Phone/index.tsx
-var import_react27 = __toESM(require("react"));
+var import_react29 = __toESM(require("react"));
 
 // src/assets/icons/flags/index.ts
 var import_styled_components27 = __toESM(require("styled-components"));
@@ -12885,17 +12959,17 @@ var Button6 = (props) => {
     }
   );
 };
-var Component2 = import_react27.default.forwardRef(
+var Component2 = import_react29.default.forwardRef(
   (props, ref) => {
     const { value, setValue } = props;
-    const [inputValue, setInputValue] = (0, import_react27.useState)(
+    const [inputValue, setInputValue] = (0, import_react29.useState)(
       !value ? "" : () => {
         const details = getPhoneDetails(value);
         return details ? details.masked : value;
       }
     );
-    const [country, setCountry] = (0, import_react27.useState)(countries_default.br);
-    const [open, setOpen] = (0, import_react27.useState)(false);
+    const [country, setCountry] = (0, import_react29.useState)(countries_default.br);
+    const [open, setOpen] = (0, import_react29.useState)(false);
     const options = Object.keys(countries_default).map((iso) => ({
       label: (option) => {
         const country2 = option.data;
@@ -12919,7 +12993,7 @@ var Component2 = import_react27.default.forwardRef(
       if (country.mask) value2 = country.mask(value2);
       return value2;
     };
-    (0, import_react27.useEffect)(() => {
+    (0, import_react29.useEffect)(() => {
       if (!value) {
         setInputValue("");
         return;
@@ -12933,10 +13007,10 @@ var Component2 = import_react27.default.forwardRef(
         setInputValue(value);
       }
     }, [value]);
-    (0, import_react27.useEffect)(() => {
+    (0, import_react29.useEffect)(() => {
       setInputValue((prev) => mask4(prev));
     }, [country]);
-    (0, import_react27.useEffect)(() => {
+    (0, import_react29.useEffect)(() => {
       const v = inputValue.replace(/\D+/g, "").substring(0, country.charLimit);
       setValue(v ? `${country.ddi} ${v}` : v);
     }, [inputValue]);
@@ -12944,7 +13018,7 @@ var Component2 = import_react27.default.forwardRef(
     return /* @__PURE__ */ (0, import_jsx_runtime318.jsxs)(
       RelativeContainer6,
       {
-        ref: onClickOut_default(() => setOpen(false)),
+        ref: useOnClickOut_default(() => setOpen(false)),
         children: [
           /* @__PURE__ */ (0, import_jsx_runtime318.jsx)(
             Input_default,
@@ -13008,6 +13082,8 @@ var LabelContainer5 = import_styled_components29.default.div`
 `;
 var Label4 = import_styled_components29.default.label`
   display: flex;
+  align-items: center;
+
   gap: ${({ theme: theme4 }) => theme4.spacings.s1};
 
   min-height: ${size2};
@@ -13066,18 +13142,19 @@ var Label4 = import_styled_components29.default.label`
 
   > input {
     position: absolute;
-    top: 0;
-    left: 0;
-    height: 0;
-    width: 0;
-    /* Chrome, Safari, Edge, Opera */
+    height: 1px;
+    width: 1px;
+    opacity: 0;
+
+    /* Appearance (General) */
+    appearance: none;
+    /* Appearance (Chrome, Safari, Edge, Opera) */
     &:-webkit-outer-spin-button,
     &:-webkit-inner-spin-button {
       -webkit-appearance: none;
       margin: 0;
     }
-
-    /* Firefox */
+    /* Appearance (Firefox) */
     -moz-appearance: none;
   }
 
@@ -13134,7 +13211,7 @@ var RadioButton = (props) => {
 var RadioButton_default = RadioButton;
 
 // src/components/Input/components/Range/index.tsx
-var import_react28 = __toESM(require("react"));
+var import_react30 = __toESM(require("react"));
 
 // src/components/Input/components/Range/styles/Input/index.ts
 var import_styled_components30 = __toESM(require("styled-components"));
@@ -13569,18 +13646,18 @@ var getMarkerLeft = (markers, range, index, value, min, strict) => {
   const left = `calc(${p}% - 10px - ${x}px)`;
   return left;
 };
-var getLeftCalc = (size3, bullet2, value, min, max) => {
+var getLeftCalc = (size4, bullet2, value, min, max) => {
   const percent = (value - min) * 100 / (max - min);
-  const calc = `calc(${percent}% - ${bullet2 * percent / 100}px + ${(bullet2 - size3) / 2}px)`;
+  const calc = `calc(${percent}% - ${bullet2 * percent / 100}px + ${(bullet2 - size4) / 2}px)`;
   return calc;
 };
-var getBarLeft = (size3, calc) => {
-  return `min(max(${calc}, 0%), calc(100% - ${size3}px))`;
+var getBarLeft = (size4, calc) => {
+  return `min(max(${calc}, 0%), calc(100% - ${size4}px))`;
 };
-var getIndicatorLeft = (size3, calc) => {
-  return `min(max(${calc}, calc(0% - ${size3}px)), calc(100% - ${size3}px))`;
+var getIndicatorLeft = (size4, calc) => {
+  return `min(max(${calc}, calc(0% - ${size4}px)), calc(100% - ${size4}px))`;
 };
-var Range = import_react28.default.forwardRef(
+var Range = import_react30.default.forwardRef(
   (props, ref) => {
     const { label, minLabel, maxLabel, width, setValue, hideNavbar } = props;
     const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
@@ -13790,10 +13867,10 @@ Range.displayName = "input";
 var Range_default = Range;
 
 // src/components/Input/components/Select/index.tsx
-var import_react37 = __toESM(require("react"));
+var import_react39 = __toESM(require("react"));
 
 // src/components/Input/components/Select/hooks/Select/index.tsx
-var import_react32 = __toESM(require("react"));
+var import_react34 = __toESM(require("react"));
 
 // src/components/Input/components/Select/styles.ts
 var import_styled_components41 = __toESM(require("styled-components"));
@@ -13821,7 +13898,7 @@ var HiddenInput = import_styled_components41.default.input`
 `;
 
 // src/components/Input/components/Select/hooks/Navigation/index.ts
-var import_react29 = require("react");
+var import_react31 = require("react");
 var isAvailable = (index, option) => {
   return !option.disabled && !(option.rules || []).some((rule) => rule(index, option.data) !== true);
 };
@@ -13831,7 +13908,7 @@ var useNavigation = (props) => {
     options,
     onSelectHighlight
   } = props;
-  const onKeyDown = (0, import_react29.useCallback)(
+  const onKeyDown = (0, import_react31.useCallback)(
     (e) => {
       if (e.key === "ArrowDown") {
         e.preventDefault();
@@ -13880,12 +13957,12 @@ var useNavigation = (props) => {
 var Navigation_default2 = useNavigation;
 
 // src/components/Input/components/Select/hooks/Select/components/Header/index.tsx
-var import_react31 = __toESM(require("react"));
+var import_react33 = __toESM(require("react"));
 
 // src/components/Input/components/Select/hooks/Select/context.ts
-var import_react30 = __toESM(require("react"));
-var Provider3 = import_react30.default.createContext({});
-var useContext2 = () => import_react30.default.useContext(Provider3);
+var import_react32 = __toESM(require("react"));
+var Provider3 = import_react32.default.createContext({});
+var useContext2 = () => import_react32.default.useContext(Provider3);
 var context_default2 = Provider3;
 
 // src/components/Input/components/Select/hooks/Select/components/Header/styles.ts
@@ -13901,7 +13978,7 @@ var import_jsx_runtime321 = require("react/jsx-runtime");
 var Header2 = () => {
   const context = useContext2();
   if (!context.props.search) {
-    return /* @__PURE__ */ (0, import_jsx_runtime321.jsx)(import_react31.default.Fragment, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime321.jsx)(import_react33.default.Fragment, {});
   }
   const {
     searchInput: [searchInput, setSearchInput]
@@ -13994,7 +14071,7 @@ var useSelect = (props, [highlight, setHighlight], [options, setOptions], setOpe
     onReset,
     menu: {
       itemSpacing: "s3",
-      before: /* @__PURE__ */ (0, import_jsx_runtime322.jsxs)(import_react32.default.Fragment, { children: [
+      before: /* @__PURE__ */ (0, import_jsx_runtime322.jsxs)(import_react34.default.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime322.jsx)(Header_default, {}),
         /* @__PURE__ */ (0, import_jsx_runtime322.jsx)(
           HiddenInput,
@@ -14025,15 +14102,15 @@ var useSelect = (props, [highlight, setHighlight], [options, setOptions], setOpe
 var Select_default = useSelect;
 
 // src/components/Input/components/Select/hooks/SelectMultiple/index.tsx
-var import_react36 = __toESM(require("react"));
+var import_react38 = __toESM(require("react"));
 
 // src/components/Input/components/Select/hooks/SelectMultiple/components/Footer/index.tsx
-var import_react34 = __toESM(require("react"));
+var import_react36 = __toESM(require("react"));
 
 // src/components/Input/components/Select/hooks/SelectMultiple/context.ts
-var import_react33 = __toESM(require("react"));
-var Provider4 = import_react33.default.createContext({});
-var useContext3 = () => import_react33.default.useContext(Provider4);
+var import_react35 = __toESM(require("react"));
+var Provider4 = import_react35.default.createContext({});
+var useContext3 = () => import_react35.default.useContext(Provider4);
 var context_default3 = Provider4;
 
 // src/components/Input/components/Select/hooks/SelectMultiple/components/Footer/index.tsx
@@ -14063,7 +14140,7 @@ var Footer2 = () => {
     setValue(value2, data);
     setOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime323.jsxs)(import_react34.default.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime323.jsxs)(import_react36.default.Fragment, { children: [
     error && /* @__PURE__ */ (0, import_jsx_runtime323.jsx)(
       "span",
       {
@@ -14091,14 +14168,14 @@ var Footer2 = () => {
 var Footer_default = Footer2;
 
 // src/components/Input/components/Select/hooks/SelectMultiple/components/Header/index.tsx
-var import_react35 = __toESM(require("react"));
+var import_react37 = __toESM(require("react"));
 
 // src/components/Link/index.tsx
 var import_styled_components43 = __toESM(require("styled-components"));
 var import_jsx_runtime324 = require("react/jsx-runtime");
 var Container11 = import_styled_components43.default.div`
-  ${({ $size: size3 }) => {
-  const { fontSize, lineHeight } = sizes[size3 || "small"];
+  ${({ $size: size4 }) => {
+  const { fontSize, lineHeight } = sizes[size4 || "small"];
   return import_styled_components43.css`
       font-size: ${fontSize};
       line-height: ${lineHeight};
@@ -14126,12 +14203,12 @@ var Container11 = import_styled_components43.default.div`
         ` : null;
 }}
 `;
-var Link = ({ size: size3, colorSetting, disabled, ...props }) => {
+var Link = ({ size: size4, colorSetting, disabled, ...props }) => {
   return /* @__PURE__ */ (0, import_jsx_runtime324.jsx)(
     Container11,
     {
       ...props,
-      $size: size3,
+      $size: size4,
       $colorSetting: colorSetting,
       $disabled: disabled
     }
@@ -14202,7 +14279,7 @@ var CheckAll = () => {
 var Header3 = () => {
   const context = useContext3();
   if (!context.props.search) {
-    return /* @__PURE__ */ (0, import_jsx_runtime325.jsx)(import_react35.default.Fragment, {});
+    return /* @__PURE__ */ (0, import_jsx_runtime325.jsx)(import_react37.default.Fragment, {});
   }
   const {
     searchInput: [searchInput, setSearchInput],
@@ -14339,12 +14416,12 @@ var parseValue = (value) => {
 };
 var useSelectMultiple = (props, [highlight, setHighlight], [options, setOptions]) => {
   const initial = parseValue(props.value);
-  const [checked, setChecked] = (0, import_react36.useState)([
+  const [checked, setChecked] = (0, import_react38.useState)([
     ...initial
   ]);
   const limits = resolveLimits(props.minSelected, props.maxSelected);
   const { max, enabled } = limits;
-  (0, import_react36.useEffect)(() => {
+  (0, import_react38.useEffect)(() => {
     if (limits.error) {
       console.error(`[SelectMultiple]: ${limits.error}`);
     }
@@ -14384,7 +14461,7 @@ var useSelectMultiple = (props, [highlight, setHighlight], [options, setOptions]
     onReset,
     menu: {
       itemSpacing: void 0,
-      before: /* @__PURE__ */ (0, import_jsx_runtime327.jsxs)(import_react36.default.Fragment, { children: [
+      before: /* @__PURE__ */ (0, import_jsx_runtime327.jsxs)(import_react38.default.Fragment, { children: [
         /* @__PURE__ */ (0, import_jsx_runtime327.jsx)(Header_default2, {}),
         /* @__PURE__ */ (0, import_jsx_runtime327.jsx)(
           HiddenInput,
@@ -14439,12 +14516,12 @@ var SelectMultiple_default = useSelectMultiple;
 
 // src/components/Input/components/Select/index.tsx
 var import_jsx_runtime328 = require("react/jsx-runtime");
-var Select = import_react37.default.forwardRef(
+var Select = import_react39.default.forwardRef(
   (props, ref) => {
     const { position, loader: loader2, initialLoader } = props;
-    const [options, setOptions] = (0, import_react37.useState)(initialLoader || []);
-    const [highlight, setHighlight] = (0, import_react37.useState)(-1);
-    const [open, setOpen] = (0, import_react37.useState)(false);
+    const [options, setOptions] = (0, import_react39.useState)(initialLoader || []);
+    const [highlight, setHighlight] = (0, import_react39.useState)(-1);
+    const [open, setOpen] = (0, import_react39.useState)(false);
     const hook = props.type === "select-multiple" ? SelectMultiple_default : Select_default;
     const {
       parsedOptions,
@@ -14460,11 +14537,11 @@ var Select = import_react37.default.forwardRef(
       [options, setOptions],
       setOpen
     );
-    const [_loading, setLoading] = (0, import_react37.useState)(true);
-    const [search, _setSearch] = (0, import_react37.useState)("");
-    const [searchInput, setSearchInput] = (0, import_react37.useState)("");
-    const [page, setPage] = (0, import_react37.useState)(1);
-    const [lastPage, setLastPage] = (0, import_react37.useState)(false);
+    const [_loading, setLoading] = (0, import_react39.useState)(true);
+    const [search, _setSearch] = (0, import_react39.useState)("");
+    const [searchInput, setSearchInput] = (0, import_react39.useState)("");
+    const [page, setPage] = (0, import_react39.useState)(1);
+    const [lastPage, setLastPage] = (0, import_react39.useState)(false);
     const loading = props.loading || _loading;
     const setSearch = (value) => {
       _setSearch(value);
@@ -14497,7 +14574,7 @@ var Select = import_react37.default.forwardRef(
       }
       _onScrollEnd(e);
     };
-    const onSubmit = (0, import_react37.useCallback)(async () => {
+    const onSubmit = (0, import_react39.useCallback)(async () => {
       setLoading(true);
       const optionsResult = await loader2(search, page);
       if (optionsResult === null) return;
@@ -14513,22 +14590,22 @@ var Select = import_react37.default.forwardRef(
       setLastPage(lastPage2);
       setLoading(false);
     }, [loader2, search, page, initialLoader]);
-    (0, import_react37.useEffect)(() => {
+    (0, import_react39.useEffect)(() => {
       const timeoutId = setTimeout(() => onSubmit(), 250);
       return () => clearTimeout(timeoutId);
     }, [onSubmit]);
-    (0, import_react37.useEffect)(() => {
+    (0, import_react39.useEffect)(() => {
       if (open) return;
       setSearch("");
       onReset();
     }, [props.value, open]);
-    (0, import_react37.useEffect)(() => {
+    (0, import_react39.useEffect)(() => {
       setSearchInput(search);
     }, [search]);
-    (0, import_react37.useEffect)(() => {
+    (0, import_react39.useEffect)(() => {
       if (page === 1) setHighlight(-1);
     }, [page]);
-    (0, import_react37.useEffect)(() => {
+    (0, import_react39.useEffect)(() => {
       const timeoutId = setTimeout(() => setSearch(searchInput), 1e3);
       return () => clearTimeout(timeoutId);
     }, [searchInput]);
@@ -14544,7 +14621,7 @@ var Select = import_react37.default.forwardRef(
       /* @__PURE__ */ (0, import_jsx_runtime328.jsxs)(
         RelativeContainer7,
         {
-          ref: onClickOut_default(() => setOpen(false)),
+          ref: useOnClickOut_default(() => setOpen(false)),
           $width: props.width,
           children: [
             /* @__PURE__ */ (0, import_jsx_runtime328.jsx)(
@@ -14620,7 +14697,7 @@ Select.displayName = "Select";
 var Select_default2 = Select;
 
 // src/components/Input/components/Switch/index.tsx
-var import_react38 = __toESM(require("react"));
+var import_react40 = __toESM(require("react"));
 
 // src/components/Input/components/Switch/styles.ts
 var import_styled_components45 = __toESM(require("styled-components"));
@@ -14781,7 +14858,7 @@ var Switch = (props) => {
             $keepSpace: true,
             children: label[props.checked ? "after" : "before"]
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime329.jsxs)(import_react38.default.Fragment, { children: [
+        ) : /* @__PURE__ */ (0, import_jsx_runtime329.jsxs)(import_react40.default.Fragment, { children: [
           label.before && /* @__PURE__ */ (0, import_jsx_runtime329.jsx)(LabelContainer7, { children: label.before }),
           /* @__PURE__ */ (0, import_jsx_runtime329.jsx)("input", { ...htmlProps, type: "checkbox" }),
           /* @__PURE__ */ (0, import_jsx_runtime329.jsx)("span", {}),
@@ -14794,10 +14871,10 @@ var Switch = (props) => {
 var Switch_default = Switch;
 
 // src/components/Input/components/Tags/index.tsx
-var import_react40 = __toESM(require("react"));
+var import_react42 = __toESM(require("react"));
 
 // src/components/Input/components/Tags/components/Input/index.tsx
-var import_react39 = __toESM(require("react"));
+var import_react41 = __toESM(require("react"));
 
 // src/components/Input/components/Tags/components/Input/styles.ts
 var import_styled_components46 = __toESM(require("styled-components"));
@@ -14831,7 +14908,7 @@ var Input4 = import_styled_components46.default.input`
 
 // src/components/Input/components/Tags/components/Input/index.tsx
 var import_jsx_runtime330 = require("react/jsx-runtime");
-var Input5 = import_react39.default.forwardRef(
+var Input5 = import_react41.default.forwardRef(
   (props, ref) => {
     const [value, setValue] = props.value;
     const _onKeyDown = props.onKeyDown || (() => {
@@ -14988,10 +15065,10 @@ var TagContainer = import_styled_components49.default.div`
 
 // src/components/Input/components/Tags/index.tsx
 var import_jsx_runtime333 = require("react/jsx-runtime");
-var Tags = import_react40.default.forwardRef(
+var Tags = import_react42.default.forwardRef(
   (props, ref) => {
     const { value, setValue } = props;
-    const [inputValue, setInputValue] = props.input?.value ? props.input.value : (0, import_react40.useState)("");
+    const [inputValue, setInputValue] = props.input?.value ? props.input.value : (0, import_react42.useState)("");
     const paddingless = props.paddingless || false;
     const borderless = props.borderless || false;
     const maxTags = props.maxTags || Number.POSITIVE_INFINITY;
@@ -15059,7 +15136,7 @@ var Tags_default = Tags;
 
 // src/components/Input/index.tsx
 var import_jsx_runtime334 = require("react/jsx-runtime");
-var Component3 = import_react41.default.forwardRef(
+var Component3 = import_react43.default.forwardRef(
   (props, ref) => {
     switch (props.type) {
       case "date": {
@@ -15203,9 +15280,9 @@ var AppliedFiltersMenu = (props) => {
     close,
     appliedFilters: [appliedFilters, setAppliedFilters]
   } = props;
-  const [search, setSearch] = (0, import_react42.useState)("");
-  const [searched, setSearched] = (0, import_react42.useState)("");
-  (0, import_react42.useEffect)(() => {
+  const [search, setSearch] = (0, import_react44.useState)("");
+  const [searched, setSearched] = (0, import_react44.useState)("");
+  (0, import_react44.useEffect)(() => {
     setSearch("");
     setSearched("");
   }, [open]);
@@ -15328,13 +15405,13 @@ var AppliedFilters = Object.assign(
 var AppliedFilters_default = AppliedFilters;
 
 // src/components/Filters/Filters/components/Menu/index.tsx
-var import_react45 = require("react");
+var import_react47 = require("react");
 
 // src/components/Filters/Filters/components/Submenu/index.tsx
-var import_react44 = __toESM(require("react"));
+var import_react46 = __toESM(require("react"));
 
 // src/components/Filters/Filters/components/Submenu/components/Header/index.tsx
-var import_react43 = require("react");
+var import_react45 = require("react");
 
 // src/components/Filters/Filters/components/Submenu/components/Header/styles.ts
 var import_styled_components51 = __toESM(require("styled-components"));
@@ -15368,12 +15445,12 @@ var Header5 = (props) => {
     allowEmptySearch,
     withSearch
   } = props;
-  const [search, setSearch] = (0, import_react43.useState)("");
+  const [search, setSearch] = (0, import_react45.useState)("");
   const setSearched = allowEmptySearch ? _setSearched : (value) => {
     if (value === "") return;
     _setSearched(value);
   };
-  (0, import_react43.useEffect)(() => {
+  (0, import_react45.useEffect)(() => {
     setSearch(searched);
   }, [searched]);
   const onSubmit = () => {
@@ -15485,13 +15562,13 @@ var getInstance = (props) => {
 var Submenu = (props) => {
   const { item, close, setAppliedFilters, closeParent } = props;
   const { open, isDynamic, itemSpacing, label, allowEmptySearch, getOptions: getOptions3 } = getInstance(props);
-  const [options, setOptions] = (0, import_react44.useState)([]);
-  const [page, setPage] = (0, import_react44.useState)(1);
-  const [search, _setSearch] = (0, import_react44.useState)("");
-  const [lastPage, setLastPage] = (0, import_react44.useState)(false);
-  const [loading, setLoading] = (0, import_react44.useState)(false);
-  const [, setFirstRender] = (0, import_react44.useState)(true);
-  const onSearch = (0, import_react44.useCallback)(async () => {
+  const [options, setOptions] = (0, import_react46.useState)([]);
+  const [page, setPage] = (0, import_react46.useState)(1);
+  const [search, _setSearch] = (0, import_react46.useState)("");
+  const [lastPage, setLastPage] = (0, import_react46.useState)(false);
+  const [loading, setLoading] = (0, import_react46.useState)(false);
+  const [, setFirstRender] = (0, import_react46.useState)(true);
+  const onSearch = (0, import_react46.useCallback)(async () => {
     const { options: newOptions, lastPage: lastPage2 } = await getOptions3(search, page);
     setLastPage(lastPage2);
     setOptions([...newOptions]);
@@ -15506,12 +15583,12 @@ var Submenu = (props) => {
       onSearch();
     }
   };
-  (0, import_react44.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     setOptions([]);
     setSearch("", false);
     setFirstRender(true);
   }, [item]);
-  (0, import_react44.useEffect)(() => {
+  (0, import_react46.useEffect)(() => {
     setFirstRender((firstRender) => {
       if (!item || isDynamic && firstRender) {
         setLoading(false);
@@ -15592,9 +15669,9 @@ var Submenu = (props) => {
       loading,
       emptyContent: isDynamic && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime338.jsx)(EmptyMessage, { children: (() => {
         if (search !== "") {
-          return /* @__PURE__ */ (0, import_jsx_runtime338.jsx)(import_react44.default.Fragment, { children: "Nenhum resultado foi encontrado" });
+          return /* @__PURE__ */ (0, import_jsx_runtime338.jsx)(import_react46.default.Fragment, { children: "Nenhum resultado foi encontrado" });
         }
-        return /* @__PURE__ */ (0, import_jsx_runtime338.jsxs)(import_react44.default.Fragment, { children: [
+        return /* @__PURE__ */ (0, import_jsx_runtime338.jsxs)(import_react46.default.Fragment, { children: [
           "Utilize a busca para pesquisar por ",
           /* @__PURE__ */ (0, import_jsx_runtime338.jsx)("br", {}),
           label.text
@@ -15615,7 +15692,7 @@ var Submenu_default = Submenu;
 var import_jsx_runtime339 = require("react/jsx-runtime");
 var FiltersMenu = (props) => {
   const { open, close } = props;
-  const [active, setActive] = (0, import_react45.useState)(-1);
+  const [active, setActive] = (0, import_react47.useState)(-1);
   const items = props.items.map((item) => {
     return {
       label: typeof item.label === "string" ? item.label : item.label.element,
@@ -15629,7 +15706,7 @@ var FiltersMenu = (props) => {
     };
   });
   const selected = active >= 0 && active < props.items.length ? props.items[active] : void 0;
-  (0, import_react45.useEffect)(() => {
+  (0, import_react47.useEffect)(() => {
     if (open) return;
     setActive(-1);
   }, [open]);
@@ -15705,14 +15782,14 @@ var Filters = Object.assign(
 var Filters_default = Filters;
 
 // src/components/Grid/components/Col/index.tsx
-var import_react47 = __toESM(require("react"));
+var import_react49 = __toESM(require("react"));
 
 // src/components/Grid/components/Row/context.ts
-var import_react46 = __toESM(require("react"));
-var Provider5 = import_react46.default.createContext({
+var import_react48 = __toESM(require("react"));
+var Provider5 = import_react48.default.createContext({
   cols: {}
 });
-var useContext4 = () => import_react46.default.useContext(Provider5);
+var useContext4 = () => import_react48.default.useContext(Provider5);
 var context_default4 = Provider5;
 
 // src/components/Grid/components/Col/styles.ts
@@ -15885,7 +15962,7 @@ var Col = import_styled_components53.default.div`
 
 // src/components/Grid/components/Col/index.tsx
 var import_jsx_runtime341 = require("react/jsx-runtime");
-var Col2 = import_react47.default.forwardRef((props, ref) => {
+var Col2 = import_react49.default.forwardRef((props, ref) => {
   const context = useContext4();
   const colProps = { ...context.cols, ...props };
   const htmlProps = filterObject(colProps, [
@@ -15922,15 +15999,15 @@ Col2.displayName = "Col";
 var Col_default = Col2;
 
 // src/components/Grid/components/Grid/index.tsx
-var import_react49 = __toESM(require("react"));
+var import_react51 = __toESM(require("react"));
 
 // src/components/Grid/components/Grid/context.ts
-var import_react48 = __toESM(require("react"));
-var Provider6 = import_react48.default.createContext({
+var import_react50 = __toESM(require("react"));
+var Provider6 = import_react50.default.createContext({
   rows: {},
   cols: {}
 });
-var useContext5 = () => import_react48.default.useContext(Provider6);
+var useContext5 = () => import_react50.default.useContext(Provider6);
 var context_default5 = Provider6;
 
 // src/components/Grid/components/Grid/styles.ts
@@ -15963,7 +16040,7 @@ var Grid = import_styled_components54.default.div`
 
 // src/components/Grid/components/Grid/index.tsx
 var import_jsx_runtime342 = require("react/jsx-runtime");
-var Grid2 = import_react49.default.forwardRef((props, ref) => {
+var Grid2 = import_react51.default.forwardRef((props, ref) => {
   const cols = props.cols || {};
   const rows = props.rows || {};
   const gridProps = filterObject(props, [
@@ -15986,7 +16063,7 @@ Grid2.displayName = "Grid";
 var Grid_default2 = Grid2;
 
 // src/components/Grid/components/Row/index.tsx
-var import_react50 = __toESM(require("react"));
+var import_react52 = __toESM(require("react"));
 
 // src/components/Grid/components/Row/styles.ts
 var import_styled_components55 = __toESM(require("styled-components"));
@@ -16113,7 +16190,7 @@ var Row = import_styled_components55.default.div`
 
 // src/components/Grid/components/Row/index.tsx
 var import_jsx_runtime343 = require("react/jsx-runtime");
-var Row2 = import_react50.default.forwardRef((props, ref) => {
+var Row2 = import_react52.default.forwardRef((props, ref) => {
   const context = useContext5();
   const cols = { ...context.cols, ...props.cols || {} };
   const rowProps = { ...props, ...context.rows };
@@ -16157,15 +16234,15 @@ var Grid3 = Object.assign(Grid_default2, {
 var Grid_default3 = Grid3;
 
 // src/components/Modal/component.tsx
-var import_react52 = require("react");
+var import_react54 = require("react");
 
 // src/addons/Portal/index.ts
-var import_react51 = require("react");
+var import_react53 = require("react");
 var import_react_dom = require("react-dom");
 var Portal = (props) => {
   const { id, opened, children } = props;
   const portalRoot = document.createElement("div");
-  (0, import_react51.useEffect)(() => {
+  (0, import_react53.useEffect)(() => {
     if (opened) {
       portalRoot.id = id + "-root";
       document.body.appendChild(portalRoot);
@@ -16258,7 +16335,7 @@ var Container14 = import_styled_components56.default.div`
 
   ${({
   theme: theme4,
-  $size: size3,
+  $size: size4,
   $customSize: customSize,
   $color: color,
   $inverted: inverted
@@ -16266,9 +16343,9 @@ var Container14 = import_styled_components56.default.div`
     background-color: ${theme4.colors.white};
     box-shadow: 0 0 21px 7px ${theme4.getColor("black", 15)};
 
-    width: ${size3 === "custom" && customSize ? customSize.width || "auto" : widths[size3]};
+    width: ${size4 === "custom" && customSize ? customSize.width || "auto" : widths[size4]};
 
-    height: ${size3 === "custom" && customSize ? customSize.height || "auto" : heights[size3]};
+    height: ${size4 === "custom" && customSize ? customSize.height || "auto" : heights[size4]};
 
     ${Header6} {
       background-color: ${inverted ? theme4.isDarkColor(color) : theme4.colors[color]};
@@ -16283,7 +16360,7 @@ var Modal = (props) => {
   const {
     openState,
     title,
-    size: size3,
+    size: size4,
     color,
     inverted,
     children,
@@ -16301,7 +16378,7 @@ var Modal = (props) => {
       setOpen(false);
     }
   };
-  (0, import_react52.useEffect)(() => {
+  (0, import_react54.useEffect)(() => {
     const onEscDown = (event) => {
       if (closeOnEsc && event.key === "Escape") {
         event.preventDefault();
@@ -16313,11 +16390,11 @@ var Modal = (props) => {
       document.removeEventListener("keydown", onEscDown);
     };
   }, []);
-  const _size = size3 ? heights[size3] : heights.default;
+  const _size = size4 ? heights[size4] : heights.default;
   return /* @__PURE__ */ (0, import_jsx_runtime344.jsx)(Portal_default, { opened: open || false, id: "modal", children: /* @__PURE__ */ (0, import_jsx_runtime344.jsx)(Background, { onClick: onClickOutside, children: /* @__PURE__ */ (0, import_jsx_runtime344.jsxs)(
     Container14,
     {
-      $size: size3 || "small",
+      $size: size4 || "small",
       $color: color || "blue",
       $inverted: inverted,
       $customSize: customSize,
@@ -16503,7 +16580,7 @@ var Modal2 = Object.assign(component_default, {
 var Modal_default = Modal2;
 
 // src/components/Placeholder/components/Template1/index.tsx
-var import_react53 = __toESM(require("react"));
+var import_react55 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template1/styles.ts
 var import_styled_components60 = __toESM(require("styled-components"));
@@ -16539,19 +16616,19 @@ var HeaderLine = import_styled_components60.default.div`
     margin-top: 14px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components60.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components60.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components60.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components60.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components60.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components60.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components60.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components60.css`
       width: 75%;
     `}
 `;
@@ -16563,7 +16640,7 @@ var MainLine = (0, import_styled_components60.default)(HeaderLine)`
 // src/components/Placeholder/components/Template1/index.tsx
 var import_jsx_runtime348 = require("react/jsx-runtime");
 var Template1 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime348.jsx)(import_react53.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime348.jsx)(import_react55.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime348.jsxs)(Container15, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime348.jsxs)(Header7, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime348.jsx)(HeaderImage, {}),
@@ -16584,7 +16661,7 @@ var Template1 = (props) => {
 var Template1_default = Template1;
 
 // src/components/Placeholder/components/Template2/index.tsx
-var import_react54 = __toESM(require("react"));
+var import_react56 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template2/styles.ts
 var import_styled_components62 = __toESM(require("styled-components"));
@@ -16600,19 +16677,19 @@ var HeaderLine2 = import_styled_components61.default.div`
     margin-top: 14px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components61.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components61.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components61.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components61.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components61.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components61.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components61.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components61.css`
       width: 75%;
     `}
 `;
@@ -16654,7 +16731,7 @@ var HeaderLine3 = (0, import_styled_components62.default)(HeaderLine2)``;
 // src/components/Placeholder/components/Template2/index.tsx
 var import_jsx_runtime349 = require("react/jsx-runtime");
 var Template2 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime349.jsx)(import_react54.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime349.jsx)(import_react56.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime349.jsxs)(Template2Container, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime349.jsxs)(Header8, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime349.jsx)(HeaderImage2, {}),
@@ -16672,7 +16749,7 @@ var Template2 = (props) => {
 var Template2_default = Template2;
 
 // src/components/Placeholder/components/Template3/index.tsx
-var import_react55 = __toESM(require("react"));
+var import_react57 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template3/styles.ts
 var import_styled_components63 = __toESM(require("styled-components"));
@@ -16691,7 +16768,7 @@ var Template3Line = (0, import_styled_components63.default)(HeaderLine2)`
 // src/components/Placeholder/components/Template3/index.tsx
 var import_jsx_runtime350 = require("react/jsx-runtime");
 var Template3 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime350.jsx)(import_react55.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime350.jsx)(import_react57.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime350.jsxs)(Template3Container, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime350.jsx)(Template3Line, { $size: "large", $height: "7px", $color: "#DADADA" }),
     /* @__PURE__ */ (0, import_jsx_runtime350.jsx)(Template3Line, { $size: "small", $height: "7px", $color: "#DADADA" }),
@@ -16703,7 +16780,7 @@ var Template3 = (props) => {
 var Template3_default = Template3;
 
 // src/components/Placeholder/components/Template4/index.tsx
-var import_react56 = __toESM(require("react"));
+var import_react58 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template4/styles.ts
 var import_styled_components64 = __toESM(require("styled-components"));
@@ -16722,19 +16799,19 @@ var HeaderLine4 = import_styled_components64.default.div`
     margin-top: 14px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components64.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components64.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components64.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components64.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components64.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components64.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components64.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components64.css`
       width: 75%;
     `}
 `;
@@ -16751,7 +16828,7 @@ var CustomLine = (0, import_styled_components64.default)(HeaderLine4)`
 // src/components/Placeholder/components/Template4/index.tsx
 var import_jsx_runtime351 = require("react/jsx-runtime");
 var Template4 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime351.jsx)(import_react56.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime351.jsx)(import_react58.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime351.jsxs)(Template4Container, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime351.jsx)(
       CustomLine,
@@ -16830,7 +16907,7 @@ var Template4 = (props) => {
 var Template4_default = Template4;
 
 // src/components/Placeholder/components/Template5/index.tsx
-var import_react57 = __toESM(require("react"));
+var import_react59 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template5/styles.ts
 var import_styled_components65 = __toESM(require("styled-components"));
@@ -16860,19 +16937,19 @@ var HeaderLine5 = import_styled_components65.default.div`
     margin-top: 14px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components65.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components65.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components65.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components65.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components65.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components65.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components65.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components65.css`
       width: 75%;
     `}
 `;
@@ -16889,7 +16966,7 @@ var MainContent3 = import_styled_components65.default.div`
 // src/components/Placeholder/components/Template5/index.tsx
 var import_jsx_runtime352 = require("react/jsx-runtime");
 var Template5 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime352.jsx)(import_react57.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime352.jsx)(import_react59.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime352.jsxs)(Container19, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime352.jsx)(Circle, {}),
     /* @__PURE__ */ (0, import_jsx_runtime352.jsxs)(MainContent3, { children: [
@@ -16935,7 +17012,7 @@ var Template5 = (props) => {
 var Template5_default = Template5;
 
 // src/components/Placeholder/components/Template6/index.tsx
-var import_react58 = __toESM(require("react"));
+var import_react60 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template6/styles.ts
 var import_styled_components66 = __toESM(require("styled-components"));
@@ -16971,15 +17048,15 @@ var HeaderLine6 = import_styled_components66.default.div`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components66.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components66.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components66.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components66.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components66.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components66.css`
       width: 75%;
     `}
 `;
@@ -16993,7 +17070,7 @@ var CustomLine3 = (0, import_styled_components66.default)(HeaderLine6)`
 // src/components/Placeholder/components/Template6/index.tsx
 var import_jsx_runtime353 = require("react/jsx-runtime");
 var Template6 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(import_react58.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(import_react60.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(Container20, { children: /* @__PURE__ */ (0, import_jsx_runtime353.jsxs)(Header9, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime353.jsx)(
       CustomLine3,
@@ -17027,7 +17104,7 @@ var Template6 = (props) => {
 var Template6_default = Template6;
 
 // src/components/Placeholder/components/Template7/index.tsx
-var import_react59 = __toESM(require("react"));
+var import_react61 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template7/styles.ts
 var import_styled_components67 = __toESM(require("styled-components"));
@@ -17055,19 +17132,19 @@ var HeaderLine7 = import_styled_components67.default.div`
     margin-top: 14px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components67.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components67.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components67.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components67.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components67.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components67.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components67.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components67.css`
       width: 75%;
     `}
 `;
@@ -17095,7 +17172,7 @@ var Circle2 = import_styled_components67.default.div`
 // src/components/Placeholder/components/Template7/index.tsx
 var import_jsx_runtime354 = require("react/jsx-runtime");
 var Template7 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(import_react59.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(import_react61.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime354.jsxs)(Container21, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(Header10, { children: /* @__PURE__ */ (0, import_jsx_runtime354.jsx)(
       CustomLine4,
@@ -17118,7 +17195,7 @@ var Template7 = (props) => {
 var Template7_default = Template7;
 
 // src/components/Placeholder/components/Template8/index.tsx
-var import_react60 = __toESM(require("react"));
+var import_react62 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template8/styles.ts
 var import_styled_components68 = __toESM(require("styled-components"));
@@ -17146,19 +17223,19 @@ var HeaderLine8 = import_styled_components68.default.div`
     margin-top: 14px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components68.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components68.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components68.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components68.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components68.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components68.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components68.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components68.css`
       width: 75%;
     `}
 `;
@@ -17179,7 +17256,7 @@ var Main4 = import_styled_components68.default.div`
 // src/components/Placeholder/components/Template8/index.tsx
 var import_jsx_runtime355 = require("react/jsx-runtime");
 var Template8 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(import_react60.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(import_react62.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime355.jsxs)(Container22, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(Header11, { children: /* @__PURE__ */ (0, import_jsx_runtime355.jsx)(
       CustomLine5,
@@ -17215,7 +17292,7 @@ var Template8 = (props) => {
 var Template8_default = Template8;
 
 // src/components/Placeholder/components/Template9/index.tsx
-var import_react61 = __toESM(require("react"));
+var import_react63 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template9/styles.ts
 var import_styled_components69 = __toESM(require("styled-components"));
@@ -17243,19 +17320,19 @@ var HeaderLine9 = import_styled_components69.default.div`
     margin-top: 7px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components69.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components69.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components69.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components69.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components69.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components69.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components69.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components69.css`
       width: 75%;
     `}
 `;
@@ -17283,7 +17360,7 @@ var Circle3 = import_styled_components69.default.div`
 // src/components/Placeholder/components/Template9/index.tsx
 var import_jsx_runtime356 = require("react/jsx-runtime");
 var Template82 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime356.jsx)(import_react61.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime356.jsx)(import_react63.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime356.jsxs)(Container23, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime356.jsxs)(Header12, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime356.jsx)(
@@ -17311,7 +17388,7 @@ var Template82 = (props) => {
 var Template9_default = Template82;
 
 // src/components/Placeholder/components/Template10/index.tsx
-var import_react62 = __toESM(require("react"));
+var import_react64 = __toESM(require("react"));
 
 // src/components/Placeholder/components/Template10/styles.ts
 var import_styled_components70 = __toESM(require("styled-components"));
@@ -17339,19 +17416,19 @@ var HeaderLine10 = import_styled_components70.default.div`
     margin-top: 7px;
   }
 
-  ${({ $size: size3 }) => size3 === "mini" && import_styled_components70.css`
+  ${({ $size: size4 }) => size4 === "mini" && import_styled_components70.css`
       width: 15%;
     `}
 
-  ${({ $size: size3 }) => size3 === "small" && import_styled_components70.css`
+  ${({ $size: size4 }) => size4 === "small" && import_styled_components70.css`
       width: 25%;
     `}
 
-  ${({ $size: size3 }) => size3 === "medium" && import_styled_components70.css`
+  ${({ $size: size4 }) => size4 === "medium" && import_styled_components70.css`
       width: 45%;
     `}
 
-  ${({ $size: size3 }) => size3 === "large" && import_styled_components70.css`
+  ${({ $size: size4 }) => size4 === "large" && import_styled_components70.css`
       width: 75%;
     `}
 `;
@@ -17383,7 +17460,7 @@ var Circle4 = import_styled_components70.default.div`
 // src/components/Placeholder/components/Template10/index.tsx
 var import_jsx_runtime357 = require("react/jsx-runtime");
 var Template10 = (props) => {
-  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime357.jsx)(import_react62.default.Fragment, {});
+  if (!props.loading) return /* @__PURE__ */ (0, import_jsx_runtime357.jsx)(import_react64.default.Fragment, {});
   return /* @__PURE__ */ (0, import_jsx_runtime357.jsxs)(Container24, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime357.jsxs)(Header13, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime357.jsx)(
@@ -17596,95 +17673,1899 @@ var ProgressBar = ({ type, value, ...props }) => {
 };
 var ProgressBar_default = ProgressBar;
 
-// src/components/Signature/index.tsx
-var import_react63 = require("react");
-var import_react_signature_canvas = __toESM(require("react-signature-canvas"));
-
-// src/components/Signature/styles.ts
-var import_styled_components72 = __toESM(require("styled-components"));
-var Container26 = import_styled_components72.default.div`
-  width: 100%;
-  height: 100%;
-
-  display: flex;
-  flex-direction: column;
-  gap: ${({ theme: theme4 }) => theme4.spacings.s3};
-`;
-var CanvasContainer = import_styled_components72.default.div`
-  position: relative;
-  flex: 1;
-  overflow: hidden;
-  background-color: ${({ theme: theme4, $invalid: invalid }) => invalid ? theme4.getColor("warningRed", 5) : theme4.colors.white};
-
-  &[data-placeholder]:before {
-    content: attr(data-placeholder);
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    transform: translate(-50%, -50%);
-
-    color: ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "darkBlue"]};
+// src/components/Select/index.tsx
+var import_react79 = __toESM(require("react"));
+var import_react80 = require("@floating-ui/react");
 
-    ${({ theme: theme4 }) => theme4.useTypography("h1")}
-    font-size: 59px;
-    line-height: 71px;
-    opacity: 0.1;
-    z-index: 1;
-  }
+// src/components/Select/hooks/useAsyncOptions/index.ts
+var import_react65 = require("react");
 
-  canvas {
-    position: relative;
-    display: block;
-    width: 100%;
-    height: 100%;
-    box-sizing: border-box;
-    border: 1px solid
-      ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "lightGrey"]};
-    border-radius: 4px;
-    z-index: 2;
-  }
+// src/components/Select/constants.ts
+var SEARCH_DEBOUNCE_MS = 500;
+var MENU_EXIT_MS = 250;
 
-  /* icons container */
-  > div:nth-child(1) {
-    position: absolute;
-    top: ${({ theme: theme4 }) => theme4.spacings.s3};
-    right: ${({ theme: theme4 }) => theme4.spacings.s3};
-    display: flex;
-    gap: ${({ theme: theme4 }) => theme4.spacings.s1};
-    z-index: 3;
+// src/components/Select/hooks/useAsyncOptions/index.ts
+var useAsyncOptions = (loader2) => {
+  const [options, setOptions] = (0, import_react65.useState)([]);
+  const [pagination, setPagination] = (0, import_react65.useState)({
+    page: 1,
+    last: false,
+    fetched: null
+  });
+  const cursor = (0, import_react65.useMemo)(
+    () => options.length > 0 ? options[options.length - 1] : null,
+    [options]
+  );
+  const {
+    current: [searchInput, setSearchInput],
+    debounced: [search]
+  } = useDebouncedState_default(
+    "",
+    () => {
+      setOptions([]);
+      setPagination({
+        page: 1,
+        last: true,
+        fetched: null
+      });
+    },
+    SEARCH_DEBOUNCE_MS
+  );
+  const loadOptions = (0, import_react65.useCallback)(async () => {
+    if (pagination.fetched !== null) return;
+    try {
+      const result = await loader2(search, pagination.page, cursor);
+      if (result === null) return;
+      setOptions(
+        pagination.page === 1 ? result.options : (prev) => [...prev, ...result.options]
+      );
+      setPagination((prev) => ({
+        ...prev,
+        fetched: /* @__PURE__ */ new Date(),
+        last: result.last
+      }));
+    } catch (e) {
+      setPagination((prev) => ({ ...prev, fetched: /* @__PURE__ */ new Date(), last: true }));
+    }
+  }, [loader2, search, pagination.page, pagination.fetched, cursor]);
+  const paginate2 = () => setPagination(
+    (prev) => prev.last ? prev : {
+      page: prev.page + 1,
+      last: true,
+      fetched: null
+    }
+  );
+  (0, import_react65.useEffect)(() => {
+    loadOptions();
+  }, [loadOptions]);
+  return {
+    options,
+    loading: pagination.fetched === null,
+    paginate: paginate2,
+    searchInput: [searchInput, setSearchInput]
+  };
+};
+var useAsyncOptions_default = useAsyncOptions;
 
-    > button {
-      padding: 0;
-      outline: none;
-      border: none;
-      background: none;
+// src/components/Select/hooks/useFloatingMenu/index.ts
+var import_react66 = require("@floating-ui/react");
+var useFloatingMenu = ({ open, onOpenChange }) => {
+  const floating = (0, import_react66.useFloating)({
+    open,
+    onOpenChange,
+    placement: "bottom-start",
+    whileElementsMounted: import_react66.autoUpdate,
+    middleware: [
+      (0, import_react66.flip)(),
+      (0, import_react66.size)({
+        apply({ rects, elements }) {
+          Object.assign(elements.floating.style, {
+            minWidth: `${rects.reference.width}px`
+          });
+        }
+      })
+    ]
+  });
+  const transition = (0, import_react66.useTransitionStatus)(floating.context, {
+    duration: MENU_EXIT_MS
+  });
+  const dismiss = (0, import_react66.useDismiss)(floating.context, {
+    outsidePressEvent: "mousedown",
+    escapeKey: true
+  });
+  const interactions = (0, import_react66.useInteractions)([dismiss]);
+  return {
+    floating,
+    transition,
+    interactions
+  };
+};
+var useFloatingMenu_default = useFloatingMenu;
 
-      > i.icon,
-      > i.icon:before {
-        color: #4e4e4e;
-        font-size: 20px;
-        line-height: 20px;
-        width: 20px;
+// src/components/Select/hooks/useListNavigation/index.ts
+var import_react67 = require("react");
+var INVALID_INDEX = -1;
+var useActiveIndex = (itemCount, scrollToIndex) => {
+  const [activeIndex, setActiveIndex] = (0, import_react67.useState)(INVALID_INDEX);
+  (0, import_react67.useEffect)(() => {
+    setActiveIndex((current) => {
+      if (current >= itemCount) return INVALID_INDEX;
+      return current;
+    });
+  }, [itemCount]);
+  const setActiveIndexMiddleware = (activeIndex2, scroll = true) => {
+    setActiveIndex(activeIndex2);
+    if (activeIndex2 < 0 || !scroll) return;
+    scrollToIndex?.(activeIndex2);
+  };
+  return [activeIndex, setActiveIndexMiddleware];
+};
+var useListNavigation = ({
+  itemCount,
+  isItemDisabled,
+  onSelect,
+  scrollToIndex
+}) => {
+  const [activeIndex, setActiveIndex] = useActiveIndex(itemCount, scrollToIndex);
+  const firstEnabledIndex = (0, import_react67.useMemo)(() => {
+    for (let index = 0; index < itemCount; index += 1) {
+      if (!isItemDisabled(index)) return index;
+    }
+    return INVALID_INDEX;
+  }, [isItemDisabled, itemCount]);
+  const lastEnabledIndex = (0, import_react67.useMemo)(() => {
+    for (let index = itemCount - 1; index >= 0; index -= 1) {
+      if (!isItemDisabled(index)) return index;
+    }
+    return INVALID_INDEX;
+  }, [isItemDisabled, itemCount]);
+  const findNextEnabled = (0, import_react67.useCallback)(
+    (from, direction) => {
+      let index = from;
+      while (index >= 0 && index < itemCount) {
+        if (!isItemDisabled(index)) return index;
+        index += direction;
       }
-
-      &:not(:disabled) {
-        cursor: pointer;
+      return INVALID_INDEX;
+    },
+    [isItemDisabled, itemCount]
+  );
+  const onKeyDown = (0, import_react67.useCallback)(
+    (event) => {
+      if (event.key === "ArrowDown") {
+        event.preventDefault();
+        const from = activeIndex < 0 ? 0 : activeIndex + 1;
+        const next = findNextEnabled(from, 1);
+        if (next >= 0) setActiveIndex(next);
+        return;
       }
-      &:disabled {
-        opacity: 0.5;
+      if (event.key === "ArrowUp") {
+        event.preventDefault();
+        const from = activeIndex < 0 ? itemCount - 1 : activeIndex - 1;
+        const next = findNextEnabled(from, -1);
+        if (next >= 0) setActiveIndex(next);
+        return;
       }
-
-      transition: opacity 0.25s linear;
-    }
-  }
-`;
-
-// src/components/Signature/index.tsx
-var import_jsx_runtime360 = require("react/jsx-runtime");
-var FONTS = [
-  "GreatVibes",
-  "Pacifico",
-  "Allura"
+      if (event.key === "Home") {
+        event.preventDefault();
+        if (firstEnabledIndex >= 0) setActiveIndex(firstEnabledIndex);
+        return;
+      }
+      if (event.key === "End") {
+        event.preventDefault();
+        if (lastEnabledIndex >= 0) setActiveIndex(lastEnabledIndex);
+        return;
+      }
+      if ((event.key === "Enter" || event.key === " ") && activeIndex >= 0) {
+        event.preventDefault();
+        if (!isItemDisabled(activeIndex)) {
+          onSelect(activeIndex);
+        }
+      }
+    },
+    [
+      activeIndex,
+      findNextEnabled,
+      firstEnabledIndex,
+      isItemDisabled,
+      itemCount,
+      lastEnabledIndex,
+      onSelect
+    ]
+  );
+  const onMouseEnter = (index) => setActiveIndex(index, false);
+  return {
+    activeIndex,
+    onMouseEnter,
+    onKeyDown
+  };
+};
+var useListNavigation_default = useListNavigation;
+
+// src/components/Select/hooks/useRuleIndex/index.ts
+var import_react68 = require("react");
+var useRuleIndex = ({
+  options,
+  getKey,
+  rules
+}) => {
+  const failedRuleByKey = (0, import_react68.useMemo)(() => {
+    const failedRuleByKey2 = /* @__PURE__ */ new Map();
+    options.forEach((option) => {
+      const key = getKey(option);
+      const failedRule = rules?.find((rule) => !rule.allow(option));
+      if (failedRule) {
+        failedRuleByKey2.set(key, failedRule);
+      }
+    });
+    return failedRuleByKey2;
+  }, [getKey, options, rules]);
+  const getFailedRuleByKey = (0, import_react68.useCallback)(
+    (key) => {
+      return failedRuleByKey.get(key);
+    },
+    [failedRuleByKey]
+  );
+  return {
+    getFailedRuleByKey,
+    enabledCount: options.length - failedRuleByKey.size
+  };
+};
+var useRuleIndex_default = useRuleIndex;
+
+// src/components/Select/hooks/useVirtualizedOptions/index.ts
+var import_react69 = require("react");
+var import_react_virtual = require("@tanstack/react-virtual");
+var useVirtualizedOptions = (params) => {
+  const { optionsLength, loading, onPaginate, overscan = 2 } = params;
+  const estimateSize = (0, import_react69.useMemo)(() => {
+    const estimateSize2 = params.estimateSize;
+    if (estimateSize2 === void 0) {
+      return () => 46;
+    }
+    if (typeof estimateSize2 === "function") {
+      return estimateSize2;
+    }
+    return () => estimateSize2;
+  }, [params.estimateSize]);
+  const listRef = (0, import_react69.useRef)(null);
+  const searchRef = (0, import_react69.useRef)(null);
+  const rowVirtualizer = (0, import_react_virtual.useVirtualizer)({
+    count: optionsLength,
+    getScrollElement: () => listRef.current,
+    estimateSize,
+    overscan
+  });
+  const virtualItems = rowVirtualizer.getVirtualItems();
+  (0, import_react69.useEffect)(() => {
+    searchRef.current?.focus();
+  }, [searchRef.current]);
+  const endIndex = (0, import_react69.useMemo)(
+    () => virtualItems[virtualItems.length - 1]?.index ?? 0,
+    [virtualItems]
+  );
+  (0, import_react69.useEffect)(() => {
+    if (loading || optionsLength < 1) return;
+    if (endIndex >= optionsLength - 1 - overscan) {
+      onPaginate();
+    }
+  }, [loading, endIndex, optionsLength, overscan, onPaginate]);
+  return {
+    listRef,
+    searchRef,
+    rowVirtualizer,
+    virtualItems
+  };
+};
+var useVirtualizedOptions_default = useVirtualizedOptions;
+
+// src/components/Select/instances/multi/index.tsx
+var import_react77 = __toESM(require("react"));
+
+// src/components/Select/components/Apply/index.tsx
+var import_react74 = require("react");
+
+// src/components/Popup/index.tsx
+var import_react72 = __toESM(require("react"));
+var import_react73 = require("@floating-ui/react");
+
+// src/components/Popup/hooks/fallbackPlacements/index.ts
+var import_react70 = require("react");
+var FALLBACK_PLACEMENTS = {
+  top: ["top-start", "top-end", "bottom", "right", "left"],
+  "top-start": ["top", "top-end", "right-start", "left-start", "bottom-start"],
+  "top-end": ["top", "top-start", "right-end", "left-end", "bottom-end"],
+  right: ["right-start", "right-end", "bottom", "top", "left"],
+  "right-start": [
+    "right",
+    "right-end",
+    "bottom-start",
+    "top-start",
+    "left-start"
+  ],
+  "right-end": ["right", "right-start", "bottom-end", "top-end", "left-end"],
+  bottom: ["bottom-start", "bottom-end", "top", "right", "left"],
+  "bottom-start": [
+    "bottom",
+    "bottom-end",
+    "right-start",
+    "left-start",
+    "top-start"
+  ],
+  "bottom-end": ["bottom", "bottom-start", "right-end", "left-end", "top-end"],
+  left: ["left-start", "left-end", "bottom", "top", "right"],
+  "left-start": [
+    "left",
+    "left-end",
+    "bottom-start",
+    "top-start",
+    "right-start"
+  ],
+  "left-end": ["left", "left-start", "bottom-end", "top-end", "right-end"]
+};
+var useFallbackPlacements = (props) => {
+  const { placement, fallbackPlacements } = props;
+  const fallbackList = (0, import_react70.useMemo)(() => {
+    if (fallbackPlacements && fallbackPlacements.length > 0) {
+      return fallbackPlacements;
+    }
+    return FALLBACK_PLACEMENTS[placement];
+  }, [fallbackPlacements, placement]);
+  return fallbackList;
+};
+var fallbackPlacements_default = useFallbackPlacements;
+
+// src/components/Popup/hooks/open/index.ts
+var import_react71 = require("react");
+var useOpen = (props) => {
+  const [uncontrolledOpen, setUncontrolledOpen] = (0, import_react71.useState)(false);
+  const isControlled = props.open !== void 0;
+  const open = isControlled ? props.open : uncontrolledOpen;
+  const setOpen = (nextOpen) => {
+    if (isControlled) {
+      props.setOpen?.(nextOpen);
+      return;
+    }
+    setUncontrolledOpen(nextOpen);
+  };
+  return [open, setOpen];
+};
+var open_default = useOpen;
+
+// src/components/Popup/styles.ts
+var import_styled_components72 = __toESM(require("styled-components"));
+var TooltipArrow = import_styled_components72.default.div`
+  position: absolute;
+  width: 0;
+  height: 0;
+  pointer-events: none;
+
+  ${({ $arrow: arrow2, $placement: placement }) => {
+  const width = (arrow2 || "pointed") === "flattened" ? 30 : 16;
+  const halfWidth = width / 2;
+  const borderSize = 1;
+  const length = 6;
+  const [side, align] = placement.split("-");
+  if (side === "top" || side === "bottom") {
+    const vertical = side === "top" ? import_styled_components72.css`
+              bottom: 0;
+              &::before {
+                content: '';
+                position: absolute;
+                left: -${halfWidth}px;
+                border-left: ${halfWidth}px solid transparent;
+                border-right: ${halfWidth}px solid transparent;
+                border-top: ${length}px solid var(--tooltip-border);
+              }
+              &::after {
+                content: '';
+                position: absolute;
+                left: -${halfWidth - borderSize}px;
+                top: -${borderSize}px;
+                border-left: ${halfWidth - borderSize}px solid transparent;
+                border-right: ${halfWidth - borderSize}px solid transparent;
+                border-top: ${length - borderSize}px solid var(--tooltip-bg);
+              }
+            ` : import_styled_components72.css`
+              top: -${length}px;
+              &::before {
+                content: '';
+                position: absolute;
+                left: -${halfWidth}px;
+                border-left: ${halfWidth}px solid transparent;
+                border-right: ${halfWidth}px solid transparent;
+                border-bottom: ${length}px solid var(--tooltip-border);
+              }
+              &::after {
+                content: '';
+                position: absolute;
+                left: -${halfWidth - borderSize}px;
+                top: ${borderSize}px;
+                border-left: ${halfWidth - borderSize}px solid transparent;
+                border-right: ${halfWidth - borderSize}px solid transparent;
+                border-bottom: ${length - borderSize}px solid var(--tooltip-bg);
+              }
+            `;
+    const alignStyles = align === "start" ? import_styled_components72.css`
+              left: ${halfWidth}px;
+              margin-left: ${length}px;
+            ` : align === "end" ? import_styled_components72.css`
+              right: ${halfWidth}px;
+              margin-right: ${length}px;
+            ` : import_styled_components72.css`
+              left: 50%;
+            `;
+    return import_styled_components72.css`
+        ${vertical}
+        ${alignStyles}
+      `;
+  }
+  const horizontal = side === "left" ? import_styled_components72.css`
+            right: 0;
+            &::before {
+              content: '';
+              position: absolute;
+              top: -${halfWidth}px;
+              border-top: ${halfWidth}px solid transparent;
+              border-bottom: ${halfWidth}px solid transparent;
+              border-left: ${length}px solid var(--tooltip-border);
+            }
+            &::after {
+              content: '';
+              position: absolute;
+              top: -${halfWidth - borderSize}px;
+              left: -${borderSize}px;
+              border-top: ${halfWidth - borderSize}px solid transparent;
+              border-bottom: ${halfWidth - borderSize}px solid transparent;
+              border-left: ${length - borderSize}px solid var(--tooltip-bg);
+            }
+          ` : import_styled_components72.css`
+            left: -${length}px;
+            &::before {
+              content: '';
+              position: absolute;
+              top: -${halfWidth}px;
+              border-top: ${halfWidth}px solid transparent;
+              border-bottom: ${halfWidth}px solid transparent;
+              border-right: ${length}px solid var(--tooltip-border);
+            }
+            &::after {
+              content: '';
+              position: absolute;
+              top: -${halfWidth - borderSize}px;
+              left: ${borderSize}px;
+              border-top: ${halfWidth - borderSize}px solid transparent;
+              border-bottom: ${halfWidth - borderSize}px solid transparent;
+              border-right: ${length - borderSize}px solid var(--tooltip-bg);
+            }
+          `;
+  if (align === "start") {
+    return import_styled_components72.css`
+        top: ${halfWidth}px;
+        margin-top: ${length}px;
+        ${horizontal}
+      `;
+  }
+  if (align === "end") {
+    return import_styled_components72.css`
+        bottom: ${halfWidth}px;
+        margin-bottom: ${length}px;
+        ${horizontal}
+      `;
+  }
+  return import_styled_components72.css`
+      top: 50%;
+      ${horizontal}
+    `;
+}}
+`;
+var TooltipSurface = import_styled_components72.default.div`
+  position: relative;
+
+  ${({ theme: theme4, $background: background, $placement: placement }) => {
+  const [side] = placement.split("-");
+  const [bgColor, fontColor, borderColor, borderRadius] = background === "light" ? [theme4.colors.white, theme4.colors.greyishBlue, "#eeeeee", 5] : [
+    theme4.colors.greyishBlue,
+    theme4.colors.white,
+    theme4.colors.greyishBlue,
+    0
+  ];
+  const boxShadow = {
+    top: [0, -4],
+    bottom: [0, 4],
+    right: [4, 0],
+    left: [-4, 0]
+  }[side] || [0, 4];
+  return import_styled_components72.css`
+      --tooltip-bg: ${bgColor};
+      --tooltip-border: ${borderColor};
+      border: 1px solid ${borderColor};
+      border-radius: ${borderRadius}px;
+      box-shadow: ${boxShadow[0]}px ${boxShadow[1]}px 10px
+        ${theme4.getColor("black", 10)};
+      color: ${fontColor};
+
+      &,
+      & ${TooltipArrow} {
+        background-color: ${bgColor};
+      }
+    `;
+}}
+
+  border-radius: 4px;
+  padding: 8px 10px;
+  font-size: 12px;
+  max-width: 240px;
+  z-index: 1000;
+`;
+
+// src/components/Popup/index.tsx
+var import_jsx_runtime360 = require("react/jsx-runtime");
+var mergeRefs = (...refs) => {
+  return (node) => {
+    refs.forEach((ref) => {
+      if (!ref) return;
+      if (typeof ref === "function") ref(node);
+      else ref.current = node;
+    });
+  };
+};
+var PopupComponent = (props) => {
+  const {
+    content: Content5,
+    renderTrigger,
+    triggerProps,
+    on = "hover",
+    placement,
+    offset: offsetValue = 8,
+    shift: shiftValue = 8,
+    background = "dark",
+    closeOnClip = false
+  } = props;
+  const arrowStyle = props.arrow || (background === "dark" ? "pointed" : "flattened");
+  const withArrow = arrowStyle !== "none";
+  const [open, setOpen] = open_default(props);
+  const arrowRef = (0, import_react72.useRef)(null);
+  const fallbackPlacements = fallbackPlacements_default(props);
+  const floating = (0, import_react73.useFloating)({
+    open,
+    onOpenChange: setOpen,
+    placement,
+    whileElementsMounted: import_react73.autoUpdate,
+    middleware: [
+      (0, import_react73.offset)(offsetValue),
+      (0, import_react73.flip)({ fallbackPlacements, padding: shiftValue }),
+      (0, import_react73.shift)({ padding: shiftValue }),
+      ...withArrow ? [(0, import_react73.arrow)({ element: arrowRef })] : [],
+      ...closeOnClip ? [
+        (0, import_react73.hide)(),
+        {
+          name: "closeOnClip",
+          fn(state) {
+            if (state.middlewareData.hide?.referenceHidden) {
+              setOpen(false);
+            }
+            return {};
+          }
+        }
+      ] : []
+    ]
+  });
+  const hover = (0, import_react73.useHover)(floating.context, {
+    move: false,
+    enabled: on === "hover"
+  });
+  const click = (0, import_react73.useClick)(floating.context, {
+    enabled: on === "click"
+  });
+  const dismiss = (0, import_react73.useDismiss)(floating.context, {
+    outsidePressEvent: "mousedown",
+    escapeKey: true,
+    enabled: on === "click"
+  });
+  const interactions = (0, import_react73.useInteractions)([hover, click, dismiss]);
+  const referenceProps = (0, import_react72.useMemo)(() => {
+    const { ref: triggerRef, ...rest } = triggerProps || {};
+    return interactions.getReferenceProps({
+      ...rest,
+      ref: mergeRefs(floating.refs.setReference, triggerRef)
+    });
+  }, [floating.refs.setReference, interactions, triggerProps]);
+  return /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(import_react72.default.Fragment, { children: [
+    renderTrigger(referenceProps),
+    open ? /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(import_react73.FloatingPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(
+      TooltipSurface,
+      {
+        ref: floating.refs.setFloating,
+        style: floating.floatingStyles,
+        $placement: floating.placement,
+        $background: background,
+        ...interactions.getFloatingProps(),
+        children: [
+          withArrow ? /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+            TooltipArrow,
+            {
+              ref: arrowRef,
+              $arrow: arrowStyle,
+              $placement: floating.placement
+            }
+          ) : null,
+          /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Content5, {})
+        ]
+      }
+    ) }) : null
+  ] });
+};
+var Popup2 = ({
+  enabled,
+  ...props
+}) => {
+  return enabled !== false ? /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(PopupComponent, { ...props }) : props.renderTrigger(props.triggerProps || {});
+};
+var Popup_default = Popup2;
+
+// src/components/Select/components/Apply/styles.ts
+var import_styled_components73 = __toESM(require("styled-components"));
+var ApplyButton = import_styled_components73.default.button`
+  background: none;
+  border: none;
+  outline: none;
+  padding: 0;
+
+  background-color: ${({ theme: theme4 }) => theme4.colors.blue};
+  border-radius: 3px;
+
+  ${({ theme: theme4 }) => theme4.useTypography("h4")}
+  color: ${({ theme: theme4 }) => theme4.colors.white};
+
+  height: 35px;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  transition-property: opacity;
+  transition-duration: 0.25s;
+  transition-timing-function: linear;
+
+  &[aria-disabled='true'] {
+    opacity: 0.5;
+  }
+  &:not([aria-disabled='true']) {
+    cursor: pointer;
+  }
+`;
+
+// src/components/Select/components/Apply/index.tsx
+var import_jsx_runtime361 = require("react/jsx-runtime");
+var Apply = ({
+  setValue,
+  clearable,
+  applyRules,
+  onClose,
+  draft
+}) => {
+  const value = (0, import_react74.useMemo)(() => Array.from(draft.values()), [draft]);
+  const failedApplyRule = (0, import_react74.useMemo)(() => {
+    const rule = applyRules.find((rule2) => !rule2.allow(value));
+    return rule;
+  }, [value, applyRules]);
+  const ApplyRuleComponent = failedApplyRule?.Component;
+  const onApply = () => {
+    if (!clearable && draft.size < 1) return;
+    if (failedApplyRule !== void 0) return;
+    setValue(Array.from(draft.values()));
+    onClose();
+  };
+  return /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
+    Popup_default,
+    {
+      ...ApplyRuleComponent !== void 0 ? {
+        enabled: true,
+        content: () => /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(ApplyRuleComponent, { value })
+      } : {
+        enabled: false,
+        content: () => null
+      },
+      on: "click",
+      closeOnClip: true,
+      placement: "right",
+      triggerType: "button",
+      triggerProps: {
+        onClick: onApply
+      },
+      renderTrigger: (props) => /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
+        ApplyButton,
+        {
+          type: "button",
+          "aria-disabled": !clearable && draft.size < 1 || failedApplyRule !== void 0,
+          ...props,
+          children: "Aplicar"
+        }
+      )
+    }
+  );
+};
+var Apply_default = Apply;
+
+// src/components/Select/components/Scroll/index.tsx
+var import_react75 = __toESM(require("react"));
+
+// src/components/Select/components/Scroll/styles.ts
+var import_styled_components74 = __toESM(require("styled-components"));
+var ListContainer = import_styled_components74.default.div`
+  flex: 1;
+  position: relative;
+  overflow: hidden;
+`;
+var ListScroll = import_styled_components74.default.div`
+  overflow-y: scroll;
+  overflow-y: overlay;
+  width: 100%;
+  height: 100%;
+
+  /* Firefox */
+  @supports (scrollbar-width: thin) {
+    .scroll {
+      scrollbar-color: ${({ theme: theme4 }) => `${theme4.colors.grey} ${theme4.colors.white}`};
+      scrollbar-width: thin;
+    }
+  }
+
+  /* Chrome/Edge/Safari (WebKit/Blink) */
+  @supports selector(::-webkit-scrollbar) {
+    &::-webkit-scrollbar {
+      width: ${({ theme: theme4 }) => theme4.spacings.s1};
+    }
+    &::-webkit-scrollbar-thumb {
+      background: ${({ theme: theme4 }) => theme4.colors.grey};
+    }
+    &::-webkit-scrollbar-track {
+      background: ${({ theme: theme4 }) => theme4.colors.white};
+    }
+  }
+`;
+var ListInner = import_styled_components74.default.div`
+  position: relative;
+  width: 100%;
+`;
+var EmptyMessage2 = import_styled_components74.default.div`
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  ${({ theme: theme4 }) => theme4.useTypography("p")}
+  color: ${({ theme: theme4 }) => theme4.getColor("greyishBlue", 80)};
+`;
+var MultiHighlight = Checkmark;
+var SingleHighlight = import_styled_components74.default.div`
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  width: 3px;
+
+  transition-property: background-color;
+  transition-timing-function: linear;
+  transition-duration: 0.25s;
+`;
+var OptionRow = import_styled_components74.default.div`
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+
+  display: flex;
+  align-items: center;
+  gap: ${({ theme: theme4 }) => theme4.spacings.s1};
+
+  background-color: ${({ theme: theme4, $active: active }) => active ? theme4.getColor("blue", 15) : theme4.colors.white};
+  padding: ${({ theme: theme4 }) => theme4.spacings.s3};
+
+  ${({ theme: theme4 }) => theme4.useTypography("p")}
+  color: ${({ theme: theme4 }) => theme4.colors.greyishBlue};
+
+  border-bottom-width: 1px;
+  border-bottom-style: solid;
+  &:nth-last-child(1) {
+    border-bottom-color: transparent;
+  }
+  &:not(:nth-last-child(1)) {
+    border-bottom-color: ${({ theme: theme4 }) => theme4.getColor("greyishBlue", 10)};
+  }
+
+  &[aria-disabled='true'] {
+    cursor: not-allowed;
+    opacity: 0.5;
+  }
+  &:not([aria-disabled='true']) {
+    cursor: pointer;
+    opacity: 1;
+  }
+
+  &[aria-selected='true'] > ${SingleHighlight} {
+    background-color: ${({ theme: theme4 }) => theme4.colors.blue};
+  }
+  &:not([aria-selected='true']) > ${SingleHighlight} {
+    background-color: transparent;
+  }
+
+  > ${MultiHighlight} {
+    background-color: ${({ theme: theme4, $active: active }) => active ? theme4.colors.iceWhite : theme4.colors.white};
+  }
+
+  &[aria-selected='true'] > ${MultiHighlight} {
+    border-color: ${({ theme: theme4 }) => theme4.colors.blue};
+  }
+  &[aria-selected='true'] > ${MultiHighlight}:after {
+    width: 5px;
+    height: 9.5px;
+    border-width: 0 2px 2px 0;
+    left: 5px;
+    top: 1px;
+  }
+  &:not([aria-selected='true']) > ${MultiHighlight} {
+    border-color: ${({ theme: theme4 }) => theme4.colors.lightestGrey};
+  }
+
+  transition-property: background-color, opacity;
+  transition-timing-function: linear;
+  transition-duration: 0.25s;
+`;
+
+// src/components/Select/components/Scroll/index.tsx
+var import_jsx_runtime362 = require("react/jsx-runtime");
+var Scroll = import_react75.default.forwardRef(
+  ({
+    menuId,
+    loading,
+    options,
+    virtualItems,
+    totalSize,
+    measureElement,
+    OptionComponent,
+    onClickOption,
+    onMouseEnterOption,
+    activeIndex,
+    getKey,
+    getIsSelected,
+    getFailedRuleByKey,
+    mode,
+    ...props
+  }, ref) => {
+    const Highlight = mode === "single" ? SingleHighlight : MultiHighlight;
+    return /* @__PURE__ */ (0, import_jsx_runtime362.jsxs)(ListContainer, { children: [
+      loading ? /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(Loader_default, { filled: true }) : options.length < 1 ? /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(EmptyMessage2, { children: "Nenhuma op\xE7\xE3o encontrada" }) : null,
+      /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
+        ListScroll,
+        {
+          ref,
+          id: menuId,
+          role: "listbox",
+          ...props,
+          onMouseDown: (e) => e.preventDefault(),
+          children: /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(ListInner, { style: { height: `${totalSize}px` }, children: virtualItems.map((virtualItem) => {
+            const option = options[virtualItem.index];
+            if (!option) return null;
+            const optionKey = getKey(option);
+            const failedRule = getFailedRuleByKey(optionKey);
+            const disabled = Boolean(failedRule);
+            const isSelected = getIsSelected(optionKey);
+            const isActive = activeIndex === virtualItem.index;
+            const Component5 = failedRule?.Component;
+            return /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
+              Popup_default,
+              {
+                enabled: Boolean(Component5),
+                content: () => /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(Component5, { option }),
+                on: "click",
+                closeOnClip: true,
+                placement: "right",
+                triggerProps: {
+                  ref: measureElement,
+                  onMouseEnter: () => onMouseEnterOption(virtualItem.index),
+                  onClick: () => onClickOption(virtualItem.index)
+                },
+                renderTrigger: (props2) => /* @__PURE__ */ (0, import_jsx_runtime362.jsxs)(
+                  OptionRow,
+                  {
+                    id: `${menuId}-option-${virtualItem.index}`,
+                    "data-index": virtualItem.index,
+                    role: "option",
+                    "aria-selected": isSelected,
+                    "aria-disabled": disabled,
+                    $active: isActive,
+                    style: {
+                      transform: `translateY(${virtualItem.start}px)`
+                    },
+                    ...props2,
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(Highlight, {}),
+                      /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
+                        OptionComponent,
+                        {
+                          option,
+                          isActive,
+                          isSelected,
+                          isDisabled: disabled
+                        }
+                      )
+                    ]
+                  }
+                )
+              },
+              optionKey
+            );
+          }) })
+        }
+      )
+    ] });
+  }
+);
+var Scroll_default = Scroll;
+
+// src/components/Select/components/Search/index.tsx
+var import_react76 = __toESM(require("react"));
+
+// src/components/Select/components/Search/styles.ts
+var import_styled_components75 = __toESM(require("styled-components"));
+var SearchContainer = import_styled_components75.default.div`
+  padding: 0 ${({ theme: theme4 }) => theme4.spacings.s3};
+  margin-bottom: ${({ theme: theme4 }) => theme4.spacings.s1};
+
+  ${({ theme: theme4 }) => theme4.useTypography("p")}
+
+  position: relative;
+
+  > input {
+    width: 100%;
+    min-height: 35px;
+
+    padding-top: 0;
+    /* padding + icon width + gap */
+    padding-right: calc(
+      ${({ theme: theme4 }) => `${theme4.spacings.s1} + 24px + ${theme4.spacings.s1}`}
+    );
+    padding-bottom: 0;
+    padding-left: ${({ theme: theme4 }) => theme4.spacings.s3};
+
+    outline: none;
+
+    border-style: solid;
+    border-width: 1px;
+    border-color: ${({ theme: theme4 }) => theme4.colors.lightGrey};
+    border-radius: 4px;
+  }
+
+  > :last-child {
+    position: absolute;
+    top: 50%;
+
+    /* parent padding + input padding */
+    right: calc(
+      ${({ theme: theme4 }) => `${theme4.spacings.s3} + ${theme4.spacings.s1}`}
+    );
+    transform: translateY(-50%);
+  }
+`;
+
+// src/components/Select/components/Search/index.tsx
+var import_jsx_runtime363 = require("react/jsx-runtime");
+var Search = import_react76.default.forwardRef(
+  ({ menuId, onKeyDown, value: [value, setValue], activeIndex }, ref) => {
+    const [inputRef, setInputRef] = (0, import_react76.useState)(null);
+    return /* @__PURE__ */ (0, import_jsx_runtime363.jsxs)(SearchContainer, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime363.jsx)(
+        "input",
+        {
+          ref: (node) => {
+            setInputRef(node);
+            if (typeof ref === "function") {
+              ref(node);
+            } else if (ref) {
+              ref.current = node;
+            }
+          },
+          value,
+          onChange: (event) => setValue(event.target.value),
+          onKeyDown,
+          placeholder: "Buscar...",
+          role: "searchbox",
+          "aria-controls": menuId,
+          "aria-activedescendant": activeIndex >= 0 ? `${menuId}-option-${activeIndex}` : void 0
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime363.jsx)(
+        Icon_default,
+        {
+          type: "feather",
+          ...value.length > 0 ? {
+            icon: "x",
+            onClick: (e) => {
+              e.preventDefault();
+              setValue("");
+              inputRef?.focus();
+            },
+            strokeWidth: "4px"
+          } : {
+            icon: "search",
+            onClick: (e) => {
+              e.preventDefault();
+              e.stopPropagation();
+              inputRef?.focus();
+            }
+          }
+        }
+      )
+    ] });
+  }
+);
+var Search_default2 = Search;
+
+// src/components/Select/instances/styles.ts
+var import_styled_components76 = __toESM(require("styled-components"));
+var Header14 = import_styled_components76.default.div`
+  padding: 0 ${({ theme: theme4 }) => theme4.spacings.s3};
+  margin: ${({ theme: theme4 }) => theme4.spacings.s1} 0;
+  display: flex;
+  gap: ${({ theme: theme4 }) => theme4.spacings.s1};
+  justify-content: space-between;
+  align-items: center;
+`;
+var DraftSwitch = import_styled_components76.default.button`
+  background: none;
+  border: none;
+  outline: none;
+  padding: 0;
+  display: flex;
+  align-items: center;
+  gap: calc(${({ theme: theme4 }) => theme4.spacings.s1} / 2);
+
+  ${({ theme: theme4 }) => theme4.useTypography("h4")}
+  color: ${({ theme: theme4 }) => theme4.getColor("black", 80)};
+
+  transition-property: color;
+  transition-duration: 0.4s;
+  transition-timing-function: ease-in-out;
+
+  &:not(:disabled) {
+    cursor: pointer;
+  }
+
+  &:not(:disabled):hover {
+    color: ${({ theme: theme4 }) => theme4.colors.blue};
+  }
+
+  > span:nth-child(1) {
+    position: relative;
+    width: calc(${({ theme: theme4 }) => theme4.spacings.s3} * 2);
+    height: ${({ theme: theme4 }) => theme4.spacings.s3};
+    background-color: ${({ theme: theme4 }) => theme4.colors.warningGray};
+    border-radius: 20px;
+    transition-property: background-color;
+    transition-duration: 0.4s;
+    transition-timing-function: ease-in-out;
+    box-sizing: content-box;
+
+    &:before {
+      content: '';
+      transition-property: left, transform;
+      transition-duration: 0.4s;
+      transition-timing-function: ease-in-out;
+      position: absolute;
+      border-width: 1px;
+      border-style: solid;
+      border-radius: 100%;
+      border-color: ${({ theme: theme4 }) => theme4.colors.lightGrey};
+      left: 0;
+      box-shadow: 0px 1px 3px ${({ theme: theme4 }) => theme4.getColor("black", 10)};
+      width: 50%;
+      height: 100%;
+      background-color: ${({ theme: theme4 }) => theme4.colors.white};
+      box-sizing: border-box;
+    }
+  }
+
+  &[aria-checked='true'] > span:nth-child(1) {
+    background-color: ${({ theme: theme4 }) => theme4.colors.blue};
+  }
+
+  &[aria-checked='true'] > span:nth-child(1):before {
+    left: 100%;
+    transform: translateX(-100%);
+  }
+`;
+var SelectAllButton = import_styled_components76.default.button`
+  background: none;
+  border: none;
+  outline: none;
+  padding: 0;
+
+  ${({ theme: theme4 }) => theme4.useTypography("h6")}
+  color: ${({ theme: theme4 }) => theme4.colors.greyishBlue};
+
+  transition-property: color;
+  transition-duration: 0.25s;
+  transition-timing-function: linear;
+
+  &:not(:disabled) {
+    cursor: pointer;
+  }
+
+  &:not(:disabled):hover {
+    color: ${({ theme: theme4 }) => theme4.colors.blue};
+  }
+`;
+
+// src/components/Select/instances/multi/index.tsx
+var import_jsx_runtime364 = require("react/jsx-runtime");
+var buildMap = (values, getKey) => {
+  return new Map(values.map((option) => [getKey(option), option]));
+};
+var paginate = () => {
+};
+var useDraftOptions = (draft, finder) => {
+  const {
+    current: [searchInput, setSearchInput],
+    debounced: [search]
+  } = useDebouncedState_default("", () => {
+  }, SEARCH_DEBOUNCE_MS);
+  const options = (0, import_react77.useMemo)(() => {
+    const options2 = Array.from(draft.values());
+    if (!search) return options2;
+    return finder(search, options2);
+  }, [draft, search, finder]);
+  return {
+    options,
+    loading: false,
+    paginate,
+    searchInput: [searchInput, setSearchInput]
+  };
+};
+var useDraft = (value, getKey) => {
+  const [draft, setDraft] = (0, import_react77.useState)(() => ({
+    options: buildMap(value, getKey),
+    on: false
+  }));
+  const setOptions = (value2) => {
+    setDraft((prev) => {
+      const v = typeof value2 === "function" ? value2(prev.options) : value2;
+      if (v === prev.options) return prev;
+      return {
+        options: v,
+        on: prev.on && v.size > 0
+      };
+    });
+  };
+  const setOn = (value2) => {
+    setDraft((prev) => {
+      const v = typeof value2 === "function" ? value2(prev.on) : value2;
+      if (v === prev.on) return prev;
+      return {
+        options: prev.options,
+        on: v && prev.options.size > 0
+      };
+    });
+  };
+  return {
+    draft: [draft.options, setOptions],
+    switchDraft: [draft.on, setOn]
+  };
+};
+var SelectMultiOptions = ({
+  loader: loader2,
+  getKey,
+  OptionComponent,
+  rules,
+  overscan,
+  estimateSize,
+  value,
+  setValue,
+  menuId,
+  onClose,
+  clearable = false,
+  finder,
+  applyRules = []
+}) => {
+  const {
+    draft: [draft, setDraft],
+    switchDraft: [switchDraft, setSwitchDraft]
+  } = useDraft(value, getKey);
+  const asyncOptions = useAsyncOptions_default(loader2);
+  const draftOptions = useDraftOptions(draft, finder);
+  const {
+    options,
+    loading,
+    paginate: paginate2,
+    searchInput: [searchInput, setSearchInput]
+  } = switchDraft ? draftOptions : asyncOptions;
+  const { getFailedRuleByKey, enabledCount } = useRuleIndex_default({
+    options,
+    getKey,
+    rules
+  });
+  const { listRef, searchRef, rowVirtualizer, virtualItems } = useVirtualizedOptions_default({
+    optionsLength: options.length,
+    loading,
+    onPaginate: paginate2,
+    overscan,
+    estimateSize
+  });
+  const isIndexDisabled = (index) => {
+    const option = options[index];
+    if (!option) return true;
+    return Boolean(getFailedRuleByKey(getKey(option)));
+  };
+  const onToggleByIndex = (index) => {
+    const option = options[index];
+    if (!option) return;
+    if (isIndexDisabled(index)) {
+      searchRef.current?.focus();
+      return;
+    }
+    const key = getKey(option);
+    setDraft((current) => {
+      const next = new Map(current);
+      if (next.has(key)) {
+        next.delete(key);
+      } else {
+        next.set(key, option);
+      }
+      return next;
+    });
+  };
+  const navigation = useListNavigation_default({
+    itemCount: options.length,
+    isItemDisabled: isIndexDisabled,
+    onSelect: onToggleByIndex,
+    scrollToIndex: rowVirtualizer.scrollToIndex
+  });
+  const onSelectAll = () => {
+    setDraft((current) => {
+      const next = new Map(current);
+      options.forEach((option) => {
+        const key = getKey(option);
+        if (!getFailedRuleByKey(key)) {
+          next.set(key, option);
+        }
+      });
+      return next;
+    });
+  };
+  const onUnselectAll = () => {
+    setDraft(/* @__PURE__ */ new Map([]));
+  };
+  const getIsSelected = (0, import_react77.useCallback)((key) => draft.has(key), [draft]);
+  return /* @__PURE__ */ (0, import_jsx_runtime364.jsxs)(import_react77.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime364.jsxs)(Header14, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime364.jsxs)(
+        DraftSwitch,
+        {
+          type: "button",
+          role: "switch",
+          "aria-checked": switchDraft,
+          onClick: () => setSwitchDraft((prev) => !prev),
+          disabled: draft.size < 1,
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime364.jsx)("span", {}),
+            "Selecionados (",
+            draft.size,
+            ")"
+          ]
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
+        SelectAllButton,
+        {
+          type: "button",
+          ...enabledCount > 0 && enabledCount === draft.size ? {
+            onClick: onUnselectAll,
+            children: "Desselecionar tudo"
+          } : {
+            onClick: onSelectAll,
+            children: "Selecionar tudo",
+            disabled: enabledCount < 1
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
+      Search_default2,
+      {
+        ref: searchRef,
+        menuId,
+        value: [searchInput, setSearchInput],
+        activeIndex: navigation.activeIndex,
+        onKeyDown: navigation.onKeyDown
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
+      Scroll_default,
+      {
+        ref: listRef,
+        menuId,
+        options,
+        virtualItems,
+        totalSize: rowVirtualizer.getTotalSize(),
+        measureElement: rowVirtualizer.measureElement,
+        loading,
+        OptionComponent,
+        onClickOption: onToggleByIndex,
+        onMouseEnterOption: navigation.onMouseEnter,
+        activeIndex: navigation.activeIndex,
+        getKey,
+        getIsSelected,
+        getFailedRuleByKey,
+        mode: "multi",
+        "aria-multiselectable": true
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
+      Apply_default,
+      {
+        setValue,
+        onClose,
+        draft,
+        clearable,
+        applyRules
+      }
+    )
+  ] });
+};
+var useMultiSelect = ({
+  label,
+  loader: loader2,
+  getKey,
+  OptionComponent,
+  rules,
+  placeholder = "Selecione",
+  required,
+  invalid,
+  clearable,
+  readOnly,
+  viewMode,
+  overscan,
+  estimateSize,
+  height,
+  value,
+  setValue,
+  finder,
+  applyRules,
+  ...buttonProps
+}) => {
+  const closedLabel = (0, import_react77.useMemo)(() => {
+    if (value.length < 1) {
+      return viewMode ? /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(import_react77.default.Fragment, { children: "\xA0" }) : placeholder;
+    }
+    return `H\xE1 ${value.length} op\xE7\xF5es selecionadas`;
+  }, [placeholder, value.length, viewMode]);
+  return {
+    isEmpty: value.length === 0,
+    placeholder: closedLabel,
+    onClear: () => setValue([]),
+    Component: SelectMultiOptions,
+    buttonProps
+  };
+};
+var multi_default = useMultiSelect;
+
+// src/components/Select/instances/single/index.tsx
+var import_react78 = __toESM(require("react"));
+var import_jsx_runtime365 = require("react/jsx-runtime");
+var SelectSingleOptions = ({
+  loader: loader2,
+  getKey,
+  OptionComponent,
+  rules,
+  overscan,
+  estimateSize,
+  value,
+  setValue,
+  menuId,
+  onClose,
+  clearable
+}) => {
+  const {
+    options,
+    loading,
+    paginate: paginate2,
+    searchInput: [searchInput, setSearchInput]
+  } = useAsyncOptions_default(loader2);
+  const { getFailedRuleByKey } = useRuleIndex_default({
+    options,
+    getKey,
+    rules
+  });
+  const { listRef, searchRef, rowVirtualizer, virtualItems } = useVirtualizedOptions_default({
+    optionsLength: options.length,
+    loading,
+    onPaginate: paginate2,
+    overscan,
+    estimateSize
+  });
+  const selectedKey = value ? getKey(value) : null;
+  const isIndexDisabled = (index) => {
+    const option = options[index];
+    if (!option) return true;
+    return Boolean(getFailedRuleByKey(getKey(option)));
+  };
+  const onToggleByIndex = (index) => {
+    const option = options[index];
+    if (!option) return;
+    if (isIndexDisabled(index)) {
+      searchRef.current?.focus();
+      return;
+    }
+    const optionKey = getKey(option);
+    if (selectedKey === optionKey) {
+      if (!clearable) return;
+      setValue(null);
+    } else {
+      setValue(option);
+    }
+    onClose();
+  };
+  const navigation = useListNavigation_default({
+    itemCount: options.length,
+    isItemDisabled: isIndexDisabled,
+    onSelect: onToggleByIndex,
+    scrollToIndex: rowVirtualizer.scrollToIndex
+  });
+  const getIsSelected = (0, import_react78.useCallback)(
+    (key) => selectedKey === key,
+    [selectedKey]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime365.jsxs)(import_react78.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
+      Search_default2,
+      {
+        ref: searchRef,
+        menuId,
+        value: [searchInput, setSearchInput],
+        activeIndex: navigation.activeIndex,
+        onKeyDown: navigation.onKeyDown
+      }
+    ),
+    /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
+      Scroll_default,
+      {
+        ref: listRef,
+        menuId,
+        options,
+        virtualItems,
+        totalSize: rowVirtualizer.getTotalSize(),
+        measureElement: rowVirtualizer.measureElement,
+        loading,
+        OptionComponent,
+        onClickOption: onToggleByIndex,
+        onMouseEnterOption: navigation.onMouseEnter,
+        activeIndex: navigation.activeIndex,
+        getKey,
+        getIsSelected,
+        getFailedRuleByKey,
+        mode: "single",
+        "aria-multiselectable": true
+      }
+    )
+  ] });
+};
+var useSingleSelect = ({
+  label,
+  loader: loader2,
+  getKey,
+  OptionComponent,
+  rules,
+  placeholder = "Selecione",
+  required,
+  invalid,
+  clearable,
+  readOnly,
+  viewMode,
+  overscan,
+  estimateSize,
+  height,
+  value,
+  setValue,
+  ValueComponent,
+  ...buttonProps
+}) => {
+  const ClosedValueComponent = ValueComponent || OptionComponent;
+  const closedLabel = (0, import_react78.useMemo)(() => {
+    if (!value) {
+      return viewMode ? /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(import_react78.default.Fragment, { children: "\xA0" }) : placeholder;
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
+      ClosedValueComponent,
+      {
+        option: value,
+        isActive: false,
+        isSelected: true,
+        isDisabled: false
+      }
+    );
+  }, [ClosedValueComponent, placeholder, value, viewMode]);
+  return {
+    isEmpty: !value,
+    placeholder: closedLabel,
+    onClear: () => setValue(null),
+    Component: SelectSingleOptions,
+    buttonProps
+  };
+};
+var single_default = useSingleSelect;
+
+// src/components/Select/instances/index.tsx
+var useSelect2 = (props) => {
+  return props.type === "multi-select" ? multi_default(props) : single_default(props);
+};
+var instances_default = useSelect2;
+
+// src/components/Select/styles.ts
+var import_styled_components77 = __toESM(require("styled-components"));
+var FloatingWrapper = import_styled_components77.default.div`
+  z-index: 1000;
+
+  &,
+  & > div {
+    height: var(--height);
+    min-height: var(--height);
+    max-height: var(--height);
+  }
+
+  > div {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    padding-top: ${({ theme: theme4 }) => theme4.spacings.s1};
+
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+  }
+
+  transition-property: height, max-height, min-height;
+  transition-timing-function: linear;
+  transition-duration: ${MENU_EXIT_MS}ms;
+
+  background: ${({ theme: theme4 }) => theme4.colors.white};
+  border: 1px solid ${({ theme: theme4 }) => theme4.colors.lightGrey};
+  border-radius: 6px;
+  box-shadow: 0px 3px 6px ${({ theme: theme4 }) => theme4.getColor("black", 15)};
+  overflow: hidden;
+`;
+var Trigger = import_styled_components77.default.button`
+  width: 100%;
+
+  transition-property: opacity, border-color, box-shadow, color,
+    background-color;
+  transition-timing-function: linear;
+  transition-duration: 0.25s;
+
+  ${({ $viewMode: viewMode }) => viewMode ? import_styled_components77.css`
+          padding: 0;
+
+          border: none;
+        ` : import_styled_components77.css`
+          min-height: 35px;
+          padding: 0 ${({ theme: theme4 }) => theme4.spacings.s3};
+
+          border-style: solid;
+          border-width: 1px;
+          border-radius: 4px;
+        `}
+
+  outline: none !important;
+
+  &:focus-visible {
+    box-shadow: 3px 3px 6px ${({ theme: theme4 }) => theme4.getColor("black", 15)};
+  }
+
+  text-align: left;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: ${({ theme: theme4 }) => theme4.spacings.s1};
+
+  ${({ theme: theme4 }) => theme4.useTypography("p")}
+
+  &[aria-invalid='true'] {
+    border-color: ${({ theme: theme4 }) => theme4.colors.warningRed};
+    color: ${({ theme: theme4 }) => theme4.colors.warningRed};
+    background-color: ${({ theme: theme4 }) => theme4.getColor("warningRed", 5)};
+  }
+  &:not([aria-invalid='true']) {
+    border-color: ${({ theme: theme4 }) => theme4.colors.lightGrey};
+    color: ${({ theme: theme4, $empty: empty }) => {
+  return empty ? theme4.colors.darkGrey : theme4.colors.darkBlue;
+}};
+    background-color: ${({ theme: theme4 }) => theme4.colors.white};
+  }
+
+  &:disabled {
+    opacity: 0.5;
+  }
+
+  &:not(:disabled),
+  &:not([aria-readonly='true']) {
+    cursor: pointer;
+  }
+
+  &:disabled,
+  &[aria-readonly='true'] {
+    pointer-events: none;
+  }
+
+  > i {
+    transition-property: transform;
+    transition-timing-function: linear;
+    transition-duration: 0.25s;
+    transform: rotate(${({ $open: open }) => open ? "180deg" : "0deg"});
+  }
+`;
+var TriggerValue = import_styled_components77.default.div`
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+`;
+var Label11 = import_styled_components77.default.label`
+  display: inline-block;
+  margin-bottom: ${({ theme: theme4, $viewMode: viewMode }) => theme4.spacings[viewMode ? "s3" : "s1"]};
+
+  ${({ theme: theme4, $viewMode: viewMode }) => theme4.useTypography("p", {
+  fontWeight: viewMode ? "bold" : "normal"
+})}
+  color: ${({ theme: theme4 }) => theme4.colors.greyishBlue};
+
+  transition-property: opacity, border-color, box-shadow, color,
+    background-color;
+  transition-timing-function: linear;
+  transition-duration: 0.25s;
+
+  &:has(+ [aria-required='true']):after {
+    content: ' *';
+  }
+
+  &:has(+ :disabled) {
+    opacity: 0.5;
+  }
+`;
+var OptionContainer = import_styled_components77.default.div`
+  display: flex;
+  flex-direction: column;
+  gap: calc(${({ theme: theme4 }) => theme4.spacings.s1} / 2);
+  overflow: hidden;
+
+  > div {
+    display: flex;
+    gap: calc(${({ theme: theme4 }) => theme4.spacings.s1} / 2);
+    color: ${({ theme: theme4 }) => theme4.colors.darkBlue};
+    white-space: nowrap;
+  }
+
+  > div:nth-child(1) {
+    ${({ theme: theme4 }) => theme4.useTypography("p")}
+  }
+
+  > div:not(:nth-child(1)) {
+    ${({ theme: theme4 }) => theme4.useTypography("h6")}
+    opacity: 0.5;
+  }
+`;
+
+// src/components/Select/index.tsx
+var import_jsx_runtime366 = require("react/jsx-runtime");
+var Select2 = import_react79.default.forwardRef(
+  (props, ref) => {
+    const [open, setOpen] = (0, import_react79.useState)(false);
+    const id = props.id || (0, import_react79.useId)();
+    const { isRequired, isInvalid: isInvalid2, isViewMode, isDisabled } = Form_default.useContext(
+      props.name
+    );
+    const invalid = isInvalid2() || props.invalid;
+    const required = isRequired() || props.required;
+    const disabled = isDisabled() || props.disabled;
+    const viewMode = isViewMode() || props.viewMode;
+    const { floating, transition, interactions } = useFloatingMenu_default({
+      open,
+      onOpenChange: setOpen
+    });
+    const height = (0, import_react79.useMemo)(() => {
+      if (transition.status !== "open") return 0;
+      if (props.height !== void 0) return props.height;
+      return props.type === "single-select" ? 240 : 260;
+    }, [transition.status !== "open", props.type, props.height]);
+    const menuId = (0, import_react79.useId)();
+    const onTriggerKeyDown = (event) => {
+      if (!open && ["ArrowDown", "ArrowUp", "Enter", " "].includes(event.key)) {
+        event.preventDefault();
+        setOpen(true);
+      }
+    };
+    const { isEmpty, placeholder, Component: Component5, onClear, buttonProps } = instances_default(props);
+    return /* @__PURE__ */ (0, import_jsx_runtime366.jsxs)(import_react79.default.Fragment, { children: [
+      props.label !== void 0 && /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(Label11, { htmlFor: id, $viewMode: viewMode, children: props.label }),
+      /* @__PURE__ */ (0, import_jsx_runtime366.jsxs)(
+        Trigger,
+        {
+          id,
+          type: "button",
+          role: "combobox",
+          "aria-haspopup": "listbox",
+          "aria-expanded": open,
+          "aria-controls": menuId,
+          $open: open,
+          $empty: isEmpty,
+          $viewMode: viewMode,
+          "aria-readonly": props.readOnly || viewMode,
+          "aria-invalid": invalid,
+          "aria-required": required && !viewMode,
+          ...interactions.getReferenceProps({
+            ...buttonProps,
+            disabled,
+            onClick: (event) => {
+              if (props.readOnly || viewMode || disabled) return;
+              setOpen((current) => !current);
+              buttonProps.onClick?.(event);
+            },
+            onKeyDown: (event) => {
+              if (props.readOnly || viewMode || props.disabled) return;
+              onTriggerKeyDown(event);
+              buttonProps.onKeyDown?.(event);
+            }
+          }),
+          ref: (node) => {
+            floating.refs.setReference(node);
+            if (typeof ref === "function") {
+              ref(node);
+            } else if (ref) {
+              ref.current = node;
+            }
+          },
+          children: [
+            /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(TriggerValue, { children: placeholder }),
+            !viewMode && /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+              Icon_default,
+              {
+                width: "14px",
+                color: props.invalid ? colors.warningRed : colors.darkGrey,
+                ...!isEmpty && props.clearable && !props.disabled && !props.readOnly ? {
+                  type: "feather",
+                  icon: "x",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    onClear();
+                  },
+                  strokeWidth: "4px"
+                } : {
+                  type: "semantic",
+                  icon: "caret down"
+                }
+              }
+            )
+          ]
+        }
+      ),
+      transition.isMounted ? /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(import_react80.FloatingPortal, { children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+        FloatingWrapper,
+        {
+          ref: floating.refs.setFloating,
+          style: {
+            ...floating.floatingStyles,
+            "--height": `${height}px`
+          },
+          ...interactions.getFloatingProps(),
+          children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+            Component5,
+            {
+              ...props,
+              menuId,
+              onClose: () => setOpen(false)
+            }
+          ) })
+        }
+      ) }) : null
+    ] });
+  }
+);
+var Select_default3 = Object.assign(Select2, {
+  OptionContainer
+});
+
+// src/components/Signature/index.tsx
+var import_react81 = require("react");
+var import_react_signature_canvas = __toESM(require("react-signature-canvas"));
+
+// src/components/Signature/styles.ts
+var import_styled_components78 = __toESM(require("styled-components"));
+var Container26 = import_styled_components78.default.div`
+  width: 100%;
+  height: 100%;
+
+  display: flex;
+  flex-direction: column;
+  gap: ${({ theme: theme4 }) => theme4.spacings.s3};
+`;
+var CanvasContainer = import_styled_components78.default.div`
+  position: relative;
+  flex: 1;
+  overflow: hidden;
+  background-color: ${({ theme: theme4, $invalid: invalid }) => invalid ? theme4.getColor("warningRed", 5) : theme4.colors.white};
+
+  &[data-placeholder]:before {
+    content: attr(data-placeholder);
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    text-align: center;
+
+    color: ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "darkBlue"]};
+
+    ${({ theme: theme4 }) => theme4.useTypography("h1")}
+    font-size: 59px;
+    line-height: 71px;
+    opacity: 0.1;
+    z-index: 1;
+  }
+
+  canvas {
+    position: relative;
+    display: block;
+    width: 100%;
+    height: 100%;
+    box-sizing: border-box;
+    border: 1px solid
+      ${({ theme: theme4, $invalid: invalid }) => theme4.colors[invalid ? "warningRed" : "lightGrey"]};
+    border-radius: 4px;
+    z-index: 2;
+  }
+
+  /* icons container */
+  > div:nth-child(1) {
+    position: absolute;
+    top: ${({ theme: theme4 }) => theme4.spacings.s3};
+    right: ${({ theme: theme4 }) => theme4.spacings.s3};
+    display: flex;
+    gap: ${({ theme: theme4 }) => theme4.spacings.s1};
+    z-index: 3;
+
+    > button {
+      padding: 0;
+      outline: none;
+      border: none;
+      background: none;
+
+      > i.icon,
+      > i.icon:before {
+        color: #4e4e4e;
+        font-size: 20px;
+        line-height: 20px;
+        width: 20px;
+      }
+
+      &:not(:disabled) {
+        cursor: pointer;
+      }
+      &:disabled {
+        opacity: 0.5;
+      }
+
+      transition: opacity 0.25s linear;
+    }
+  }
+`;
+
+// src/components/Signature/index.tsx
+var import_jsx_runtime367 = require("react/jsx-runtime");
+var FONTS = [
+  "GreatVibes",
+  "Pacifico",
+  "Allura"
 ];
 var FONT_SIZE = 64;
 var voidFn = () => {
@@ -17702,12 +19583,12 @@ var SignatureInput = ({
   onEnd = voidFn,
   ...props
 }) => {
-  const [name, setName] = (0, import_react63.useState)("");
-  const [font, setFont] = (0, import_react63.useState)(FONTS[0]);
-  const [showPlaceholder, setShowPlaceholder] = (0, import_react63.useState)(true);
-  const [loading, setLoading] = (0, import_react63.useState)(false);
-  const [ref, setRef] = (0, import_react63.useState)(null);
-  (0, import_react63.useEffect)(() => {
+  const [name, setName] = (0, import_react81.useState)("");
+  const [font, setFont] = (0, import_react81.useState)(FONTS[0]);
+  const [showPlaceholder, setShowPlaceholder] = (0, import_react81.useState)(true);
+  const [loading, setLoading] = (0, import_react81.useState)(false);
+  const [ref, setRef] = (0, import_react81.useState)(null);
+  (0, import_react81.useEffect)(() => {
     if (!ref) return;
     const refreshValue = () => {
       if (ref.isEmpty() && !value) return;
@@ -17720,7 +19601,7 @@ var SignatureInput = ({
     window.addEventListener("resize", refreshValue);
     return () => window.removeEventListener("resize", refreshValue);
   }, [ref, value]);
-  const setByText = (0, import_react63.useCallback)(
+  const setByText = (0, import_react81.useCallback)(
     async (name2, font2) => {
       if (!ref) return;
       const trimmed = name2.trim();
@@ -17749,14 +19630,14 @@ var SignatureInput = ({
     },
     [ref]
   );
-  const onBeginHandler = (0, import_react63.useCallback)(
+  const onBeginHandler = (0, import_react81.useCallback)(
     (event) => {
       onBegin(event, ref);
       setShowPlaceholder(false);
     },
     [ref, onBegin]
   );
-  const onEndHandler = (0, import_react63.useCallback)(
+  const onEndHandler = (0, import_react81.useCallback)(
     (event) => {
       onEnd(event, ref);
       if (!ref || ref.isEmpty()) return;
@@ -17764,19 +19645,19 @@ var SignatureInput = ({
     },
     [ref, onEnd]
   );
-  const onApplyHandler = (0, import_react63.useCallback)(() => {
+  const onApplyHandler = (0, import_react81.useCallback)(() => {
     setByText(name, font);
   }, [name, font, setByText]);
-  const onClearHandler = (0, import_react63.useCallback)(() => {
+  const onClearHandler = (0, import_react81.useCallback)(() => {
     if (!ref) return;
     setShowPlaceholder(true);
     setName("");
     ref.clear();
     setValue("");
   }, [ref]);
-  const empty = (0, import_react63.useMemo)(() => !value && (!ref || ref.isEmpty()), [ref, value]);
-  return /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(Container26, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+  const empty = (0, import_react81.useMemo)(() => !value && (!ref || ref.isEmpty()), [ref, value]);
+  return /* @__PURE__ */ (0, import_jsx_runtime367.jsxs)(Container26, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
       Input_default,
       {
         label,
@@ -17799,7 +19680,7 @@ var SignatureInput = ({
         } : {}
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime367.jsxs)(
       CanvasContainer,
       {
         $invalid: invalid,
@@ -17807,8 +19688,8 @@ var SignatureInput = ({
           "data-placeholder": canvasPlaceholder
         } : {},
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime360.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime367.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
               "button",
               {
                 type: "button",
@@ -17821,10 +19702,10 @@ var SignatureInput = ({
                 },
                 disabled: loading || name.trim().length < 1,
                 title: "Trocar fonte",
-                children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Icon_default, { type: "semantic", icon: "font" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Icon_default, { type: "semantic", icon: "font" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
               "button",
               {
                 type: "button",
@@ -17834,12 +19715,12 @@ var SignatureInput = ({
                 },
                 disabled: empty,
                 title: "Recortar",
-                children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Icon_default, { type: "semantic", icon: "cut" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Icon_default, { type: "semantic", icon: "cut" })
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime360.jsx)("button", { onClick: onClearHandler, disabled: empty, title: "Limpar", children: /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(Icon_default, { type: "semantic", icon: "eraser" }) })
+            /* @__PURE__ */ (0, import_jsx_runtime367.jsx)("button", { onClick: onClearHandler, disabled: empty, title: "Limpar", children: /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Icon_default, { type: "semantic", icon: "eraser" }) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime360.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(
             import_react_signature_canvas.default,
             {
               ref: setRef,
@@ -17858,17 +19739,17 @@ var SignatureInput = ({
 var Signature_default = SignatureInput;
 
 // src/components/Tabs/index.tsx
-var import_react69 = __toESM(require("react"));
+var import_react87 = __toESM(require("react"));
 
 // src/components/Tabs/components/ScrollButtons/index.tsx
-var import_react65 = __toESM(require("react"));
+var import_react83 = __toESM(require("react"));
 
 // src/components/Tabs/components/ScrollButton/index.tsx
-var import_react64 = require("react");
+var import_react82 = require("react");
 
 // src/components/Tabs/components/ScrollButton/styled.ts
-var import_styled_components73 = __toESM(require("styled-components"));
-var Container27 = import_styled_components73.default.div`
+var import_styled_components79 = __toESM(require("styled-components"));
+var Container27 = import_styled_components79.default.div`
   position: absolute;
   top: 0;
   height: 100%;
@@ -17891,31 +19772,31 @@ var Container27 = import_styled_components73.default.div`
 `;
 
 // src/components/Tabs/components/ScrollButton/index.tsx
-var import_jsx_runtime361 = require("react/jsx-runtime");
+var import_jsx_runtime368 = require("react/jsx-runtime");
 var ScrollButton = (props) => {
   const { mode, visible, scrollRef } = props;
   const icon = `chevron_${mode}`;
-  const onClick = (0, import_react64.useCallback)(() => {
+  const onClick = (0, import_react82.useCallback)(() => {
     if (!scrollRef) return;
     scrollRef.scrollBy({
       left: mode === "left" ? -(scrollRef.scrollWidth + 1) : scrollRef.scrollWidth,
       behavior: "smooth"
     });
   }, [scrollRef, mode]);
-  return /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime368.jsx)(
     Container27,
     {
       className: ["scroll-arrow", ...visible ? ["visible"] : []].join(" "),
       onClick,
-      children: /* @__PURE__ */ (0, import_jsx_runtime361.jsx)(Icon_default, { type: "feather", icon, width: 16, height: 16, color: "black" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime368.jsx)(Icon_default, { type: "feather", icon, width: 16, height: 16, color: "black" })
     }
   );
 };
 var ScrollButton_default = ScrollButton;
 
 // src/components/Tabs/components/ScrollButtons/styled.ts
-var import_styled_components74 = __toESM(require("styled-components"));
-var Container28 = import_styled_components74.default.div`
+var import_styled_components80 = __toESM(require("styled-components"));
+var Container28 = import_styled_components80.default.div`
   overflow-x: auto;
   scrollbar-width: thin;
   scroll-behavior: smooth;
@@ -17930,19 +19811,19 @@ var Container28 = import_styled_components74.default.div`
     display: none; /* Chrome, Safari, Opera */
   }
 
-  ${({ theme: theme4, $internal: internal }) => internal && import_styled_components74.css`
+  ${({ theme: theme4, $internal: internal }) => internal && import_styled_components80.css`
       gap: ${theme4.spacings.s6};
     `}
 `;
 
 // src/components/Tabs/components/ScrollButtons/index.tsx
-var import_jsx_runtime362 = require("react/jsx-runtime");
+var import_jsx_runtime369 = require("react/jsx-runtime");
 var ScrollButtons = (props) => {
   const { activeTabIndex, tabsLength } = props;
-  const [ref, setRef] = (0, import_react65.useState)(null);
-  const [showLeftArrow, setShowLeftArrow] = (0, import_react65.useState)(false);
-  const [showRightArrow, setShowRightArrow] = (0, import_react65.useState)(false);
-  const checkScrollPosition = (0, import_react65.useCallback)(() => {
+  const [ref, setRef] = (0, import_react83.useState)(null);
+  const [showLeftArrow, setShowLeftArrow] = (0, import_react83.useState)(false);
+  const [showRightArrow, setShowRightArrow] = (0, import_react83.useState)(false);
+  const checkScrollPosition = (0, import_react83.useCallback)(() => {
     if (!ref) return;
     if (ref.scrollWidth > ref.offsetWidth) {
       const { scrollLeft, scrollWidth, clientWidth } = ref;
@@ -17953,12 +19834,12 @@ var ScrollButtons = (props) => {
       setShowRightArrow(false);
     }
   }, [ref]);
-  (0, import_react65.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     checkScrollPosition();
     window.addEventListener("resize", checkScrollPosition);
     return () => window.removeEventListener("resize", checkScrollPosition);
   }, [checkScrollPosition, tabsLength]);
-  (0, import_react65.useEffect)(() => {
+  (0, import_react83.useEffect)(() => {
     if (!ref) return;
     if (ref.scrollWidth <= ref.offsetWidth) return;
     const element = ref.children[activeTabIndex];
@@ -17968,9 +19849,9 @@ var ScrollButtons = (props) => {
       inline: "nearest"
     });
   }, [activeTabIndex, ref]);
-  return /* @__PURE__ */ (0, import_jsx_runtime362.jsxs)(import_react65.default.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(ScrollButton_default, { scrollRef: ref, mode: "left", visible: showLeftArrow }),
-    /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime369.jsxs)(import_react83.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(ScrollButton_default, { scrollRef: ref, mode: "left", visible: showLeftArrow }),
+    /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(
       Container28,
       {
         ref: setRef,
@@ -17985,13 +19866,13 @@ var ScrollButtons = (props) => {
         children: props.children
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime362.jsx)(ScrollButton_default, { scrollRef: ref, mode: "right", visible: showRightArrow })
+    /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(ScrollButton_default, { scrollRef: ref, mode: "right", visible: showRightArrow })
   ] });
 };
 var ScrollButtons_default = ScrollButtons;
 
 // src/components/Tabs/components/TabItem/index.tsx
-var import_react68 = __toESM(require("react"));
+var import_react86 = __toESM(require("react"));
 
 // src/components/Tabs/functions.ts
 var sortTabs = (tabs, sorted = []) => {
@@ -18039,11 +19920,11 @@ var buildComponent = (component, provider) => {
 };
 
 // src/components/Tabs/components/TabItem/components/Close/index.tsx
-var import_react66 = require("react");
+var import_react84 = require("react");
 
 // src/components/Tabs/components/TabItem/components/Close/styles.ts
-var import_styled_components75 = __toESM(require("styled-components"));
-var Close = import_styled_components75.default.div`
+var import_styled_components81 = __toESM(require("styled-components"));
+var Close = import_styled_components81.default.div`
   position: relative;
   z-index: 2;
   display: flex;
@@ -18069,7 +19950,7 @@ var Close = import_styled_components75.default.div`
 `;
 
 // src/components/Tabs/components/TabItem/components/Close/index.tsx
-var import_jsx_runtime363 = require("react/jsx-runtime");
+var import_jsx_runtime370 = require("react/jsx-runtime");
 var Close2 = (props) => {
   const {
     index,
@@ -18077,7 +19958,7 @@ var Close2 = (props) => {
     options: [options, setOptions]
   } = props;
   const onClose = props.onClose || (() => true);
-  const onClickClose = (0, import_react66.useCallback)(
+  const onClickClose = (0, import_react84.useCallback)(
     async (event) => {
       if (options.length === 1) return;
       const newOptions = [...options];
@@ -18091,7 +19972,7 @@ var Close2 = (props) => {
     },
     [options, active, index, onClose]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime363.jsx)(Close, { children: /* @__PURE__ */ (0, import_jsx_runtime363.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime370.jsx)(Close, { children: /* @__PURE__ */ (0, import_jsx_runtime370.jsx)(
     Icon_default,
     {
       type: "feather",
@@ -18106,11 +19987,11 @@ var Close2 = (props) => {
 var Close_default = Close2;
 
 // src/components/Tabs/components/TabItem/components/LabelItem/index.tsx
-var import_react67 = require("react");
+var import_react85 = require("react");
 
 // src/components/Tabs/components/TabItem/components/LabelItem/styled.ts
-var import_styled_components76 = __toESM(require("styled-components"));
-var StyledTab = import_styled_components76.default.div`
+var import_styled_components82 = __toESM(require("styled-components"));
+var StyledTab = import_styled_components82.default.div`
   position: relative;
   flex: 1;
   white-space: nowrap;
@@ -18143,7 +20024,7 @@ var StyledTab = import_styled_components76.default.div`
     transition: --color 0.5s, --bgColor 0.5s;
   }
 
-  ${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal && import_styled_components76.css`
+  ${({ $primary, $hasSiblings, $internal }) => $primary && $hasSiblings && !$internal && import_styled_components82.css`
       &::before {
         content: '';
         position: absolute;
@@ -18159,11 +20040,11 @@ var StyledTab = import_styled_components76.default.div`
 `;
 
 // src/components/Tabs/components/TabItem/components/LabelItem/index.tsx
-var import_jsx_runtime364 = require("react/jsx-runtime");
+var import_jsx_runtime371 = require("react/jsx-runtime");
 var LabelItem = (props) => {
   const { children, onClick, primary, hasSiblings, internal } = props;
-  const [ref, setRef] = (0, import_react67.useState)(null);
-  return /* @__PURE__ */ (0, import_jsx_runtime364.jsx)(
+  const [ref, setRef] = (0, import_react85.useState)(null);
+  return /* @__PURE__ */ (0, import_jsx_runtime371.jsx)(
     StyledTab,
     {
       ref: setRef,
@@ -18182,8 +20063,8 @@ var LabelItem = (props) => {
 var LabelItem_default = LabelItem;
 
 // src/components/Tabs/components/TabItem/styled.ts
-var import_styled_components77 = __toESM(require("styled-components"));
-var Container29 = import_styled_components77.default.div`
+var import_styled_components83 = __toESM(require("styled-components"));
+var Container29 = import_styled_components83.default.div`
   @property --bgColor {
     syntax: '<color>';
     initial-value: #ffffff;
@@ -18217,8 +20098,8 @@ var Container29 = import_styled_components77.default.div`
 `;
 
 // src/components/Tabs/components/TabItem/index.tsx
-var import_jsx_runtime365 = require("react/jsx-runtime");
-var VoidClose = () => /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(import_react68.default.Fragment, {});
+var import_jsx_runtime372 = require("react/jsx-runtime");
+var VoidClose = () => /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(import_react86.default.Fragment, {});
 var TabItem = (props) => {
   const {
     active: [active, setActive],
@@ -18228,16 +20109,16 @@ var TabItem = (props) => {
     alwaysOpen
   } = props;
   const CloseComponent = alwaysOpen || tabs.length < 2 ? VoidClose : Close_default;
-  return /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(import_react68.default.Fragment, { children: sortedTabs.map(({ index, ...tab }) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(import_react86.default.Fragment, { children: sortedTabs.map(({ index, ...tab }) => {
     const isActive = index === active;
     const hasSiblings = hasChildren(tabs, tab.group);
     const canClose = !props.internal && (!tab.primary || !hasSiblings);
-    return /* @__PURE__ */ (0, import_jsx_runtime365.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime372.jsxs)(
       Container29,
       {
         ...isActive ? { className: "active" } : {},
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(
             LabelItem_default,
             {
               children: tab.label,
@@ -18247,7 +20128,7 @@ var TabItem = (props) => {
               internal: props.internal
             }
           ),
-          canClose && /* @__PURE__ */ (0, import_jsx_runtime365.jsx)(
+          canClose && /* @__PURE__ */ (0, import_jsx_runtime372.jsx)(
             CloseComponent,
             {
               index,
@@ -18265,13 +20146,13 @@ var TabItem = (props) => {
 var TabItem_default = TabItem;
 
 // src/components/Tabs/styled.ts
-var import_styled_components78 = __toESM(require("styled-components"));
+var import_styled_components84 = __toESM(require("styled-components"));
 var delimiters = {
   blue: ["blue"],
   grey: ["warningGray"]
 };
-var ComponentContainer = import_styled_components78.default.div``;
-var Tabs = import_styled_components78.default.div`
+var ComponentContainer = import_styled_components84.default.div``;
+var Tabs = import_styled_components84.default.div`
   position: relative;
   overflow: hidden;
 
@@ -18286,7 +20167,7 @@ var Tabs = import_styled_components78.default.div`
     bottom: "s4",
     left: "0"
   }).split(" ");
-  return import_styled_components78.css`
+  return import_styled_components84.css`
       margin: ${top} 0 ${bottom} 0;
       padding: 0 ${right} 0 ${left};
     `;
@@ -18294,7 +20175,7 @@ var Tabs = import_styled_components78.default.div`
 
   ${({ theme: theme4, $internal: internal, $delimiter: delimiter }) => {
   const border = delimiter === "none" ? "none" : internal ? `1px solid ${theme4.getColor(...delimiters[delimiter || "grey"])}` : `2px solid ${theme4.getColor(...delimiters[delimiter || "blue"])}`;
-  return import_styled_components78.css`
+  return import_styled_components84.css`
       border-bottom: ${border};
       + ${ComponentContainer} {
         border: 1px solid ${theme4.getColor(...delimiters.grey)};
@@ -18323,12 +20204,12 @@ var Tabs = import_styled_components78.default.div`
 `;
 
 // src/components/Tabs/index.tsx
-var import_jsx_runtime366 = require("react/jsx-runtime");
-var VoidProvider = (props) => /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(import_react69.default.Fragment, { children: props.children });
+var import_jsx_runtime373 = require("react/jsx-runtime");
+var VoidProvider = (props) => /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(import_react87.default.Fragment, { children: props.children });
 var Component4 = (props) => {
   const components = props.components || {};
-  const [options, setOptions] = typeof props.options[1] === "function" ? props.options : (0, import_react69.useState)(props.options);
-  const [active, setActive] = Array.isArray(props.active) ? props.active : (0, import_react69.useState)(props.active);
+  const [options, setOptions] = typeof props.options[1] === "function" ? props.options : (0, import_react87.useState)(props.options);
+  const [active, setActive] = Array.isArray(props.active) ? props.active : (0, import_react87.useState)(props.active);
   const sortedTabs = sortTabs(options.map((tab, index) => ({ ...tab, index })));
   const activeTabIndex = sortedTabs.findIndex((tab) => tab.index === active);
   const divProps = filterObject(props, [
@@ -18342,15 +20223,15 @@ var Component4 = (props) => {
     "delimiter",
     "spacing"
   ]);
-  return /* @__PURE__ */ (0, import_jsx_runtime366.jsxs)(import_react69.default.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime373.jsxs)(import_react87.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
       Tabs,
       {
         ...divProps,
         $internal: props.internal,
         $delimiter: props.delimiter,
         $spacing: props.spacing,
-        children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
           ScrollButtons_default,
           {
             ...{
@@ -18358,7 +20239,7 @@ var Component4 = (props) => {
               tabsLength: options.length,
               internal: props.internal
             },
-            children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
               TabItem_default,
               {
                 active: [active, setActive],
@@ -18375,7 +20256,7 @@ var Component4 = (props) => {
     ),
     options.map((tab, index) => {
       if (tab.component === void 0) {
-        return /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(import_react69.default.Fragment, {}, index);
+        return /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(import_react87.default.Fragment, {}, index);
       }
       const Component5 = components[tab.component];
       const Provider7 = Component5.provider || VoidProvider;
@@ -18395,7 +20276,7 @@ var Component4 = (props) => {
           return s === label ? prev : { ...prev, label };
         });
       };
-      return /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
         Provider7,
         {
           label: tab.label,
@@ -18404,7 +20285,7 @@ var Component4 = (props) => {
           setLabel,
           ...index === active ? {
             active: true,
-            children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(ComponentContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime366.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(ComponentContainer, { children: /* @__PURE__ */ (0, import_jsx_runtime373.jsx)(
               Component5,
               {
                 data: tab.data,
@@ -18426,8 +20307,8 @@ var Tabs2 = Object.assign(Component4, {
 var Tabs_default = Tabs2;
 
 // src/components/TextArea/styles.ts
-var import_styled_components79 = __toESM(require("styled-components"));
-var Container30 = import_styled_components79.default.textarea`
+var import_styled_components85 = __toESM(require("styled-components"));
+var Container30 = import_styled_components85.default.textarea`
   width: ${({ $width: width }) => width};
   height: ${({ $height: height }) => height};
   resize: none;
@@ -18439,26 +20320,26 @@ var Container30 = import_styled_components79.default.textarea`
 `;
 
 // src/components/TextArea/index.tsx
-var import_jsx_runtime367 = require("react/jsx-runtime");
+var import_jsx_runtime374 = require("react/jsx-runtime");
 var TextArea = ({
   width,
   height,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime367.jsx)(Container30, { ...props, $width: width, $height: height });
+  return /* @__PURE__ */ (0, import_jsx_runtime374.jsx)(Container30, { ...props, $width: width, $height: height });
 };
 var TextArea_default = TextArea;
 
 // src/components/Toast/styles.ts
-var import_styled_components80 = __toESM(require("styled-components"));
-var Container31 = import_styled_components80.default.div`
+var import_styled_components86 = __toESM(require("styled-components"));
+var Container31 = import_styled_components86.default.div`
   border-radius: 4px;
-  width: ${({ $size: size3 }) => size3 === "large" ? "837px" : "460px"};
+  width: ${({ $size: size4 }) => size4 === "large" ? "837px" : "460px"};
   height: 88px;
   border: 1px solid transparent;
   position: relative;
 
-  ${({ $color: color }) => color === "success" && import_styled_components80.css`
+  ${({ $color: color }) => color === "success" && import_styled_components86.css`
       background-color: #fcfff5;
       opacity: 1;
       border-color: #a8c599;
@@ -18470,7 +20351,7 @@ var Container31 = import_styled_components80.default.div`
       }
     `}
 
-  ${({ $color: color }) => color === "error" && import_styled_components80.css`
+  ${({ $color: color }) => color === "error" && import_styled_components86.css`
       background-color: #fff6f6;
       opacity: 1;
       border-color: #973937;
@@ -18482,7 +20363,7 @@ var Container31 = import_styled_components80.default.div`
       }
     `}
 
-  ${({ $color: color }) => color === "warning" && import_styled_components80.css`
+  ${({ $color: color }) => color === "warning" && import_styled_components86.css`
       background-color: #fffaf3;
       opacity: 1;
       border-color: #ccbea0;
@@ -18503,7 +20384,7 @@ var Container31 = import_styled_components80.default.div`
     height: 13px;
   }
 `;
-var IconContainer3 = import_styled_components80.default.div`
+var IconContainer3 = import_styled_components86.default.div`
   width: 100%;
   display: flex;
   align-items: center;
@@ -18511,7 +20392,7 @@ var IconContainer3 = import_styled_components80.default.div`
   padding: 14px 14px 0 0;
   margin: 0;
 `;
-var IconContent = import_styled_components80.default.div`
+var IconContent = import_styled_components86.default.div`
   width: 100%;
   padding: 13px 0 21px 28px;
   display: flex;
@@ -18530,20 +20411,20 @@ var IconContent = import_styled_components80.default.div`
 `;
 
 // src/components/Toast/index.tsx
-var import_jsx_runtime368 = require("react/jsx-runtime");
+var import_jsx_runtime375 = require("react/jsx-runtime");
 var Toast = ({
-  size: size3,
+  size: size4,
   color,
   title,
   description,
   onClose: handlClose,
   ...props
 }) => {
-  return /* @__PURE__ */ (0, import_jsx_runtime368.jsxs)(Container31, { ...props, $size: size3, $color: color, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime368.jsx)(IconContainer3, { children: /* @__PURE__ */ (0, import_jsx_runtime368.jsx)(Icon_default, { type: "feather", icon: "x", onClick: handlClose }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime368.jsxs)(IconContent, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime368.jsx)("h4", { children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime368.jsxs)("p", { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime375.jsxs)(Container31, { ...props, $size: size4, $color: color, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime375.jsx)(IconContainer3, { children: /* @__PURE__ */ (0, import_jsx_runtime375.jsx)(Icon_default, { type: "feather", icon: "x", onClick: handlClose }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime375.jsxs)(IconContent, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime375.jsx)("h4", { children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime375.jsxs)("p", { children: [
         " ",
         description
       ] })
@@ -18553,15 +20434,15 @@ var Toast = ({
 var Toast_default = Toast;
 
 // src/components/Zoom/index.tsx
-var import_react70 = __toESM(require("react"));
+var import_react88 = __toESM(require("react"));
 
 // src/components/Zoom/styles.ts
-var import_styled_components81 = __toESM(require("styled-components"));
-var Image = import_styled_components81.default.img`
+var import_styled_components87 = __toESM(require("styled-components"));
+var Image = import_styled_components87.default.img`
   max-width: 100%;
   max-height: 100%;
 `;
-var Container32 = import_styled_components81.default.div`
+var Container32 = import_styled_components87.default.div`
   position: relative;
   display: inline-flex;
 
@@ -18590,7 +20471,7 @@ var Container32 = import_styled_components81.default.div`
 }};
   }
 `;
-var Dimmer = import_styled_components81.default.div`
+var Dimmer = import_styled_components87.default.div`
   position: absolute;
   top: 0;
   left: 0;
@@ -18608,10 +20489,10 @@ var Dimmer = import_styled_components81.default.div`
     opacity: 1;
   }
 `;
-var Button7 = (0, import_styled_components81.default)(Button_default)`
+var Button7 = (0, import_styled_components87.default)(Button_default)`
   background-color: ${({ theme: theme4 }) => theme4.getColor("white", 50)};
 `;
-var ModalContent = import_styled_components81.default.div`
+var ModalContent = import_styled_components87.default.div`
   position: absolute;
   width: 100%;
   height: 100%;
@@ -18625,12 +20506,12 @@ var ModalContent = import_styled_components81.default.div`
 `;
 
 // src/components/Zoom/index.tsx
-var import_jsx_runtime369 = require("react/jsx-runtime");
+var import_jsx_runtime376 = require("react/jsx-runtime");
 var Zoom = (props) => {
   const { src, width, height, ...imgProps } = props;
-  const [modalOpened, setModalOpened] = (0, import_react70.useState)(false);
-  return /* @__PURE__ */ (0, import_jsx_runtime369.jsxs)(import_react70.default.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime369.jsxs)(
+  const [modalOpened, setModalOpened] = (0, import_react88.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime376.jsxs)(import_react88.default.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime376.jsxs)(
       Container32,
       {
         ...imgProps,
@@ -18638,8 +20519,8 @@ var Zoom = (props) => {
         $width: width,
         $height: height,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(Image, { src, alt: "zoom" }),
-          /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(Dimmer, { children: /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(Image, { src, alt: "zoom" }),
+          /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(Dimmer, { children: /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(
             Button7,
             {
               content: "Zoom",
@@ -18650,14 +20531,14 @@ var Zoom = (props) => {
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(
       Modal_default,
       {
         openState: [modalOpened, setModalOpened],
         size: "large",
         title: "Zoom",
         closeOnClickOutside: true,
-        children: /* @__PURE__ */ (0, import_jsx_runtime369.jsx)(ModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime369.jsx)("img", { src, alt: "zoom" }) })
+        children: /* @__PURE__ */ (0, import_jsx_runtime376.jsx)(ModalContent, { children: /* @__PURE__ */ (0, import_jsx_runtime376.jsx)("img", { src, alt: "zoom" }) })
       }
     )
   ] });
@@ -18684,6 +20565,7 @@ var Zoom_default = Zoom;
   MwPlaceholder,
   MwProgressBar,
   MwScrollContainer,
+  MwSelect,
   MwSignature,
   MwTabs,
   MwTextArea,