@chekinapp/ui 0.0.142 → 0.0.144

package/dist/index.cjs

@@ -91,6 +91,7 @@ __export(index_exports, {
   CommingSoonBadge: () => CommingSoonBadge,
   ConfirmationDialog: () => ConfirmationDialog,
   CopyIcon: () => CopyIcon,
+  CopyInput: () => CopyInput,
   CopyLinkButton: () => CopyLinkButton,
   CopyString: () => CopyString,
   Counter: () => Counter,
@@ -12335,7 +12336,7 @@ function Fieldset({
               htmlFor,
               className: cn(
                 "block cursor-[inherit] truncate transition-all duration-100 ease-in",
-                raised ? "text-[14px] font-semibold" : "text-[16px] font-medium"
+                raised ? "text-[length:var(--field-label-raised-font-size)] font-[var(--field-label-raised-font-weight)]" : "text-[length:var(--field-label-font-size)] font-[var(--field-label-font-weight)]"
               ),
               children: label
             }
@@ -12357,10 +12358,10 @@ function Fieldset({
         "aria-hidden": "true",
         className: cn(
           "pointer-events-none absolute -top-[5px] bottom-0 left-0 right-0 m-0 min-w-0 rounded-[6px] border px-[13px] text-left transition-colors duration-75",
-          "border-[var(--chekin-color-gray-3)]",
-          isActivated && "border-[var(--chekin-color-gray-2)]",
-          isFocused && "border-[var(--chekin-color-brand-blue)]",
-          invalid && "border-[var(--error-message-color)]",
+          "border-[var(--field-border)]",
+          isActivated && "border-[var(--field-border-activated)]",
+          isFocused && "border-[var(--field-border-focused)]",
+          invalid && "border-[var(--field-border-invalid)]",
           className
         ),
         children: /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)(
@@ -12377,8 +12378,8 @@ function Fieldset({
                 "span",
                 {
                   className: cn(
-                    "visible inline-block px-1 text-[14px] opacity-0",
-                    raised ? "font-semibold" : "font-medium"
+                    "visible inline-block px-1 text-[length:var(--field-label-raised-font-size)] opacity-0",
+                    raised ? "font-[var(--field-label-raised-font-weight)]" : "font-[var(--field-label-font-weight)]"
                   ),
                   children: legend || label
                 }
@@ -12507,7 +12508,7 @@ var Input = React44.forwardRef(
             "label",
             {
               htmlFor: inputId,
-              className: "input__top-label mb-2 block text-[14px] font-medium text-[var(--chekin-color-brand-navy)]",
+              className: "input__top-label mb-2 block text-[length:var(--field-top-label-font-size)] font-[var(--field-top-label-font-weight)] text-[var(--chekin-color-brand-navy)]",
               children: topLabel
             }
           ),
@@ -12668,13 +12669,42 @@ var Input = React44.forwardRef(
 );
 Input.displayName = "Input";
 
+// src/dashboard/copy-input/CopyInput.tsx
+var React45 = __toESM(require("react"), 1);
+var import_jsx_runtime145 = require("react/jsx-runtime");
+var CopyInput = React45.forwardRef(
+  ({ value = "", copyTooltip, copySize, copyVariant = "ghost", onCopy, ...props }, ref) => {
+    return /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+      Input,
+      {
+        ...props,
+        ref,
+        value,
+        readOnly: true,
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime145.jsx)("span", { className: "pointer-events-auto", children: /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+          CopyIcon,
+          {
+            textToCopy: value,
+            tooltipText: copyTooltip,
+            size: copySize,
+            variant: copyVariant,
+            onClick: onCopy
+          }
+        ) }),
+        inputClassName: cn("pr-12", props.inputClassName)
+      }
+    );
+  }
+);
+CopyInput.displayName = "CopyInput";
+
 // src/dashboard/phone-input/PhoneInput.tsx
-var React50 = __toESM(require("react"), 1);
+var React51 = __toESM(require("react"), 1);
 var import_react_i18next33 = require("react-i18next");
 
 // src/dashboard/_select-internals/SelectFieldShell.tsx
 var import_react_i18next26 = require("react-i18next");
-var import_jsx_runtime145 = require("react/jsx-runtime");
+var import_jsx_runtime146 = require("react/jsx-runtime");
 var FOCUSABLE_TRIGGER_SELECTOR = 'input:not([type="hidden"]):not([disabled]):not([readonly]), button:not([disabled])';
 function SelectFieldShell({
   containerRef,
@@ -12703,7 +12733,7 @@ function SelectFieldShell({
     );
     focusable?.focus();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime146.jsxs)(
     "div",
     {
       ref: containerRef,
@@ -12718,20 +12748,20 @@ function SelectFieldShell({
       ),
       style: wrapperWidth ? { width: wrapperWidth } : void 0,
       children: [
-        name && /* @__PURE__ */ (0, import_jsx_runtime145.jsx)("input", { type: "hidden", name, value: hiddenValue ?? "" }),
-        /* @__PURE__ */ (0, import_jsx_runtime145.jsxs)("div", { className: "relative min-h-[var(--field-min-height,48px)] w-full", children: [
-          topLabel && /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+        name && /* @__PURE__ */ (0, import_jsx_runtime146.jsx)("input", { type: "hidden", name, value: hiddenValue ?? "" }),
+        /* @__PURE__ */ (0, import_jsx_runtime146.jsxs)("div", { className: "relative min-h-[var(--field-min-height,48px)] w-full", children: [
+          topLabel && /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
             "label",
             {
               htmlFor: triggerId,
-              className: "mb-2 block text-[14px] font-medium text-[var(--chekin-color-brand-navy)]",
+              className: "mb-2 block text-[length:var(--field-top-label-font-size)] font-[var(--field-top-label-font-weight)] text-[var(--chekin-color-brand-navy)]",
               children: topLabel
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime145.jsx)("div", { className: "relative w-full", children }),
-          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime145.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_runtime145.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-          errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime145.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime146.jsx)("div", { className: "relative w-full", children }),
+          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime146.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_runtime146.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+          errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
             FieldErrorMessage,
             {
               id: errorId,
@@ -12747,7 +12777,7 @@ function SelectFieldShell({
 }
 
 // src/dashboard/_select-internals/SelectMenu.tsx
-var React45 = __toESM(require("react"), 1);
+var React46 = __toESM(require("react"), 1);
 var import_react_i18next27 = require("react-i18next");
 
 // src/dashboard/_select-internals/utils.ts
@@ -12842,7 +12872,7 @@ function countriesFilter(option, inputValue) {
 
 // src/dashboard/_select-internals/slots/DefaultOption.tsx
 var import_lucide_react42 = require("lucide-react");
-var import_jsx_runtime146 = require("react/jsx-runtime");
+var import_jsx_runtime147 = require("react/jsx-runtime");
 function DefaultOption(props) {
   const {
     option,
@@ -12864,7 +12894,7 @@ function DefaultOption(props) {
     inputValue,
     selectValue: selectedOptions
   }) : option.label;
-  return /* @__PURE__ */ (0, import_jsx_runtime146.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime147.jsxs)(
     "button",
     {
       id,
@@ -12885,9 +12915,9 @@ function DefaultOption(props) {
         isDisabled && "cursor-not-allowed text-[var(--chekin-color-gray-2)]"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime146.jsx)("span", { className: "block min-w-0 break-words", children: labelContent }),
-        option.description && /* @__PURE__ */ (0, import_jsx_runtime146.jsx)("span", { className: "ml-auto shrink-0 self-center text-[12px] font-medium italic text-[var(--chekin-color-gray-1)]", children: option.description }),
-        isSelected && /* @__PURE__ */ (0, import_jsx_runtime146.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime147.jsx)("span", { className: "block min-w-0 break-words", children: labelContent }),
+        option.description && /* @__PURE__ */ (0, import_jsx_runtime147.jsx)("span", { className: "ml-auto shrink-0 self-center text-[12px] font-medium italic text-[var(--chekin-color-gray-1)]", children: option.description }),
+        isSelected && /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
           import_lucide_react42.Check,
           {
             "aria-hidden": "true",
@@ -12904,7 +12934,7 @@ function DefaultOption(props) {
 }
 
 // src/dashboard/_select-internals/SelectMenu.tsx
-var import_jsx_runtime147 = require("react/jsx-runtime");
+var import_jsx_runtime148 = require("react/jsx-runtime");
 function buildMenuEntries(groupedOptions, options, formatGroupLabel, listboxId) {
   if (!groupedOptions || !groupedOptions.some((item) => isOptionGroup(item))) {
     return options.map((option, index) => ({
@@ -12985,11 +13015,11 @@ function SelectMenu({
   const hasOptions = options.length > 0;
   const Option = components?.Option ?? DefaultOption;
   const lastIndex = options.length - 1;
-  const selectedList = React45.useMemo(
+  const selectedList = React46.useMemo(
     () => selectedValues ?? (selectedValue ? [selectedValue] : []),
     [selectedValues, selectedValue]
   );
-  const entries = React45.useMemo(
+  const entries = React46.useMemo(
     () => buildMenuEntries(groupedOptions, options, formatGroupLabel, id),
     [groupedOptions, options, formatGroupLabel, id]
   );
@@ -13000,7 +13030,7 @@ function SelectMenu({
     const optionDisabled = Boolean(
       disabled || option.isDisabled || isOptionDisabled?.(option)
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
       Option,
       {
         id: getOptionId2(flatIndex),
@@ -13021,8 +13051,8 @@ function SelectMenu({
       key
     );
   };
-  const wasAtBottomRef = React45.useRef(false);
-  const handleScroll = React45.useCallback(
+  const wasAtBottomRef = React46.useRef(false);
+  const handleScroll = React46.useCallback(
     (event) => {
       if (!onMenuScrollToBottom) return;
       const target = event.currentTarget;
@@ -13034,7 +13064,7 @@ function SelectMenu({
     },
     [onMenuScrollToBottom]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime147.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime148.jsxs)(
     "div",
     {
       id,
@@ -13053,11 +13083,11 @@ function SelectMenu({
         menuClassName
       ),
       children: [
-        !hasOptions && (emptyContent ?? /* @__PURE__ */ (0, import_jsx_runtime147.jsx)("div", { className: "px-3 py-3 text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: emptyMessage })),
+        !hasOptions && (emptyContent ?? /* @__PURE__ */ (0, import_jsx_runtime148.jsx)("div", { className: "px-3 py-3 text-left text-[14px] font-medium text-[var(--chekin-color-gray-1)]", children: emptyMessage })),
         entries.map((entry) => {
           if (entry.kind === "group") {
-            return /* @__PURE__ */ (0, import_jsx_runtime147.jsxs)("div", { role: "group", "aria-labelledby": entry.labelId, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime147.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime148.jsxs)("div", { role: "group", "aria-labelledby": entry.labelId, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
                 "div",
                 {
                   id: entry.labelId,
@@ -13078,7 +13108,7 @@ function SelectMenu({
 
 // src/dashboard/_select-internals/SelectMenuPanel.tsx
 var import_react_i18next28 = require("react-i18next");
-var import_jsx_runtime148 = require("react/jsx-runtime");
+var import_jsx_runtime149 = require("react/jsx-runtime");
 function SelectMenuPanel({
   isOpen,
   isMobile: isMobile3,
@@ -13096,23 +13126,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_runtime148.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
       Drawer,
       {
         open: isOpen,
         onOpenChange: (next) => {
           if (!next) onClose();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime148.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime149.jsxs)(
           DrawerContent,
           {
             onClose,
             lockScroll: false,
             className: cn("max-h-[calc(100vh-1rem)]", drawerClassName),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(DrawerTitle, { className: "sr-only", children: titleText }),
-              /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(DrawerDescription, { className: "sr-only", children: descriptionText }),
-              /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(DrawerTitle, { className: "sr-only", children: titleText }),
+              /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(DrawerDescription, { className: "sr-only", children: descriptionText }),
+              /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
                 "div",
                 {
                   className: cn(
@@ -13128,7 +13158,7 @@ function SelectMenuPanel({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime148.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
     "div",
     {
       className: cn(
@@ -13142,7 +13172,7 @@ function SelectMenuPanel({
 
 // src/dashboard/_select-internals/SelectSearchInput.tsx
 var import_lucide_react43 = require("lucide-react");
-var import_jsx_runtime149 = require("react/jsx-runtime");
+var import_jsx_runtime150 = require("react/jsx-runtime");
 function SelectSearchInput({
   inputRef,
   value,
@@ -13152,15 +13182,15 @@ function SelectSearchInput({
   onChange,
   onKeyDown
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime149.jsx)("div", { className: "border-b border-[var(--chekin-color-gray-3)] bg-white p-2", children: /* @__PURE__ */ (0, import_jsx_runtime149.jsxs)("div", { className: "relative", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime150.jsx)("div", { className: "border-b border-[var(--chekin-color-gray-3)] bg-white p-2", children: /* @__PURE__ */ (0, import_jsx_runtime150.jsxs)("div", { className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(
       import_lucide_react43.Search,
       {
         "aria-hidden": "true",
         className: "pointer-events-none absolute left-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-[var(--chekin-color-gray-2)]"
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime149.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(
       "input",
       {
         ref: inputRef,
@@ -13180,7 +13210,7 @@ function SelectSearchInput({
 
 // src/dashboard/_select-internals/SelectTrigger.tsx
 var import_lucide_react44 = require("lucide-react");
-var import_jsx_runtime150 = require("react/jsx-runtime");
+var import_jsx_runtime151 = require("react/jsx-runtime");
 function SelectTrigger({
   triggerRef,
   triggerId,
@@ -13207,7 +13237,7 @@ function SelectTrigger({
   onFocus
 }) {
   const isEmpty = !hasValue;
-  return /* @__PURE__ */ (0, import_jsx_runtime150.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime151.jsxs)(
     "button",
     {
       id: triggerId,
@@ -13235,9 +13265,9 @@ function SelectTrigger({
         loading && "!cursor-progress"
       ),
       children: [
-        leftIcon && /* @__PURE__ */ (0, import_jsx_runtime150.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_runtime150.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime150.jsx)("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: hasValue ? valueLabel : showPlaceholderWhenIdle || isOpen ? placeholder : null }),
-        /* @__PURE__ */ (0, import_jsx_runtime150.jsx)("span", { className: "flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: !hideIndicator && /* @__PURE__ */ (0, import_jsx_runtime150.jsx)(
+        leftIcon && /* @__PURE__ */ (0, import_jsx_runtime151.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_runtime151.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime151.jsx)("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: hasValue ? valueLabel : showPlaceholderWhenIdle || isOpen ? placeholder : null }),
+        /* @__PURE__ */ (0, import_jsx_runtime151.jsx)("span", { className: "flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: !hideIndicator && /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
           import_lucide_react44.ChevronDown,
           {
             size: 16,
@@ -13255,7 +13285,7 @@ function SelectTrigger({
 // src/dashboard/_select-internals/ComboboxTrigger.tsx
 var import_lucide_react45 = require("lucide-react");
 var import_react_i18next29 = require("react-i18next");
-var import_jsx_runtime151 = require("react/jsx-runtime");
+var import_jsx_runtime152 = require("react/jsx-runtime");
 function ComboboxTrigger({
   triggerId,
   listboxId,
@@ -13299,7 +13329,7 @@ function ComboboxTrigger({
   const visiblePlaceholder = searchable && (showPlaceholderWhenIdle || isFocused || isOpen) ? resolvedPlaceholder : "";
   const inputMeasureValue = inputValue || visiblePlaceholder || " ";
   const activeOptionId = isOpen && highlightedIndex !== void 0 && highlightedIndex >= 0 && getOptionId2 ? getOptionId2(highlightedIndex) : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime151.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
     "div",
     {
       role: "combobox",
@@ -13323,18 +13353,19 @@ function ComboboxTrigger({
         containerClassName
       ),
       children: [
-        leftIcon && /* @__PURE__ */ (0, import_jsx_runtime151.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_runtime151.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
-        /* @__PURE__ */ (0, import_jsx_runtime151.jsxs)(
+        leftIcon && /* @__PURE__ */ (0, import_jsx_runtime152.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_runtime152.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
+        !leftIcon && searchable && (isFocused || isOpen) && /* @__PURE__ */ (0, import_jsx_runtime152.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_runtime152.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(import_lucide_react45.Search, { size: 16, "aria-hidden": "true" }) }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
           "div",
           {
             className: cn(
               "flex min-w-0 flex-1 items-center gap-2 py-[10px]",
-              leftIcon ? "pl-10" : "pl-4",
+              leftIcon || searchable && (isFocused || isOpen) ? "pl-10" : "pl-4",
               isMulti && "flex-wrap"
             ),
             children: [
               leadingContent,
-              /* @__PURE__ */ (0, import_jsx_runtime151.jsxs)(
+              /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)(
                 "span",
                 {
                   className: cn(
@@ -13343,7 +13374,7 @@ function ComboboxTrigger({
                     !searchable && "sr-only"
                   ),
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
                       "span",
                       {
                         "aria-hidden": "true",
@@ -13351,7 +13382,7 @@ function ComboboxTrigger({
                         children: inputMeasureValue
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
                       "input",
                       {
                         ref: inputRef,
@@ -13385,18 +13416,18 @@ function ComboboxTrigger({
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime151.jsxs)("span", { className: "flex h-12 shrink-0 items-center gap-2 self-start pl-2 pr-4 text-[var(--chekin-color-gray-2)]", children: [
-          showClear && /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("span", { className: "flex h-12 shrink-0 items-center gap-2 self-start pl-2 pr-4 text-[var(--chekin-color-gray-2)]", children: [
+          showClear && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
             "button",
             {
               type: "button",
               onClick: onClear,
               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": clearLabel,
-              children: /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(import_lucide_react45.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+              children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(import_lucide_react45.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
             }
           ),
-          !hideIndicator && /* @__PURE__ */ (0, import_jsx_runtime151.jsx)(
+          !hideIndicator && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
             RotateArrow,
             {
               shouldRotate: isOpen,
@@ -13412,14 +13443,14 @@ function ComboboxTrigger({
 }
 
 // src/dashboard/_select-internals/useSelectIds.ts
-var React46 = __toESM(require("react"), 1);
+var React47 = __toESM(require("react"), 1);
 function useSelectIds({
   name,
   hasValue,
   error,
   hideErrorMessage
 }) {
-  const reactId = React46.useId().replace(/:/g, "");
+  const reactId = React47.useId().replace(/:/g, "");
   const baseId = name ? `dash-select-${name}` : `dash-select-${reactId}`;
   const triggerId = `${baseId}-trigger`;
   const labelId = `${baseId}-label`;
@@ -13429,7 +13460,7 @@ function useSelectIds({
   const listboxId = `${baseId}-listbox`;
   const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
   const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
-  const getOptionId2 = React46.useCallback(
+  const getOptionId2 = React47.useCallback(
     (index) => `${baseId}-option-${index}`,
     [baseId]
   );
@@ -13447,7 +13478,7 @@ function useSelectIds({
 }
 
 // src/dashboard/_select-internals/useSelectMenuState.ts
-var React47 = __toESM(require("react"), 1);
+var React48 = __toESM(require("react"), 1);
 function useSelectMenuState({
   isBlocked,
   isMobile: isMobile3,
@@ -13455,14 +13486,14 @@ function useSelectMenuState({
   controlledIsOpen,
   onMenuOpenChange
 }) {
-  const containerRef = React47.useRef(null);
-  const [internalIsOpen, setInternalIsOpen] = React47.useState(false);
-  const [hasClosedControlledOpen, setHasClosedControlledOpen] = React47.useState(false);
+  const containerRef = React48.useRef(null);
+  const [internalIsOpen, setInternalIsOpen] = React48.useState(false);
+  const [hasClosedControlledOpen, setHasClosedControlledOpen] = React48.useState(false);
   const isOpen = controlledIsOpen === false ? false : controlledIsOpen === true ? !hasClosedControlledOpen : internalIsOpen;
-  React47.useEffect(() => {
+  React48.useEffect(() => {
     if (controlledIsOpen !== true) setHasClosedControlledOpen(false);
   }, [controlledIsOpen]);
-  const setIsOpen = React47.useCallback(
+  const setIsOpen = React48.useCallback(
     (next) => {
       const value = typeof next === "function" ? next(isOpen) : next;
       if (controlledIsOpen === true) setHasClosedControlledOpen(!value);
@@ -13471,13 +13502,13 @@ function useSelectMenuState({
     },
     [isOpen, controlledIsOpen, onMenuOpenChange]
   );
-  const openMenu = React47.useCallback(() => {
+  const openMenu = React48.useCallback(() => {
     setIsOpen(true);
   }, [setIsOpen]);
-  const closeMenu = React47.useCallback(() => {
+  const closeMenu = React48.useCallback(() => {
     setIsOpen(false);
   }, [setIsOpen]);
-  const toggleMenu = React47.useCallback(() => {
+  const toggleMenu = React48.useCallback(() => {
     if (isBlocked) return;
     setIsOpen((prev) => !prev);
   }, [isBlocked, setIsOpen]);
@@ -13489,14 +13520,14 @@ function useSelectMenuState({
     },
     isDisabled: !isOpen || isMobile3
   });
-  React47.useEffect(() => {
+  React48.useEffect(() => {
     if (isBlocked) setIsOpen(false);
   }, [isBlocked, setIsOpen]);
   return { containerRef, isOpen, openMenu, closeMenu, toggleMenu, setIsOpen };
 }
 
 // src/dashboard/_select-internals/useSelectState.ts
-var React48 = __toESM(require("react"), 1);
+var React49 = __toESM(require("react"), 1);
 function resolveValueLabel(option, getValueLabel) {
   if (!option) return "";
   return getValueLabel?.(option) ?? String(option.label);
@@ -13532,25 +13563,25 @@ function useSelectState(params) {
     isSearchInDropdown,
     searchable = true
   } = params;
-  const inputRef = React48.useRef(null);
-  const mobileSearchInputRef = React48.useRef(null);
-  const listRef = React48.useRef(null);
-  const optionRefs = React48.useRef([]);
+  const inputRef = React49.useRef(null);
+  const mobileSearchInputRef = React49.useRef(null);
+  const listRef = React49.useRef(null);
+  const optionRefs = React49.useRef([]);
   const isMobile3 = useIsMobile();
-  const [isFocused, setIsFocused] = React48.useState(false);
-  const [highlightedIndex, setHighlightedIndex] = React48.useState(-1);
+  const [isFocused, setIsFocused] = React49.useState(false);
+  const [highlightedIndex, setHighlightedIndex] = React49.useState(-1);
   const singleSelected = isMulti ? void 0 : selectedOptions[0];
-  const valueLabel = React48.useMemo(
+  const valueLabel = React49.useMemo(
     () => resolveValueLabel(singleSelected, getValueLabel),
     [singleSelected, getValueLabel]
   );
   const isSearchOnlyInput = searchable && (isMulti || Boolean(isSearchInDropdown));
   const isInputControlled = controlledInputValue !== void 0;
-  const [internalInputValue, setInternalInputValue] = React48.useState(
+  const [internalInputValue, setInternalInputValue] = React49.useState(
     searchable && !isSearchOnlyInput ? valueLabel : ""
   );
   const inputValue = isInputControlled ? controlledInputValue : internalInputValue;
-  const setInputValue = React48.useCallback(
+  const setInputValue = React49.useCallback(
     (next) => {
       if (!isInputControlled) setInternalInputValue(next);
     },
@@ -13569,12 +13600,12 @@ function useSelectState(params) {
   });
   const ids = useSelectIds({ name, hasValue, error, hideErrorMessage });
   const { listboxId, getOptionId: getOptionId2 } = ids;
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!searchable) return;
     if (isSearchOnlyInput) return;
     if (!isFocused) setInputValue(valueLabel);
   }, [valueLabel, isFocused, isSearchOnlyInput, searchable]);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!isSearchOnlyInput) return;
     if (!isOpen) {
       setInputValue("");
@@ -13583,11 +13614,11 @@ function useSelectState(params) {
   }, [isOpen, isSearchOnlyInput]);
   const trimmedInput = inputValue.trim();
   const isFiltering = searchable && (isSearchOnlyInput ? trimmedInput.length > 0 : trimmedInput.length > 0 && trimmedInput.toLowerCase() !== valueLabel.toLowerCase());
-  const filteredOptions = React48.useMemo(() => {
+  const filteredOptions = React49.useMemo(() => {
     if (!isFiltering) return options;
     return options.filter((option) => filterOption(option, trimmedInput));
   }, [options, isFiltering, trimmedInput, filterOption]);
-  const canCreateNewOption = React48.useMemo(() => {
+  const canCreateNewOption = React49.useMemo(() => {
     if (!isCreatable || !trimmedInput) return false;
     if (isValidNewOption) {
       return isValidNewOption(trimmedInput, selectedOptions, options);
@@ -13601,7 +13632,7 @@ function useSelectState(params) {
     );
     return !existsInOptions && !existsInSelected;
   }, [isCreatable, trimmedInput, isValidNewOption, options, selectedOptions]);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!isOpen || filteredOptions.length === 0) {
       setHighlightedIndex(-1);
       return;
@@ -13611,23 +13642,23 @@ function useSelectState(params) {
       return getFirstEnabledOptionIndex(filteredOptions, isOptionDisabled);
     });
   }, [isOpen, filteredOptions, isOptionDisabled]);
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!isOpen || highlightedIndex < 0) return;
     optionRefs.current[highlightedIndex]?.scrollIntoView?.({ block: "nearest" });
   }, [highlightedIndex, isOpen]);
   const inMenuSearchVisible = searchable && (isMobile3 || Boolean(isSearchInDropdown));
-  React48.useEffect(() => {
+  React49.useEffect(() => {
     if (!isOpen || !inMenuSearchVisible) return;
     const frame = window.requestAnimationFrame(
       () => mobileSearchInputRef.current?.focus()
     );
     return () => window.cancelAnimationFrame(frame);
   }, [isOpen, inMenuSearchVisible]);
-  const isValueSelected = React48.useCallback(
+  const isValueSelected = React49.useCallback(
     (option) => isOptionSelected2(option, selectedOptions),
     [isOptionSelected2, selectedOptions]
   );
-  const selectOption = React48.useCallback(
+  const selectOption = React49.useCallback(
     (option) => {
       if (!isOptionEnabled(option, isOptionDisabled)) return;
       if (isMulti) {
@@ -13663,7 +13694,7 @@ function useSelectState(params) {
       searchable
     ]
   );
-  const removeOption = React48.useCallback(
+  const removeOption = React49.useCallback(
     (option) => {
       if (isBlocked) return;
       onSelectionChange(
@@ -13674,7 +13705,7 @@ function useSelectState(params) {
     },
     [isBlocked, onSelectionChange, selectedOptions]
   );
-  const clearSelection = React48.useCallback(
+  const clearSelection = React49.useCallback(
     (event) => {
       event?.stopPropagation();
       if (isBlocked) return;
@@ -13684,7 +13715,7 @@ function useSelectState(params) {
     },
     [isBlocked, onSelectionChange]
   );
-  const createOption = React48.useCallback(() => {
+  const createOption = React49.useCallback(() => {
     if (!canCreateNewOption) return;
     const newOption = onCreateOption?.(trimmedInput) ?? { value: trimmedInput, label: trimmedInput };
     if (isMulti) {
@@ -13714,7 +13745,7 @@ function useSelectState(params) {
     isSearchInDropdown,
     searchable
   ]);
-  const handleInputChange = React48.useCallback(
+  const handleInputChange = React49.useCallback(
     (event) => {
       if (!searchable) return;
       const nextValue = event.target.value;
@@ -13724,7 +13755,7 @@ function useSelectState(params) {
     },
     [isOpen, onInputChange, searchable, setIsOpen, setInputValue]
   );
-  const handleInputFocus = React48.useCallback(
+  const handleInputFocus = React49.useCallback(
     (event) => {
       if (isBlocked) return;
       onFocus?.(event);
@@ -13736,17 +13767,17 @@ function useSelectState(params) {
     },
     [isBlocked, onFocus, openMenuOnFocus, setIsOpen, searchable, isMulti]
   );
-  const handleTriggerFocus = React48.useCallback(() => {
+  const handleTriggerFocus = React49.useCallback(() => {
     if (isBlocked) return;
     setIsFocused(true);
     if (openMenuOnFocus) setIsOpen(true);
   }, [isBlocked, openMenuOnFocus, setIsOpen]);
-  const handleContainerClick = React48.useCallback(() => {
+  const handleContainerClick = React49.useCallback(() => {
     if (isBlocked) return;
     inputRef.current?.focus();
     setIsOpen(true);
   }, [isBlocked, setIsOpen]);
-  const handleBlur = React48.useCallback(
+  const handleBlur = React49.useCallback(
     (event) => {
       if (containerRef.current?.contains(event.relatedTarget)) return;
       setIsFocused(false);
@@ -13755,7 +13786,7 @@ function useSelectState(params) {
     },
     [containerRef, isSearchOnlyInput, searchable, valueLabel, onBlur]
   );
-  const handleInputKeyDown = React48.useCallback(
+  const handleInputKeyDown = React49.useCallback(
     (event) => {
       onKeyDown?.(event);
       if (event.defaultPrevented) return;
@@ -13832,7 +13863,7 @@ function useSelectState(params) {
     ]
   );
   const isEmpty = !hasValue && !inputValue;
-  React48.useDebugValue({ isOpen, isMulti, highlightedIndex, selectedOptions });
+  React49.useDebugValue({ isOpen, isMulti, highlightedIndex, selectedOptions });
   return {
     // ids
     ids,
@@ -13894,7 +13925,7 @@ function useSelectState(params) {
 // src/dashboard/_select-internals/slots/DefaultMultiValueChip.tsx
 var import_lucide_react46 = require("lucide-react");
 var import_react_i18next30 = require("react-i18next");
-var import_jsx_runtime152 = require("react/jsx-runtime");
+var import_jsx_runtime153 = require("react/jsx-runtime");
 function DefaultMultiValueChip({
   option,
   readOnly,
@@ -13902,9 +13933,9 @@ function DefaultMultiValueChip({
 }) {
   const { t } = (0, import_react_i18next30.useTranslation)();
   const labelText = typeof option.label === "string" ? option.label : String(option.value);
-  return /* @__PURE__ */ (0, import_jsx_runtime152.jsxs)("span", { className: "inline-flex items-center gap-1 rounded-md border border-[var(--chekin-color-gray-3)] bg-[var(--chekin-color-surface-pressed)] py-0.5 pl-2 pr-1 text-[13px] font-medium text-[var(--chekin-color-brand-navy)] transition-colors", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime152.jsx)("span", { className: "whitespace-nowrap leading-5", children: option.label }),
-    !readOnly && /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime153.jsxs)("span", { className: "inline-flex items-center gap-1 rounded-md border border-[var(--chekin-color-gray-3)] bg-[var(--chekin-color-surface-pressed)] py-0.5 pl-2 pr-1 text-[13px] font-medium text-[var(--chekin-color-brand-navy)] transition-colors", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime153.jsx)("span", { className: "whitespace-nowrap leading-5", children: option.label }),
+    !readOnly && /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
       "button",
       {
         type: "button",
@@ -13914,14 +13945,14 @@ function DefaultMultiValueChip({
         },
         className: "flex h-4 w-4 items-center justify-center rounded-sm border-0 bg-transparent p-0 text-[var(--chekin-color-gray-1)] outline-none transition-colors hover:bg-white/70 hover:text-[var(--chekin-color-brand-navy)] focus-visible:ring-2 focus-visible:ring-[var(--chekin-color-brand-blue)]/30",
         "aria-label": t("remove_item", { label: labelText }),
-        children: /* @__PURE__ */ (0, import_jsx_runtime152.jsx)(import_lucide_react46.X, { size: 12, strokeWidth: 2.5 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(import_lucide_react46.X, { size: 12, strokeWidth: 2.5 })
       }
     )
   ] });
 }
 
 // src/dashboard/_select-internals/slots/DefaultControl.tsx
-var import_jsx_runtime153 = require("react/jsx-runtime");
+var import_jsx_runtime154 = require("react/jsx-runtime");
 function DefaultControl(props) {
   const {
     triggerId,
@@ -13964,7 +13995,7 @@ function DefaultControl(props) {
   const Chip = components.MultiValueChip ?? DefaultMultiValueChip;
   const showClear = Boolean(clearable) && hasValue && !readOnly && !disabled;
   const placeholderText = isMulti ? !hasValue ? placeholder : "" : placeholder;
-  return /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
     ComboboxTrigger,
     {
       triggerId,
@@ -14000,7 +14031,7 @@ function DefaultControl(props) {
       autoFocus,
       leftIcon,
       searchable,
-      leadingContent: isMulti ? selectedOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime153.jsx)(
+      leadingContent: isMulti ? selectedOptions.map((option) => /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
         Chip,
         {
           option,
@@ -14015,7 +14046,7 @@ function DefaultControl(props) {
 
 // src/dashboard/_select-internals/slots/StaticControl.tsx
 var import_lucide_react47 = require("lucide-react");
-var import_jsx_runtime154 = require("react/jsx-runtime");
+var import_jsx_runtime155 = require("react/jsx-runtime");
 function StaticControl(props) {
   const {
     triggerId,
@@ -14043,8 +14074,8 @@ function StaticControl(props) {
     leftIcon
   } = props;
   const showClear = Boolean(clearable) && hasValue && !readOnly && !disabled;
-  return /* @__PURE__ */ (0, import_jsx_runtime154.jsxs)("div", { className: "relative", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime155.jsxs)("div", { className: "relative", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
       SelectTrigger,
       {
         triggerId,
@@ -14070,21 +14101,21 @@ function StaticControl(props) {
         onFocus: onTriggerFocus
       }
     ),
-    showClear && /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(
+    showClear && /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
       "button",
       {
         type: "button",
         onClick: onClear,
         className: "absolute right-9 top-1/2 flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-[3px] border-0 bg-transparent p-0 text-[#9696b9] hover:shadow-[0_3px_3px_#0f477734]",
         "aria-label": clearLabel,
-        children: /* @__PURE__ */ (0, import_jsx_runtime154.jsx)(import_lucide_react47.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+        children: /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(import_lucide_react47.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
       }
     )
   ] });
 }
 
 // src/dashboard/_select-internals/slots/DefaultMenuList.tsx
-var import_jsx_runtime155 = require("react/jsx-runtime");
+var import_jsx_runtime156 = require("react/jsx-runtime");
 function DefaultMenuList(props) {
   const {
     id,
@@ -14113,7 +14144,7 @@ function DefaultMenuList(props) {
     groupedOptions,
     formatGroupLabel
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime155.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
     SelectMenu,
     {
       id,
@@ -14148,14 +14179,14 @@ function DefaultMenuList(props) {
 
 // src/dashboard/_select-internals/slots/DefaultCreateOption.tsx
 var import_react_i18next31 = require("react-i18next");
-var import_jsx_runtime156 = require("react/jsx-runtime");
+var import_jsx_runtime157 = require("react/jsx-runtime");
 function DefaultCreateOption({
   inputValue,
   onCreate,
   formatCreateLabel
 }) {
   const { t } = (0, import_react_i18next31.useTranslation)();
-  return /* @__PURE__ */ (0, import_jsx_runtime156.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
     "button",
     {
       type: "button",
@@ -14189,7 +14220,7 @@ function mergeComponents(overrides) {
 }
 
 // src/dashboard/select/Select.tsx
-var React49 = __toESM(require("react"), 1);
+var React50 = __toESM(require("react"), 1);
 var import_react_i18next32 = require("react-i18next");
 
 // src/dashboard/select/useSetCorrectOptionIfThereIsOnlyValue.ts
@@ -14208,7 +14239,7 @@ function useSetCorrectOptionIfThereIsOnlyValue({ value, options, onChange, enabl
 }
 
 // src/dashboard/select/Select.tsx
-var import_jsx_runtime157 = require("react/jsx-runtime");
+var import_jsx_runtime158 = require("react/jsx-runtime");
 function SelectInternal(props, ref) {
   const {
     options = [],
@@ -14266,7 +14297,7 @@ function SelectInternal(props, ref) {
   const closeMenuOnSelect = isMulti ? props.closeMenuOnSelect ?? false : void 0;
   const { t } = (0, import_react_i18next32.useTranslation)();
   const isControlled = props.value !== void 0;
-  const [internalValue, setInternalValue] = React49.useState(() => {
+  const [internalValue, setInternalValue] = React50.useState(() => {
     if (isMulti) return props.defaultValue ?? [];
     return props.defaultValue ?? null;
   });
@@ -14277,11 +14308,11 @@ function SelectInternal(props, ref) {
     options,
     onChange: !isMulti ? props.onChange : void 0
   });
-  const selectedOptions = React49.useMemo(() => {
+  const selectedOptions = React50.useMemo(() => {
     if (isMulti) return currentValue ?? [];
     return currentValue ? [currentValue] : [];
   }, [isMulti, currentValue]);
-  const onSelectionChange = React49.useCallback(
+  const onSelectionChange = React50.useCallback(
     (next, meta) => {
       if (isMulti) {
         if (!isControlled) setInternalValue(next);
@@ -14294,7 +14325,7 @@ function SelectInternal(props, ref) {
     },
     [isMulti, isControlled, props.onChange]
   );
-  const flatOptions = React49.useMemo(() => flattenGroupedOptions(options), [options]);
+  const flatOptions = React50.useMemo(() => flattenGroupedOptions(options), [options]);
   const state = useSelectState({
     isMulti,
     options: flatOptions,
@@ -14325,14 +14356,14 @@ function SelectInternal(props, ref) {
     isSearchInDropdown,
     searchable
   });
-  const components = React49.useMemo(() => {
+  const components = React50.useMemo(() => {
     const merged = mergeComponents(userComponents);
     if ((isSearchInDropdown || !searchable && !isMulti) && !userComponents?.Control) {
       return { ...merged, Control: StaticControl };
     }
     return merged;
   }, [userComponents, isSearchInDropdown, searchable, isMulti]);
-  React49.useImperativeHandle(
+  React50.useImperativeHandle(
     ref,
     () => state.containerRef.current
   );
@@ -14340,13 +14371,14 @@ function SelectInternal(props, ref) {
   const resolvedTitle = label ?? placeholder;
   const accessibleLabel = !hasLabel && typeof placeholder === "string" ? placeholder : void 0;
   const hasInvalidState = state.hasInvalidState || Boolean(invalid);
+  const hasLeadingIcon = Boolean(leftIcon);
   const hiddenValue = isMulti ? selectedOptions.map((item) => String(item.value)).join(",") : selectedOptions[0] ? String(selectedOptions[0].value) : "";
   const handleClear = (event) => {
     state.clearSelection(event);
     onReset?.();
   };
   const { Control, MenuList, CreateOption } = components;
-  return /* @__PURE__ */ (0, import_jsx_runtime157.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
     SelectFieldShell,
     {
       containerRef: state.containerRef,
@@ -14365,7 +14397,7 @@ function SelectInternal(props, ref) {
       hiddenValue,
       onBlur: state.handleBlur,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
           Control,
           {
             triggerId: state.ids.triggerId,
@@ -14408,7 +14440,7 @@ function SelectInternal(props, ref) {
             components
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
           Fieldset,
           {
             isFocused: state.isFocused || state.isOpen,
@@ -14424,11 +14456,11 @@ function SelectInternal(props, ref) {
             label,
             tooltip,
             onClick: state.handleContainerClick,
-            labelClassName: leftIcon ? "pl-[28px]" : void 0,
+            labelClassName: hasLeadingIcon ? "pl-[28px]" : void 0,
             className: fieldsetClassName
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime157.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
           SelectMenuPanel,
           {
             isOpen: state.isOpen,
@@ -14441,7 +14473,7 @@ function SelectInternal(props, ref) {
             className: dropdownClassName,
             drawerClassName,
             children: [
-              state.inMenuSearchVisible && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
+              state.inMenuSearchVisible && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
                 SelectSearchInput,
                 {
                   inputRef: state.mobileSearchInputRef,
@@ -14454,7 +14486,7 @@ function SelectInternal(props, ref) {
                 }
               ),
               menuHeader,
-              /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
+              /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
                 MenuList,
                 {
                   id: state.ids.listboxId,
@@ -14482,7 +14514,7 @@ function SelectInternal(props, ref) {
                   formatGroupLabel
                 }
               ),
-              state.canCreateNewOption && /* @__PURE__ */ (0, import_jsx_runtime157.jsx)(
+              state.canCreateNewOption && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
                 CreateOption,
                 {
                   inputValue: state.trimmedInput,
@@ -14497,7 +14529,7 @@ function SelectInternal(props, ref) {
     }
   );
 }
-var Select = React49.forwardRef(SelectInternal);
+var Select = React50.forwardRef(SelectInternal);
 
 // src/dashboard/phone-input/utils.ts
 var PREFIX_REGEX = /^\+/;
@@ -14567,14 +14599,17 @@ function formatPhoneCodeOptionLabel(option) {
 }
 
 // src/dashboard/phone-input/PhoneInput.tsx
-var import_jsx_runtime158 = require("react/jsx-runtime");
-var PhoneInput = React50.forwardRef(
+var import_jsx_runtime159 = require("react/jsx-runtime");
+var PhoneInput = React51.forwardRef(
   function PhoneInput2({
     options,
     value,
     onChange,
     onFocus,
     onBlur,
+    onKeyDown,
+    onFieldFocus,
+    onFieldBlur,
     name,
     codeName,
     numberName,
@@ -14598,10 +14633,10 @@ var PhoneInput = React50.forwardRef(
     defaultNumber
   }, ref) {
     const { t } = (0, import_react_i18next33.useTranslation)();
-    const groupLabelId = React50.useId();
-    const errorMsgId = React50.useId();
-    const numberInputRef = React50.useRef(null);
-    const [codeSearchValue, setCodeSearchValue] = React50.useState("");
+    const groupLabelId = React51.useId();
+    const errorMsgId = React51.useId();
+    const numberInputRef = React51.useRef(null);
+    const [codeSearchValue, setCodeSearchValue] = React51.useState("");
     const safeValue = toPhoneValue(value, defaultCode, defaultNumber);
     const effectiveCode = safeValue.code || defaultCode || "";
     const resolvedLabel = label ?? "";
@@ -14610,7 +14645,7 @@ var PhoneInput = React50.forwardRef(
     const hasInvalidState = hasExternalError || Boolean(invalid) || isPrefixRequired;
     const errorMessage = error ?? (isPrefixRequired ? t("prefix_required") : void 0);
     const combinedValue = effectiveCode || safeValue.number ? `${effectiveCode}${safeValue.number}` : "";
-    const codeOptions = React50.useMemo(
+    const codeOptions = React51.useMemo(
       () => options.map((option) => ({
         value: option.value,
         label: formatPhoneCodeOptionLabel(option),
@@ -14619,11 +14654,11 @@ var PhoneInput = React50.forwardRef(
       })),
       [options]
     );
-    const selectedCodeOption = React50.useMemo(
+    const selectedCodeOption = React51.useMemo(
       () => codeOptions.find((option) => option.value === effectiveCode) ?? null,
       [codeOptions, effectiveCode]
     );
-    const parsePhoneValue = React50.useMemo(
+    const parsePhoneValue = React51.useMemo(
       () => parsePhoneValueWithOptions(options),
       [options]
     );
@@ -14652,17 +14687,17 @@ var PhoneInput = React50.forwardRef(
       }
       emitChange({ code: effectiveCode, number: cleanedNumber });
     };
-    const effectiveCodeRef = React50.useRef(effectiveCode);
-    const numberValueRef = React50.useRef(safeValue.number);
-    const codeSearchValueRef = React50.useRef(codeSearchValue);
-    const onChangeRef = React50.useRef(onChange);
-    const nameRef = React50.useRef(name);
+    const effectiveCodeRef = React51.useRef(effectiveCode);
+    const numberValueRef = React51.useRef(safeValue.number);
+    const codeSearchValueRef = React51.useRef(codeSearchValue);
+    const onChangeRef = React51.useRef(onChange);
+    const nameRef = React51.useRef(name);
     effectiveCodeRef.current = effectiveCode;
     numberValueRef.current = safeValue.number;
     codeSearchValueRef.current = codeSearchValue;
     onChangeRef.current = onChange;
     nameRef.current = name;
-    React50.useImperativeHandle(
+    React51.useImperativeHandle(
       ref,
       () => ({
         getCodeSearchValue: () => codeSearchValueRef.current,
@@ -14679,7 +14714,7 @@ var PhoneInput = React50.forwardRef(
       }),
       []
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime159.jsxs)(
       "div",
       {
         className: cn(
@@ -14689,8 +14724,8 @@ var PhoneInput = React50.forwardRef(
           className
         ),
         children: [
-          name && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
-          codeName && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+          name && /* @__PURE__ */ (0, import_jsx_runtime159.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
+          codeName && /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
             "input",
             {
               type: "hidden",
@@ -14699,7 +14734,7 @@ var PhoneInput = React50.forwardRef(
               disabled
             }
           ),
-          numberName && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+          numberName && /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
             "input",
             {
               type: "hidden",
@@ -14708,22 +14743,22 @@ var PhoneInput = React50.forwardRef(
               disabled
             }
           ),
-          topLabel && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+          topLabel && /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
             "span",
             {
               id: groupLabelId,
-              className: "mb-2 block text-[14px] font-medium text-[var(--chekin-color-brand-navy)]",
+              className: "mb-2 block text-[length:var(--field-top-label-font-size)] font-[var(--field-top-label-font-weight)] text-[var(--chekin-color-brand-navy)]",
               children: topLabel
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime158.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime159.jsxs)(
             "div",
             {
               role: "group",
               "aria-labelledby": topLabel ? groupLabelId : void 0,
               className: "grid grid-cols-[96px_minmax(0,1fr)] gap-2",
               children: [
-                /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
                   Select,
                   {
                     options: codeOptions,
@@ -14744,10 +14779,12 @@ var PhoneInput = React50.forwardRef(
                     className: "max-w-none w-auto",
                     dropdownClassName: "right-auto w-[280px]",
                     inputValue: searchable ? codeSearchValue : void 0,
-                    onInputChange: setCodeSearchValue
+                    onInputChange: setCodeSearchValue,
+                    onFocus: () => onFieldFocus?.("code"),
+                    onBlur: () => onFieldBlur?.("code")
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+                /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
                   Input,
                   {
                     ref: numberInputRef,
@@ -14765,8 +14802,15 @@ var PhoneInput = React50.forwardRef(
                     "aria-label": resolvedLabel || name,
                     "aria-describedby": errorMessage ? errorMsgId : void 0,
                     onChange: handleNumberChange,
-                    onFocus,
-                    onBlur,
+                    onKeyDown,
+                    onFocus: (event) => {
+                      onFocus?.(event);
+                      onFieldFocus?.("number");
+                    },
+                    onBlur: (event) => {
+                      onBlur?.(event);
+                      onFieldBlur?.("number");
+                    },
                     renderErrorMessage: false,
                     wrapperClassName: "max-w-none w-auto",
                     contentClassName: readOnly ? "!cursor-default" : void 0,
@@ -14776,8 +14820,8 @@ var PhoneInput = React50.forwardRef(
               ]
             }
           ),
-          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime158.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 && /* @__PURE__ */ (0, import_jsx_runtime158.jsx)(
+          !errorMessage && optional && /* @__PURE__ */ (0, import_jsx_runtime159.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 && /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(
             FieldErrorMessage,
             {
               id: errorMsgId,
@@ -14794,41 +14838,41 @@ var PhoneInput = React50.forwardRef(
 PhoneInput.displayName = "PhoneInput";
 
 // src/dashboard/creatable-select/CreatableSelect.tsx
-var React51 = __toESM(require("react"), 1);
-var import_jsx_runtime159 = require("react/jsx-runtime");
-var CreatableSelect = React51.forwardRef(function CreatableSelect2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime159.jsx)(Select, { ref, ...props, isCreatable: true });
-});
-
-// src/dashboard/multi-select/MultiSelect.tsx
 var React52 = __toESM(require("react"), 1);
 var import_jsx_runtime160 = require("react/jsx-runtime");
-var MultiSelect = React52.forwardRef(function MultiSelect2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(Select, { ref, ...props, isMulti: true });
+var CreatableSelect = React52.forwardRef(function CreatableSelect2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime160.jsx)(Select, { ref, ...props, isCreatable: true });
 });
 
-// src/dashboard/creatable-multi-select/CreatableMultiSelect.tsx
+// src/dashboard/multi-select/MultiSelect.tsx
 var React53 = __toESM(require("react"), 1);
 var import_jsx_runtime161 = require("react/jsx-runtime");
-var CreatableMultiSelect = React53.forwardRef(function CreatableMultiSelect2(props, ref) {
-  return /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(Select, { ref, ...props, isMulti: true, isCreatable: true });
+var MultiSelect = React53.forwardRef(function MultiSelect2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime161.jsx)(Select, { ref, ...props, isMulti: true });
+});
+
+// src/dashboard/creatable-multi-select/CreatableMultiSelect.tsx
+var React54 = __toESM(require("react"), 1);
+var import_jsx_runtime162 = require("react/jsx-runtime");
+var CreatableMultiSelect = React54.forwardRef(function CreatableMultiSelect2(props, ref) {
+  return /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(Select, { ref, ...props, isMulti: true, isCreatable: true });
 });
 
 // src/dashboard/infinite-scroll-select/InfiniteScrollSelect.tsx
-var React56 = __toESM(require("react"), 1);
+var React57 = __toESM(require("react"), 1);
 
 // src/dashboard/infinite-scroll-select/VirtualMenuList.tsx
-var React55 = __toESM(require("react"), 1);
+var React56 = __toESM(require("react"), 1);
 var import_react_i18next34 = require("react-i18next");
 var import_react_virtual2 = require("@tanstack/react-virtual");
 
 // src/dashboard/infinite-scroll-select/InfiniteScrollContext.tsx
-var React54 = __toESM(require("react"), 1);
-var InfiniteScrollContext = React54.createContext(
+var React55 = __toESM(require("react"), 1);
+var InfiniteScrollContext = React55.createContext(
   null
 );
 function useInfiniteScrollContext() {
-  const ctx = React54.useContext(InfiniteScrollContext);
+  const ctx = React55.useContext(InfiniteScrollContext);
   if (!ctx) {
     throw new Error(
       "useInfiniteScrollContext must be used within an InfiniteScrollContext.Provider"
@@ -14838,7 +14882,7 @@ function useInfiniteScrollContext() {
 }
 
 // src/dashboard/infinite-scroll-select/VirtualMenuList.tsx
-var import_jsx_runtime162 = require("react/jsx-runtime");
+var import_jsx_runtime163 = require("react/jsx-runtime");
 function VirtualMenuList(props) {
   const {
     id,
@@ -14873,9 +14917,9 @@ function VirtualMenuList(props) {
   } = useInfiniteScrollContext();
   const Option = components?.Option ?? DefaultOption;
   const { t } = (0, import_react_i18next34.useTranslation)();
-  const scrollRef = React55.useRef(null);
-  const lastLoadMoreOptionsLengthRef = React55.useRef(null);
-  const previousHighlightedIndexRef = React55.useRef(-1);
+  const scrollRef = React56.useRef(null);
+  const lastLoadMoreOptionsLengthRef = React56.useRef(null);
+  const previousHighlightedIndexRef = React56.useRef(-1);
   const showLoaderRow = Boolean(canLoadMore || isLoadingMore);
   const itemCount = options.length + (showLoaderRow ? 1 : 0);
   const virtualizer = (0, import_react_virtual2.useVirtualizer)({
@@ -14888,7 +14932,7 @@ function VirtualMenuList(props) {
   const totalSize = virtualizer.getTotalSize();
   const measuredListHeight = Math.min(listHeight, Math.max(totalSize, itemHeight));
   const resolvedLoadingMoreText = loadingMoreText ?? t("loading_more");
-  React55.useEffect(() => {
+  React56.useEffect(() => {
     if (!canLoadMore || isLoadingMore || !loadMoreItems) return;
     if (virtualItems.length === 0) return;
     const lastItem = virtualItems[virtualItems.length - 1];
@@ -14904,7 +14948,7 @@ function VirtualMenuList(props) {
     loadMoreItems,
     loadMoreThreshold
   ]);
-  React55.useEffect(() => {
+  React56.useEffect(() => {
     const changed = previousHighlightedIndexRef.current !== highlightedIndex;
     previousHighlightedIndexRef.current = highlightedIndex;
     if (highlightedIndex < 0 || !changed) return;
@@ -14914,8 +14958,8 @@ function VirtualMenuList(props) {
   const lastOptionIndex = options.length - 1;
   const emptyMessage = noOptionsMessage?.() ?? t("no_options");
   const isOptionSelected2 = (option) => isOptionSelectedProp ? isOptionSelectedProp(option, selectedOptions) : selectedOptions.some((s) => s.value === option.value);
-  const wasAtBottomRef = React55.useRef(false);
-  const handleScroll = React55.useCallback(
+  const wasAtBottomRef = React56.useRef(false);
+  const handleScroll = React56.useCallback(
     (event) => {
       if (!onMenuScrollToBottom) return;
       const target = event.currentTarget;
@@ -14928,7 +14972,7 @@ function VirtualMenuList(props) {
     [onMenuScrollToBottom]
   );
   if (options.length === 0) {
-    return /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("div", { className: "min-h-[75px] px-4 pb-[19px] pt-[17px]", children: isLoadingMore ? /* @__PURE__ */ (0, import_jsx_runtime162.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("div", { className: "min-h-[75px] px-4 pb-[19px] pt-[17px]", children: isLoadingMore ? /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)(
       "div",
       {
         role: "status",
@@ -14936,8 +14980,8 @@ function VirtualMenuList(props) {
         "aria-live": "polite",
         className: "flex flex-col gap-2",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("span", { className: "sr-only", children: resolvedLoadingMoreText }),
-          Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("span", { className: "sr-only", children: resolvedLoadingMoreText }),
+          Array.from({ length: 3 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
             Skeleton,
             {
               className: "h-10 w-full rounded-md",
@@ -14947,16 +14991,16 @@ function VirtualMenuList(props) {
           ))
         ]
       }
-    ) : /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("div", { className: "flex min-h-[40px] items-center text-[16px] font-medium text-[var(--chekin-color-brand-navy)]", children: emptyMessage }) });
+    ) : /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("div", { className: "flex min-h-[40px] items-center text-[16px] font-medium text-[var(--chekin-color-brand-navy)]", children: emptyMessage }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("div", { className: "min-h-[75px] px-4 pb-[19px] pt-[17px]", children: /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("div", { className: "min-h-[75px] px-4 pb-[19px] pt-[17px]", children: /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
     "div",
     {
       ref: scrollRef,
       className: cn("overflow-y-auto", menuClassName),
       style: { height: `${measuredListHeight}px` },
       onScroll: onMenuScrollToBottom ? handleScroll : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
         "div",
         {
           id,
@@ -14976,7 +15020,7 @@ function VirtualMenuList(props) {
               disabled || option?.isDisabled || option && isOptionDisabled?.(option)
             );
             const isLastOption = !isLoaderRow && virtualItem.index === lastOptionIndex && !canLoadMore;
-            return /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+            return /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
               "div",
               {
                 "data-index": virtualItem.index,
@@ -14985,7 +15029,7 @@ function VirtualMenuList(props) {
                   height: `${virtualItem.size}px`,
                   transform: `translateY(${virtualItem.start}px)`
                 },
-                children: isLoaderRow ? /* @__PURE__ */ (0, import_jsx_runtime162.jsxs)(
+                children: isLoaderRow ? /* @__PURE__ */ (0, import_jsx_runtime163.jsxs)(
                   "div",
                   {
                     role: "status",
@@ -14993,8 +15037,8 @@ function VirtualMenuList(props) {
                     "aria-live": "polite",
                     className: "flex h-full items-center justify-center",
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime162.jsx)("span", { className: "sr-only", children: resolvedLoadingMoreText }),
-                      /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+                      /* @__PURE__ */ (0, import_jsx_runtime163.jsx)("span", { className: "sr-only", children: resolvedLoadingMoreText }),
+                      /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
                         ThreeDotsLoader,
                         {
                           height: 24,
@@ -15004,7 +15048,7 @@ function VirtualMenuList(props) {
                       )
                     ]
                   }
-                ) : option ? /* @__PURE__ */ (0, import_jsx_runtime162.jsx)(
+                ) : option ? /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
                   Option,
                   {
                     id: getOptionId2(virtualItem.index),
@@ -15034,7 +15078,7 @@ function VirtualMenuList(props) {
 }
 
 // src/dashboard/infinite-scroll-select/InfiniteScrollSelect.tsx
-var import_jsx_runtime163 = require("react/jsx-runtime");
+var import_jsx_runtime164 = require("react/jsx-runtime");
 var DEFAULT_ITEM_HEIGHT = 60;
 var DEFAULT_LIST_HEIGHT = 322;
 var DEFAULT_OVERSCAN = 5;
@@ -15062,8 +15106,8 @@ function InfiniteScrollSelectInternal(props, ref) {
   const getFullSearchOption = isMulti ? void 0 : getFullSearchOptionProp;
   const isPaginated = canLoadMore !== void 0 || isLoadingMore !== void 0 || loadMoreItems !== void 0 || onSearchChange !== void 0 || getFullSearchOption !== void 0;
   const filterOption = userFilterOption ?? (isPaginated ? passthroughFilter : defaultFilterOption);
-  const [inputValue, setInputValue] = React56.useState("");
-  const filteredOptions = React56.useMemo(() => {
+  const [inputValue, setInputValue] = React57.useState("");
+  const filteredOptions = React57.useMemo(() => {
     const trimmed = inputValue.trim();
     const valueLabel = (() => {
       if (isMulti) return "";
@@ -15082,7 +15126,7 @@ function InfiniteScrollSelectInternal(props, ref) {
     }
     return list;
   }, [rawOptions, inputValue, filterOption, getFullSearchOption, isMulti, rest]);
-  const contextValue = React56.useMemo(
+  const contextValue = React57.useMemo(
     () => ({
       canLoadMore,
       isLoadingMore,
@@ -15104,11 +15148,11 @@ function InfiniteScrollSelectInternal(props, ref) {
       loadMoreThreshold
     ]
   );
-  const components = React56.useMemo(
+  const components = React57.useMemo(
     () => ({ ...userComponents, MenuList: VirtualMenuList }),
     [userComponents]
   );
-  const handleInputChange = React56.useCallback(
+  const handleInputChange = React57.useCallback(
     (value) => {
       setInputValue(value);
       onSearchChange?.(value);
@@ -15122,7 +15166,7 @@ function InfiniteScrollSelectInternal(props, ref) {
     components,
     onInputChange: handleInputChange
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(InfiniteScrollContext.Provider, { value: contextValue, children: isMulti ? /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(InfiniteScrollContext.Provider, { value: contextValue, children: isMulti ? /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
     Select,
     {
       ref,
@@ -15130,7 +15174,7 @@ function InfiniteScrollSelectInternal(props, ref) {
       ...selectExtras,
       isMulti: true
     }
-  ) : /* @__PURE__ */ (0, import_jsx_runtime163.jsx)(
+  ) : /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(
     Select,
     {
       ref,
@@ -15140,27 +15184,27 @@ function InfiniteScrollSelectInternal(props, ref) {
     }
   ) });
 }
-var InfiniteScrollSelect = React56.forwardRef(
+var InfiniteScrollSelect = React57.forwardRef(
   InfiniteScrollSelectInternal
 );
 
 // src/dashboard/infinite-scroll-multi-select/InfiniteScrollMultiSelect.tsx
-var React57 = __toESM(require("react"), 1);
-var import_jsx_runtime164 = require("react/jsx-runtime");
-var InfiniteScrollMultiSelect = React57.forwardRef(function InfiniteScrollMultiSelect2(props, ref) {
+var React58 = __toESM(require("react"), 1);
+var import_jsx_runtime165 = require("react/jsx-runtime");
+var InfiniteScrollMultiSelect = React58.forwardRef(function InfiniteScrollMultiSelect2(props, ref) {
   const Forwarded = InfiniteScrollSelect;
-  return /* @__PURE__ */ (0, import_jsx_runtime164.jsx)(Forwarded, { ...props, ref, isMulti: true });
+  return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(Forwarded, { ...props, ref, isMulti: true });
 });
 
 // src/dashboard/select-checkboxes/SelectCheckboxes.tsx
-var React58 = __toESM(require("react"), 1);
+var React59 = __toESM(require("react"), 1);
 var import_react_i18next36 = require("react-i18next");
 
 // src/dashboard/select-checkboxes/VisualCheckbox.tsx
 var import_lucide_react48 = require("lucide-react");
-var import_jsx_runtime165 = require("react/jsx-runtime");
+var import_jsx_runtime166 = require("react/jsx-runtime");
 function VisualCheckbox({ checked, disabled, className }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(
     "span",
     {
       "aria-hidden": "true",
@@ -15171,13 +15215,13 @@ function VisualCheckbox({ checked, disabled, className }) {
         disabled && "opacity-50",
         className
       ),
-      children: checked && /* @__PURE__ */ (0, import_jsx_runtime165.jsx)(import_lucide_react48.Check, { className: "checkbox__icon h-3 w-3" })
+      children: checked && /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(import_lucide_react48.Check, { className: "checkbox__icon h-3 w-3" })
     }
   );
 }
 
 // src/dashboard/select-checkboxes/SelectCheckboxOption.tsx
-var import_jsx_runtime166 = require("react/jsx-runtime");
+var import_jsx_runtime167 = require("react/jsx-runtime");
 function SelectCheckboxOption(props) {
   const {
     option,
@@ -15190,7 +15234,7 @@ function SelectCheckboxOption(props) {
     onHover,
     innerRef
   } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)(
     "button",
     {
       id,
@@ -15211,10 +15255,10 @@ function SelectCheckboxOption(props) {
         isDisabled && "cursor-not-allowed text-[var(--chekin-color-gray-2)]"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime166.jsx)(VisualCheckbox, { checked: isSelected, disabled: isDisabled }),
-        /* @__PURE__ */ (0, import_jsx_runtime166.jsxs)("span", { className: "flex min-w-0 flex-1 items-center justify-between gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("span", { className: "block break-words", children: option.label }),
-          option.description && /* @__PURE__ */ (0, import_jsx_runtime166.jsx)("span", { className: "shrink-0 text-[12px] font-medium italic text-[var(--chekin-color-gray-1)]", children: option.description })
+        /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(VisualCheckbox, { checked: isSelected, disabled: isDisabled }),
+        /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)("span", { className: "flex min-w-0 flex-1 items-center justify-between gap-2", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { className: "block break-words", children: option.label }),
+          option.description && /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { className: "shrink-0 text-[12px] font-medium italic text-[var(--chekin-color-gray-1)]", children: option.description })
         ] })
       ]
     }
@@ -15224,7 +15268,7 @@ function SelectCheckboxOption(props) {
 // src/dashboard/select-checkboxes/CountTrigger.tsx
 var import_lucide_react49 = require("lucide-react");
 var import_react_i18next35 = require("react-i18next");
-var import_jsx_runtime167 = require("react/jsx-runtime");
+var import_jsx_runtime168 = require("react/jsx-runtime");
 function createCountTrigger(opts) {
   const { getValueText, getTotalCount } = opts;
   function CountTrigger(props) {
@@ -15254,7 +15298,7 @@ function createCountTrigger(opts) {
     const computedText = typeof valueText === "function" ? valueText(count, total) : valueText ?? (count > 0 ? t("n_selected", { count, defaultValue: `${count} selected` }) : "");
     const display = hasValue ? computedText : isOpen ? placeholder ?? null : null;
     const isEmpty = !hasValue;
-    return /* @__PURE__ */ (0, import_jsx_runtime167.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)(
       "button",
       {
         id: triggerId,
@@ -15277,9 +15321,9 @@ function createCountTrigger(opts) {
           loading && "!cursor-progress"
         ),
         children: [
-          leftIcon && /* @__PURE__ */ (0, import_jsx_runtime167.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_runtime167.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: display }),
-          /* @__PURE__ */ (0, import_jsx_runtime167.jsx)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime167.jsx)(
+          leftIcon && /* @__PURE__ */ (0, import_jsx_runtime168.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_runtime168.jsx)("span", { className: "flex h-full w-10 items-center justify-center", children: leftIcon }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { id: valueId, className: "block min-w-0 flex-1 truncate text-left", children: display }),
+          /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(
             import_lucide_react49.ChevronDown,
             {
               size: 16,
@@ -15297,9 +15341,9 @@ function createCountTrigger(opts) {
 }
 
 // src/dashboard/select-checkboxes/SelectAllRow.tsx
-var import_jsx_runtime168 = require("react/jsx-runtime");
+var import_jsx_runtime169 = require("react/jsx-runtime");
 function SelectAllRow({ label, checked, disabled, onToggle }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime168.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime169.jsxs)(
     "button",
     {
       type: "button",
@@ -15310,21 +15354,21 @@ function SelectAllRow({ label, checked, disabled, onToggle }) {
         disabled && "cursor-default opacity-40"
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime168.jsx)(VisualCheckbox, { checked, disabled }),
-        /* @__PURE__ */ (0, import_jsx_runtime168.jsx)("span", { className: "flex-1", children: label })
+        /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(VisualCheckbox, { checked, disabled }),
+        /* @__PURE__ */ (0, import_jsx_runtime169.jsx)("span", { className: "flex-1", children: label })
       ]
     }
   );
 }
 
 // src/dashboard/select-checkboxes/SelectCheckboxes.tsx
-var import_jsx_runtime169 = require("react/jsx-runtime");
+var import_jsx_runtime170 = require("react/jsx-runtime");
 function hasPaginationProps(props) {
   return props.canLoadMore !== void 0 || props.isLoadingMore !== void 0 || props.loadMoreItems !== void 0 || props.onSearchChange !== void 0;
 }
 function makeTriggerSlot(render) {
   function CustomTrigger(props) {
-    return /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(import_jsx_runtime169.Fragment, { children: render(props.isOpen, props.onContainerClick) });
+    return /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(import_jsx_runtime170.Fragment, { children: render(props.isOpen, props.onContainerClick) });
   }
   return CustomTrigger;
 }
@@ -15350,25 +15394,25 @@ function SelectCheckboxesInternal(props, ref) {
   const isPaginated = hasPaginationProps(
     paginationAndRest
   );
-  const [inputValue, setInputValue] = React58.useState("");
+  const [inputValue, setInputValue] = React59.useState("");
   const isControlled = value !== void 0;
-  const [internalValue, setInternalValue] = React58.useState(
+  const [internalValue, setInternalValue] = React59.useState(
     () => defaultValue ?? []
   );
   const currentValue = isControlled ? value : internalValue;
-  const selected = React58.useMemo(() => currentValue ?? [], [currentValue]);
-  const handleChange = React58.useCallback(
+  const selected = React59.useMemo(() => currentValue ?? [], [currentValue]);
+  const handleChange = React59.useCallback(
     (next, meta) => {
       if (!isControlled) setInternalValue(next);
       onChange?.(next, meta);
     },
     [isControlled, onChange]
   );
-  const flatRawOptions = React58.useMemo(
+  const flatRawOptions = React59.useMemo(
     () => flattenGroupedOptions(rawOptions),
     [rawOptions]
   );
-  const filteredGrouped = React58.useMemo(() => {
+  const filteredGrouped = React59.useMemo(() => {
     const trimmed = inputValue.trim();
     if (!trimmed) return rawOptions;
     return rawOptions.map((item) => {
@@ -15379,7 +15423,7 @@ function SelectCheckboxesInternal(props, ref) {
       return filterOption(item, trimmed) ? item : null;
     }).filter((item) => item !== null);
   }, [rawOptions, inputValue, filterOption]);
-  const filteredFlat = React58.useMemo(
+  const filteredFlat = React59.useMemo(
     () => flattenGroupedOptions(filteredGrouped),
     [filteredGrouped]
   );
@@ -15387,7 +15431,7 @@ function SelectCheckboxesInternal(props, ref) {
     return acc + (selected.some((s) => s.value === option.value) ? 1 : 0);
   }, 0);
   const allVisibleSelected = filteredFlat.length > 0 && visibleSelectedCount === filteredFlat.length;
-  const handleToggleAll = React58.useCallback(() => {
+  const handleToggleAll = React59.useCallback(() => {
     if (allVisibleSelected) {
       const visibleValues = new Set(filteredFlat.map((option) => option.value));
       handleChange(
@@ -15402,18 +15446,18 @@ function SelectCheckboxesInternal(props, ref) {
     }
     handleChange(merged, { action: "select" });
   }, [allVisibleSelected, filteredFlat, handleChange, selected]);
-  const valueTextRef = React58.useRef(valueText);
-  const totalCountRef = React58.useRef(flatRawOptions.length);
+  const valueTextRef = React59.useRef(valueText);
+  const totalCountRef = React59.useRef(flatRawOptions.length);
   valueTextRef.current = valueText;
   totalCountRef.current = flatRawOptions.length;
-  const Control = React58.useMemo(() => {
+  const Control = React59.useMemo(() => {
     if (trigger) return makeTriggerSlot(trigger);
     return createCountTrigger({
       getValueText: () => valueTextRef.current,
       getTotalCount: () => totalCountRef.current
     });
   }, [trigger]);
-  const components = React58.useMemo(
+  const components = React59.useMemo(
     () => ({
       ...userComponents,
       Control,
@@ -15421,7 +15465,7 @@ function SelectCheckboxesInternal(props, ref) {
     }),
     [userComponents, Control]
   );
-  const menuHeader = allowSelectAll ? /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+  const menuHeader = allowSelectAll ? /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
     SelectAllRow,
     {
       label: selectAllLabel ?? t("select_all", { defaultValue: "Select All" }),
@@ -15429,7 +15473,7 @@ function SelectCheckboxesInternal(props, ref) {
       onToggle: handleToggleAll
     }
   ) : void 0;
-  const handleInputChange = React58.useCallback(
+  const handleInputChange = React59.useCallback(
     (next) => {
       setInputValue(next);
       onSearchChange?.(next);
@@ -15450,7 +15494,7 @@ function SelectCheckboxesInternal(props, ref) {
     isMulti: true
   };
   if (isPaginated) {
-    return /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
       InfiniteScrollSelect,
       {
         ref,
@@ -15461,7 +15505,7 @@ function SelectCheckboxesInternal(props, ref) {
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime169.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
     Select,
     {
       ref,
@@ -15472,16 +15516,16 @@ function SelectCheckboxesInternal(props, ref) {
     }
   );
 }
-var SelectCheckboxes = React58.forwardRef(
+var SelectCheckboxes = React59.forwardRef(
   SelectCheckboxesInternal
 );
 
 // src/dashboard/textarea/Textarea.tsx
-var React60 = __toESM(require("react"), 1);
+var React61 = __toESM(require("react"), 1);
 var import_react_i18next37 = require("react-i18next");
 
 // src/dashboard/textarea/useTextareaValueState.ts
-var React59 = __toESM(require("react"), 1);
+var React60 = __toESM(require("react"), 1);
 var isEmptyValue2 = (value) => {
   if (value === void 0 || value === null) return true;
   return String(value).length === 0;
@@ -15500,12 +15544,12 @@ function useTextareaValueState({
   value,
   defaultValue
 }) {
-  const textareaRef = React59.useRef(null);
+  const textareaRef = React60.useRef(null);
   const isControlled = typeof empty !== "undefined" || typeof value !== "undefined";
   const propsAreEmpty = getTextareaEmptyState({ empty, value, defaultValue });
-  const [nativeIsEmpty, setNativeIsEmpty] = React59.useState(propsAreEmpty);
+  const [nativeIsEmpty, setNativeIsEmpty] = React60.useState(propsAreEmpty);
   const isEmpty = isControlled ? propsAreEmpty : nativeIsEmpty;
-  const setNativeValue = React59.useCallback(
+  const setNativeValue = React60.useCallback(
     (nextValue) => {
       if (isControlled) return;
       const nextIsEmpty = nextValue.length === 0;
@@ -15515,14 +15559,14 @@ function useTextareaValueState({
     },
     [isControlled]
   );
-  const syncValueState = React59.useCallback(() => {
+  const syncValueState = React60.useCallback(() => {
     if (!textareaRef.current) return;
     setNativeValue(textareaRef.current.value);
   }, [setNativeValue]);
-  React59.useLayoutEffect(() => {
+  React60.useLayoutEffect(() => {
     syncValueState();
   });
-  React59.useEffect(() => {
+  React60.useEffect(() => {
     const textarea = textareaRef.current;
     const form = textarea?.form;
     if (isControlled || !form) return;
@@ -15546,10 +15590,10 @@ function useTextareaValueState({
 }
 
 // src/dashboard/textarea/Textarea.tsx
-var import_jsx_runtime170 = require("react/jsx-runtime");
+var import_jsx_runtime171 = require("react/jsx-runtime");
 var LINE_HEIGHT = 20;
 var VERTICAL_PADDING = 32;
-var Textarea = React60.forwardRef(function Textarea2({
+var Textarea = React61.forwardRef(function Textarea2({
   className,
   textareaClassName,
   label,
@@ -15577,12 +15621,12 @@ var Textarea = React60.forwardRef(function Textarea2({
 }, ref) {
   const { textareaRef, isControlled, isEmpty, setNativeValue, syncValueState } = useTextareaValueState({ empty, value, defaultValue });
   const combinedRef = useCombinedRef(ref, textareaRef);
-  const reactId = React60.useId();
+  const reactId = React61.useId();
   const textareaId = id ?? name ?? `dash-textarea-${reactId}`;
   const { t } = (0, import_react_i18next37.useTranslation)();
   const isInvalid = Boolean(invalid || error);
   const isBlocked = Boolean(disabled);
-  const resize = React60.useCallback(() => {
+  const resize = React61.useCallback(() => {
     const el = textareaRef.current;
     if (!el || !autosize) return;
     el.style.height = "auto";
@@ -15592,7 +15636,7 @@ var Textarea = React60.forwardRef(function Textarea2({
     el.style.height = `${nextHeight}px`;
     el.style.overflowY = el.scrollHeight > nextHeight ? "auto" : "hidden";
   }, [autosize, maxRows, minRows, textareaRef]);
-  React60.useLayoutEffect(() => {
+  React61.useLayoutEffect(() => {
     resize();
   }, [resize, value]);
   const handleInput = (event) => {
@@ -15615,7 +15659,7 @@ var Textarea = React60.forwardRef(function Textarea2({
     onBlur?.(event);
     syncValueState();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime170.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime171.jsxs)(
     "div",
     {
       className: cn(
@@ -15625,18 +15669,18 @@ var Textarea = React60.forwardRef(function Textarea2({
         className
       ),
       children: [
-        label && /* @__PURE__ */ (0, import_jsx_runtime170.jsxs)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime171.jsxs)(
           "label",
           {
             htmlFor: textareaId,
-            className: "mb-2 flex select-none items-center text-[16px] font-medium text-[var(--chekin-color-brand-navy)]",
+            className: "mb-2 flex select-none items-center text-[length:var(--field-label-font-size)] font-[var(--field-label-font-weight)] text-[var(--chekin-color-brand-navy)]",
             children: [
               label,
-              tooltip && /* @__PURE__ */ (0, import_jsx_runtime170.jsx)("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(HelpTooltip, { content: tooltip, size: 16 }) })
+              tooltip && /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("span", { className: "ml-1 inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(HelpTooltip, { content: tooltip, size: 16 }) })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(
           "textarea",
           {
             ref: combinedRef,
@@ -15655,10 +15699,10 @@ var Textarea = React60.forwardRef(function Textarea2({
             onBlur: handleBlur,
             className: cn(
               "m-0 box-border block w-full resize-none rounded-[6px] border bg-white px-4 py-4 text-[16px] font-medium leading-5 text-[var(--chekin-color-brand-navy)] outline-none transition-colors duration-100 ease-in-out",
-              "border-[var(--chekin-color-gray-3)] placeholder:font-medium placeholder:text-[var(--chekin-color-gray-1)]",
-              !isBlocked && "focus:border-[var(--chekin-color-brand-blue)]",
-              isEmpty && "border-[var(--chekin-color-gray-3)] bg-[var(--empty-field-background)] text-[var(--chekin-color-gray-1)]",
-              isInvalid && "border-[var(--error-message-color)] focus:border-[var(--error-message-color)]",
+              "border-[var(--field-border)] placeholder:font-medium placeholder:text-[var(--chekin-color-gray-1)]",
+              !isBlocked && "focus:border-[var(--field-border-focused)]",
+              isEmpty && "border-[var(--field-border)] bg-[var(--empty-field-background)] text-[var(--chekin-color-gray-1)]",
+              isInvalid && "border-[var(--field-border-invalid)] focus:border-[var(--field-border-invalid)]",
               (readOnly || isBlocked) && "cursor-default",
               isBlocked && "cursor-not-allowed",
               loading && "cursor-progress",
@@ -15668,7 +15712,7 @@ var Textarea = React60.forwardRef(function Textarea2({
             ...textareaProps
           }
         ),
-        error && /* @__PURE__ */ (0, import_jsx_runtime170.jsx)(
+        error && /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(
           FieldErrorMessage,
           {
             id: `${textareaId}-error`,
@@ -15676,20 +15720,20 @@ var Textarea = React60.forwardRef(function Textarea2({
             className: "mt-[1px] text-[14px]"
           }
         ),
-        !error && optional && /* @__PURE__ */ (0, import_jsx_runtime170.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_runtime170.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText })
+        !error && optional && /* @__PURE__ */ (0, import_jsx_runtime171.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_runtime171.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText })
       ]
     }
   );
 });
 
 // src/dashboard/datepicker/Datepicker.tsx
-var React62 = __toESM(require("react"), 1);
+var React63 = __toESM(require("react"), 1);
 var import_lucide_react50 = require("lucide-react");
 var import_react_i18next38 = require("react-i18next");
 
 // src/airbnb-fields/datepicker/useDatePickerWheel.ts
-var React61 = __toESM(require("react"), 1);
+var React62 = __toESM(require("react"), 1);
 
 // src/airbnb-fields/datepicker/datePicker.utils.ts
 var DISPLAY_PAD_LENGTH = 2;
@@ -15840,21 +15884,21 @@ function useDatePickerWheel({
   minDate,
   maxDate
 }) {
-  const years = React61.useMemo(() => getYearRange(minDate, maxDate), [maxDate, minDate]);
-  const [draftDate, setDraftDate] = React61.useState(
+  const years = React62.useMemo(() => getYearRange(minDate, maxDate), [maxDate, minDate]);
+  const [draftDate, setDraftDate] = React62.useState(
     () => resolveInitialDate({ value, defaultValue, minDate, maxDate })
   );
   const draftYear = draftDate.getFullYear();
   const draftMonth = draftDate.getMonth();
-  const [monthScrollTop, setMonthScrollTop] = React61.useState(0);
-  const [dayScrollTop, setDayScrollTop] = React61.useState(0);
-  const [yearScrollTop, setYearScrollTop] = React61.useState(0);
-  const monthListRef = React61.useRef(null);
-  const dayListRef = React61.useRef(null);
-  const yearListRef = React61.useRef(null);
-  const settleTimeoutsRef = React61.useRef({});
-  const animationFramesRef = React61.useRef({});
-  const columnRefs = React61.useMemo(
+  const [monthScrollTop, setMonthScrollTop] = React62.useState(0);
+  const [dayScrollTop, setDayScrollTop] = React62.useState(0);
+  const [yearScrollTop, setYearScrollTop] = React62.useState(0);
+  const monthListRef = React62.useRef(null);
+  const dayListRef = React62.useRef(null);
+  const yearListRef = React62.useRef(null);
+  const settleTimeoutsRef = React62.useRef({});
+  const animationFramesRef = React62.useRef({});
+  const columnRefs = React62.useMemo(
     () => ({
       month: monthListRef,
       day: dayListRef,
@@ -15862,7 +15906,7 @@ function useDatePickerWheel({
     }),
     []
   );
-  const setColumnScrollTop = React61.useCallback(
+  const setColumnScrollTop = React62.useCallback(
     (column, nextScrollTop) => {
       if (column === "month") {
         setMonthScrollTop(nextScrollTop);
@@ -15876,19 +15920,19 @@ function useDatePickerWheel({
     },
     []
   );
-  const clearSettleTimeout = React61.useCallback((column) => {
+  const clearSettleTimeout = React62.useCallback((column) => {
     const timeoutId = settleTimeoutsRef.current[column];
     if (timeoutId === void 0) return;
     window.clearTimeout(timeoutId);
     delete settleTimeoutsRef.current[column];
   }, []);
-  const clearAnimationFrame = React61.useCallback((column) => {
+  const clearAnimationFrame = React62.useCallback((column) => {
     const frameId = animationFramesRef.current[column];
     if (frameId === void 0) return;
     window.cancelAnimationFrame(frameId);
     delete animationFramesRef.current[column];
   }, []);
-  React61.useEffect(
+  React62.useEffect(
     () => () => {
       ["month", "day", "year"].forEach((column) => {
         clearSettleTimeout(column);
@@ -15897,22 +15941,22 @@ function useDatePickerWheel({
     },
     [clearAnimationFrame, clearSettleTimeout]
   );
-  React61.useEffect(() => {
+  React62.useEffect(() => {
     if (isOpen) return;
     setDraftDate(resolveInitialDate({ value, defaultValue, minDate, maxDate }));
   }, [defaultValue, isOpen, maxDate, minDate, value]);
-  const months = React61.useMemo(
+  const months = React62.useMemo(
     () => getAllowedMonths(draftYear, minDate, maxDate),
     [draftYear, maxDate, minDate]
   );
-  const days = React61.useMemo(
+  const days = React62.useMemo(
     () => getAllowedDays(draftYear, draftMonth, minDate, maxDate),
     [draftMonth, draftYear, maxDate, minDate]
   );
   const monthIndex = months.findIndex((month) => month === draftMonth);
   const dayIndex = days.findIndex((day) => day === draftDate.getDate());
   const yearIndex = years.findIndex((year) => year === draftYear);
-  const syncScrollPositions = React61.useCallback(
+  const syncScrollPositions = React62.useCallback(
     (nextDate, behavior = "auto") => {
       const nextMonths = getAllowedMonths(nextDate.getFullYear(), minDate, maxDate);
       const nextMonthIndex = nextMonths.findIndex((month) => month === nextDate.getMonth());
@@ -15936,7 +15980,7 @@ function useDatePickerWheel({
     },
     [maxDate, minDate, years]
   );
-  React61.useLayoutEffect(() => {
+  React62.useLayoutEffect(() => {
     if (!isOpen) return;
     const nextDate = resolveInitialDate({ value, defaultValue, minDate, maxDate });
     setDraftDate(nextDate);
@@ -15947,7 +15991,7 @@ function useDatePickerWheel({
       window.cancelAnimationFrame(frameId);
     };
   }, [defaultValue, isOpen, maxDate, minDate, syncScrollPositions, value]);
-  const updateDraftDate = React61.useCallback(
+  const updateDraftDate = React62.useCallback(
     (column, targetIndex, behavior = "smooth") => {
       const currentDate = stripTime(draftDate);
       const currentYear = currentDate.getFullYear();
@@ -15992,7 +16036,7 @@ function useDatePickerWheel({
     },
     [days, draftDate, maxDate, minDate, months, syncScrollPositions, years]
   );
-  const settleColumnScroll = React61.useCallback(
+  const settleColumnScroll = React62.useCallback(
     (column) => {
       const list = columnRefs[column].current;
       if (!list) return;
@@ -16005,7 +16049,7 @@ function useDatePickerWheel({
     },
     [columnRefs, days.length, months.length, updateDraftDate, years.length]
   );
-  const scheduleScrollSettle = React61.useCallback(
+  const scheduleScrollSettle = React62.useCallback(
     (column) => {
       clearSettleTimeout(column);
       settleTimeoutsRef.current[column] = window.setTimeout(() => {
@@ -16014,7 +16058,7 @@ function useDatePickerWheel({
     },
     [clearSettleTimeout, settleColumnScroll]
   );
-  const handleColumnScroll = React61.useCallback(
+  const handleColumnScroll = React62.useCallback(
     (column) => {
       const list = columnRefs[column].current;
       if (!list) return;
@@ -16028,13 +16072,13 @@ function useDatePickerWheel({
     },
     [clearAnimationFrame, columnRefs, scheduleScrollSettle, setColumnScrollTop]
   );
-  const handleOptionSelect = React61.useCallback(
+  const handleOptionSelect = React62.useCallback(
     (column, targetIndex) => {
       updateDraftDate(column, targetIndex, "smooth");
     },
     [updateDraftDate]
   );
-  const focusAdjacentColumn = React61.useCallback(
+  const focusAdjacentColumn = React62.useCallback(
     (column, direction) => {
       const order = ["month", "day", "year"];
       const currentIndex = order.indexOf(column);
@@ -16044,7 +16088,7 @@ function useDatePickerWheel({
     },
     [columnRefs]
   );
-  const handleColumnKeyDown = React61.useCallback(
+  const handleColumnKeyDown = React62.useCallback(
     (column, event) => {
       const currentIndex = column === "month" ? monthIndex : column === "day" ? dayIndex : yearIndex;
       const maxIndex = column === "month" ? months.length - 1 : column === "day" ? days.length - 1 : years.length - 1;
@@ -16110,7 +16154,7 @@ function useDatePickerWheel({
 }
 
 // src/airbnb-fields/datepicker/DatePickerWheelColumn.tsx
-var import_jsx_runtime171 = require("react/jsx-runtime");
+var import_jsx_runtime172 = require("react/jsx-runtime");
 var spacerHeight = DATE_PICKER_OPTION_HEIGHT * DATE_PICKER_WHEEL_BUFFER_OPTIONS;
 function AirbnbDatePickerWheelColumn({
   id,
@@ -16124,7 +16168,7 @@ function AirbnbDatePickerWheelColumn({
   onOptionSelect,
   column
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("div", { className: "relative z-10 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime171.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("div", { className: "relative z-10 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)(
     "div",
     {
       id,
@@ -16141,14 +16185,14 @@ function AirbnbDatePickerWheelColumn({
         WebkitOverflowScrolling: "touch"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("div", { style: { height: `${spacerHeight}px` } }),
+        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("div", { style: { height: `${spacerHeight}px` } }),
         items.map((item, index) => {
           const { style } = getWheelOptionStyles(
             index,
             scrollTop,
             DATE_PICKER_OPTION_HEIGHT
           );
-          return /* @__PURE__ */ (0, import_jsx_runtime171.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
             "button",
             {
               id: `${id}-option-${index}`,
@@ -16164,14 +16208,14 @@ function AirbnbDatePickerWheelColumn({
             `${column}-${item}-${index}`
           );
         }),
-        /* @__PURE__ */ (0, import_jsx_runtime171.jsx)("div", { style: { height: `${spacerHeight}px` } })
+        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("div", { style: { height: `${spacerHeight}px` } })
       ]
     }
   ) });
 }
 
 // src/airbnb-fields/datepicker/DatePickerContent.tsx
-var import_jsx_runtime172 = require("react/jsx-runtime");
+var import_jsx_runtime173 = require("react/jsx-runtime");
 function AirbnbDatePickerBody({
   baseId,
   label,
@@ -16193,19 +16237,19 @@ function AirbnbDatePickerBody({
   onOptionSelect,
   onDone
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)("div", { className: "px-6 pb-4 pt-1 bg-white", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)("div", { className: "relative overflow-hidden rounded-[24px]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 z-20 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
-      /* @__PURE__ */ (0, import_jsx_runtime172.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 z-20 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
-      /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "px-6 pb-4 pt-1 bg-white", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative overflow-hidden rounded-[24px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("div", { className: "pointer-events-none absolute inset-x-0 top-0 z-20 h-16 bg-gradient-to-b from-white via-white/80 to-transparent" }),
+      /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("div", { className: "pointer-events-none absolute inset-x-0 bottom-0 z-20 h-16 bg-gradient-to-t from-white via-white/80 to-transparent" }),
+      /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
         "div",
         {
           "aria-hidden": true,
           className: "pointer-events-none absolute inset-x-0 top-1/2 z-0 h-8 -translate-y-1/2 rounded-[12px] bg-black/[0.04]"
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)("div", { className: "relative grid grid-cols-[1.35fr_0.7fr_1fr] gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative grid grid-cols-[1.35fr_0.7fr_1fr] gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
           AirbnbDatePickerWheelColumn,
           {
             id: `${baseId}-month`,
@@ -16220,7 +16264,7 @@ function AirbnbDatePickerBody({
             onOptionSelect
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
           AirbnbDatePickerWheelColumn,
           {
             id: `${baseId}-day`,
@@ -16235,7 +16279,7 @@ function AirbnbDatePickerBody({
             onOptionSelect
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
           AirbnbDatePickerWheelColumn,
           {
             id: `${baseId}-year`,
@@ -16252,7 +16296,7 @@ function AirbnbDatePickerBody({
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
+    /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
   ] });
 }
 function AirbnbDatePickerContent({
@@ -16280,7 +16324,7 @@ function AirbnbDatePickerContent({
   onColumnKeyDown,
   onOptionSelect
 }) {
-  const body = /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(
+  const body = /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
     AirbnbDatePickerBody,
     {
       baseId,
@@ -16305,27 +16349,27 @@ function AirbnbDatePickerContent({
     }
   );
   if (isMobile3) {
-    return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)(
       DrawerContent,
       {
         onClose: () => onOpenChange(false),
         className: "rounded-none rounded-t-[32px] border-0 p-0",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(DrawerTitle, { className: "sr-only", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(DrawerTitle, { className: "sr-only", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(DrawerDescription, { className: "sr-only", children: label }),
           body
         ]
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime172.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)(
     DialogContent,
     {
       className: "max-w-[520px] rounded-[28px] border-0 p-0 shadow-xl",
       showCloseButton: false,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(DialogTitle, { className: "sr-only", children: title }),
-        /* @__PURE__ */ (0, import_jsx_runtime172.jsx)(DialogDescription, { className: "sr-only", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(DialogTitle, { className: "sr-only", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(DialogDescription, { className: "sr-only", children: label }),
         body
       ]
     }
@@ -16333,7 +16377,7 @@ function AirbnbDatePickerContent({
 }
 
 // src/dashboard/datepicker/Datepicker.tsx
-var import_jsx_runtime173 = require("react/jsx-runtime");
+var import_jsx_runtime174 = require("react/jsx-runtime");
 var MONTHS_IN_YEAR2 = 12;
 function getMonthLabels2(locale) {
   const formatter = new Intl.DateTimeFormat(locale, { month: "long" });
@@ -16366,7 +16410,7 @@ function dateFromParts(day, monthIndex, year) {
   if (!isValidCalendarDate(yearNum, monthIndex, dayNum)) return null;
   return new Date(yearNum, monthIndex, dayNum);
 }
-var Datepicker = React62.forwardRef(
+var Datepicker = React63.forwardRef(
   function Datepicker2({
     label,
     value,
@@ -16399,14 +16443,14 @@ var Datepicker = React62.forwardRef(
     maxDate,
     formatValue
   }, ref) {
-    const containerRef = React62.useRef(null);
-    const dayInputRef = React62.useRef(null);
-    const monthInputRef = React62.useRef(null);
-    const monthListRef = React62.useRef(null);
-    const yearInputRef = React62.useRef(null);
-    const mobileTriggerRef = React62.useRef(null);
-    const wheelBaseId = React62.useId();
-    const reactId = React62.useId();
+    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 baseId = name ?? `dash-datepicker-${reactId}`;
     const dayId = `${baseId}-day`;
     const monthId = `${baseId}-month`;
@@ -16415,38 +16459,38 @@ var Datepicker = React62.forwardRef(
     const errorId = `${baseId}-error`;
     const { t, i18n } = (0, import_react_i18next38.useTranslation)();
     const resolvedLocale = locale ?? i18n.resolvedLanguage ?? i18n.language ?? "en-US";
-    const resolvedMonthLabels = React62.useMemo(
+    const resolvedMonthLabels = React63.useMemo(
       () => monthLabels ?? getMonthLabels2(resolvedLocale),
       [resolvedLocale, monthLabels]
     );
     const resolvedMonthPlaceholder = monthPlaceholder ?? t("month");
     const resolvedDoneLabel = doneLabel ?? t("done");
     const isControlled = value !== void 0;
-    const initialParts = React62.useMemo(
+    const initialParts = React63.useMemo(
       () => partsFromDate(value ?? defaultValue ?? null),
       // eslint-disable-next-line react-hooks/exhaustive-deps
       []
     );
-    const [day, setDay] = React62.useState(initialParts.day);
-    const [monthIndex, setMonthIndex] = React62.useState(
+    const [day, setDay] = React63.useState(initialParts.day);
+    const [monthIndex, setMonthIndex] = React63.useState(
       initialParts.monthIndex
     );
-    const [year, setYear] = React62.useState(initialParts.year);
-    const [isMonthOpen, setIsMonthOpen] = React62.useState(false);
-    const [isWheelOpen, setIsWheelOpen] = React62.useState(false);
-    const [focusedField, setFocusedField] = React62.useState(null);
-    const [monthInputValue, setMonthInputValue] = React62.useState("");
-    const [monthHighlightIndex, setMonthHighlightIndex] = React62.useState(-1);
+    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 isMobile3 = useIsMobile();
-    const emitChangeRef = React62.useRef(() => {
+    const emitChangeRef = React63.useRef(() => {
     });
-    const dayStateRef = React62.useRef(day);
-    const yearStateRef = React62.useRef(year);
-    const monthIndexRef = React62.useRef(monthIndex);
+    const dayStateRef = React63.useRef(day);
+    const yearStateRef = React63.useRef(year);
+    const monthIndexRef = React63.useRef(monthIndex);
     dayStateRef.current = day;
     yearStateRef.current = year;
     monthIndexRef.current = monthIndex;
-    React62.useImperativeHandle(
+    React63.useImperativeHandle(
       ref,
       () => ({
         getDayValue: () => dayStateRef.current,
@@ -16464,27 +16508,27 @@ var Datepicker = React62.forwardRef(
       }),
       []
     );
-    React62.useEffect(() => {
+    React63.useEffect(() => {
       if (!isControlled) return;
       const next = partsFromDate(value ?? null);
       setDay(next.day);
       setMonthIndex(next.monthIndex);
       setYear(next.year);
     }, [isControlled, value]);
-    React62.useEffect(() => {
+    React63.useEffect(() => {
       if (focusedField === "month") return;
       setMonthInputValue(
         monthIndex !== null ? resolvedMonthLabels[monthIndex] ?? "" : ""
       );
     }, [monthIndex, resolvedMonthLabels, focusedField]);
-    const filteredMonths = React62.useMemo(() => {
+    const filteredMonths = React63.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]);
-    React62.useEffect(() => {
+    React63.useEffect(() => {
       if (!isMonthOpen) {
         setMonthHighlightIndex(-1);
         return;
@@ -16505,7 +16549,7 @@ var Datepicker = React62.forwardRef(
     const isFocused = focusedField !== null || isMonthOpen || isWheelOpen;
     const isInvalid = Boolean(invalid || error);
     const wrapperWidth = toCssSize(width);
-    const currentDate = React62.useMemo(
+    const currentDate = React63.useMemo(
       () => dateFromParts(day, monthIndex, year),
       [day, monthIndex, year]
     );
@@ -16514,7 +16558,7 @@ var Datepicker = React62.forwardRef(
       onOutsideClick: () => setIsMonthOpen(false),
       isDisabled: !isMonthOpen || isMobile3
     });
-    const emitChange = React62.useCallback(
+    const emitChange = React63.useCallback(
       (nextDay, nextMonth, nextYear) => {
         if (!onChange) return;
         const date = dateFromParts(nextDay, nextMonth, nextYear);
@@ -16550,7 +16594,7 @@ var Datepicker = React62.forwardRef(
       setIsMonthOpen(true);
       setMonthHighlightIndex(0);
     };
-    const commitMonthInput = React62.useCallback(() => {
+    const commitMonthInput = React63.useCallback(() => {
       const query = monthInputValue.trim().toLowerCase();
       if (!query) {
         if (monthIndex !== null) {
@@ -16610,15 +16654,15 @@ var Datepicker = React62.forwardRef(
         setIsMonthOpen(false);
       }
     };
-    const focusDayInput = React62.useCallback(() => {
+    const focusDayInput = React63.useCallback(() => {
       if (isBlocked || readOnly) return;
       dayInputRef.current?.focus();
     }, [isBlocked, readOnly]);
-    const openWheel = React62.useCallback(() => {
+    const openWheel = React63.useCallback(() => {
       if (isBlocked || readOnly) return;
       setIsWheelOpen(true);
     }, [isBlocked, readOnly]);
-    const closeWheel = React62.useCallback(() => {
+    const closeWheel = React63.useCallback(() => {
       setIsWheelOpen(false);
       mobileTriggerRef.current?.focus();
     }, []);
@@ -16630,7 +16674,7 @@ var Datepicker = React62.forwardRef(
       minDate,
       maxDate
     });
-    const handleWheelDone = React62.useCallback(() => {
+    const handleWheelDone = React63.useCallback(() => {
       const next = wheel.draftDate;
       setDay(String(next.getDate()));
       setMonthIndex(next.getMonth());
@@ -16639,14 +16683,14 @@ var Datepicker = React62.forwardRef(
       setIsWheelOpen(false);
       mobileTriggerRef.current?.focus();
     }, [name, onChange, wheel.draftDate]);
-    const defaultFormatValue = React62.useCallback(
+    const defaultFormatValue = React63.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_runtime173.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_runtime173.jsx)(
+    const monthPanelContent = filteredMonths.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime174.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_runtime174.jsx)(
       "ul",
       {
         ref: monthListRef,
@@ -16657,7 +16701,7 @@ var Datepicker = React62.forwardRef(
         children: filteredMonths.map((option, position) => {
           const isSelected = option.index === monthIndex;
           const isHighlighted = position === monthHighlightIndex;
-          return /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("li", { role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("li", { role: "presentation", children: /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
             "button",
             {
               id: getMonthOptionId(option.index),
@@ -16684,7 +16728,7 @@ var Datepicker = React62.forwardRef(
       isBlocked && "cursor-not-allowed",
       loading && "cursor-progress"
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
       "div",
       {
         ref: containerRef,
@@ -16695,9 +16739,9 @@ var Datepicker = React62.forwardRef(
           className
         ),
         style: wrapperWidth ? { width: wrapperWidth } : void 0,
-        children: /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative min-h-[var(--field-min-height,48px)] w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative w-full", children: [
-            isMobile3 ? /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("div", { className: "relative min-h-[var(--field-min-height,48px)] w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("div", { className: "relative w-full", children: [
+            isMobile3 ? /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)(
               "button",
               {
                 ref: mobileTriggerRef,
@@ -16717,8 +16761,8 @@ var Datepicker = React62.forwardRef(
                   (isBlocked || readOnly) && "cursor-not-allowed"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left", children: triggerText ?? (isWheelOpen ? mobilePlaceholder : null) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left", children: triggerText ?? (isWheelOpen ? mobilePlaceholder : null) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("span", { className: "pointer-events-none flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
                     import_lucide_react50.ChevronDown,
                     {
                       size: 16,
@@ -16730,14 +16774,14 @@ var Datepicker = React62.forwardRef(
                   ) })
                 ]
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)(
+            ) : /* @__PURE__ */ (0, import_jsx_runtime174.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_runtime173.jsx)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
                     "input",
                     {
                       ref: dayInputRef,
@@ -16766,8 +16810,8 @@ var Datepicker = React62.forwardRef(
                       className: subInputClass
                     }
                   ) }),
-                  /* @__PURE__ */ (0, import_jsx_runtime173.jsxs)("div", { className: "relative flex h-full min-w-0 items-center gap-1 px-2 before:absolute before:inset-y-3 before:left-0 before:w-px before:bg-[var(--chekin-color-gray-3)] before:content-[''] after:absolute after:inset-y-3 after:right-0 after:w-px after:bg-[var(--chekin-color-gray-3)] after:content-[''] sm:px-3", children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("div", { className: "relative flex h-full min-w-0 items-center gap-1 px-2 before:absolute before:inset-y-3 before:left-0 before:w-px before:bg-[var(--chekin-color-gray-3)] before:content-[''] after:absolute after:inset-y-3 after:right-0 after:w-px after:bg-[var(--chekin-color-gray-3)] after:content-[''] sm:px-3", children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
                       "input",
                       {
                         ref: monthInputRef,
@@ -16813,7 +16857,7 @@ var Datepicker = React62.forwardRef(
                         )
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+                    /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
                       import_lucide_react50.ChevronDown,
                       {
                         size: 14,
@@ -16830,7 +16874,7 @@ var Datepicker = React62.forwardRef(
                       }
                     )
                   ] }),
-                  /* @__PURE__ */ (0, import_jsx_runtime173.jsx)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime174.jsx)("div", { className: "flex h-full min-w-0 items-center px-2 sm:px-4", children: /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
                     "input",
                     {
                       ref: yearInputRef,
@@ -16862,7 +16906,7 @@ var Datepicker = React62.forwardRef(
                 ]
               }
             ),
-            showCoverage && /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+            showCoverage && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
               "div",
               {
                 className: "absolute inset-0 cursor-text rounded-[6px] bg-[var(--empty-field-background)]",
@@ -16870,7 +16914,7 @@ var Datepicker = React62.forwardRef(
                 "aria-hidden": "true"
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
               Fieldset,
               {
                 isFocused,
@@ -16888,9 +16932,9 @@ var Datepicker = React62.forwardRef(
                 onClick: isMobile3 ? openWheel : showCoverage ? focusDayInput : void 0
               }
             ),
-            isMonthOpen && !isMobile3 && /* @__PURE__ */ (0, import_jsx_runtime173.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 && !isMobile3 && /* @__PURE__ */ (0, import_jsx_runtime174.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 })
           ] }),
-          isMobile3 && /* @__PURE__ */ (0, import_jsx_runtime173.jsx)(
+          isMobile3 && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
             AirbnbDatePickerContent,
             {
               baseId: wheelBaseId,
@@ -16918,9 +16962,9 @@ var Datepicker = React62.forwardRef(
               onOptionSelect: wheel.handleOptionSelect
             }
           ),
-          !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)(
+          !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)(
             FieldErrorMessage,
             {
               id: errorId,
@@ -16935,7 +16979,7 @@ var Datepicker = React62.forwardRef(
 );
 
 // src/dashboard/date-range-picker/DateRangePicker.tsx
-var React66 = __toESM(require("react"), 1);
+var React67 = __toESM(require("react"), 1);
 var import_react_i18next39 = require("react-i18next");
 
 // src/dashboard/date-range-picker/isDayBlocked.ts
@@ -17014,7 +17058,7 @@ var createDisabledMatchers = ({
 };
 
 // src/dashboard/date-range-picker/hooks/useRangeValue.ts
-var React63 = __toESM(require("react"), 1);
+var React64 = __toESM(require("react"), 1);
 var getRangeKey = (range) => `${range?.from?.getTime() ?? ""}-${range?.to?.getTime() ?? ""}`;
 function useRangeValue({
   value: externalValue,
@@ -17023,10 +17067,10 @@ function useRangeValue({
   name
 }) {
   const isControlled = externalValue !== void 0;
-  const [draft, setDraft] = React63.useState(
+  const [draft, setDraft] = React64.useState(
     isControlled ? externalValue : defaultValue
   );
-  const lastExternalKeyRef = React63.useRef(getRangeKey(externalValue));
+  const lastExternalKeyRef = React64.useRef(getRangeKey(externalValue));
   if (isControlled) {
     const externalKey = getRangeKey(externalValue);
     if (externalKey !== lastExternalKeyRef.current) {
@@ -17034,7 +17078,7 @@ function useRangeValue({
       setDraft(externalValue);
     }
   }
-  const commit = React63.useCallback(
+  const commit = React64.useCallback(
     (next) => {
       setDraft(next);
       if (next === void 0) {
@@ -17049,7 +17093,7 @@ function useRangeValue({
 }
 
 // src/dashboard/date-range-picker/hooks/useRangeTextInputs.ts
-var React64 = __toESM(require("react"), 1);
+var React65 = __toESM(require("react"), 1);
 
 // src/dashboard/date-range-picker/utils/inputFormat.ts
 function parseDateInputFormat(format2) {
@@ -17139,18 +17183,18 @@ function useRangeTextInputs({
   onFromComplete,
   onToComplete
 }) {
-  const tokens = React64.useMemo(
+  const tokens = React65.useMemo(
     () => parseDateInputFormat(displayFormat),
     [displayFormat]
   );
-  const maxDigits = React64.useMemo(() => getMaxDigits(tokens), [tokens]);
-  const [fromText, setFromText] = React64.useState(value?.from ? format2(value.from) : "");
-  const [toText, setToText] = React64.useState(value?.to ? format2(value.to) : "");
-  React64.useEffect(() => {
+  const maxDigits = React65.useMemo(() => getMaxDigits(tokens), [tokens]);
+  const [fromText, setFromText] = React65.useState(value?.from ? format2(value.from) : "");
+  const [toText, setToText] = React65.useState(value?.to ? format2(value.to) : "");
+  React65.useEffect(() => {
     setFromText(value?.from ? format2(value.from) : "");
     setToText(value?.to ? format2(value.to) : "");
   }, [format2, value?.from, value?.to]);
-  const handleFromChange = React64.useCallback(
+  const handleFromChange = React65.useCallback(
     (raw) => {
       const formatted = autoFormatDateInput(raw, tokens);
       const wasComplete = countDigits(fromText) === maxDigits;
@@ -17162,7 +17206,7 @@ function useRangeTextInputs({
     },
     [fromText, maxDigits, onFromComplete, parse3, tokens]
   );
-  const handleToChange = React64.useCallback(
+  const handleToChange = React65.useCallback(
     (raw) => {
       const formatted = autoFormatDateInput(raw, tokens);
       const wasComplete = countDigits(toText) === maxDigits;
@@ -17174,7 +17218,7 @@ function useRangeTextInputs({
     },
     [maxDigits, onToComplete, parse3, toText, tokens]
   );
-  const handleFromBlur = React64.useCallback(() => {
+  const handleFromBlur = React65.useCallback(() => {
     if (!fromText) {
       const next = { from: void 0, to: value?.to };
       onCommit(next);
@@ -17191,7 +17235,7 @@ function useRangeTextInputs({
     setFromText(value?.from ? format2(value.from) : "");
     return void 0;
   }, [format2, fromText, onBlur, onCommit, parse3, value]);
-  const handleToBlur = React64.useCallback(() => {
+  const handleToBlur = React65.useCallback(() => {
     if (!toText) {
       const next = { from: value?.from, to: void 0 };
       onCommit(next);
@@ -17220,21 +17264,21 @@ function useRangeTextInputs({
 }
 
 // src/dashboard/date-range-picker/hooks/useRangeMonthSync.ts
-var React65 = __toESM(require("react"), 1);
+var React66 = __toESM(require("react"), 1);
 function useRangeMonthSync(value) {
-  const isPreloadedRef = React65.useRef(false);
-  const [month, setMonth] = React65.useState(value?.from ?? /* @__PURE__ */ new Date());
-  React65.useEffect(() => {
+  const isPreloadedRef = React66.useRef(false);
+  const [month, setMonth] = React66.useState(value?.from ?? /* @__PURE__ */ new Date());
+  React66.useEffect(() => {
     if (value?.from && !isPreloadedRef.current) {
       setMonth(value.from);
       isPreloadedRef.current = true;
     }
   }, [value?.from]);
-  const syncMonthToValue = React65.useCallback((next) => {
+  const syncMonthToValue = React66.useCallback((next) => {
     isPreloadedRef.current = true;
     if (next?.from) setMonth(next.from);
   }, []);
-  const resetPreload = React65.useCallback(() => {
+  const resetPreload = React66.useCallback(() => {
     isPreloadedRef.current = false;
   }, []);
   return { month, setMonth, syncMonthToValue, resetPreload };
@@ -17260,7 +17304,7 @@ function resolveRangeSelection({
 
 // src/dashboard/date-range-picker/components/DateRangeInputs.tsx
 var import_lucide_react51 = require("lucide-react");
-var import_jsx_runtime174 = require("react/jsx-runtime");
+var import_jsx_runtime175 = 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";
@@ -17302,7 +17346,7 @@ function DateRangeInputs({
     isBlocked && "cursor-not-allowed",
     loading && "cursor-progress"
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)(
     "div",
     {
       className: cn(
@@ -17311,7 +17355,7 @@ function DateRangeInputs({
       ),
       onClick: onRowClick,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
           "input",
           {
             ref: fromInputRef,
@@ -17336,7 +17380,7 @@ function DateRangeInputs({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
           "span",
           {
             "aria-hidden": "true",
@@ -17347,7 +17391,7 @@ function DateRangeInputs({
             children: "\u2192"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
           "input",
           {
             ref: toInputRef,
@@ -17372,8 +17416,8 @@ function DateRangeInputs({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime174.jsxs)("span", { className: "ml-auto flex shrink-0 items-center gap-2 pl-2 text-[var(--chekin-color-gray-2)]", children: [
-          !readOnly && !hideClearDates && !isEmpty && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime175.jsxs)("span", { className: "ml-auto flex shrink-0 items-center gap-2 pl-2 text-[var(--chekin-color-gray-2)]", children: [
+          !readOnly && !hideClearDates && !isEmpty && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
             "button",
             {
               type: "button",
@@ -17381,10 +17425,10 @@ function DateRangeInputs({
               onClick: onReset,
               className: iconButtonClass,
               "aria-label": clearLabel,
-              children: /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(import_lucide_react51.SquareX, { size: 16, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+              children: /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(import_lucide_react51.SquareX, { size: 16, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
             }
           ),
-          !readOnly && !hideCalendarIcon && /* @__PURE__ */ (0, import_jsx_runtime174.jsx)(
+          !readOnly && !hideCalendarIcon && /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
             "button",
             {
               type: "button",
@@ -17396,7 +17440,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_runtime174.jsx)(import_lucide_react51.CalendarDays, { size: 18 })
+              children: /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(import_lucide_react51.CalendarDays, { size: 18 })
             }
           )
         ] })
@@ -17406,7 +17450,7 @@ function DateRangeInputs({
 }
 
 // src/dashboard/date-range-picker/components/DateRangeCalendar.tsx
-var import_jsx_runtime175 = require("react/jsx-runtime");
+var import_jsx_runtime176 = require("react/jsx-runtime");
 function DateRangeCalendar({
   value,
   month,
@@ -17422,7 +17466,7 @@ function DateRangeCalendar({
   components,
   ...dayPickerProps
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime175.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
     Calendar,
     {
       mode: "range",
@@ -17445,7 +17489,7 @@ function DateRangeCalendar({
 }
 
 // src/dashboard/date-range-picker/components/DateRangePopover.tsx
-var import_jsx_runtime176 = require("react/jsx-runtime");
+var import_jsx_runtime177 = require("react/jsx-runtime");
 function DateRangePopover({
   isOpen,
   isMobile: isMobile3,
@@ -17457,30 +17501,30 @@ function DateRangePopover({
 }) {
   if (!isOpen) return null;
   if (isMobile3) {
-    return /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
       Drawer,
       {
         open: isOpen,
         onOpenChange: (next) => {
           if (!next) onClose();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime176.jsxs)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)(
           DrawerContent,
           {
             onClose,
             lockScroll: false,
             className: "max-h-[calc(100vh-1rem)]",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(DrawerTitle, { className: "sr-only", children: drawerTitle }),
-              /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(DrawerDescription, { className: "sr-only", children: drawerDescription }),
-              /* @__PURE__ */ (0, import_jsx_runtime176.jsx)("div", { className: "flex items-start justify-center overflow-x-auto px-2 pb-4 pt-1", children })
+              /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(DrawerTitle, { className: "sr-only", children: drawerTitle }),
+              /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(DrawerDescription, { className: "sr-only", children: drawerDescription }),
+              /* @__PURE__ */ (0, import_jsx_runtime177.jsx)("div", { className: "flex items-start justify-center overflow-x-auto px-2 pb-4 pt-1", children })
             ]
           }
         )
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime176.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
     "div",
     {
       className: cn(
@@ -17493,8 +17537,8 @@ function DateRangePopover({
 }
 
 // src/dashboard/date-range-picker/DateRangePicker.tsx
-var import_jsx_runtime177 = require("react/jsx-runtime");
-var DateRangePicker = React66.forwardRef(function DateRangePicker2({
+var import_jsx_runtime178 = require("react/jsx-runtime");
+var DateRangePicker = React67.forwardRef(function DateRangePicker2({
   label,
   value: externalValue,
   defaultValue,
@@ -17529,20 +17573,20 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
   components: customComponents,
   ...dayPickerProps
 }, ref) {
-  const containerRef = React66.useRef(null);
-  const fromInputRef = React66.useRef(null);
-  const toInputRef = React66.useRef(null);
-  const reactId = React66.useId();
+  const containerRef = React67.useRef(null);
+  const fromInputRef = React67.useRef(null);
+  const toInputRef = React67.useRef(null);
+  const reactId = React67.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 = React66.useMemo(() => {
+  const normalizedValue = React67.useMemo(() => {
     if (externalValue === void 0) return void 0;
     return { from: toDate(externalValue?.from), to: toDate(externalValue?.to) };
   }, [externalValue]);
-  const normalizedDefaultValue = React66.useMemo(() => {
+  const normalizedDefaultValue = React67.useMemo(() => {
     if (defaultValue === void 0) return void 0;
     return { from: toDate(defaultValue?.from), to: toDate(defaultValue?.to) };
   }, [defaultValue]);
@@ -17552,16 +17596,16 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
     onChange,
     name
   });
-  const normalizedMinDate = React66.useMemo(() => toDate(minDate), [minDate]);
-  const normalizedMaxDate = React66.useMemo(() => toDate(maxDate), [maxDate]);
-  const formatter = React66.useMemo(() => formatDate(displayFormat), [displayFormat]);
-  const parser = React66.useMemo(() => parseDate(displayFormat), [displayFormat]);
-  const closeCalendarRef = React66.useRef(() => {
+  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 closeCalendarRef = React67.useRef(() => {
   });
-  const handleFromComplete = React66.useCallback(() => {
+  const handleFromComplete = React67.useCallback(() => {
     toInputRef.current?.focus();
   }, []);
-  const handleToComplete = React66.useCallback(() => {
+  const handleToComplete = React67.useCallback(() => {
     toInputRef.current?.blur();
     closeCalendarRef.current();
   }, []);
@@ -17585,9 +17629,9 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
     onToComplete: handleToComplete
   });
   const { month, setMonth, syncMonthToValue } = useRangeMonthSync(value);
-  const [isOpen, setIsOpen] = React66.useState(false);
-  const [focusedInput, setFocusedInput] = React66.useState(null);
-  const [autoFocus, setAutoFocus] = React66.useState(false);
+  const [isOpen, setIsOpen] = React67.useState(false);
+  const [focusedInput, setFocusedInput] = React67.useState(null);
+  const [autoFocus, setAutoFocus] = React67.useState(false);
   const isMobile3 = useIsMobile();
   const { t } = (0, import_react_i18next39.useTranslation)();
   const drawerTitle = label ?? t("select_dates");
@@ -17598,14 +17642,14 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
   const isFocused = focusedInput !== null || isOpen;
   const wrapperWidth = toCssSize(width);
   const monthsToShow = numberOfMonths ?? (isMobile3 ? 1 : 2);
-  const closeCalendar = React66.useCallback(() => {
+  const closeCalendar = React67.useCallback(() => {
     setIsOpen(false);
     setFocusedInput(null);
     setAutoFocus(false);
     if (value?.from) setMonth(value.from);
   }, [setMonth, value?.from]);
   closeCalendarRef.current = closeCalendar;
-  const openCalendar = React66.useCallback(() => {
+  const openCalendar = React67.useCallback(() => {
     if (isBlocked || readOnly) return;
     setIsOpen(true);
   }, [isBlocked, readOnly]);
@@ -17614,7 +17658,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
     onOutsideClick: closeCalendar,
     isDisabled: !isOpen || isMobile3
   });
-  const handlePickerChange = React66.useCallback(
+  const handlePickerChange = React67.useCallback(
     (range, pickedDate) => {
       const { next, shouldClose } = resolveRangeSelection({
         previous: value,
@@ -17635,7 +17679,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
     setToText("");
     setMonth(/* @__PURE__ */ new Date());
   };
-  const disabledMatchers = React66.useMemo(
+  const disabledMatchers = React67.useMemo(
     () => createDisabledMatchers({
       minDate: normalizedMinDate,
       maxDate: normalizedMaxDate,
@@ -17654,7 +17698,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
     openCalendar();
     if (autoFocusOnOpen) setAutoFocus(true);
   };
-  React66.useImperativeHandle(
+  React67.useImperativeHandle(
     ref,
     () => ({
       setDateRange: (range) => {
@@ -17677,7 +17721,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
       syncMonthToValue
     ]
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
     "div",
     {
       ref: containerRef,
@@ -17688,9 +17732,9 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
         className
       ),
       style: wrapperWidth ? { width: wrapperWidth } : void 0,
-      children: /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)("div", { className: "relative min-h-[var(--field-min-height,48px)] w-full", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime177.jsxs)("div", { className: "relative w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime178.jsxs)("div", { className: "relative min-h-[var(--field-min-height,48px)] w-full", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime178.jsxs)("div", { className: "relative w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
             DateRangeInputs,
             {
               fromId,
@@ -17743,7 +17787,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
               onToggleCalendar: toggleCalendar
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
             Fieldset,
             {
               isFocused,
@@ -17760,7 +17804,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
               tooltip
             }
           ),
-          /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
             DateRangePopover,
             {
               isOpen: isOpen && !isMobile3,
@@ -17769,7 +17813,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
               drawerTitle,
               drawerDescription,
               onClose: closeCalendar,
-              children: /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
                 DateRangeCalendar,
                 {
                   value,
@@ -17790,7 +17834,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
             }
           )
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
           DateRangePopover,
           {
             isOpen: isOpen && isMobile3,
@@ -17799,7 +17843,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
             drawerTitle,
             drawerDescription,
             onClose: closeCalendar,
-            children: /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
               DateRangeCalendar,
               {
                 value,
@@ -17819,9 +17863,9 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
             )
           }
         ),
-        !error && optional && /* @__PURE__ */ (0, import_jsx_runtime177.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_runtime177.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-        error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime177.jsx)(
+        !error && optional && /* @__PURE__ */ (0, import_jsx_runtime178.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_runtime178.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+        error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(
           FieldErrorMessage,
           {
             id: errorId,
@@ -17835,7 +17879,7 @@ var DateRangePicker = React66.forwardRef(function DateRangePicker2({
 });
 
 // src/dashboard/date-range-picker/useValidateDates.ts
-var React67 = __toESM(require("react"), 1);
+var React68 = __toESM(require("react"), 1);
 var import_react_i18next40 = require("react-i18next");
 var import_date_fns4 = require("date-fns");
 var import_react_day_picker2 = require("react-day-picker");
@@ -17858,11 +17902,11 @@ function useValidateDates({
   const { t } = (0, import_react_i18next40.useTranslation)();
   const handleError = useEvent(onError);
   const handleSuccess = useEvent(onSuccess);
-  const errorFormatter = React67.useMemo(
+  const errorFormatter = React68.useMemo(
     () => formatDate(displayFormat ?? DEFAULT_DISPLAY_FORMAT),
     [displayFormat]
   );
-  const validateDates = React67.useCallback(
+  const validateDates = React68.useCallback(
     (dates) => {
       const startDate = dates?.from;
       const endDate = dates?.to;
@@ -17912,9 +17956,9 @@ function useValidateDates({
 }
 
 // src/dashboard/time-picker/TimePicker.tsx
-var React68 = __toESM(require("react"), 1);
+var React69 = __toESM(require("react"), 1);
 var import_date_fns5 = require("date-fns");
-var import_jsx_runtime178 = require("react/jsx-runtime");
+var import_jsx_runtime179 = 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());
@@ -17956,24 +18000,24 @@ var FORMAT_SETTINGS = {
   },
   hours: { interval_unit: "H", interval: 1, min_time: "00:00", max_time: "23:00" }
 };
-var TimePicker = React68.forwardRef(function TimePicker2({ format: formatName = "time", timeSettings, options, ...selectProps }, ref) {
-  const resolvedOptions = React68.useMemo(() => {
+var TimePicker = React69.forwardRef(function TimePicker2({ format: formatName = "time", timeSettings, options, ...selectProps }, ref) {
+  const resolvedOptions = React69.useMemo(() => {
     if (options) return options;
     const settings = timeSettings ?? FORMAT_SETTINGS[formatName];
     return buildOptions(settings);
   }, [formatName, options, timeSettings]);
-  return /* @__PURE__ */ (0, import_jsx_runtime178.jsx)(Select, { ref, ...selectProps, options: resolvedOptions });
+  return /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(Select, { ref, ...selectProps, options: resolvedOptions });
 });
 
 // src/dashboard/file-input/FileInput.tsx
-var React69 = __toESM(require("react"), 1);
+var React70 = __toESM(require("react"), 1);
 var import_lucide_react52 = require("lucide-react");
 var import_react_i18next41 = require("react-i18next");
-var import_jsx_runtime179 = require("react/jsx-runtime");
+var import_jsx_runtime180 = require("react/jsx-runtime");
 function defaultDownload(url) {
   window.open(url, "_blank", "noopener,noreferrer");
 }
-var FileInput = React69.forwardRef(function FileInput2({
+var FileInput = React70.forwardRef(function FileInput2({
   label,
   value,
   onChange,
@@ -17996,12 +18040,12 @@ var FileInput = React69.forwardRef(function FileInput2({
   width,
   downloadLabel
 }, ref) {
-  const internalRef = React69.useRef(null);
+  const internalRef = React70.useRef(null);
   const inputRef = useCombinedRef(ref, internalRef);
   const { t } = (0, import_react_i18next41.useTranslation)();
   const resolvedLabel = label ?? t("upload_file");
   const resolvedDownloadLabel = downloadLabel ?? t("download_attachment");
-  const reactId = React69.useId();
+  const reactId = React70.useId();
   const inputId = `${name || "dash-file"}-${reactId}`;
   const labelId = `${inputId}-label`;
   const errorId = `${inputId}-error`;
@@ -18027,7 +18071,7 @@ var FileInput = React69.forwardRef(function FileInput2({
     event.stopPropagation();
     if (isUrl) onDownload(value);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime180.jsxs)(
     "label",
     {
       htmlFor: inputId,
@@ -18040,7 +18084,7 @@ var FileInput = React69.forwardRef(function FileInput2({
       ),
       style: wrapperWidth ? { width: wrapperWidth } : void 0,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
           "input",
           {
             ref: inputRef,
@@ -18057,9 +18101,9 @@ var FileInput = React69.forwardRef(function FileInput2({
             "aria-invalid": isInvalid
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)("div", { className: "relative w-full", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)("div", { className: "relative w-full", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime180.jsxs)("div", { className: "relative w-full", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime180.jsxs)("div", { className: "relative w-full", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime180.jsxs)(
               "div",
               {
                 className: cn(
@@ -18067,25 +18111,25 @@ var FileInput = React69.forwardRef(function FileInput2({
                   isEmpty && "bg-[var(--empty-field-background)]"
                 ),
                 children: [
-                  hasFileChip ? /* @__PURE__ */ (0, import_jsx_runtime179.jsxs)(
+                  hasFileChip ? /* @__PURE__ */ (0, import_jsx_runtime180.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_runtime179.jsxs)(
+                        isUrl ? /* @__PURE__ */ (0, import_jsx_runtime180.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_runtime179.jsx)("span", { className: "truncate", children: resolvedDownloadLabel }),
-                              /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(import_lucide_react52.Download, { size: 15 })
+                              /* @__PURE__ */ (0, import_jsx_runtime180.jsx)("span", { className: "truncate", children: resolvedDownloadLabel }),
+                              /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(import_lucide_react52.Download, { size: 15 })
                             ]
                           }
-                        ) : /* @__PURE__ */ (0, import_jsx_runtime179.jsx)("span", { className: "truncate text-[14px] font-medium text-[var(--chekin-color-brand-navy)]", children: value.name }),
-                        /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(
+                        ) : /* @__PURE__ */ (0, import_jsx_runtime180.jsx)("span", { className: "truncate text-[14px] font-medium text-[var(--chekin-color-brand-navy)]", children: value.name }),
+                        /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
                           "button",
                           {
                             type: "button",
@@ -18093,17 +18137,17 @@ var FileInput = React69.forwardRef(function FileInput2({
                             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_runtime179.jsx)(import_lucide_react52.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
+                            children: /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(import_lucide_react52.SquareX, { size: 15, fill: "#9696b9", color: "#f8f8f8", strokeWidth: 1.8 })
                           }
                         )
                       ]
                     }
-                  ) : /* @__PURE__ */ (0, import_jsx_runtime179.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left text-[var(--chekin-color-gray-1)]", children: placeholder ?? "" }),
-                  /* @__PURE__ */ (0, import_jsx_runtime179.jsx)("span", { className: "ml-auto flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(import_lucide_react52.Paperclip, { size: 20 }) })
+                  ) : /* @__PURE__ */ (0, import_jsx_runtime180.jsx)("span", { className: "block min-w-0 flex-1 truncate text-left text-[var(--chekin-color-gray-1)]", children: placeholder ?? "" }),
+                  /* @__PURE__ */ (0, import_jsx_runtime180.jsx)("span", { className: "ml-auto flex items-center gap-2 text-[var(--chekin-color-gray-2)]", children: /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(import_lucide_react52.Paperclip, { size: 20 }) })
                 ]
               }
             ),
-            /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
               Fieldset,
               {
                 isFocused: false,
@@ -18121,9 +18165,9 @@ var FileInput = React69.forwardRef(function FileInput2({
               }
             )
           ] }),
-          !error && optional && /* @__PURE__ */ (0, import_jsx_runtime179.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_runtime179.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
-          error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime179.jsx)(
+          !error && optional && /* @__PURE__ */ (0, import_jsx_runtime180.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_runtime180.jsx)("span", { className: "mt-[1px] block text-[12px] font-normal text-[var(--chekin-color-gray-1)]", children: helperText }),
+          error && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
             FieldErrorMessage,
             {
               id: errorId,
@@ -18138,10 +18182,10 @@ var FileInput = React69.forwardRef(function FileInput2({
 });
 
 // src/dashboard/select-icons-box/SelectIconsBox.tsx
-var React70 = __toESM(require("react"), 1);
-var import_jsx_runtime180 = require("react/jsx-runtime");
+var React71 = __toESM(require("react"), 1);
+var import_jsx_runtime181 = require("react/jsx-runtime");
 var FOCUSABLE_TRIGGER_SELECTOR2 = 'input:not([type="hidden"]):not([disabled]):not([readonly]), button:not([disabled])';
-var SelectIconsBox = React70.forwardRef(
+var SelectIconsBox = React71.forwardRef(
   function SelectIconsBox2({
     children,
     icons,
@@ -18157,10 +18201,10 @@ var SelectIconsBox = React70.forwardRef(
     className,
     boxClassName
   }, ref) {
-    const containerRef = React70.useRef(null);
+    const containerRef = React71.useRef(null);
     const combinedContainerRef = useCombinedRef(containerRef, ref);
     const isControlled = controlledOpen !== void 0;
-    const [internalOpen, setInternalOpen] = React70.useState(defaultOpen);
+    const [internalOpen, setInternalOpen] = React71.useState(defaultOpen);
     const isOpen = isControlled ? controlledOpen : internalOpen;
     const setOpen = (next) => {
       if (!isControlled) setInternalOpen(next);
@@ -18187,7 +18231,7 @@ var SelectIconsBox = React70.forwardRef(
       );
       focusable?.focus();
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime180.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime181.jsxs)(
       "div",
       {
         ref: combinedContainerRef,
@@ -18197,7 +18241,7 @@ var SelectIconsBox = React70.forwardRef(
         className: cn("relative inline-block outline-none", className),
         children: [
           children,
-          isOpen && /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
+          isOpen && /* @__PURE__ */ (0, import_jsx_runtime181.jsx)(
             "div",
             {
               className: cn(
@@ -18208,7 +18252,7 @@ var SelectIconsBox = React70.forwardRef(
                 boxClassName
               ),
               style: { gridTemplateColumns: `repeat(${columns}, minmax(0, 1fr))` },
-              children: icons.map((iconName) => /* @__PURE__ */ (0, import_jsx_runtime180.jsx)(
+              children: icons.map((iconName) => /* @__PURE__ */ (0, import_jsx_runtime181.jsx)(
                 "button",
                 {
                   type: "button",
@@ -18291,14 +18335,14 @@ function getErrorMessage(error) {
 
 // src/lib/toastResponseError.tsx
 var import_i18next = __toESM(require("i18next"), 1);
-var import_jsx_runtime181 = require("react/jsx-runtime");
+var import_jsx_runtime182 = require("react/jsx-runtime");
 function addSupportEmailToMessage(message, prefixText) {
   if (typeof message !== "string") {
     return message;
   }
   const builtMessage = `${prefixText ? `${prefixText} ` : ""}${message}`;
-  return /* @__PURE__ */ (0, import_jsx_runtime181.jsxs)("div", { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime181.jsx)("div", { children: builtMessage }),
+  return /* @__PURE__ */ (0, import_jsx_runtime182.jsxs)("div", { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime182.jsx)("div", { children: builtMessage }),
     import_i18next.default.t("reach_us_at_email")
   ] });
 }
@@ -18314,12 +18358,12 @@ function toastResponseError(error, options = {}) {
 
 // src/legacy-fields/textarea/Textarea.tsx
 var import_react89 = require("react");
-var import_jsx_runtime182 = require("react/jsx-runtime");
+var import_jsx_runtime183 = require("react/jsx-runtime");
 var LegacyTextarea = (0, import_react89.forwardRef)(
   ({ className, textareaClassName, label, disabled, name, invalid, ...textareaProps }, ref) => {
     const inputId = (0, import_react89.useId)();
-    return /* @__PURE__ */ (0, import_jsx_runtime182.jsxs)("div", { className: cn("relative", className), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)("div", { className: cn("relative", className), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
         "textarea",
         {
           ref,
@@ -18335,7 +18379,7 @@ var LegacyTextarea = (0, import_react89.forwardRef)(
           ...textareaProps
         }
       ),
-      label && /* @__PURE__ */ (0, import_jsx_runtime182.jsx)(
+      label && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
         "label",
         {
           htmlFor: inputId,
@@ -18353,15 +18397,15 @@ var LegacyTextarea = (0, import_react89.forwardRef)(
 LegacyTextarea.displayName = "LegacyTextarea";
 
 // src/airbnb-fields/datepicker/DatePicker.tsx
-var React72 = __toESM(require("react"), 1);
+var React73 = __toESM(require("react"), 1);
 var import_lucide_react54 = require("lucide-react");
 
 // src/airbnb-fields/field-trigger/FieldTrigger.tsx
-var React71 = __toESM(require("react"), 1);
+var React72 = __toESM(require("react"), 1);
 var import_lucide_react53 = require("lucide-react");
 var import_react_i18next42 = require("react-i18next");
-var import_jsx_runtime183 = require("react/jsx-runtime");
-var AirbnbFieldTrigger = React71.forwardRef(
+var import_jsx_runtime184 = require("react/jsx-runtime");
+var AirbnbFieldTrigger = React72.forwardRef(
   ({
     as = "button",
     id,
@@ -18397,14 +18441,14 @@ var AirbnbFieldTrigger = React71.forwardRef(
     const optionalLabel = optional ? typeof optional === "string" ? optional : t("optional") : void 0;
     const visibleLabelText = labelText ?? label;
     const hasLabelMeta = Boolean(optionalLabel) || Boolean(tooltip);
-    const resolvedLabelText = visibleLabelText && hasLabelMeta ? /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)("span", { className: "inline-flex max-w-full items-center gap-1.5 align-middle", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("span", { className: "min-w-0 truncate", children: visibleLabelText }),
-      optionalLabel && /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)("span", { className: "text-current opacity-70 lowercase", children: [
+    const resolvedLabelText = visibleLabelText && hasLabelMeta ? /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)("span", { className: "inline-flex max-w-full items-center gap-1.5 align-middle", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("span", { className: "min-w-0 truncate", children: visibleLabelText }),
+      optionalLabel && /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)("span", { className: "text-current opacity-70 lowercase", children: [
         "(",
         optionalLabel,
         ")"
       ] }),
-      tooltip && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+      tooltip && /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
         HelpTooltip,
         {
           content: tooltip,
@@ -18419,9 +18463,9 @@ var AirbnbFieldTrigger = React71.forwardRef(
     const hasInvalidState = Boolean(error);
     const errorMessage = typeof error === "string" ? error : void 0;
     const isBlocked = Boolean(disabled) || Boolean(loading);
-    const resolvedTrailingAdornment = loading || trailingAdornment ? /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)("span", { className: "flex items-center gap-2", children: [
+    const resolvedTrailingAdornment = loading || trailingAdornment ? /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)("span", { className: "flex items-center gap-2", children: [
       trailingAdornment,
-      loading && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+      loading && /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
         import_lucide_react53.Loader2,
         {
           "aria-hidden": "true",
@@ -18437,8 +18481,8 @@ var AirbnbFieldTrigger = React71.forwardRef(
       disabled ? "cursor-not-allowed opacity-50" : loading ? "cursor-progress" : "cursor-pointer",
       className
     );
-    const sharedContent = /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(import_jsx_runtime183.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)(
+    const sharedContent = /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(import_jsx_runtime184.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)(
         "span",
         {
           className: cn(
@@ -18447,7 +18491,7 @@ var AirbnbFieldTrigger = React71.forwardRef(
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
               "span",
               {
                 id: labelId,
@@ -18460,7 +18504,7 @@ var AirbnbFieldTrigger = React71.forwardRef(
                 children: animatedLabel
               }
             ),
-            children ? children : hasValue ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+            children ? children : hasValue ? /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
               "span",
               {
                 id: valueId,
@@ -18471,11 +18515,11 @@ var AirbnbFieldTrigger = React71.forwardRef(
                 ),
                 children: valueText
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("span", { id: helperTextId, className: "sr-only", children: placeholder ?? label })
+            ) : /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("span", { id: helperTextId, className: "sr-only", children: placeholder ?? label })
           ]
         }
       ),
-      resolvedTrailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+      resolvedTrailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
         "span",
         {
           "aria-hidden": "true",
@@ -18484,9 +18528,9 @@ var AirbnbFieldTrigger = React71.forwardRef(
         }
       )
     ] });
-    return /* @__PURE__ */ (0, import_jsx_runtime183.jsxs)("div", { className: "w-full", children: [
-      topLabel && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)("p", { className: "mb-3 text-[16px] font-semibold leading-5 text-[#222222]", children: topLabel }),
-      as === "button" ? /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)("div", { className: "w-full", children: [
+      topLabel && /* @__PURE__ */ (0, import_jsx_runtime184.jsx)("p", { className: "mb-3 text-[16px] font-semibold leading-5 text-[#222222]", children: topLabel }),
+      as === "button" ? /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
         "button",
         {
           id,
@@ -18503,7 +18547,7 @@ var AirbnbFieldTrigger = React71.forwardRef(
           ...props,
           children: sharedContent
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(
+      ) : /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
         "div",
         {
           id,
@@ -18520,16 +18564,16 @@ var AirbnbFieldTrigger = React71.forwardRef(
           children: sharedContent
         }
       ),
-      errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime183.jsx)(FieldErrorMessage, { id: errorId, message: errorMessage })
+      errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(FieldErrorMessage, { id: errorId, message: errorMessage })
     ] });
   }
 );
 AirbnbFieldTrigger.displayName = "AirbnbFieldTrigger";
 
 // src/airbnb-fields/datepicker/DatePicker.tsx
-var import_jsx_runtime184 = require("react/jsx-runtime");
+var import_jsx_runtime185 = require("react/jsx-runtime");
 var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
-var AirbnbDatePicker = React72.forwardRef(
+var AirbnbDatePicker = React73.forwardRef(
   ({
     label,
     topLabel,
@@ -18554,24 +18598,24 @@ var AirbnbDatePicker = React72.forwardRef(
     formatValue = formatDateValue
   }, ref) => {
     const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
-    const [isOpen, setIsOpen] = React72.useState(false);
-    const triggerId = React72.useId();
-    const pickerId = React72.useId();
-    const labelId = React72.useId();
-    const valueId = React72.useId();
-    const helperTextId = React72.useId();
-    const errorId = React72.useId();
-    const internalRef = React72.useRef(null);
+    const [isOpen, setIsOpen] = React73.useState(false);
+    const triggerId = React73.useId();
+    const pickerId = React73.useId();
+    const labelId = React73.useId();
+    const valueId = React73.useId();
+    const helperTextId = React73.useId();
+    const errorId = React73.useId();
+    const internalRef = React73.useRef(null);
     const combinedRef = useCombinedRef(ref, internalRef);
-    const monthLabels = React72.useMemo(() => getMonthLabels(locale), [locale]);
-    const resolvedMinDate = React72.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
-    const resolvedMaxDate = React72.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
-    const normalizedValue = React72.useMemo(() => normalizeDateValue(value), [value]);
-    const normalizedDefaultValue = React72.useMemo(
+    const monthLabels = React73.useMemo(() => getMonthLabels(locale), [locale]);
+    const resolvedMinDate = React73.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
+    const resolvedMaxDate = React73.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
+    const normalizedValue = React73.useMemo(() => normalizeDateValue(value), [value]);
+    const normalizedDefaultValue = React73.useMemo(
       () => normalizeDateValue(defaultValue),
       [defaultValue]
     );
-    const resolvedValue = React72.useMemo(
+    const resolvedValue = React73.useMemo(
       () => normalizedValue ? clampDate(normalizedValue, resolvedMinDate, resolvedMaxDate) : null,
       [normalizedValue, resolvedMaxDate, resolvedMinDate]
     );
@@ -18602,7 +18646,7 @@ var AirbnbDatePicker = React72.forwardRef(
       minDate: resolvedMinDate,
       maxDate: resolvedMaxDate
     });
-    const handleOpenChange = React72.useCallback(
+    const handleOpenChange = React73.useCallback(
       (nextOpen) => {
         if (isBlocked && nextOpen) return;
         setIsOpen(nextOpen);
@@ -18612,7 +18656,7 @@ var AirbnbDatePicker = React72.forwardRef(
       },
       [isBlocked]
     );
-    const handleDone = React72.useCallback(() => {
+    const handleDone = React73.useCallback(() => {
       if (isBlocked) return;
       onChange(clampDate(draftDate, resolvedMinDate, resolvedMaxDate));
       handleOpenChange(false);
@@ -18624,11 +18668,11 @@ var AirbnbDatePicker = React72.forwardRef(
       resolvedMaxDate,
       resolvedMinDate
     ]);
-    const handleTriggerClick = React72.useCallback(() => {
+    const handleTriggerClick = React73.useCallback(() => {
       if (isBlocked) return;
       setIsOpen(true);
     }, [isBlocked]);
-    const handleTriggerKeyDown = React72.useCallback(
+    const handleTriggerKeyDown = React73.useCallback(
       (event) => {
         if (isBlocked) return;
         if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
@@ -18638,13 +18682,13 @@ var AirbnbDatePicker = React72.forwardRef(
       },
       [isBlocked]
     );
-    React72.useEffect(() => {
+    React73.useEffect(() => {
       if (isBlocked) {
         setIsOpen(false);
       }
     }, [isBlocked]);
-    return /* @__PURE__ */ (0, import_jsx_runtime184.jsxs)("div", { className: cn("relative w-full max-w-[var(--max-field-width)]", className), children: [
-      name && /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)("div", { className: cn("relative w-full max-w-[var(--max-field-width)]", className), children: [
+      name && /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
         "input",
         {
           type: "hidden",
@@ -18652,7 +18696,7 @@ var AirbnbDatePicker = React72.forwardRef(
           value: resolvedValue ? formatDateInputValue(resolvedValue) : ""
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
         AirbnbFieldTrigger,
         {
           id: triggerId,
@@ -18678,10 +18722,10 @@ var AirbnbDatePicker = React72.forwardRef(
           onClick: handleTriggerClick,
           onKeyDown: handleTriggerKeyDown,
           onBlur,
-          trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(import_lucide_react54.Calendar, { className: "h-5 w-5 text-[#1F1F1B]", strokeWidth: 2 })
+          trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(import_lucide_react54.Calendar, { className: "h-5 w-5 text-[#1F1F1B]", strokeWidth: 2 })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime184.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
         AirbnbDatePickerContent,
         {
           baseId: pickerId,
@@ -18715,12 +18759,12 @@ var AirbnbDatePicker = React72.forwardRef(
 AirbnbDatePicker.displayName = "AirbnbDatePicker";
 
 // src/airbnb-fields/input/Input.tsx
-var React73 = __toESM(require("react"), 1);
+var React74 = __toESM(require("react"), 1);
 var import_lucide_react55 = require("lucide-react");
 var import_react_i18next43 = require("react-i18next");
-var import_jsx_runtime185 = require("react/jsx-runtime");
+var import_jsx_runtime186 = require("react/jsx-runtime");
 var getInputValue = (value) => value != null ? String(value) : "";
-var AirbnbInput = React73.forwardRef(
+var AirbnbInput = React74.forwardRef(
   ({
     label,
     topLabel,
@@ -18749,16 +18793,16 @@ var AirbnbInput = React73.forwardRef(
     ...props
   }, ref) => {
     const { t } = (0, import_react_i18next43.useTranslation)();
-    const generatedId = React73.useId();
-    const inputRef = React73.useRef(null);
+    const generatedId = React74.useId();
+    const inputRef = React74.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] = React73.useState(false);
-    const [isPasswordRevealed, setIsPasswordRevealed] = React73.useState(false);
-    const [currentValue, setCurrentValue] = React73.useState(
+    const [isFocused, setIsFocused] = React74.useState(false);
+    const [isPasswordRevealed, setIsPasswordRevealed] = React74.useState(false);
+    const [currentValue, setCurrentValue] = React74.useState(
       () => value != null ? getInputValue(value) : getInputValue(defaultValue)
     );
     const resolvedValue = value != null ? getInputValue(value) : currentValue;
@@ -18771,16 +18815,16 @@ var AirbnbInput = React73.forwardRef(
     const triggerError = error ?? invalid;
     const hasLabelMeta = Boolean(optional) || Boolean(tooltip);
     const isBlocked = Boolean(disabled) || Boolean(loading);
-    React73.useLayoutEffect(() => {
+    React74.useLayoutEffect(() => {
       const nextValue = value != null ? getInputValue(value) : getInputValue(inputRef.current?.value);
       setCurrentValue((prevValue) => prevValue === nextValue ? prevValue : nextValue);
     }, [value]);
-    React73.useEffect(() => {
+    React74.useEffect(() => {
       if (!isPasswordInput) {
         setIsPasswordRevealed(false);
       }
     }, [isPasswordInput]);
-    const setRefs = React73.useCallback(
+    const setRefs = React74.useCallback(
       (node) => {
         inputRef.current = node;
         if (node && value == null) {
@@ -18813,7 +18857,7 @@ var AirbnbInput = React73.forwardRef(
     const togglePasswordReveal = () => {
       setIsPasswordRevealed((isRevealed) => !isRevealed);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime185.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime185.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime186.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime186.jsxs)(
       AirbnbFieldTrigger,
       {
         as: "div",
@@ -18842,7 +18886,7 @@ var AirbnbInput = React73.forwardRef(
         forceLabelText: hasLabelMeta,
         hideErrorMessage: !renderErrorMessage,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+          /* @__PURE__ */ (0, import_jsx_runtime186.jsx)(
             "input",
             {
               ...props,
@@ -18872,7 +18916,7 @@ var AirbnbInput = React73.forwardRef(
               )
             }
           ),
-          shouldShowPasswordReveal && /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+          shouldShowPasswordReveal && /* @__PURE__ */ (0, import_jsx_runtime186.jsx)(
             "button",
             {
               type: "button",
@@ -18880,7 +18924,7 @@ var AirbnbInput = React73.forwardRef(
               disabled: isBlocked,
               className: "absolute bottom-0 right-0 flex h-6 w-6 items-center justify-center border-0 bg-transparent p-0 text-[#7A8399] hover:text-[#1F1F1B] hover:opacity-85 disabled:cursor-not-allowed disabled:opacity-50",
               "aria-label": isPasswordRevealed ? t("hide_password") : t("show_password"),
-              children: /* @__PURE__ */ (0, import_jsx_runtime185.jsx)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime186.jsx)(
                 import_lucide_react55.Eye,
                 {
                   size: 18,
@@ -18898,14 +18942,14 @@ var AirbnbInput = React73.forwardRef(
 AirbnbInput.displayName = "AirbnbInput";
 
 // src/airbnb-fields/phone-field/PhoneField.tsx
-var React79 = __toESM(require("react"), 1);
+var React80 = __toESM(require("react"), 1);
 var import_lucide_react57 = require("lucide-react");
 
 // src/airbnb-fields/select/Select.tsx
-var React78 = __toESM(require("react"), 1);
+var React79 = __toESM(require("react"), 1);
 
 // src/airbnb-fields/select/SelectDesktopMenu.tsx
-var import_jsx_runtime186 = require("react/jsx-runtime");
+var import_jsx_runtime187 = require("react/jsx-runtime");
 function AirbnbSelectDesktopMenu({
   id,
   options,
@@ -18924,7 +18968,7 @@ function AirbnbSelectDesktopMenu({
   noOptionsMessage
 }) {
   const emptyMessage = noOptionsMessage?.();
-  return /* @__PURE__ */ (0, import_jsx_runtime186.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime187.jsxs)(
     "div",
     {
       id,
@@ -18937,12 +18981,12 @@ function AirbnbSelectDesktopMenu({
       onKeyDown,
       className: cn("max-h-[280px] overflow-y-auto p-2 outline-none", menuClassName),
       children: [
-        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime186.jsx)("div", { className: "px-4 py-3 text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
+        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime187.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_runtime186.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime187.jsx)(
             "button",
             {
               id: getOptionId2(index),
@@ -18974,7 +19018,7 @@ function AirbnbSelectDesktopMenu({
 }
 
 // src/airbnb-fields/select/SelectDesktopContent.tsx
-var import_jsx_runtime187 = require("react/jsx-runtime");
+var import_jsx_runtime188 = require("react/jsx-runtime");
 function AirbnbSelectDesktopContent({
   isOpen,
   listboxId,
@@ -18995,14 +19039,14 @@ function AirbnbSelectDesktopContent({
   noOptionsMessage
 }) {
   if (!isOpen) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime187.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime188.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_runtime187.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime188.jsx)(
         AirbnbSelectDesktopMenu,
         {
           id: listboxId,
@@ -19100,7 +19144,7 @@ function getMobileOptionStyles(index, scrollTop) {
 }
 
 // src/airbnb-fields/select/SelectMobileWheel.tsx
-var import_jsx_runtime188 = require("react/jsx-runtime");
+var import_jsx_runtime189 = require("react/jsx-runtime");
 function AirbnbSelectMobileWheel({
   id,
   options,
@@ -19119,7 +19163,7 @@ function AirbnbSelectMobileWheel({
 }) {
   const spacerHeight2 = getWheelSpacerHeight();
   const emptyMessage = noOptionsMessage?.();
-  return /* @__PURE__ */ (0, import_jsx_runtime188.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime189.jsxs)(
     "div",
     {
       id,
@@ -19131,10 +19175,10 @@ function AirbnbSelectMobileWheel({
       onKeyDown,
       className: cn("relative overflow-hidden outline-none", menuClassName),
       children: [
-        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime188.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_runtime188.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_runtime188.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_runtime188.jsx)(
+        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime189.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_runtime189.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_runtime189.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_runtime189.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -19144,7 +19188,7 @@ function AirbnbSelectMobileWheel({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime188.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime189.jsxs)(
           "div",
           {
             ref: listRef,
@@ -19159,11 +19203,11 @@ function AirbnbSelectMobileWheel({
               WebkitOverflowScrolling: "touch"
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime188.jsx)("div", { style: { height: `${spacerHeight2}px` } }),
+              /* @__PURE__ */ (0, import_jsx_runtime189.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_runtime188.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(
                   "button",
                   {
                     id: getOptionId2(index),
@@ -19184,7 +19228,7 @@ function AirbnbSelectMobileWheel({
                   optionKey
                 );
               }),
-              /* @__PURE__ */ (0, import_jsx_runtime188.jsx)("div", { style: { height: `${spacerHeight2}px` } })
+              /* @__PURE__ */ (0, import_jsx_runtime189.jsx)("div", { style: { height: `${spacerHeight2}px` } })
             ]
           }
         )
@@ -19194,7 +19238,7 @@ function AirbnbSelectMobileWheel({
 }
 
 // src/airbnb-fields/select/SelectMobileContent.tsx
-var import_jsx_runtime189 = require("react/jsx-runtime");
+var import_jsx_runtime190 = require("react/jsx-runtime");
 function AirbnbSelectMobileContent({
   open,
   onOpenChange,
@@ -19218,11 +19262,11 @@ function AirbnbSelectMobileContent({
   getOptionId: getOptionId2,
   noOptionsMessage
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime189.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
-    /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(DrawerDescription, { className: "sr-only", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime189.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime190.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
+    /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime190.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(
         AirbnbSelectMobileWheel,
         {
           id: listboxId,
@@ -19241,16 +19285,16 @@ function AirbnbSelectMobileContent({
           noOptionsMessage
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime189.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
+      /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
     ] })
   ] }) });
 }
 
 // src/airbnb-fields/select/SelectTrigger.tsx
-var React74 = __toESM(require("react"), 1);
+var React75 = __toESM(require("react"), 1);
 var import_lucide_react56 = require("lucide-react");
-var import_jsx_runtime190 = require("react/jsx-runtime");
-var AirbnbSelectTrigger = React74.forwardRef(
+var import_jsx_runtime191 = require("react/jsx-runtime");
+var AirbnbSelectTrigger = React75.forwardRef(
   ({
     id,
     open,
@@ -19274,7 +19318,7 @@ var AirbnbSelectTrigger = React74.forwardRef(
     onKeyDown,
     onBlur
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(
       AirbnbFieldTrigger,
       {
         id,
@@ -19302,7 +19346,7 @@ var AirbnbSelectTrigger = React74.forwardRef(
         onClick,
         onKeyDown,
         onBlur,
-        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime190.jsx)(
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(
           import_lucide_react56.ChevronDown,
           {
             className: open ? "h-6 w-6 rotate-180 text-[#1F1F1B] transition-transform" : "h-6 w-6 text-[#1F1F1B] transition-transform"
@@ -19315,7 +19359,7 @@ var AirbnbSelectTrigger = React74.forwardRef(
 AirbnbSelectTrigger.displayName = "AirbnbSelectTrigger";
 
 // src/airbnb-fields/select/useDesktopSelect.ts
-var React75 = __toESM(require("react"), 1);
+var React76 = __toESM(require("react"), 1);
 function useDesktopSelect({
   isMobile: isMobile3,
   isOpen,
@@ -19324,12 +19368,12 @@ function useDesktopSelect({
   disabled,
   onChange
 }) {
-  const [highlightedIndex, setHighlightedIndex] = React75.useState(-1);
-  const triggerRef = React75.useRef(null);
-  const listRef = React75.useRef(null);
-  const optionRefs = React75.useRef([]);
+  const [highlightedIndex, setHighlightedIndex] = React76.useState(-1);
+  const triggerRef = React76.useRef(null);
+  const listRef = React76.useRef(null);
+  const optionRefs = React76.useRef([]);
   const selectedIndex = getOptionIndex2(options, value);
-  React75.useEffect(() => {
+  React76.useEffect(() => {
     if (!isOpen || isMobile3) return;
     setHighlightedIndex((currentIndex) => {
       if (currentIndex >= 0) {
@@ -19344,34 +19388,34 @@ function useDesktopSelect({
       window.cancelAnimationFrame(frameId);
     };
   }, [isMobile3, isOpen, options, selectedIndex]);
-  React75.useEffect(() => {
+  React76.useEffect(() => {
     if (!isOpen || isMobile3 || highlightedIndex < 0) return;
     optionRefs.current[highlightedIndex]?.scrollIntoView({
       block: "nearest"
     });
   }, [highlightedIndex, isMobile3, isOpen]);
-  React75.useEffect(() => {
+  React76.useEffect(() => {
     if (isOpen) return;
     setHighlightedIndex(-1);
   }, [isOpen]);
-  const focusTrigger = React75.useCallback(() => {
+  const focusTrigger = React76.useCallback(() => {
     triggerRef.current?.focus();
   }, []);
-  const handleSelect = React75.useCallback(
+  const handleSelect = React76.useCallback(
     (option) => {
       if (option.isDisabled || disabled) return;
       onChange?.(option);
     },
     [disabled, onChange]
   );
-  const openMenu = React75.useCallback(
+  const openMenu = React76.useCallback(
     (targetIndex) => {
       const fallbackIndex = selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex2(options);
       setHighlightedIndex(targetIndex ?? fallbackIndex);
     },
     [options, selectedIndex]
   );
-  const handleTriggerKeyDown = React75.useCallback(
+  const handleTriggerKeyDown = React76.useCallback(
     (event, onOpen) => {
       if (disabled) return;
       if (event.key === "ArrowDown") {
@@ -19396,7 +19440,7 @@ function useDesktopSelect({
     },
     [disabled, openMenu, options, selectedIndex]
   );
-  const handleMenuKeyDown = React75.useCallback(
+  const handleMenuKeyDown = React76.useCallback(
     (event, onClose) => {
       if (event.key === "Escape") {
         event.preventDefault();
@@ -19446,7 +19490,7 @@ function useDesktopSelect({
     },
     [focusTrigger, highlightedIndex, onChange, options]
   );
-  const setOptionRef = React75.useCallback(
+  const setOptionRef = React76.useCallback(
     (index, node) => {
       optionRefs.current[index] = node;
     },
@@ -19466,23 +19510,23 @@ function useDesktopSelect({
 }
 
 // src/airbnb-fields/select/useMobileSelectWheel.ts
-var React76 = __toESM(require("react"), 1);
+var React77 = __toESM(require("react"), 1);
 function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, disabled }) {
-  const [pendingValue, setPendingValue] = React76.useState(
+  const [pendingValue, setPendingValue] = React77.useState(
     value ?? null
   );
-  const [mobileScrollTop, setMobileScrollTop] = React76.useState(0);
-  const mobileListRef = React76.useRef(null);
-  const scrollSettleTimeoutRef = React76.useRef(null);
-  const scrollAnimationFrameRef = React76.useRef(null);
-  const getTargetIndex = React76.useCallback(
+  const [mobileScrollTop, setMobileScrollTop] = React77.useState(0);
+  const mobileListRef = React77.useRef(null);
+  const scrollSettleTimeoutRef = React77.useRef(null);
+  const scrollAnimationFrameRef = React77.useRef(null);
+  const getTargetIndex = React77.useCallback(
     (targetValue) => {
       const selectedIndex = getOptionIndex2(options, targetValue);
       return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex2(options);
     },
     [options]
   );
-  const syncScrollPosition = React76.useCallback(
+  const syncScrollPosition = React77.useCallback(
     (targetValue, behavior = "instant") => {
       const targetIndex = getTargetIndex(targetValue);
       if (targetIndex < 0) return;
@@ -19501,27 +19545,27 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     },
     [getTargetIndex, options]
   );
-  const clearScrollSettleTimeout = React76.useCallback(() => {
+  const clearScrollSettleTimeout = React77.useCallback(() => {
     if (scrollSettleTimeoutRef.current === null) return;
     window.clearTimeout(scrollSettleTimeoutRef.current);
     scrollSettleTimeoutRef.current = null;
   }, []);
-  const clearScrollAnimationFrame = React76.useCallback(() => {
+  const clearScrollAnimationFrame = React77.useCallback(() => {
     if (scrollAnimationFrameRef.current === null) return;
     window.cancelAnimationFrame(scrollAnimationFrameRef.current);
     scrollAnimationFrameRef.current = null;
   }, []);
-  React76.useEffect(
+  React77.useEffect(
     () => () => {
       clearScrollSettleTimeout();
       clearScrollAnimationFrame();
     },
     [clearScrollAnimationFrame, clearScrollSettleTimeout]
   );
-  React76.useEffect(() => {
+  React77.useEffect(() => {
     setPendingValue(value ?? null);
   }, [value]);
-  React76.useLayoutEffect(() => {
+  React77.useLayoutEffect(() => {
     if (!isMobile3 || !isOpen) return;
     const frameId = window.requestAnimationFrame(() => {
       syncScrollPosition(value ?? null, "instant");
@@ -19530,7 +19574,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
       window.cancelAnimationFrame(frameId);
     };
   }, [isMobile3, isOpen, syncScrollPosition, value]);
-  const settleScroll = React76.useCallback(() => {
+  const settleScroll = React77.useCallback(() => {
     if (!mobileListRef.current) return;
     const nextIndex = Math.round(mobileListRef.current.scrollTop / MOBILE_OPTION_HEIGHT);
     const nextOption = options[nextIndex];
@@ -19542,13 +19586,13 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     }
     setPendingValue(nextOption);
   }, [options, pendingValue]);
-  const scheduleScrollSettle = React76.useCallback(() => {
+  const scheduleScrollSettle = React77.useCallback(() => {
     clearScrollSettleTimeout();
     scrollSettleTimeoutRef.current = window.setTimeout(() => {
       settleScroll();
     }, MOBILE_SCROLL_SETTLE_DELAY);
   }, [clearScrollSettleTimeout, settleScroll]);
-  const handleScroll = React76.useCallback(() => {
+  const handleScroll = React77.useCallback(() => {
     if (!mobileListRef.current) return;
     const nextScrollTop = mobileListRef.current.scrollTop;
     clearScrollAnimationFrame();
@@ -19558,7 +19602,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     });
     scheduleScrollSettle();
   }, [clearScrollAnimationFrame, scheduleScrollSettle]);
-  const focusOptionByIndex = React76.useCallback(
+  const focusOptionByIndex = React77.useCallback(
     (index, behavior = "instant", updatePendingImmediately = behavior === "instant") => {
       if (!mobileListRef.current || index < 0 || index >= options.length) return;
       const option = options[index];
@@ -19576,7 +19620,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     },
     [options, scheduleScrollSettle]
   );
-  const handleOptionClick = React76.useCallback(
+  const handleOptionClick = React77.useCallback(
     (option) => {
       if (!mobileListRef.current || disabled || option.isDisabled) return;
       const optionIndex = getOptionIndex2(options, option);
@@ -19585,7 +19629,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     },
     [disabled, focusOptionByIndex, options]
   );
-  const moveByStep = React76.useCallback(
+  const moveByStep = React77.useCallback(
     (step) => {
       const currentIndex = getOptionIndex2(options, pendingValue);
       const fallbackIndex = step === 1 ? getFirstEnabledOptionIndex2(options) : getLastEnabledOptionIndex2(options);
@@ -19597,7 +19641,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     },
     [focusOptionByIndex, options, pendingValue]
   );
-  const moveToBoundary = React76.useCallback(
+  const moveToBoundary = React77.useCallback(
     (boundary) => {
       const targetIndex = boundary === "start" ? getFirstEnabledOptionIndex2(options) : getLastEnabledOptionIndex2(options);
       if (targetIndex >= 0) {
@@ -19606,7 +19650,7 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
     },
     [focusOptionByIndex, options]
   );
-  const syncPendingValue = React76.useCallback(
+  const syncPendingValue = React77.useCallback(
     (nextValue) => {
       const normalizedValue = nextValue ?? null;
       const matchedIndex = getOptionIndex2(options, normalizedValue);
@@ -19634,9 +19678,9 @@ function useMobileSelectWheel({ isMobile: isMobile3, isOpen, options, value, dis
 }
 
 // src/airbnb-fields/select/useSelectIds.ts
-var React77 = __toESM(require("react"), 1);
+var React78 = __toESM(require("react"), 1);
 function useSelectIds2({ name, hasValue, error, hideErrorMessage }) {
-  const reactId = React77.useId().replace(/:/g, "");
+  const reactId = React78.useId().replace(/:/g, "");
   const baseId = name ? `select-${name}` : `select-${reactId}`;
   const triggerId = `${baseId}-trigger`;
   const labelId = `${baseId}-label`;
@@ -19646,7 +19690,7 @@ function useSelectIds2({ 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 = React77.useCallback(
+  const getOptionId2 = React78.useCallback(
     (index) => `${baseId}-option-${index}`,
     [baseId]
   );
@@ -19664,8 +19708,8 @@ function useSelectIds2({ name, hasValue, error, hideErrorMessage }) {
 }
 
 // src/airbnb-fields/select/Select.tsx
-var import_jsx_runtime191 = require("react/jsx-runtime");
-var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
+var import_jsx_runtime192 = require("react/jsx-runtime");
+var AirbnbSelect = React79.forwardRef(function AirbnbSelect2({
   options = [],
   value,
   onChange,
@@ -19692,8 +19736,8 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
   filterOption
 }, ref) {
   const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
-  const [isOpen, setIsOpen] = React78.useState(false);
-  const containerRef = React78.useRef(null);
+  const [isOpen, setIsOpen] = React79.useState(false);
+  const containerRef = React79.useRef(null);
   const filteredOptions = filterOption ? options.filter(filterOption) : options;
   const hasValue = Boolean(value);
   const helperText = placeholder ?? label;
@@ -19755,12 +19799,12 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
     onOutsideClick: () => setIsOpen(false),
     isDisabled: !isOpen || isMobile3
   });
-  React78.useEffect(() => {
+  React79.useEffect(() => {
     if (isBlocked) {
       setIsOpen(false);
     }
   }, [isBlocked]);
-  React78.useEffect(
+  React79.useEffect(
     function setCorrectOptionIfThereIsOnlyValue() {
       if (value?.value === void 0 || value.value === null || value.label !== "") {
         return;
@@ -19772,7 +19816,7 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
     },
     [onChange, filteredOptions, value]
   );
-  const handleMobileOpenChange = React78.useCallback(
+  const handleMobileOpenChange = React79.useCallback(
     (nextOpen) => {
       if (isBlocked && nextOpen) return;
       setIsOpen(nextOpen);
@@ -19783,7 +19827,7 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
     },
     [focusTrigger, isBlocked, syncPendingValue, value]
   );
-  const handleMobileDone = React78.useCallback(() => {
+  const handleMobileDone = React79.useCallback(() => {
     if (isBlocked) return;
     const finalOption = pendingValue;
     if (finalOption && finalOption.value !== value?.value) {
@@ -19792,7 +19836,7 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
     setIsOpen(false);
     focusTrigger();
   }, [focusTrigger, isBlocked, onChange, pendingValue, value]);
-  const handleTriggerClick = React78.useCallback(() => {
+  const handleTriggerClick = React79.useCallback(() => {
     if (isBlocked) return;
     setIsOpen((prev) => {
       const nextOpen = !prev;
@@ -19845,13 +19889,13 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
       handleMobileOpenChange(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime191.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime192.jsxs)(
     "div",
     {
       ref: containerRef,
       className: cn("relative w-full max-w-[var(--max-field-width)]", className),
       children: [
-        name && /* @__PURE__ */ (0, import_jsx_runtime191.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
+        name && /* @__PURE__ */ (0, import_jsx_runtime192.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
         renderTrigger ? renderTrigger({
           id: triggerId,
           open: isOpen,
@@ -19872,7 +19916,7 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
           onClick: handleTriggerClick,
           onKeyDown: handleRootTriggerKeyDown,
           onBlur
-        }) : /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(
+        }) : /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
           AirbnbSelectTrigger,
           {
             id: triggerId,
@@ -19899,7 +19943,7 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
             onBlur
           }
         ),
-        isMobile3 ? /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(
+        isMobile3 ? /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
           AirbnbSelectMobileContent,
           {
             open: isOpen,
@@ -19924,7 +19968,7 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
             getOptionId: getOptionId2,
             noOptionsMessage
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime191.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
           AirbnbSelectDesktopContent,
           {
             isOpen,
@@ -19958,13 +20002,13 @@ var AirbnbSelect = React78.forwardRef(function AirbnbSelect2({
 });
 
 // src/airbnb-fields/phone-field/PhoneField.tsx
-var import_jsx_runtime192 = require("react/jsx-runtime");
+var import_jsx_runtime193 = require("react/jsx-runtime");
 function formatPhoneCodeOptionLabel2(option) {
   const label = String(option.label);
   const value = String(option.value);
   return label.includes(value) ? label : `${label} (${value})`;
 }
-var AirbnbPhoneField = React79.forwardRef(
+var AirbnbPhoneField = React80.forwardRef(
   ({
     label,
     topLabel,
@@ -19988,9 +20032,9 @@ var AirbnbPhoneField = React79.forwardRef(
     codePlaceholder = "+00",
     defaultCode
   }, ref) => {
-    const inputId = React79.useId();
+    const inputId = React80.useId();
     const effectiveCode = value?.code || defaultCode || "";
-    const codeOptions = React79.useMemo(
+    const codeOptions = React80.useMemo(
       () => options.map((option) => ({
         value: option.value,
         label: formatPhoneCodeOptionLabel2(option),
@@ -19998,7 +20042,7 @@ var AirbnbPhoneField = React79.forwardRef(
       })),
       [options]
     );
-    const selectedCodeOption = React79.useMemo(
+    const selectedCodeOption = React80.useMemo(
       () => codeOptions.find((option) => option.value === effectiveCode) ?? null,
       [codeOptions, effectiveCode]
     );
@@ -20006,9 +20050,9 @@ var AirbnbPhoneField = React79.forwardRef(
     const hasInvalidState = Boolean(error) || Boolean(invalid);
     const isBlocked = Boolean(disabled) || Boolean(loading);
     const isCodeBlocked = isBlocked || Boolean(codeReadOnly);
-    return /* @__PURE__ */ (0, import_jsx_runtime192.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
-      name && /* @__PURE__ */ (0, import_jsx_runtime192.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
-      codeName && /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
+      name && /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
+      codeName && /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
         "input",
         {
           type: "hidden",
@@ -20017,7 +20061,7 @@ var AirbnbPhoneField = React79.forwardRef(
           disabled
         }
       ),
-      numberName && /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
+      numberName && /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
         "input",
         {
           type: "hidden",
@@ -20026,7 +20070,7 @@ var AirbnbPhoneField = React79.forwardRef(
           disabled
         }
       ),
-      topLabel && /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
+      topLabel && /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
         "label",
         {
           htmlFor: inputId,
@@ -20034,8 +20078,8 @@ var AirbnbPhoneField = React79.forwardRef(
           children: topLabel
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime192.jsxs)("div", { className: "flex items-stretch", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)("div", { className: "flex items-stretch", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
           AirbnbSelect,
           {
             ref,
@@ -20064,7 +20108,7 @@ var AirbnbPhoneField = React79.forwardRef(
               onClick,
               onKeyDown,
               valueLabel
-            }) => /* @__PURE__ */ (0, import_jsx_runtime192.jsxs)(
+            }) => /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)(
               "button",
               {
                 id,
@@ -20085,8 +20129,8 @@ var AirbnbPhoneField = React79.forwardRef(
                   triggerDisabled ? "cursor-not-allowed opacity-50" : triggerLoading ? "cursor-progress" : "cursor-pointer"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime192.jsx)("span", { children: valueLabel ?? codePlaceholder }),
-                  /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
+                  /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("span", { children: valueLabel ?? codePlaceholder }),
+                  /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
                     import_lucide_react57.ChevronDown,
                     {
                       className: cn("h-5 w-5 transition-transform", open ? "rotate-180" : ""),
@@ -20098,7 +20142,7 @@ var AirbnbPhoneField = React79.forwardRef(
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
           AirbnbInput,
           {
             id: inputId,
@@ -20127,18 +20171,18 @@ var AirbnbPhoneField = React79.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime192.jsx)(FieldErrorMessage, { message: error })
+      error && /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(FieldErrorMessage, { message: error })
     ] });
   }
 );
 AirbnbPhoneField.displayName = "AirbnbPhoneField";
 
 // src/airbnb-fields/searchable-select/SearchableSelect.tsx
-var React80 = __toESM(require("react"), 1);
+var React81 = __toESM(require("react"), 1);
 var import_lucide_react58 = require("lucide-react");
 var import_react_virtual3 = require("@tanstack/react-virtual");
 var import_react90 = require("react");
-var import_jsx_runtime193 = require("react/jsx-runtime");
+var import_jsx_runtime194 = require("react/jsx-runtime");
 var ROW_HEIGHT = 48;
 var DESKTOP_LIST_HEIGHT = 280;
 var MOBILE_LIST_HEIGHT = 420;
@@ -20178,13 +20222,13 @@ var AirbnbSearchableSelectInternal = ({
   loadingMessage
 }, ref) => {
   const { isMatch: isMobile3 } = useScreenResize(DEVICE.mobileXL);
-  const reactId = React80.useId();
-  const [open, setOpen] = React80.useState(false);
-  const [internalSearchValue, setInternalSearchValue] = React80.useState("");
-  const [highlightedIndex, setHighlightedIndex] = React80.useState(-1);
-  const containerRef = React80.useRef(null);
-  const triggerRef = React80.useRef(null);
-  const inputRef = React80.useRef(null);
+  const reactId = React81.useId();
+  const [open, setOpen] = React81.useState(false);
+  const [internalSearchValue, setInternalSearchValue] = React81.useState("");
+  const [highlightedIndex, setHighlightedIndex] = React81.useState(-1);
+  const containerRef = React81.useRef(null);
+  const triggerRef = React81.useRef(null);
+  const inputRef = React81.useRef(null);
   const listboxId = `${reactId}-listbox`;
   const labelId = `${reactId}-label`;
   const valueId = `${reactId}-value`;
@@ -20193,13 +20237,13 @@ var AirbnbSearchableSelectInternal = ({
   const searchInputId = `${reactId}-search`;
   const effectiveSearchValue = searchValue ?? internalSearchValue;
   const shouldFilterLocally = !onSearchChange && filterOption !== null;
-  const visibleOptions = React80.useMemo(() => {
+  const visibleOptions = React81.useMemo(() => {
     if (!shouldFilterLocally || !effectiveSearchValue) {
       return options;
     }
     return options.filter((option) => filterOption(option, effectiveSearchValue));
   }, [effectiveSearchValue, filterOption, options, shouldFilterLocally]);
-  const selectedIndex = React80.useMemo(
+  const selectedIndex = React81.useMemo(
     () => visibleOptions.findIndex((option) => option.value === value?.value),
     [value?.value, visibleOptions]
   );
@@ -20225,7 +20269,7 @@ var AirbnbSearchableSelectInternal = ({
     },
     [handleOnOpenChange]
   );
-  React80.useEffect(() => {
+  React81.useEffect(() => {
     if (isBlocked) {
       setSelectOpen(false);
       return;
@@ -20238,7 +20282,7 @@ var AirbnbSearchableSelectInternal = ({
       window.cancelAnimationFrame(frameId);
     };
   }, [isBlocked, open, setSelectOpen]);
-  React80.useEffect(() => {
+  React81.useEffect(() => {
     if (!open) {
       setHighlightedIndex(-1);
       return;
@@ -20306,7 +20350,7 @@ var AirbnbSearchableSelectInternal = ({
       }
     }
   }
-  const content = /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
     AirbnbSearchableSelectContent,
     {
       inputId: searchInputId,
@@ -20333,10 +20377,10 @@ var AirbnbSearchableSelectInternal = ({
       onOptionHover: setHighlightedIndex
     }
   );
-  React80.useImperativeHandle(ref, () => triggerRef.current, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
-    name && /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+  React81.useImperativeHandle(ref, () => triggerRef.current, []);
+  return /* @__PURE__ */ (0, import_jsx_runtime194.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
+    name && /* @__PURE__ */ (0, import_jsx_runtime194.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
+    /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
       AirbnbFieldTrigger,
       {
         id: `${reactId}-trigger`,
@@ -20370,7 +20414,7 @@ var AirbnbSearchableSelectInternal = ({
         },
         onKeyDown: handleTriggerKeyDown,
         onBlur,
-        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
           import_lucide_react58.ChevronDown,
           {
             className: cn(
@@ -20381,7 +20425,7 @@ var AirbnbSearchableSelectInternal = ({
         )
       }
     ),
-    isMobile3 ? /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+    isMobile3 ? /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
       Drawer,
       {
         open,
@@ -20393,13 +20437,13 @@ var AirbnbSearchableSelectInternal = ({
           }
           closeSelect();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
-          /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(DrawerDescription, { className: "sr-only", children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
+        children: /* @__PURE__ */ (0, import_jsx_runtime194.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
+          /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime194.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
         ] })
       }
-    ) : open ? /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+    ) : open ? /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
       "div",
       {
         className: cn(
@@ -20411,7 +20455,7 @@ var AirbnbSearchableSelectInternal = ({
     ) : null
   ] });
 };
-var AirbnbSearchableSelect = React80.forwardRef(
+var AirbnbSearchableSelect = React81.forwardRef(
   AirbnbSearchableSelectInternal
 );
 function AirbnbSearchableSelectContent({
@@ -20438,9 +20482,9 @@ function AirbnbSearchableSelectContent({
   onOptionClick,
   onOptionHover
 }) {
-  const listRef = React80.useRef(null);
-  const lastLoadMoreOptionsLengthRef = React80.useRef(null);
-  const previousHighlightedIndexRef = React80.useRef(highlightedIndex);
+  const listRef = React81.useRef(null);
+  const lastLoadMoreOptionsLengthRef = React81.useRef(null);
+  const previousHighlightedIndexRef = React81.useRef(highlightedIndex);
   const rowCount = options.length + (loading && options.length > 0 ? 1 : 0);
   const virtualizer = (0, import_react_virtual3.useVirtualizer)({
     count: rowCount,
@@ -20451,7 +20495,7 @@ function AirbnbSearchableSelectContent({
   const virtualItems = virtualizer.getVirtualItems();
   const emptyMessage = noOptionsMessage?.() ?? "No matches found";
   const loadingText = loadingMessage?.() ?? "Loading...";
-  React80.useEffect(() => {
+  React81.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) {
@@ -20459,23 +20503,23 @@ function AirbnbSearchableSelectContent({
       onLoadMore?.();
     }
   }, [hasNextPage, loading, onLoadMore, options.length, virtualItems]);
-  React80.useEffect(() => {
+  React81.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_runtime193.jsxs)("div", { className: "p-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime193.jsxs)("div", { className: "relative mb-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime194.jsxs)("div", { className: "p-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime194.jsxs)("div", { className: "relative mb-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
         import_lucide_react58.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_runtime193.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
         "input",
         {
           id: inputId,
@@ -20494,7 +20538,7 @@ function AirbnbSearchableSelectContent({
         }
       )
     ] }),
-    loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+    loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime194.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime194.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
       "div",
       {
         id: listboxId,
@@ -20503,7 +20547,7 @@ function AirbnbSearchableSelectContent({
         "aria-labelledby": labelId,
         className: cn("overflow-y-auto outline-none", menuClassName),
         style: { height: Math.min(height, rowCount * ROW_HEIGHT) },
-        children: /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
           "div",
           {
             className: "relative w-full",
@@ -20511,7 +20555,7 @@ function AirbnbSearchableSelectContent({
             children: virtualItems.map((virtualItem) => {
               const option = options[virtualItem.index];
               if (!option) {
-                return /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
                   "div",
                   {
                     className: "absolute left-0 top-0 flex w-full items-center px-4 text-base leading-6 text-[#6C6C6C]",
@@ -20526,7 +20570,7 @@ function AirbnbSearchableSelectContent({
               }
               const isSelected = value?.value === option.value;
               const isHighlighted = virtualItem.index === highlightedIndex;
-              return /* @__PURE__ */ (0, import_jsx_runtime193.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
                 "button",
                 {
                   id: getOptionId(idPrefix, virtualItem.index),
@@ -20548,7 +20592,7 @@ function AirbnbSearchableSelectContent({
                     height: `${virtualItem.size}px`,
                     transform: `translateY(${virtualItem.start}px)`
                   },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime193.jsx)("span", { className: "truncate text-center", children: String(option.label) })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime194.jsx)("span", { className: "truncate text-center", children: String(option.label) })
                 },
                 `${String(option.value)}-${virtualItem.index}`
               );
@@ -20577,16 +20621,16 @@ function getNextEnabledIndex(options, startIndex, step) {
 }
 
 // src/airbnb-fields/search-input/SearchInput.tsx
-var React81 = __toESM(require("react"), 1);
+var React82 = __toESM(require("react"), 1);
 var import_react_i18next44 = require("react-i18next");
 var import_lucide_react59 = require("lucide-react");
-var import_jsx_runtime194 = require("react/jsx-runtime");
-var AirbnbSearchInput = React81.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
+var import_jsx_runtime195 = require("react/jsx-runtime");
+var AirbnbSearchInput = React82.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
   const { t } = (0, import_react_i18next44.useTranslation)();
   const placeholderText = placeholder || t("search_property") + "...";
-  return /* @__PURE__ */ (0, import_jsx_runtime194.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(import_lucide_react59.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
-    /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime195.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(import_lucide_react59.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
+    /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(
       "input",
       {
         ...props,
@@ -20605,13 +20649,13 @@ var AirbnbSearchInput = React81.forwardRef(({ onReset, placeholder, wrapperClass
         )
       }
     ),
-    onReset && /* @__PURE__ */ (0, import_jsx_runtime194.jsx)(
+    onReset && /* @__PURE__ */ (0, import_jsx_runtime195.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_runtime194.jsx)(import_lucide_react59.X, { className: "h-5 w-5" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(import_lucide_react59.X, { className: "h-5 w-5" })
       }
     )
   ] });
@@ -20619,11 +20663,11 @@ var AirbnbSearchInput = React81.forwardRef(({ onReset, placeholder, wrapperClass
 AirbnbSearchInput.displayName = "AirbnbSearchInput";
 
 // src/airbnb-fields/switch/Switch.tsx
-var React82 = __toESM(require("react"), 1);
+var React83 = __toESM(require("react"), 1);
 var SwitchPrimitives2 = __toESM(require("@radix-ui/react-switch"), 1);
 var import_lucide_react60 = require("lucide-react");
-var import_jsx_runtime195 = require("react/jsx-runtime");
-var AirbnbSwitch = React82.forwardRef(
+var import_jsx_runtime196 = require("react/jsx-runtime");
+var AirbnbSwitch = React83.forwardRef(
   ({
     className,
     value,
@@ -20637,9 +20681,9 @@ var AirbnbSwitch = React82.forwardRef(
     wrapperClassName,
     ...props
   }, ref) => {
-    const generatedId = React82.useId();
+    const generatedId = React83.useId();
     const fieldId = id || generatedId;
-    const switchElement = /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(
+    const switchElement = /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(
       SwitchPrimitives2.Root,
       {
         ref,
@@ -20659,14 +20703,14 @@ var AirbnbSwitch = React82.forwardRef(
         "aria-busy": loading,
         "aria-readonly": readOnly,
         ...props,
-        children: /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(
           SwitchPrimitives2.Thumb,
           {
             className: cn(
               "flex h-[20px] w-[20px] items-center justify-center rounded-full bg-white shadow-[0_1px_3px_rgba(0,0,0,0.22)] transition-transform duration-200",
               "data-[state=checked]:translate-x-[12px] data-[state=unchecked]:translate-x-0"
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(
+            children: /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(
               import_lucide_react60.Check,
               {
                 "aria-hidden": "true",
@@ -20681,10 +20725,10 @@ var AirbnbSwitch = React82.forwardRef(
     if (!label && !error) {
       return switchElement;
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime195.jsxs)(import_jsx_runtime195.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime195.jsxs)("div", { className: cn("flex items-center gap-x-3 gap-y-1.5", wrapperClassName), children: [
+    return /* @__PURE__ */ (0, import_jsx_runtime196.jsxs)(import_jsx_runtime196.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime196.jsxs)("div", { className: cn("flex items-center gap-x-3 gap-y-1.5", wrapperClassName), children: [
         switchElement,
-        label && /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(
+        label && /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(
           Label,
           {
             htmlFor: fieldId,
@@ -20696,7 +20740,7 @@ var AirbnbSwitch = React82.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime195.jsx)(ErrorMessage, { disabled, children: error })
+      error && /* @__PURE__ */ (0, import_jsx_runtime196.jsx)(ErrorMessage, { disabled, children: error })
     ] });
   }
 );
@@ -20764,6 +20808,7 @@ AirbnbSwitch.displayName = "AirbnbSwitch";
   CommingSoonBadge,
   ConfirmationDialog,
   CopyIcon,
+  CopyInput,
   CopyLinkButton,
   CopyString,
   Counter,