@chekinapp/ui 0.0.21 → 0.0.23

package/dist/index.cjs

@@ -293,10 +293,26 @@ __export(index_exports, {
   toggleVariants: () => toggleVariants,
   uiKitI18nResources: () => uiKitI18nResources,
   uiKitTranslations: () => uiKitTranslations,
+  useAbortController: () => useAbortController,
+  useClickEscape: () => useClickEscape,
+  useCombinedRef: () => useCombinedRef,
+  useDebounce: () => useDebounce,
+  useEvent: () => useEvent,
+  useHover: () => useHover,
+  useIsMobile: () => useIsMobile,
+  useIsMounted: () => useIsMounted,
+  useModalControls: () => useModalControls,
+  useOutsideClick: () => useOutsideClick,
+  usePrevious: () => usePrevious,
   useRadioOptions: () => useRadioOptions,
+  useScreenResize: () => useScreenResize,
+  useScrollFrameIntoView: () => useScrollFrameIntoView,
+  useScrollToTop: () => useScrollToTop,
   useSidebar: () => useSidebar,
   useSidebarMenuButton: () => useSidebarMenuButton,
   useSidebarSafe: () => useSidebarSafe,
+  useTimeout: () => useTimeout,
+  useTimer: () => useTimer,
   useUpdateToast: () => useUpdateToast
 });
 module.exports = __toCommonJS(index_exports);
@@ -348,10 +364,11 @@ var AccordionTrigger = React.forwardRef(({ className, children, openIcon, closed
           "div",
           {
             className: cn(
+              "accordion__icon",
+              Accordion_default.accordion__icon,
               "shrink-0 rounded-full p-0.5",
               "transition-colors duration-200",
-              "group-data-[state=open]:text-primary group-data-[state=closed]:text-muted-foreground",
-              "relative h-4 w-4"
+              "relative"
             ),
             children: [
               /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
@@ -413,6 +430,11 @@ AccordionContent.displayName = AccordionPrimitive.Content.displayName;
 
 // src/alert-box/AlertBox.tsx
 var import_lucide_react2 = require("lucide-react");
+
+// src/alert-box/AlertBox.module.css
+var AlertBox_default = {};
+
+// src/alert-box/AlertBox.tsx
 var import_jsx_runtime2 = require("react/jsx-runtime");
 var AlertType = /* @__PURE__ */ ((AlertType2) => {
   AlertType2["INFO"] = "INFO";
@@ -440,12 +462,12 @@ var sizeClasses = {
   ["M" /* M */]: "p-4 text-base font-medium items-start",
   ["L" /* L */]: "px-6 py-5 items-start"
 };
-var typeClasses = {
-  ["INFO" /* INFO */]: "bg-blue-50 [&_svg]:text-chekin-blue",
-  ["WARNING" /* WARNING */]: "bg-amber-100 [&_svg]:text-amber-600",
-  ["ERROR" /* ERROR */]: "bg-red-50 [&_svg]:text-chekin-red",
-  ["LIGHT" /* LIGHT */]: "",
-  ["SUCCESS" /* SUCCESS */]: "bg-emerald-50 text-chekin-navy [&_svg]:text-emerald-600"
+var typeStyles = {
+  ["INFO" /* INFO */]: AlertBox_default["alertBox--info"],
+  ["WARNING" /* WARNING */]: AlertBox_default["alertBox--warning"],
+  ["ERROR" /* ERROR */]: AlertBox_default["alertBox--error"],
+  ["SUCCESS" /* SUCCESS */]: AlertBox_default["alertBox--success"],
+  ["LIGHT" /* LIGHT */]: ""
 };
 function AlertBox({
   text,
@@ -461,9 +483,10 @@ function AlertBox({
     {
       "data-slot": "alert-box",
       className: cn(
-        "flex gap-3 rounded-[10px] [&_svg]:h-5 [&_svg]:w-5 [&_svg]:shrink-0",
+        AlertBox_default.alertBox,
+        "flex gap-3 [&_svg]:h-5 [&_svg]:w-5 [&_svg]:shrink-0",
         sizeClasses[size],
-        typeClasses[type],
+        typeStyles[type],
         className
       ),
       children: [
@@ -480,6 +503,11 @@ var AlertSizes = AlertSize;
 // src/audio-player/AudioPlayer.tsx
 var import_react = require("react");
 var import_lucide_react3 = require("lucide-react");
+
+// src/audio-player/AudioPlayer.module.css
+var AudioPlayer_default = {};
+
+// src/audio-player/AudioPlayer.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function formatTime(seconds) {
   const mins = Math.floor(seconds / 60);
@@ -543,16 +571,12 @@ function AudioPlayer({ src, compact, className }) {
       {
         type: "button",
         className: cn(
-          "inline-flex items-center justify-center rounded-lg bg-chekin-blue hover:bg-chekin-blue-hover",
+          AudioPlayer_default.playButton,
+          "inline-flex items-center justify-center",
           compact ? "h-6 min-w-6 p-1" : "h-8 min-w-8 p-1.5"
         ),
         onClick: togglePlayPause,
-        children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.Pause, { className: cn(compact ? "h-2.5 w-2.5" : "h-3 w-3", "text-white") }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
-          import_lucide_react3.Play,
-          {
-            className: cn(compact ? "h-2.5 w-2.5" : "h-3 w-3", "fill-white text-white")
-          }
-        )
+        children: isPlaying ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.Pause, { className: cn(compact ? "h-2.5 w-2.5" : "h-3 w-3", "fill-current") }) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(import_lucide_react3.Play, { className: cn(compact ? "h-2.5 w-2.5" : "h-3 w-3", "fill-current") })
       }
     ),
     !compact && /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
@@ -560,18 +584,24 @@ function AudioPlayer({ src, compact, className }) {
         "div",
         {
           ref: progressRef,
-          className: "h-1 flex-1 cursor-pointer overflow-hidden rounded-full bg-chekin-gray-3",
+          className: cn(
+            AudioPlayer_default.track,
+            "h-1 flex-1 cursor-pointer overflow-hidden rounded-full"
+          ),
           onClick: handleSeek,
           children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             "div",
             {
-              className: "h-full bg-chekin-blue transition-all duration-100 ease-linear",
+              className: cn(
+                AudioPlayer_default.progress,
+                "h-full transition-all duration-100 ease-linear"
+              ),
               style: { width: `${progress}%` }
             }
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: "min-w-10 text-xs font-medium text-chekin-gray-1", children: isPlaying || currentTime > 0 ? formatTime(currentTime) : formatTime(duration) })
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("span", { className: cn(AudioPlayer_default.time, "min-w-10 text-xs font-medium"), children: isPlaying || currentTime > 0 ? formatTime(currentTime) : formatTime(duration) })
     ] })
   ] });
 }
@@ -580,6 +610,11 @@ AudioPlayer.displayName = "AudioPlayer";
 // src/avatar/Avatar.tsx
 var React2 = __toESM(require("react"), 1);
 var AvatarPrimitive = __toESM(require("@radix-ui/react-avatar"), 1);
+
+// src/avatar/Avatar.module.css
+var Avatar_default = {};
+
+// src/avatar/Avatar.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 var sizeClasses2 = {
   sm: "h-8 w-8",
@@ -610,8 +645,9 @@ var Avatar = React2.forwardRef(({ className, src, alt, fallback, size = "md", fa
         AvatarPrimitive.Fallback,
         {
           className: cn(
-            "flex h-full w-full items-center justify-center rounded-full font-medium text-chekin-gray-1",
-            fallbackClassName ? fallbackClassName : "bg-chekin-gray-3"
+            "flex h-full w-full items-center justify-center rounded-full font-medium",
+            !fallbackClassName && Avatar_default.fallback,
+            fallbackClassName
           ),
           children: fallback
         }
@@ -663,6 +699,11 @@ Badge.displayName = "Badge";
 
 // src/beta-badge/BetaBadge.tsx
 var import_react_i18next = require("react-i18next");
+
+// src/beta-badge/BetaBadge.module.css
+var BetaBadge_default = {};
+
+// src/beta-badge/BetaBadge.tsx
 var import_jsx_runtime6 = require("react/jsx-runtime");
 function BetaBadge({
   className,
@@ -677,8 +718,9 @@ function BetaBadge({
     {
       "data-slot": "beta-badge",
       className: cn(
+        BetaBadge_default.betaBadge,
         "rounded-sm px-2 py-1 text-sm/4 font-semibold uppercase",
-        readOnly ? "bg-chekin-blue/10 text-chekin-blue" : "bg-chekin-gray-1/15 text-chekin-gray-1",
+        readOnly && BetaBadge_default["betaBadge--readonly"],
         className
       ),
       ...props,
@@ -769,6 +811,11 @@ BookmarkTabsTrigger.displayName = "BookmarkTabsTrigger";
 // src/box-option-selector/BoxOptionSelector.tsx
 var import_react2 = require("react");
 var import_react_i18next2 = require("react-i18next");
+
+// src/box-option-selector/BoxOptionSelector.module.css
+var BoxOptionSelector_default = {};
+
+// src/box-option-selector/BoxOptionSelector.tsx
 var import_jsx_runtime8 = require("react/jsx-runtime");
 var BoxOptionSelector = (0, import_react2.forwardRef)(
   ({
@@ -804,8 +851,9 @@ var BoxOptionSelector = (0, import_react2.forwardRef)(
         ref,
         "data-slot": "box-option-selector",
         className: cn(
+          BoxOptionSelector_default.boxOption,
           "flex min-h-[116px] w-full max-w-[400px] cursor-pointer flex-col gap-4 rounded-lg border p-4 transition-all duration-200",
-          isSelected ? "border-chekin-blue bg-chekin-surface-pressed" : "border-chekin-gray-3 bg-white hover:bg-chekin-surface-input-empty",
+          isSelected && BoxOptionSelector_default["boxOption--selected"],
           disabled && "cursor-not-allowed opacity-50"
         ),
         onClick: handleClick,
@@ -866,8 +914,8 @@ function Breadcrumb({
   }
   const isLink = Boolean(to && !current);
   const contentClassName = cn(
-    "flex items-center gap-2.5 text-sm font-medium text-chekin-gray-1",
-    current && "font-bold text-chekin-navy",
+    "flex items-center gap-2.5 text-sm font-medium text-[var(--breadcrumbs-link-color)]",
+    current && "font-bold text-[var(--breadcrumbs-current-color)]",
     isLink && "transition-opacity hover:opacity-80",
     className
   );
@@ -907,7 +955,7 @@ function Breadcrumbs({ className, children }) {
         import_lucide_react4.ChevronRight,
         {
           "aria-hidden": "true",
-          className: "shrink-0 text-chekin-navy",
+          className: "shrink-0 text-[var(--breadcrumbs-separator-color)]",
           size: 16
         }
       ) : null,
@@ -1213,7 +1261,7 @@ function ButtonGroupText({
     {
       "data-slot": "button-group-text",
       className: cn(
-        "flex items-center gap-2 rounded-lg border bg-chekin-surface-input-empty px-2.5 text-sm font-medium",
+        "flex items-center gap-2 rounded-lg border border-[var(--button-group-text-border)] bg-[var(--button-group-text-bg)] px-2.5 text-sm font-medium text-[var(--button-group-text-color)]",
         "[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none",
         className
       ),
@@ -1227,7 +1275,7 @@ ButtonGroupText.displayName = "ButtonGroupText";
 var import_jsx_runtime13 = require("react/jsx-runtime");
 function ButtonsGroupLabel({ children, label, className }) {
   return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("div", { "data-slot": "buttons-group-label", className: cn(className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "mb-2 text-xs font-medium text-chekin-gray-1", children: label }),
+    /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { className: "mb-2 text-xs font-medium text-[var(--buttons-group-label-color)]", children: label }),
     /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("div", { children })
   ] });
 }
@@ -1423,6 +1471,15 @@ var getDocument = () => {
 function getCustomContainer() {
   return getDocument()?.body;
 }
+function scrollToTop(value = 0, behavior) {
+  window.scrollTo({
+    top: value,
+    behavior
+  });
+}
+function isObject(value) {
+  return value !== null && typeof value === "object";
+}
 var isNumeric = (n) => n !== "" && !isNaN(n);
 function toCssSize(size) {
   if (!size) {
@@ -2279,15 +2336,60 @@ function DataTable({ columns, data }) {
 }
 
 // src/dialog/Dialog.tsx
-var React10 = __toESM(require("react"), 1);
+var React11 = __toESM(require("react"), 1);
 var DialogPrimitive = __toESM(require("@radix-ui/react-dialog"), 1);
 var import_react_visually_hidden = require("@radix-ui/react-visually-hidden");
 var import_lucide_react10 = require("lucide-react");
 
-// src/lib/use-combined-ref.ts
+// src/hooks/use-scroll-to-top.ts
 var import_react8 = require("react");
+function useScrollToTop() {
+  (0, import_react8.useEffect)(() => {
+    scrollToTop();
+  }, []);
+}
+
+// src/hooks/use-abort-controller.ts
+var import_react9 = __toESM(require("react"), 1);
+function useAbortController() {
+  const [abortController, setAbortController] = import_react9.default.useState(() => {
+    return new AbortController();
+  });
+  const setupAbortController = import_react9.default.useCallback(() => {
+    const abortController2 = new AbortController();
+    setAbortController(abortController2);
+    return abortController2.signal;
+  }, []);
+  return {
+    abortController,
+    setupAbortController
+  };
+}
+
+// src/hooks/use-click-escape.ts
+var import_react10 = require("react");
+function useClickEscape({ enabled = true, onClick }) {
+  const onClickRef = (0, import_react10.useRef)(onClick);
+  (0, import_react10.useEffect)(() => {
+    onClickRef.current = onClick;
+  }, [onClick]);
+  (0, import_react10.useEffect)(() => {
+    const handleKeyDown = (event) => {
+      if (event.key === "Escape" && enabled) {
+        onClickRef.current?.();
+      }
+    };
+    window.addEventListener("keydown", handleKeyDown);
+    return () => {
+      window.removeEventListener("keydown", handleKeyDown);
+    };
+  }, [enabled]);
+}
+
+// src/hooks/use-combined-ref.ts
+var import_react11 = require("react");
 function useCombinedRef(...refs) {
-  return (0, import_react8.useCallback)(
+  return (0, import_react11.useCallback)(
     (node) => {
       refs.forEach((ref) => {
         if (!ref) return;
@@ -2303,10 +2405,298 @@ function useCombinedRef(...refs) {
   );
 }
 
+// src/hooks/use-event.ts
+var import_react12 = require("react");
+function useEvent(fn) {
+  const fnRef = (0, import_react12.useRef)(fn);
+  (0, import_react12.useLayoutEffect)(() => {
+    fnRef.current = fn;
+  }, [fn]);
+  const eventCb = (0, import_react12.useCallback)(
+    (...args) => {
+      return fnRef.current?.apply(null, args);
+    },
+    [fnRef]
+  );
+  return eventCb;
+}
+
+// src/hooks/use-is-mobile.ts
+var import_react13 = require("react");
+var MOBILE_BREAKPOINT = 768;
+function useIsMobile({ breakpoint = MOBILE_BREAKPOINT } = {}) {
+  const [isMobile, setIsMobile] = (0, import_react13.useState)(void 0);
+  (0, import_react13.useEffect)(() => {
+    const mediaQuery = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);
+    const onChange = () => {
+      setIsMobile(window.innerWidth < breakpoint);
+    };
+    mediaQuery.addEventListener("change", onChange);
+    setIsMobile(window.innerWidth < breakpoint);
+    return () => {
+      mediaQuery.removeEventListener("change", onChange);
+    };
+  }, [breakpoint]);
+  return !!isMobile;
+}
+
+// src/hooks/use-is-mounted.ts
+var import_react14 = require("react");
+function useIsMounted() {
+  const isMounted = (0, import_react14.useRef)(false);
+  (0, import_react14.useEffect)(() => {
+    isMounted.current = true;
+    return () => {
+      isMounted.current = false;
+    };
+  }, []);
+  return isMounted;
+}
+
+// src/hooks/use-modal-controls.ts
+var import_react15 = require("react");
+function useModalControls(initState = false, { disabled } = {}) {
+  const [isOpen, setIsOpen] = (0, import_react15.useState)(initState);
+  const openModal = (0, import_react15.useCallback)(() => {
+    if (disabled) return;
+    setIsOpen(true);
+  }, [disabled]);
+  const closeModal = (0, import_react15.useCallback)(() => {
+    if (disabled) return;
+    setIsOpen(false);
+  }, [disabled]);
+  const toggleModal = (0, import_react15.useCallback)(() => {
+    if (disabled) return;
+    setIsOpen((value) => !value);
+  }, [disabled]);
+  return {
+    isOpen,
+    openModal,
+    closeModal,
+    toggleModal,
+    setIsOpen
+  };
+}
+
+// src/hooks/use-outside-click.ts
+var import_react16 = require("react");
+function useOutsideClick(elementRef, onOutsideClick, nested) {
+  const handleOutsideClick = (0, import_react16.useRef)(onOutsideClick);
+  handleOutsideClick.current = onOutsideClick;
+  const checkNestedElements = (0, import_react16.useCallback)(
+    (event) => {
+      const checkIsElementClickedBySelector = (selector) => {
+        const nestedElement = getDocument().querySelector(selector);
+        return nestedElement?.contains(event.target);
+      };
+      const checkDataAttribute = () => {
+        const target = event.target;
+        if (!target || !(target instanceof HTMLElement)) {
+          return false;
+        }
+        let current = target;
+        while (current) {
+          if (current.hasAttribute("data-exclude-from-outside-click")) {
+            return true;
+          }
+          current = current.parentElement;
+        }
+        return false;
+      };
+      if (nested) {
+        if (typeof nested === "string") {
+          if (checkIsElementClickedBySelector(nested)) return true;
+        } else {
+          if (nested.some(checkIsElementClickedBySelector)) return true;
+        }
+      }
+      return checkDataAttribute();
+    },
+    [nested]
+  );
+  (0, import_react16.useEffect)(() => {
+    function handleClickOutside(event) {
+      const isNestedElement = checkNestedElements(event);
+      if (elementRef?.current && !elementRef.current.contains(event.target) && !isNestedElement) {
+        handleOutsideClick.current?.(event);
+      }
+    }
+    getDocument().addEventListener("mousedown", handleClickOutside, true);
+    getDocument().addEventListener("touchstart", handleClickOutside, true);
+    return () => {
+      getDocument().removeEventListener("mousedown", handleClickOutside, true);
+      getDocument().removeEventListener("touchstart", handleClickOutside, true);
+    };
+  }, [checkNestedElements, elementRef]);
+}
+
+// src/hooks/use-screen-resize.ts
+var import_react17 = require("react");
+var eventName = "resize";
+function useScreenResize(maxWidth) {
+  const [isInitialized, setIsInitialized] = (0, import_react17.useState)(false);
+  const [isMatch, setIsMatch] = (0, import_react17.useState)(false);
+  const handleResizeEvent = (0, import_react17.useCallback)(() => {
+    const adjustedMaxWidth = `${parseInt(maxWidth, 10) - 1}px`;
+    const media = getWindow().matchMedia(`(max-width: ${adjustedMaxWidth})`);
+    setIsInitialized(true);
+    setIsMatch(media?.matches);
+  }, [maxWidth]);
+  (0, import_react17.useLayoutEffect)(() => {
+    handleResizeEvent();
+    getWindow().addEventListener(eventName, handleResizeEvent);
+    return () => {
+      getWindow().removeEventListener(eventName, handleResizeEvent);
+    };
+  }, [handleResizeEvent]);
+  return { isMatch, isInitialized };
+}
+
+// src/hooks/use-scroll-frame-into-view.ts
+var import_react18 = require("react");
+
+// src/lib/runtimeSettings.ts
+function getChekinRuntimeSettings() {
+  return window.ChekinProSettings || window.ChekinHousingsSDKSettings || {};
+}
+function isMobileModalModeAvailable() {
+  const settings = getChekinRuntimeSettings();
+  return !settings.autoHeight;
+}
+
+// src/hooks/use-scroll-frame-into-view.ts
+function useScrollFrameIntoView(active, options = {}) {
+  const { behavior = "smooth", elementRef } = options;
+  (0, import_react18.useEffect)(() => {
+    const sdkWindow = window;
+    if (!active || !getChekinRuntimeSettings()?.autoHeight) {
+      return;
+    }
+    const frame = sdkWindow.chekinCustomFrame;
+    if (!frame) {
+      return;
+    }
+    const parentWindow = window.parent;
+    const scrollToElement = () => {
+      const frameRect = frame.getBoundingClientRect();
+      if (elementRef?.current) {
+        const elementRect = elementRef.current.getBoundingClientRect();
+        const elementCenterInFrame = elementRect.top + elementRect.height / 2;
+        const elementCenterInParent = frameRect.top + elementCenterInFrame;
+        const targetScroll = parentWindow.scrollY + elementCenterInParent - parentWindow.innerHeight / 2;
+        parentWindow.scrollTo({
+          top: Math.max(0, targetScroll),
+          behavior
+        });
+        return;
+      }
+      frame.scrollIntoView({ behavior, block: "start" });
+    };
+    requestAnimationFrame(() => {
+      requestAnimationFrame(scrollToElement);
+    });
+  }, [active, behavior, elementRef]);
+}
+
+// src/hooks/use-debounce.ts
+var import_react19 = require("react");
+function useDebounce(value, delayMs = 1e3, handleChange) {
+  const onChange = useEvent(handleChange);
+  const [debouncedValue, setDebouncedValue] = (0, import_react19.useState)(value);
+  (0, import_react19.useEffect)(() => {
+    const handler = setTimeout(() => {
+      setDebouncedValue(value);
+    }, delayMs);
+    return () => {
+      clearTimeout(handler);
+    };
+  }, [value, delayMs]);
+  (0, import_react19.useEffect)(() => {
+    onChange?.(debouncedValue);
+  }, [debouncedValue, onChange]);
+  return [debouncedValue, setDebouncedValue];
+}
+
+// src/hooks/use-previous.ts
+var import_react20 = require("react");
+function usePrevious(value, defaultValue) {
+  const ref = (0, import_react20.useRef)(defaultValue);
+  (0, import_react20.useEffect)(() => {
+    ref.current = isObject(value) ? { ...value } : value;
+  }, [value]);
+  return ref.current;
+}
+
+// src/hooks/use-timer.ts
+var import_react21 = require("react");
+var useTimer = ({ seconds }) => {
+  const [timeLeft, setTimeLeft] = (0, import_react21.useState)(seconds);
+  const [isTimerRunning, setIsTimerRunning] = (0, import_react21.useState)(true);
+  (0, import_react21.useEffect)(() => {
+    if (!isTimerRunning) return;
+    const timer = setInterval(() => {
+      setTimeLeft((prev) => {
+        if (prev <= 1) {
+          clearInterval(timer);
+          setIsTimerRunning(false);
+          return 0;
+        }
+        return prev - 1;
+      });
+    }, 1e3);
+    return () => clearInterval(timer);
+  }, [isTimerRunning]);
+  const resetTimer = () => {
+    setTimeLeft(seconds);
+    setIsTimerRunning(true);
+  };
+  return {
+    timeLeft,
+    isTimerRunning,
+    resetTimer
+  };
+};
+
+// src/hooks/use-timeout.ts
+var import_react22 = require("react");
+function useTimeout() {
+  const timeoutRef = (0, import_react22.useRef)();
+  const clearTimeoutRef = (0, import_react22.useCallback)(() => {
+    clearTimeout(timeoutRef.current);
+    timeoutRef.current = void 0;
+  }, []);
+  const scheduleTimeout = (0, import_react22.useCallback)(
+    (callback, delay) => {
+      clearTimeoutRef();
+      timeoutRef.current = setTimeout(callback, delay);
+    },
+    [clearTimeoutRef]
+  );
+  (0, import_react22.useEffect)(() => clearTimeoutRef, [clearTimeoutRef]);
+  return { scheduleTimeout, clearTimeoutRef };
+}
+
+// src/hooks/use-hover.ts
+var import_react23 = require("react");
+function useHover() {
+  const [isHovering, setIsHovering] = (0, import_react23.useState)(false);
+  const handleMouseEnter = (0, import_react23.useCallback)(() => {
+    setIsHovering(true);
+  }, []);
+  const handleMouseLeave = (0, import_react23.useCallback)(() => {
+    setIsHovering(false);
+  }, []);
+  return {
+    isHovering,
+    handleMouseEnter,
+    handleMouseLeave
+  };
+}
+
 // src/dialog/Dialog.tsx
 var import_jsx_runtime31 = require("react/jsx-runtime");
 function useIframeTitleFix(titleRef) {
-  React10.useEffect(() => {
+  React11.useEffect(() => {
     if (!window.chekinCustomDocument) {
       return;
     }
@@ -2335,7 +2725,7 @@ function DialogClose({ ...props }) {
 }
 var dialogOverlayClasses = "fixed inset-0 z-50 bg-[var(--dialog-overlay-bg)] data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0";
 var scrollableOverlayClasses = "fixed inset-0 z-50 flex flex-col items-center overflow-y-auto overscroll-none pb-[19px] pt-[20px]";
-var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+var DialogOverlay = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
   DialogPrimitive.Overlay,
   {
     ref,
@@ -2347,7 +2737,7 @@ var DialogOverlay = React10.forwardRef(({ className, ...props }, ref) => /* @__P
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 var dialogContentClasses = "relative z-50 my-auto w-full max-w-[calc(100%-2rem)] rounded-[var(--dialog-content-radius)] border border-[var(--dialog-content-border)] bg-[var(--dialog-content-bg)] p-6 text-[var(--dialog-content-text)] shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 sm:max-w-2xl";
 var dialogCloseButtonClasses = "absolute right-4 top-4 rounded-[var(--dialog-close-radius)] opacity-70 transition-opacity hover:opacity-100 focus:outline-none focus:shadow-chekin-focus disabled:pointer-events-none [&_svg:not([class*=size-])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0";
-var DialogContent = React10.forwardRef(
+var DialogContent = React11.forwardRef(
   ({ className, showCloseButton = true, children, container, lockScroll = true, ...props }, ref) => {
     const contentElement = /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
       DialogPrimitive.Content,
@@ -2395,8 +2785,8 @@ var DialogFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React10.forwardRef(({ className, ...props }, ref) => {
-  const titleRef = React10.useRef(null);
+var DialogTitle = React11.forwardRef(({ className, ...props }, ref) => {
+  const titleRef = React11.useRef(null);
   const combinedRef = useCombinedRef(titleRef, ref);
   useIframeTitleFix(titleRef);
   return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
@@ -2410,7 +2800,7 @@ var DialogTitle = React10.forwardRef(({ className, ...props }, ref) => {
   );
 });
 DialogTitle.displayName = DialogPrimitive.Title.displayName;
-var DialogDescription = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
+var DialogDescription = React11.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
   DialogPrimitive.Description,
   {
     ref,
@@ -2472,9 +2862,9 @@ function ConfirmationDialog({
 }
 
 // src/default-select-trigger/DefaultSelectTrigger.tsx
-var React11 = __toESM(require("react"), 1);
+var React12 = __toESM(require("react"), 1);
 var import_jsx_runtime33 = require("react/jsx-runtime");
-var DefaultSelectTrigger = React11.forwardRef(
+var DefaultSelectTrigger = React12.forwardRef(
   ({
     className,
     disabled,
@@ -2538,17 +2928,17 @@ function DownloadEntryFormsButton({
 }
 
 // src/dropdown-button/DropdownButton.tsx
-var import_react9 = require("react");
+var import_react24 = require("react");
 
 // src/dropdown-menu/DropdownMenu.tsx
-var React12 = __toESM(require("react"), 1);
+var React13 = __toESM(require("react"), 1);
 var RadixMenu = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
 var import_jsx_runtime35 = require("react/jsx-runtime");
 var DropdownMenu = RadixMenu.Root;
 var DropdownMenuTrigger = RadixMenu.Trigger;
 var DropdownMenuPortal = RadixMenu.Portal;
 var DropdownMenuGroup = RadixMenu.Group;
-var DropdownMenuContent = React12.forwardRef(({ className, sideOffset = 6, container, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixMenu.Portal, { container: container || getCustomContainer(), children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+var DropdownMenuContent = React13.forwardRef(({ className, sideOffset = 6, container, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixMenu.Portal, { container: container || getCustomContainer(), children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
   RadixMenu.Content,
   {
     ref,
@@ -2569,9 +2959,9 @@ var itemClasses = [
   "data-[highlighted]:bg-chekin-surface-pressed data-[highlighted]:text-chekin-blue",
   "data-[disabled]:pointer-events-none data-[disabled]:opacity-30"
 ];
-var DropdownMenuItem = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixMenu.Item, { ref, className: cn(itemClasses, className), ...props }));
+var DropdownMenuItem = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(RadixMenu.Item, { ref, className: cn(itemClasses, className), ...props }));
 DropdownMenuItem.displayName = "DropdownMenuItem";
-var DropdownMenuLabel = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+var DropdownMenuLabel = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
   RadixMenu.Label,
   {
     ref,
@@ -2583,7 +2973,7 @@ var DropdownMenuLabel = React12.forwardRef(({ className, ...props }, ref) => /*
   }
 ));
 DropdownMenuLabel.displayName = "DropdownMenuLabel";
-var DropdownMenuSeparator = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
+var DropdownMenuSeparator = React13.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
   RadixMenu.Separator,
   {
     ref,
@@ -2602,7 +2992,7 @@ function DropdownButton({
   modal,
   className
 }) {
-  const [isOpen, setIsOpen] = (0, import_react9.useState)(false);
+  const [isOpen, setIsOpen] = (0, import_react24.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(DropdownMenu, { onOpenChange: setIsOpen, modal, children: [
     /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DropdownMenuTrigger, { asChild: true, children: typeof trigger === "function" ? trigger(isOpen) : trigger }),
     /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
@@ -2729,7 +3119,7 @@ var import_lucide_react12 = require("lucide-react");
 var import_react_i18next7 = require("react-i18next");
 
 // src/halo-icon/HaloIcon.tsx
-var import_react10 = require("react");
+var import_react25 = require("react");
 
 // src/halo-icon/constants.ts
 var HALO_ICON_STATUS = {
@@ -2759,7 +3149,7 @@ var statusStyles = {
     color: "text-chekin-red"
   }
 };
-var HaloIcon = (0, import_react10.forwardRef)(
+var HaloIcon = (0, import_react25.forwardRef)(
   ({
     children,
     variant = "default",
@@ -2815,9 +3205,9 @@ function EmptySectionPlaceholder({
 }
 
 // src/external-link/ExternalLink.tsx
-var React13 = __toESM(require("react"), 1);
+var React14 = __toESM(require("react"), 1);
 var import_jsx_runtime45 = require("react/jsx-runtime");
-var ExternalLink = React13.forwardRef(
+var ExternalLink = React14.forwardRef(
   ({ className, children, showIcon = true, target = "_blank", rel, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)(
     "a",
     {
@@ -2862,33 +3252,8 @@ ExternalLink.displayName = "ExternalLink";
 var import_react_i18next9 = require("react-i18next");
 var import_lucide_react14 = require("lucide-react");
 
-// src/lib/use-modal-controls.ts
-var import_react11 = require("react");
-function useModalControls(initState = false, { disabled } = {}) {
-  const [isOpen, setIsOpen] = (0, import_react11.useState)(initState);
-  const openModal = (0, import_react11.useCallback)(() => {
-    if (disabled) return;
-    setIsOpen(true);
-  }, [disabled]);
-  const closeModal = (0, import_react11.useCallback)(() => {
-    if (disabled) return;
-    setIsOpen(false);
-  }, [disabled]);
-  const toggleModal = (0, import_react11.useCallback)(() => {
-    if (disabled) return;
-    setIsOpen((value) => !value);
-  }, [disabled]);
-  return {
-    isOpen,
-    openModal,
-    closeModal,
-    toggleModal,
-    setIsOpen
-  };
-}
-
 // src/switch/Switch.tsx
-var React14 = __toESM(require("react"), 1);
+var React15 = __toESM(require("react"), 1);
 var SwitchPrimitives = __toESM(require("@radix-ui/react-switch"), 1);
 var import_class_variance_authority7 = require("class-variance-authority");
 var import_jsx_runtime46 = require("react/jsx-runtime");
@@ -2930,9 +3295,9 @@ var switchThumbVariants = (0, import_class_variance_authority7.cva)(
     }
   }
 );
-var Switch = React14.forwardRef(
+var Switch = React15.forwardRef(
   ({ className, size, readOnly, loading, onChange, value, id, label, error, ...props }, ref) => {
-    const generatedId = React14.useId();
+    const generatedId = React15.useId();
     const fieldId = id || generatedId;
     const switchElement = /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
       SwitchPrimitives.Root,
@@ -2952,44 +3317,22 @@ var Switch = React14.forwardRef(
     );
     if (!label && !error) {
       return switchElement;
-    }
-    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center gap-3", children: [
-        switchElement,
-        label && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Label, { htmlFor: fieldId, className: "cursor-pointer font-medium", children: label })
-      ] }),
-      error && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ErrorMessage, { disabled: props.disabled, children: error })
-    ] });
-  }
-);
-Switch.displayName = SwitchPrimitives.Root.displayName;
-
-// src/video-player/VideoPlayer.tsx
-var import_react13 = require("react");
-var import_react_i18next8 = require("react-i18next");
-var import_lucide_react13 = require("lucide-react");
-
-// src/lib/use-click-escape.ts
-var import_react12 = require("react");
-function useClickEscape({ enabled = true, onClick }) {
-  const onClickRef = (0, import_react12.useRef)(onClick);
-  (0, import_react12.useEffect)(() => {
-    onClickRef.current = onClick;
-  }, [onClick]);
-  (0, import_react12.useEffect)(() => {
-    const handleKeyDown = (event) => {
-      if (event.key === "Escape" && enabled) {
-        onClickRef.current?.();
-      }
-    };
-    window.addEventListener("keydown", handleKeyDown);
-    return () => {
-      window.removeEventListener("keydown", handleKeyDown);
-    };
-  }, [enabled]);
-}
+    }
+    return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)("div", { className: "flex items-center gap-3", children: [
+        switchElement,
+        label && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(Label, { htmlFor: fieldId, className: "cursor-pointer font-medium", children: label })
+      ] }),
+      error && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(ErrorMessage, { disabled: props.disabled, children: error })
+    ] });
+  }
+);
+Switch.displayName = SwitchPrimitives.Root.displayName;
 
 // src/video-player/VideoPlayer.tsx
+var import_react26 = require("react");
+var import_react_i18next8 = require("react-i18next");
+var import_lucide_react13 = require("lucide-react");
 var import_jsx_runtime47 = require("react/jsx-runtime");
 function VideoPlayer({
   src,
@@ -3000,20 +3343,20 @@ function VideoPlayer({
   autoPlay = false
 }) {
   const { t } = (0, import_react_i18next8.useTranslation)();
-  const videoRef = (0, import_react13.useRef)(null);
-  const iframeRef = (0, import_react13.useRef)(null);
-  const containerRef = (0, import_react13.useRef)(null);
-  const [isPlaying, setIsPlaying] = (0, import_react13.useState)(false);
-  const [isMuted, setIsMuted] = (0, import_react13.useState)(false);
-  const [currentTime, setCurrentTime] = (0, import_react13.useState)(0);
-  const [duration, setDuration] = (0, import_react13.useState)(0);
-  const [isFullScreenMode, setIsFullScreenMode] = (0, import_react13.useState)(isFullScreen);
-  const [isLoading, setIsLoading] = (0, import_react13.useState)(true);
-  const [videoSource, setVideoSource] = (0, import_react13.useState)("file");
-  const [youtubeEmbedUrl, setYoutubeEmbedUrl] = (0, import_react13.useState)("");
-  const [vimeoEmbedUrl, setVimeoEmbedUrl] = (0, import_react13.useState)("");
+  const videoRef = (0, import_react26.useRef)(null);
+  const iframeRef = (0, import_react26.useRef)(null);
+  const containerRef = (0, import_react26.useRef)(null);
+  const [isPlaying, setIsPlaying] = (0, import_react26.useState)(false);
+  const [isMuted, setIsMuted] = (0, import_react26.useState)(false);
+  const [currentTime, setCurrentTime] = (0, import_react26.useState)(0);
+  const [duration, setDuration] = (0, import_react26.useState)(0);
+  const [isFullScreenMode, setIsFullScreenMode] = (0, import_react26.useState)(isFullScreen);
+  const [isLoading, setIsLoading] = (0, import_react26.useState)(true);
+  const [videoSource, setVideoSource] = (0, import_react26.useState)("file");
+  const [youtubeEmbedUrl, setYoutubeEmbedUrl] = (0, import_react26.useState)("");
+  const [vimeoEmbedUrl, setVimeoEmbedUrl] = (0, import_react26.useState)("");
   useClickEscape({ enabled: isFullScreenMode, onClick: onClose });
-  (0, import_react13.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     const youtubeRegex = /(?:youtube\.com\/watch\?v=|youtu\.be\/|youtube\.com\/embed\/)([a-zA-Z0-9_-]{11})/;
     const vimeoRegex = /(?:vimeo\.com\/|vimeo\.com\/video\/)(\d+)/;
     const youtubeMatch = src.match(youtubeRegex);
@@ -3042,7 +3385,7 @@ function VideoPlayer({
     setYoutubeEmbedUrl("");
     setVimeoEmbedUrl("");
   }, [src, autoPlay]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     if (videoSource !== "file") return;
     const video = videoRef.current;
     if (!video) return;
@@ -3070,7 +3413,7 @@ function VideoPlayer({
       video.removeEventListener("canplay", handleCanPlay);
     };
   }, [videoSource]);
-  (0, import_react13.useEffect)(() => {
+  (0, import_react26.useEffect)(() => {
     if (isFullScreenMode && videoRef.current && videoSource === "file") {
       void videoRef.current.play();
       setIsPlaying(true);
@@ -3347,10 +3690,10 @@ function FeatureCard({
 }
 
 // src/file-input-button/FileInputButton.tsx
-var import_react14 = require("react");
+var import_react27 = require("react");
 var import_lucide_react15 = require("lucide-react");
 var import_jsx_runtime49 = require("react/jsx-runtime");
-var FileInputButton = (0, import_react14.forwardRef)(
+var FileInputButton = (0, import_react27.forwardRef)(
   ({
     label,
     onChange,
@@ -3362,7 +3705,7 @@ var FileInputButton = (0, import_react14.forwardRef)(
     size = "default",
     ...props
   }, ref) => {
-    const handleChange = (0, import_react14.useCallback)(
+    const handleChange = (0, import_react27.useCallback)(
       (event) => {
         onChange?.(event);
         event.target.value = "";
@@ -3442,7 +3785,7 @@ var FormBox = {
 };
 
 // src/free-text-field/FreeTextField.tsx
-var import_react15 = require("react");
+var import_react28 = require("react");
 var import_react_i18next10 = require("react-i18next");
 
 // src/free-text-field/styles.module.css
@@ -3450,7 +3793,7 @@ var styles_default3 = {};
 
 // src/free-text-field/FreeTextField.tsx
 var import_jsx_runtime54 = require("react/jsx-runtime");
-var FreeTextField = (0, import_react15.forwardRef)(
+var FreeTextField = (0, import_react28.forwardRef)(
   ({
     label,
     error,
@@ -3472,9 +3815,9 @@ var FreeTextField = (0, import_react15.forwardRef)(
     ...inputProps
   }, ref) => {
     const { t } = (0, import_react_i18next10.useTranslation)();
-    const inputId = (0, import_react15.useId)();
-    const [internalValue, setInternalValue] = (0, import_react15.useState)(defaultValue ?? "");
-    const [isFocused, setIsFocused] = (0, import_react15.useState)(false);
+    const inputId = (0, import_react28.useId)();
+    const [internalValue, setInternalValue] = (0, import_react28.useState)(defaultValue ?? "");
+    const [isFocused, setIsFocused] = (0, import_react28.useState)(false);
     const currentValue = value !== void 0 ? value : internalValue;
     const isEmpty = !currentValue || String(currentValue).length === 0;
     const hasError = Boolean(error);
@@ -3558,7 +3901,7 @@ var FreeTextField = (0, import_react15.forwardRef)(
 FreeTextField.displayName = "FreeTextField";
 
 // src/framed-icon/FramedIcon.tsx
-var React15 = __toESM(require("react"), 1);
+var React16 = __toESM(require("react"), 1);
 var import_class_variance_authority8 = require("class-variance-authority");
 var import_jsx_runtime55 = require("react/jsx-runtime");
 var framedIconVariants = (0, import_class_variance_authority8.cva)("inline-flex items-center justify-center shrink-0", {
@@ -3582,7 +3925,7 @@ var framedIconVariants = (0, import_class_variance_authority8.cva)("inline-flex
   },
   defaultVariants: { size: "m", shape: "rounded", tone: "info" }
 });
-var FramedIcon = React15.forwardRef(
+var FramedIcon = React16.forwardRef(
   ({ className, size, shape, tone, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
     "span",
     {
@@ -3597,9 +3940,9 @@ var FramedIcon = React15.forwardRef(
 FramedIcon.displayName = "FramedIcon";
 
 // src/grid-items/GridItems.tsx
-var import_react16 = require("react");
+var import_react29 = require("react");
 var import_jsx_runtime56 = require("react/jsx-runtime");
-var GridItems = (0, import_react16.forwardRef)(
+var GridItems = (0, import_react29.forwardRef)(
   ({ children, title, placeholder, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(
     "div",
     {
@@ -3676,9 +4019,9 @@ function HelpTooltip({
 }
 
 // src/icon/Icon.tsx
-var import_react17 = require("react");
+var import_react30 = require("react");
 var import_jsx_runtime58 = require("react/jsx-runtime");
-var MissingIcon = (0, import_react17.forwardRef)(
+var MissingIcon = (0, import_react30.forwardRef)(
   ({ size = 24, className = "", fallback = null, color, ...props }, ref) => {
     if (fallback) {
       return /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_jsx_runtime58.Fragment, { children: fallback });
@@ -3707,8 +4050,8 @@ var MissingIcon = (0, import_react17.forwardRef)(
   }
 );
 MissingIcon.displayName = "MissingIcon";
-var Icon = (0, import_react17.memo)(
-  (0, import_react17.forwardRef)(
+var Icon = (0, import_react30.memo)(
+  (0, import_react30.forwardRef)(
     ({ name: _name, size = 24, className = "", fallback = null, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(
       MissingIcon,
       {
@@ -3744,7 +4087,7 @@ var IconRegistry = class {
 var RegistryIcon = Icon;
 
 // src/icon-button/IconButton.tsx
-var React16 = __toESM(require("react"), 1);
+var React17 = __toESM(require("react"), 1);
 var import_class_variance_authority9 = require("class-variance-authority");
 var import_jsx_runtime59 = require("react/jsx-runtime");
 var iconButtonVariants = (0, import_class_variance_authority9.cva)(
@@ -3775,7 +4118,7 @@ var iconButtonVariants = (0, import_class_variance_authority9.cva)(
     defaultVariants: { size: "m", shape: "rounded", variant: "secondary" }
   }
 );
-var IconButton = React16.forwardRef(
+var IconButton = React17.forwardRef(
   ({ className, size, shape, variant, label, children, type = "button", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(
     "button",
     {
@@ -3806,7 +4149,7 @@ function InfoBox({ className, children }) {
 }
 
 // src/image/Image.tsx
-var import_react18 = require("react");
+var import_react31 = require("react");
 var import_jsx_runtime61 = require("react/jsx-runtime");
 function Image2({
   src,
@@ -3815,7 +4158,7 @@ function Image2({
   fallbackSrc = "https://placehold.co/600x400?text=Image",
   ...props
 }) {
-  const [error, setError] = (0, import_react18.useState)(false);
+  const [error, setError] = (0, import_react31.useState)(false);
   return /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
     "img",
     {
@@ -3830,9 +4173,9 @@ function Image2({
 }
 
 // src/input/Input.tsx
-var React17 = __toESM(require("react"), 1);
+var React18 = __toESM(require("react"), 1);
 var import_jsx_runtime62 = require("react/jsx-runtime");
-var Input = React17.forwardRef(
+var Input = React18.forwardRef(
   ({ className, type, readOnly, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
     "input",
     {
@@ -3856,13 +4199,13 @@ var Input = React17.forwardRef(
 Input.displayName = "Input";
 
 // src/input-otp/InputOTP.tsx
-var React18 = __toESM(require("react"), 1);
+var React19 = __toESM(require("react"), 1);
 
 // src/input-otp/InputOTPContext.ts
-var import_react19 = require("react");
-var InputOTPContext = (0, import_react19.createContext)(null);
+var import_react32 = require("react");
+var InputOTPContext = (0, import_react32.createContext)(null);
 function useInputOTPContext() {
-  const ctx = (0, import_react19.useContext)(InputOTPContext);
+  const ctx = (0, import_react32.useContext)(InputOTPContext);
   if (!ctx) {
     throw new Error("InputOTP compound components must be used within <InputOTP>");
   }
@@ -3874,7 +4217,7 @@ function extractDigits(str) {
 }
 
 // src/input-otp/useInputOTP.ts
-var import_react20 = require("react");
+var import_react33 = require("react");
 function useInputOTP({
   maxLength,
   value,
@@ -3883,12 +4226,12 @@ function useInputOTP({
   autoFocus,
   error
 }) {
-  const [activeIndex, setActiveIndex] = (0, import_react20.useState)(-1);
-  const inputRefs = (0, import_react20.useRef)([]);
-  const containerRef = (0, import_react20.useRef)(null);
-  const blurTimeoutRef = (0, import_react20.useRef)();
-  const slotsRef = (0, import_react20.useRef)(Array.from({ length: maxLength }, () => ""));
-  const slots = (0, import_react20.useMemo)(() => {
+  const [activeIndex, setActiveIndex] = (0, import_react33.useState)(-1);
+  const inputRefs = (0, import_react33.useRef)([]);
+  const containerRef = (0, import_react33.useRef)(null);
+  const blurTimeoutRef = (0, import_react33.useRef)();
+  const slotsRef = (0, import_react33.useRef)(Array.from({ length: maxLength }, () => ""));
+  const slots = (0, import_react33.useMemo)(() => {
     const nextSlots = Array.from({ length: maxLength }, () => "");
     for (let index = 0; index < Math.min(value.length, maxLength); index += 1) {
       const char = value[index];
@@ -3899,7 +4242,7 @@ function useInputOTP({
     return nextSlots;
   }, [value, maxLength]);
   slotsRef.current = slots;
-  const emitValue = (0, import_react20.useCallback)(
+  const emitValue = (0, import_react33.useCallback)(
     (newSlots) => {
       let lastFilledIndex = -1;
       for (let index = newSlots.length - 1; index >= 0; index -= 1) {
@@ -3920,12 +4263,12 @@ function useInputOTP({
     },
     [onChange]
   );
-  (0, import_react20.useEffect)(() => {
+  (0, import_react33.useEffect)(() => {
     if (autoFocus && inputRefs.current[0]) {
       inputRefs.current[0].focus();
     }
   }, [autoFocus]);
-  const handleContainerFocusIn = (0, import_react20.useCallback)((event) => {
+  const handleContainerFocusIn = (0, import_react33.useCallback)((event) => {
     clearTimeout(blurTimeoutRef.current);
     const target = event.target;
     const slotIndex = inputRefs.current.indexOf(target);
@@ -3933,7 +4276,7 @@ function useInputOTP({
       setActiveIndex(slotIndex);
     }
   }, []);
-  const handleContainerFocusOut = (0, import_react20.useCallback)(() => {
+  const handleContainerFocusOut = (0, import_react33.useCallback)(() => {
     clearTimeout(blurTimeoutRef.current);
     blurTimeoutRef.current = setTimeout(() => {
       if (!containerRef.current?.contains(document.activeElement)) {
@@ -3941,8 +4284,8 @@ function useInputOTP({
       }
     }, 0);
   }, []);
-  (0, import_react20.useEffect)(() => () => clearTimeout(blurTimeoutRef.current), []);
-  const handleDigitInput = (0, import_react20.useCallback)(
+  (0, import_react33.useEffect)(() => () => clearTimeout(blurTimeoutRef.current), []);
+  const handleDigitInput = (0, import_react33.useCallback)(
     (index, digit) => {
       if (!DIGIT_REGEX.test(digit)) return;
       const newSlots = [...slotsRef.current];
@@ -3956,7 +4299,7 @@ function useInputOTP({
     },
     [maxLength, emitValue]
   );
-  const handleDelete = (0, import_react20.useCallback)(
+  const handleDelete = (0, import_react33.useCallback)(
     (index) => {
       const newSlots = [...slotsRef.current];
       if (newSlots[index]) {
@@ -3971,7 +4314,7 @@ function useInputOTP({
     },
     [emitValue]
   );
-  const handlePaste = (0, import_react20.useCallback)(
+  const handlePaste = (0, import_react33.useCallback)(
     (text) => {
       const digits = extractDigits(text).slice(0, maxLength);
       if (digits.length > 0) {
@@ -3987,7 +4330,7 @@ function useInputOTP({
     },
     [maxLength, emitValue]
   );
-  const contextValue = (0, import_react20.useMemo)(
+  const contextValue = (0, import_react33.useMemo)(
     () => ({
       slots,
       activeIndex,
@@ -4020,7 +4363,7 @@ function useInputOTP({
 }
 
 // src/input-otp/useInputOTPSlot.ts
-var import_react21 = require("react");
+var import_react34 = require("react");
 function useInputOTPSlot(index) {
   const {
     slots,
@@ -4090,13 +4433,13 @@ function useInputOTPSlot(index) {
     event.preventDefault();
     handlePaste(event.clipboardData.getData("text/plain"));
   };
-  const setInputRef = (0, import_react21.useCallback)(
+  const setInputRef = (0, import_react34.useCallback)(
     (element) => {
       inputRefs.current[index] = element;
     },
     [index, inputRefs]
   );
-  const focusSlot = (0, import_react21.useCallback)(() => {
+  const focusSlot = (0, import_react34.useCallback)(() => {
     inputRefs.current[index]?.focus();
   }, [index, inputRefs]);
   return {
@@ -4139,11 +4482,11 @@ function InputOTP({
     }
   ) });
 }
-var InputOTPGroup = React18.forwardRef(
+var InputOTPGroup = React19.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { ref, className: cn("flex items-center", className), ...props })
 );
 InputOTPGroup.displayName = "InputOTPGroup";
-var InputOTPSlot = React18.forwardRef(
+var InputOTPSlot = React19.forwardRef(
   ({ index, className, ...props }, ref) => {
     const {
       char,
@@ -4192,13 +4535,13 @@ var InputOTPSlot = React18.forwardRef(
   }
 );
 InputOTPSlot.displayName = "InputOTPSlot";
-var InputOTPSeparator = React18.forwardRef(
+var InputOTPSeparator = React19.forwardRef(
   (props, ref) => /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { ref, role: "separator", ...props })
 );
 InputOTPSeparator.displayName = "InputOTPSeparator";
 
 // src/icons-dropdown/IconsDropdown.tsx
-var import_react22 = require("react");
+var import_react35 = require("react");
 var import_jsx_runtime64 = require("react/jsx-runtime");
 function IconsDropdown({
   icons,
@@ -4210,7 +4553,7 @@ function IconsDropdown({
   defaultOpen,
   onOpenChange: onOpenChangeProp
 }) {
-  const [open, setOpen] = (0, import_react22.useState)(defaultOpen ?? false);
+  const [open, setOpen] = (0, import_react35.useState)(defaultOpen ?? false);
   function handleOpenChange(value) {
     setOpen(value);
     onOpenChangeProp?.(value);
@@ -4793,9 +5136,9 @@ function LearnMoreButton({ label, ...props }) {
 }
 
 // src/link/Link.tsx
-var import_react23 = require("react");
+var import_react36 = require("react");
 var import_jsx_runtime68 = require("react/jsx-runtime");
-var LinkInternal = (0, import_react23.forwardRef)(
+var LinkInternal = (0, import_react36.forwardRef)(
   ({ disabled = false, className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
     "a",
     {
@@ -4814,17 +5157,17 @@ var LinkInternal = (0, import_react23.forwardRef)(
   )
 );
 LinkInternal.displayName = "Link";
-var Link = (0, import_react23.memo)(LinkInternal);
+var Link = (0, import_react36.memo)(LinkInternal);
 
 // src/image-full-screen-view/ImageFullScreenView.tsx
-var import_react24 = require("react");
+var import_react37 = require("react");
 var import_lucide_react20 = require("lucide-react");
 var import_react_i18next13 = require("react-i18next");
 var import_jsx_runtime69 = require("react/jsx-runtime");
 function ImageFullScreenView({ src, alt, onClose }) {
   const { t } = (0, import_react_i18next13.useTranslation)();
-  const [scale, setScale] = (0, import_react24.useState)(1);
-  const [rotation, setRotation] = (0, import_react24.useState)(0);
+  const [scale, setScale] = (0, import_react37.useState)(1);
+  const [rotation, setRotation] = (0, import_react37.useState)(0);
   useClickEscape({ onClick: onClose });
   const zoomIn = () => setScale((value) => Math.min(value + 0.25, 3));
   const zoomOut = () => setScale((value) => Math.max(value - 0.25, 0.5));
@@ -5022,55 +5365,9 @@ var METRIC_CARD_VARIANTS = {
 };
 
 // src/modal/Modal.tsx
-var import_react26 = require("react");
+var import_react38 = require("react");
 var import_lucide_react23 = require("lucide-react");
 
-// src/lib/use-scroll-frame-into-view.ts
-var import_react25 = require("react");
-
-// src/lib/runtimeSettings.ts
-function getChekinRuntimeSettings() {
-  return window.ChekinProSettings || window.ChekinHousingsSDKSettings || {};
-}
-function isMobileModalModeAvailable() {
-  const settings = getChekinRuntimeSettings();
-  return !settings.autoHeight;
-}
-
-// src/lib/use-scroll-frame-into-view.ts
-function useScrollFrameIntoView(active, options = {}) {
-  const { behavior = "smooth", elementRef } = options;
-  (0, import_react25.useEffect)(() => {
-    const sdkWindow = window;
-    if (!active || !getChekinRuntimeSettings()?.autoHeight) {
-      return;
-    }
-    const frame = sdkWindow.chekinCustomFrame;
-    if (!frame) {
-      return;
-    }
-    const parentWindow = window.parent;
-    const scrollToElement = () => {
-      const frameRect = frame.getBoundingClientRect();
-      if (elementRef?.current) {
-        const elementRect = elementRef.current.getBoundingClientRect();
-        const elementCenterInFrame = elementRect.top + elementRect.height / 2;
-        const elementCenterInParent = frameRect.top + elementCenterInFrame;
-        const targetScroll = parentWindow.scrollY + elementCenterInParent - parentWindow.innerHeight / 2;
-        parentWindow.scrollTo({
-          top: Math.max(0, targetScroll),
-          behavior
-        });
-        return;
-      }
-      frame.scrollIntoView({ behavior, block: "start" });
-    };
-    requestAnimationFrame(() => {
-      requestAnimationFrame(scrollToElement);
-    });
-  }, [active, behavior, elementRef]);
-}
-
 // src/modal/styles.module.css
 var styles_default4 = {};
 
@@ -5099,7 +5396,7 @@ function Modal({
   container,
   modal
 }) {
-  const contentRef = (0, import_react26.useRef)(null);
+  const contentRef = (0, import_react38.useRef)(null);
   useScrollFrameIntoView(open, { elementRef: contentRef });
   const handleClose = () => {
     onOpenChange?.(false);
@@ -5141,7 +5438,7 @@ function Modal({
     }
   ) });
 }
-var ModalButton = (0, import_react26.forwardRef)(
+var ModalButton = (0, import_react38.forwardRef)(
   ({ children, size, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime72.jsx)(
     Button,
     {
@@ -5157,9 +5454,9 @@ ModalButton.displayName = "ModalButton";
 Modal.displayName = "Modal";
 
 // src/modal-loader/ModalLoader.tsx
-var import_react27 = require("react");
+var import_react39 = require("react");
 var import_jsx_runtime73 = require("react/jsx-runtime");
-var ModalLoader = (0, import_react27.memo)(({ visible, className }) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
+var ModalLoader = (0, import_react39.memo)(({ visible, className }) => /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
   "div",
   {
     className: cn(
@@ -5229,14 +5526,14 @@ var import_react_i18next16 = require("react-i18next");
 var import_lucide_react24 = require("lucide-react");
 
 // src/select/Select.tsx
-var React19 = __toESM(require("react"), 1);
+var React20 = __toESM(require("react"), 1);
 var RadixSelect = __toESM(require("@radix-ui/react-select"), 1);
 var import_jsx_runtime76 = require("react/jsx-runtime");
 var SelectRoot = RadixSelect.Root;
 var SelectValue = RadixSelect.Value;
 var SelectGroup = RadixSelect.Group;
 var SelectPortal = RadixSelect.Portal;
-var SelectTrigger = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+var SelectTrigger = React20.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
   RadixSelect.Trigger,
   {
     ref,
@@ -5277,7 +5574,7 @@ var SelectTrigger = React19.forwardRef(({ className, children, ...props }, ref)
   }
 ));
 SelectTrigger.displayName = "SelectTrigger";
-var SelectContent = React19.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(RadixSelect.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+var SelectContent = React20.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(RadixSelect.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
   RadixSelect.Content,
   {
     ref,
@@ -5296,7 +5593,7 @@ var SelectContent = React19.forwardRef(({ className, children, position = "poppe
   }
 ) }));
 SelectContent.displayName = "SelectContent";
-var SelectItem = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
+var SelectItem = React20.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)(
   RadixSelect.Item,
   {
     ref,
@@ -5331,7 +5628,7 @@ var SelectItem = React19.forwardRef(({ className, children, ...props }, ref) =>
   }
 ));
 SelectItem.displayName = "SelectItem";
-var SelectSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+var SelectSeparator = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
   RadixSelect.Separator,
   {
     ref,
@@ -5340,7 +5637,7 @@ var SelectSeparator = React19.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 SelectSeparator.displayName = "SelectSeparator";
-var SelectLabel = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
+var SelectLabel = React20.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
   RadixSelect.Label,
   {
     ref,
@@ -5352,7 +5649,7 @@ var SelectLabel = React19.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 SelectLabel.displayName = "SelectLabel";
-var Select = React19.forwardRef(
+var Select = React20.forwardRef(
   ({
     placeholder,
     label,
@@ -5363,9 +5660,9 @@ var Select = React19.forwardRef(
     children,
     ...props
   }, ref) => {
-    const reactId = React19.useId();
+    const reactId = React20.useId();
     const triggerId = props.name ?? reactId;
-    const internalRef = React19.useRef(null);
+    const internalRef = React20.useRef(null);
     const combinedRef = useCombinedRef(ref, internalRef);
     return /* @__PURE__ */ (0, import_jsx_runtime76.jsxs)("div", { className: cn("flex flex-col gap-chekin-1 w-[300px]", containerClassName), children: [
       label && /* @__PURE__ */ (0, import_jsx_runtime76.jsx)(
@@ -5522,7 +5819,7 @@ function Pagination({
 }
 
 // src/popover/Popover.tsx
-var React20 = __toESM(require("react"), 1);
+var React21 = __toESM(require("react"), 1);
 var RadixPopover = __toESM(require("@radix-ui/react-popover"), 1);
 var import_jsx_runtime78 = require("react/jsx-runtime");
 var Popover = RadixPopover.Root;
@@ -5530,7 +5827,7 @@ var PopoverTrigger = RadixPopover.Trigger;
 var PopoverAnchor = RadixPopover.Anchor;
 var PopoverPortal = RadixPopover.Portal;
 var PopoverClose = RadixPopover.Close;
-var PopoverContent = React20.forwardRef(({ className, sideOffset = 8, align = "start", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
+var PopoverContent = React21.forwardRef(({ className, sideOffset = 8, align = "start", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(RadixPopover.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime78.jsx)(
   RadixPopover.Content,
   {
     ref,
@@ -5547,14 +5844,14 @@ var PopoverContent = React20.forwardRef(({ className, sideOffset = 8, align = "s
 PopoverContent.displayName = "PopoverContent";
 
 // src/radio/Radio.tsx
-var import_react29 = require("react");
+var import_react41 = require("react");
 
 // src/radio-group/RadioGroup.tsx
-var React21 = __toESM(require("react"), 1);
+var React22 = __toESM(require("react"), 1);
 var RadioGroupPrimitive = __toESM(require("@radix-ui/react-radio-group"), 1);
 var import_lucide_react25 = require("lucide-react");
 var import_jsx_runtime79 = require("react/jsx-runtime");
-var RadioGroup = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+var RadioGroup = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
   RadioGroupPrimitive.Root,
   {
     ref,
@@ -5563,7 +5860,7 @@ var RadioGroup = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 RadioGroup.displayName = RadioGroupPrimitive.Root.displayName;
-var RadioGroupItem = React21.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
+var RadioGroupItem = React22.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime79.jsx)(
   RadioGroupPrimitive.Item,
   {
     ref,
@@ -5580,11 +5877,11 @@ var RadioGroupItem = React21.forwardRef(({ className, ...props }, ref) => /* @__
 RadioGroupItem.displayName = RadioGroupPrimitive.Item.displayName;
 
 // src/radio/useRadioOptions.ts
-var import_react28 = require("react");
+var import_react40 = require("react");
 function useRadioOptions({ options, defaultValue, onChange }) {
   const initialValue = (typeof defaultValue === "string" ? options.find((option) => option.value === defaultValue) : defaultValue) || "";
-  const [selectedValue, setSelectedValue] = (0, import_react28.useState)(initialValue);
-  const handleValueChange = (0, import_react28.useCallback)(
+  const [selectedValue, setSelectedValue] = (0, import_react40.useState)(initialValue);
+  const handleValueChange = (0, import_react40.useCallback)(
     (value) => {
       setSelectedValue(value);
       const selectedOption = options.find((option) => option.value === value) || "";
@@ -5605,7 +5902,7 @@ var styles_default5 = {};
 
 // src/radio/Radio.tsx
 var import_jsx_runtime80 = require("react/jsx-runtime");
-var Radio = (0, import_react29.forwardRef)(
+var Radio = (0, import_react41.forwardRef)(
   ({ options, value, onChange, error, className = "", disabled = false, renderOption }, ref) => {
     const { selectedValue, handleValueChange } = useRadioOptions({
       options,
@@ -5792,7 +6089,7 @@ function RatingRadioGroup({
 }
 
 // src/rating-stars/RatingStars.tsx
-var React22 = __toESM(require("react"), 1);
+var React23 = __toESM(require("react"), 1);
 var import_lucide_react27 = require("lucide-react");
 var import_react_i18next17 = require("react-i18next");
 var import_jsx_runtime84 = require("react/jsx-runtime");
@@ -5812,7 +6109,7 @@ function RatingStars({
   const { t } = (0, import_react_i18next17.useTranslation)();
   const normalizedRating = Math.max(0, Math.min(maxRating, rating));
   const stars = Array.from({ length: maxRating }, (_, index) => index + 1);
-  const componentId = React22.useId();
+  const componentId = React23.useId();
   const decimal = normalizedRating - Math.floor(normalizedRating);
   const partialStarIndex = decimal > 0 ? Math.ceil(normalizedRating) : -1;
   const gradientId = `star-gradient-${componentId.replace(/:/g, "")}`;
@@ -5995,7 +6292,7 @@ var SectionTagColors = /* @__PURE__ */ ((SectionTagColors2) => {
 })(SectionTagColors || {});
 
 // src/section/Section.tsx
-var import_react30 = require("react");
+var import_react42 = require("react");
 var import_lucide_react31 = require("lucide-react");
 
 // src/section/constants.ts
@@ -6022,7 +6319,7 @@ function TooltipInfo({ content, className }) {
     }
   ) });
 }
-var Section = (0, import_react30.forwardRef)(
+var Section = (0, import_react42.forwardRef)(
   ({
     children,
     title,
@@ -6074,17 +6371,17 @@ var Section = (0, import_react30.forwardRef)(
   )
 );
 Section.displayName = "Section";
-var SubSection = (0, import_react30.forwardRef)(
+var SubSection = (0, import_react42.forwardRef)(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(Section, { ref, className: cn(Section_default.section_sub, className), ...props })
 );
 SubSection.displayName = "SubSection";
-var DividingSubsection = (0, import_react30.forwardRef)(
+var DividingSubsection = (0, import_react42.forwardRef)(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime89.jsx)(SubSection, { ref, className: cn(Section_default.section_dividing, className), ...props })
 );
 DividingSubsection.displayName = "DividingSubsection";
 
 // src/selectors/Selectors.tsx
-var import_react31 = require("react");
+var import_react43 = require("react");
 
 // src/selector-button/styles.module.css
 var styles_default7 = {};
@@ -6156,8 +6453,8 @@ var getValueArray = (value) => {
   return [];
 };
 function getSelectorContent(label, disabled, readOnly, active) {
-  if ((0, import_react31.isValidElement)(label)) {
-    return (0, import_react31.cloneElement)(label, {
+  if ((0, import_react43.isValidElement)(label)) {
+    return (0, import_react43.cloneElement)(label, {
       disabled,
       readOnly,
       active
@@ -6202,7 +6499,7 @@ function SelectorsInternal({
     }
   };
   const isAnyActive = getValueArray(value).length > 0;
-  (0, import_react31.useEffect)(() => {
+  (0, import_react43.useEffect)(() => {
     onAnySelectorActive?.(isAnyActive);
   }, [isAnyActive, onAnySelectorActive]);
   return /* @__PURE__ */ (0, import_jsx_runtime91.jsxs)(import_jsx_runtime91.Fragment, { children: [
@@ -6245,7 +6542,7 @@ function SelectorsInternal({
     )
   ] });
 }
-var Selectors = (0, import_react31.forwardRef)(SelectorsInternal);
+var Selectors = (0, import_react43.forwardRef)(SelectorsInternal);
 
 // src/separator/Separator.tsx
 var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
@@ -6383,30 +6680,11 @@ function SheetDescription({
 }
 
 // src/sidebar/Sidebar.tsx
-var React23 = __toESM(require("react"), 1);
+var React24 = __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_react33 = require("lucide-react");
 
-// src/lib/use-is-mobile.ts
-var import_react32 = require("react");
-var MOBILE_BREAKPOINT = 768;
-function useIsMobile({ breakpoint = MOBILE_BREAKPOINT } = {}) {
-  const [isMobile, setIsMobile] = (0, import_react32.useState)(void 0);
-  (0, import_react32.useEffect)(() => {
-    const mediaQuery = window.matchMedia(`(max-width: ${breakpoint - 1}px)`);
-    const onChange = () => {
-      setIsMobile(window.innerWidth < breakpoint);
-    };
-    mediaQuery.addEventListener("change", onChange);
-    setIsMobile(window.innerWidth < breakpoint);
-    return () => {
-      mediaQuery.removeEventListener("change", onChange);
-    };
-  }, [breakpoint]);
-  return !!isMobile;
-}
-
 // src/skeleton/Skeleton.tsx
 var import_jsx_runtime94 = require("react/jsx-runtime");
 function Skeleton({ className, ...props }) {
@@ -6424,19 +6702,19 @@ function Skeleton({ className, ...props }) {
 }
 
 // src/sidebar/SidebarContext.ts
-var import_react33 = require("react");
-var SidebarContext = (0, import_react33.createContext)(null);
+var import_react44 = require("react");
+var SidebarContext = (0, import_react44.createContext)(null);
 
 // src/sidebar/useSidebarMenuButton.ts
-var import_react35 = require("react");
+var import_react46 = require("react");
 
 // src/sidebar/SidebarMenuButtonContext.ts
-var import_react34 = require("react");
-var SidebarMenuButtonContext = (0, import_react34.createContext)(null);
+var import_react45 = require("react");
+var SidebarMenuButtonContext = (0, import_react45.createContext)(null);
 
 // src/sidebar/useSidebarMenuButton.ts
 function useSidebarMenuButton() {
-  return (0, import_react35.useContext)(SidebarMenuButtonContext);
+  return (0, import_react46.useContext)(SidebarMenuButtonContext);
 }
 
 // src/sidebar/SidebarIcon.tsx
@@ -6477,16 +6755,16 @@ var SidebarIcon = ({
 };
 
 // src/sidebar/useSidebar.ts
-var import_react36 = require("react");
+var import_react47 = require("react");
 function useSidebar() {
-  const context = (0, import_react36.useContext)(SidebarContext);
+  const context = (0, import_react47.useContext)(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider.");
   }
   return context;
 }
 function useSidebarSafe() {
-  return (0, import_react36.useContext)(SidebarContext);
+  return (0, import_react47.useContext)(SidebarContext);
 }
 
 // src/sidebar/Sidebar.tsx
@@ -6495,7 +6773,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 = React23.forwardRef(
+var SidebarProvider = React24.forwardRef(
   ({
     defaultOpen = true,
     open: openProp,
@@ -6507,10 +6785,10 @@ var SidebarProvider = React23.forwardRef(
     ...props
   }, ref) => {
     const isMobile = useIsMobile({ breakpoint: 641 });
-    const [openMobile, setOpenMobile] = React23.useState(false);
-    const [_open, _setOpen] = React23.useState(defaultOpen);
+    const [openMobile, setOpenMobile] = React24.useState(false);
+    const [_open, _setOpen] = React24.useState(defaultOpen);
     const open = openProp ?? _open;
-    const setOpen = React23.useCallback(
+    const setOpen = React24.useCallback(
       (value) => {
         const openState = typeof value === "function" ? value(open) : value;
         if (setOpenProp) {
@@ -6522,10 +6800,10 @@ var SidebarProvider = React23.forwardRef(
       },
       [setOpenProp, open, stateName]
     );
-    const toggleSidebar = React23.useCallback(() => {
+    const toggleSidebar = React24.useCallback(() => {
       return isMobile ? setOpenMobile((value) => !value) : setOpen((value) => !value);
     }, [isMobile, setOpen]);
-    React23.useEffect(() => {
+    React24.useEffect(() => {
       const handleKeyDown = (event) => {
         if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
           event.preventDefault();
@@ -6536,7 +6814,7 @@ var SidebarProvider = React23.forwardRef(
       return () => window.removeEventListener("keydown", handleKeyDown);
     }, [toggleSidebar]);
     const state = open ? "expanded" : "collapsed";
-    const contextValue = React23.useMemo(
+    const contextValue = React24.useMemo(
       () => ({
         state,
         open,
@@ -6561,7 +6839,7 @@ var SidebarProvider = React23.forwardRef(
   }
 );
 SidebarProvider.displayName = "SidebarProvider";
-var Sidebar = React23.forwardRef(
+var Sidebar = React24.forwardRef(
   ({
     side = "left",
     variant = "sidebar",
@@ -6655,7 +6933,7 @@ var Sidebar = React23.forwardRef(
   }
 );
 Sidebar.displayName = "Sidebar";
-var SidebarTrigger = React23.forwardRef(({ className, onClick, icon, ...props }, ref) => {
+var SidebarTrigger = React24.forwardRef(({ className, onClick, icon, ...props }, ref) => {
   const { toggleSidebar, open, isMobile, openMobile } = useSidebar();
   return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
     Button,
@@ -6682,7 +6960,7 @@ var SidebarTrigger = React23.forwardRef(({ className, onClick, icon, ...props },
   );
 });
 SidebarTrigger.displayName = "SidebarTrigger";
-var SidebarRail = React23.forwardRef(
+var SidebarRail = React24.forwardRef(
   ({ className, ...props }, ref) => {
     const { toggleSidebar } = useSidebar();
     return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
@@ -6708,7 +6986,7 @@ var SidebarRail = React23.forwardRef(
   }
 );
 SidebarRail.displayName = "SidebarRail";
-var SidebarInset = React23.forwardRef(
+var SidebarInset = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "main",
     {
@@ -6723,7 +7001,7 @@ var SidebarInset = React23.forwardRef(
   )
 );
 SidebarInset.displayName = "SidebarInset";
-var SidebarInput = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+var SidebarInput = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
   Input,
   {
     ref,
@@ -6733,7 +7011,7 @@ var SidebarInput = React23.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 SidebarInput.displayName = "SidebarInput";
-var SidebarHeader = React23.forwardRef(
+var SidebarHeader = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "div",
     {
@@ -6745,7 +7023,7 @@ var SidebarHeader = React23.forwardRef(
   )
 );
 SidebarHeader.displayName = "SidebarHeader";
-var SidebarFooter = React23.forwardRef(
+var SidebarFooter = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "div",
     {
@@ -6757,7 +7035,7 @@ var SidebarFooter = React23.forwardRef(
   )
 );
 SidebarFooter.displayName = "SidebarFooter";
-var SidebarSeparator = React23.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
+var SidebarSeparator = React24.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
   Separator3,
   {
     ref,
@@ -6767,7 +7045,7 @@ var SidebarSeparator = React23.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 SidebarSeparator.displayName = "SidebarSeparator";
-var SidebarContent = React23.forwardRef(
+var SidebarContent = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "div",
     {
@@ -6782,7 +7060,7 @@ var SidebarContent = React23.forwardRef(
   )
 );
 SidebarContent.displayName = "SidebarContent";
-var SidebarGroup = React23.forwardRef(
+var SidebarGroup = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "div",
     {
@@ -6794,7 +7072,7 @@ var SidebarGroup = React23.forwardRef(
   )
 );
 SidebarGroup.displayName = "SidebarGroup";
-var SidebarGroupLabel = React23.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupLabel = React24.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot4.Slot : "div";
   return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     Comp,
@@ -6811,7 +7089,7 @@ var SidebarGroupLabel = React23.forwardRef(({ className, asChild = false, ...pro
   );
 });
 SidebarGroupLabel.displayName = "SidebarGroupLabel";
-var SidebarGroupAction = React23.forwardRef(({ className, asChild = false, ...props }, ref) => {
+var SidebarGroupAction = React24.forwardRef(({ className, asChild = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot4.Slot : "button";
   return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     Comp,
@@ -6827,7 +7105,7 @@ var SidebarGroupAction = React23.forwardRef(({ className, asChild = false, ...pr
   );
 });
 SidebarGroupAction.displayName = "SidebarGroupAction";
-var SidebarGroupContent = React23.forwardRef(
+var SidebarGroupContent = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "div",
     {
@@ -6839,7 +7117,7 @@ var SidebarGroupContent = React23.forwardRef(
   )
 );
 SidebarGroupContent.displayName = "SidebarGroupContent";
-var SidebarMenu = React23.forwardRef(
+var SidebarMenu = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "ul",
     {
@@ -6851,7 +7129,7 @@ var SidebarMenu = React23.forwardRef(
   )
 );
 SidebarMenu.displayName = "SidebarMenu";
-var SidebarMenuItem = React23.forwardRef(
+var SidebarMenuItem = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "li",
     {
@@ -6883,7 +7161,7 @@ var sidebarMenuButtonVariants = (0, import_class_variance_authority11.cva)(
     }
   }
 );
-var SidebarMenuButton = React23.forwardRef(
+var SidebarMenuButton = React24.forwardRef(
   ({
     asChild = false,
     isActive = false,
@@ -6929,7 +7207,7 @@ var SidebarMenuButton = React23.forwardRef(
   }
 );
 SidebarMenuButton.displayName = "SidebarMenuButton";
-var SidebarMenuAction = React23.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
+var SidebarMenuAction = React24.forwardRef(({ className, asChild = false, showOnHover = false, ...props }, ref) => {
   const Comp = asChild ? import_react_slot4.Slot : "button";
   return /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     Comp,
@@ -6946,7 +7224,7 @@ var SidebarMenuAction = React23.forwardRef(({ className, asChild = false, showOn
   );
 });
 SidebarMenuAction.displayName = "SidebarMenuAction";
-var SidebarMenuBadge = React23.forwardRef(
+var SidebarMenuBadge = React24.forwardRef(
   ({ className, ...props }, ref) => {
     const { open, isMobile, openMobile } = useSidebar();
     const isOpen = isMobile ? openMobile : open;
@@ -6966,8 +7244,8 @@ var SidebarMenuBadge = React23.forwardRef(
   }
 );
 SidebarMenuBadge.displayName = "SidebarMenuBadge";
-var SidebarMenuSkeleton = React23.forwardRef(({ className, showIcon = false, ...props }, ref) => {
-  const width = React23.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
+var SidebarMenuSkeleton = React24.forwardRef(({ className, showIcon = false, ...props }, ref) => {
+  const width = React24.useMemo(() => `${Math.floor(Math.random() * 40) + 50}%`, []);
   return /* @__PURE__ */ (0, import_jsx_runtime96.jsxs)(
     "div",
     {
@@ -6990,7 +7268,7 @@ var SidebarMenuSkeleton = React23.forwardRef(({ className, showIcon = false, ...
   );
 });
 SidebarMenuSkeleton.displayName = "SidebarMenuSkeleton";
-var SidebarMenuSub = React23.forwardRef(
+var SidebarMenuSub = React24.forwardRef(
   ({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)(
     "ul",
     {
@@ -7005,7 +7283,7 @@ var SidebarMenuSub = React23.forwardRef(
   )
 );
 SidebarMenuSub.displayName = "SidebarMenuSub";
-var SidebarMenuSubItem = React23.forwardRef(
+var SidebarMenuSubItem = React24.forwardRef(
   ({ ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime96.jsx)("li", { ref, ...props })
 );
 SidebarMenuSubItem.displayName = "SidebarMenuSubItem";
@@ -7029,7 +7307,7 @@ var sidebarMenuSubButtonVariants = (0, import_class_variance_authority11.cva)(
     }
   }
 );
-var SidebarMenuSubButton = React23.forwardRef(
+var SidebarMenuSubButton = React24.forwardRef(
   ({
     asChild = false,
     isActive,
@@ -7059,9 +7337,9 @@ 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_react37 = __toESM(require("react"), 1);
+var import_react48 = __toESM(require("react"), 1);
 var import_jsx_runtime97 = require("react/jsx-runtime");
-var CircularLoader = import_react37.default.memo(
+var CircularLoader = import_react48.default.memo(
   ({ visible = true, height, width, position, label, className }) => {
     if (!visible) return null;
     return /* @__PURE__ */ (0, import_jsx_runtime97.jsxs)(
@@ -7155,10 +7433,10 @@ var CircularLoader = import_react37.default.memo(
 CircularLoader.displayName = "CircularLoader";
 
 // src/small-grid-single-item/SmallGridSingleItem.tsx
-var import_react38 = require("react");
+var import_react49 = require("react");
 var import_lucide_react34 = require("lucide-react");
 var import_jsx_runtime98 = require("react/jsx-runtime");
-var SmallGridSingleItem = (0, import_react38.memo)(
+var SmallGridSingleItem = (0, import_react49.memo)(
   ({
     title,
     subtitle,
@@ -7279,7 +7557,7 @@ function SortingAction({
 }
 
 // src/status-button/StatusButton.tsx
-var import_react39 = require("react");
+var import_react50 = require("react");
 var import_react_i18next20 = require("react-i18next");
 var import_lucide_react36 = require("lucide-react");
 var import_jsx_runtime100 = require("react/jsx-runtime");
@@ -7297,7 +7575,7 @@ function StatusButton({
   ...props
 }) {
   const { t } = (0, import_react_i18next20.useTranslation)();
-  const configMap = (0, import_react39.useMemo)(() => {
+  const configMap = (0, import_react50.useMemo)(() => {
     const defaultLoadingConfig = {
       text: loadingText ?? `${t("saving")}...`,
       icon: /* @__PURE__ */ (0, import_jsx_runtime100.jsx)(import_lucide_react36.Loader2, { className: "h-4 w-4 animate-spin" }),
@@ -7422,9 +7700,9 @@ function Stepper({
 }
 
 // src/switch-blocks/SwitchBlocks.tsx
-var import_react40 = require("react");
+var import_react51 = require("react");
 var import_jsx_runtime103 = require("react/jsx-runtime");
-var SwitchBlocksInternal = (0, import_react40.forwardRef)(
+var SwitchBlocksInternal = (0, import_react51.forwardRef)(
   ({ options, value, onChange, disabled, className }, ref) => /* @__PURE__ */ (0, import_jsx_runtime103.jsx)(
     "div",
     {
@@ -7448,12 +7726,12 @@ var SwitchBlocksInternal = (0, import_react40.forwardRef)(
   )
 );
 SwitchBlocksInternal.displayName = "SwitchBlocks";
-var SwitchBlocks = (0, import_react40.memo)(SwitchBlocksInternal);
+var SwitchBlocks = (0, import_react51.memo)(SwitchBlocksInternal);
 
 // src/switch-group/SwitchGroup.tsx
-var React25 = __toESM(require("react"), 1);
+var React26 = __toESM(require("react"), 1);
 var import_jsx_runtime104 = require("react/jsx-runtime");
-var SwitchGroup = React25.forwardRef(
+var SwitchGroup = React26.forwardRef(
   ({ options, value = [], onChange, disabled = false, className, error, ...props }, ref) => {
     const handleOptionChange = (optionValue, checked) => {
       if (!onChange) return;
@@ -7508,7 +7786,7 @@ var SwitchGroup = React25.forwardRef(
 SwitchGroup.displayName = "SwitchGroup";
 
 // src/tabs/Tabs.tsx
-var import_react41 = require("react");
+var import_react52 = require("react");
 var TabsPrimitive2 = __toESM(require("@radix-ui/react-tabs"), 1);
 var import_class_variance_authority12 = require("class-variance-authority");
 var import_jsx_runtime105 = require("react/jsx-runtime");
@@ -7524,7 +7802,7 @@ var tabsListVariants = (0, import_class_variance_authority12.cva)("inline-flex i
     variant: "default"
   }
 });
-var TabsList = (0, import_react41.forwardRef)(
+var TabsList = (0, import_react52.forwardRef)(
   ({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
     TabsPrimitive2.List,
     {
@@ -7549,7 +7827,7 @@ var tabsTriggerVariants = (0, import_class_variance_authority12.cva)(
     }
   }
 );
-var TabsTrigger = (0, import_react41.forwardRef)(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
+var TabsTrigger = (0, import_react52.forwardRef)(({ className, variant, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(
   TabsPrimitive2.Trigger,
   {
     ref,
@@ -7558,7 +7836,7 @@ var TabsTrigger = (0, import_react41.forwardRef)(({ className, variant, ...props
   }
 ));
 TabsTrigger.displayName = TabsPrimitive2.Trigger.displayName;
-var TabsContent = (0, import_react41.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(TabsPrimitive2.Content, { ref, className, tabIndex: -1, ...props }));
+var TabsContent = (0, import_react52.forwardRef)(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime105.jsx)(TabsPrimitive2.Content, { ref, className, tabIndex: -1, ...props }));
 TabsContent.displayName = TabsPrimitive2.Content.displayName;
 
 // src/tabbed-section/TabbedSection.tsx
@@ -7699,11 +7977,11 @@ var TASK_VARIANTS = {
 var import_sonner2 = require("sonner");
 
 // src/toaster/useUpdateToast.ts
-var import_react42 = require("react");
+var import_react53 = require("react");
 var import_sonner = require("sonner");
 function useUpdateToast({ id }) {
-  const toastIdRef = (0, import_react42.useRef)("");
-  const getToastOptions = (0, import_react42.useCallback)(
+  const toastIdRef = (0, import_react53.useRef)("");
+  const getToastOptions = (0, import_react53.useCallback)(
     (options) => ({
       id: toastIdRef.current,
       dismissible: false,
@@ -7735,7 +8013,7 @@ function useUpdateToast({ id }) {
 }
 
 // src/toggle-group/ToggleGroup.tsx
-var React26 = __toESM(require("react"), 1);
+var React27 = __toESM(require("react"), 1);
 var ToggleGroupPrimitive = __toESM(require("@radix-ui/react-toggle-group"), 1);
 
 // src/toggle-group/style.ts
@@ -7769,12 +8047,12 @@ var toggleVariants = (0, import_class_variance_authority13.cva)(
 
 // src/toggle-group/ToggleGroup.tsx
 var import_jsx_runtime109 = require("react/jsx-runtime");
-var ToggleGroupContext = React26.createContext({
+var ToggleGroupContext = React27.createContext({
   size: "default",
   variant: "default",
   theme: "default"
 });
-var ToggleGroup = React26.forwardRef(({ className, variant, size, theme, children, ...props }, ref) => {
+var ToggleGroup = React27.forwardRef(({ className, variant, size, theme, children, ...props }, ref) => {
   const isTabVariant = variant === "tab";
   return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
     ToggleGroupPrimitive.Root,
@@ -7791,8 +8069,8 @@ var ToggleGroup = React26.forwardRef(({ className, variant, size, theme, childre
   );
 });
 ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
-var ToggleGroupItem = React26.forwardRef(({ className, children, variant, size, theme, ...props }, ref) => {
-  const context = React26.useContext(ToggleGroupContext);
+var ToggleGroupItem = React27.forwardRef(({ className, children, variant, size, theme, ...props }, ref) => {
+  const context = React27.useContext(ToggleGroupContext);
   const resolvedVariant = context.variant || variant;
   const isTabVariant = resolvedVariant === "tab";
   return /* @__PURE__ */ (0, import_jsx_runtime109.jsx)(
@@ -7818,7 +8096,7 @@ var ToggleGroupItem = React26.forwardRef(({ className, children, variant, size,
 ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
 
 // src/toggle-group/Toggles.tsx
-var import_react43 = require("react");
+var import_react54 = require("react");
 var import_jsx_runtime110 = require("react/jsx-runtime");
 var getValueArray2 = (value) => {
   if (value) {
@@ -7893,7 +8171,7 @@ function TogglesInternal({
     }
   };
   const isAnyActive = getValueArray2(value).length > 0;
-  (0, import_react43.useEffect)(() => {
+  (0, import_react54.useEffect)(() => {
     onAnySelectorActive?.(isAnyActive);
   }, [isAnyActive, onAnySelectorActive]);
   const currentValue = getValueArray2(value).map((item) => String(item));
@@ -7924,10 +8202,10 @@ function TogglesInternal({
     }) })
   ] });
 }
-var Toggles = (0, import_react43.forwardRef)(TogglesInternal);
+var Toggles = (0, import_react54.forwardRef)(TogglesInternal);
 
 // src/text-field/TextField.tsx
-var React27 = __toESM(require("react"), 1);
+var React28 = __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_i18next21 = require("react-i18next");
@@ -8021,7 +8299,7 @@ var floatingLabelClasses = [
   "peer-focus:to-[var(--text-field-bg-filled)]",
   "peer-focus:to-50%"
 ];
-var TextField = React27.forwardRef(
+var TextField = React28.forwardRef(
   ({
     className,
     wrapperClassName,
@@ -8040,7 +8318,7 @@ var TextField = React27.forwardRef(
   }, ref) => {
     const { t } = (0, import_react_i18next21.useTranslation)();
     const hasError = Boolean(error);
-    const autoId = React27.useId();
+    const autoId = React28.useId();
     const inputId = props.id || autoId;
     const inputClasses = cn(
       inputVariants({ variant, error: hasError, readOnly: Boolean(readOnly) }),
@@ -8135,16 +8413,16 @@ var TextField = React27.forwardRef(
 TextField.displayName = "TextField";
 
 // src/textarea/Textarea.tsx
-var import_react44 = require("react");
+var import_react55 = require("react");
 
 // src/textarea/styles.module.css
 var styles_default9 = {};
 
 // src/textarea/Textarea.tsx
 var import_jsx_runtime115 = require("react/jsx-runtime");
-var Textarea = (0, import_react44.forwardRef)(
+var Textarea = (0, import_react55.forwardRef)(
   ({ className, textareaClassName, label, disabled, name, invalid, ...textareaProps }, ref) => {
-    const inputId = (0, import_react44.useId)();
+    const inputId = (0, import_react55.useId)();
     return /* @__PURE__ */ (0, import_jsx_runtime115.jsxs)("div", { className: cn(styles_default9.container, className), children: [
       /* @__PURE__ */ (0, import_jsx_runtime115.jsx)(
         "textarea",
@@ -8273,11 +8551,11 @@ function WideButton({ className, disabled, ...props }) {
 }
 
 // src/datepicker/DatePicker.tsx
-var React31 = __toESM(require("react"), 1);
+var React32 = __toESM(require("react"), 1);
 var import_lucide_react42 = require("lucide-react");
 
 // src/drawer/Drawer.tsx
-var React28 = __toESM(require("react"), 1);
+var React29 = __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_runtime119 = require("react/jsx-runtime");
@@ -8295,7 +8573,7 @@ function DrawerPortal({ ...props }) {
 function DrawerClose({ ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(DialogPrimitive2.Close, { "data-slot": "drawer-close", ...props });
 }
-var DrawerOverlay = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+var DrawerOverlay = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
   DialogPrimitive2.Overlay,
   {
     ref,
@@ -8309,7 +8587,7 @@ var DrawerOverlay = React28.forwardRef(({ className, ...props }, ref) => /* @__P
 ));
 DrawerOverlay.displayName = DialogPrimitive2.Overlay.displayName;
 var DrawerOverlayClasses = "fixed inset-0 z-50 bg-black/50 data-[state=open]:animate-in data-[state=open]:fade-in-0 data-[state=closed]:animate-out data-[state=closed]:fade-out-0";
-var DrawerContent = React28.forwardRef(
+var DrawerContent = React29.forwardRef(
   ({
     className,
     children,
@@ -8321,19 +8599,19 @@ var DrawerContent = React28.forwardRef(
     ...props
   }, ref) => {
     const finalContainer = container || getCustomContainer() || void 0;
-    const nodeRef = React28.useRef(null);
-    const [dragOffsetY, setDragOffsetY] = React28.useState(0);
+    const nodeRef = React29.useRef(null);
+    const [dragOffsetY, setDragOffsetY] = React29.useState(0);
     const overlayOpacity = Math.max(
       DRAWER_MIN_OVERLAY_OPACITY,
       1 - dragOffsetY / (DRAWER_CLOSE_THRESHOLD * 2)
     );
-    const handleDrag = React28.useCallback(
+    const handleDrag = React29.useCallback(
       (_event, data) => {
         setDragOffsetY(Math.max(0, data.y));
       },
       []
     );
-    const handleStop = React28.useCallback(
+    const handleStop = React29.useCallback(
       (_event, data) => {
         if (data.y > DRAWER_CLOSE_THRESHOLD) {
           setDragOffsetY(0);
@@ -8424,7 +8702,7 @@ var DrawerHeader = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_r
 DrawerHeader.displayName = "DrawerHeader";
 var DrawerFooter = ({ className, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)("div", { className: cn("flex flex-col gap-2 p-5", className), ...props });
 DrawerFooter.displayName = "DrawerFooter";
-var DrawerTitle = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+var DrawerTitle = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
   DialogPrimitive2.Title,
   {
     ref,
@@ -8434,7 +8712,7 @@ var DrawerTitle = React28.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 DrawerTitle.displayName = DialogPrimitive2.Title.displayName;
-var DrawerDescription = React28.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
+var DrawerDescription = React29.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime119.jsx)(
   DialogPrimitive2.Description,
   {
     ref,
@@ -8446,7 +8724,7 @@ var DrawerDescription = React28.forwardRef(({ className, ...props }, ref) => /*
 DrawerDescription.displayName = DialogPrimitive2.Description.displayName;
 
 // src/datepicker/useDatePickerWheel.ts
-var React29 = __toESM(require("react"), 1);
+var React30 = __toESM(require("react"), 1);
 
 // src/datepicker/datePicker.utils.ts
 var DISPLAY_PAD_LENGTH = 2;
@@ -8597,21 +8875,21 @@ function useDatePickerWheel({
   minDate,
   maxDate
 }) {
-  const years = React29.useMemo(() => getYearRange(minDate, maxDate), [maxDate, minDate]);
-  const [draftDate, setDraftDate] = React29.useState(
+  const years = React30.useMemo(() => getYearRange(minDate, maxDate), [maxDate, minDate]);
+  const [draftDate, setDraftDate] = React30.useState(
     () => resolveInitialDate({ value, defaultValue, minDate, maxDate })
   );
   const draftYear = draftDate.getFullYear();
   const draftMonth = draftDate.getMonth();
-  const [monthScrollTop, setMonthScrollTop] = React29.useState(0);
-  const [dayScrollTop, setDayScrollTop] = React29.useState(0);
-  const [yearScrollTop, setYearScrollTop] = React29.useState(0);
-  const monthListRef = React29.useRef(null);
-  const dayListRef = React29.useRef(null);
-  const yearListRef = React29.useRef(null);
-  const settleTimeoutsRef = React29.useRef({});
-  const animationFramesRef = React29.useRef({});
-  const columnRefs = React29.useMemo(
+  const [monthScrollTop, setMonthScrollTop] = React30.useState(0);
+  const [dayScrollTop, setDayScrollTop] = React30.useState(0);
+  const [yearScrollTop, setYearScrollTop] = React30.useState(0);
+  const monthListRef = React30.useRef(null);
+  const dayListRef = React30.useRef(null);
+  const yearListRef = React30.useRef(null);
+  const settleTimeoutsRef = React30.useRef({});
+  const animationFramesRef = React30.useRef({});
+  const columnRefs = React30.useMemo(
     () => ({
       month: monthListRef,
       day: dayListRef,
@@ -8619,7 +8897,7 @@ function useDatePickerWheel({
     }),
     []
   );
-  const setColumnScrollTop = React29.useCallback(
+  const setColumnScrollTop = React30.useCallback(
     (column, nextScrollTop) => {
       if (column === "month") {
         setMonthScrollTop(nextScrollTop);
@@ -8633,19 +8911,19 @@ function useDatePickerWheel({
     },
     []
   );
-  const clearSettleTimeout = React29.useCallback((column) => {
+  const clearSettleTimeout = React30.useCallback((column) => {
     const timeoutId = settleTimeoutsRef.current[column];
     if (timeoutId === void 0) return;
     window.clearTimeout(timeoutId);
     delete settleTimeoutsRef.current[column];
   }, []);
-  const clearAnimationFrame = React29.useCallback((column) => {
+  const clearAnimationFrame = React30.useCallback((column) => {
     const frameId = animationFramesRef.current[column];
     if (frameId === void 0) return;
     window.cancelAnimationFrame(frameId);
     delete animationFramesRef.current[column];
   }, []);
-  React29.useEffect(
+  React30.useEffect(
     () => () => {
       ["month", "day", "year"].forEach((column) => {
         clearSettleTimeout(column);
@@ -8654,22 +8932,22 @@ function useDatePickerWheel({
     },
     [clearAnimationFrame, clearSettleTimeout]
   );
-  React29.useEffect(() => {
+  React30.useEffect(() => {
     if (isOpen) return;
     setDraftDate(resolveInitialDate({ value, defaultValue, minDate, maxDate }));
   }, [defaultValue, isOpen, maxDate, minDate, value]);
-  const months = React29.useMemo(
+  const months = React30.useMemo(
     () => getAllowedMonths(draftYear, minDate, maxDate),
     [draftYear, maxDate, minDate]
   );
-  const days = React29.useMemo(
+  const days = React30.useMemo(
     () => getAllowedDays(draftYear, draftMonth, minDate, maxDate),
     [draftMonth, draftYear, maxDate, minDate]
   );
   const monthIndex = months.findIndex((month) => month === draftMonth);
   const dayIndex = days.findIndex((day) => day === draftDate.getDate());
   const yearIndex = years.findIndex((year) => year === draftYear);
-  const syncScrollPositions = React29.useCallback(
+  const syncScrollPositions = React30.useCallback(
     (nextDate, behavior = "auto") => {
       const nextMonths = getAllowedMonths(nextDate.getFullYear(), minDate, maxDate);
       const nextMonthIndex = nextMonths.findIndex((month) => month === nextDate.getMonth());
@@ -8693,7 +8971,7 @@ function useDatePickerWheel({
     },
     [maxDate, minDate, years]
   );
-  React29.useLayoutEffect(() => {
+  React30.useLayoutEffect(() => {
     if (!isOpen) return;
     const nextDate = resolveInitialDate({ value, defaultValue, minDate, maxDate });
     setDraftDate(nextDate);
@@ -8704,7 +8982,7 @@ function useDatePickerWheel({
       window.cancelAnimationFrame(frameId);
     };
   }, [defaultValue, isOpen, maxDate, minDate, syncScrollPositions, value]);
-  const updateDraftDate = React29.useCallback(
+  const updateDraftDate = React30.useCallback(
     (column, targetIndex, behavior = "smooth") => {
       const currentDate = stripTime(draftDate);
       const currentYear = currentDate.getFullYear();
@@ -8749,7 +9027,7 @@ function useDatePickerWheel({
     },
     [days, draftDate, maxDate, minDate, months, syncScrollPositions, years]
   );
-  const settleColumnScroll = React29.useCallback(
+  const settleColumnScroll = React30.useCallback(
     (column) => {
       const list = columnRefs[column].current;
       if (!list) return;
@@ -8762,7 +9040,7 @@ function useDatePickerWheel({
     },
     [columnRefs, days.length, months.length, updateDraftDate, years.length]
   );
-  const scheduleScrollSettle = React29.useCallback(
+  const scheduleScrollSettle = React30.useCallback(
     (column) => {
       clearSettleTimeout(column);
       settleTimeoutsRef.current[column] = window.setTimeout(() => {
@@ -8771,7 +9049,7 @@ function useDatePickerWheel({
     },
     [clearSettleTimeout, settleColumnScroll]
   );
-  const handleColumnScroll = React29.useCallback(
+  const handleColumnScroll = React30.useCallback(
     (column) => {
       const list = columnRefs[column].current;
       if (!list) return;
@@ -8785,13 +9063,13 @@ function useDatePickerWheel({
     },
     [clearAnimationFrame, columnRefs, scheduleScrollSettle, setColumnScrollTop]
   );
-  const handleOptionSelect = React29.useCallback(
+  const handleOptionSelect = React30.useCallback(
     (column, targetIndex) => {
       updateDraftDate(column, targetIndex, "smooth");
     },
     [updateDraftDate]
   );
-  const focusAdjacentColumn = React29.useCallback(
+  const focusAdjacentColumn = React30.useCallback(
     (column, direction) => {
       const order = ["month", "day", "year"];
       const currentIndex = order.indexOf(column);
@@ -8801,7 +9079,7 @@ function useDatePickerWheel({
     },
     [columnRefs]
   );
-  const handleColumnKeyDown = React29.useCallback(
+  const handleColumnKeyDown = React30.useCallback(
     (column, event) => {
       const currentIndex = column === "month" ? monthIndex : column === "day" ? dayIndex : yearIndex;
       const maxIndex = column === "month" ? months.length - 1 : column === "day" ? days.length - 1 : years.length - 1;
@@ -9089,28 +9367,6 @@ function DatePickerContent({
   ) });
 }
 
-// src/lib/use-screen-resize.ts
-var import_react45 = require("react");
-var eventName = "resize";
-function useScreenResize(maxWidth) {
-  const [isInitialized, setIsInitialized] = (0, import_react45.useState)(false);
-  const [isMatch, setIsMatch] = (0, import_react45.useState)(false);
-  const handleResizeEvent = (0, import_react45.useCallback)(() => {
-    const adjustedMaxWidth = `${parseInt(maxWidth, 10) - 1}px`;
-    const media = getWindow().matchMedia(`(max-width: ${adjustedMaxWidth})`);
-    setIsInitialized(true);
-    setIsMatch(!!media?.matches);
-  }, [maxWidth]);
-  (0, import_react45.useLayoutEffect)(() => {
-    handleResizeEvent();
-    getWindow().addEventListener(eventName, handleResizeEvent);
-    return () => {
-      getWindow().removeEventListener(eventName, handleResizeEvent);
-    };
-  }, [handleResizeEvent]);
-  return { isMatch, isInitialized };
-}
-
 // src/lib/device.ts
 var DEVICE = {
   mobileS: "320px",
@@ -9127,7 +9383,7 @@ var DEVICE = {
 };
 
 // src/field-trigger/FieldTrigger.tsx
-var React30 = __toESM(require("react"), 1);
+var React31 = __toESM(require("react"), 1);
 var import_lucide_react41 = require("lucide-react");
 var import_react_i18next22 = require("react-i18next");
 
@@ -9171,7 +9427,7 @@ function FieldErrorMessage({
 
 // src/field-trigger/FieldTrigger.tsx
 var import_jsx_runtime123 = require("react/jsx-runtime");
-var FieldTrigger = React30.forwardRef(
+var FieldTrigger = React31.forwardRef(
   ({
     as = "button",
     variant = "airbnb",
@@ -9338,7 +9594,7 @@ FieldTrigger.displayName = "FieldTrigger";
 // src/datepicker/DatePicker.tsx
 var import_jsx_runtime124 = require("react/jsx-runtime");
 var DEFAULT_MIN_DATE = new Date(1920, 0, 1);
-var DatePicker = React31.forwardRef(
+var DatePicker = React32.forwardRef(
   ({
     variant = "default",
     label,
@@ -9364,24 +9620,24 @@ var DatePicker = React31.forwardRef(
     formatValue = formatDateValue
   }, ref) => {
     const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
-    const [isOpen, setIsOpen] = React31.useState(false);
-    const triggerId = React31.useId();
-    const pickerId = React31.useId();
-    const labelId = React31.useId();
-    const valueId = React31.useId();
-    const helperTextId = React31.useId();
-    const errorId = React31.useId();
-    const internalRef = React31.useRef(null);
+    const [isOpen, setIsOpen] = React32.useState(false);
+    const triggerId = React32.useId();
+    const pickerId = React32.useId();
+    const labelId = React32.useId();
+    const valueId = React32.useId();
+    const helperTextId = React32.useId();
+    const errorId = React32.useId();
+    const internalRef = React32.useRef(null);
     const combinedRef = useCombinedRef(ref, internalRef);
-    const monthLabels = React31.useMemo(() => getMonthLabels(locale), [locale]);
-    const resolvedMinDate = React31.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
-    const resolvedMaxDate = React31.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
-    const normalizedValue = React31.useMemo(() => normalizeDateValue(value), [value]);
-    const normalizedDefaultValue = React31.useMemo(
+    const monthLabels = React32.useMemo(() => getMonthLabels(locale), [locale]);
+    const resolvedMinDate = React32.useMemo(() => minDate ?? DEFAULT_MIN_DATE, [minDate]);
+    const resolvedMaxDate = React32.useMemo(() => maxDate ?? /* @__PURE__ */ new Date(), [maxDate]);
+    const normalizedValue = React32.useMemo(() => normalizeDateValue(value), [value]);
+    const normalizedDefaultValue = React32.useMemo(
       () => normalizeDateValue(defaultValue),
       [defaultValue]
     );
-    const resolvedValue = React31.useMemo(
+    const resolvedValue = React32.useMemo(
       () => normalizedValue ? clampDate(normalizedValue, resolvedMinDate, resolvedMaxDate) : null,
       [normalizedValue, resolvedMaxDate, resolvedMinDate]
     );
@@ -9412,7 +9668,7 @@ var DatePicker = React31.forwardRef(
       minDate: resolvedMinDate,
       maxDate: resolvedMaxDate
     });
-    const handleOpenChange = React31.useCallback(
+    const handleOpenChange = React32.useCallback(
       (nextOpen) => {
         if (isBlocked && nextOpen) return;
         setIsOpen(nextOpen);
@@ -9422,7 +9678,7 @@ var DatePicker = React31.forwardRef(
       },
       [isBlocked]
     );
-    const handleDone = React31.useCallback(() => {
+    const handleDone = React32.useCallback(() => {
       if (isBlocked) return;
       onChange(clampDate(draftDate, resolvedMinDate, resolvedMaxDate));
       handleOpenChange(false);
@@ -9434,11 +9690,11 @@ var DatePicker = React31.forwardRef(
       resolvedMaxDate,
       resolvedMinDate
     ]);
-    const handleTriggerClick = React31.useCallback(() => {
+    const handleTriggerClick = React32.useCallback(() => {
       if (isBlocked) return;
       setIsOpen(true);
     }, [isBlocked]);
-    const handleTriggerKeyDown = React31.useCallback(
+    const handleTriggerKeyDown = React32.useCallback(
       (event) => {
         if (isBlocked) return;
         if (event.key === "ArrowDown" || event.key === "ArrowUp" || event.key === "Enter" || event.key === " ") {
@@ -9448,7 +9704,7 @@ var DatePicker = React31.forwardRef(
       },
       [isBlocked]
     );
-    React31.useEffect(() => {
+    React32.useEffect(() => {
       if (isBlocked) {
         setIsOpen(false);
       }
@@ -9630,10 +9886,10 @@ function ResponsiveSheet({
 }
 
 // src/airbnb/input/Input.tsx
-var React32 = __toESM(require("react"), 1);
+var React33 = __toESM(require("react"), 1);
 var import_jsx_runtime126 = require("react/jsx-runtime");
 var getInputValue = (value) => value != null ? String(value) : "";
-var AirbnbInput = React32.forwardRef(
+var AirbnbInput = React33.forwardRef(
   ({
     variant = "default",
     label,
@@ -9662,15 +9918,15 @@ var AirbnbInput = React32.forwardRef(
     placeholder,
     ...props
   }, ref) => {
-    const generatedId = React32.useId();
-    const inputRef = React32.useRef(null);
+    const generatedId = React33.useId();
+    const inputRef = React33.useRef(null);
     const inputId = id ?? generatedId;
     const fieldId = `${inputId}-field`;
     const labelId = `${inputId}-label`;
     const errorId = `${inputId}-error`;
     const accessibleLabel = placeholder ?? label;
-    const [isFocused, setIsFocused] = React32.useState(false);
-    const [currentValue, setCurrentValue] = React32.useState(
+    const [isFocused, setIsFocused] = React33.useState(false);
+    const [currentValue, setCurrentValue] = React33.useState(
       () => value != null ? getInputValue(value) : getInputValue(defaultValue)
     );
     const resolvedValue = value != null ? getInputValue(value) : currentValue;
@@ -9680,11 +9936,11 @@ var AirbnbInput = React32.forwardRef(
     const triggerError = error ?? invalid;
     const hasLabelMeta = Boolean(optional) || Boolean(tooltip);
     const isBlocked = Boolean(disabled) || Boolean(loading);
-    React32.useLayoutEffect(() => {
+    React33.useLayoutEffect(() => {
       const nextValue = value != null ? getInputValue(value) : getInputValue(inputRef.current?.value);
       setCurrentValue((prevValue) => prevValue === nextValue ? prevValue : nextValue);
     }, [value]);
-    const setRefs = React32.useCallback(
+    const setRefs = React33.useCallback(
       (node) => {
         inputRef.current = node;
         if (node && value == null) {
@@ -9782,11 +10038,11 @@ var AirbnbInput = React32.forwardRef(
 AirbnbInput.displayName = "Input";
 
 // src/airbnb/phone-field/PhoneField.tsx
-var React38 = __toESM(require("react"), 1);
+var React39 = __toESM(require("react"), 1);
 var import_lucide_react44 = require("lucide-react");
 
 // src/airbnb/select/Select.tsx
-var React37 = __toESM(require("react"), 1);
+var React38 = __toESM(require("react"), 1);
 
 // src/airbnb/select/SelectDesktopMenu.tsx
 var import_jsx_runtime127 = require("react/jsx-runtime");
@@ -10131,10 +10387,10 @@ function SelectMobileContent({
 }
 
 // src/airbnb/select/SelectTrigger.tsx
-var React33 = __toESM(require("react"), 1);
+var React34 = __toESM(require("react"), 1);
 var import_lucide_react43 = require("lucide-react");
 var import_jsx_runtime131 = require("react/jsx-runtime");
-var SelectTrigger2 = React33.forwardRef(
+var SelectTrigger2 = React34.forwardRef(
   ({
     id,
     open,
@@ -10201,7 +10457,7 @@ var SelectTrigger2 = React33.forwardRef(
 SelectTrigger2.displayName = "SelectTrigger";
 
 // src/airbnb/select/useDesktopSelect.ts
-var React34 = __toESM(require("react"), 1);
+var React35 = __toESM(require("react"), 1);
 function useDesktopSelect({
   isMobile,
   isOpen,
@@ -10210,12 +10466,12 @@ function useDesktopSelect({
   disabled,
   onChange
 }) {
-  const [highlightedIndex, setHighlightedIndex] = React34.useState(-1);
-  const triggerRef = React34.useRef(null);
-  const listRef = React34.useRef(null);
-  const optionRefs = React34.useRef([]);
+  const [highlightedIndex, setHighlightedIndex] = React35.useState(-1);
+  const triggerRef = React35.useRef(null);
+  const listRef = React35.useRef(null);
+  const optionRefs = React35.useRef([]);
   const selectedIndex = getOptionIndex(options, value);
-  React34.useEffect(() => {
+  React35.useEffect(() => {
     if (!isOpen || isMobile) return;
     setHighlightedIndex((currentIndex) => {
       if (currentIndex >= 0) {
@@ -10230,34 +10486,34 @@ function useDesktopSelect({
       window.cancelAnimationFrame(frameId);
     };
   }, [isMobile, isOpen, options, selectedIndex]);
-  React34.useEffect(() => {
+  React35.useEffect(() => {
     if (!isOpen || isMobile || highlightedIndex < 0) return;
     optionRefs.current[highlightedIndex]?.scrollIntoView({
       block: "nearest"
     });
   }, [highlightedIndex, isMobile, isOpen]);
-  React34.useEffect(() => {
+  React35.useEffect(() => {
     if (isOpen) return;
     setHighlightedIndex(-1);
   }, [isOpen]);
-  const focusTrigger = React34.useCallback(() => {
+  const focusTrigger = React35.useCallback(() => {
     triggerRef.current?.focus();
   }, []);
-  const handleSelect = React34.useCallback(
+  const handleSelect = React35.useCallback(
     (option) => {
       if (option.isDisabled || disabled) return;
       onChange(option);
     },
     [disabled, onChange]
   );
-  const openMenu = React34.useCallback(
+  const openMenu = React35.useCallback(
     (targetIndex) => {
       const fallbackIndex = selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
       setHighlightedIndex(targetIndex ?? fallbackIndex);
     },
     [options, selectedIndex]
   );
-  const handleTriggerKeyDown = React34.useCallback(
+  const handleTriggerKeyDown = React35.useCallback(
     (event, onOpen) => {
       if (disabled) return;
       if (event.key === "ArrowDown") {
@@ -10282,7 +10538,7 @@ function useDesktopSelect({
     },
     [disabled, openMenu, options, selectedIndex]
   );
-  const handleMenuKeyDown = React34.useCallback(
+  const handleMenuKeyDown = React35.useCallback(
     (event, onClose) => {
       if (event.key === "Escape") {
         event.preventDefault();
@@ -10332,7 +10588,7 @@ function useDesktopSelect({
     },
     [focusTrigger, highlightedIndex, onChange, options]
   );
-  const setOptionRef = React34.useCallback(
+  const setOptionRef = React35.useCallback(
     (index, node) => {
       optionRefs.current[index] = node;
     },
@@ -10352,23 +10608,23 @@ function useDesktopSelect({
 }
 
 // src/airbnb/select/useMobileSelectWheel.ts
-var React35 = __toESM(require("react"), 1);
+var React36 = __toESM(require("react"), 1);
 function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
-  const [pendingValue, setPendingValue] = React35.useState(
+  const [pendingValue, setPendingValue] = React36.useState(
     value ?? null
   );
-  const [mobileScrollTop, setMobileScrollTop] = React35.useState(0);
-  const mobileListRef = React35.useRef(null);
-  const scrollSettleTimeoutRef = React35.useRef(null);
-  const scrollAnimationFrameRef = React35.useRef(null);
-  const getTargetIndex = React35.useCallback(
+  const [mobileScrollTop, setMobileScrollTop] = React36.useState(0);
+  const mobileListRef = React36.useRef(null);
+  const scrollSettleTimeoutRef = React36.useRef(null);
+  const scrollAnimationFrameRef = React36.useRef(null);
+  const getTargetIndex = React36.useCallback(
     (targetValue) => {
       const selectedIndex = getOptionIndex(options, targetValue);
       return selectedIndex >= 0 ? selectedIndex : getFirstEnabledOptionIndex(options);
     },
     [options]
   );
-  const syncScrollPosition = React35.useCallback(
+  const syncScrollPosition = React36.useCallback(
     (targetValue, behavior = "instant") => {
       const targetIndex = getTargetIndex(targetValue);
       if (targetIndex < 0) return;
@@ -10387,27 +10643,27 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     },
     [getTargetIndex, options]
   );
-  const clearScrollSettleTimeout = React35.useCallback(() => {
+  const clearScrollSettleTimeout = React36.useCallback(() => {
     if (scrollSettleTimeoutRef.current === null) return;
     window.clearTimeout(scrollSettleTimeoutRef.current);
     scrollSettleTimeoutRef.current = null;
   }, []);
-  const clearScrollAnimationFrame = React35.useCallback(() => {
+  const clearScrollAnimationFrame = React36.useCallback(() => {
     if (scrollAnimationFrameRef.current === null) return;
     window.cancelAnimationFrame(scrollAnimationFrameRef.current);
     scrollAnimationFrameRef.current = null;
   }, []);
-  React35.useEffect(
+  React36.useEffect(
     () => () => {
       clearScrollSettleTimeout();
       clearScrollAnimationFrame();
     },
     [clearScrollAnimationFrame, clearScrollSettleTimeout]
   );
-  React35.useEffect(() => {
+  React36.useEffect(() => {
     setPendingValue(value ?? null);
   }, [value]);
-  React35.useLayoutEffect(() => {
+  React36.useLayoutEffect(() => {
     if (!isMobile || !isOpen) return;
     const frameId = window.requestAnimationFrame(() => {
       syncScrollPosition(value ?? null, "instant");
@@ -10416,7 +10672,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
       window.cancelAnimationFrame(frameId);
     };
   }, [isMobile, isOpen, syncScrollPosition, value]);
-  const settleScroll = React35.useCallback(() => {
+  const settleScroll = React36.useCallback(() => {
     if (!mobileListRef.current) return;
     const nextIndex = Math.round(mobileListRef.current.scrollTop / MOBILE_OPTION_HEIGHT);
     const nextOption = options[nextIndex];
@@ -10428,13 +10684,13 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     }
     setPendingValue(nextOption);
   }, [options, pendingValue]);
-  const scheduleScrollSettle = React35.useCallback(() => {
+  const scheduleScrollSettle = React36.useCallback(() => {
     clearScrollSettleTimeout();
     scrollSettleTimeoutRef.current = window.setTimeout(() => {
       settleScroll();
     }, MOBILE_SCROLL_SETTLE_DELAY);
   }, [clearScrollSettleTimeout, settleScroll]);
-  const handleScroll = React35.useCallback(() => {
+  const handleScroll = React36.useCallback(() => {
     if (!mobileListRef.current) return;
     const nextScrollTop = mobileListRef.current.scrollTop;
     clearScrollAnimationFrame();
@@ -10444,7 +10700,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     });
     scheduleScrollSettle();
   }, [clearScrollAnimationFrame, scheduleScrollSettle]);
-  const focusOptionByIndex = React35.useCallback(
+  const focusOptionByIndex = React36.useCallback(
     (index, behavior = "instant", updatePendingImmediately = behavior === "instant") => {
       if (!mobileListRef.current || index < 0 || index >= options.length) return;
       const option = options[index];
@@ -10462,7 +10718,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     },
     [options, scheduleScrollSettle]
   );
-  const handleOptionClick = React35.useCallback(
+  const handleOptionClick = React36.useCallback(
     (option) => {
       if (!mobileListRef.current || disabled || option.isDisabled) return;
       const optionIndex = getOptionIndex(options, option);
@@ -10471,7 +10727,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     },
     [disabled, focusOptionByIndex, options]
   );
-  const moveByStep = React35.useCallback(
+  const moveByStep = React36.useCallback(
     (step) => {
       const currentIndex = getOptionIndex(options, pendingValue);
       const fallbackIndex = step === 1 ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
@@ -10483,7 +10739,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     },
     [focusOptionByIndex, options, pendingValue]
   );
-  const moveToBoundary = React35.useCallback(
+  const moveToBoundary = React36.useCallback(
     (boundary) => {
       const targetIndex = boundary === "start" ? getFirstEnabledOptionIndex(options) : getLastEnabledOptionIndex(options);
       if (targetIndex >= 0) {
@@ -10492,7 +10748,7 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
     },
     [focusOptionByIndex, options]
   );
-  const syncPendingValue = React35.useCallback(
+  const syncPendingValue = React36.useCallback(
     (nextValue) => {
       const normalizedValue = nextValue ?? null;
       const matchedIndex = getOptionIndex(options, normalizedValue);
@@ -10520,9 +10776,9 @@ function useMobileSelectWheel({ isMobile, isOpen, options, value, disabled }) {
 }
 
 // src/airbnb/select/useSelectIds.ts
-var React36 = __toESM(require("react"), 1);
+var React37 = __toESM(require("react"), 1);
 function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
-  const reactId = React36.useId().replace(/:/g, "");
+  const reactId = React37.useId().replace(/:/g, "");
   const baseId = name ? `select-${name}` : `select-${reactId}`;
   const triggerId = `${baseId}-trigger`;
   const labelId = `${baseId}-label`;
@@ -10532,7 +10788,7 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
   const listboxId = `${baseId}-listbox`;
   const describedErrorId = error && !hideErrorMessage ? errorId : void 0;
   const describedBy = [!hasValue ? helperTextId : null, describedErrorId].filter(Boolean).join(" ") || void 0;
-  const getOptionId2 = React36.useCallback(
+  const getOptionId2 = React37.useCallback(
     (index) => `${baseId}-option-${index}`,
     [baseId]
   );
@@ -10549,61 +10805,9 @@ function useSelectIds({ name, hasValue, error, hideErrorMessage }) {
   };
 }
 
-// src/lib/use-outside-click.ts
-var import_react46 = require("react");
-function useOutsideClick(elementRef, onOutsideClick, nested) {
-  const handleOutsideClick = (0, import_react46.useRef)(onOutsideClick);
-  handleOutsideClick.current = onOutsideClick;
-  const checkNestedElements = (0, import_react46.useCallback)(
-    (event) => {
-      const checkIsElementClickedBySelector = (selector) => {
-        const nestedElement = getDocument().querySelector(selector);
-        return nestedElement?.contains(event.target);
-      };
-      const checkDataAttribute = () => {
-        const target = event.target;
-        if (!target || !(target instanceof HTMLElement)) {
-          return false;
-        }
-        let current = target;
-        while (current) {
-          if (current.hasAttribute("data-exclude-from-outside-click")) {
-            return true;
-          }
-          current = current.parentElement;
-        }
-        return false;
-      };
-      if (nested) {
-        if (typeof nested === "string") {
-          if (checkIsElementClickedBySelector(nested)) return true;
-        } else {
-          if (nested.some(checkIsElementClickedBySelector)) return true;
-        }
-      }
-      return checkDataAttribute();
-    },
-    [nested]
-  );
-  (0, import_react46.useEffect)(() => {
-    function handleClickOutside(event) {
-      const isNestedElement = checkNestedElements(event);
-      if (elementRef?.current && !elementRef.current.contains(event.target) && !isNestedElement) {
-        handleOutsideClick.current?.(event);
-      }
-    }
-    getDocument().addEventListener("mousedown", handleClickOutside, true);
-    getDocument().addEventListener("touchstart", handleClickOutside, true);
-    return () => {
-      getDocument().removeEventListener("mousedown", handleClickOutside, true);
-      getDocument().removeEventListener("touchstart", handleClickOutside, true);
-    };
-  }, [checkNestedElements, elementRef]);
-}
-
 // src/airbnb/select/Select.tsx
 var import_jsx_runtime132 = require("react/jsx-runtime");
-var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
+var AirbnbSelect = React38.forwardRef(function AirbnbSelect2({
   options = [],
   value,
   onChange,
@@ -10630,8 +10834,8 @@ var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
   noOptionsMessage
 }, ref) {
   const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
-  const [isOpen, setIsOpen] = React37.useState(false);
-  const containerRef = React37.useRef(null);
+  const [isOpen, setIsOpen] = React38.useState(false);
+  const containerRef = React38.useRef(null);
   const hasValue = Boolean(value);
   const helperText = placeholder ?? label;
   const isBlocked = Boolean(disabled) || Boolean(loading);
@@ -10685,12 +10889,12 @@ var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
   const activeMobileIndex = getOptionIndex(options, pendingValue);
   const valueLabel = value ? getValueLabel?.(value) ?? String(value.label) : void 0;
   useOutsideClick(containerRef, isOpen && !isMobile ? () => setIsOpen(false) : null);
-  React37.useEffect(() => {
+  React38.useEffect(() => {
     if (isBlocked) {
       setIsOpen(false);
     }
   }, [isBlocked]);
-  React37.useEffect(
+  React38.useEffect(
     function setCorrectOptionIfThereIsOnlyValue() {
       if (value?.value === void 0 || value.value === null || value.label !== "") {
         return;
@@ -10702,7 +10906,7 @@ var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
     },
     [onChange, options, value]
   );
-  const handleMobileOpenChange = React37.useCallback(
+  const handleMobileOpenChange = React38.useCallback(
     (nextOpen) => {
       if (isBlocked && nextOpen) return;
       setIsOpen(nextOpen);
@@ -10713,7 +10917,7 @@ var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
     },
     [focusTrigger, isBlocked, syncPendingValue, value]
   );
-  const handleMobileDone = React37.useCallback(() => {
+  const handleMobileDone = React38.useCallback(() => {
     if (isBlocked) return;
     const finalOption = pendingValue;
     if (finalOption && finalOption.value !== value?.value) {
@@ -10722,7 +10926,7 @@ var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
     setIsOpen(false);
     focusTrigger();
   }, [focusTrigger, isBlocked, onChange, pendingValue, value]);
-  const handleTriggerClick = React37.useCallback(() => {
+  const handleTriggerClick = React38.useCallback(() => {
     if (isBlocked) return;
     setIsOpen((prev) => {
       const nextOpen = !prev;
@@ -10891,7 +11095,7 @@ var AirbnbSelect = React37.forwardRef(function AirbnbSelect2({
 
 // src/airbnb/phone-field/PhoneField.tsx
 var import_jsx_runtime133 = require("react/jsx-runtime");
-var PhoneField = React38.forwardRef(
+var PhoneField = React39.forwardRef(
   ({
     variant = "default",
     label,
@@ -10915,8 +11119,8 @@ var PhoneField = React38.forwardRef(
     mobileTitle,
     codePlaceholder = "+00"
   }, ref) => {
-    const inputId = React38.useId();
-    const codeOptions = React38.useMemo(
+    const inputId = React39.useId();
+    const codeOptions = React39.useMemo(
       () => options.map((option) => ({
         value: option.value,
         label: `${option.label} (${option.value})`,
@@ -10924,7 +11128,7 @@ var PhoneField = React38.forwardRef(
       })),
       [options]
     );
-    const selectedCodeOption = React38.useMemo(
+    const selectedCodeOption = React39.useMemo(
       () => codeOptions.find((option) => option.value === value?.code) ?? null,
       [codeOptions, value?.code]
     );
@@ -11066,11 +11270,11 @@ var PhoneField = React38.forwardRef(
 PhoneField.displayName = "PhoneField";
 
 // src/airbnb/search-input/SearchInput.tsx
-var React39 = __toESM(require("react"), 1);
+var React40 = __toESM(require("react"), 1);
 var import_react_i18next23 = require("react-i18next");
 var import_lucide_react45 = require("lucide-react");
 var import_jsx_runtime134 = require("react/jsx-runtime");
-var AirbnbSearchInput = React39.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
+var AirbnbSearchInput = React40.forwardRef(({ onReset, placeholder, wrapperClassName, ...props }, ref) => {
   const { t } = (0, import_react_i18next23.useTranslation)();
   const placeholderText = placeholder || t("search_property") + "...";
   return /* @__PURE__ */ (0, import_jsx_runtime134.jsxs)("div", { className: cn("input-wrapper relative", wrapperClassName), children: [
@@ -11108,28 +11312,10 @@ var AirbnbSearchInput = React39.forwardRef(({ onReset, placeholder, wrapperClass
 AirbnbSearchInput.displayName = "SearchInput";
 
 // src/searchable-select/SearchableSelect.tsx
-var React40 = __toESM(require("react"), 1);
+var React41 = __toESM(require("react"), 1);
 var import_lucide_react46 = require("lucide-react");
 var import_react_virtual = require("@tanstack/react-virtual");
-var import_react48 = require("react");
-
-// src/lib/use-event.ts
-var import_react47 = require("react");
-function useEvent(fn) {
-  const fnRef = (0, import_react47.useRef)(fn);
-  (0, import_react47.useLayoutEffect)(() => {
-    fnRef.current = fn;
-  }, [fn]);
-  const eventCb = (0, import_react47.useCallback)(
-    (...args) => {
-      return fnRef.current?.apply(null, args);
-    },
-    [fnRef]
-  );
-  return eventCb;
-}
-
-// src/searchable-select/SearchableSelect.tsx
+var import_react56 = require("react");
 var import_jsx_runtime135 = require("react/jsx-runtime");
 var ROW_HEIGHT = 48;
 var DESKTOP_LIST_HEIGHT = 280;
@@ -11171,13 +11357,13 @@ var SearchableSelectInternal = ({
   loadingMessage
 }, ref) => {
   const { isMatch: isMobile } = useScreenResize(DEVICE.mobileXL);
-  const reactId = React40.useId();
-  const [open, setOpen] = React40.useState(false);
-  const [internalSearchValue, setInternalSearchValue] = React40.useState("");
-  const [highlightedIndex, setHighlightedIndex] = React40.useState(-1);
-  const containerRef = React40.useRef(null);
-  const triggerRef = React40.useRef(null);
-  const inputRef = React40.useRef(null);
+  const reactId = React41.useId();
+  const [open, setOpen] = React41.useState(false);
+  const [internalSearchValue, setInternalSearchValue] = React41.useState("");
+  const [highlightedIndex, setHighlightedIndex] = React41.useState(-1);
+  const containerRef = React41.useRef(null);
+  const triggerRef = React41.useRef(null);
+  const inputRef = React41.useRef(null);
   const listboxId = `${reactId}-listbox`;
   const labelId = `${reactId}-label`;
   const valueId = `${reactId}-value`;
@@ -11186,13 +11372,13 @@ var SearchableSelectInternal = ({
   const searchInputId = `${reactId}-search`;
   const effectiveSearchValue = searchValue ?? internalSearchValue;
   const shouldFilterLocally = !onSearchChange && filterOption !== null;
-  const visibleOptions = React40.useMemo(() => {
+  const visibleOptions = React41.useMemo(() => {
     if (!shouldFilterLocally || !effectiveSearchValue) {
       return options;
     }
     return options.filter((option) => filterOption(option, effectiveSearchValue));
   }, [effectiveSearchValue, filterOption, options, shouldFilterLocally]);
-  const selectedIndex = React40.useMemo(
+  const selectedIndex = React41.useMemo(
     () => visibleOptions.findIndex((option) => option.value === value?.value),
     [value?.value, visibleOptions]
   );
@@ -11204,7 +11390,7 @@ var SearchableSelectInternal = ({
   const activeOptionId = highlightedIndex >= 0 ? getOptionId(reactId, highlightedIndex) : void 0;
   useOutsideClick(containerRef, open && !isMobile ? () => closeSelect() : null);
   const handleOnOpenChange = useEvent(onOpenChange);
-  const setSelectOpen = (0, import_react48.useCallback)(
+  const setSelectOpen = (0, import_react56.useCallback)(
     (nextOpen, options2) => {
       setOpen(nextOpen);
       handleOnOpenChange?.(nextOpen);
@@ -11214,7 +11400,7 @@ var SearchableSelectInternal = ({
     },
     [handleOnOpenChange]
   );
-  React40.useEffect(() => {
+  React41.useEffect(() => {
     if (isBlocked) {
       setSelectOpen(false);
       return;
@@ -11227,7 +11413,7 @@ var SearchableSelectInternal = ({
       window.cancelAnimationFrame(frameId);
     };
   }, [isBlocked, open, setSelectOpen]);
-  React40.useEffect(() => {
+  React41.useEffect(() => {
     if (!open) {
       setHighlightedIndex(-1);
       return;
@@ -11322,7 +11508,7 @@ var SearchableSelectInternal = ({
       onOptionHover: setHighlightedIndex
     }
   );
-  React40.useImperativeHandle(ref, () => triggerRef.current, []);
+  React41.useImperativeHandle(ref, () => triggerRef.current, []);
   return /* @__PURE__ */ (0, import_jsx_runtime135.jsxs)(
     "div",
     {
@@ -11408,7 +11594,7 @@ var SearchableSelectInternal = ({
     }
   );
 };
-var SearchableSelect = React40.forwardRef(
+var SearchableSelect = React41.forwardRef(
   SearchableSelectInternal
 );
 function SearchableSelectContent({
@@ -11435,9 +11621,9 @@ function SearchableSelectContent({
   onOptionClick,
   onOptionHover
 }) {
-  const listRef = React40.useRef(null);
-  const lastLoadMoreOptionsLengthRef = React40.useRef(null);
-  const previousHighlightedIndexRef = React40.useRef(highlightedIndex);
+  const listRef = React41.useRef(null);
+  const lastLoadMoreOptionsLengthRef = React41.useRef(null);
+  const previousHighlightedIndexRef = React41.useRef(highlightedIndex);
   const rowCount = options.length + (loading && options.length > 0 ? 1 : 0);
   const virtualizer = (0, import_react_virtual.useVirtualizer)({
     count: rowCount,
@@ -11448,7 +11634,7 @@ function SearchableSelectContent({
   const virtualItems = virtualizer.getVirtualItems();
   const emptyMessage = noOptionsMessage?.() ?? "No matches found";
   const loadingText = loadingMessage?.() ?? "Loading...";
-  React40.useEffect(() => {
+  React41.useEffect(() => {
     const lastItem = virtualItems[virtualItems.length - 1];
     const shouldLoadMore = !!lastItem && hasNextPage && !loading && lastItem.index >= options.length - LOAD_MORE_THRESHOLD;
     if (shouldLoadMore && lastLoadMoreOptionsLengthRef.current !== options.length) {
@@ -11456,7 +11642,7 @@ function SearchableSelectContent({
       onLoadMore?.();
     }
   }, [hasNextPage, loading, onLoadMore, options.length, virtualItems]);
-  React40.useEffect(() => {
+  React41.useEffect(() => {
     const hasHighlightedIndexChanged = previousHighlightedIndexRef.current !== highlightedIndex;
     previousHighlightedIndexRef.current = highlightedIndex;
     if (highlightedIndex >= 0 && hasHighlightedIndexChanged) {
@@ -11837,10 +12023,26 @@ function getNextEnabledIndex(options, startIndex, step) {
   toggleVariants,
   uiKitI18nResources,
   uiKitTranslations,
+  useAbortController,
+  useClickEscape,
+  useCombinedRef,
+  useDebounce,
+  useEvent,
+  useHover,
+  useIsMobile,
+  useIsMounted,
+  useModalControls,
+  useOutsideClick,
+  usePrevious,
   useRadioOptions,
+  useScreenResize,
+  useScrollFrameIntoView,
+  useScrollToTop,
   useSidebar,
   useSidebarMenuButton,
   useSidebarSafe,
+  useTimeout,
+  useTimer,
   useUpdateToast
 });
 //# sourceMappingURL=index.cjs.map