@chekinapp/ui 0.0.85 → 0.0.87

package/dist/index.cjs

@@ -203,6 +203,7 @@ __export(index_exports, {
   RatingProgress: () => RatingProgress,
   RatingRadioGroup: () => RatingRadioGroup,
   RatingStars: () => RatingStars,
+  ResponsiveDropdown: () => ResponsiveDropdown,
   ResponsiveSheet: () => ResponsiveSheet,
   RotateArrow: () => RotateArrow,
   ScrollArea: () => ScrollArea,
@@ -3784,7 +3785,7 @@ var DialogContent = React15.forwardRef(
         ]
       }
     );
-    const portalContainer = container || (typeof window !== "undefined" ? window.chekinCustomDocument?.body : void 0);
+    const portalContainer = container || getCustomContainer();
     return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DialogPortal, { "data-slot": "dialog-portal", container: portalContainer, children: lockScroll ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
       DialogOverlay,
       {
@@ -6107,8 +6108,8 @@ function Modal({
   onClose,
   children,
   withCloseButton = true,
-  closeOnDocumentClick = true,
-  closeOnEscape = true,
+  closeOnDocumentClick = false,
+  closeOnEscape = false,
   scrollableOverlay,
   className,
   title,
@@ -6117,6 +6118,7 @@ function Modal({
   iconSrc,
   iconAlt,
   iconProps = { width: 84 },
+  iconClassName,
   buttons,
   lockScroll = true,
   container,
@@ -6162,7 +6164,7 @@ function Modal({
             children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(import_lucide_react18.X, { className: "h-5 w-5" })
           }
         ),
-        (icon || iconSrc || iconProps?.src) && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: "modal__icon mx-auto mt-4 select-none", children: icon ?? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("img", { src: iconSrc, alt: iconAlt ?? "", ...iconProps }) }),
+        (icon || iconSrc || iconProps?.src) && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("div", { className: cn("modal__icon mx-auto mt-4 select-none", iconClassName), children: icon ?? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)("img", { src: iconSrc, alt: iconAlt ?? "", ...iconProps }) }),
         title ? /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogTitle, { className: cn("modal__title", "px-6 text-lg font-bold"), children: title }) : /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogVisuallyHidden, { children: /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogTitle, { children: "Dialog" }) }),
         text && /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(DialogDescription, { className: cn("modal__text", "text-base"), children: text }),
         children,
@@ -10408,7 +10410,7 @@ function VerticalTabs({
           if (value !== stepValue) {
             return null;
           }
-          return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)("div", { className: "h-full w-full", children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(Slider, { children: images?.map((image) => /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)("div", { className: "h-full w-full", children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(Carousel, { children: images?.map((image) => /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
             "img",
             {
               src: image,
@@ -12306,11 +12308,110 @@ function ResponsiveSheet({
   ) });
 }
 
-// src/airbnb/input/Input.tsx
+// src/responsive-dropdown/ResponsiveDropdown.tsx
 var React46 = __toESM(require("react"), 1);
 var import_jsx_runtime145 = require("react/jsx-runtime");
+function ResponsiveDropdown({
+  trigger,
+  options,
+  children,
+  side,
+  align,
+  disabled,
+  title,
+  className,
+  dropdownClassName,
+  drawerClassName
+}) {
+  const { isMatch: isMobile2 } = useScreenResize(DEVICE.mobileXL);
+  const isMobileMode = isMobile2 && isMobileModalModeAvailable();
+  const [open, setOpen] = React46.useState(false);
+  const visibleOptions = options?.filter((option) => !option.hidden) ?? [];
+  const renderTrigger = (isOpen) => typeof trigger === "function" ? trigger(isOpen) : trigger;
+  const handleOpenChange = (nextOpen) => {
+    if (disabled) {
+      return;
+    }
+    setOpen(nextOpen);
+  };
+  const handleOptionClick = (option) => (event) => {
+    if (disabled || option.disabled) {
+      return;
+    }
+    option.onClick?.(event);
+    setOpen(false);
+  };
+  if (isMobileMode) {
+    return /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)(import_jsx_runtime145.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+        "div",
+        {
+          className: "responsive-dropdown__mobile-trigger",
+          onClick: () => handleOpenChange(true),
+          children: renderTrigger(open)
+        }
+      ),
+      /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)(
+        DrawerContent,
+        {
+          onClose: () => setOpen(false),
+          lockScroll: false,
+          className: cn("px-0 pb-2", className, drawerClassName),
+          children: [
+            title ? /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(DrawerTitle, { className: "sr-only", children: title }) : null,
+            /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)("div", { className: "flex flex-col", children: [
+              visibleOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+                "div",
+                {
+                  role: "button",
+                  tabIndex: 0,
+                  "aria-disabled": option.disabled,
+                  onClick: handleOptionClick(option),
+                  className: cn(
+                    "cursor-pointer px-5 py-3 text-base font-medium text-[var(--chekin-color-brand-navy)] outline-none hover:bg-gray-50",
+                    option.disabled && "pointer-events-none opacity-50"
+                  ),
+                  children: option.label
+                },
+                option.id
+              )),
+              children
+            ] })
+          ]
+        }
+      ) })
+    ] });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)(DropdownMenu, { open, onOpenChange: handleOpenChange, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(DropdownMenuTrigger, { asChild: true, disabled, children: renderTrigger(open) }),
+    /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)(
+      DropdownMenuContent,
+      {
+        side,
+        align,
+        className: cn("min-w-[295px]", className, dropdownClassName),
+        children: [
+          visibleOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+            DropdownMenuItem,
+            {
+              disabled: option.disabled,
+              onClick: handleOptionClick(option),
+              children: option.label
+            },
+            option.id
+          )),
+          children
+        ]
+      }
+    )
+  ] });
+}
+
+// src/airbnb/input/Input.tsx
+var React47 = __toESM(require("react"), 1);
+var import_jsx_runtime146 = require("react/jsx-runtime");
 var getInputValue = (value) => value != null ? String(value) : "";
-var AirbnbInput = React46.forwardRef(
+var AirbnbInput = React47.forwardRef(
   ({
     variant = "default",
     label,
@@ -12339,15 +12440,15 @@ var AirbnbInput = React46.forwardRef(
     placeholder,
     ...props
   }, ref) => {
-    const generatedId = React46.useId();
-    const inputRef = React46.useRef(null);
+    const generatedId = React47.useId();
+    const inputRef = React47.useRef(null);
     const inputId = id ?? generatedId;
     const fieldId = `${inputId}-field`;
     const labelId = `${inputId}-label`;
     const errorId = `${inputId}-error`;
     const accessibleLabel = placeholder ?? label;
-    const [isFocused, setIsFocused] = React46.useState(false);
-    const [currentValue, setCurrentValue] = React46.useState(
+    const [isFocused, setIsFocused] = React47.useState(false);
+    const [currentValue, setCurrentValue] = React47.useState(
       () => value != null ? getInputValue(value) : getInputValue(defaultValue)
     );
     const resolvedValue = value != null ? getInputValue(value) : currentValue;
@@ -12357,11 +12458,11 @@ var AirbnbInput = React46.forwardRef(
     const triggerError = error ?? invalid;
     const hasLabelMeta = Boolean(optional) || Boolean(tooltip);
     const isBlocked = Boolean(disabled) || Boolean(loading);
-    React46.useLayoutEffect(() => {
+    React47.useLayoutEffect(() => {
       const nextValue = value != null ? getInputValue(value) : getInputValue(inputRef.current?.value);
       setCurrentValue((prevValue) => prevValue === nextValue ? prevValue : nextValue);
     }, [value]);
-    const setRefs = React46.useCallback(
+    const setRefs = React47.useCallback(
       (node) => {
         inputRef.current = node;
         if (node && value == null) {
@@ -12391,7 +12492,7 @@ var AirbnbInput = React46.forwardRef(
       setIsFocused(false);
       onBlur?.(event);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime145.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime146.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
       FieldTrigger,
       {
         as: "div",
@@ -12423,7 +12524,7 @@ var AirbnbInput = React46.forwardRef(
         forceFloatingLabel: shouldShowLabel,
         forceLabelText: hasLabelMeta,
         hideErrorMessage: !renderErrorMessage,
-        children: /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
           "input",
           {
             ...props,
@@ -12459,14 +12560,14 @@ var AirbnbInput = React46.forwardRef(
 AirbnbInput.displayName = "Input";
 
 // src/airbnb/phone-field/PhoneField.tsx
-var React52 = __toESM(require("react"), 1);
+var React53 = __toESM(require("react"), 1);
 var import_lucide_react43 = require("lucide-react");
 
 // src/airbnb/select/Select.tsx
-var React51 = __toESM(require("react"), 1);
+var React52 = __toESM(require("react"), 1);
 
 // src/airbnb/select/SelectDesktopMenu.tsx
-var import_jsx_runtime146 = require("react/jsx-runtime");
+var import_jsx_runtime147 = require("react/jsx-runtime");
 function SelectDesktopMenu({
   id,
   options,
@@ -12485,7 +12586,7 @@ function SelectDesktopMenu({
   noOptionsMessage
 }) {
   const emptyMessage = noOptionsMessage?.();
-  return /* @__PURE__ */ (0, import_jsx_runtime146.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime147.jsxs)(
     "div",
     {
       id,
@@ -12498,12 +12599,12 @@ function SelectDesktopMenu({
       onKeyDown,
       className: cn("max-h-[280px] overflow-y-auto p-2 outline-none", menuClassName),
       children: [
-        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime146.jsx)("div", { className: "px-4 py-3 text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
+        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime147.jsx)("div", { className: "px-4 py-3 text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
         options.map((option, index) => {
           const isSelected = selectedValue?.value === option.value;
           const isHighlighted = index === highlightedIndex;
           const optionKey = `${String(option.value)}-${index}`;
-          return /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
             "button",
             {
               id: getOptionId2(index),
@@ -12535,7 +12636,7 @@ function SelectDesktopMenu({
 }
 
 // src/airbnb/select/SelectDesktopContent.tsx
-var import_jsx_runtime147 = require("react/jsx-runtime");
+var import_jsx_runtime148 = require("react/jsx-runtime");
 function SelectDesktopContent({
   isOpen,
   listboxId,
@@ -12556,14 +12657,14 @@ function SelectDesktopContent({
   noOptionsMessage
 }) {
   if (!isOpen) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
     "div",
     {
       className: cn(
         "absolute left-0 right-0 top-[calc(100%+8px)] z-20 overflow-hidden rounded-[20px] border border-[#DEDAD2] bg-white shadow-[0_14px_30px_rgba(18,18,18,0.08)]",
         dropdownClassName
       ),
-      children: /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
         SelectDesktopMenu,
         {
           id: listboxId,
@@ -12661,7 +12762,7 @@ function getMobileOptionStyles(index, scrollTop) {
 }
 
 // src/airbnb/select/SelectMobileWheel.tsx
-var import_jsx_runtime148 = require("react/jsx-runtime");
+var import_jsx_runtime149 = require("react/jsx-runtime");
 function SelectMobileWheel({
   id,
   options,
@@ -12680,7 +12781,7 @@ function SelectMobileWheel({
 }) {
   const spacerHeight2 = getWheelSpacerHeight();
   const emptyMessage = noOptionsMessage?.();
-  return /* @__PURE__ */ (0, import_jsx_runtime148.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime149.jsxs)(
     "div",
     {
       id,
@@ -12692,10 +12793,10 @@ function SelectMobileWheel({
       onKeyDown,
       className: cn("relative overflow-hidden outline-none", menuClassName),
       children: [
-        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime148.jsx)("div", { className: "flex min-h-[160px] items-center justify-center px-4 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
-        /* @__PURE__ */ (0, import_jsx_runtime148.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
-        /* @__PURE__ */ (0, import_jsx_runtime148.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
-        /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
+        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime149.jsx)("div", { className: "flex min-h-[160px] items-center justify-center px-4 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
+        /* @__PURE__ */ (0, import_jsx_runtime149.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
+        /* @__PURE__ */ (0, import_jsx_runtime149.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
+        /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -12705,7 +12806,7 @@ function SelectMobileWheel({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime148.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime149.jsxs)(
           "div",
           {
             ref: listRef,
@@ -12720,11 +12821,11 @@ function SelectMobileWheel({
               WebkitOverflowScrolling: "touch"
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime148.jsx)("div", { style: { height: `${spacerHeight2}px` } }),
+              /* @__PURE__ */ (0, import_jsx_runtime149.jsx)("div", { style: { height: `${spacerHeight2}px` } }),
               options.map((option, index) => {
                 const { distance, style } = getMobileOptionStyles(index, scrollTop);
                 const optionKey = `${String(option.value)}-${index}`;
-                return /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
                   "button",
                   {
                     id: getOptionId2(index),
@@ -12745,7 +12846,7 @@ function SelectMobileWheel({
                   optionKey
                 );
               }),
-              /* @__PURE__ */ (0, import_jsx_runtime148.jsx)("div", { style: { height: `${spacerHeight2}px` } })
+              /* @__PURE__ */ (0, import_jsx_runtime149.jsx)("div", { style: { height: `${spacerHeight2}px` } })
             ]
           }
         )
@@ -12755,7 +12856,7 @@ function SelectMobileWheel({
 }
 
 // src/airbnb/select/SelectMobileContent.tsx
-var import_jsx_runtime149 = require("react/jsx-runtime");
+var import_jsx_runtime150 = require("react/jsx-runtime");
 function SelectMobileContent({
   open,
   onOpenChange,
@@ -12779,11 +12880,11 @@ function SelectMobileContent({
   getOptionId: getOptionId2,
   noOptionsMessage
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime149.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
-    /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(DrawerDescription, { className: "sr-only", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime149.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime150.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
+    /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime150.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(
         SelectMobileWheel,
         {
           id: listboxId,
@@ -12802,16 +12903,16 @@ function SelectMobileContent({
           noOptionsMessage
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
+      /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
     ] })
   ] }) });
 }
 
 // src/airbnb/select/SelectTrigger.tsx
-var React47 = __toESM(require("react"), 1);
+var React48 = __toESM(require("react"), 1);
 var import_lucide_react42 = require("lucide-react");
-var import_jsx_runtime150 = require("react/jsx-runtime");
-var SelectTrigger2 = React47.forwardRef(
+var import_jsx_runtime151 = require("react/jsx-runtime");
+var SelectTrigger2 = React48.forwardRef(
   ({
     id,
     open,
@@ -12836,7 +12937,7 @@ var SelectTrigger2 = React47.forwardRef(
     onKeyDown,
     onBlur
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
       FieldTrigger,
       {
         id,
@@ -12865,7 +12966,7 @@ var SelectTrigger2 = React47.forwardRef(
         onClick,
         onKeyDown,
         onBlur,
-        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
           import_lucide_react42.ChevronDown,
           {
             className: open ? "h-6 w-6 rotate-180 text-[#1F1F1B] transition-transform" : "h-6 w-6 text-[#1F1F1B] transition-transform"
@@ -12878,7 +12979,7 @@ var SelectTrigger2 = React47.forwardRef(
 SelectTrigger2.displayName = "SelectTrigger";
 
 // src/airbnb/select/useDesktopSelect.ts
-var React48 = __toESM(require("react"), 1);
+var React49 = __toESM(require("react"), 1);
 function useDesktopSelect({
   isMobile: isMobile2,
   isOpen,
@@ -12887,12 +12988,12 @@ function useDesktopSelect({
   disabled,
   onChange
 }) {
-  const [highlightedIndex, setHighlightedIndex] = React48.useState(-1);
-  const triggerRef = React48.useRef(null);
-  const listRef = React48.useRef(null);
-  const optionRefs = React48.useRef([]);
+  const [highlightedIndex, setHighlightedIndex] = React49.useState(-1);
+  const triggerRef = React49.useRef(null);
+  const listRef = React49.useRef(null);
+  const optionRefs = React49.useRef([]);
   const selectedIndex = getOptionIndex(options, value);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!isOpen || isMobile2) return;
     setHighlightedIndex((currentIndex) => {
       if (currentIndex >= 0) {
@@ -12907,34 +13008,34 @@ function useDesktopSelect({
       window.cancelAnimationFrame(frameId);
     };
   }, [isMobile2, isOpen, options, selectedIndex]);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!isOpen || isMobile2 || highlightedIndex < 0) return;
     optionRefs.current[highlightedIndex]?.scrollIntoView({
       block: "nearest"
     });
   }, [highlightedIndex, isMobile2, isOpen]);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (isOpen) return;
     setHighlightedIndex(-1);
   }, [isOpen]);
-  const focusTrigger = React48.useCallback(() => {
+  const focusTrigger = React49.useCallback(() => {
     triggerRef.current?.focus();
   }, []);
-  const handleSelect = React48.useCallback(
+  const handleSelect = React49.useCallback(
     (option) => {
       if (option.isDisabled || disabled) return;
       onChange(option);
     },
     [disabled, onChange]
   );
-  const openMenu = React48.useCallback(
+  const openMenu = React49.useCallback(
     (targetIndex) => {
       const fallbackIndex = selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
       setHighlightedIndex(targetIndex ?? fallbackIndex);
     },
     [options, selectedIndex]
   );
-  const handleTriggerKeyDown = React48.useCallback(
+  const handleTriggerKeyDown = React49.useCallback(
     (event, onOpen) => {
       if (disabled) return;
       if (event.key === "ArrowDown") {
@@ -12959,7 +13060,7 @@ function useDesktopSelect({
     },
     [disabled, openMenu, options, selectedIndex]
   );
-  const handleMenuKeyDown = React48.useCallback(
+  const handleMenuKeyDown = React49.useCallback(
     (event, onClose) => {
       if (event.key === "Escape") {
         event.preventDefault();
@@ -13009,7 +13110,7 @@ function useDesktopSelect({
     },
     [focusTrigger, highlightedIndex, onChange, options]
   );
-  const setOptionRef = React48.useCallback(
+  const setOptionRef = React49.useCallback(
     (index, node) => {
       optionRefs.current[index] = node;
     },
@@ -13029,23 +13130,23 @@ function useDesktopSelect({
 }
 
 // src/airbnb/select/useMobileSelectWheel.ts
-var React49 = __toESM(require("react"), 1);
+var React50 = __toESM(require("react"), 1);
 function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, disabled }) {
-  const [pendingValue, setPendingValue] = React49.useState(
+  const [pendingValue, setPendingValue] = React50.useState(
     value ?? null
   );
-  const [mobileScrollTop, setMobileScrollTop] = React49.useState(0);
-  const mobileListRef = React49.useRef(null);
-  const scrollSettleTimeoutRef = React49.useRef(null);
-  const scrollAnimationFrameRef = React49.useRef(null);
-  const getTargetIndex = React49.useCallback(
+  const [mobileScrollTop, setMobileScrollTop] = React50.useState(0);
+  const mobileListRef = React50.useRef(null);
+  const scrollSettleTimeoutRef = React50.useRef(null);
+  const scrollAnimationFrameRef = React50.useRef(null);
+  const getTargetIndex = React50.useCallback(
     (targetValue) => {
       const selectedIndex = getOptionIndex(options, targetValue);
       return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
     },
     [options]
   );
-  const syncScrollPosition = React49.useCallback(
+  const syncScrollPosition = React50.useCallback(
     (targetValue, behavior = "instant") => {
       const targetIndex = getTargetIndex(targetValue);
       if (targetIndex < 0) return;
@@ -13064,27 +13165,27 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     },
     [getTargetIndex, options]
   );
-  const clearScrollSettleTimeout = React49.useCallback(() => {
+  const clearScrollSettleTimeout = React50.useCallback(() => {
     if (scrollSettleTimeoutRef.current === null) return;
     window.clearTimeout(scrollSettleTimeoutRef.current);
     scrollSettleTimeoutRef.current = null;
   }, []);
-  const clearScrollAnimationFrame = React49.useCallback(() => {
+  const clearScrollAnimationFrame = React50.useCallback(() => {
     if (scrollAnimationFrameRef.current === null) return;
     window.cancelAnimationFrame(scrollAnimationFrameRef.current);
     scrollAnimationFrameRef.current = null;
   }, []);
-  React49.useEffect(
+  React50.useEffect(
     () => () => {
       clearScrollSettleTimeout();
       clearScrollAnimationFrame();
     },
     [clearScrollAnimationFrame, clearScrollSettleTimeout]
   );
-  React49.useEffect(() => {
+  React50.useEffect(() => {
     setPendingValue(value ?? null);
   }, [value]);
-  React49.useLayoutEffect(() => {
+  React50.useLayoutEffect(() => {
     if (!isMobile2 || !isOpen) return;
     const frameId = window.requestAnimationFrame(() => {
       syncScrollPosition(value ?? null, "instant");
@@ -13093,7 +13194,7 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
       window.cancelAnimationFrame(frameId);
     };
   }, [isMobile2, isOpen, syncScrollPosition, value]);
-  const settleScroll = React49.useCallback(() => {
+  const settleScroll = React50.useCallback(() => {
     if (!mobileListRef.current) return;
     const nextIndex = Math.round(mobileListRef.current.scrollTop / MOBILE_OPTION_HEIGHT);
     const nextOption = options[nextIndex];
@@ -13105,13 +13206,13 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     }
     setPendingValue(nextOption);
   }, [options, pendingValue]);
-  const scheduleScrollSettle = React49.useCallback(() => {
+  const scheduleScrollSettle = React50.useCallback(() => {
     clearScrollSettleTimeout();
     scrollSettleTimeoutRef.current = window.setTimeout(() => {
       settleScroll();
     }, MOBILE_SCROLL_SETTLE_DELAY);
   }, [clearScrollSettleTimeout, settleScroll]);
-  const handleScroll = React49.useCallback(() => {
+  const handleScroll = React50.useCallback(() => {
     if (!mobileListRef.current) return;
     const nextScrollTop = mobileListRef.current.scrollTop;
     clearScrollAnimationFrame();
@@ -13121,7 +13222,7 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     });
     scheduleScrollSettle();
   }, [clearScrollAnimationFrame, scheduleScrollSettle]);
-  const focusOptionByIndex = React49.useCallback(
+  const focusOptionByIndex = React50.useCallback(
     (index, behavior = "instant", updatePendingImmediately = behavior === "instant") => {
       if (!mobileListRef.current || index < 0 || index >= options.length) return;
       const option = options[index];
@@ -13139,7 +13240,7 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     },
     [options, scheduleScrollSettle]
   );
-  const handleOptionClick = React49.useCallback(
+  const handleOptionClick = React50.useCallback(
     (option) => {
       if (!mobileListRef.current || disabled || option.isDisabled) return;
       const optionIndex = getOptionIndex(options, option);
@@ -13148,7 +13249,7 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     },
     [disabled, focusOptionByIndex, options]
   );
-  const moveByStep = React49.useCallback(
+  const moveByStep = React50.useCallback(
     (step) => {
       const currentIndex = getOptionIndex(options, pendingValue);
       const fallbackIndex = step === 1 ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
@@ -13160,7 +13261,7 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     },
     [focusOptionByIndex, options, pendingValue]
   );
-  const moveToBoundary = React49.useCallback(
+  const moveToBoundary = React50.useCallback(
     (boundary) => {
       const targetIndex = boundary === "start" ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
       if (targetIndex >= 0) {
@@ -13169,7 +13270,7 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
     },
     [focusOptionByIndex, options]
   );
-  const syncPendingValue = React49.useCallback(
+  const syncPendingValue = React50.useCallback(
     (nextValue) => {
       const normalizedValue = nextValue ?? null;
       const matchedIndex = getOptionIndex(options, normalizedValue);
@@ -13197,9 +13298,9 @@ function useMobileSelectWheel({ isMobile: isMobile2, isOpen, options, value, dis
 }
 
 // src/airbnb/select/useSelectIds.ts
-var React50 = __toESM(require("react"), 1);
+var React51 = __toESM(require("react"), 1);
 function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
-  const reactId = React50.useId().replace(/:/g, "");
+  const reactId = React51.useId().replace(/:/g, "");
   const baseId = name ? `select-${name}` : `select-${reactId}`;
   const triggerId = `${baseId}-trigger`;
   const labelId = `${baseId}-label`;
@@ -13209,7 +13310,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
   const listboxId = `${baseId}-listbox`;
   const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
   const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
-  const getOptionId2 = React50.useCallback(
+  const getOptionId2 = React51.useCallback(
     (index) => `${baseId}-option-${index}`,
     [baseId]
   );
@@ -13227,8 +13328,8 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
 }
 
 // src/airbnb/select/Select.tsx
-var import_jsx_runtime151 = require("react/jsx-runtime");
-var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
+var import_jsx_runtime152 = require("react/jsx-runtime");
+var AirbnbSelect = React52.forwardRef(function AirbnbSelect2({
   options = [],
   value,
   onChange,
@@ -13255,8 +13356,8 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
   noOptionsMessage
 }, ref) {
   const { isMatch: isMobile2 } = useScreenResize(DEVICE.mobileXL);
-  const [isOpen, setIsOpen] = React51.useState(false);
-  const containerRef = React51.useRef(null);
+  const [isOpen, setIsOpen] = React52.useState(false);
+  const containerRef = React52.useRef(null);
   const hasValue = Boolean(value);
   const helperText = placeholder ?? label;
   const shouldDescribeHelperText = !hasValue && helperText !== label;
@@ -13317,12 +13418,12 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
     onOutsideClick: () => setIsOpen(false),
     isDisabled: !isOpen || isMobile2
   });
-  React51.useEffect(() => {
+  React52.useEffect(() => {
     if (isBlocked) {
       setIsOpen(false);
     }
   }, [isBlocked]);
-  React51.useEffect(
+  React52.useEffect(
     function setCorrectOptionIfThereIsOnlyValue() {
       if (value?.value === void 0 || value.value === null || value.label !== "") {
         return;
@@ -13334,7 +13435,7 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
     },
     [onChange, options, value]
   );
-  const handleMobileOpenChange = React51.useCallback(
+  const handleMobileOpenChange = React52.useCallback(
     (nextOpen) => {
       if (isBlocked && nextOpen) return;
       setIsOpen(nextOpen);
@@ -13345,7 +13446,7 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
     },
     [focusTrigger, isBlocked, syncPendingValue, value]
   );
-  const handleMobileDone = React51.useCallback(() => {
+  const handleMobileDone = React52.useCallback(() => {
     if (isBlocked) return;
     const finalOption = pendingValue;
     if (finalOption && finalOption.value !== value?.value) {
@@ -13354,7 +13455,7 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
     setIsOpen(false);
     focusTrigger();
   }, [focusTrigger, isBlocked, onChange, pendingValue, value]);
-  const handleTriggerClick = React51.useCallback(() => {
+  const handleTriggerClick = React52.useCallback(() => {
     if (isBlocked) return;
     setIsOpen((prev) => {
       const nextOpen = !prev;
@@ -13407,13 +13508,13 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
       handleMobileOpenChange(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime151.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
     "div",
     {
       ref: containerRef,
       className: cn("relative w-full max-w-[var(--max-field-width)]", className),
       children: [
-        name && /* @__PURE__ */ (0, import_jsx_runtime151.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
+        name && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
         renderTrigger ? renderTrigger({
           id: triggerId,
           open: isOpen,
@@ -13435,7 +13536,7 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
           onClick: handleTriggerClick,
           onKeyDown: handleRootTriggerKeyDown,
           onBlur
-        }) : /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+        }) : /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
           SelectTrigger2,
           {
             id: triggerId,
@@ -13463,7 +13564,7 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
             onBlur
           }
         ),
-        isMobile2 ? /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+        isMobile2 ? /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
           SelectMobileContent,
           {
             open: isOpen,
@@ -13488,7 +13589,7 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
             getOptionId: getOptionId2,
             noOptionsMessage
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
           SelectDesktopContent,
           {
             isOpen,
@@ -13522,13 +13623,13 @@ var AirbnbSelect = React51.forwardRef(function AirbnbSelect2({
 });
 
 // src/airbnb/phone-field/PhoneField.tsx
-var import_jsx_runtime152 = require("react/jsx-runtime");
+var import_jsx_runtime153 = require("react/jsx-runtime");
 function formatPhoneCodeOptionLabel(option) {
   const label = String(option.label);
   const value = String(option.value);
   return label.includes(value) ? label : `${label} (${value})`;
 }
-var PhoneField = React52.forwardRef(
+var PhoneField = React53.forwardRef(
   ({
     variant = "default",
     label,
@@ -13552,8 +13653,8 @@ var PhoneField = React52.forwardRef(
     mobileTitle,
     codePlaceholder = "+00"
   }, ref) => {
-    const inputId = React52.useId();
-    const codeOptions = React52.useMemo(
+    const inputId = React53.useId();
+    const codeOptions = React53.useMemo(
       () => options.map((option) => ({
         value: option.value,
         label: formatPhoneCodeOptionLabel(option),
@@ -13561,7 +13662,7 @@ var PhoneField = React52.forwardRef(
       })),
       [options]
     );
-    const selectedCodeOption = React52.useMemo(
+    const selectedCodeOption = React53.useMemo(
       () => codeOptions.find((option) => option.value === value?.code) ?? null,
       [codeOptions, value?.code]
     );
@@ -13569,9 +13670,9 @@ var PhoneField = React52.forwardRef(
     const hasInvalidState = Boolean(error) || Boolean(invalid);
     const isBlocked = Boolean(disabled) || Boolean(loading);
     const isCodeBlocked = isBlocked || Boolean(codeReadOnly);
-    return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
-      name && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
-      codeName && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
+      name && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
+      codeName && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
         "input",
         {
           type: "hidden",
@@ -13580,7 +13681,7 @@ var PhoneField = React52.forwardRef(
           disabled
         }
       ),
-      numberName && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+      numberName && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
         "input",
         {
           type: "hidden",
@@ -13589,7 +13690,7 @@ var PhoneField = React52.forwardRef(
           disabled
         }
       ),
-      topLabel && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+      topLabel && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
         "label",
         {
           htmlFor: inputId,
@@ -13597,8 +13698,8 @@ var PhoneField = React52.forwardRef(
           children: topLabel
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("div", { className: "flex items-stretch", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: "flex items-stretch", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
           AirbnbSelect,
           {
             ref,
@@ -13629,7 +13730,7 @@ var PhoneField = React52.forwardRef(
               onClick,
               onKeyDown,
               valueLabel
-            }) => /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
+            }) => /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)(
               "button",
               {
                 id,
@@ -13651,8 +13752,8 @@ var PhoneField = React52.forwardRef(
                   triggerDisabled ? "cursor-not-allowed opacity-50" : triggerLoading ? "cursor-progress" : "cursor-pointer"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("span", { children: valueLabel ?? codePlaceholder }),
-                  /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("span", { children: valueLabel ?? codePlaceholder }),
+                  /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
                     import_lucide_react43.ChevronDown,
                     {
                       className: cn("h-5 w-5 transition-transform", open ? "rotate-180" : ""),
@@ -13664,7 +13765,7 @@ var PhoneField = React52.forwardRef(
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
           AirbnbInput,
           {
             id: inputId,
@@ -13696,23 +13797,23 @@ var PhoneField = React52.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(FieldErrorMessage, { message: error })
+      error && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(FieldErrorMessage, { message: error })
     ] });
   }
 );
 PhoneField.displayName = "PhoneField";
 
 // src/airbnb/search-input/SearchInput.tsx
-var React53 = __toESM(require("react"), 1);
+var React54 = __toESM(require("react"), 1);
 var import_react_i18next25 = require("react-i18next");
 var import_lucide_react44 = require("lucide-react");
-var import_jsx_runtime153 = require("react/jsx-runtime");
-var AirbnbSearchInput = React53.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
+var import_jsx_runtime154 = require("react/jsx-runtime");
+var AirbnbSearchInput = React54.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
   const { t } = (0, import_react_i18next25.useTranslation)();
   const placeholderText = placeholder || t("search_property") + "...";
-  return /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(import_lucide_react44.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
-    /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime154.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(import_lucide_react44.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
+    /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
       "input",
       {
         ...props,
@@ -13731,13 +13832,13 @@ var AirbnbSearchInput = React53.forwardRef(({ onReset, placeholder, wrapperClass
         )
       }
     ),
-    onReset && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
+    onReset && /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
       Button,
       {
         variant: "ghost",
         onClick: onReset,
         className: "absolute right-0 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]",
-        children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(import_lucide_react44.X, { className: "h-5 w-5" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(import_lucide_react44.X, { className: "h-5 w-5" })
       }
     )
   ] });
@@ -13745,12 +13846,12 @@ var AirbnbSearchInput = React53.forwardRef(({ onReset, placeholder, wrapperClass
 AirbnbSearchInput.displayName = "SearchInput";
 
 // src/dashboard/input/Input.tsx
-var React54 = __toESM(require("react"), 1);
+var React55 = __toESM(require("react"), 1);
 var import_lucide_react45 = require("lucide-react");
 var import_react_i18next26 = require("react-i18next");
 
 // src/dashboard/_fieldset/Fieldset.tsx
-var import_jsx_runtime154 = require("react/jsx-runtime");
+var import_jsx_runtime155 = require("react/jsx-runtime");
 function Fieldset({
   isActivated,
   isFocused,
@@ -13770,8 +13871,8 @@ function Fieldset({
 }) {
   const showLegendText = Boolean(legend || typeof label === "string");
   const raised = !isEmpty || isFocused;
-  return /* @__PURE__ */ (0, import_jsx_runtime154.jsxs)(import_jsx_runtime154.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime154.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)(import_jsx_runtime155.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)(
       "div",
       {
         onClick,
@@ -13787,7 +13888,7 @@ function Fieldset({
           labelClassName
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
             "label",
             {
               id: labelId,
@@ -13799,7 +13900,7 @@ function Fieldset({
               children: label
             }
           ),
-          tooltip && /* @__PURE__ */ (0, import_jsx_runtime154.jsx)("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
+          tooltip && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
             HelpTooltip,
             {
               content: tooltip,
@@ -13810,7 +13911,7 @@ function Fieldset({
         ]
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
       "fieldset",
       {
         "aria-hidden": "true",
@@ -13822,7 +13923,7 @@ function Fieldset({
           invalid && "border-[var(--error-message-color)]",
           className
         ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime154.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)(
           "legend",
           {
             className: cn(
@@ -13832,8 +13933,8 @@ function Fieldset({
               !label && "w-0"
             ),
             children: [
-              showLegendText && /* @__PURE__ */ (0, import_jsx_runtime154.jsx)("span", { className: "visible inline-block pr-[6px] text-[14px] font-medium opacity-0", children: legend || label }),
-              tooltip && /* @__PURE__ */ (0, import_jsx_runtime154.jsx)("span", { className: "visible inline-block w-[20px] opacity-0", children: /* @__PURE__ */ (0, import_jsx_runtime154.jsx)("span", { className: "inline-block h-4 w-4" }) })
+              showLegendText && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "visible inline-block pr-[6px] text-[14px] font-medium opacity-0", children: legend || label }),
+              tooltip && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "visible inline-block w-[20px] opacity-0", children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "inline-block h-4 w-4" }) })
             ]
           }
         )
@@ -13843,7 +13944,7 @@ function Fieldset({
 }
 
 // src/dashboard/input/Input.tsx
-var import_jsx_runtime155 = require("react/jsx-runtime");
+var import_jsx_runtime156 = require("react/jsx-runtime");
 var checkIfEmpty = ({
   empty,
   defaultValue,
@@ -13853,7 +13954,7 @@ var checkIfEmpty = ({
   if (value === 0 || defaultValue === 0) return false;
   return !value && !defaultValue;
 };
-var DashboardInput = React54.forwardRef(
+var DashboardInput = React55.forwardRef(
   ({
     value,
     defaultValue,
@@ -13892,14 +13993,14 @@ var DashboardInput = React54.forwardRef(
     renderErrorMessage = true,
     ...props
   }, ref) => {
-    const generatedId = React54.useId();
+    const generatedId = React55.useId();
     const inputId = id ?? name ?? generatedId;
     const errorId = `${inputId}-error`;
     const { t } = (0, import_react_i18next26.useTranslation)();
     const isEmpty = checkIfEmpty({ empty, value, defaultValue });
-    const [inputType, setInputType] = React54.useState(type);
-    const [isPasswordRevealed, setIsPasswordRevealed] = React54.useState(false);
-    const [isFocused, setIsFocused] = React54.useState(false);
+    const [inputType, setInputType] = React55.useState(type);
+    const [isPasswordRevealed, setIsPasswordRevealed] = React55.useState(false);
+    const [isFocused, setIsFocused] = React55.useState(false);
     const prevInputType = usePrevious(inputType);
     const isPasswordReveal = (prevInputType === "password" || type === "password") && !isEmpty;
     const hasInvalidState = Boolean(invalid) || Boolean(error) && error !== "NONE";
@@ -13914,7 +14015,7 @@ var DashboardInput = React54.forwardRef(
         setIsPasswordRevealed(true);
       }
     };
-    React54.useEffect(() => {
+    React55.useEffect(() => {
       setInputType(type);
     }, [type]);
     const handleChange = (event) => {
@@ -13936,7 +14037,7 @@ var DashboardInput = React54.forwardRef(
     };
     const showRightPaddingForReset = Boolean(onReset);
     const showRightPaddingForReveal = isPasswordReveal;
-    return /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime156.jsxs)(
       "div",
       {
         className: cn(
@@ -13948,7 +14049,7 @@ var DashboardInput = React54.forwardRef(
         ),
         style: wrapperWidth ? { width: wrapperWidth } : void 0,
         children: [
-          topLabel && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+          topLabel && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
             "label",
             {
               htmlFor: inputId,
@@ -13956,7 +14057,7 @@ var DashboardInput = React54.forwardRef(
               children: topLabel
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime156.jsxs)(
             "div",
             {
               className: cn(
@@ -13965,8 +14066,8 @@ var DashboardInput = React54.forwardRef(
                 fieldClassName
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)("div", { className: cn("relative w-full cursor-text", contentClassName), children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime156.jsxs)("div", { className: cn("relative w-full cursor-text", contentClassName), children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                     Fieldset,
                     {
                       isFocused: isFocused && !readOnly,
@@ -13987,8 +14088,8 @@ var DashboardInput = React54.forwardRef(
                       })
                     }
                   ),
-                  leftIcon && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "pointer-events-none absolute left-0 top-0 flex h-full max-w-10 items-center justify-center text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                  leftIcon && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "pointer-events-none absolute left-0 top-0 flex h-full max-w-10 items-center justify-center text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                     "input",
                     {
                       ...props,
@@ -14025,9 +14126,9 @@ var DashboardInput = React54.forwardRef(
                       )
                     }
                   ),
-                  sign && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "pointer-events-none absolute right-[14px] top-0 flex h-full items-center text-[18px] font-medium leading-6 text-[var(--chekin-color-brand-navy)]", children: sign }),
-                  trailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "pointer-events-none absolute right-[14px] top-0 flex h-full items-center", children: trailingAdornment }),
-                  onReset && !isEmpty && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                  sign && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "pointer-events-none absolute right-[14px] top-0 flex h-full items-center text-[18px] font-medium leading-6 text-[var(--chekin-color-brand-navy)]", children: sign }),
+                  trailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "pointer-events-none absolute right-[14px] top-0 flex h-full items-center", children: trailingAdornment }),
+                  onReset && !isEmpty && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                     "button",
                     {
                       type: "button",
@@ -14035,17 +14136,17 @@ var DashboardInput = React54.forwardRef(
                       disabled,
                       className: "absolute right-0 top-0 flex h-full w-10 items-center justify-center border-0 bg-transparent p-0 text-[#9696b9] hover:opacity-80 disabled:cursor-not-allowed disabled:opacity-50",
                       "aria-label": "Reset",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(import_lucide_react45.X, { size: 14 })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(import_lucide_react45.X, { size: 14 })
                     }
                   ),
-                  isPasswordReveal && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                  isPasswordReveal && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                     "button",
                     {
                       type: "button",
                       onClick: togglePasswordReveal,
                       className: "absolute right-[14px] top-[18px] flex h-[13px] w-[21px] cursor-pointer items-center justify-center border-0 bg-transparent p-0 hover:opacity-85",
                       "aria-label": isPasswordRevealed ? "Hide password" : "Show password",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                      children: /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                         import_lucide_react45.Eye,
                         {
                           size: 20,
@@ -14057,32 +14158,32 @@ var DashboardInput = React54.forwardRef(
                     }
                   )
                 ] }),
-                type === "number" && showNumberButtons && /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)("div", { className: "absolute right-[18px] top-[13px] inline-flex items-center text-right", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                type === "number" && showNumberButtons && /* @__PURE__ */ (0, import_jsx_runtime156.jsxs)("div", { className: "absolute right-[18px] top-[13px] inline-flex items-center text-right", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                     "button",
                     {
                       type: "button",
                       onClick: onDecrement,
                       className: "mr-2 inline-flex h-[23px] w-8 cursor-pointer items-center justify-center rounded-[3px] border-0 bg-[var(--chekin-color-brand-blue)] p-0 text-[20px] font-bold text-white outline-none hover:opacity-90 active:opacity-100",
                       "aria-label": "Decrement",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(import_lucide_react45.Minus, { size: 16, strokeWidth: 3, "aria-hidden": true })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(import_lucide_react45.Minus, { size: 16, strokeWidth: 3, "aria-hidden": true })
                     }
                   ),
-                  /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
                     "button",
                     {
                       type: "button",
                       onClick: onIncrement,
                       className: "inline-flex h-[23px] w-8 cursor-pointer items-center justify-center rounded-[3px] border-0 bg-[var(--chekin-color-brand-blue)] p-0 text-[20px] font-bold text-white outline-none hover:opacity-90 active:opacity-100",
                       "aria-label": "Increment",
-                      children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(import_lucide_react45.Plus, { size: 16, strokeWidth: 3, "aria-hidden": true })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(import_lucide_react45.Plus, { size: 16, strokeWidth: 3, "aria-hidden": true })
                     }
                   )
                 ] })
               ]
             }
           ),
-          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
             "span",
             {
               "data-testid": `${name}-optional`,
@@ -14090,8 +14191,8 @@ var DashboardInput = React54.forwardRef(
               children: typeof optional === "string" ? optional : t("optional")
             }
           ),
-          !errorMessage && helperText && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-          errorMessage && renderErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+          !errorMessage && helperText && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+          errorMessage && renderErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
             FieldErrorMessage,
             {
               id: errorId,
@@ -14109,12 +14210,12 @@ var DashboardInput = React54.forwardRef(
 DashboardInput.displayName = "DashboardInput";
 
 // src/dashboard/select/Select.tsx
-var React58 = __toESM(require("react"), 1);
+var React59 = __toESM(require("react"), 1);
 var import_react_i18next30 = require("react-i18next");
 
 // src/dashboard/_select-internals/SelectFieldShell.tsx
 var import_react_i18next27 = require("react-i18next");
-var import_jsx_runtime156 = require("react/jsx-runtime");
+var import_jsx_runtime157 = require("react/jsx-runtime");
 function SelectFieldShell({
   containerRef,
   className,
@@ -14135,7 +14236,7 @@ function SelectFieldShell({
 }) {
   const { t } = (0, import_react_i18next27.useTranslation)();
   const wrapperWidth = toCssSize(width);
-  return /* @__PURE__ */ (0, import_jsx_runtime156.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime157.jsxs)(
     "div",
     {
       ref: containerRef,
@@ -14148,9 +14249,9 @@ function SelectFieldShell({
       ),
       style: wrapperWidth ? { width: wrapperWidth } : void 0,
       children: [
-        name && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("input", { type: "hidden", name, value: hiddenValue ?? "" }),
-        /* @__PURE__ */ (0, import_jsx_runtime156.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
-          topLabel && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
+        name && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("input", { type: "hidden", name, value: hiddenValue ?? "" }),
+        /* @__PURE__ */ (0, import_jsx_runtime157.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
+          topLabel && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
             "label",
             {
               htmlFor: triggerId,
@@ -14158,10 +14259,10 @@ function SelectFieldShell({
               children: topLabel
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("div", { className: "relative w-full", children }),
-          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
-          !errorMessage && helperText && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-          errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("div", { className: "relative w-full", children }),
+          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
+          !errorMessage && helperText && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+          errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
             FieldErrorMessage,
             {
               id: errorId,
@@ -14207,7 +14308,7 @@ function isOptionSelected(option, selectedValue, selectedValues) {
 }
 
 // src/dashboard/_select-internals/SelectMenu.tsx
-var import_jsx_runtime157 = require("react/jsx-runtime");
+var import_jsx_runtime158 = require("react/jsx-runtime");
 function SelectMenu({
   id,
   options,
@@ -14232,7 +14333,7 @@ function SelectMenu({
   const { t } = (0, import_react_i18next28.useTranslation)();
   const emptyMessage = noOptionsMessage?.() ?? t("no_options");
   const hasOptions = options.length > 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime157.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
     "div",
     {
       id,
@@ -14249,13 +14350,13 @@ function SelectMenu({
         menuClassName
       ),
       children: [
-        !hasOptions && (emptyContent ?? /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("div", { className: "mt-[10px] text-left text-[16px] text-[var(--chekin-color-brand-navy)]", children: emptyMessage })),
+        !hasOptions && (emptyContent ?? /* @__PURE__ */ (0, import_jsx_runtime158.jsx)("div", { className: "mt-[10px] text-left text-[16px] text-[var(--chekin-color-brand-navy)]", children: emptyMessage })),
         options.map((option, index) => {
           const isSelected = isOptionSelected(option, selectedValue, selectedValues);
           const isHighlighted = index === highlightedIndex;
           const optionKey = `${String(option.value)}-${index}`;
           const isOptionDisabled = Boolean(disabled || option.isDisabled);
-          return /* @__PURE__ */ (0, import_jsx_runtime157.jsxs)(
+          return /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
             "button",
             {
               id: getOptionId2(index),
@@ -14278,8 +14379,8 @@ function SelectMenu({
                 isOptionDisabled && "cursor-default opacity-30"
               ),
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("span", { className: "block break-words", children: option.label }),
-                option.description && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)("span", { className: "ml-2 mt-[3px] shrink-0 text-[12px] font-bold italic text-[#777e91]", children: option.description })
+                /* @__PURE__ */ (0, import_jsx_runtime158.jsx)("span", { className: "block break-words", children: option.label }),
+                option.description && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)("span", { className: "ml-2 mt-[3px] shrink-0 text-[12px] font-bold italic text-[#777e91]", children: option.description })
               ]
             },
             optionKey
@@ -14293,7 +14394,7 @@ function SelectMenu({
 
 // src/dashboard/_select-internals/SelectMenuPanel.tsx
 var import_react_i18next29 = require("react-i18next");
-var import_jsx_runtime158 = require("react/jsx-runtime");
+var import_jsx_runtime159 = require("react/jsx-runtime");
 function SelectMenuPanel({
   isOpen,
   isMobile: isMobile2,
@@ -14311,23 +14412,23 @@ function SelectMenuPanel({
     const fallbackTitle = t("select_option");
     const titleText = typeof title === "string" || typeof title === "number" ? String(title) : fallbackTitle;
     const descriptionText = typeof description === "string" || typeof description === "number" ? String(description) : titleText;
-    return /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
       Drawer,
       {
         open: isOpen,
         onOpenChange: (next) => {
           if (!next) onClose();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime159.jsxs)(
           DrawerContent,
           {
             onClose,
             lockScroll: false,
             className: cn("max-h-[calc(100vh-1rem)]", drawerClassName),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(DrawerTitle, { className: "sr-only", children: titleText }),
-              /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(DrawerDescription, { className: "sr-only", children: descriptionText }),
-              /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(DrawerTitle, { className: "sr-only", children: titleText }),
+              /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(DrawerDescription, { className: "sr-only", children: descriptionText }),
+              /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
                 "div",
                 {
                   className: cn(
@@ -14343,7 +14444,7 @@ function SelectMenuPanel({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
     "div",
     {
       className: cn(
@@ -14356,7 +14457,7 @@ function SelectMenuPanel({
 }
 
 // src/dashboard/_select-internals/SelectSearchInput.tsx
-var import_jsx_runtime159 = require("react/jsx-runtime");
+var import_jsx_runtime160 = require("react/jsx-runtime");
 function SelectSearchInput({
   inputRef,
   value,
@@ -14366,7 +14467,7 @@ function SelectSearchInput({
   onChange,
   onKeyDown
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime159.jsx)("div", { className: "border-b border-[#f2f4f8] px-4 pb-2 pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("div", { className: "border-b border-[#f2f4f8] px-4 pb-2 pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(
     "input",
     {
       ref: inputRef,
@@ -14385,7 +14486,7 @@ function SelectSearchInput({
 
 // src/dashboard/_select-internals/SelectTrigger.tsx
 var import_lucide_react46 = require("lucide-react");
-var import_jsx_runtime160 = require("react/jsx-runtime");
+var import_jsx_runtime161 = require("react/jsx-runtime");
 function SelectTrigger3({
   triggerRef,
   triggerId,
@@ -14406,7 +14507,7 @@ function SelectTrigger3({
   onBlur
 }) {
   const isEmpty = !hasValue;
-  return /* @__PURE__ */ (0, import_jsx_runtime160.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime161.jsxs)(
     "button",
     {
       id: triggerId,
@@ -14430,10 +14531,10 @@ function SelectTrigger3({
         loading && "cursor-progress"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime160.jsx)("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: valueLabel ?? (isOpen ? placeholder : null) }),
-        /* @__PURE__ */ (0, import_jsx_runtime160.jsxs)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: [
-          loading && /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
-          /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime161.jsx)("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: valueLabel ?? (isOpen ? placeholder : null) }),
+        /* @__PURE__ */ (0, import_jsx_runtime161.jsxs)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: [
+          loading && /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
+          /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(
             import_lucide_react46.ChevronDown,
             {
               size: 16,
@@ -14450,14 +14551,14 @@ function SelectTrigger3({
 }
 
 // src/dashboard/_select-internals/useSelectIds.ts
-var React55 = __toESM(require("react"), 1);
+var React56 = __toESM(require("react"), 1);
 function useSelectIds2({
   name,
   hasValue,
   error,
   hideErrorMessage
 }) {
-  const reactId = React55.useId().replace(/:/g, "");
+  const reactId = React56.useId().replace(/:/g, "");
   const baseId = name ? `dash-select-${name}` : `dash-select-${reactId}`;
   const triggerId = `${baseId}-trigger`;
   const labelId = `${baseId}-label`;
@@ -14467,7 +14568,7 @@ function useSelectIds2({
   const listboxId = `${baseId}-listbox`;
   const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
   const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
-  const getOptionId2 = React55.useCallback(
+  const getOptionId2 = React56.useCallback(
     (index) => `${baseId}-option-${index}`,
     [baseId]
   );
@@ -14485,21 +14586,21 @@ function useSelectIds2({
 }
 
 // src/dashboard/_select-internals/useSelectMenuState.ts
-var React56 = __toESM(require("react"), 1);
+var React57 = __toESM(require("react"), 1);
 function useSelectMenuState({
   isBlocked,
   isMobile: isMobile2,
   onOutsideClick
 }) {
-  const containerRef = React56.useRef(null);
-  const [isOpen, setIsOpen] = React56.useState(false);
-  const openMenu = React56.useCallback(() => {
+  const containerRef = React57.useRef(null);
+  const [isOpen, setIsOpen] = React57.useState(false);
+  const openMenu = React57.useCallback(() => {
     setIsOpen(true);
   }, []);
-  const closeMenu = React56.useCallback(() => {
+  const closeMenu = React57.useCallback(() => {
     setIsOpen(false);
   }, []);
-  const toggleMenu = React56.useCallback(() => {
+  const toggleMenu = React57.useCallback(() => {
     if (isBlocked) return;
     setIsOpen((prev) => !prev);
   }, [isBlocked]);
@@ -14511,30 +14612,30 @@ function useSelectMenuState({
     },
     isDisabled: !isOpen || isMobile2
   });
-  React56.useEffect(() => {
+  React57.useEffect(() => {
     if (isBlocked) setIsOpen(false);
   }, [isBlocked]);
   return { containerRef, isOpen, openMenu, closeMenu, toggleMenu, setIsOpen };
 }
 
 // src/dashboard/_select-internals/useSelectSearch.ts
-var React57 = __toESM(require("react"), 1);
+var React58 = __toESM(require("react"), 1);
 function useSelectSearch({
   options,
   searchable = true,
   filterOption = defaultFilterOption
 }) {
-  const [searchValue, setSearchValue] = React57.useState("");
-  const filteredOptions = React57.useMemo(() => {
+  const [searchValue, setSearchValue] = React58.useState("");
+  const filteredOptions = React58.useMemo(() => {
     if (!searchable || !searchValue) return options;
     return options.filter((option) => filterOption(option, searchValue));
   }, [options, searchable, searchValue, filterOption]);
-  const clearSearch = React57.useCallback(() => setSearchValue(""), []);
+  const clearSearch = React58.useCallback(() => setSearchValue(""), []);
   return { searchValue, setSearchValue, filteredOptions, clearSearch };
 }
 
 // src/dashboard/select/Select.tsx
-var import_jsx_runtime161 = require("react/jsx-runtime");
+var import_jsx_runtime162 = require("react/jsx-runtime");
 function DashboardSelectInternal({
   options = [],
   value,
@@ -14563,11 +14664,11 @@ function DashboardSelectInternal({
   filterOption,
   helperText
 }, ref) {
-  const triggerRef = React58.useRef(null);
-  const searchInputRef = React58.useRef(null);
-  const listRef = React58.useRef(null);
-  const optionRefs = React58.useRef([]);
-  const [highlightedIndex, setHighlightedIndex] = React58.useState(-1);
+  const triggerRef = React59.useRef(null);
+  const searchInputRef = React59.useRef(null);
+  const listRef = React59.useRef(null);
+  const optionRefs = React59.useRef([]);
+  const [highlightedIndex, setHighlightedIndex] = React59.useState(-1);
   const isMobile2 = useIsMobile();
   const { t } = (0, import_react_i18next30.useTranslation)();
   const resolvedSearchPlaceholder = searchPlaceholder ?? t("search_placeholder");
@@ -14587,8 +14688,8 @@ function DashboardSelectInternal({
     searchable,
     filterOption
   });
-  React58.useImperativeHandle(ref, () => triggerRef.current, []);
-  React58.useEffect(() => {
+  React59.useImperativeHandle(ref, () => triggerRef.current, []);
+  React59.useEffect(() => {
     if (!isOpen) {
       setSearchValue("");
       setHighlightedIndex(-1);
@@ -14603,11 +14704,11 @@ function DashboardSelectInternal({
       return () => window.cancelAnimationFrame(frame);
     }
   }, [isOpen, filteredOptions, searchable, value, setSearchValue]);
-  React58.useEffect(() => {
+  React59.useEffect(() => {
     if (!isOpen || highlightedIndex < 0) return;
     optionRefs.current[highlightedIndex]?.scrollIntoView({ block: "nearest" });
   }, [highlightedIndex, isOpen]);
-  React58.useEffect(
+  React59.useEffect(
     function setCorrectOptionIfThereIsOnlyValue() {
       if (value?.value === void 0 || value.value === null || value.label !== "")
         return;
@@ -14658,7 +14759,7 @@ function DashboardSelectInternal({
       setIsOpen(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime161.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime162.jsxs)(
     SelectFieldShell,
     {
       containerRef,
@@ -14676,7 +14777,7 @@ function DashboardSelectInternal({
       name,
       hiddenValue: value ? String(value.value) : "",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
           SelectTrigger3,
           {
             triggerRef,
@@ -14698,7 +14799,7 @@ function DashboardSelectInternal({
             onBlur
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
           Fieldset,
           {
             isFocused: isOpen,
@@ -14715,7 +14816,7 @@ function DashboardSelectInternal({
             onClick: !isBlocked ? toggleMenu : void 0
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime161.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime162.jsxs)(
           SelectMenuPanel,
           {
             isOpen,
@@ -14725,7 +14826,7 @@ function DashboardSelectInternal({
             className: dropdownClassName,
             drawerClassName,
             children: [
-              searchable && /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(
+              searchable && /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
                 SelectSearchInput,
                 {
                   inputRef: searchInputRef,
@@ -14737,7 +14838,7 @@ function DashboardSelectInternal({
                   onKeyDown: handleSearchKeyDown
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
                 SelectMenu,
                 {
                   id: listboxId,
@@ -14765,19 +14866,19 @@ function DashboardSelectInternal({
     }
   );
 }
-var DashboardSelect = React58.forwardRef(
+var DashboardSelect = React59.forwardRef(
   DashboardSelectInternal
 );
 
 // src/dashboard/multi-select/MultiSelect.tsx
-var React59 = __toESM(require("react"), 1);
+var React60 = __toESM(require("react"), 1);
 var import_lucide_react48 = require("lucide-react");
 var import_react_i18next32 = require("react-i18next");
 
 // src/dashboard/multi-select/MultiSelectChip.tsx
 var import_lucide_react47 = require("lucide-react");
 var import_react_i18next31 = require("react-i18next");
-var import_jsx_runtime162 = require("react/jsx-runtime");
+var import_jsx_runtime163 = require("react/jsx-runtime");
 function MultiSelectChip({
   option,
   readOnly,
@@ -14785,9 +14886,9 @@ function MultiSelectChip({
 }) {
   const { t } = (0, import_react_i18next31.useTranslation)();
   const labelText = typeof option.label === "string" ? option.label : String(option.value);
-  return /* @__PURE__ */ (0, import_jsx_runtime162.jsxs)("span", { className: "inline-flex items-center gap-2 rounded-[4px] border border-[#acacd5] bg-[#f0f0f8] py-[2px] pl-[10px] pr-1 text-[12px] font-medium text-[var(--chekin-color-brand-navy)]", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("span", { className: "whitespace-nowrap", children: option.label }),
-    !readOnly && /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)("span", { className: "inline-flex items-center gap-2 rounded-[4px] border border-[#acacd5] bg-[#f0f0f8] py-[2px] pl-[10px] pr-1 text-[12px] font-medium text-[var(--chekin-color-brand-navy)]", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("span", { className: "whitespace-nowrap", children: option.label }),
+    !readOnly && /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
       "button",
       {
         type: "button",
@@ -14797,14 +14898,14 @@ function MultiSelectChip({
         },
         className: "flex h-[15px] w-[15px] items-center justify-center rounded-[3px] border-0 bg-transparent p-0 text-[#9696b9] hover:shadow-[0_3px_3px_#0f477734]",
         "aria-label": t("remove_item", { label: labelText }),
-        children: /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(import_lucide_react47.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(import_lucide_react47.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
       }
     )
   ] });
 }
 
 // src/dashboard/multi-select/MultiSelect.tsx
-var import_jsx_runtime163 = require("react/jsx-runtime");
+var import_jsx_runtime164 = require("react/jsx-runtime");
 var isValueSelected = (selected, option) => selected.some((item) => item.value === option.value);
 function DashboardMultiSelectInternal({
   options = [],
@@ -14838,15 +14939,15 @@ function DashboardMultiSelectInternal({
   formatCreateLabel = (input) => `Create "${input}"`,
   isValidNewOption
 }, ref) {
-  const inputRef = React59.useRef(null);
-  const mobileSearchInputRef = React59.useRef(null);
-  const listRef = React59.useRef(null);
-  const optionRefs = React59.useRef([]);
-  const [isFocused, setIsFocused] = React59.useState(false);
-  const [highlightedIndex, setHighlightedIndex] = React59.useState(-1);
+  const inputRef = React60.useRef(null);
+  const mobileSearchInputRef = React60.useRef(null);
+  const listRef = React60.useRef(null);
+  const optionRefs = React60.useRef([]);
+  const [isFocused, setIsFocused] = React60.useState(false);
+  const [highlightedIndex, setHighlightedIndex] = React60.useState(-1);
   const isMobile2 = useIsMobile();
   const { t } = (0, import_react_i18next32.useTranslation)();
-  const selectedValues = React59.useMemo(() => value ?? [], [value]);
+  const selectedValues = React60.useMemo(() => value ?? [], [value]);
   const hasValue = selectedValues.length > 0;
   const isEmpty = !hasValue;
   const isBlocked = Boolean(disabled) || Boolean(loading) || Boolean(readOnly);
@@ -14864,7 +14965,7 @@ function DashboardMultiSelectInternal({
     filterOption
   });
   const trimmedSearch = searchValue.trim();
-  const canCreateNewOption = React59.useMemo(() => {
+  const canCreateNewOption = React60.useMemo(() => {
     if (!isCreatable || !trimmedSearch) return false;
     if (isValidNewOption) return isValidNewOption(trimmedSearch, selectedValues, options);
     const lower = trimmedSearch.toLowerCase();
@@ -14876,17 +14977,17 @@ function DashboardMultiSelectInternal({
     );
     return !existsInOptions && !existsInSelected;
   }, [isCreatable, trimmedSearch, isValidNewOption, options, selectedValues]);
-  React59.useImperativeHandle(
+  React60.useImperativeHandle(
     ref,
     () => containerRef.current
   );
-  React59.useEffect(() => {
+  React60.useEffect(() => {
     if (!isOpen) {
       clearSearch();
       setHighlightedIndex(-1);
     }
   }, [isOpen, clearSearch]);
-  React59.useEffect(() => {
+  React60.useEffect(() => {
     if (!isOpen || filteredOptions.length === 0) {
       setHighlightedIndex(-1);
       return;
@@ -14896,7 +14997,7 @@ function DashboardMultiSelectInternal({
       return getFirstEnabledOptionIndex2(filteredOptions);
     });
   }, [isOpen, filteredOptions]);
-  React59.useEffect(() => {
+  React60.useEffect(() => {
     if (!isOpen || !isMobile2) return;
     const frame = window.requestAnimationFrame(
       () => mobileSearchInputRef.current?.focus()
@@ -14930,7 +15031,7 @@ function DashboardMultiSelectInternal({
     onChange([]);
     inputRef.current?.focus();
   };
-  const createOption = React59.useCallback(() => {
+  const createOption = React60.useCallback(() => {
     if (!canCreateNewOption) return;
     const newOption = onCreateOption?.(trimmedSearch) ?? { value: trimmedSearch, label: trimmedSearch };
     onChange([...selectedValues, newOption]);
@@ -14999,7 +15100,7 @@ function DashboardMultiSelectInternal({
     setIsFocused(false);
     onBlur?.(event);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime164.jsxs)(
     SelectFieldShell,
     {
       containerRef,
@@ -15018,7 +15119,7 @@ function DashboardMultiSelectInternal({
       hiddenValue: selectedValues.map((item) => String(item.value)).join(","),
       onBlur: handleInputBlur,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime164.jsxs)(
           "div",
           {
             id: triggerId,
@@ -15041,7 +15142,7 @@ function DashboardMultiSelectInternal({
             ),
             children: [
               selectedValues.map(
-                (option) => renderChip ? /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(React59.Fragment, { children: renderChip(option, () => removeOption(option)) }, String(option.value)) : /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+                (option) => renderChip ? /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(React60.Fragment, { children: renderChip(option, () => removeOption(option)) }, String(option.value)) : /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                   MultiSelectChip,
                   {
                     option,
@@ -15051,7 +15152,7 @@ function DashboardMultiSelectInternal({
                   String(option.value)
                 )
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                 "input",
                 {
                   ref: inputRef,
@@ -15080,9 +15181,9 @@ function DashboardMultiSelectInternal({
                   "aria-activedescendant": isOpen && highlightedIndex >= 0 ? getOptionId2(highlightedIndex) : void 0
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)("span", { className: "ml-auto flex items-center gap-2 pl-2 text-[var(--chekin-color-gray-2)]", children: [
-                loading && /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
-                hasValue && !readOnly && /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime164.jsxs)("span", { className: "ml-auto flex items-center gap-2 pl-2 text-[var(--chekin-color-gray-2)]", children: [
+                loading && /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
+                hasValue && !readOnly && /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                   "button",
                   {
                     type: "button",
@@ -15092,10 +15193,10 @@ function DashboardMultiSelectInternal({
                     },
                     className: "flex h-5 w-5 items-center justify-center rounded-[3px] border-0 bg-transparent p-0 text-[#9696b9] hover:shadow-[0_3px_3px_#0f477734]",
                     "aria-label": t("clear_all"),
-                    children: /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(import_lucide_react48.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+                    children: /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(import_lucide_react48.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                   RotateArrow,
                   {
                     shouldRotate: isOpen,
@@ -15108,7 +15209,7 @@ function DashboardMultiSelectInternal({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
           Fieldset,
           {
             isFocused: isFocused || isOpen,
@@ -15126,7 +15227,7 @@ function DashboardMultiSelectInternal({
             onClick: handleContainerClick
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime164.jsxs)(
           SelectMenuPanel,
           {
             isOpen,
@@ -15139,7 +15240,7 @@ function DashboardMultiSelectInternal({
             className: dropdownClassName,
             drawerClassName,
             children: [
-              isMobile2 && /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("div", { className: "border-b border-[#f2f4f8] px-4 pb-2 pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+              isMobile2 && /* @__PURE__ */ (0, import_jsx_runtime164.jsx)("div", { className: "border-b border-[#f2f4f8] px-4 pb-2 pt-3", children: /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                 "input",
                 {
                   ref: mobileSearchInputRef,
@@ -15154,7 +15255,7 @@ function DashboardMultiSelectInternal({
                   className: "m-0 box-border h-9 w-full rounded-md border border-[var(--chekin-color-gray-3)] bg-white px-3 text-[16px] font-medium text-[var(--chekin-color-brand-navy)] outline-none transition-colors placeholder:text-[var(--chekin-color-gray-1)] focus:border-[var(--chekin-color-brand-blue)]"
                 }
               ) }),
-              /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                 SelectMenu,
                 {
                   id: listboxId,
@@ -15176,7 +15277,7 @@ function DashboardMultiSelectInternal({
                   isMulti: true
                 }
               ),
-              canCreateNewOption && /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+              canCreateNewOption && /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
                 "button",
                 {
                   type: "button",
@@ -15192,26 +15293,26 @@ function DashboardMultiSelectInternal({
     }
   );
 }
-var DashboardMultiSelect = React59.forwardRef(
+var DashboardMultiSelect = React60.forwardRef(
   DashboardMultiSelectInternal
 );
 
 // src/dashboard/creatable-multi-select/CreatableMultiSelect.tsx
-var React60 = __toESM(require("react"), 1);
-var import_jsx_runtime164 = require("react/jsx-runtime");
-var DashboardCreatableMultiSelect = React60.forwardRef(
+var React61 = __toESM(require("react"), 1);
+var import_jsx_runtime165 = require("react/jsx-runtime");
+var DashboardCreatableMultiSelect = React61.forwardRef(
   function DashboardCreatableMultiSelect2(props, ref) {
-    return /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(DashboardMultiSelect, { ref, ...props, isCreatable: true });
+    return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(DashboardMultiSelect, { ref, ...props, isCreatable: true });
   }
 );
 
 // src/dashboard/infinite-scroll-select/InfiniteScrollSelect.tsx
-var React61 = __toESM(require("react"), 1);
+var React62 = __toESM(require("react"), 1);
 var import_react_virtual2 = require("@tanstack/react-virtual");
 var import_react_i18next33 = require("react-i18next");
 
 // src/dashboard/infinite-scroll-select/InfiniteScrollList.tsx
-var import_jsx_runtime165 = require("react/jsx-runtime");
+var import_jsx_runtime166 = require("react/jsx-runtime");
 function InfiniteScrollList({
   scrollRef,
   listboxId,
@@ -15232,13 +15333,13 @@ function InfiniteScrollList({
   onHighlight
 }) {
   const virtualItems = virtualizer.getVirtualItems();
-  return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
     "div",
     {
       ref: scrollRef,
       className: cn("overflow-y-auto", menuClassName),
       style: { height: `${height}px` },
-      children: /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
         "div",
         {
           id: listboxId,
@@ -15255,7 +15356,7 @@ function InfiniteScrollList({
             const isSelected = !isLoaderRow && option ? option.value === value?.value : false;
             const isHighlighted = virtualItem.index === highlightedIndex;
             const isOptionDisabled = Boolean(isBlocked || option?.isDisabled);
-            return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
               "div",
               {
                 "data-index": virtualItem.index,
@@ -15264,10 +15365,10 @@ function InfiniteScrollList({
                   height: `${virtualItem.size}px`,
                   transform: `translateY(${virtualItem.start}px)`
                 },
-                children: isLoaderRow ? /* @__PURE__ */ (0, import_jsx_runtime165.jsxs)("div", { className: "flex h-full items-center justify-center gap-2 px-4 text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(ThreeDotsLoader, { height: 36, width: 36 }),
-                  /* @__PURE__ */ (0, import_jsx_runtime165.jsx)("span", { children: loadingMoreText })
-                ] }) : /* @__PURE__ */ (0, import_jsx_runtime165.jsxs)(
+                children: isLoaderRow ? /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)("div", { className: "flex h-full items-center justify-center gap-2 px-4 text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: [
+                  /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(ThreeDotsLoader, { height: 36, width: 36 }),
+                  /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("span", { children: loadingMoreText })
+                ] }) : /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)(
                   "button",
                   {
                     id: getOptionId2(virtualItem.index),
@@ -15286,8 +15387,8 @@ function InfiniteScrollList({
                       isOptionDisabled && "cursor-default opacity-30"
                     ),
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime165.jsx)("span", { className: "block break-words", children: option?.label }),
-                      option?.description && /* @__PURE__ */ (0, import_jsx_runtime165.jsx)("span", { className: "ml-2 mt-[3px] shrink-0 text-[12px] font-bold italic text-[#777e91]", children: option.description })
+                      /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("span", { className: "block break-words", children: option?.label }),
+                      option?.description && /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("span", { className: "ml-2 mt-[3px] shrink-0 text-[12px] font-bold italic text-[#777e91]", children: option.description })
                     ]
                   }
                 )
@@ -15302,7 +15403,7 @@ function InfiniteScrollList({
 }
 
 // src/dashboard/infinite-scroll-select/InfiniteScrollSelect.tsx
-var import_jsx_runtime166 = require("react/jsx-runtime");
+var import_jsx_runtime167 = require("react/jsx-runtime");
 var DEFAULT_ITEM_HEIGHT = 60;
 var DEFAULT_LIST_HEIGHT = 322;
 var DEFAULT_OVERSCAN = 5;
@@ -15344,12 +15445,12 @@ function DashboardInfiniteScrollSelectInternal({
   overscan = DEFAULT_OVERSCAN,
   loadMoreThreshold = DEFAULT_LOAD_MORE_THRESHOLD
 }, ref) {
-  const triggerRef = React61.useRef(null);
-  const searchInputRef = React61.useRef(null);
-  const scrollRef = React61.useRef(null);
-  const previousHighlightedIndexRef = React61.useRef(-1);
-  const lastLoadMoreOptionsLengthRef = React61.useRef(null);
-  const [highlightedIndex, setHighlightedIndex] = React61.useState(-1);
+  const triggerRef = React62.useRef(null);
+  const searchInputRef = React62.useRef(null);
+  const scrollRef = React62.useRef(null);
+  const previousHighlightedIndexRef = React62.useRef(-1);
+  const lastLoadMoreOptionsLengthRef = React62.useRef(null);
+  const [highlightedIndex, setHighlightedIndex] = React62.useState(-1);
   const isMobile2 = useIsMobile();
   const { t } = (0, import_react_i18next33.useTranslation)();
   const resolvedSearchPlaceholder = searchPlaceholder ?? t("search_placeholder");
@@ -15377,15 +15478,15 @@ function DashboardInfiniteScrollSelectInternal({
     estimateSize: () => itemHeight,
     overscan
   });
-  React61.useImperativeHandle(ref, () => triggerRef.current, []);
-  React61.useEffect(() => {
+  React62.useImperativeHandle(ref, () => triggerRef.current, []);
+  React62.useEffect(() => {
     if (isOpen) return;
     setSearchValue("");
     setHighlightedIndex(-1);
     previousHighlightedIndexRef.current = -1;
     lastLoadMoreOptionsLengthRef.current = null;
   }, [isOpen, setSearchValue]);
-  React61.useEffect(() => {
+  React62.useEffect(() => {
     if (!isOpen) return;
     setHighlightedIndex((current) => {
       const option = current >= 0 ? filteredOptions[current] : void 0;
@@ -15394,13 +15495,13 @@ function DashboardInfiniteScrollSelectInternal({
       return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex2(filteredOptions);
     });
   }, [isOpen, filteredOptions, value]);
-  React61.useEffect(() => {
+  React62.useEffect(() => {
     if (!isOpen || !searchable) return;
     const frame = window.requestAnimationFrame(() => searchInputRef.current?.focus());
     return () => window.cancelAnimationFrame(frame);
   }, [isOpen, searchable]);
   const virtualItems = virtualizer.getVirtualItems();
-  React61.useEffect(() => {
+  React62.useEffect(() => {
     if (!isOpen || !canLoadMore || isLoadingMore || !loadMoreItems) return;
     if (virtualItems.length === 0) return;
     const lastItem = virtualItems[virtualItems.length - 1];
@@ -15417,7 +15518,7 @@ function DashboardInfiniteScrollSelectInternal({
     loadMoreThreshold,
     virtualItems
   ]);
-  React61.useEffect(() => {
+  React62.useEffect(() => {
     const changed = previousHighlightedIndexRef.current !== highlightedIndex;
     previousHighlightedIndexRef.current = highlightedIndex;
     if (!isOpen || highlightedIndex < 0 || !changed) return;
@@ -15475,7 +15576,7 @@ function DashboardInfiniteScrollSelectInternal({
   const totalSize = virtualizer.getTotalSize();
   const measuredListHeight = Math.min(listHeight, Math.max(totalSize, itemHeight));
   const activeOptionId = highlightedIndex >= 0 ? getOptionId2(highlightedIndex) : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)(
     SelectFieldShell,
     {
       containerRef,
@@ -15493,7 +15594,7 @@ function DashboardInfiniteScrollSelectInternal({
       name,
       hiddenValue: value ? String(value.value) : "",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
           SelectTrigger3,
           {
             triggerRef,
@@ -15515,7 +15616,7 @@ function DashboardInfiniteScrollSelectInternal({
             onBlur
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
           Fieldset,
           {
             isFocused: isOpen,
@@ -15532,7 +15633,7 @@ function DashboardInfiniteScrollSelectInternal({
             onClick: !isBlocked ? toggleMenu : void 0
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)(
           SelectMenuPanel,
           {
             isOpen,
@@ -15542,7 +15643,7 @@ function DashboardInfiniteScrollSelectInternal({
             className: dropdownClassName,
             drawerClassName,
             children: [
-              searchable && /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
+              searchable && /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
                 SelectSearchInput,
                 {
                   inputRef: searchInputRef,
@@ -15554,10 +15655,10 @@ function DashboardInfiniteScrollSelectInternal({
                   onKeyDown: handleSearchKeyDown
                 }
               ),
-              filteredOptions.length === 0 && isLoadingMore ? /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)("div", { className: "flex items-center justify-center gap-2 px-4 py-[20px] text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
-                /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("span", { children: resolvedLoadingMoreText })
-              ] }) : filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("div", { className: "px-4 py-[20px] text-left text-[16px] text-[var(--chekin-color-brand-navy)]", children: emptyMessage ?? t("no_options") }) : /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
+              filteredOptions.length === 0 && isLoadingMore ? /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)("div", { className: "flex items-center justify-center gap-2 px-4 py-[20px] text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
+                /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { children: resolvedLoadingMoreText })
+              ] }) : filteredOptions.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("div", { className: "px-4 py-[20px] text-left text-[16px] text-[var(--chekin-color-brand-navy)]", children: emptyMessage ?? t("no_options") }) : /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
                 InfiniteScrollList,
                 {
                   scrollRef,
@@ -15586,14 +15687,14 @@ function DashboardInfiniteScrollSelectInternal({
     }
   );
 }
-var DashboardInfiniteScrollSelect = React61.forwardRef(
+var DashboardInfiniteScrollSelect = React62.forwardRef(
   DashboardInfiniteScrollSelectInternal
 );
 
 // src/dashboard/textarea/Textarea.tsx
-var React62 = __toESM(require("react"), 1);
+var React63 = __toESM(require("react"), 1);
 var import_react_i18next34 = require("react-i18next");
-var import_jsx_runtime167 = require("react/jsx-runtime");
+var import_jsx_runtime168 = require("react/jsx-runtime");
 var LINE_HEIGHT = 20;
 var VERTICAL_PADDING = 32;
 function getEmptyState(empty, value, defaultValue) {
@@ -15601,7 +15702,7 @@ function getEmptyState(empty, value, defaultValue) {
   if (value !== void 0) return !String(value);
   return !defaultValue;
 }
-var DashboardTextarea = React62.forwardRef(
+var DashboardTextarea = React63.forwardRef(
   function DashboardTextarea2({
     className,
     textareaClassName,
@@ -15625,15 +15726,15 @@ var DashboardTextarea = React62.forwardRef(
     onInput,
     ...textareaProps
   }, ref) {
-    const innerRef = React62.useRef(null);
+    const innerRef = React63.useRef(null);
     const combinedRef = useCombinedRef(ref, innerRef);
-    const reactId = React62.useId();
+    const reactId = React63.useId();
     const textareaId = id ?? name ?? `dash-textarea-${reactId}`;
     const { t } = (0, import_react_i18next34.useTranslation)();
     const isInvalid = Boolean(invalid || error);
     const isEmpty = getEmptyState(empty, value, defaultValue);
     const isBlocked = Boolean(disabled);
-    const resize = React62.useCallback(() => {
+    const resize = React63.useCallback(() => {
       const el = innerRef.current;
       if (!el || !autosize) return;
       el.style.height = "auto";
@@ -15643,14 +15744,14 @@ var DashboardTextarea = React62.forwardRef(
       el.style.height = `${nextHeight}px`;
       el.style.overflowY = el.scrollHeight > nextHeight ? "auto" : "hidden";
     }, [autosize, maxRows, minRows]);
-    React62.useLayoutEffect(() => {
+    React63.useLayoutEffect(() => {
       resize();
     }, [resize, value]);
     const handleInput = (event) => {
       resize();
       onInput?.(event);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)(
       "div",
       {
         className: cn(
@@ -15660,18 +15761,18 @@ var DashboardTextarea = React62.forwardRef(
           className
         ),
         children: [
-          label && /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)(
+          label && /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)(
             "label",
             {
               htmlFor: textareaId,
               className: "mb-2 flex select-none items-center text-[16px] font-medium text-[var(--chekin-color-brand-navy)]",
               children: [
                 label,
-                tooltip && /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(HelpTooltip, { content: tooltip, size: 16 }) })
+                tooltip && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(HelpTooltip, { content: tooltip, size: 16 }) })
               ]
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
             "textarea",
             {
               ref: combinedRef,
@@ -15700,7 +15801,7 @@ var DashboardTextarea = React62.forwardRef(
               ...textareaProps
             }
           ),
-          error && /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
+          error && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
             FieldErrorMessage,
             {
               id: `${textareaId}-error`,
@@ -15708,8 +15809,8 @@ var DashboardTextarea = React62.forwardRef(
               className: "mt-[1px] text-[14px]"
             }
           ),
-          !error && optional && /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
-          !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText })
+          !error && optional && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
+          !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText })
         ]
       }
     );
@@ -15717,10 +15818,10 @@ var DashboardTextarea = React62.forwardRef(
 );
 
 // src/dashboard/datepicker/Datepicker.tsx
-var React63 = __toESM(require("react"), 1);
+var React64 = __toESM(require("react"), 1);
 var import_lucide_react49 = require("lucide-react");
 var import_react_i18next35 = require("react-i18next");
-var import_jsx_runtime168 = require("react/jsx-runtime");
+var import_jsx_runtime169 = require("react/jsx-runtime");
 var MONTHS_IN_YEAR2 = 12;
 var DEFAULT_MIN_DATE2 = new Date(1920, 0, 1);
 function getMonthLabels2(locale) {
@@ -15754,7 +15855,7 @@ function dateFromParts(day, monthIndex, year) {
   if (!isValidCalendarDate(yearNum, monthIndex, dayNum)) return null;
   return new Date(yearNum, monthIndex, dayNum);
 }
-var DashboardDatepicker = React63.forwardRef(
+var DashboardDatepicker = React64.forwardRef(
   function DashboardDatepicker2({
     label,
     value,
@@ -15784,14 +15885,14 @@ var DashboardDatepicker = React63.forwardRef(
     maxDate,
     formatValue
   }, ref) {
-    const containerRef = React63.useRef(null);
-    const dayInputRef = React63.useRef(null);
-    const monthInputRef = React63.useRef(null);
-    const monthListRef = React63.useRef(null);
-    const yearInputRef = React63.useRef(null);
-    const mobileTriggerRef = React63.useRef(null);
-    const wheelBaseId = React63.useId();
-    const reactId = React63.useId();
+    const containerRef = React64.useRef(null);
+    const dayInputRef = React64.useRef(null);
+    const monthInputRef = React64.useRef(null);
+    const monthListRef = React64.useRef(null);
+    const yearInputRef = React64.useRef(null);
+    const mobileTriggerRef = React64.useRef(null);
+    const wheelBaseId = React64.useId();
+    const reactId = React64.useId();
     const baseId = name ?? `dash-datepicker-${reactId}`;
     const dayId = `${baseId}-day`;
     const monthId = `${baseId}-month`;
@@ -15799,51 +15900,51 @@ var DashboardDatepicker = React63.forwardRef(
     const labelId = `${baseId}-label`;
     const errorId = `${baseId}-error`;
     const { t } = (0, import_react_i18next35.useTranslation)();
-    const resolvedMonthLabels = React63.useMemo(
+    const resolvedMonthLabels = React64.useMemo(
       () => monthLabels ?? getMonthLabels2(locale),
       [locale, monthLabels]
     );
     const resolvedMonthPlaceholder = monthPlaceholder ?? t("month");
     const resolvedDoneLabel = doneLabel ?? t("done");
     const isControlled = value !== void 0;
-    const initialParts = React63.useMemo(
+    const initialParts = React64.useMemo(
       () => partsFromDate(value ?? defaultValue ?? null),
       // eslint-disable-next-line react-hooks/exhaustive-deps
       []
     );
-    const [day, setDay] = React63.useState(initialParts.day);
-    const [monthIndex, setMonthIndex] = React63.useState(
+    const [day, setDay] = React64.useState(initialParts.day);
+    const [monthIndex, setMonthIndex] = React64.useState(
       initialParts.monthIndex
     );
-    const [year, setYear] = React63.useState(initialParts.year);
-    const [isMonthOpen, setIsMonthOpen] = React63.useState(false);
-    const [isWheelOpen, setIsWheelOpen] = React63.useState(false);
-    const [focusedField, setFocusedField] = React63.useState(null);
-    const [monthInputValue, setMonthInputValue] = React63.useState("");
-    const [monthHighlightIndex, setMonthHighlightIndex] = React63.useState(-1);
+    const [year, setYear] = React64.useState(initialParts.year);
+    const [isMonthOpen, setIsMonthOpen] = React64.useState(false);
+    const [isWheelOpen, setIsWheelOpen] = React64.useState(false);
+    const [focusedField, setFocusedField] = React64.useState(null);
+    const [monthInputValue, setMonthInputValue] = React64.useState("");
+    const [monthHighlightIndex, setMonthHighlightIndex] = React64.useState(-1);
     const isMobile2 = useIsMobile();
-    React63.useImperativeHandle(ref, () => dayInputRef.current, []);
-    React63.useEffect(() => {
+    React64.useImperativeHandle(ref, () => dayInputRef.current, []);
+    React64.useEffect(() => {
       if (!isControlled) return;
       const next = partsFromDate(value ?? null);
       setDay(next.day);
       setMonthIndex(next.monthIndex);
       setYear(next.year);
     }, [isControlled, value]);
-    React63.useEffect(() => {
+    React64.useEffect(() => {
       if (focusedField === "month") return;
       setMonthInputValue(
         monthIndex !== null ? resolvedMonthLabels[monthIndex] ?? "" : ""
       );
     }, [monthIndex, resolvedMonthLabels, focusedField]);
-    const filteredMonths = React63.useMemo(() => {
+    const filteredMonths = React64.useMemo(() => {
       const all = resolvedMonthLabels.map((label2, index) => ({ label: label2, index }));
       const query = monthInputValue.trim().toLowerCase();
       const currentLabel = monthIndex !== null ? resolvedMonthLabels[monthIndex] ?? "" : "";
       if (!query || monthInputValue === currentLabel) return all;
       return all.filter((opt) => opt.label.toLowerCase().includes(query));
     }, [monthInputValue, monthIndex, resolvedMonthLabels]);
-    React63.useEffect(() => {
+    React64.useEffect(() => {
       if (!isMonthOpen) {
         setMonthHighlightIndex(-1);
         return;
@@ -15864,7 +15965,7 @@ var DashboardDatepicker = React63.forwardRef(
     const isFocused = focusedField !== null || isMonthOpen || isWheelOpen;
     const isInvalid = Boolean(invalid || error);
     const wrapperWidth = toCssSize(width);
-    const currentDate = React63.useMemo(
+    const currentDate = React64.useMemo(
       () => dateFromParts(day, monthIndex, year),
       [day, monthIndex, year]
     );
@@ -15873,7 +15974,7 @@ var DashboardDatepicker = React63.forwardRef(
       onOutsideClick: () => setIsMonthOpen(false),
       isDisabled: !isMonthOpen || isMobile2
     });
-    const emitChange = React63.useCallback(
+    const emitChange = React64.useCallback(
       (nextDay, nextMonth, nextYear) => {
         if (!onChange) return;
         const date = dateFromParts(nextDay, nextMonth, nextYear);
@@ -15908,7 +16009,7 @@ var DashboardDatepicker = React63.forwardRef(
       setIsMonthOpen(true);
       setMonthHighlightIndex(0);
     };
-    const commitMonthInput = React63.useCallback(() => {
+    const commitMonthInput = React64.useCallback(() => {
       const query = monthInputValue.trim().toLowerCase();
       if (!query) {
         if (monthIndex !== null) {
@@ -15968,15 +16069,15 @@ var DashboardDatepicker = React63.forwardRef(
         setIsMonthOpen(false);
       }
     };
-    const focusDayInput = React63.useCallback(() => {
+    const focusDayInput = React64.useCallback(() => {
       if (isBlocked || readOnly) return;
       dayInputRef.current?.focus();
     }, [isBlocked, readOnly]);
-    const openWheel = React63.useCallback(() => {
+    const openWheel = React64.useCallback(() => {
       if (isBlocked || readOnly) return;
       setIsWheelOpen(true);
     }, [isBlocked, readOnly]);
-    const closeWheel = React63.useCallback(() => {
+    const closeWheel = React64.useCallback(() => {
       setIsWheelOpen(false);
       mobileTriggerRef.current?.focus();
     }, []);
@@ -15989,7 +16090,7 @@ var DashboardDatepicker = React63.forwardRef(
       minDate,
       maxDate
     });
-    const handleWheelDone = React63.useCallback(() => {
+    const handleWheelDone = React64.useCallback(() => {
       const next = wheel.draftDate;
       setDay(String(next.getDate()));
       setMonthIndex(next.getMonth());
@@ -15998,14 +16099,14 @@ var DashboardDatepicker = React63.forwardRef(
       setIsWheelOpen(false);
       mobileTriggerRef.current?.focus();
     }, [name, onChange, wheel.draftDate]);
-    const defaultFormatValue = React63.useCallback(
+    const defaultFormatValue = React64.useCallback(
       (date) => `${date.getDate()} ${resolvedMonthLabels[date.getMonth()]} ${date.getFullYear()}`,
       [resolvedMonthLabels]
     );
     const triggerText = currentDate ? (formatValue ?? defaultFormatValue)(currentDate) : void 0;
     const monthListboxId = `${monthId}-listbox`;
     const getMonthOptionId = (index) => `${monthId}-option-${index}`;
-    const monthPanelContent = filteredMonths.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("div", { className: "px-4 py-3 text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: t("no_options") }) : /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+    const monthPanelContent = filteredMonths.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("div", { className: "px-4 py-3 text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: t("no_options") }) : /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
       "ul",
       {
         ref: monthListRef,
@@ -16016,7 +16117,7 @@ var DashboardDatepicker = React63.forwardRef(
         children: filteredMonths.map((option, position) => {
           const isSelected = option.index === monthIndex;
           const isHighlighted = position === monthHighlightIndex;
-          return /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("li", { role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("li", { role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
             "button",
             {
               id: getMonthOptionId(option.index),
@@ -16043,7 +16144,7 @@ var DashboardDatepicker = React63.forwardRef(
       isBlocked && "cursor-not-allowed",
       loading && "cursor-progress"
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
       "div",
       {
         ref: containerRef,
@@ -16054,9 +16155,9 @@ var DashboardDatepicker = React63.forwardRef(
           className
         ),
         style: wrapperWidth ? { width: wrapperWidth } : void 0,
-        children: /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)("div", { className: "relative w-full", children: [
-            isMobile2 ? /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)("div", { className: "relative w-full", children: [
+            isMobile2 ? /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)(
               "button",
               {
                 ref: mobileTriggerRef,
@@ -16075,10 +16176,10 @@ var DashboardDatepicker = React63.forwardRef(
                   (isBlocked || readOnly) && "cursor-not-allowed"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left", children: triggerText ?? (isWheelOpen ? mobilePlaceholder : null) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: [
-                    loading && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
-                    /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left", children: triggerText ?? (isWheelOpen ? mobilePlaceholder : null) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: [
+                    loading && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
+                    /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
                       import_lucide_react49.ChevronDown,
                       {
                         size: 16,
@@ -16091,14 +16192,14 @@ var DashboardDatepicker = React63.forwardRef(
                   ] })
                 ]
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)(
+            ) : /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)(
               "div",
               {
                 className: cn(
                   "relative box-border grid h-12 w-full grid-cols-[minmax(0,1fr)_minmax(96px,140px)_minmax(0,1fr)] items-center rounded-[6px] text-[16px] font-medium text-[var(--chekin-color-brand-navy)]"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
                     "input",
                     {
                       ref: dayInputRef,
@@ -16120,8 +16221,8 @@ var DashboardDatepicker = React63.forwardRef(
                       className: subInputClass
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)("div", { className: "relative flex h-full min-w-0 items-center gap-1 border-x border-[var(--chekin-color-gray-3)] px-2 sm:px-3", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)("div", { className: "relative flex h-full min-w-0 items-center gap-1 border-x border-[var(--chekin-color-gray-3)] px-2 sm:px-3", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
                       "input",
                       {
                         ref: monthInputRef,
@@ -16164,7 +16265,7 @@ var DashboardDatepicker = React63.forwardRef(
                         )
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
                       import_lucide_react49.ChevronDown,
                       {
                         size: 14,
@@ -16181,8 +16282,8 @@ var DashboardDatepicker = React63.forwardRef(
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
                       "input",
                       {
                         ref: yearInputRef,
@@ -16204,7 +16305,7 @@ var DashboardDatepicker = React63.forwardRef(
                         className: subInputClass
                       }
                     ),
-                    loading && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+                    loading && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
                       ThreeDotsLoader,
                       {
                         height: 18,
@@ -16216,7 +16317,7 @@ var DashboardDatepicker = React63.forwardRef(
                 ]
               }
             ),
-            showCoverage && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+            showCoverage && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
               "div",
               {
                 className: "absolute inset-0 cursor-text rounded-[6px] bg-[var(--chekin-color-surface-input-empty)]",
@@ -16224,7 +16325,7 @@ var DashboardDatepicker = React63.forwardRef(
                 "aria-hidden": "true"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
               Fieldset,
               {
                 isFocused,
@@ -16242,9 +16343,9 @@ var DashboardDatepicker = React63.forwardRef(
                 onClick: isMobile2 ? openWheel : showCoverage ? focusDayInput : void 0
               }
             ),
-            isMonthOpen && !isMobile2 && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("div", { className: "absolute left-0 right-0 top-full z-30 mx-auto mt-1 w-full max-w-[260px] overflow-hidden rounded-md bg-white shadow-[0_30px_30px_0_rgba(33,72,255,0.2)] sm:left-1/2 sm:right-auto sm:-translate-x-1/2", children: monthPanelContent })
+            isMonthOpen && !isMobile2 && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("div", { className: "absolute left-0 right-0 top-full z-30 mx-auto mt-1 w-full max-w-[260px] overflow-hidden rounded-md bg-white shadow-[0_30px_30px_0_rgba(33,72,255,0.2)] sm:left-1/2 sm:right-auto sm:-translate-x-1/2", children: monthPanelContent })
           ] }),
-          isMobile2 && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+          isMobile2 && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
             DatePickerContent,
             {
               baseId: wheelBaseId,
@@ -16272,9 +16373,9 @@ var DashboardDatepicker = React63.forwardRef(
               onOptionSelect: wheel.handleOptionSelect
             }
           ),
-          !error && optional && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
-          !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-          error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
+          !error && optional && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
+          !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+          error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
             FieldErrorMessage,
             {
               id: errorId,
@@ -16289,7 +16390,7 @@ var DashboardDatepicker = React63.forwardRef(
 );
 
 // src/dashboard/date-range-picker/DateRangePicker.tsx
-var React67 = __toESM(require("react"), 1);
+var React68 = __toESM(require("react"), 1);
 var import_react_i18next36 = require("react-i18next");
 
 // src/dashboard/date-range-picker/isDayBlocked.ts
@@ -16368,7 +16469,7 @@ var createDisabledMatchers = ({
 };
 
 // src/dashboard/date-range-picker/hooks/useRangeValue.ts
-var React64 = __toESM(require("react"), 1);
+var React65 = __toESM(require("react"), 1);
 var getRangeKey = (range) => `${range?.from?.getTime() ?? ""}-${range?.to?.getTime() ?? ""}`;
 function useRangeValue({
   value: externalValue,
@@ -16377,10 +16478,10 @@ function useRangeValue({
   name
 }) {
   const isControlled = externalValue !== void 0;
-  const [draft, setDraft] = React64.useState(
+  const [draft, setDraft] = React65.useState(
     isControlled ? externalValue : defaultValue
   );
-  const lastExternalKeyRef = React64.useRef(getRangeKey(externalValue));
+  const lastExternalKeyRef = React65.useRef(getRangeKey(externalValue));
   if (isControlled) {
     const externalKey = getRangeKey(externalValue);
     if (externalKey !== lastExternalKeyRef.current) {
@@ -16388,7 +16489,7 @@ function useRangeValue({
       setDraft(externalValue);
     }
   }
-  const commit = React64.useCallback(
+  const commit = React65.useCallback(
     (next) => {
       setDraft(next);
       if (next === void 0) {
@@ -16403,7 +16504,7 @@ function useRangeValue({
 }
 
 // src/dashboard/date-range-picker/hooks/useRangeTextInputs.ts
-var React65 = __toESM(require("react"), 1);
+var React66 = __toESM(require("react"), 1);
 function useRangeTextInputs({
   value,
   format: format2,
@@ -16411,13 +16512,13 @@ function useRangeTextInputs({
   onCommit,
   onBlur
 }) {
-  const [fromText, setFromText] = React65.useState(value?.from ? format2(value.from) : "");
-  const [toText, setToText] = React65.useState(value?.to ? format2(value.to) : "");
-  React65.useEffect(() => {
+  const [fromText, setFromText] = React66.useState(value?.from ? format2(value.from) : "");
+  const [toText, setToText] = React66.useState(value?.to ? format2(value.to) : "");
+  React66.useEffect(() => {
     setFromText(value?.from ? format2(value.from) : "");
     setToText(value?.to ? format2(value.to) : "");
   }, [format2, value?.from, value?.to]);
-  const handleFromBlur = React65.useCallback(() => {
+  const handleFromBlur = React66.useCallback(() => {
     if (!fromText) {
       const next = { from: void 0, to: value?.to };
       onCommit(next);
@@ -16434,7 +16535,7 @@ function useRangeTextInputs({
     setFromText(value?.from ? format2(value.from) : "");
     return void 0;
   }, [format2, fromText, onBlur, onCommit, parse3, value?.from, value?.to]);
-  const handleToBlur = React65.useCallback(() => {
+  const handleToBlur = React66.useCallback(() => {
     if (!toText) {
       const next = { from: value?.from, to: void 0 };
       onCommit(next);
@@ -16461,21 +16562,21 @@ function useRangeTextInputs({
 }
 
 // src/dashboard/date-range-picker/hooks/useRangeMonthSync.ts
-var React66 = __toESM(require("react"), 1);
+var React67 = __toESM(require("react"), 1);
 function useRangeMonthSync(value) {
-  const isPreloadedRef = React66.useRef(false);
-  const [month, setMonth] = React66.useState(value?.from ?? /* @__PURE__ */ new Date());
-  React66.useEffect(() => {
+  const isPreloadedRef = React67.useRef(false);
+  const [month, setMonth] = React67.useState(value?.from ?? /* @__PURE__ */ new Date());
+  React67.useEffect(() => {
     if (value?.from && !isPreloadedRef.current) {
       setMonth(value.from);
       isPreloadedRef.current = true;
     }
   }, [value?.from]);
-  const syncMonthToValue = React66.useCallback((next) => {
+  const syncMonthToValue = React67.useCallback((next) => {
     isPreloadedRef.current = true;
     if (next?.from) setMonth(next.from);
   }, []);
-  const resetPreload = React66.useCallback(() => {
+  const resetPreload = React67.useCallback(() => {
     isPreloadedRef.current = false;
   }, []);
   return { month, setMonth, syncMonthToValue, resetPreload };
@@ -16501,7 +16602,7 @@ function resolveRangeSelection({
 
 // src/dashboard/date-range-picker/components/DateRangeInputs.tsx
 var import_lucide_react50 = require("lucide-react");
-var import_jsx_runtime169 = require("react/jsx-runtime");
+var import_jsx_runtime170 = require("react/jsx-runtime");
 var DEFAULT_PLACEHOLDER = "00-00-0000";
 var inputBaseClass = "m-0 box-border h-full w-full min-w-0 border-0 bg-transparent text-[16px] font-medium leading-5 text-[var(--chekin-color-brand-navy)] outline-none placeholder:text-[var(--chekin-color-gray-1)]";
 var iconButtonClass = "flex h-5 w-5 items-center justify-center rounded-[3px] border-0 bg-transparent p-0 text-[#9696b9] outline-none hover:shadow-[0_3px_3px_#0f477734] disabled:cursor-not-allowed";
@@ -16543,7 +16644,7 @@ function DateRangeInputs({
     isBlocked && "cursor-not-allowed",
     loading && "cursor-progress"
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime170.jsxs)(
     "div",
     {
       className: cn(
@@ -16552,7 +16653,7 @@ function DateRangeInputs({
       ),
       onClick: onRowClick,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
           "input",
           {
             ref: fromInputRef,
@@ -16576,7 +16677,7 @@ function DateRangeInputs({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
           "span",
           {
             "aria-hidden": "true",
@@ -16587,7 +16688,7 @@ function DateRangeInputs({
             children: "\u2192"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
           "input",
           {
             ref: toInputRef,
@@ -16611,9 +16712,9 @@ function DateRangeInputs({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)("span", { className: "ml-auto flex shrink-0 items-center gap-2 pl-2 text-[var(--chekin-color-gray-2)]", children: [
-          loading && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
-          !readOnly && !hideClearDates && !isEmpty && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime170.jsxs)("span", { className: "ml-auto flex shrink-0 items-center gap-2 pl-2 text-[var(--chekin-color-gray-2)]", children: [
+          loading && /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
+          !readOnly && !hideClearDates && !isEmpty && /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
             "button",
             {
               type: "button",
@@ -16621,10 +16722,10 @@ function DateRangeInputs({
               onClick: onReset,
               className: iconButtonClass,
               "aria-label": clearLabel,
-              children: /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(import_lucide_react50.SquareX, { size: 16, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+              children: /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(import_lucide_react50.SquareX, { size: 16, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
             }
           ),
-          !readOnly && !hideCalendarIcon && /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+          !readOnly && !hideCalendarIcon && /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
             "button",
             {
               type: "button",
@@ -16636,7 +16737,7 @@ function DateRangeInputs({
                 focusedInput !== null || isOpen ? "text-[var(--chekin-color-brand-blue)]" : "text-[var(--chekin-color-gray-2)]"
               ),
               "aria-label": openCalendarLabel,
-              children: /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(import_lucide_react50.CalendarDays, { size: 18 })
+              children: /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(import_lucide_react50.CalendarDays, { size: 18 })
             }
           )
         ] })
@@ -16646,7 +16747,7 @@ function DateRangeInputs({
 }
 
 // src/dashboard/date-range-picker/components/DateRangeCalendar.tsx
-var import_jsx_runtime170 = require("react/jsx-runtime");
+var import_jsx_runtime171 = require("react/jsx-runtime");
 function DateRangeCalendar({
   value,
   month,
@@ -16662,7 +16763,7 @@ function DateRangeCalendar({
   components,
   ...dayPickerProps
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(
     Calendar,
     {
       mode: "range",
@@ -16685,7 +16786,7 @@ function DateRangeCalendar({
 }
 
 // src/dashboard/date-range-picker/components/DateRangePopover.tsx
-var import_jsx_runtime171 = require("react/jsx-runtime");
+var import_jsx_runtime172 = require("react/jsx-runtime");
 function DateRangePopover({
   isOpen,
   isMobile: isMobile2,
@@ -16697,30 +16798,30 @@ function DateRangePopover({
 }) {
   if (!isOpen) return null;
   if (isMobile2) {
-    return /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
       Drawer,
       {
         open: isOpen,
         onOpenChange: (next) => {
           if (!next) onClose();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime171.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)(
           DrawerContent,
           {
             onClose,
             lockScroll: false,
             className: "max-h-[calc(100vh-1rem)]",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(DrawerTitle, { className: "sr-only", children: drawerTitle }),
-              /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(DrawerDescription, { className: "sr-only", children: drawerDescription }),
-              /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("div", { className: "flex items-start justify-center overflow-x-auto px-2 pb-4 pt-1", children })
+              /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(DrawerTitle, { className: "sr-only", children: drawerTitle }),
+              /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(DrawerDescription, { className: "sr-only", children: drawerDescription }),
+              /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("div", { className: "flex items-start justify-center overflow-x-auto px-2 pb-4 pt-1", children })
             ]
           }
         )
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
     "div",
     {
       className: cn(
@@ -16733,8 +16834,8 @@ function DateRangePopover({
 }
 
 // src/dashboard/date-range-picker/DateRangePicker.tsx
-var import_jsx_runtime172 = require("react/jsx-runtime");
-var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePicker2({
+var import_jsx_runtime173 = require("react/jsx-runtime");
+var DashboardDateRangePicker = React68.forwardRef(function DashboardDateRangePicker2({
   label,
   value: externalValue,
   defaultValue,
@@ -16768,20 +16869,20 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
   components: customComponents,
   ...dayPickerProps
 }, ref) {
-  const containerRef = React67.useRef(null);
-  const fromInputRef = React67.useRef(null);
-  const toInputRef = React67.useRef(null);
-  const reactId = React67.useId();
+  const containerRef = React68.useRef(null);
+  const fromInputRef = React68.useRef(null);
+  const toInputRef = React68.useRef(null);
+  const reactId = React68.useId();
   const baseId = name ?? `dash-daterange-${reactId}`;
   const fromId = `${baseId}-from`;
   const toId = `${baseId}-to`;
   const labelId = `${baseId}-label`;
   const errorId = `${baseId}-error`;
-  const normalizedValue = React67.useMemo(() => {
+  const normalizedValue = React68.useMemo(() => {
     if (externalValue === void 0) return void 0;
     return { from: toDate(externalValue?.from), to: toDate(externalValue?.to) };
   }, [externalValue]);
-  const normalizedDefaultValue = React67.useMemo(() => {
+  const normalizedDefaultValue = React68.useMemo(() => {
     if (defaultValue === void 0) return void 0;
     return { from: toDate(defaultValue?.from), to: toDate(defaultValue?.to) };
   }, [defaultValue]);
@@ -16791,10 +16892,10 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
     onChange,
     name
   });
-  const normalizedMinDate = React67.useMemo(() => toDate(minDate), [minDate]);
-  const normalizedMaxDate = React67.useMemo(() => toDate(maxDate), [maxDate]);
-  const formatter = React67.useMemo(() => formatDate(displayFormat), [displayFormat]);
-  const parser = React67.useMemo(() => parseDate(displayFormat), [displayFormat]);
+  const normalizedMinDate = React68.useMemo(() => toDate(minDate), [minDate]);
+  const normalizedMaxDate = React68.useMemo(() => toDate(maxDate), [maxDate]);
+  const formatter = React68.useMemo(() => formatDate(displayFormat), [displayFormat]);
+  const parser = React68.useMemo(() => parseDate(displayFormat), [displayFormat]);
   const { fromText, toText, setFromText, setToText, handleFromBlur, handleToBlur } = useRangeTextInputs({
     value,
     format: formatter,
@@ -16803,9 +16904,9 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
     onBlur
   });
   const { month, setMonth, syncMonthToValue } = useRangeMonthSync(value);
-  const [isOpen, setIsOpen] = React67.useState(false);
-  const [focusedInput, setFocusedInput] = React67.useState(null);
-  const [autoFocus, setAutoFocus] = React67.useState(false);
+  const [isOpen, setIsOpen] = React68.useState(false);
+  const [focusedInput, setFocusedInput] = React68.useState(null);
+  const [autoFocus, setAutoFocus] = React68.useState(false);
   const isMobile2 = useIsMobile();
   const { t } = (0, import_react_i18next36.useTranslation)();
   const drawerTitle = label ?? t("select_dates");
@@ -16816,13 +16917,13 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
   const isFocused = focusedInput !== null || isOpen;
   const wrapperWidth = toCssSize(width);
   const monthsToShow = numberOfMonths ?? (isMobile2 ? 1 : 2);
-  const closeCalendar = React67.useCallback(() => {
+  const closeCalendar = React68.useCallback(() => {
     setIsOpen(false);
     setFocusedInput(null);
     setAutoFocus(false);
     if (value?.from) setMonth(value.from);
   }, [setMonth, value?.from]);
-  const openCalendar = React67.useCallback(() => {
+  const openCalendar = React68.useCallback(() => {
     if (isBlocked || readOnly) return;
     setIsOpen(true);
   }, [isBlocked, readOnly]);
@@ -16831,7 +16932,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
     onOutsideClick: closeCalendar,
     isDisabled: !isOpen || isMobile2
   });
-  const handlePickerChange = React67.useCallback(
+  const handlePickerChange = React68.useCallback(
     (range, pickedDate) => {
       const { next, shouldClose } = resolveRangeSelection({
         previous: value,
@@ -16852,7 +16953,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
     setToText("");
     setMonth(/* @__PURE__ */ new Date());
   };
-  const disabledMatchers = React67.useMemo(
+  const disabledMatchers = React68.useMemo(
     () => createDisabledMatchers({
       minDate: normalizedMinDate,
       maxDate: normalizedMaxDate,
@@ -16871,7 +16972,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
     openCalendar();
     if (autoFocusOnOpen) setAutoFocus(true);
   };
-  React67.useImperativeHandle(
+  React68.useImperativeHandle(
     ref,
     () => ({
       setDateRange: (range) => {
@@ -16894,7 +16995,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
       syncMonthToValue
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
     "div",
     {
       ref: containerRef,
@@ -16905,9 +17006,9 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
         className
       ),
       style: wrapperWidth ? { width: wrapperWidth } : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)("div", { className: "relative w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
             DateRangeInputs,
             {
               fromId,
@@ -16958,7 +17059,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
               onToggleCalendar: toggleCalendar
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
             Fieldset,
             {
               isFocused,
@@ -16975,7 +17076,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
               tooltip
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
             DateRangePopover,
             {
               isOpen: isOpen && !isMobile2,
@@ -16984,7 +17085,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
               drawerTitle,
               drawerDescription,
               onClose: closeCalendar,
-              children: /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
                 DateRangeCalendar,
                 {
                   value,
@@ -17005,7 +17106,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
           DateRangePopover,
           {
             isOpen: isOpen && isMobile2,
@@ -17014,7 +17115,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
             drawerTitle,
             drawerDescription,
             onClose: closeCalendar,
-            children: /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
               DateRangeCalendar,
               {
                 value,
@@ -17034,9 +17135,9 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
             )
           }
         ),
-        !error && optional && /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
-        !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-        error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+        !error && optional && /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
+        !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+        error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
           FieldErrorMessage,
           {
             id: errorId,
@@ -17050,7 +17151,7 @@ var DashboardDateRangePicker = React67.forwardRef(function DashboardDateRangePic
 });
 
 // src/dashboard/date-range-picker/useValidateDates.ts
-var React68 = __toESM(require("react"), 1);
+var React69 = __toESM(require("react"), 1);
 var import_react_i18next37 = require("react-i18next");
 var import_date_fns4 = require("date-fns");
 var import_react_day_picker2 = require("react-day-picker");
@@ -17073,11 +17174,11 @@ function useValidateDates({
   const { t } = (0, import_react_i18next37.useTranslation)();
   const handleError = useEvent(onError);
   const handleSuccess = useEvent(onSuccess);
-  const errorFormatter = React68.useMemo(
+  const errorFormatter = React69.useMemo(
     () => formatDate(displayFormat ?? DEFAULT_DISPLAY_FORMAT),
     [displayFormat]
   );
-  const validateDates = React68.useCallback(
+  const validateDates = React69.useCallback(
     (dates) => {
       const startDate = dates?.from;
       const endDate = dates?.to;
@@ -17127,9 +17228,9 @@ function useValidateDates({
 }
 
 // src/dashboard/time-picker/TimePicker.tsx
-var React69 = __toESM(require("react"), 1);
+var React70 = __toESM(require("react"), 1);
 var import_date_fns5 = require("date-fns");
-var import_jsx_runtime173 = require("react/jsx-runtime");
+var import_jsx_runtime174 = require("react/jsx-runtime");
 var SHORT_TIME_FORMAT = "HH:mm";
 function parseTime(value) {
   return (0, import_date_fns5.parse)(value, SHORT_TIME_FORMAT, /* @__PURE__ */ new Date());
@@ -17171,22 +17272,22 @@ var FORMAT_SETTINGS = {
   },
   hours: { intervalUnit: "H", interval: 1, minTime: "00:00", maxTime: "23:00" }
 };
-var DashboardTimePicker = React69.forwardRef(
+var DashboardTimePicker = React70.forwardRef(
   function DashboardTimePicker2({ format: formatName = "time", timeSettings, options, ...selectProps }, ref) {
-    const resolvedOptions = React69.useMemo(() => {
+    const resolvedOptions = React70.useMemo(() => {
       if (options) return options;
       const settings = timeSettings ?? FORMAT_SETTINGS[formatName];
       return buildOptions(settings);
     }, [formatName, options, timeSettings]);
-    return /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(DashboardSelect, { ref, ...selectProps, options: resolvedOptions });
+    return /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(DashboardSelect, { ref, ...selectProps, options: resolvedOptions });
   }
 );
 
 // src/dashboard/file-input/FileInput.tsx
-var React70 = __toESM(require("react"), 1);
+var React71 = __toESM(require("react"), 1);
 var import_lucide_react51 = require("lucide-react");
 var import_react_i18next38 = require("react-i18next");
-var import_jsx_runtime174 = require("react/jsx-runtime");
+var import_jsx_runtime175 = require("react/jsx-runtime");
 function defaultFileNameFromUrl(url) {
   try {
     const parsed = new URL(url);
@@ -17199,7 +17300,7 @@ function defaultFileNameFromUrl(url) {
 function defaultDownload(url) {
   window.open(url, "_blank", "noopener,noreferrer");
 }
-var DashboardFileInput = React70.forwardRef(
+var DashboardFileInput = React71.forwardRef(
   function DashboardFileInput2({
     label,
     value,
@@ -17223,12 +17324,12 @@ var DashboardFileInput = React70.forwardRef(
     downloadLabel,
     fileNameFromUrl = defaultFileNameFromUrl
   }, ref) {
-    const internalRef = React70.useRef(null);
+    const internalRef = React71.useRef(null);
     const inputRef = useCombinedRef(ref, internalRef);
     const { t } = (0, import_react_i18next38.useTranslation)();
     const resolvedLabel = label ?? t("upload_file");
     const resolvedDownloadLabel = downloadLabel ?? t("download_attachment");
-    const reactId = React70.useId();
+    const reactId = React71.useId();
     const inputId = `${name || "dash-file"}-${reactId}`;
     const labelId = `${inputId}-label`;
     const errorId = `${inputId}-error`;
@@ -17254,7 +17355,7 @@ var DashboardFileInput = React70.forwardRef(
       event.stopPropagation();
       if (isUrl) onDownload(value);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(
       "label",
       {
         htmlFor: inputId,
@@ -17267,7 +17368,7 @@ var DashboardFileInput = React70.forwardRef(
         ),
         style: wrapperWidth ? { width: wrapperWidth } : void 0,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
             "input",
             {
               ref: inputRef,
@@ -17283,9 +17384,9 @@ var DashboardFileInput = React70.forwardRef(
               "aria-invalid": isInvalid
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("div", { className: "relative w-full", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)("div", { className: "relative min-h-[68px] w-full", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)("div", { className: "relative w-full", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(
                 "div",
                 {
                   className: cn(
@@ -17293,25 +17394,25 @@ var DashboardFileInput = React70.forwardRef(
                     isEmpty && "bg-[var(--chekin-color-surface-input-empty)]"
                   ),
                   children: [
-                    hasFileChip ? /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)(
+                    hasFileChip ? /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(
                       "div",
                       {
                         className: "inline-flex h-6 max-w-[85%] items-center rounded-[4px] border border-[#acacd5] bg-[#f0f0f8] pl-[10px] pr-1",
                         onClick: (event) => event.preventDefault(),
                         children: [
-                          isUrl ? /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)(
+                          isUrl ? /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(
                             "button",
                             {
                               type: "button",
                               onClick: handleDownload,
                               className: "inline-flex items-center gap-[7px] truncate border-0 bg-transparent p-0 text-[14px] font-medium text-[var(--chekin-color-brand-navy)] outline-none",
                               children: [
-                                /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "truncate", children: resolvedDownloadLabel }),
-                                /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(import_lucide_react51.Download, { size: 15 })
+                                /* @__PURE__ */ (0, import_jsx_runtime175.jsx)("span", { className: "truncate", children: resolvedDownloadLabel }),
+                                /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(import_lucide_react51.Download, { size: 15 })
                               ]
                             }
-                          ) : /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "truncate text-[14px] font-medium text-[var(--chekin-color-brand-navy)]", children: value.name }),
-                          /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+                          ) : /* @__PURE__ */ (0, import_jsx_runtime175.jsx)("span", { className: "truncate text-[14px] font-medium text-[var(--chekin-color-brand-navy)]", children: value.name }),
+                          /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
                             "button",
                             {
                               type: "button",
@@ -17319,20 +17420,20 @@ var DashboardFileInput = React70.forwardRef(
                               onClick: handleClear,
                               className: "ml-2 flex h-[15px] w-[15px] items-center justify-center rounded-[3px] border-0 bg-transparent p-0 text-[#9696b9] outline-none hover:shadow-[0_3px_3px_#0f477734]",
                               "aria-label": t("remove_file"),
-                              children: /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(import_lucide_react51.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+                              children: /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(import_lucide_react51.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
                             }
                           )
                         ]
                       }
-                    ) : /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left text-[var(--chekin-color-gray-1)]", children: placeholder ?? "" }),
-                    /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("span", { className: "ml-auto flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: [
-                      loading && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
-                      /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(import_lucide_react51.Paperclip, { size: 20 })
+                    ) : /* @__PURE__ */ (0, import_jsx_runtime175.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left text-[var(--chekin-color-gray-1)]", children: placeholder ?? "" }),
+                    /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)("span", { className: "ml-auto flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: [
+                      loading && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(ThreeDotsLoader, { height: 18, width: 18 }),
+                      /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(import_lucide_react51.Paperclip, { size: 20 })
                     ] })
                   ]
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
                 Fieldset,
                 {
                   isFocused: false,
@@ -17350,9 +17451,9 @@ var DashboardFileInput = React70.forwardRef(
                 }
               )
             ] }),
-            !error && optional && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
-            !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-            error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+            !error && optional && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)("span", { className: "mt-[1px] block text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: typeof optional === "string" ? optional : t("optional") }),
+            !error && helperText && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+            error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
               FieldErrorMessage,
               {
                 id: errorId,
@@ -17368,8 +17469,8 @@ var DashboardFileInput = React70.forwardRef(
 );
 
 // src/dashboard/select-icons-box/SelectIconsBox.tsx
-var React71 = __toESM(require("react"), 1);
-var import_jsx_runtime175 = require("react/jsx-runtime");
+var React72 = __toESM(require("react"), 1);
+var import_jsx_runtime176 = require("react/jsx-runtime");
 function DashboardSelectIconsBox({
   children,
   icons,
@@ -17384,9 +17485,9 @@ function DashboardSelectIconsBox({
   className,
   boxClassName
 }) {
-  const containerRef = React71.useRef(null);
+  const containerRef = React72.useRef(null);
   const isControlled = controlledOpen !== void 0;
-  const [internalOpen, setInternalOpen] = React71.useState(defaultOpen);
+  const [internalOpen, setInternalOpen] = React72.useState(defaultOpen);
   const isOpen = isControlled ? controlledOpen : internalOpen;
   const setOpen = (next) => {
     if (!isControlled) setInternalOpen(next);
@@ -17405,7 +17506,7 @@ function DashboardSelectIconsBox({
     onSelect(iconName);
     setOpen(false);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime176.jsxs)(
     "div",
     {
       ref: containerRef,
@@ -17413,7 +17514,7 @@ function DashboardSelectIconsBox({
       className: cn("relative inline-block", className),
       children: [
         children,
-        isOpen && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
+        isOpen && /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
           "div",
           {
             className: cn(
@@ -17424,7 +17525,7 @@ function DashboardSelectIconsBox({
               boxClassName
             ),
             style: { gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))` },
-            children: icons.map((iconName) => /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
+            children: icons.map((iconName) => /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
               "button",
               {
                 type: "button",
@@ -17444,11 +17545,11 @@ function DashboardSelectIconsBox({
 }
 
 // src/searchable-select/SearchableSelect.tsx
-var React72 = __toESM(require("react"), 1);
+var React73 = __toESM(require("react"), 1);
 var import_lucide_react52 = require("lucide-react");
 var import_react_virtual3 = require("@tanstack/react-virtual");
 var import_react82 = require("react");
-var import_jsx_runtime176 = require("react/jsx-runtime");
+var import_jsx_runtime177 = require("react/jsx-runtime");
 var ROW_HEIGHT = 48;
 var DESKTOP_LIST_HEIGHT = 280;
 var MOBILE_LIST_HEIGHT = 420;
@@ -17489,13 +17590,13 @@ var SearchableSelectInternal = ({
   loadingMessage
 }, ref) => {
   const { isMatch: isMobile2 } = useScreenResize(DEVICE.mobileXL);
-  const reactId = React72.useId();
-  const [open, setOpen] = React72.useState(false);
-  const [internalSearchValue, setInternalSearchValue] = React72.useState("");
-  const [highlightedIndex, setHighlightedIndex] = React72.useState(-1);
-  const containerRef = React72.useRef(null);
-  const triggerRef = React72.useRef(null);
-  const inputRef = React72.useRef(null);
+  const reactId = React73.useId();
+  const [open, setOpen] = React73.useState(false);
+  const [internalSearchValue, setInternalSearchValue] = React73.useState("");
+  const [highlightedIndex, setHighlightedIndex] = React73.useState(-1);
+  const containerRef = React73.useRef(null);
+  const triggerRef = React73.useRef(null);
+  const inputRef = React73.useRef(null);
   const listboxId = `${reactId}-listbox`;
   const labelId = `${reactId}-label`;
   const valueId = `${reactId}-value`;
@@ -17504,13 +17605,13 @@ var SearchableSelectInternal = ({
   const searchInputId = `${reactId}-search`;
   const effectiveSearchValue = searchValue ?? internalSearchValue;
   const shouldFilterLocally = !onSearchChange && filterOption !== null;
-  const visibleOptions = React72.useMemo(() => {
+  const visibleOptions = React73.useMemo(() => {
     if (!shouldFilterLocally || !effectiveSearchValue) {
       return options;
     }
     return options.filter((option) => filterOption(option, effectiveSearchValue));
   }, [effectiveSearchValue, filterOption, options, shouldFilterLocally]);
-  const selectedIndex = React72.useMemo(
+  const selectedIndex = React73.useMemo(
     () => visibleOptions.findIndex((option) => option.value === value?.value),
     [value?.value, visibleOptions]
   );
@@ -17536,7 +17637,7 @@ var SearchableSelectInternal = ({
     },
     [handleOnOpenChange]
   );
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     if (isBlocked) {
       setSelectOpen(false);
       return;
@@ -17549,7 +17650,7 @@ var SearchableSelectInternal = ({
       window.cancelAnimationFrame(frameId);
     };
   }, [isBlocked, open, setSelectOpen]);
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     if (!open) {
       setHighlightedIndex(-1);
       return;
@@ -17617,7 +17718,7 @@ var SearchableSelectInternal = ({
       }
     }
   }
-  const content = /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
     SearchableSelectContent,
     {
       inputId: searchInputId,
@@ -17644,10 +17745,10 @@ var SearchableSelectInternal = ({
       onOptionHover: setHighlightedIndex
     }
   );
-  React72.useImperativeHandle(ref, () => triggerRef.current, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime176.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
-    name && /* @__PURE__ */ (0, import_jsx_runtime176.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+  React73.useImperativeHandle(ref, () => triggerRef.current, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
+    name && /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
+    /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
       FieldTrigger,
       {
         id: `${reactId}-trigger`,
@@ -17682,7 +17783,7 @@ var SearchableSelectInternal = ({
         },
         onKeyDown: handleTriggerKeyDown,
         onBlur,
-        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
           import_lucide_react52.ChevronDown,
           {
             className: cn(
@@ -17693,7 +17794,7 @@ var SearchableSelectInternal = ({
         )
       }
     ),
-    isMobile2 ? /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+    isMobile2 ? /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
       Drawer,
       {
         open,
@@ -17705,13 +17806,13 @@ var SearchableSelectInternal = ({
           }
           closeSelect();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime176.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
-          /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(DrawerDescription, { className: "sr-only", children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime176.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
+        children: /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
+          /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
         ] })
       }
-    ) : open ? /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+    ) : open ? /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
       "div",
       {
         className: cn(
@@ -17723,7 +17824,7 @@ var SearchableSelectInternal = ({
     ) : null
   ] });
 };
-var SearchableSelect = React72.forwardRef(
+var SearchableSelect = React73.forwardRef(
   SearchableSelectInternal
 );
 function SearchableSelectContent({
@@ -17750,9 +17851,9 @@ function SearchableSelectContent({
   onOptionClick,
   onOptionHover
 }) {
-  const listRef = React72.useRef(null);
-  const lastLoadMoreOptionsLengthRef = React72.useRef(null);
-  const previousHighlightedIndexRef = React72.useRef(highlightedIndex);
+  const listRef = React73.useRef(null);
+  const lastLoadMoreOptionsLengthRef = React73.useRef(null);
+  const previousHighlightedIndexRef = React73.useRef(highlightedIndex);
   const rowCount = options.length + (loading && options.length > 0 ? 1 : 0);
   const virtualizer = (0, import_react_virtual3.useVirtualizer)({
     count: rowCount,
@@ -17763,7 +17864,7 @@ function SearchableSelectContent({
   const virtualItems = virtualizer.getVirtualItems();
   const emptyMessage = noOptionsMessage?.() ?? "No matches found";
   const loadingText = loadingMessage?.() ?? "Loading...";
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     const lastItem = virtualItems[virtualItems.length - 1];
     const shouldLoadMore = !!lastItem && hasNextPage && !loading && lastItem.index >= options.length - LOAD_MORE_THRESHOLD;
     if (shouldLoadMore && lastLoadMoreOptionsLengthRef.current !== options.length) {
@@ -17771,23 +17872,23 @@ function SearchableSelectContent({
       onLoadMore?.();
     }
   }, [hasNextPage, loading, onLoadMore, options.length, virtualItems]);
-  React72.useEffect(() => {
+  React73.useEffect(() => {
     const hasHighlightedIndexChanged = previousHighlightedIndexRef.current !== highlightedIndex;
     previousHighlightedIndexRef.current = highlightedIndex;
     if (highlightedIndex >= 0 && hasHighlightedIndexChanged) {
       virtualizer.scrollToIndex(highlightedIndex, { align: "auto" });
     }
   }, [highlightedIndex, virtualizer]);
-  return /* @__PURE__ */ (0, import_jsx_runtime176.jsxs)("div", { className: "p-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime176.jsxs)("div", { className: "relative mb-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)("div", { className: "p-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)("div", { className: "relative mb-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
         import_lucide_react52.Search,
         {
           "aria-hidden": "true",
           className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-[#9696B9]"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
         "input",
         {
           id: inputId,
@@ -17806,7 +17907,7 @@ function SearchableSelectContent({
         }
       )
     ] }),
-    loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime176.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime176.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+    loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
       "div",
       {
         id: listboxId,
@@ -17815,7 +17916,7 @@ function SearchableSelectContent({
         "aria-labelledby": labelId,
         className: cn("overflow-y-auto outline-none", menuClassName),
         style: { height: Math.min(height, rowCount * ROW_HEIGHT) },
-        children: /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
           "div",
           {
             className: "relative w-full",
@@ -17823,7 +17924,7 @@ function SearchableSelectContent({
             children: virtualItems.map((virtualItem) => {
               const option = options[virtualItem.index];
               if (!option) {
-                return /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
                   "div",
                   {
                     className: "absolute left-0 top-0 flex w-full items-center px-4 text-base leading-6 text-[#6C6C6C]",
@@ -17838,7 +17939,7 @@ function SearchableSelectContent({
               }
               const isSelected = value?.value === option.value;
               const isHighlighted = virtualItem.index === highlightedIndex;
-              return /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
                 "button",
                 {
                   id: getOptionId(idPrefix, virtualItem.index),
@@ -17860,7 +17961,7 @@ function SearchableSelectContent({
                     height: `${virtualItem.size}px`,
                     transform: `translateY(${virtualItem.start}px)`
                   },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime176.jsx)("span", { className: "truncate text-center", children: String(option.label) })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("span", { className: "truncate text-center", children: String(option.label) })
                 },
                 `${String(option.value)}-${virtualItem.index}`
               );
@@ -17950,14 +18051,14 @@ function getErrorMessage(error) {
 
 // src/lib/toastResponseError.tsx
 var import_i18next = __toESM(require("i18next"), 1);
-var import_jsx_runtime177 = require("react/jsx-runtime");
+var import_jsx_runtime178 = require("react/jsx-runtime");
 function addSupportEmailToMessage(message, prefixText) {
   if (typeof message !== "string") {
     return message;
   }
   const builtMessage = `${prefixText ? `${prefixText} ` : ""}${message}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("div", { children: builtMessage }),
+  return /* @__PURE__ */ (0, import_jsx_runtime178.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime178.jsx)("div", { children: builtMessage }),
     import_i18next.default.t("reach_us_at_email")
   ] });
 }
@@ -18145,6 +18246,7 @@ function toastResponseError(error, options = {}) {
   RatingProgress,
   RatingRadioGroup,
   RatingStars,
+  ResponsiveDropdown,
   ResponsiveSheet,
   RotateArrow,
   ScrollArea,