@chekinapp/ui 0.0.45 → 0.0.47

package/dist/index.cjs

@@ -160,7 +160,6 @@ __export(index_exports, {
   LargeModal: () => LargeModal,
   LearnMoreButton: () => LearnMoreButton,
   Link: () => Link,
-  Loader: () => Loader,
   LoadingBar: () => LoadingBar,
   METRIC_CARD_VARIANTS: () => METRIC_CARD_VARIANTS,
   MetricCard: () => MetricCard,
@@ -6081,42 +6080,9 @@ function ImageFullScreenView({ src, alt, onClose }) {
   ] });
 }
 
-// src/loader/Loader.tsx
+// src/metric-card/MetricCard.tsx
 var import_lucide_react22 = require("lucide-react");
-var import_react_i18next15 = require("react-i18next");
 var import_jsx_runtime74 = require("react/jsx-runtime");
-function Loader({
-  size = "md",
-  text,
-  className = "",
-  showText = true,
-  variant = "primary"
-}) {
-  const { t } = (0, import_react_i18next15.useTranslation)();
-  const sizeClasses3 = {
-    sm: "h-4 w-4",
-    md: "h-8 w-8",
-    lg: "h-12 w-12"
-  };
-  const textSizeClasses = {
-    sm: "text-xs",
-    md: "text-sm",
-    lg: "text-base"
-  };
-  const variantClasses = {
-    primary: "text-[#4f46e5]",
-    secondary: "text-[#475569]",
-    ghost: "text-[#94a3b8]"
-  };
-  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: cn("flex flex-col items-center justify-center gap-2", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: cn("animate-spin", sizeClasses3[size], variantClasses[variant]), children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.Loader2, { className: "h-full w-full" }) }),
-    showText && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("p", { className: cn(textSizeClasses[size], "font-medium text-[#475569]"), children: text || t("loading") })
-  ] });
-}
-
-// src/metric-card/MetricCard.tsx
-var import_lucide_react23 = require("lucide-react");
-var import_jsx_runtime75 = require("react/jsx-runtime");
 var metricCardVariantClasses = {
   blue: "bg-[linear-gradient(122deg,#e6f0ff_36.37%,#f6f9ff_86.4%)] text-[#385cf8] [&_[data-slot=metric-card-icon]]:bg-[#dbeafe]",
   green: "bg-[linear-gradient(122deg,#ddfbf4_36.37%,#f5fefc_86.4%)] text-[#2bc29f] [&_[data-slot=metric-card-icon]]:bg-[#cff9ef]",
@@ -6134,7 +6100,7 @@ function MetricCard({
   loading = false,
   className
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
     "div",
     {
       className: cn(
@@ -6144,7 +6110,7 @@ function MetricCard({
         className
       ),
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
           "div",
           {
             "data-slot": "metric-card-icon",
@@ -6152,22 +6118,22 @@ function MetricCard({
             children: icon
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "flex flex-1 flex-col gap-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "flex items-center gap-1", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("h4", { className: "whitespace-nowrap text-base font-medium leading-6 text-[var(--chekin-color-brand-navy)]", children: title }),
-            tooltip && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Tooltip, { side: "right", content: tooltip, contentClassName: "max-w-64", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex flex-1 flex-col gap-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center gap-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("h4", { className: "whitespace-nowrap text-base font-medium leading-6 text-[var(--chekin-color-brand-navy)]", children: title }),
+            tooltip && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(Tooltip, { side: "right", content: tooltip, contentClassName: "max-w-64", children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
               "button",
               {
                 type: "button",
                 className: "inline-flex text-[var(--chekin-color-gray-1)]",
                 "aria-label": tooltip,
-                children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_lucide_react23.CircleQuestionMark, { className: "h-4 w-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.CircleQuestionMark, { className: "h-4 w-4" })
               }
             ) })
           ] }),
-          /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "text-2xl font-bold leading-6", children: value }),
-            !!percentage && /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
+          /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime74.jsx)("div", { className: "text-2xl font-bold leading-6", children: value }),
+            !!percentage && /* @__PURE__ */ (0, import_jsx_runtime74.jsxs)(
               "div",
               {
                 className: cn(
@@ -6175,7 +6141,7 @@ function MetricCard({
                   percentage < 0 && "text-[var(--chekin-color-brand-red)]"
                 ),
                 children: [
-                  percentage < 0 ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_lucide_react23.TrendingDown, {}) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_lucide_react23.TrendingUp, {}),
+                  percentage < 0 ? /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.TrendingDown, {}) : /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react22.TrendingUp, {}),
                   percentage,
                   "%"
                 ]
@@ -6199,8 +6165,8 @@ var METRIC_CARD_VARIANTS = {
 
 // src/modal/Modal.tsx
 var import_react47 = require("react");
-var import_lucide_react24 = require("lucide-react");
-var import_jsx_runtime76 = require("react/jsx-runtime");
+var import_lucide_react23 = require("lucide-react");
+var import_jsx_runtime75 = require("react/jsx-runtime");
 var preventDefault = (event) => {
   event.preventDefault();
 };
@@ -6232,7 +6198,7 @@ function Modal({
     onOpenChange?.(false);
     onClose?.();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(Dialog, { open, onOpenChange, modal, children: /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(Dialog, { open, onOpenChange, modal, children: /* @__PURE__ */ (0, import_jsx_runtime75.jsxs)(
     DialogContent,
     {
       ref: contentRef,
@@ -6251,7 +6217,7 @@ function Modal({
       lockScroll,
       ...!text && { "aria-describedby": void 0 },
       children: [
-        withCloseButton && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+        withCloseButton && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
           "button",
           {
             type: "button",
@@ -6261,14 +6227,14 @@ function Modal({
               "absolute right-4 top-4 z-10 rounded-full p-1 text-[var(--chekin-color-brand-blue)] hover:bg-[#f4f6f8]"
             ),
             "aria-label": "Close",
-            children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(import_lucide_react24.X, { className: "h-5 w-5" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(import_lucide_react23.X, { className: "h-5 w-5" })
           }
         ),
-        (iconSrc || iconProps?.src) && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "modal__icon mx-auto mt-4 select-none", children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("img", { src: iconSrc, alt: iconAlt ?? "", ...iconProps }) }),
-        title ? /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DialogTitle, { className: cn("modal__title", "px-6 text-lg font-bold"), children: title }) : /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DialogVisuallyHidden, { children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DialogTitle, { children: "Dialog" }) }),
-        text && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(DialogDescription, { className: cn("modal__text", "text-base"), children: text }),
+        (iconSrc || iconProps?.src) && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("div", { className: "modal__icon mx-auto mt-4 select-none", children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)("img", { src: iconSrc, alt: iconAlt ?? "", ...iconProps }) }),
+        title ? /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogTitle, { className: cn("modal__title", "px-6 text-lg font-bold"), children: title }) : /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogVisuallyHidden, { children: /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogTitle, { children: "Dialog" }) }),
+        text && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(DialogDescription, { className: cn("modal__text", "text-base"), children: text }),
         children,
-        buttons && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+        buttons && /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
           "div",
           {
             className: cn(
@@ -6283,7 +6249,7 @@ function Modal({
   ) });
 }
 var ModalButton = (0, import_react47.forwardRef)(
-  ({ children, size, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+  ({ children, size, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime75.jsx)(
     Button,
     {
       ref,
@@ -6298,9 +6264,108 @@ ModalButton.displayName = "ModalButton";
 Modal.displayName = "Modal";
 
 // src/modal-loader/ModalLoader.tsx
-var import_react48 = require("react");
+var import_react49 = require("react");
+
+// src/circular-loader/CircularLoader.tsx
+var import_react48 = __toESM(require("react"), 1);
+var import_jsx_runtime76 = require("react/jsx-runtime");
+var CircularLoader = import_react48.default.memo(
+  ({ visible = true, height, width, position, label, className }) => {
+    if (!visible) return null;
+    return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+      "div",
+      {
+        className: cn(
+          "main-loader flex flex-col items-center justify-center gap-2",
+          position === "center" && "h-full",
+          className
+        ),
+        role: "progressbar",
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+            "svg",
+            {
+              viewBox: "25 25 50 50",
+              className: "main-loader__svg text-[var(--circular-loader-color)]",
+              style: {
+                width: toCssSize(width),
+                height: toCssSize(height)
+              },
+              children: [
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+                  "circle",
+                  {
+                    r: "20",
+                    cy: "50",
+                    cx: "50",
+                    className: "cover fill-none stroke-current opacity-5",
+                    strokeWidth: "7"
+                  }
+                ),
+                /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+                  "circle",
+                  {
+                    r: "20",
+                    cy: "50",
+                    cx: "50",
+                    className: "circle fill-none stroke-current",
+                    strokeDasharray: "1 200",
+                    strokeDashoffset: "0",
+                    strokeLinecap: "round",
+                    strokeWidth: "7",
+                    children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+                        "animateTransform",
+                        {
+                          attributeName: "transform",
+                          dur: "2.25s",
+                          from: "0 50 50",
+                          repeatCount: "indefinite",
+                          to: "360 50 50",
+                          type: "rotate"
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+                        "animate",
+                        {
+                          attributeName: "stroke-dasharray",
+                          calcMode: "spline",
+                          dur: "1.8s",
+                          keyTimes: "0;0.5;1",
+                          keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
+                          repeatCount: "indefinite",
+                          values: "1 200;90 200;90 200"
+                        }
+                      ),
+                      /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+                        "animate",
+                        {
+                          attributeName: "stroke-dashoffset",
+                          calcMode: "spline",
+                          dur: "1.8s",
+                          keyTimes: "0;0.5;1",
+                          keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
+                          repeatCount: "indefinite",
+                          values: "0;-35;-125"
+                        }
+                      )
+                    ]
+                  }
+                )
+              ]
+            }
+          ),
+          label && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)("div", { className: "text-sm font-medium text-chekin-gray-1", children: label })
+        ]
+      }
+    );
+  }
+);
+CircularLoader.displayName = "CircularLoader";
+
+// src/modal-loader/ModalLoader.tsx
 var import_jsx_runtime77 = require("react/jsx-runtime");
-var ModalLoader = (0, import_react48.memo)(({ visible, className }) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+var ModalLoader = (0, import_react49.memo)(({ visible, className }) => /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
   "div",
   {
     className: cn(
@@ -6308,23 +6373,29 @@ var ModalLoader = (0, import_react48.memo)(({ visible, className }) => /* @__PUR
       visible ? "flex" : "hidden",
       className
     ),
-    children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "mb-[60px]", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(Loader, { size: "lg", showText: false, variant: "secondary" }) })
+    children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)("div", { className: "mb-[60px]", children: /* @__PURE__ */ (0, import_jsx_runtime77.jsx)(
+      CircularLoader,
+      {
+        width: 48,
+        height: 48,
+        className: "[--circular-loader-color:#475569]"
+      }
+    ) })
   }
 ));
 ModalLoader.displayName = "ModalLoader";
 
 // src/overlay-loader/OverlayLoader.tsx
+var import_react_i18next15 = require("react-i18next");
 var import_jsx_runtime78 = require("react/jsx-runtime");
 function OverlayLoader({
   isLoading,
   children,
-  loaderSize = "md",
-  loaderText,
-  showText = true,
-  loaderVariant = "primary",
+  label,
   className = "",
   overlayClassName = ""
 }) {
+  const { t } = (0, import_react_i18next15.useTranslation)();
   return /* @__PURE__ */ (0, import_jsx_runtime78.jsxs)("div", { className: cn("relative", className), children: [
     children,
     isLoading && /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
@@ -6334,15 +6405,7 @@ function OverlayLoader({
           "absolute inset-0 flex items-center justify-center bg-[rgb(255_255_255_/_0.6)]",
           overlayClassName
         ),
-        children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
-          Loader,
-          {
-            size: loaderSize,
-            text: loaderText,
-            showText,
-            variant: loaderVariant
-          }
-        )
+        children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(CircularLoader, { width: 48, height: 48, label: label || t("loading") })
       }
     )
   ] });
@@ -6351,14 +6414,14 @@ function OverlayLoader({
 // src/page-loader/PageLoader.tsx
 var import_react_i18next16 = require("react-i18next");
 var import_jsx_runtime79 = require("react/jsx-runtime");
-function PageLoader({ className, description, ...props }) {
+function PageLoader({ className, description, label }) {
   const { t } = (0, import_react_i18next16.useTranslation)();
   return /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
     "div",
     {
       className: cn("flex min-h-[300px] flex-col items-center justify-center", className),
       children: /* @__PURE__ */ (0, import_jsx_runtime79.jsxs)("div", { className: "flex flex-col items-center rounded-lg border border-[var(--chekin-color-gray-3)] bg-[rgb(255_255_255_/_0.8)] p-8 shadow-sm backdrop-blur-sm", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(Loader, { size: "lg", ...props, variant: "primary" }),
+        /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(CircularLoader, { width: 48, height: 48, label: label || t("loading") }),
         /* @__PURE__ */ (0, import_jsx_runtime79.jsx)("p", { className: "mt-4 max-w-xs text-center text-sm text-[var(--chekin-color-gray-1)]", children: description || t("loading_data_description") })
       ] })
     }
@@ -6367,15 +6430,15 @@ function PageLoader({ className, description, ...props }) {
 
 // src/pagination/Pagination.tsx
 var import_react_i18next17 = require("react-i18next");
-var import_lucide_react27 = require("lucide-react");
+var import_lucide_react26 = require("lucide-react");
 
 // src/select/Select.tsx
-var import_react49 = require("react");
+var import_react50 = require("react");
 
 // src/select/components.tsx
-var React21 = __toESM(require("react"), 1);
+var React22 = __toESM(require("react"), 1);
 var SelectPrimitive = __toESM(require("@radix-ui/react-select"), 1);
-var import_lucide_react25 = require("lucide-react");
+var import_lucide_react24 = require("lucide-react");
 var import_jsx_runtime80 = require("react/jsx-runtime");
 var SelectRoot = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
@@ -6385,7 +6448,7 @@ var selectSizeClassNames = {
   sm: "text-sm",
   md: "text-base"
 };
-var SelectTrigger = React21.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+var SelectTrigger = React22.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -6401,7 +6464,7 @@ var SelectTrigger = React21.forwardRef(({ className, children, size = "sm", ...p
     children: [
       children,
       /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.Icon, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
-        import_lucide_react25.ChevronDownIcon,
+        import_lucide_react24.ChevronDownIcon,
         {
           size: 16,
           strokeWidth: 2,
@@ -6412,27 +6475,27 @@ var SelectTrigger = React21.forwardRef(({ className, children, size = "sm", ...p
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+var SelectScrollUpButton = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
     className: cn("flex cursor-default items-center justify-center py-1", className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react25.ChevronUpIcon, { size: 16, strokeWidth: 2 })
+    children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react24.ChevronUpIcon, { size: 16, strokeWidth: 2 })
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+var SelectScrollDownButton = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
     className: cn("flex cursor-default items-center justify-center py-1", className),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react25.ChevronDownIcon, { size: 16, strokeWidth: 2 })
+    children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react24.ChevronDownIcon, { size: 16, strokeWidth: 2 })
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React21.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+var SelectContent = React22.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
   SelectPrimitive.Content,
   {
     ref,
@@ -6466,7 +6529,7 @@ var SelectContent = React21.forwardRef(({ className, children, position = "poppe
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+var SelectLabel = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
   SelectPrimitive.Label,
   {
     ref,
@@ -6478,7 +6541,7 @@ var SelectLabel = React21.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React21.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
+var SelectItem = React22.forwardRef(({ className, children, size = "sm", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsxs)(
   SelectPrimitive.Item,
   {
     ref,
@@ -6492,13 +6555,13 @@ var SelectItem = React21.forwardRef(({ className, children, size = "sm", ...prop
     ),
     ...props,
     children: [
-      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react25.CheckIcon, { size: 16, strokeWidth: 2 }) }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime80.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(import_lucide_react24.CheckIcon, { size: 16, strokeWidth: 2 }) }) }),
       /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(SelectPrimitive.ItemText, { children })
     ]
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
+var SelectSeparator = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime80.jsx)(
   SelectPrimitive.Separator,
   {
     ref,
@@ -6526,8 +6589,8 @@ var SelectInner = ({
   onValueChange,
   disabled
 }, ref) => {
-  const id = (0, import_react49.useId)();
-  const [isOpen, setIsOpen] = (0, import_react49.useState)(false);
+  const id = (0, import_react50.useId)();
+  const [isOpen, setIsOpen] = (0, import_react50.useState)(false);
   const hasValue = Boolean(value);
   const showLabel = hasValue || isOpen;
   const handleValueChange = (newValue) => {
@@ -6574,14 +6637,14 @@ var SelectInner = ({
     ] })
   ] });
 };
-var SelectForward = (0, import_react49.forwardRef)(SelectInner);
+var SelectForward = (0, import_react50.forwardRef)(SelectInner);
 SelectForward.displayName = "Select";
 var Select = SelectForward;
 
 // src/select/MultiSelect.tsx
 var SelectPrimitive2 = __toESM(require("@radix-ui/react-select"), 1);
-var import_lucide_react26 = require("lucide-react");
-var import_react50 = require("react");
+var import_lucide_react25 = require("lucide-react");
+var import_react51 = require("react");
 var import_jsx_runtime82 = require("react/jsx-runtime");
 var MultiSelectInner = ({
   label,
@@ -6592,8 +6655,8 @@ var MultiSelectInner = ({
   placeholder,
   disabled
 }, ref) => {
-  const id = (0, import_react50.useId)();
-  const [open, setOpen] = (0, import_react50.useState)(false);
+  const id = (0, import_react51.useId)();
+  const [open, setOpen] = (0, import_react51.useState)(false);
   const hasValue = value.length > 0;
   const showLabel = hasValue || open;
   const handleSelect = (selectedValue) => {
@@ -6645,7 +6708,7 @@ var MultiSelectInner = ({
                   selected && "bg-[#f9fafb]"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: selected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_lucide_react26.CheckIcon, { size: 16, strokeWidth: 2 }) }),
+                  /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { className: "absolute start-2 flex size-3.5 items-center justify-center", children: selected && /* @__PURE__ */ (0, import_jsx_runtime82.jsx)(import_lucide_react25.CheckIcon, { size: 16, strokeWidth: 2 }) }),
                   /* @__PURE__ */ (0, import_jsx_runtime82.jsx)("span", { children: optionLabel })
                 ]
               },
@@ -6657,11 +6720,11 @@ var MultiSelectInner = ({
     )
   ] });
 };
-var MultiSelect = (0, import_react50.forwardRef)(MultiSelectInner);
+var MultiSelect = (0, import_react51.forwardRef)(MultiSelectInner);
 
 // src/select/InfinitySelect.tsx
 var import_react_virtual = require("@tanstack/react-virtual");
-var import_react51 = require("react");
+var import_react52 = require("react");
 var import_jsx_runtime83 = require("react/jsx-runtime");
 function InfinitySelect({
   label,
@@ -6676,22 +6739,22 @@ function InfinitySelect({
   itemHeight = 35,
   maxHeight = 300
 }) {
-  const id = (0, import_react51.useId)();
-  const parentRef = (0, import_react51.useRef)(null);
-  const [isOpen, setIsOpen] = (0, import_react51.useState)(false);
+  const id = (0, import_react52.useId)();
+  const parentRef = (0, import_react52.useRef)(null);
+  const [isOpen, setIsOpen] = (0, import_react52.useState)(false);
   const virtualizer = (0, import_react_virtual.useVirtualizer)({
     count: hasNextPage ? options.length + 1 : options.length,
     getScrollElement: () => parentRef.current,
     estimateSize: () => itemHeight,
     overscan: 5
   });
-  const loadMore = (0, import_react51.useCallback)(() => {
+  const loadMore = (0, import_react52.useCallback)(() => {
     if (hasNextPage && !isFetchingNextPage) {
       fetchNextPage();
     }
   }, [fetchNextPage, hasNextPage, isFetchingNextPage]);
   const virtualItems = virtualizer.getVirtualItems();
-  (0, import_react51.useEffect)(() => {
+  (0, import_react52.useEffect)(() => {
     if (!virtualItems.length) return;
     const lastItem = virtualItems[virtualItems.length - 1];
     if (lastItem && lastItem.index >= options.length - 5 && hasNextPage && !isFetchingNextPage) {
@@ -6850,7 +6913,7 @@ function Pagination({
                 disabled: !canGoPrevious,
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_first_page") }),
-                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react27.ChevronsLeft, {})
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronsLeft, {})
                 ]
               }
             ),
@@ -6866,7 +6929,7 @@ function Pagination({
                 disabled: !canGoPrevious,
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_previous_page") }),
-                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react27.ChevronLeft, {})
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronLeft, {})
                 ]
               }
             ),
@@ -6882,7 +6945,7 @@ function Pagination({
                 disabled: !canGoNext,
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_next_page") }),
-                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react27.ChevronRight, {})
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronRight, {})
                 ]
               }
             ),
@@ -6896,7 +6959,7 @@ function Pagination({
                 disabled: !canGoNext,
                 children: [
                   /* @__PURE__ */ (0, import_jsx_runtime84.jsx)("span", { className: "sr-only", children: t("go_to_last_page") }),
-                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react27.ChevronsRight, {})
+                  /* @__PURE__ */ (0, import_jsx_runtime84.jsx)(import_lucide_react26.ChevronsRight, {})
                 ]
               }
             )
@@ -6908,7 +6971,7 @@ function Pagination({
 }
 
 // src/popover/Popover.tsx
-var React22 = __toESM(require("react"), 1);
+var React23 = __toESM(require("react"), 1);
 var RadixPopover = __toESM(require("@radix-ui/react-popover"), 1);
 var import_jsx_runtime85 = require("react/jsx-runtime");
 var Popover = RadixPopover.Root;
@@ -6916,7 +6979,7 @@ var PopoverTrigger = RadixPopover.Trigger;
 var PopoverAnchor = RadixPopover.Anchor;
 var PopoverPortal = RadixPopover.Portal;
 var PopoverClose = RadixPopover.Close;
-var PopoverContent = React22.forwardRef(({ className, sideOffset = 4, align = "center", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
+var PopoverContent = React23.forwardRef(({ className, sideOffset = 4, align = "center", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime85.jsx)(
   RadixPopover.Content,
   {
     ref,
@@ -7003,14 +7066,14 @@ function PopoverWithTooltip({
 }
 
 // src/radio/Radio.tsx
-var import_react53 = require("react");
+var import_react54 = require("react");
 
 // src/radio-group/RadioGroup.tsx
-var React23 = __toESM(require("react"), 1);
+var React24 = __toESM(require("react"), 1);
 var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
-var import_lucide_react28 = require("lucide-react");
+var import_lucide_react27 = require("lucide-react");
 var import_jsx_runtime87 = require("react/jsx-runtime");
-var RadioGroup2 = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+var RadioGroup2 = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
   RadioGroupPrimitive.Root,
   {
     ref,
@@ -7019,7 +7082,7 @@ var RadioGroup2 = React23.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 RadioGroup2.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
+var RadioGroupItem = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(
   RadioGroupPrimitive.Item,
   {
     ref,
@@ -7030,17 +7093,17 @@ var RadioGroupItem = React23.forwardRef(({ className, ...props }, ref) => /* @__
       className
     ),
     ...props,
-    children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_lucide_react28.Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) })
+    children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(RadioGroupPrimitive.Indicator, { className: "flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime87.jsx)(import_lucide_react27.Circle, { className: "h-2.5 w-2.5 fill-current text-current" }) })
   }
 ));
 RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
 
 // src/radio/useRadioOptions.ts
-var import_react52 = require("react");
+var import_react53 = require("react");
 function useRadioOptions({ options, defaultValue, onChange }) {
   const initialValue = (typeof defaultValue === "string" ? options.find((option) => option.value === defaultValue) : defaultValue) || "";
-  const [selectedValue, setSelectedValue] = (0, import_react52.useState)(initialValue);
-  const handleValueChange = (0, import_react52.useCallback)(
+  const [selectedValue, setSelectedValue] = (0, import_react53.useState)(initialValue);
+  const handleValueChange = (0, import_react53.useCallback)(
     (value) => {
       setSelectedValue(value);
       const selectedOption = options.find((option) => option.value === value) || "";
@@ -7058,7 +7121,7 @@ function useRadioOptions({ options, defaultValue, onChange }) {
 
 // src/radio/Radio.tsx
 var import_jsx_runtime88 = require("react/jsx-runtime");
-var Radio = (0, import_react53.forwardRef)(
+var Radio = (0, import_react54.forwardRef)(
   ({ options, value, onChange, error, className = "", disabled = false, renderOption }, ref) => {
     const { selectedValue, handleValueChange } = useRadioOptions({
       options,
@@ -7197,7 +7260,7 @@ function RatingProgress({
 }
 
 // src/rating-radio-group/RatingRadioGroup.tsx
-var import_lucide_react29 = require("lucide-react");
+var import_lucide_react28 = require("lucide-react");
 var import_jsx_runtime91 = require("react/jsx-runtime");
 var getStarColor = (optionValue) => (value) => {
   if (value >= optionValue) return "#facc15";
@@ -7226,7 +7289,7 @@ function RatingRadioGroup({
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime91.jsx)(
-        import_lucide_react29.Star,
+        import_lucide_react28.Star,
         {
           className: "cursor-pointer rounded peer-focus-visible:outline peer-focus-visible:outline-2 peer-focus-visible:outline-offset-2 peer-focus-visible:outline-[#385bf8]",
           size: 24,
@@ -7240,8 +7303,8 @@ function RatingRadioGroup({
 }
 
 // src/rating-stars/RatingStars.tsx
-var React24 = __toESM(require("react"), 1);
-var import_lucide_react30 = require("lucide-react");
+var React25 = __toESM(require("react"), 1);
+var import_lucide_react29 = require("lucide-react");
 var import_react_i18next18 = require("react-i18next");
 var import_jsx_runtime92 = require("react/jsx-runtime");
 function RatingStars({
@@ -7260,7 +7323,7 @@ function RatingStars({
   const { t } = (0, import_react_i18next18.useTranslation)();
   const normalizedRating = Math.max(0, Math.min(maxRating, rating));
   const stars = Array.from({ length: maxRating }, (_, index) => index + 1);
-  const componentId = React24.useId();
+  const componentId = React25.useId();
   const decimal = normalizedRating - Math.floor(normalizedRating);
   const partialStarIndex = decimal > 0 ? Math.ceil(normalizedRating) : -1;
   const gradientId = `star-gradient-${componentId.replace(/:/g, "")}`;
@@ -7285,7 +7348,7 @@ function RatingStars({
         /* @__PURE__ */ (0, import_jsx_runtime92.jsx)("stop", { offset: `${decimal * 100}%`, stopColor: emptyColor })
       ] }) }) }),
       stars.map((star) => /* @__PURE__ */ (0, import_jsx_runtime92.jsx)(
-        import_lucide_react30.Star,
+        import_lucide_react29.Star,
         {
           size,
           className: cn("shrink-0", starClassName),
@@ -7308,11 +7371,11 @@ function RatingStars({
 }
 
 // src/rotate-icon/RotateIcon.tsx
-var import_lucide_react31 = require("lucide-react");
+var import_lucide_react30 = require("lucide-react");
 var import_jsx_runtime93 = require("react/jsx-runtime");
 function RotateIcon({ active, className }) {
   return /* @__PURE__ */ (0, import_jsx_runtime93.jsx)(
-    import_lucide_react31.ChevronUp,
+    import_lucide_react30.ChevronUp,
     {
       className: cn(
         "h-4 w-4 transition-transform",
@@ -7324,7 +7387,7 @@ function RotateIcon({ active, className }) {
 }
 
 // src/search-button/SearchButton.tsx
-var import_lucide_react32 = require("lucide-react");
+var import_lucide_react31 = require("lucide-react");
 var import_jsx_runtime94 = require("react/jsx-runtime");
 function SearchButton({ onClick, className, icon, ariaLabel }) {
   return /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(
@@ -7335,13 +7398,13 @@ function SearchButton({ onClick, className, icon, ariaLabel }) {
       "data-testid": "search-button",
       "aria-label": ariaLabel,
       type: "button",
-      children: icon || /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react32.Search, { size: 12, strokeWidth: 4, className: "text-[var(--chekin-color-gray-1)]" })
+      children: icon || /* @__PURE__ */ (0, import_jsx_runtime94.jsx)(import_lucide_react31.Search, { size: 12, strokeWidth: 4, className: "text-[var(--chekin-color-gray-1)]" })
     }
   );
 }
 
 // src/search-input/SearchInput.tsx
-var import_lucide_react33 = require("lucide-react");
+var import_lucide_react32 = require("lucide-react");
 var import_react_i18next19 = require("react-i18next");
 var import_jsx_runtime95 = require("react/jsx-runtime");
 function SearchInput({
@@ -7369,7 +7432,7 @@ function SearchInput({
       tooltip && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(HelpTooltip, { content: tooltip, side: "top", size: 16 })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "relative", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_lucide_react33.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-[var(--chekin-color-gray-2)]" }),
+      /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_lucide_react32.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 text-[var(--chekin-color-gray-2)]" }),
       /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
         Input,
         {
@@ -7390,7 +7453,7 @@ function SearchInput({
       ),
       (loading || onReset) && /* @__PURE__ */ (0, import_jsx_runtime95.jsxs)("div", { className: "absolute right-2 top-1/2 flex -translate-y-1/2 items-center gap-1", children: [
         loading && /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(
-          import_lucide_react33.Loader2,
+          import_lucide_react32.Loader2,
           {
             "aria-hidden": "true",
             className: "h-5 w-5 animate-spin text-[var(--chekin-color-gray-2)]"
@@ -7404,7 +7467,7 @@ function SearchInput({
             disabled: isBlocked,
             className: "h-7 w-7 p-0 text-[var(--chekin-color-gray-2)]",
             "aria-label": t("reset_search"),
-            children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_lucide_react33.X, { className: "h-5 w-5" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime95.jsx)(import_lucide_react32.X, { className: "h-5 w-5" })
           }
         )
       ] })
@@ -7443,8 +7506,9 @@ var SectionTagColors = /* @__PURE__ */ ((SectionTagColors2) => {
 })(SectionTagColors || {});
 
 // src/section/Section.tsx
-var import_react54 = require("react");
-var import_lucide_react34 = require("lucide-react");
+var import_react55 = require("react");
+var import_lucide_react33 = require("lucide-react");
+var import_react_i18next20 = require("react-i18next");
 
 // src/section/constants.ts
 var SubSectionSize = /* @__PURE__ */ ((SubSectionSize2) => {
@@ -7463,11 +7527,11 @@ function TooltipInfo({ content, className }) {
       className: cn("inline-flex text-[var(--chekin-color-gray-1)]", className),
       onClick: (event) => event.stopPropagation(),
       "aria-label": typeof content === "string" ? content : "More information",
-      children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react34.CircleHelp, { className: "h-4 w-4" })
+      children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(import_lucide_react33.CircleHelp, { className: "h-4 w-4" })
     }
   ) });
 }
-var Section = (0, import_react54.forwardRef)(
+var Section = (0, import_react55.forwardRef)(
   ({
     children,
     title,
@@ -7481,45 +7545,56 @@ var Section = (0, import_react54.forwardRef)(
     linkContent,
     hidden,
     size
-  }, ref) => /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
-    "div",
-    {
-      ref,
-      className: cn(
-        "mb-6 box-border flex w-full cursor-default flex-col gap-6 rounded-lg border border-solid border-[var(--chekin-color-gray-3)] bg-white px-6 py-10",
-        loading && "cursor-progress",
-        disabled && "pointer-events-none opacity-50",
-        { "!hidden": hidden },
-        className
-      ),
-      children: [
-        (title || subtitle) && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex flex-col gap-2", children: [
-          title && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
-            "div",
+  }, ref) => {
+    const { t } = (0, import_react_i18next20.useTranslation)();
+    return /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
+      "div",
+      {
+        ref,
+        className: cn(
+          "mb-6 box-border flex w-full cursor-default flex-col gap-6 rounded-lg border border-solid border-[var(--chekin-color-gray-3)] bg-white px-6 py-10",
+          loading && "cursor-progress",
+          disabled && "pointer-events-none opacity-50",
+          { "!hidden": hidden },
+          className
+        ),
+        children: [
+          (title || subtitle) && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "flex flex-col gap-2", children: [
+            title && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
+              "div",
+              {
+                className: cn(
+                  "flex max-w-[85%] items-center text-lg font-bold text-[var(--chekin-color-brand-navy)] md:max-w-full",
+                  size !== 0 /* L */ && "subsection-title"
+                ),
+                children: [
+                  title,
+                  titleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-2.5", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: titleTooltip }) }),
+                  linkContent && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-6 text-sm font-semibold text-[var(--chekin-color-brand-blue)] no-underline hover:opacity-70 active:opacity-100", children: linkContent })
+                ]
+              }
+            ),
+            subtitle && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "w-full max-w-[720px] md:max-w-full", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "inline text-base font-normal text-[var(--chekin-color-gray-1)]", children: subtitle }),
+              subtitleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-1.5 inline-block align-text-top", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: subtitleTooltip }) })
+            ] })
+          ] }),
+          loading && showLoader ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
+            CircularLoader,
             {
-              className: cn(
-                "flex max-w-[85%] items-center text-lg font-bold text-[var(--chekin-color-brand-navy)] md:max-w-full",
-                size !== 0 /* L */ && "subsection-title"
-              ),
-              children: [
-                title,
-                titleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-2.5", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: titleTooltip }) }),
-                linkContent && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-6 text-sm font-semibold text-[var(--chekin-color-brand-blue)] no-underline hover:opacity-70 active:opacity-100", children: linkContent })
-              ]
+              width: 32,
+              height: 32,
+              label: t("loading"),
+              className: "mx-auto mb-3 mt-2.5"
             }
-          ),
-          subtitle && /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)("div", { className: "w-full max-w-[720px] md:max-w-full", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "inline text-base font-normal text-[var(--chekin-color-gray-1)]", children: subtitle }),
-            subtitleTooltip && /* @__PURE__ */ (0, import_jsx_runtime97.jsx)("div", { className: "ml-1.5 inline-block align-text-top", children: /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(TooltipInfo, { content: subtitleTooltip }) })
-          ] })
-        ] }),
-        loading && showLoader ? /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(Loader, { className: "mx-auto mb-3 mt-2.5" }) : children
-      ]
-    }
-  )
+          ) : children
+        ]
+      }
+    );
+  }
 );
 Section.displayName = "Section";
-var SubSection = (0, import_react54.forwardRef)(
+var SubSection = (0, import_react55.forwardRef)(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
     Section,
     {
@@ -7533,7 +7608,7 @@ var SubSection = (0, import_react54.forwardRef)(
   )
 );
 SubSection.displayName = "SubSection";
-var DividingSubsection = (0, import_react54.forwardRef)(
+var DividingSubsection = (0, import_react55.forwardRef)(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime97.jsx)(
     SubSection,
     {
@@ -7546,7 +7621,7 @@ var DividingSubsection = (0, import_react54.forwardRef)(
 DividingSubsection.displayName = "DividingSubsection";
 
 // src/selectors/Selectors.tsx
-var import_react55 = require("react");
+var import_react56 = require("react");
 
 // src/selector-button/SelectorButton.tsx
 var import_jsx_runtime98 = require("react/jsx-runtime");
@@ -7615,8 +7690,8 @@ var getValueArray = (value) => {
   return [];
 };
 function getSelectorContent(label, disabled, readOnly, active) {
-  if ((0, import_react55.isValidElement)(label)) {
-    return (0, import_react55.cloneElement)(label, {
+  if ((0, import_react56.isValidElement)(label)) {
+    return (0, import_react56.cloneElement)(label, {
       disabled,
       readOnly,
       active
@@ -7661,7 +7736,7 @@ function SelectorsInternal({
     }
   };
   const isAnyActive = getValueArray(value).length > 0;
-  (0, import_react55.useEffect)(() => {
+  (0, import_react56.useEffect)(() => {
     onAnySelectorActive?.(isAnyActive);
   }, [isAnyActive, onAnySelectorActive]);
   return /* @__PURE__ */ (0, import_jsx_runtime99.jsxs)(import_jsx_runtime99.Fragment, { children: [
@@ -7706,7 +7781,7 @@ function SelectorsInternal({
     )
   ] });
 }
-var Selectors = (0, import_react55.forwardRef)(SelectorsInternal);
+var Selectors = (0, import_react56.forwardRef)(SelectorsInternal);
 
 // src/separator/Separator.tsx
 var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
@@ -7734,7 +7809,7 @@ function Separator3({
 
 // src/sheet/Sheet.tsx
 var SheetPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
-var import_lucide_react35 = require("lucide-react");
+var import_lucide_react34 = require("lucide-react");
 var import_jsx_runtime101 = require("react/jsx-runtime");
 function Sheet({ ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(SheetPrimitive.Root, { "data-slot": "sheet", ...props });
@@ -7788,7 +7863,7 @@ function SheetContent({
         children: [
           children,
           /* @__PURE__ */ (0, import_jsx_runtime101.jsxs)(SheetPrimitive.Close, { className: "absolute right-4 top-4 rounded-[var(--chekin-radius-small)] opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:shadow-[var(--chekin-shadow-focus)] disabled:pointer-events-none", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react35.XIcon, { className: "size-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime101.jsx)(import_lucide_react34.XIcon, { className: "size-4" }),
             /* @__PURE__ */ (0, import_jsx_runtime101.jsx)("span", { className: "sr-only", children: "Close" })
           ] })
         ]
@@ -7844,10 +7919,10 @@ function SheetDescription({
 }
 
 // src/sidebar/Sidebar.tsx
-var React25 = __toESM(require("react"), 1);
+var React26 = __toESM(require("react"), 1);
 var import_react_slot4 = require("@radix-ui/react-slot");
 var import_class_variance_authority11 = require("class-variance-authority");
-var import_lucide_react36 = require("lucide-react");
+var import_lucide_react35 = require("lucide-react");
 
 // src/skeleton/Skeleton.tsx
 var import_jsx_runtime102 = require("react/jsx-runtime");
@@ -7866,19 +7941,19 @@ function Skeleton({ className, ...props }) {
 }
 
 // src/sidebar/SidebarContext.ts
-var import_react56 = require("react");
-var SidebarContext = (0, import_react56.createContext)(null);
+var import_react57 = require("react");
+var SidebarContext = (0, import_react57.createContext)(null);
 
 // src/sidebar/useSidebarMenuButton.ts
-var import_react58 = require("react");
+var import_react59 = require("react");
 
 // src/sidebar/SidebarMenuButtonContext.ts
-var import_react57 = require("react");
-var SidebarMenuButtonContext = (0, import_react57.createContext)(null);
+var import_react58 = require("react");
+var SidebarMenuButtonContext = (0, import_react58.createContext)(null);
 
 // src/sidebar/useSidebarMenuButton.ts
 function useSidebarMenuButton() {
-  return (0, import_react58.useContext)(SidebarMenuButtonContext);
+  return (0, import_react59.useContext)(SidebarMenuButtonContext);
 }
 
 // src/sidebar/SidebarIcon.tsx
@@ -7919,16 +7994,16 @@ var SidebarIcon = ({
 };
 
 // src/sidebar/useSidebar.ts
-var import_react59 = require("react");
+var import_react60 = require("react");
 function useSidebar() {
-  const context = (0, import_react59.useContext)(SidebarContext);
+  const context = (0, import_react60.useContext)(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
   return context;
 }
 function useSidebarSafe() {
-  return (0, import_react59.useContext)(SidebarContext);
+  return (0, import_react60.useContext)(SidebarContext);
 }
 
 // src/sidebar/Sidebar.tsx
@@ -7937,7 +8012,7 @@ var SIDEBAR_COOKIE_NAME_DEFAULT = "sidebar_state";
 var SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7;
 var SIDEBAR_WIDTH_MOBILE = "18rem";
 var SIDEBAR_KEYBOARD_SHORTCUT = "b";
-var SidebarProvider = React25.forwardRef(
+var SidebarProvider = React26.forwardRef(
   ({
     defaultOpen = true,
     open: openProp,
@@ -7949,10 +8024,10 @@ var SidebarProvider = React25.forwardRef(
     ...props
   }, ref) => {
     const isMobile = useIsMobile({ breakpoint: 641 });
-    const [openMobile, setOpenMobile] = React25.useState(false);
-    const [_open, _setOpen] = React25.useState(defaultOpen);
+    const [openMobile, setOpenMobile] = React26.useState(false);
+    const [_open, _setOpen] = React26.useState(defaultOpen);
     const open = openProp ?? _open;
-    const setOpen = React25.useCallback(
+    const setOpen = React26.useCallback(
       (value) => {
         const openState = typeof value === "function" ? value(open) : value;
         if (setOpenProp) {
@@ -7964,10 +8039,10 @@ var SidebarProvider = React25.forwardRef(
       },
       [setOpenProp, open, stateName]
     );
-    const toggleSidebar = React25.useCallback(() => {
+    const toggleSidebar = React26.useCallback(() => {
       return isMobile ? setOpenMobile((value) => !value) : setOpen((value) => !value);
     }, [isMobile, setOpen]);
-    React25.useEffect(() => {
+    React26.useEffect(() => {
       const handleKeyDown = (event) => {
         if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
           event.preventDefault();
@@ -7978,7 +8053,7 @@ var SidebarProvider = React25.forwardRef(
       return () => window.removeEventListener("keydown", handleKeyDown);
     }, [toggleSidebar]);
     const state = open ? "expanded" : "collapsed";
-    const contextValue = React25.useMemo(
+    const contextValue = React26.useMemo(
       () => ({
         state,
         open,
@@ -8003,7 +8078,7 @@ var SidebarProvider = React25.forwardRef(
   }
 );
 SidebarProvider.displayName = "SidebarProvider";
-var Sidebar = React25.forwardRef(
+var Sidebar = React26.forwardRef(
   ({
     side = "left",
     variant = "sidebar",
@@ -8097,7 +8172,7 @@ var Sidebar = React25.forwardRef(
   }
 );
 Sidebar.displayName = "Sidebar";
-var SidebarTrigger = React25.forwardRef(({ className, onClick, icon, ...props }, ref) => {
+var SidebarTrigger = React26.forwardRef(({ className, onClick, icon, ...props }, ref) => {
   const { toggleSidebar, open, isMobile, openMobile } = useSidebar();
   return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
     Button,
@@ -8117,14 +8192,14 @@ var SidebarTrigger = React25.forwardRef(({ className, onClick, icon, ...props },
       },
       ...props,
       children: [
-        icon || (isMobile ? openMobile : open) ? icon || /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_lucide_react36.ArrowLeftFromLineIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_lucide_react36.ArrowRightFromLineIcon, {}),
+        icon || (isMobile ? openMobile : open) ? icon || /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_lucide_react35.ArrowLeftFromLineIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(import_lucide_react35.ArrowRightFromLineIcon, {}),
         /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("span", { className: "sr-only", children: "Toggle Sidebar" })
       ]
     }
   );
 });
 SidebarTrigger.displayName = "SidebarTrigger";
-var SidebarRail = React25.forwardRef(
+var SidebarRail = React26.forwardRef(
   ({ className, ...props }, ref) => {
     const { toggleSidebar } = useSidebar();
     return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
@@ -8150,7 +8225,7 @@ var SidebarRail = React25.forwardRef(
   }
 );
 SidebarRail.displayName = "SidebarRail";
-var SidebarInset = React25.forwardRef(
+var SidebarInset = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "main",
     {
@@ -8165,7 +8240,7 @@ var SidebarInset = React25.forwardRef(
   )
 );
 SidebarInset.displayName = "SidebarInset";
-var SidebarInput = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+var SidebarInput = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
   Input,
   {
     ref,
@@ -8175,7 +8250,7 @@ var SidebarInput = React25.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 SidebarInput.displayName = "SidebarInput";
-var SidebarHeader = React25.forwardRef(
+var SidebarHeader = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "div",
     {
@@ -8187,7 +8262,7 @@ var SidebarHeader = React25.forwardRef(
   )
 );
 SidebarHeader.displayName = "SidebarHeader";
-var SidebarFooter = React25.forwardRef(
+var SidebarFooter = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "div",
     {
@@ -8199,7 +8274,7 @@ var SidebarFooter = React25.forwardRef(
   )
 );
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
+var SidebarSeparator = React26.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
   Separator3,
   {
     ref,
@@ -8209,7 +8284,7 @@ var SidebarSeparator = React25.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SidebarSeparator.displayName = "SidebarSeparator";
-var SidebarContent = React25.forwardRef(
+var SidebarContent = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "div",
     {
@@ -8224,7 +8299,7 @@ var SidebarContent = React25.forwardRef(
   )
 );
 SidebarContent.displayName = "SidebarContent";
-var SidebarGroup = React25.forwardRef(
+var SidebarGroup = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "div",
     {
@@ -8236,7 +8311,7 @@ var SidebarGroup = React25.forwardRef(
   )
 );
 SidebarGroup.displayName = "SidebarGroup";
-var SidebarGroupLabel = React25.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupLabel = React26.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot4.Slot : "div";
   return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     Comp,
@@ -8253,7 +8328,7 @@ var SidebarGroupLabel = React25.forwardRef(({ className, asChild = false, ...pro
   );
 });
 SidebarGroupLabel.displayName = "SidebarGroupLabel";
-var SidebarGroupAction = React25.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupAction = React26.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot4.Slot : "button";
   return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     Comp,
@@ -8269,7 +8344,7 @@ var SidebarGroupAction = React25.forwardRef(({ className, asChild = false, ...pr
   );
 });
 SidebarGroupAction.displayName = "SidebarGroupAction";
-var SidebarGroupContent = React25.forwardRef(
+var SidebarGroupContent = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "div",
     {
@@ -8281,7 +8356,7 @@ var SidebarGroupContent = React25.forwardRef(
   )
 );
 SidebarGroupContent.displayName = "SidebarGroupContent";
-var SidebarMenu = React25.forwardRef(
+var SidebarMenu = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "ul",
     {
@@ -8293,7 +8368,7 @@ var SidebarMenu = React25.forwardRef(
   )
 );
 SidebarMenu.displayName = "SidebarMenu";
-var SidebarMenuItem = React25.forwardRef(
+var SidebarMenuItem = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "li",
     {
@@ -8325,7 +8400,7 @@ var sidebarMenuButtonVariants = (0, import_class_variance_authority11.cva)(
     }
   }
 );
-var SidebarMenuButton = React25.forwardRef(
+var SidebarMenuButton = React26.forwardRef(
   ({
     asChild = false,
     isActive = false,
@@ -8371,7 +8446,7 @@ var SidebarMenuButton = React25.forwardRef(
   }
 );
 SidebarMenuButton.displayName = "SidebarMenuButton";
-var SidebarMenuAction = React25.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+var SidebarMenuAction = React26.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot4.Slot : "button";
   return /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     Comp,
@@ -8388,7 +8463,7 @@ var SidebarMenuAction = React25.forwardRef(({ className, asChild = false, showOn
   );
 });
 SidebarMenuAction.displayName = "SidebarMenuAction";
-var SidebarMenuBadge = React25.forwardRef(
+var SidebarMenuBadge = React26.forwardRef(
   ({ className, ...props }, ref) => {
     const { open, isMobile, openMobile } = useSidebar();
     const isOpen = isMobile ? openMobile : open;
@@ -8408,8 +8483,8 @@ var SidebarMenuBadge = React25.forwardRef(
   }
 );
 SidebarMenuBadge.displayName = "SidebarMenuBadge";
-var SidebarMenuSkeleton = React25.forwardRef(({ className, showIcon = false, ...props }, ref) => {
-  const width = React25.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
+var SidebarMenuSkeleton = React26.forwardRef(({ className, showIcon = false, ...props }, ref) => {
+  const width = React26.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
   return /* @__PURE__ */ (0, import_jsx_runtime104.jsxs)(
     "div",
     {
@@ -8432,7 +8507,7 @@ var SidebarMenuSkeleton = React25.forwardRef(({ className, showIcon = false, ...
   );
 });
 SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
-var SidebarMenuSub = React25.forwardRef(
+var SidebarMenuSub = React26.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)(
     "ul",
     {
@@ -8447,7 +8522,7 @@ var SidebarMenuSub = React25.forwardRef(
   )
 );
 SidebarMenuSub.displayName = "SidebarMenuSub";
-var SidebarMenuSubItem = React25.forwardRef(
+var SidebarMenuSubItem = React26.forwardRef(
   ({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime104.jsx)("li", { ref, ...props })
 );
 SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
@@ -8471,7 +8546,7 @@ var sidebarMenuSubButtonVariants = (0, import_class_variance_authority11.cva)(
     }
   }
 );
-var SidebarMenuSubButton = React25.forwardRef(
+var SidebarMenuSubButton = React26.forwardRef(
   ({
     asChild = false,
     isActive,
@@ -8500,106 +8575,10 @@ SidebarMenuSubButton.displayName = "SidebarMenuSubButton";
 var VALUE_PART = 1;
 var getSidebarState = (stateName) => document.cookie.split("; ").find((row) => row.startsWith(`${stateName}=`))?.split("=")[VALUE_PART] === "true";
 
-// src/circular-loader/CircularLoader.tsx
-var import_react60 = __toESM(require("react"), 1);
-var import_jsx_runtime105 = require("react/jsx-runtime");
-var CircularLoader = import_react60.default.memo(
-  ({ visible = true, height, width, position, label, className }) => {
-    if (!visible) return null;
-    return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
-      "div",
-      {
-        className: cn(
-          "main-loader flex flex-col items-center justify-center gap-2",
-          position === "center" && "h-full",
-          className
-        ),
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
-            "svg",
-            {
-              viewBox: "25 25 50 50",
-              className: "main-loader__svg text-[var(--circular-loader-color)]",
-              style: {
-                width: toCssSize(width),
-                height: toCssSize(height)
-              },
-              children: [
-                /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
-                  "circle",
-                  {
-                    r: "20",
-                    cy: "50",
-                    cx: "50",
-                    className: "cover fill-none stroke-current opacity-5",
-                    strokeWidth: "7"
-                  }
-                ),
-                /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
-                  "circle",
-                  {
-                    r: "20",
-                    cy: "50",
-                    cx: "50",
-                    className: "circle fill-none stroke-current",
-                    strokeDasharray: "1 200",
-                    strokeDashoffset: "0",
-                    strokeLinecap: "round",
-                    strokeWidth: "7",
-                    children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
-                        "animateTransform",
-                        {
-                          attributeName: "transform",
-                          dur: "2.25s",
-                          from: "0 50 50",
-                          repeatCount: "indefinite",
-                          to: "360 50 50",
-                          type: "rotate"
-                        }
-                      ),
-                      /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
-                        "animate",
-                        {
-                          attributeName: "stroke-dasharray",
-                          calcMode: "spline",
-                          dur: "1.8s",
-                          keyTimes: "0;0.5;1",
-                          keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
-                          repeatCount: "indefinite",
-                          values: "1 200;90 200;90 200"
-                        }
-                      ),
-                      /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
-                        "animate",
-                        {
-                          attributeName: "stroke-dashoffset",
-                          calcMode: "spline",
-                          dur: "1.8s",
-                          keyTimes: "0;0.5;1",
-                          keySplines: "0.42 0 0.58 1;0.42 0 0.58 1",
-                          repeatCount: "indefinite",
-                          values: "0;-35;-125"
-                        }
-                      )
-                    ]
-                  }
-                )
-              ]
-            }
-          ),
-          label && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "text-sm font-medium text-chekin-gray-1", children: label })
-        ]
-      }
-    );
-  }
-);
-CircularLoader.displayName = "CircularLoader";
-
 // src/small-grid-single-item/SmallGridSingleItem.tsx
 var import_react61 = require("react");
-var import_lucide_react37 = require("lucide-react");
-var import_jsx_runtime106 = require("react/jsx-runtime");
+var import_lucide_react36 = require("lucide-react");
+var import_jsx_runtime105 = require("react/jsx-runtime");
 var SmallGridSingleItem = (0, import_react61.memo)(
   ({
     title,
@@ -8615,7 +8594,7 @@ var SmallGridSingleItem = (0, import_react61.memo)(
     const handleClick = (event) => {
       if (!disabled && onClick) onClick(event);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)(
       "div",
       {
         onClick: handleClick,
@@ -8629,24 +8608,24 @@ var SmallGridSingleItem = (0, import_react61.memo)(
           className
         ),
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "line-clamp-2 overflow-hidden text-ellipsis break-all", children: title }),
-            subtitle && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "line-clamp-2 overflow-hidden text-ellipsis text-[15px] font-medium leading-6 text-[var(--chekin-color-gray-2)]", children: subtitle })
+          /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { children: [
+            /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "line-clamp-2 overflow-hidden text-ellipsis break-all", children: title }),
+            subtitle && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "line-clamp-2 overflow-hidden text-ellipsis text-[15px] font-medium leading-6 text-[var(--chekin-color-gray-2)]", children: subtitle })
           ] }),
-          !readOnly && /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)("div", { className: "flex h-full items-center justify-end gap-2", children: [
-            onDelete && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
+          !readOnly && /* @__PURE__ */ (0, import_jsx_runtime105.jsxs)("div", { className: "flex h-full items-center justify-end gap-2", children: [
+            onDelete && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
               Button,
               {
                 disabled,
                 onClick: onDelete,
                 size: "icon",
                 variant: "outline",
-                children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.Trash2, { className: "h-5 w-5 text-[var(--chekin-color-brand-red)]" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_lucide_react36.Trash2, { className: "h-5 w-5 text-[var(--chekin-color-brand-red)]" })
               }
             ),
-            onEdit && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(Button, { disabled, onClick: onEdit, size: "icon", variant: "outline", children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.Pencil, { className: "h-5 w-5 text-[var(--chekin-color-brand-blue)]" }) })
+            onEdit && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(Button, { disabled, onClick: onEdit, size: "icon", variant: "outline", children: /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(import_lucide_react36.Pencil, { className: "h-5 w-5 text-[var(--chekin-color-brand-blue)]" }) })
           ] }),
-          error && /* @__PURE__ */ (0, import_jsx_runtime106.jsx)("div", { className: "absolute bottom-1 right-2 text-xs text-[var(--chekin-color-brand-red)]", children: error })
+          error && /* @__PURE__ */ (0, import_jsx_runtime105.jsx)("div", { className: "absolute bottom-1 right-2 text-xs text-[var(--chekin-color-brand-red)]", children: error })
         ]
       }
     );
@@ -8655,9 +8634,9 @@ var SmallGridSingleItem = (0, import_react61.memo)(
 SmallGridSingleItem.displayName = "SmallGridSingleItem";
 
 // src/sorting-action/SortingAction.tsx
-var import_react_i18next20 = require("react-i18next");
-var import_lucide_react38 = require("lucide-react");
-var import_jsx_runtime107 = require("react/jsx-runtime");
+var import_react_i18next21 = require("react-i18next");
+var import_lucide_react37 = require("lucide-react");
+var import_jsx_runtime106 = require("react/jsx-runtime");
 function SortingAction({
   value,
   onSortChange,
@@ -8666,9 +8645,9 @@ function SortingAction({
   variant = "by_other",
   onOpenChange
 }) {
-  const { t } = (0, import_react_i18next20.useTranslation)();
-  return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(DropdownMenu, { open, onOpenChange, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(
+  const { t } = (0, import_react_i18next21.useTranslation)();
+  return /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(DropdownMenu, { open, onOpenChange, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(
       "button",
       {
         type: "button",
@@ -8677,36 +8656,36 @@ function SortingAction({
           className
         ),
         "aria-label": "Open sorting menu",
-        children: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.ArrowDownUpIcon, { className: "h-4 w-4 text-[var(--chekin-color-gray-1)] group-hover/trigger:text-[var(--chekin-color-brand-navy)]" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.ArrowDownUpIcon, { className: "h-4 w-4 text-[var(--chekin-color-gray-1)] group-hover/trigger:text-[var(--chekin-color-brand-navy)]" })
       }
     ) }),
-    /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(DropdownMenuContent, { className: "w-full max-w-[256px]", align: "start", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
+    /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(DropdownMenuContent, { className: "w-full max-w-[256px]", align: "start", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
         DropdownMenuItem,
         {
           active: value === "asc",
           className: cn(value === "asc" && "text-[var(--chekin-color-brand-blue)]"),
           onClick: () => onSortChange?.("asc"),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.ArrowUp, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.ArrowUp, { className: "h-4 w-4" }),
             variant === "by_text" ? t("sort_a_z") : t("sort_in_asc")
           ]
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
+      /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(
         DropdownMenuItem,
         {
           active: value === "desc",
           className: cn(value === "desc" && "text-[var(--chekin-color-brand-blue)]"),
           onClick: () => onSortChange?.("desc"),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.ArrowDown, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.ArrowDown, { className: "h-4 w-4" }),
             variant === "by_text" ? t("sort_z_a") : t("sort_in_desc")
           ]
         }
       ),
-      value && /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(DropdownMenuItem, { onClick: () => onSortChange?.(null), children: [
-        /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.Minus, { className: "h-4 w-4" }),
+      value && /* @__PURE__ */ (0, import_jsx_runtime106.jsxs)(DropdownMenuItem, { onClick: () => onSortChange?.(null), children: [
+        /* @__PURE__ */ (0, import_jsx_runtime106.jsx)(import_lucide_react37.Minus, { className: "h-4 w-4" }),
         t("clear_sorting")
       ] })
     ] })
@@ -8715,9 +8694,9 @@ function SortingAction({
 
 // src/status-button/StatusButton.tsx
 var import_react62 = require("react");
-var import_react_i18next21 = require("react-i18next");
-var import_lucide_react39 = require("lucide-react");
-var import_jsx_runtime108 = require("react/jsx-runtime");
+var import_react_i18next22 = require("react-i18next");
+var import_lucide_react38 = require("lucide-react");
+var import_jsx_runtime107 = require("react/jsx-runtime");
 function StatusButton({
   hidden,
   status,
@@ -8731,11 +8710,11 @@ function StatusButton({
   variant = "default",
   ...props
 }) {
-  const { t } = (0, import_react_i18next21.useTranslation)();
+  const { t } = (0, import_react_i18next22.useTranslation)();
   const configMap = (0, import_react62.useMemo)(() => {
     const defaultLoadingConfig = {
       text: loadingText ?? `${t("saving")}...`,
-      icon: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.Loader2, { className: "h-4 w-4 animate-spin" }),
+      icon: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.Loader2, { className: "h-4 w-4 animate-spin" }),
       variant,
       isLoading: true
     };
@@ -8745,13 +8724,13 @@ function StatusButton({
       validating: { ...defaultLoadingConfig, text: t("validating") },
       error: {
         text: t("error"),
-        icon: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.AlertCircle, { className: "h-4 w-4" }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.AlertCircle, { className: "h-4 w-4" }),
         variant: "destructive",
         isLoading: false
       },
       success: {
         text: successText ?? t("saved_exclamation"),
-        icon: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.CheckCircle, { className: "h-4 w-4" }),
+        icon: /* @__PURE__ */ (0, import_jsx_runtime107.jsx)(import_lucide_react38.CheckCircle, { className: "h-4 w-4" }),
         variant,
         isLoading: false
       },
@@ -8767,7 +8746,7 @@ function StatusButton({
   if (hidden) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime107.jsxs)(
     Button,
     {
       className: cn(
@@ -8783,45 +8762,45 @@ function StatusButton({
       ...props,
       children: [
         config.icon,
-        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("span", { children: config.text })
+        /* @__PURE__ */ (0, import_jsx_runtime107.jsx)("span", { children: config.text })
       ]
     }
   );
 }
 
 // src/status-box/StatusBox.tsx
-var import_lucide_react40 = require("lucide-react");
-var import_jsx_runtime109 = require("react/jsx-runtime");
+var import_lucide_react39 = require("lucide-react");
+var import_jsx_runtime108 = require("react/jsx-runtime");
 function StatusBox({ status, title, text }) {
   if (status === "success") {
-    return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-green-100 bg-green-50 p-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "rounded-full bg-green-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_lucide_react40.CheckIcon, { className: "h-5 w-5 text-green-600" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "font-semibold text-green-800", children: title }),
-        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "text-sm text-green-700", children: text })
+    return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-green-100 bg-green-50 p-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "rounded-full bg-green-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.CheckIcon, { className: "h-5 w-5 text-green-600" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "font-semibold text-green-800", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-green-700", children: text })
       ] })
     ] });
   }
   if (status === "failed") {
-    return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-red-100 bg-red-50 p-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "rounded-full bg-red-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_lucide_react40.XIcon, { className: "h-5 w-5 text-red-600" }) }),
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { children: [
-        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "font-semibold text-red-800", children: title }),
-        /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "text-sm text-red-700", children: text })
+    return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-red-100 bg-red-50 p-4", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "rounded-full bg-red-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.XIcon, { className: "h-5 w-5 text-red-600" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "font-semibold text-red-800", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-red-700", children: text })
       ] })
     ] });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-amber-100 bg-amber-50 p-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("div", { className: "rounded-full bg-amber-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(import_lucide_react40.AlertTriangleIcon, { className: "h-5 w-5 text-amber-600" }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime109.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "font-semibold text-amber-800", children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime109.jsx)("p", { className: "text-sm text-amber-700", children: text })
+  return /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { className: "flex items-center gap-3 rounded-lg border border-amber-100 bg-amber-50 p-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("div", { className: "rounded-full bg-amber-100 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime108.jsx)(import_lucide_react39.AlertTriangleIcon, { className: "h-5 w-5 text-amber-600" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime108.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "font-semibold text-amber-800", children: title }),
+      /* @__PURE__ */ (0, import_jsx_runtime108.jsx)("p", { className: "text-sm text-amber-700", children: text })
     ] })
   ] });
 }
 
 // src/stepper/Stepper.tsx
-var import_jsx_runtime110 = require("react/jsx-runtime");
+var import_jsx_runtime109 = require("react/jsx-runtime");
 function Stepper({
   totalSteps,
   activeStep,
@@ -8830,7 +8809,7 @@ function Stepper({
 }) {
   if (totalSteps <= 0) return null;
   const clampedActiveStep = Math.max(1, Math.min(totalSteps, activeStep));
-  return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
     "div",
     {
       className: cn("flex w-full items-center gap-2", className),
@@ -8841,7 +8820,7 @@ function Stepper({
       children: new Array(totalSteps).fill(null).map((_, stepIndex) => {
         const stepNumber = stepIndex + 1;
         const isActive = cumulative ? stepNumber <= clampedActiveStep : stepNumber === clampedActiveStep;
-        return /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
+        return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
           "span",
           {
             className: cn(
@@ -8858,14 +8837,14 @@ function Stepper({
 
 // src/switch-blocks/SwitchBlocks.tsx
 var import_react63 = require("react");
-var import_jsx_runtime111 = require("react/jsx-runtime");
+var import_jsx_runtime110 = require("react/jsx-runtime");
 var SwitchBlocksInternal = (0, import_react63.forwardRef)(
-  ({ options, value, onChange, disabled, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+  ({ options, value, onChange, disabled, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
     "div",
     {
       ref,
       className: cn("flex flex-wrap items-center justify-start gap-4", className),
-      children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
+      children: options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime110.jsx)(
         BoxOptionSelector,
         {
           id: option.id,
@@ -8887,7 +8866,7 @@ var SwitchBlocks = (0, import_react63.memo)(SwitchBlocksInternal);
 
 // src/switch-group/SwitchGroup.tsx
 var React27 = __toESM(require("react"), 1);
-var import_jsx_runtime112 = require("react/jsx-runtime");
+var import_jsx_runtime111 = require("react/jsx-runtime");
 var SwitchGroup = React27.forwardRef(
   ({ options, value = [], onChange, disabled = false, className, error, ...props }, ref) => {
     const handleOptionChange = (optionValue, checked) => {
@@ -8898,9 +8877,9 @@ var SwitchGroup = React27.forwardRef(
       }
       onChange(value.filter((selectedValue) => selectedValue !== optionValue));
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("div", { ref, className: cn("w-full space-y-4", className), ...props, children: [
-      options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)("div", { className: "flex flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { ref, className: cn("w-full space-y-4", className), ...props, children: [
+      options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)("div", { className: "flex items-center justify-between gap-4", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)("div", { className: "flex flex-col", children: /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
           Label,
           {
             className: cn(
@@ -8909,7 +8888,7 @@ var SwitchGroup = React27.forwardRef(
             ),
             children: [
               option.label,
-              option.description && /* @__PURE__ */ (0, import_jsx_runtime112.jsxs)(
+              option.description && /* @__PURE__ */ (0, import_jsx_runtime111.jsxs)(
                 "span",
                 {
                   className: cn(
@@ -8926,7 +8905,7 @@ var SwitchGroup = React27.forwardRef(
             ]
           }
         ) }),
-        /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(
           Switch,
           {
             value: value.includes(option.value),
@@ -8936,7 +8915,7 @@ var SwitchGroup = React27.forwardRef(
           }
         )
       ] }, option.value)),
-      error && /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(ErrorMessage, { disabled, children: error })
+      error && /* @__PURE__ */ (0, import_jsx_runtime111.jsx)(ErrorMessage, { disabled, children: error })
     ] });
   }
 );
@@ -8946,7 +8925,7 @@ SwitchGroup.displayName = "SwitchGroup";
 var import_react64 = require("react");
 var TabsPrimitive2 = __toESM(require("@radix-ui/react-tabs"), 1);
 var import_class_variance_authority12 = require("class-variance-authority");
-var import_jsx_runtime113 = require("react/jsx-runtime");
+var import_jsx_runtime112 = require("react/jsx-runtime");
 var Tabs = TabsPrimitive2.Root;
 var tabsListVariants = (0, import_class_variance_authority12.cva)("inline-flex items-center", {
   variants: {
@@ -8960,7 +8939,7 @@ var tabsListVariants = (0, import_class_variance_authority12.cva)("inline-flex i
   }
 });
 var TabsList = (0, import_react64.forwardRef)(
-  ({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+  ({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
     TabsPrimitive2.List,
     {
       ref,
@@ -8984,7 +8963,7 @@ var tabsTriggerVariants = (0, import_class_variance_authority12.cva)(
     }
   }
 );
-var TabsTrigger = (0, import_react64.forwardRef)(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
+var TabsTrigger = (0, import_react64.forwardRef)(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(
   TabsPrimitive2.Trigger,
   {
     ref,
@@ -8993,11 +8972,11 @@ var TabsTrigger = (0, import_react64.forwardRef)(({ className, variant, ...props
   }
 ));
 TabsTrigger.displayName = TabsPrimitive2.Trigger.displayName;
-var TabsContent = (0, import_react64.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(TabsPrimitive2.Content, { ref, className, tabIndex: -1, ...props }));
+var TabsContent = (0, import_react64.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime112.jsx)(TabsPrimitive2.Content, { ref, className, tabIndex: -1, ...props }));
 TabsContent.displayName = TabsPrimitive2.Content.displayName;
 
 // src/tabbed-section/TabbedSection.tsx
-var import_jsx_runtime114 = require("react/jsx-runtime");
+var import_jsx_runtime113 = require("react/jsx-runtime");
 function TabbedSection({
   triggers,
   value,
@@ -9019,8 +8998,8 @@ function TabbedSection({
     "[&>div:first-child]:gap-3",
     className
   );
-  return /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)(Tabs, { value: activeTab, onValueChange: onTabChange, className: "w-full", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime114.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime113.jsxs)(Tabs, { value: activeTab, onValueChange: onTabChange, className: "w-full", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime113.jsx)(
       BookmarkTabsList,
       {
         variant,
@@ -9028,12 +9007,12 @@ function TabbedSection({
         children: triggers
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: contentContainerClassName, children })
+    /* @__PURE__ */ (0, import_jsx_runtime113.jsx)("div", { className: contentContainerClassName, children })
   ] });
 }
 
 // src/table-placeholder/TablePlaceholder.tsx
-var import_jsx_runtime115 = require("react/jsx-runtime");
+var import_jsx_runtime114 = require("react/jsx-runtime");
 function TablePlaceholder({
   children,
   text,
@@ -9046,21 +9025,21 @@ function TablePlaceholder({
   if (!visible) {
     return null;
   }
-  const content = /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex flex-col items-center justify-center px-4 py-14 text-center", children: [
-    iconSlot && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { className: "mb-6", children: iconSlot }),
-    title && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("h3", { className: "mb-2 text-lg font-semibold", children: title }),
-    text && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("p", { className: "text-md max-w-sm font-medium", children: text }),
-    children && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { className: "mt-6", children })
+  const content = /* @__PURE__ */ (0, import_jsx_runtime114.jsxs)("div", { className: "flex flex-col items-center justify-center px-4 py-14 text-center", children: [
+    iconSlot && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: "mb-6", children: iconSlot }),
+    title && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("h3", { className: "mb-2 text-lg font-semibold", children: title }),
+    text && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("p", { className: "text-md max-w-sm font-medium", children: text }),
+    children && /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className: "mt-6", children })
   ] });
   if (insideTable) {
-    return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("td", { colSpan: 100, className, children: content }) });
+    return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("td", { colSpan: 100, className, children: content }) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("div", { className, children: content });
+  return /* @__PURE__ */ (0, import_jsx_runtime114.jsx)("div", { className, children: content });
 }
 
 // src/task-card/TaskCard.tsx
-var import_lucide_react41 = require("lucide-react");
-var import_jsx_runtime116 = require("react/jsx-runtime");
+var import_lucide_react40 = require("lucide-react");
+var import_jsx_runtime115 = require("react/jsx-runtime");
 function TaskCard({
   title,
   description,
@@ -9071,7 +9050,7 @@ function TaskCard({
 }) {
   const shouldShowCount = count !== void 0 && count > 1;
   const shouldShowActions = shouldShowCount || onClick;
-  return /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)(
     "div",
     {
       className: cn(
@@ -9087,7 +9066,7 @@ function TaskCard({
       role: onClick ? "button" : void 0,
       tabIndex: onClick ? 0 : void 0,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
           "div",
           {
             className: cn(
@@ -9097,12 +9076,12 @@ function TaskCard({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col items-start", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("h4", { className: "m-0 w-full break-words text-base font-semibold leading-6 text-[var(--chekin-color-brand-navy)]", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("p", { className: "m-0 w-full text-sm font-medium leading-6 text-[var(--chekin-color-gray-1)]", children: description })
+        /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex min-w-0 flex-1 flex-col items-start", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("h4", { className: "m-0 w-full break-words text-base font-semibold leading-6 text-[var(--chekin-color-brand-navy)]", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime115.jsx)("p", { className: "m-0 w-full text-sm font-medium leading-6 text-[var(--chekin-color-gray-1)]", children: description })
         ] }),
-        shouldShowActions && /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("div", { className: "flex shrink-0 items-center gap-1", children: [
-          shouldShowCount && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+        shouldShowActions && /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: "flex shrink-0 items-center gap-1", children: [
+          shouldShowCount && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
             "div",
             {
               className: cn(
@@ -9113,7 +9092,7 @@ function TaskCard({
               children: count
             }
           ),
-          onClick && /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
+          onClick && /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
             "button",
             {
               className: "flex h-8 w-0 min-w-0 cursor-pointer items-center justify-center overflow-hidden rounded-md border-0 bg-transparent p-0 text-[var(--chekin-color-gray-1)] opacity-0 transition-[width,opacity,min-width] duration-300 ease-in-out hover:bg-black/5 focus-visible:w-8 focus-visible:min-w-8 focus-visible:opacity-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-[var(--chekin-color-brand-blue)] group-hover:w-8 group-hover:min-w-8 group-hover:opacity-100",
@@ -9123,7 +9102,7 @@ function TaskCard({
               },
               "aria-label": "View details",
               type: "button",
-              children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(import_lucide_react41.ArrowRight, { className: "h-5 w-5" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(import_lucide_react40.ArrowRight, { className: "h-5 w-5" })
             }
           )
         ] })
@@ -9211,7 +9190,7 @@ var toggleVariants = (0, import_class_variance_authority13.cva)(
 );
 
 // src/toggle-group/ToggleGroup.tsx
-var import_jsx_runtime117 = require("react/jsx-runtime");
+var import_jsx_runtime116 = require("react/jsx-runtime");
 var ToggleGroupContext = React28.createContext({
   size: "default",
   variant: "default",
@@ -9219,7 +9198,7 @@ var ToggleGroupContext = React28.createContext({
 });
 var ToggleGroup = React28.forwardRef(({ className, variant, size, theme, children, ...props }, ref) => {
   const isTabVariant = variant === "tab";
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
     ToggleGroupPrimitive.Root,
     {
       ref,
@@ -9229,7 +9208,7 @@ var ToggleGroup = React28.forwardRef(({ className, variant, size, theme, childre
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(ToggleGroupContext.Provider, { value: { variant, size, theme }, children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(ToggleGroupContext.Provider, { value: { variant, size, theme }, children })
     }
   );
 });
@@ -9238,7 +9217,7 @@ var ToggleGroupItem = React28.forwardRef(({ className, children, variant, size,
   const context = React28.useContext(ToggleGroupContext);
   const resolvedVariant = context.variant || variant;
   const isTabVariant = resolvedVariant === "tab";
-  return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime116.jsx)(
     ToggleGroupPrimitive.Item,
     {
       ref,
@@ -9251,9 +9230,9 @@ var ToggleGroupItem = React28.forwardRef(({ className, children, variant, size,
         className
       ),
       ...props,
-      children: isTabVariant ? /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("span", { className: "inline-grid", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("span", { className: "invisible col-start-1 row-start-1 font-semibold", children }),
-        /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("span", { className: "col-start-1 row-start-1", children })
+      children: isTabVariant ? /* @__PURE__ */ (0, import_jsx_runtime116.jsxs)("span", { className: "inline-grid", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "invisible col-start-1 row-start-1 font-semibold", children }),
+        /* @__PURE__ */ (0, import_jsx_runtime116.jsx)("span", { className: "col-start-1 row-start-1", children })
       ] }) : children
     }
   );
@@ -9262,7 +9241,7 @@ ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 
 // src/toggle-group/Toggles.tsx
 var import_react66 = require("react");
-var import_jsx_runtime118 = require("react/jsx-runtime");
+var import_jsx_runtime117 = require("react/jsx-runtime");
 var getValueArray2 = (value) => {
   if (value) {
     return Array.isArray(value) ? value : [value];
@@ -9358,16 +9337,16 @@ function TogglesInternal({
     onValueChange: handleValueChange,
     ...multiple ? { type: "multiple", value: currentValue } : { type: "single", value: currentValue[0] ?? "" }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime118.jsxs)("div", { ref, className, children: [
-    label && /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "mb-2", children: /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "select-none text-base font-normal text-[var(--chekin-color-brand-navy)]", children: label }) }),
-    /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(ToggleGroup, { className: groupClassName, ...toggleGroupProps, children: options.map((option, index) => {
+  return /* @__PURE__ */ (0, import_jsx_runtime117.jsxs)("div", { ref, className, children: [
+    label && /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "mb-2", children: /* @__PURE__ */ (0, import_jsx_runtime117.jsx)("div", { className: "select-none text-base font-normal text-[var(--chekin-color-brand-navy)]", children: label }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(ToggleGroup, { className: groupClassName, ...toggleGroupProps, children: options.map((option, index) => {
       const isSelected = Boolean(
         getValueArray2(value).find((selectedValue) => selectedValue === option.value)
       );
       const isDisabled = disabled || disabledItems?.includes(option.value) || option.disabled;
       const isMinSelected = getValueArray2(value).length <= minSelected;
       const isItemReadOnly = readOnly || isMinSelected && isSelected || readonlyItems?.includes(option.value);
-      return /* @__PURE__ */ (0, import_jsx_runtime118.jsx)(
+      return /* @__PURE__ */ (0, import_jsx_runtime117.jsx)(
         ToggleGroupItem,
         {
           value: String(option.value),
@@ -9386,15 +9365,15 @@ var Toggles = (0, import_react66.forwardRef)(TogglesInternal);
 var React29 = __toESM(require("react"), 1);
 var LabelPrimitive2 = __toESM(require("@radix-ui/react-label"), 1);
 var import_class_variance_authority14 = require("class-variance-authority");
-var import_react_i18next22 = require("react-i18next");
+var import_react_i18next23 = require("react-i18next");
 
 // src/text-field/EndIcon.tsx
-var import_jsx_runtime119 = require("react/jsx-runtime");
-var EndIcon = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("div", { className: "pointer-events-none absolute right-3.5 top-1/2 -translate-y-1/2 [&>*]:pointer-events-auto", children });
+var import_jsx_runtime118 = require("react/jsx-runtime");
+var EndIcon = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime118.jsx)("div", { className: "pointer-events-none absolute right-3.5 top-1/2 -translate-y-1/2 [&>*]:pointer-events-auto", children });
 
 // src/text-field/FieldError.tsx
-var import_jsx_runtime120 = require("react/jsx-runtime");
-var FieldError = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)(
+var import_jsx_runtime119 = require("react/jsx-runtime");
+var FieldError = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
   "p",
   {
     id,
@@ -9405,11 +9384,11 @@ var FieldError = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime120
 );
 
 // src/text-field/SupportingText.tsx
-var import_jsx_runtime121 = require("react/jsx-runtime");
-var SupportingText = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("p", { id, className: "mt-1 text-xs italic text-[var(--chekin-color-gray-2)]", children });
+var import_jsx_runtime120 = require("react/jsx-runtime");
+var SupportingText = ({ id, children }) => /* @__PURE__ */ (0, import_jsx_runtime120.jsx)("p", { id, className: "mt-1 text-xs italic text-[var(--chekin-color-gray-2)]", children });
 
 // src/text-field/TextField.tsx
-var import_jsx_runtime122 = require("react/jsx-runtime");
+var import_jsx_runtime121 = require("react/jsx-runtime");
 var textFieldRootClasses = [
   "[--text-field-height:2.75rem]",
   "[--text-field-radius:8px]",
@@ -9516,7 +9495,7 @@ var TextField = React29.forwardRef(
     readOnly,
     ...props
   }, ref) => {
-    const { t } = (0, import_react_i18next22.useTranslation)();
+    const { t } = (0, import_react_i18next23.useTranslation)();
     const hasError = Boolean(error);
     const autoId = React29.useId();
     const inputId = props.id || autoId;
@@ -9530,7 +9509,7 @@ var TextField = React29.forwardRef(
     const errorId = error ? `${inputId}-error` : void 0;
     const ariaDescribedBy = errorId || descriptionId || void 0;
     if (variant === "floating") {
-      return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)(
+      return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)(
         "div",
         {
           className: cn(
@@ -9539,8 +9518,8 @@ var TextField = React29.forwardRef(
             wrapperClassName
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: "relative", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "relative", children: [
+              /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
                 "input",
                 {
                   id: inputId,
@@ -9554,7 +9533,7 @@ var TextField = React29.forwardRef(
                   ...props
                 }
               ),
-              label && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+              label && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
                 LabelPrimitive2.Root,
                 {
                   htmlFor: inputId,
@@ -9568,17 +9547,17 @@ var TextField = React29.forwardRef(
                   children: label
                 }
               ),
-              endIcon && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(EndIcon, { children: endIcon })
+              endIcon && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(EndIcon, { children: endIcon })
             ] }),
-            supportingText && !hasError && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(SupportingText, { id: descriptionId, children: supportingText }),
-            hasError && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(FieldError, { id: errorId, children: error })
+            supportingText && !hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SupportingText, { id: descriptionId, children: supportingText }),
+            hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(FieldError, { id: errorId, children: error })
           ]
         }
       );
     }
-    return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: cn("flex w-full flex-col", textFieldRootClasses, wrapperClassName), children: [
-      label && /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: "mb-1 flex items-center gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: cn("flex w-full flex-col", textFieldRootClasses, wrapperClassName), children: [
+      label && /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "mb-1 flex items-center gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
           LabelPrimitive2.Root,
           {
             htmlFor: inputId,
@@ -9586,14 +9565,14 @@ var TextField = React29.forwardRef(
             children: label
           }
         ),
-        optional && /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("span", { className: "text-base leading-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("span", { className: "text-[var(--chekin-color-brand-navy)]", children: "- " }),
-          /* @__PURE__ */ (0, import_jsx_runtime122.jsx)("span", { className: "italic text-[var(--chekin-color-gray-2)]", children: optionalLabel || t("optional") })
+        optional && /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("span", { className: "text-base leading-4", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "text-[var(--chekin-color-brand-navy)]", children: "- " }),
+          /* @__PURE__ */ (0, import_jsx_runtime121.jsx)("span", { className: "italic text-[var(--chekin-color-gray-2)]", children: optionalLabel || t("optional") })
         ] }),
         tooltip
       ] }),
-      /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: "relative", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime121.jsxs)("div", { className: "relative", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(
           "input",
           {
             id: inputId,
@@ -9607,10 +9586,10 @@ var TextField = React29.forwardRef(
             ...props
           }
         ),
-        endIcon && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(EndIcon, { children: endIcon })
+        endIcon && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(EndIcon, { children: endIcon })
       ] }),
-      supportingText && !hasError && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(SupportingText, { id: descriptionId, children: supportingText }),
-      hasError && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(FieldError, { id: errorId, children: error })
+      supportingText && !hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(SupportingText, { id: descriptionId, children: supportingText }),
+      hasError && /* @__PURE__ */ (0, import_jsx_runtime121.jsx)(FieldError, { id: errorId, children: error })
     ] });
   }
 );
@@ -9618,12 +9597,12 @@ TextField.displayName = "TextField";
 
 // src/textarea/Textarea.tsx
 var import_react67 = require("react");
-var import_jsx_runtime123 = require("react/jsx-runtime");
+var import_jsx_runtime122 = require("react/jsx-runtime");
 var Textarea = (0, import_react67.forwardRef)(
   ({ className, textareaClassName, label, disabled, name, invalid, ...textareaProps }, ref) => {
     const inputId = (0, import_react67.useId)();
-    return /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)("div", { className: cn("relative", className), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime122.jsxs)("div", { className: cn("relative", className), children: [
+      /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
         "textarea",
         {
           ref,
@@ -9639,7 +9618,7 @@ var Textarea = (0, import_react67.forwardRef)(
           ...textareaProps
         }
       ),
-      label && /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
+      label && /* @__PURE__ */ (0, import_jsx_runtime122.jsx)(
         "label",
         {
           htmlFor: inputId,
@@ -9657,34 +9636,34 @@ var Textarea = (0, import_react67.forwardRef)(
 Textarea.displayName = "Textarea";
 
 // src/three-dots-loader/ThreeDotsLoader.tsx
-var import_jsx_runtime124 = require("react/jsx-runtime");
+var import_jsx_runtime123 = require("react/jsx-runtime");
 function Dots({
   height,
   width,
   color
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(
     "span",
     {
       className: "inline-flex items-center justify-center gap-[15%]",
       style: { height, width },
       "aria-hidden": "true",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
           "span",
           {
             className: "h-[22%] w-[22%] animate-chekin-three-dots rounded-full [animation-delay:-0.32s]",
             style: { backgroundColor: color }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
           "span",
           {
             className: "h-[22%] w-[22%] animate-chekin-three-dots rounded-full [animation-delay:-0.16s]",
             style: { backgroundColor: color }
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
           "span",
           {
             className: "h-[22%] w-[22%] animate-chekin-three-dots rounded-full",
@@ -9703,31 +9682,32 @@ function ThreeDotsLoader({
   className,
   labelPlacement = "right"
 }) {
-  const dots = /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(Dots, { color, height, width });
+  const dots = /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(Dots, { color, height, width });
   if (label) {
-    return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)(
       "div",
       {
         className: cn(
           "flex items-center justify-center gap-x-[13px] [&>div]:text-sm [&>div]:font-bold [&>div]:uppercase [&>div]:text-[#9696b9] [&>div]:opacity-50",
           className
         ),
-        children: labelPlacement === "right" ? /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(import_jsx_runtime124.Fragment, { children: [
+        role: "progressbar",
+        children: labelPlacement === "right" ? /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_jsx_runtime123.Fragment, { children: [
           dots,
-          /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { children: label })
-        ] }) : /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(import_jsx_runtime124.Fragment, { children: [
-          /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { children: label })
+        ] }) : /* @__PURE__ */ (0, import_jsx_runtime123.jsxs)(import_jsx_runtime123.Fragment, { children: [
+          /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { children: label }),
           dots
         ] })
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { className, children: dots });
+  return /* @__PURE__ */ (0, import_jsx_runtime123.jsx)("div", { role: "progressbar", className, children: dots });
 }
 
 // src/uploaded-files-list/UploadedFilesList.tsx
-var import_lucide_react42 = require("lucide-react");
-var import_jsx_runtime125 = require("react/jsx-runtime");
+var import_lucide_react41 = require("lucide-react");
+var import_jsx_runtime124 = require("react/jsx-runtime");
 function UploadedFilesList({
   files,
   onRemoveFile,
@@ -9736,20 +9716,20 @@ function UploadedFilesList({
   if (!files.length) {
     return null;
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)("div", { className: cn("flex flex-wrap gap-2.5", className), children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime125.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("div", { className: cn("flex flex-wrap gap-2.5", className), children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime124.jsxs)(
     "div",
     {
       className: "flex cursor-default items-center gap-2 rounded border border-[var(--chekin-color-gray-2)] bg-[var(--chekin-color-surface-pressed)] py-1.5 pl-3 pr-1.5",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime125.jsx)("span", { className: "text-nowrap text-sm font-medium leading-5 text-[var(--chekin-color-brand-navy)]", children: file.name }),
-        /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime124.jsx)("span", { className: "text-nowrap text-sm font-medium leading-5 text-[var(--chekin-color-brand-navy)]", children: file.name }),
+        /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(
           "button",
           {
             type: "button",
             onClick: () => onRemoveFile(file.name),
             className: "flex h-[18px] w-[18px] shrink-0 cursor-pointer items-center justify-center rounded bg-[var(--chekin-color-gray-1)] transition-all hover:shadow-md active:opacity-95",
             "aria-label": `Remove ${file.name}`,
-            children: /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(import_lucide_react42.X, { className: "h-3.5 w-3.5 text-white", strokeWidth: 3 })
+            children: /* @__PURE__ */ (0, import_jsx_runtime124.jsx)(import_lucide_react41.X, { className: "h-3.5 w-3.5 text-white", strokeWidth: 3 })
           }
         )
       ]
@@ -9759,9 +9739,9 @@ function UploadedFilesList({
 }
 
 // src/wide-button/WideButton.tsx
-var import_jsx_runtime126 = require("react/jsx-runtime");
+var import_jsx_runtime125 = require("react/jsx-runtime");
 function WideButton({ className, disabled, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime125.jsx)(
     Button,
     {
       variant: "ghost",
@@ -9779,28 +9759,28 @@ function WideButton({ className, disabled, ...props }) {
 
 // src/datepicker/DatePicker.tsx
 var React33 = __toESM(require("react"), 1);
-var import_lucide_react45 = require("lucide-react");
+var import_lucide_react44 = require("lucide-react");
 
 // src/drawer/Drawer.tsx
 var React30 = __toESM(require("react"), 1);
 var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_react_draggable = __toESM(require("react-draggable"), 1);
-var import_jsx_runtime127 = require("react/jsx-runtime");
+var import_jsx_runtime126 = require("react/jsx-runtime");
 var DRAWER_CLOSE_THRESHOLD = 72;
 var DRAWER_MIN_OVERLAY_OPACITY = 0.1;
 function Drawer({ ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(DialogPrimitive2.Root, { "data-slot": "drawer", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Root, { "data-slot": "drawer", ...props });
 }
 function DrawerTrigger({ ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(DialogPrimitive2.Trigger, { "data-slot": "drawer-trigger", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Trigger, { "data-slot": "drawer-trigger", ...props });
 }
 function DrawerPortal({ ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(DialogPrimitive2.Portal, { "data-slot": "drawer-portal", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Portal, { "data-slot": "drawer-portal", ...props });
 }
 function DrawerClose({ ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(DialogPrimitive2.Close, { "data-slot": "drawer-close", ...props });
+  return /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(DialogPrimitive2.Close, { "data-slot": "drawer-close", ...props });
 }
-var DrawerOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+var DrawerOverlay = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
   DialogPrimitive2.Overlay,
   {
     ref,
@@ -9849,14 +9829,14 @@ var DrawerContent = React30.forwardRef(
       },
       [onClose]
     );
-    return /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(DrawerPortal, { container: finalContainer, children: [
-      lockScroll ? /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(DrawerPortal, { container: finalContainer, children: [
+      lockScroll ? /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
         DrawerOverlay,
         {
           style: { opacity: overlayOpacity },
           onClick: closeOnOverlayClick ? onClose : void 0
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+      ) : /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
         "div",
         {
           className: cn(DrawerOverlayClasses),
@@ -9864,7 +9844,7 @@ var DrawerContent = React30.forwardRef(
           onClick: closeOnOverlayClick ? onClose : void 0
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
         DialogPrimitive2.Content,
         {
           asChild: true,
@@ -9880,7 +9860,7 @@ var DrawerContent = React30.forwardRef(
             }
           },
           ...props,
-          children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { className: "fixed inset-x-0 bottom-0 top-auto z-50 outline-none", children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+          children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: "fixed inset-x-0 bottom-0 top-auto z-50 outline-none", children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
             import_react_draggable.default,
             {
               axis: "y",
@@ -9890,7 +9870,7 @@ var DrawerContent = React30.forwardRef(
               onDrag: handleDrag,
               onStop: handleStop,
               position: { x: 0, y: dragOffsetY },
-              children: /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(
+              children: /* @__PURE__ */ (0, import_jsx_runtime126.jsxs)(
                 "div",
                 {
                   ref: nodeRef,
@@ -9899,15 +9879,15 @@ var DrawerContent = React30.forwardRef(
                     className
                   ),
                   children: [
-                    showHandle && /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+                    showHandle && /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
                       "div",
                       {
                         "data-drawer-handle": true,
                         className: "mx-auto flex h-8 w-24 cursor-grab touch-none items-center justify-center active:cursor-grabbing",
-                        children: /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("span", { className: "block h-1.5 w-12 rounded-full bg-[#D9D7D3]" })
+                        children: /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("span", { className: "block h-1.5 w-12 rounded-full bg-[#D9D7D3]" })
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children })
+                    /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children })
                   ]
                 }
               )
@@ -9919,7 +9899,7 @@ var DrawerContent = React30.forwardRef(
   }
 );
 DrawerContent.displayName = DialogPrimitive2.Content.displayName;
-var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
   "div",
   {
     className: cn("flex flex-col gap-2 px-5 pt-2 text-center", className),
@@ -9927,9 +9907,9 @@ var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
   }
 );
 DrawerHeader.displayName = "DrawerHeader";
-var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { className: cn("flex flex-col gap-2 p-5", className), ...props });
+var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)("div", { className: cn("flex flex-col gap-2 p-5", className), ...props });
 DrawerFooter.displayName = "DrawerFooter";
-var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
   DialogPrimitive2.Title,
   {
     ref,
@@ -9939,7 +9919,7 @@ var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DrawerTitle.displayName = DialogPrimitive2.Title.displayName;
-var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
+var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime126.jsx)(
   DialogPrimitive2.Description,
   {
     ref,
@@ -10372,7 +10352,7 @@ function useDatePickerWheel({
 }
 
 // src/datepicker/DatePickerWheelColumn.tsx
-var import_jsx_runtime128 = require("react/jsx-runtime");
+var import_jsx_runtime127 = require("react/jsx-runtime");
 var spacerHeight = DATE_PICKER_OPTION_HEIGHT * DATE_PICKER_WHEEL_BUFFER_OPTIONS;
 function DatePickerWheelColumn({
   id,
@@ -10386,7 +10366,7 @@ function DatePickerWheelColumn({
   onOptionSelect,
   column
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { className: "relative z-10 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { className: "relative z-10 min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime127.jsxs)(
     "div",
     {
       id,
@@ -10403,14 +10383,14 @@ function DatePickerWheelColumn({
         WebkitOverflowScrolling: "touch"
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { style: { height: `${spacerHeight}px` } }),
+        /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { style: { height: `${spacerHeight}px` } }),
         items.map((item, index) => {
           const { style } = getWheelOptionStyles(
             index,
             scrollTop,
             DATE_PICKER_OPTION_HEIGHT
           );
-          return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime127.jsx)(
             "button",
             {
               id: `${id}-option-${index}`,
@@ -10426,14 +10406,14 @@ function DatePickerWheelColumn({
             `${column}-${item}-${index}`
           );
         }),
-        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)("div", { style: { height: `${spacerHeight}px` } })
+        /* @__PURE__ */ (0, import_jsx_runtime127.jsx)("div", { style: { height: `${spacerHeight}px` } })
       ]
     }
   ) });
 }
 
 // src/datepicker/DatePickerContent.tsx
-var import_jsx_runtime129 = require("react/jsx-runtime");
+var import_jsx_runtime128 = require("react/jsx-runtime");
 function DatePickerBody({
   baseId,
   label,
@@ -10455,19 +10435,19 @@ function DatePickerBody({
   onOptionSelect,
   onDone
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { className: "px-6 pb-4 pt-1 bg-white", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)("div", { className: "relative overflow-hidden rounded-[24px]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime129.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_runtime129.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_runtime129.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { className: "px-6 pb-4 pt-1 bg-white", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { className: "relative overflow-hidden rounded-[24px]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime128.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_runtime128.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_runtime128.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_runtime129.jsxs)("div", { className: "relative grid grid-cols-[1.35fr_0.7fr_1fr] gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)("div", { className: "relative grid grid-cols-[1.35fr_0.7fr_1fr] gap-1", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
           DatePickerWheelColumn,
           {
             id: `${baseId}-month`,
@@ -10482,7 +10462,7 @@ function DatePickerBody({
             onOptionSelect
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
           DatePickerWheelColumn,
           {
             id: `${baseId}-day`,
@@ -10497,7 +10477,7 @@ function DatePickerBody({
             onOptionSelect
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
           DatePickerWheelColumn,
           {
             id: `${baseId}-year`,
@@ -10514,7 +10494,7 @@ function DatePickerBody({
         )
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
+    /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
   ] });
 }
 function DatePickerContent({
@@ -10542,7 +10522,7 @@ function DatePickerContent({
   onColumnKeyDown,
   onOptionSelect
 }) {
-  const body = /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+  const body = /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(
     DatePickerBody,
     {
       baseId,
@@ -10567,27 +10547,27 @@ function DatePickerContent({
     }
   );
   if (isMobile) {
-    return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
       DrawerContent,
       {
         onClose: () => onOpenChange(false),
         className: "rounded-none rounded-t-[32px] border-0 p-0",
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DrawerTitle, { className: "sr-only", children: title }),
-          /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DrawerTitle, { className: "sr-only", children: title }),
+          /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DrawerDescription, { className: "sr-only", children: label }),
           body
         ]
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime128.jsxs)(
     DialogContent,
     {
       className: "max-w-[520px] rounded-[28px] border-0 p-0 shadow-xl",
       showCloseButton: false,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DialogTitle, { className: "sr-only", children: title }),
-        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(DialogDescription, { className: "sr-only", children: label }),
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DialogTitle, { className: "sr-only", children: title }),
+        /* @__PURE__ */ (0, import_jsx_runtime128.jsx)(DialogDescription, { className: "sr-only", children: label }),
         body
       ]
     }
@@ -10611,12 +10591,12 @@ var DEVICE = {
 
 // src/field-trigger/FieldTrigger.tsx
 var React32 = __toESM(require("react"), 1);
-var import_lucide_react44 = require("lucide-react");
-var import_react_i18next23 = require("react-i18next");
+var import_lucide_react43 = require("lucide-react");
+var import_react_i18next24 = require("react-i18next");
 
 // src/field-error-message/FieldErrorMessage.tsx
-var import_lucide_react43 = require("lucide-react");
-var import_jsx_runtime130 = require("react/jsx-runtime");
+var import_lucide_react42 = require("lucide-react");
+var import_jsx_runtime129 = require("react/jsx-runtime");
 function FieldErrorMessage({
   id,
   message,
@@ -10627,7 +10607,7 @@ function FieldErrorMessage({
 }) {
   const content = message ?? children;
   if (!content) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime129.jsxs)(
     "p",
     {
       id,
@@ -10639,21 +10619,21 @@ function FieldErrorMessage({
       ),
       ...props,
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
-          import_lucide_react43.AlertCircle,
+        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)(
+          import_lucide_react42.AlertCircle,
           {
             className: "h-[18px] w-[18px] shrink-0 text-white",
             fill: "var(--error-message-color)"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("span", { children: content })
+        /* @__PURE__ */ (0, import_jsx_runtime129.jsx)("span", { children: content })
       ]
     }
   );
 }
 
 // src/field-trigger/FieldTrigger.tsx
-var import_jsx_runtime131 = require("react/jsx-runtime");
+var import_jsx_runtime130 = require("react/jsx-runtime");
 var FieldTrigger = React32.forwardRef(
   ({
     as = "button",
@@ -10685,20 +10665,20 @@ var FieldTrigger = React32.forwardRef(
     onKeyDown,
     ...props
   }, ref) => {
-    const { t } = (0, import_react_i18next23.useTranslation)();
+    const { t } = (0, import_react_i18next24.useTranslation)();
     const hasValue = Boolean(valueText);
     const isRaised = hasValue || forceFloatingLabel;
     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_runtime131.jsxs)("span", { className: "inline-flex max-w-full items-center gap-1.5 align-middle", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("span", { className: "min-w-0 truncate", children: visibleLabelText }),
-      optionalLabel && /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("span", { className: "shrink-0 text-[12px] relative top-[1px] font-normal leading-4 text-current opacity-70", children: [
+    const resolvedLabelText = visibleLabelText && hasLabelMeta ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("span", { className: "inline-flex max-w-full items-center gap-1.5 align-middle", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("span", { className: "min-w-0 truncate", children: visibleLabelText }),
+      optionalLabel && /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("span", { className: "shrink-0 text-[12px] relative top-[1px] font-normal leading-4 text-current opacity-70", children: [
         "(",
         optionalLabel,
         ")"
       ] }),
-      tooltip && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+      tooltip && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
         HelpTooltip,
         {
           content: tooltip,
@@ -10714,10 +10694,10 @@ var FieldTrigger = React32.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_runtime131.jsxs)("span", { className: "flex items-center gap-2", children: [
+    const resolvedTrailingAdornment = loading || trailingAdornment ? /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("span", { className: "flex items-center gap-2", children: [
       trailingAdornment,
-      loading && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
-        import_lucide_react44.Loader2,
+      loading && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
+        import_lucide_react43.Loader2,
         {
           "aria-hidden": "true",
           className: "h-5 w-5 animate-spin text-[var(--chekin-color-gray-1)]"
@@ -10732,8 +10712,8 @@ var FieldTrigger = React32.forwardRef(
       disabled ? "cursor-not-allowed opacity-50" : loading ? "cursor-progress" : isAirbnbVariant ? "cursor-pointer" : "cursor-text",
       className
     );
-    const sharedContent = /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(import_jsx_runtime131.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)(
+    const sharedContent = /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(import_jsx_runtime130.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)(
         "span",
         {
           className: cn(
@@ -10742,7 +10722,7 @@ var FieldTrigger = React32.forwardRef(
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+            /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
               "span",
               {
                 id: labelId,
@@ -10755,7 +10735,7 @@ var FieldTrigger = React32.forwardRef(
                 children: animatedLabel
               }
             ),
-            children ? children : hasValue ? /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+            children ? children : hasValue ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
               "span",
               {
                 id: valueId,
@@ -10766,11 +10746,11 @@ var FieldTrigger = React32.forwardRef(
                 ),
                 children: valueText
               }
-            ) : /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("span", { id: helperTextId, className: "sr-only", children: placeholder ?? label })
+            ) : /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("span", { id: helperTextId, className: "sr-only", children: placeholder ?? label })
           ]
         }
       ),
-      resolvedTrailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+      resolvedTrailingAdornment && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
         "span",
         {
           "aria-hidden": "true",
@@ -10782,9 +10762,9 @@ var FieldTrigger = React32.forwardRef(
         }
       )
     ] });
-    return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { className: "w-full", children: [
-      topLabel && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)("p", { className: "mb-3 text-[16px] font-semibold leading-5 text-[#222222]", children: topLabel }),
-      as === "button" ? /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime130.jsxs)("div", { className: "w-full", children: [
+      topLabel && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)("p", { className: "mb-3 text-[16px] font-semibold leading-5 text-[#222222]", children: topLabel }),
+      as === "button" ? /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
         "button",
         {
           id,
@@ -10801,7 +10781,7 @@ var FieldTrigger = React32.forwardRef(
           ...props,
           children: sharedContent
         }
-      ) : /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
+      ) : /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(
         "div",
         {
           id,
@@ -10818,14 +10798,14 @@ var FieldTrigger = React32.forwardRef(
           children: sharedContent
         }
       ),
-      errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(FieldErrorMessage, { id: errorId, message: errorMessage })
+      errorMessage && !hideErrorMessage && /* @__PURE__ */ (0, import_jsx_runtime130.jsx)(FieldErrorMessage, { id: errorId, message: errorMessage })
     ] });
   }
 );
 FieldTrigger.displayName = "FieldTrigger";
 
 // src/datepicker/DatePicker.tsx
-var import_jsx_runtime132 = require("react/jsx-runtime");
+var import_jsx_runtime131 = require("react/jsx-runtime");
 var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
 var DatePicker = React33.forwardRef(
   ({
@@ -10942,8 +10922,8 @@ var DatePicker = React33.forwardRef(
         setIsOpen(false);
       }
     }, [isBlocked]);
-    return /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)("div", { className: cn("relative w-full max-w-[var(--max-field-width)]", className), children: [
-      name && /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime131.jsxs)("div", { className: cn("relative w-full max-w-[var(--max-field-width)]", className), children: [
+      name && /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
         "input",
         {
           type: "hidden",
@@ -10951,7 +10931,7 @@ var DatePicker = React33.forwardRef(
           value: resolvedValue ? formatDateInputValue(resolvedValue) : ""
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
         FieldTrigger,
         {
           id: triggerId,
@@ -10978,10 +10958,10 @@ var DatePicker = React33.forwardRef(
           onClick: handleTriggerClick,
           onKeyDown: handleTriggerKeyDown,
           onBlur,
-          trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(import_lucide_react45.Calendar, { className: "h-5 w-5 text-[#1F1F1B]", strokeWidth: 2 })
+          trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(import_lucide_react44.Calendar, { className: "h-5 w-5 text-[#1F1F1B]", strokeWidth: 2 })
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime131.jsx)(
         DatePickerContent,
         {
           baseId: pickerId,
@@ -11015,7 +10995,7 @@ var DatePicker = React33.forwardRef(
 DatePicker.displayName = "DatePicker";
 
 // src/responsive-sheet/ResponsiveSheet.tsx
-var import_jsx_runtime133 = require("react/jsx-runtime");
+var import_jsx_runtime132 = require("react/jsx-runtime");
 function ResponsiveSheet({
   open,
   onClose,
@@ -11050,7 +11030,7 @@ function ResponsiveSheet({
       event.preventDefault();
     }
   };
-  const content = /* @__PURE__ */ (0, import_jsx_runtime133.jsxs)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
     "div",
     {
       className: cn(
@@ -11058,7 +11038,7 @@ function ResponsiveSheet({
         contentClassName
       ),
       children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+        title ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
           "div",
           {
             className: cn(
@@ -11068,7 +11048,7 @@ function ResponsiveSheet({
             children: title
           }
         ) : null,
-        description ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
+        description ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(
           "p",
           {
             className: cn(
@@ -11083,7 +11063,7 @@ function ResponsiveSheet({
     }
   );
   if (isMobileMode) {
-    return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime133.jsxs)(
+    return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(Drawer, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
       DrawerContent,
       {
         onClose,
@@ -11093,14 +11073,14 @@ function ResponsiveSheet({
         onEscapeKeyDown: handleEscapeKeyDown,
         className: cn(className, drawerClassName),
         children: [
-          title ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(DrawerTitle, { className: "sr-only", children: title }) : null,
-          description ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(DrawerDescription, { className: "sr-only", children: description }) : null,
+          title ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DrawerTitle, { className: "sr-only", children: title }) : null,
+          description ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DrawerDescription, { className: "sr-only", children: description }) : null,
           content
         ]
       }
     ) });
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(Dialog, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime133.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(Dialog, { open, onOpenChange: handleOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime132.jsxs)(
     DialogContent,
     {
       showCloseButton,
@@ -11110,8 +11090,8 @@ function ResponsiveSheet({
       className: cn("max-w-[560px] border-0 p-0 shadow-xl", className, dialogClassName),
       lockScroll: false,
       children: [
-        title ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(DialogTitle, { className: "sr-only", children: title }) : null,
-        description ? /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(DialogDescription, { className: "sr-only", children: description }) : null,
+        title ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DialogTitle, { className: "sr-only", children: title }) : null,
+        description ? /* @__PURE__ */ (0, import_jsx_runtime132.jsx)(DialogDescription, { className: "sr-only", children: description }) : null,
         content
       ]
     }
@@ -11120,7 +11100,7 @@ function ResponsiveSheet({
 
 // src/airbnb/input/Input.tsx
 var React34 = __toESM(require("react"), 1);
-var import_jsx_runtime134 = require("react/jsx-runtime");
+var import_jsx_runtime133 = require("react/jsx-runtime");
 var getInputValue = (value) => value != null ? String(value) : "";
 var AirbnbInput = React34.forwardRef(
   ({
@@ -11203,7 +11183,7 @@ var AirbnbInput = React34.forwardRef(
       setIsFocused(false);
       onBlur?.(event);
     };
-    return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime133.jsx)("div", { className: cn("w-full max-w-[var(--max-field-width)]", wrapperClassName), children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
       FieldTrigger,
       {
         as: "div",
@@ -11235,7 +11215,7 @@ var AirbnbInput = React34.forwardRef(
         forceFloatingLabel: shouldShowLabel,
         forceLabelText: hasLabelMeta,
         hideErrorMessage: !renderErrorMessage,
-        children: /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime133.jsx)(
           "input",
           {
             ...props,
@@ -11272,13 +11252,13 @@ AirbnbInput.displayName = "Input";
 
 // src/airbnb/phone-field/PhoneField.tsx
 var React40 = __toESM(require("react"), 1);
-var import_lucide_react47 = require("lucide-react");
+var import_lucide_react46 = require("lucide-react");
 
 // src/airbnb/select/Select.tsx
 var React39 = __toESM(require("react"), 1);
 
 // src/airbnb/select/SelectDesktopMenu.tsx
-var import_jsx_runtime135 = require("react/jsx-runtime");
+var import_jsx_runtime134 = require("react/jsx-runtime");
 function SelectDesktopMenu({
   id,
   options,
@@ -11297,7 +11277,7 @@ function SelectDesktopMenu({
   noOptionsMessage
 }) {
   const emptyMessage = noOptionsMessage?.();
-  return /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)(
     "div",
     {
       id,
@@ -11310,12 +11290,12 @@ function SelectDesktopMenu({
       onKeyDown,
       className: cn("max-h-[280px] overflow-y-auto p-2 outline-none", menuClassName),
       children: [
-        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime135.jsx)("div", { className: "px-4 py-3 text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : null,
+        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime134.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_runtime135.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime134.jsx)(
             "button",
             {
               id: getOptionId2(index),
@@ -11347,7 +11327,7 @@ function SelectDesktopMenu({
 }
 
 // src/airbnb/select/SelectDesktopContent.tsx
-var import_jsx_runtime136 = require("react/jsx-runtime");
+var import_jsx_runtime135 = require("react/jsx-runtime");
 function SelectDesktopContent({
   isOpen,
   listboxId,
@@ -11368,14 +11348,14 @@ function SelectDesktopContent({
   noOptionsMessage
 }) {
   if (!isOpen) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime135.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_runtime136.jsx)(
+      children: /* @__PURE__ */ (0, import_jsx_runtime135.jsx)(
         SelectDesktopMenu,
         {
           id: listboxId,
@@ -11473,7 +11453,7 @@ function getMobileOptionStyles(index, scrollTop) {
 }
 
 // src/airbnb/select/SelectMobileWheel.tsx
-var import_jsx_runtime137 = require("react/jsx-runtime");
+var import_jsx_runtime136 = require("react/jsx-runtime");
 function SelectMobileWheel({
   id,
   options,
@@ -11492,7 +11472,7 @@ function SelectMobileWheel({
 }) {
   const spacerHeight2 = getWheelSpacerHeight();
   const emptyMessage = noOptionsMessage?.();
-  return /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
     "div",
     {
       id,
@@ -11504,10 +11484,10 @@ function SelectMobileWheel({
       onKeyDown,
       className: cn("relative overflow-hidden outline-none", menuClassName),
       children: [
-        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime137.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_runtime137.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_runtime137.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_runtime137.jsx)(
+        options.length === 0 && emptyMessage ? /* @__PURE__ */ (0, import_jsx_runtime136.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_runtime136.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_runtime136.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_runtime136.jsx)(
           "div",
           {
             "aria-hidden": true,
@@ -11517,7 +11497,7 @@ function SelectMobileWheel({
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(
+        /* @__PURE__ */ (0, import_jsx_runtime136.jsxs)(
           "div",
           {
             ref: listRef,
@@ -11532,11 +11512,11 @@ function SelectMobileWheel({
               WebkitOverflowScrolling: "touch"
             },
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime137.jsx)("div", { style: { height: `${spacerHeight2}px` } }),
+              /* @__PURE__ */ (0, import_jsx_runtime136.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_runtime137.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime136.jsx)(
                   "button",
                   {
                     id: getOptionId2(index),
@@ -11557,7 +11537,7 @@ function SelectMobileWheel({
                   optionKey
                 );
               }),
-              /* @__PURE__ */ (0, import_jsx_runtime137.jsx)("div", { style: { height: `${spacerHeight2}px` } })
+              /* @__PURE__ */ (0, import_jsx_runtime136.jsx)("div", { style: { height: `${spacerHeight2}px` } })
             ]
           }
         )
@@ -11567,7 +11547,7 @@ function SelectMobileWheel({
 }
 
 // src/airbnb/select/SelectMobileContent.tsx
-var import_jsx_runtime138 = require("react/jsx-runtime");
+var import_jsx_runtime137 = require("react/jsx-runtime");
 function SelectMobileContent({
   open,
   onOpenChange,
@@ -11591,11 +11571,11 @@ function SelectMobileContent({
   getOptionId: getOptionId2,
   noOptionsMessage
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
-    /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(DrawerDescription, { className: "sr-only", children: label }),
-    /* @__PURE__ */ (0, import_jsx_runtime138.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(Drawer, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)(DrawerContent, { onClose, lockScroll: false, children: [
+    /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
+    /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime137.jsxs)("div", { className: "px-6 pb-4 pt-1", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(
         SelectMobileWheel,
         {
           id: listboxId,
@@ -11614,15 +11594,15 @@ function SelectMobileContent({
           noOptionsMessage
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
+      /* @__PURE__ */ (0, import_jsx_runtime137.jsx)(Button, { type: "button", onClick: onDone, className: "mt-4 h-12 mb-8 w-full", children: doneLabel })
     ] })
   ] }) });
 }
 
 // src/airbnb/select/SelectTrigger.tsx
 var React35 = __toESM(require("react"), 1);
-var import_lucide_react46 = require("lucide-react");
-var import_jsx_runtime139 = require("react/jsx-runtime");
+var import_lucide_react45 = require("lucide-react");
+var import_jsx_runtime138 = require("react/jsx-runtime");
 var SelectTrigger2 = React35.forwardRef(
   ({
     id,
@@ -11648,7 +11628,7 @@ var SelectTrigger2 = React35.forwardRef(
     onKeyDown,
     onBlur
   }, ref) => {
-    return /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
       FieldTrigger,
       {
         id,
@@ -11677,8 +11657,8 @@ var SelectTrigger2 = React35.forwardRef(
         onClick,
         onKeyDown,
         onBlur,
-        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
-          import_lucide_react46.ChevronDown,
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime138.jsx)(
+          import_lucide_react45.ChevronDown,
           {
             className: open ? "h-6 w-6 rotate-180 text-[#1F1F1B] transition-transform" : "h-6 w-6 text-[#1F1F1B] transition-transform"
           }
@@ -12039,7 +12019,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
 }
 
 // src/airbnb/select/Select.tsx
-var import_jsx_runtime140 = require("react/jsx-runtime");
+var import_jsx_runtime139 = require("react/jsx-runtime");
 var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
   options = [],
   value,
@@ -12216,13 +12196,13 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
       handleMobileOpenChange(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime139.jsxs)(
     "div",
     {
       ref: containerRef,
       className: cn("relative w-full max-w-[var(--max-field-width)]", className),
       children: [
-        name && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
+        name && /* @__PURE__ */ (0, import_jsx_runtime139.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
         renderTrigger ? renderTrigger({
           id: triggerId,
           open: isOpen,
@@ -12244,7 +12224,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
           onClick: handleTriggerClick,
           onKeyDown: handleRootTriggerKeyDown,
           onBlur
-        }) : /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+        }) : /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
           SelectTrigger2,
           {
             id: triggerId,
@@ -12272,7 +12252,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
             onBlur
           }
         ),
-        isMobile ? /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+        isMobile ? /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
           SelectMobileContent,
           {
             open: isOpen,
@@ -12297,7 +12277,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
             getOptionId: getOptionId2,
             noOptionsMessage
           }
-        ) : /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+        ) : /* @__PURE__ */ (0, import_jsx_runtime139.jsx)(
           SelectDesktopContent,
           {
             isOpen,
@@ -12331,7 +12311,7 @@ var AirbnbSelect = React39.forwardRef(function AirbnbSelect2({
 });
 
 // src/airbnb/phone-field/PhoneField.tsx
-var import_jsx_runtime141 = require("react/jsx-runtime");
+var import_jsx_runtime140 = require("react/jsx-runtime");
 function formatPhoneCodeOptionLabel(option) {
   const label = String(option.label);
   const value = String(option.value);
@@ -12378,9 +12358,9 @@ var PhoneField = React40.forwardRef(
     const hasInvalidState = Boolean(error) || Boolean(invalid);
     const isBlocked = Boolean(disabled) || Boolean(loading);
     const isCodeBlocked = isBlocked || Boolean(codeReadOnly);
-    return /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
-      name && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
-      codeName && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
+    return /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)("div", { className: cn("w-full max-w-[var(--max-field-width)]", className), children: [
+      name && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("input", { type: "hidden", name, value: combinedValue, disabled }),
+      codeName && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
         "input",
         {
           type: "hidden",
@@ -12389,7 +12369,7 @@ var PhoneField = React40.forwardRef(
           disabled
         }
       ),
-      numberName && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
+      numberName && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
         "input",
         {
           type: "hidden",
@@ -12398,7 +12378,7 @@ var PhoneField = React40.forwardRef(
           disabled
         }
       ),
-      topLabel && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
+      topLabel && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
         "label",
         {
           htmlFor: inputId,
@@ -12406,8 +12386,8 @@ var PhoneField = React40.forwardRef(
           children: topLabel
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)("div", { className: "flex items-stretch", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)("div", { className: "flex items-stretch", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
           AirbnbSelect,
           {
             ref,
@@ -12438,7 +12418,7 @@ var PhoneField = React40.forwardRef(
               onClick,
               onKeyDown,
               valueLabel
-            }) => /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)(
+            }) => /* @__PURE__ */ (0, import_jsx_runtime140.jsxs)(
               "button",
               {
                 id,
@@ -12460,9 +12440,9 @@ var PhoneField = React40.forwardRef(
                   triggerDisabled ? "cursor-not-allowed opacity-50" : triggerLoading ? "cursor-progress" : "cursor-pointer"
                 ),
                 children: [
-                  /* @__PURE__ */ (0, import_jsx_runtime141.jsx)("span", { children: valueLabel ?? codePlaceholder }),
-                  /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
-                    import_lucide_react47.ChevronDown,
+                  /* @__PURE__ */ (0, import_jsx_runtime140.jsx)("span", { children: valueLabel ?? codePlaceholder }),
+                  /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
+                    import_lucide_react46.ChevronDown,
                     {
                       className: cn("h-5 w-5 transition-transform", open ? "rotate-180" : ""),
                       strokeWidth: 2
@@ -12473,7 +12453,7 @@ var PhoneField = React40.forwardRef(
             )
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(
           AirbnbInput,
           {
             id: inputId,
@@ -12505,7 +12485,7 @@ var PhoneField = React40.forwardRef(
           }
         )
       ] }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(FieldErrorMessage, { message: error })
+      error && /* @__PURE__ */ (0, import_jsx_runtime140.jsx)(FieldErrorMessage, { message: error })
     ] });
   }
 );
@@ -12513,15 +12493,15 @@ PhoneField.displayName = "PhoneField";
 
 // src/airbnb/search-input/SearchInput.tsx
 var React41 = __toESM(require("react"), 1);
-var import_react_i18next24 = require("react-i18next");
-var import_lucide_react48 = require("lucide-react");
-var import_jsx_runtime142 = require("react/jsx-runtime");
+var import_react_i18next25 = require("react-i18next");
+var import_lucide_react47 = require("lucide-react");
+var import_jsx_runtime141 = require("react/jsx-runtime");
 var AirbnbSearchInput = React41.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
-  const { t } = (0, import_react_i18next24.useTranslation)();
+  const { t } = (0, import_react_i18next25.useTranslation)();
   const placeholderText = placeholder || t("search_property") + "...";
-  return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(import_lucide_react48.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
-    /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime141.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_lucide_react47.Search, { className: "absolute left-4 top-1/2 h-5 w-5 -translate-y-1/2 transform text-[#9696B9]" }),
+    /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(
       "input",
       {
         ...props,
@@ -12540,13 +12520,13 @@ var AirbnbSearchInput = React41.forwardRef(({ onReset, placeholder, wrapperClass
         )
       }
     ),
-    onReset && /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
+    onReset && /* @__PURE__ */ (0, import_jsx_runtime141.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_runtime142.jsx)(import_lucide_react48.X, { className: "h-5 w-5" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime141.jsx)(import_lucide_react47.X, { className: "h-5 w-5" })
       }
     )
   ] });
@@ -12555,10 +12535,10 @@ AirbnbSearchInput.displayName = "SearchInput";
 
 // src/searchable-select/SearchableSelect.tsx
 var React42 = __toESM(require("react"), 1);
-var import_lucide_react49 = require("lucide-react");
+var import_lucide_react48 = require("lucide-react");
 var import_react_virtual2 = require("@tanstack/react-virtual");
 var import_react68 = require("react");
-var import_jsx_runtime143 = require("react/jsx-runtime");
+var import_jsx_runtime142 = require("react/jsx-runtime");
 var ROW_HEIGHT = 48;
 var DESKTOP_LIST_HEIGHT = 280;
 var MOBILE_LIST_HEIGHT = 420;
@@ -12727,7 +12707,7 @@ var SearchableSelectInternal = ({
       }
     }
   }
-  const content = /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+  const content = /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
     SearchableSelectContent,
     {
       inputId: searchInputId,
@@ -12755,9 +12735,9 @@ var SearchableSelectInternal = ({
     }
   );
   React42.useImperativeHandle(ref, () => triggerRef.current, []);
-  return /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
-    name && /* @__PURE__ */ (0, import_jsx_runtime143.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
-    /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { ref: containerRef, className: cn("relative w-full max-w-[425px]", className), children: [
+    name && /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("input", { type: "hidden", name, value: value ? String(value.value) : "" }),
+    /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
       FieldTrigger,
       {
         id: `${reactId}-trigger`,
@@ -12792,8 +12772,8 @@ var SearchableSelectInternal = ({
         },
         onKeyDown: handleTriggerKeyDown,
         onBlur,
-        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
-          import_lucide_react49.ChevronDown,
+        trailingAdornment: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
+          import_lucide_react48.ChevronDown,
           {
             className: cn(
               "h-6 w-6 text-[#1F1F1B] transition-transform",
@@ -12803,7 +12783,7 @@ var SearchableSelectInternal = ({
         )
       }
     ),
-    isMobile ? /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+    isMobile ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
       Drawer,
       {
         open,
@@ -12815,13 +12795,13 @@ var SearchableSelectInternal = ({
           }
           closeSelect();
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
-          /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
-          /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(DrawerDescription, { className: "sr-only", children: label }),
-          /* @__PURE__ */ (0, import_jsx_runtime143.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
+        children: /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)(DrawerContent, { onClose: closeSelect, lockScroll: false, children: [
+          /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(DrawerTitle, { className: "sr-only", children: mobileTitle ?? label }),
+          /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(DrawerDescription, { className: "sr-only", children: label }),
+          /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("div", { className: "px-5 pb-5 pt-1", children: content })
         ] })
       }
-    ) : open ? /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+    ) : open ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
       "div",
       {
         className: cn(
@@ -12888,16 +12868,16 @@ function SearchableSelectContent({
       virtualizer.scrollToIndex(highlightedIndex, { align: "auto" });
     }
   }, [highlightedIndex, virtualizer]);
-  return /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)("div", { className: "p-2", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime143.jsxs)("div", { className: "relative mb-2", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
-        import_lucide_react49.Search,
+  return /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { className: "p-2", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime142.jsxs)("div", { className: "relative mb-2", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
+        import_lucide_react48.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_runtime143.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
         "input",
         {
           id: inputId,
@@ -12916,7 +12896,7 @@ function SearchableSelectContent({
         }
       )
     ] }),
-    loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime143.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime143.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+    loading && options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: loadingText }) : options.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("div", { className: "px-4 py-5 text-center text-base leading-6 text-[#6C6C6C]", children: emptyMessage }) : /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
       "div",
       {
         id: listboxId,
@@ -12925,7 +12905,7 @@ function SearchableSelectContent({
         "aria-labelledby": labelId,
         className: cn("overflow-y-auto outline-none", menuClassName),
         style: { height: Math.min(height, rowCount * ROW_HEIGHT) },
-        children: /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+        children: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
           "div",
           {
             className: "relative w-full",
@@ -12933,7 +12913,7 @@ function SearchableSelectContent({
             children: virtualItems.map((virtualItem) => {
               const option = options[virtualItem.index];
               if (!option) {
-                return /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+                return /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
                   "div",
                   {
                     className: "absolute left-0 top-0 flex w-full items-center px-4 text-base leading-6 text-[#6C6C6C]",
@@ -12948,7 +12928,7 @@ function SearchableSelectContent({
               }
               const isSelected = value?.value === option.value;
               const isHighlighted = virtualItem.index === highlightedIndex;
-              return /* @__PURE__ */ (0, import_jsx_runtime143.jsx)(
+              return /* @__PURE__ */ (0, import_jsx_runtime142.jsx)(
                 "button",
                 {
                   id: getOptionId(idPrefix, virtualItem.index),
@@ -12970,7 +12950,7 @@ function SearchableSelectContent({
                     height: `${virtualItem.size}px`,
                     transform: `translateY(${virtualItem.start}px)`
                   },
-                  children: /* @__PURE__ */ (0, import_jsx_runtime143.jsx)("span", { className: "truncate text-center", children: String(option.label) })
+                  children: /* @__PURE__ */ (0, import_jsx_runtime142.jsx)("span", { className: "truncate text-center", children: String(option.label) })
                 },
                 `${String(option.value)}-${virtualItem.index}`
               );
@@ -13129,7 +13109,6 @@ function getNextEnabledIndex(options, startIndex, step) {
   LargeModal,
   LearnMoreButton,
   Link,
-  Loader,
   LoadingBar,
   METRIC_CARD_VARIANTS,
   MetricCard,