@pos-360/horizon 0.30.1 → 0.31.0

package/dist/{chunk-H7KYKSHC.js → chunk-HKUYZ5K6.js}

@@ -1,7 +1,7 @@
 'use strict';
 
-var chunk23BJPJOK_js = require('./chunk-23BJPJOK.js');
-var React10 = require('react');
+var chunkD2BLWOWK_js = require('./chunk-D2BLWOWK.js');
+var React11 = require('react');
 var reactSlot = require('@radix-ui/react-slot');
 var classVarianceAuthority = require('class-variance-authority');
 var jsxRuntime = require('react/jsx-runtime');
@@ -36,7 +36,7 @@ function _interopNamespace(e) {
   return Object.freeze(n);
 }
 
-var React10__namespace = /*#__PURE__*/_interopNamespace(React10);
+var React11__namespace = /*#__PURE__*/_interopNamespace(React11);
 var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimitive);
 var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
 var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
@@ -72,7 +72,7 @@ var buttonVariants = classVarianceAuthority.cva(
     }
   }
 );
-var Button = React10__namespace.forwardRef(
+var Button = React11__namespace.forwardRef(
   ({
     className,
     variant,
@@ -88,7 +88,7 @@ var Button = React10__namespace.forwardRef(
       return /* @__PURE__ */ jsxRuntime.jsx(
         Comp,
         {
-          className: chunk23BJPJOK_js.cn(buttonVariants({ variant, size, className })),
+          className: chunkD2BLWOWK_js.cn(buttonVariants({ variant, size, className })),
           ref,
           ...props,
           children
@@ -99,7 +99,7 @@ var Button = React10__namespace.forwardRef(
     return /* @__PURE__ */ jsxRuntime.jsxs(
       Comp,
       {
-        className: chunk23BJPJOK_js.cn(buttonVariants({ variant, size, className })),
+        className: chunkD2BLWOWK_js.cn(buttonVariants({ variant, size, className })),
         ref,
         ...props,
         children: [
@@ -112,11 +112,11 @@ var Button = React10__namespace.forwardRef(
   }
 );
 Button.displayName = "Button";
-var Card = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Card = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "rounded-hz-lg border border-gray-200 bg-white text-gray-900 shadow dark:border-neutral-700 dark:bg-neutral-800 dark:text-gray-100",
       className
     ),
@@ -124,56 +124,56 @@ var Card = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @_
   }
 ));
 Card.displayName = "Card";
-var CardHeader = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardHeader = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("flex flex-col space-y-1.5 p-4", className),
+    className: chunkD2BLWOWK_js.cn("flex flex-col space-y-1.5 p-4", className),
     ...props
   }
 ));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardTitle = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("font-semibold leading-none tracking-tight", className),
+    className: chunkD2BLWOWK_js.cn("font-semibold leading-none tracking-tight", className),
     ...props
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardDescription = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("text-sm text-gray-500 dark:text-gray-400", className),
+    className: chunkD2BLWOWK_js.cn("text-sm text-gray-500 dark:text-gray-400", className),
     ...props
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardContent = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("p-4 pt-0", className),
+    className: chunkD2BLWOWK_js.cn("p-4 pt-0", className),
     ...props
   }
 ));
 CardContent.displayName = "CardContent";
-var CardFooter = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var CardFooter = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("flex items-center p-4 pt-0", className),
+    className: chunkD2BLWOWK_js.cn("flex items-center p-4 pt-0", className),
     ...props
   }
 ));
 CardFooter.displayName = "CardFooter";
-var Checkbox = React10__namespace.forwardRef(({ className, indicatorIcon, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var Checkbox = React11__namespace.forwardRef(({ className, indicatorIcon, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   CheckboxPrimitive__namespace.Root,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "peer h-4 w-4 shrink-0 rounded-hz-sm border border-gray-300 bg-transparent shadow focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-600 data-[state=checked]:border-blue-600 data-[state=checked]:text-white dark:border-neutral-600 dark:data-[state=checked]:bg-blue-600",
       className
     ),
@@ -181,7 +181,7 @@ var Checkbox = React10__namespace.forwardRef(({ className, indicatorIcon, ...pro
     children: /* @__PURE__ */ jsxRuntime.jsx(
       CheckboxPrimitive__namespace.Indicator,
       {
-        className: chunk23BJPJOK_js.cn("flex items-center justify-center text-current"),
+        className: chunkD2BLWOWK_js.cn("flex items-center justify-center text-current"),
         children: indicatorIcon ?? /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-3.5 w-3.5", strokeWidth: 3 })
       }
     )
@@ -192,11 +192,11 @@ var Dialog = DialogPrimitive__namespace.Root;
 var DialogTrigger = DialogPrimitive__namespace.Trigger;
 var DialogPortal = DialogPrimitive__namespace.Portal;
 var DialogClose = DialogPrimitive__namespace.Close;
-var DialogOverlay = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogOverlay = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DialogPrimitive__namespace.Overlay,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "fixed inset-0 z-50 bg-black/80 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
       className
     ),
@@ -204,13 +204,13 @@ var DialogOverlay = React10__namespace.forwardRef(({ className, ...props }, ref)
   }
 ));
 DialogOverlay.displayName = DialogPrimitive__namespace.Overlay.displayName;
-var DialogContent = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
+var DialogContent = React11__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(DialogPortal, { children: [
   /* @__PURE__ */ jsxRuntime.jsx(DialogOverlay, {}),
   /* @__PURE__ */ jsxRuntime.jsxs(
     DialogPrimitive__namespace.Content,
     {
       ref,
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-gray-200 bg-white p-6 shadow-lg duration-hz-normal 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 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-hz-lg dark:border-neutral-700 dark:bg-neutral-800",
         className
       ),
@@ -232,7 +232,7 @@ var DialogHeader = ({
 }) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "flex flex-col space-y-1.5 text-center sm:text-left",
       className
     ),
@@ -246,7 +246,7 @@ var DialogFooter = ({
 }) => /* @__PURE__ */ jsxRuntime.jsx(
   "div",
   {
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
       className
     ),
@@ -254,11 +254,11 @@ var DialogFooter = ({
   }
 );
 DialogFooter.displayName = "DialogFooter";
-var DialogTitle = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogTitle = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DialogPrimitive__namespace.Title,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "text-lg font-semibold leading-none tracking-tight text-gray-900 dark:text-gray-100",
       className
     ),
@@ -266,11 +266,11 @@ var DialogTitle = React10__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 DialogTitle.displayName = DialogPrimitive__namespace.Title.displayName;
-var DialogDescription = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DialogDescription = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DialogPrimitive__namespace.Description,
   {
     ref,
-    className: chunk23BJPJOK_js.cn("text-sm text-gray-500 dark:text-gray-400", className),
+    className: chunkD2BLWOWK_js.cn("text-sm text-gray-500 dark:text-gray-400", className),
     ...props
   }
 ));
@@ -281,11 +281,11 @@ var DropdownMenuGroup = DropdownMenuPrimitive__namespace.Group;
 var DropdownMenuPortal = DropdownMenuPrimitive__namespace.Portal;
 var DropdownMenuSub = DropdownMenuPrimitive__namespace.Sub;
 var DropdownMenuRadioGroup = DropdownMenuPrimitive__namespace.RadioGroup;
-var DropdownMenuSubTrigger = React10__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var DropdownMenuSubTrigger = React11__namespace.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   DropdownMenuPrimitive__namespace.SubTrigger,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "flex cursor-default select-none items-center gap-2 rounded-hz-sm px-2 py-1.5 text-sm outline-none focus:bg-gray-100 data-[state=open]:bg-gray-100 dark:focus:bg-gray-700 dark:data-[state=open]:bg-gray-700 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0",
       inset && "pl-8",
       className
@@ -298,11 +298,11 @@ var DropdownMenuSubTrigger = React10__namespace.forwardRef(({ className, inset,
   }
 ));
 DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive__namespace.SubTrigger.displayName;
-var DropdownMenuSubContent = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuSubContent = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.SubContent,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "z-50 min-w-[8rem] overflow-hidden rounded-hz-md border border-gray-200 bg-white p-1 text-gray-900 shadow-lg 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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin] dark:border-neutral-700 dark:bg-neutral-800 dark:text-gray-100",
       className
     ),
@@ -310,12 +310,12 @@ var DropdownMenuSubContent = React10__namespace.forwardRef(({ className, ...prop
   }
 ));
 DropdownMenuSubContent.displayName = DropdownMenuPrimitive__namespace.SubContent.displayName;
-var DropdownMenuContent = React10__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuContent = React11__namespace.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Content,
   {
     ref,
     sideOffset,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-hz-md border border-gray-200 bg-white p-1 text-gray-900 shadow-md dark:border-neutral-700 dark:bg-neutral-800 dark:text-gray-100",
       "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 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
       className
@@ -324,11 +324,11 @@ var DropdownMenuContent = React10__namespace.forwardRef(({ className, sideOffset
   }
 ) }));
 DropdownMenuContent.displayName = DropdownMenuPrimitive__namespace.Content.displayName;
-var DropdownMenuItem = React10__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuItem = React11__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Item,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "relative flex cursor-default select-none items-center gap-2 rounded-hz-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-gray-100 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-gray-700 dark:focus:text-gray-100 [&>svg]:size-4 [&>svg]:shrink-0",
       inset && "pl-8",
       className
@@ -337,11 +337,11 @@ var DropdownMenuItem = React10__namespace.forwardRef(({ className, inset, ...pro
   }
 ));
 DropdownMenuItem.displayName = DropdownMenuPrimitive__namespace.Item.displayName;
-var DropdownMenuCheckboxItem = React10__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var DropdownMenuCheckboxItem = React11__namespace.forwardRef(({ className, children, checked, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   DropdownMenuPrimitive__namespace.CheckboxItem,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "relative flex cursor-default select-none items-center rounded-hz-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-gray-100 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-gray-700 dark:focus:text-gray-100",
       className
     ),
@@ -354,11 +354,11 @@ var DropdownMenuCheckboxItem = React10__namespace.forwardRef(({ className, child
   }
 ));
 DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive__namespace.CheckboxItem.displayName;
-var DropdownMenuRadioItem = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var DropdownMenuRadioItem = React11__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   DropdownMenuPrimitive__namespace.RadioItem,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "relative flex cursor-default select-none items-center rounded-hz-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-gray-100 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-gray-700 dark:focus:text-gray-100",
       className
     ),
@@ -370,11 +370,11 @@ var DropdownMenuRadioItem = React10__namespace.forwardRef(({ className, children
   }
 ));
 DropdownMenuRadioItem.displayName = DropdownMenuPrimitive__namespace.RadioItem.displayName;
-var DropdownMenuLabel = React10__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuLabel = React11__namespace.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Label,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "px-2 py-1.5 text-sm font-semibold",
       inset && "pl-8",
       className
@@ -383,11 +383,11 @@ var DropdownMenuLabel = React10__namespace.forwardRef(({ className, inset, ...pr
   }
 ));
 DropdownMenuLabel.displayName = DropdownMenuPrimitive__namespace.Label.displayName;
-var DropdownMenuSeparator = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var DropdownMenuSeparator = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   DropdownMenuPrimitive__namespace.Separator,
   {
     ref,
-    className: chunk23BJPJOK_js.cn("-mx-1 my-1 h-px bg-gray-100 dark:bg-neutral-700", className),
+    className: chunkD2BLWOWK_js.cn("-mx-1 my-1 h-px bg-gray-100 dark:bg-neutral-700", className),
     ...props
   }
 ));
@@ -399,25 +399,25 @@ var DropdownMenuShortcut = ({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "span",
     {
-      className: chunk23BJPJOK_js.cn("ml-auto text-xs tracking-widest opacity-60", className),
+      className: chunkD2BLWOWK_js.cn("ml-auto text-xs tracking-widest opacity-60", className),
       ...props
     }
   );
 };
 DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
-var FormContext = React10__namespace.createContext(null);
+var FormContext = React11__namespace.createContext(null);
 function useFormContext() {
-  const context = React10__namespace.useContext(FormContext);
+  const context = React11__namespace.useContext(FormContext);
   if (!context) {
     throw new Error("useFormContext must be used within a Form component");
   }
   return context;
 }
-var FormFieldContext = React10__namespace.createContext(
+var FormFieldContext = React11__namespace.createContext(
   null
 );
 function useFormFieldContext() {
-  const context = React10__namespace.useContext(FormFieldContext);
+  const context = React11__namespace.useContext(FormFieldContext);
   if (!context) {
     throw new Error(
       "useFormFieldContext must be used within a FormField component"
@@ -425,24 +425,24 @@ function useFormFieldContext() {
   }
   return context;
 }
-var Form = React10__namespace.forwardRef(
+var Form = React11__namespace.forwardRef(
   ({ className, children, onFormSubmit, ...props }, ref) => {
-    const [errors, setErrors] = React10__namespace.useState({});
-    const [isSubmitting, setIsSubmitting] = React10__namespace.useState(false);
-    const setError = React10__namespace.useCallback(
+    const [errors, setErrors] = React11__namespace.useState({});
+    const [isSubmitting, setIsSubmitting] = React11__namespace.useState(false);
+    const setError = React11__namespace.useCallback(
       (name, message) => {
         setErrors((prev) => ({ ...prev, [name]: message }));
       },
       []
     );
-    const clearError = React10__namespace.useCallback((name) => {
+    const clearError = React11__namespace.useCallback((name) => {
       setErrors((prev) => {
         const next = { ...prev };
         delete next[name];
         return next;
       });
     }, []);
-    const clearAllErrors = React10__namespace.useCallback(() => {
+    const clearAllErrors = React11__namespace.useCallback(() => {
       setErrors({});
     }, []);
     const isValid = Object.keys(errors).length === 0;
@@ -461,7 +461,7 @@ var Form = React10__namespace.forwardRef(
         }
       }
     };
-    const contextValue = React10__namespace.useMemo(
+    const contextValue = React11__namespace.useMemo(
       () => ({
         errors,
         setError,
@@ -476,7 +476,7 @@ var Form = React10__namespace.forwardRef(
       "form",
       {
         ref,
-        className: chunk23BJPJOK_js.cn("space-y-6", className),
+        className: chunkD2BLWOWK_js.cn("space-y-6", className),
         onSubmit: handleSubmit,
         ...props,
         children
@@ -485,36 +485,36 @@ var Form = React10__namespace.forwardRef(
   }
 );
 Form.displayName = "Form";
-var FormField = React10__namespace.forwardRef(
+var FormField = React11__namespace.forwardRef(
   ({ className, name, children, ...props }, ref) => {
     const { errors } = useFormContext();
-    const id = React10__namespace.useId();
+    const id = React11__namespace.useId();
     const error = errors[name];
-    const contextValue = React10__namespace.useMemo(
+    const contextValue = React11__namespace.useMemo(
       () => ({ name, error, id }),
       [name, error, id]
     );
-    return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: chunk23BJPJOK_js.cn("space-y-2", className), ...props, children }) });
+    return /* @__PURE__ */ jsxRuntime.jsx(FormFieldContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsxRuntime.jsx("div", { ref, className: chunkD2BLWOWK_js.cn("space-y-2", className), ...props, children }) });
   }
 );
 FormField.displayName = "FormField";
-var FormLabel = React10__namespace.forwardRef(({ className, ...props }, ref) => {
+var FormLabel = React11__namespace.forwardRef(({ className, ...props }, ref) => {
   const { id, error } = useFormFieldContext();
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunk23BJPJOK_js.Label,
+    chunkD2BLWOWK_js.Label,
     {
       ref,
       htmlFor: id,
-      className: chunk23BJPJOK_js.cn(error && "text-rose-500 dark:text-rose-400", className),
+      className: chunkD2BLWOWK_js.cn(error && "text-rose-500 dark:text-rose-400", className),
       ...props
     }
   );
 });
 FormLabel.displayName = "FormLabel";
-var FormControl = React10__namespace.forwardRef(
+var FormControl = React11__namespace.forwardRef(
   ({ children, ...props }, ref) => {
     const { id, error, name } = useFormFieldContext();
-    const child = React10__namespace.cloneElement(children, {
+    const child = React11__namespace.cloneElement(children, {
       id,
       name,
       "aria-invalid": !!error,
@@ -525,13 +525,13 @@ var FormControl = React10__namespace.forwardRef(
   }
 );
 FormControl.displayName = "FormControl";
-var FormDescription = React10__namespace.forwardRef(
+var FormDescription = React11__namespace.forwardRef(
   ({ className, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
         ref,
-        className: chunk23BJPJOK_js.cn(
+        className: chunkD2BLWOWK_js.cn(
           "block text-sm text-neutral-500 dark:text-neutral-400",
           className
         ),
@@ -541,9 +541,9 @@ var FormDescription = React10__namespace.forwardRef(
   }
 );
 FormDescription.displayName = "FormDescription";
-var FormMessage = React10__namespace.forwardRef(
+var FormMessage = React11__namespace.forwardRef(
   ({ className, children, error: errorProp, ...props }, ref) => {
-    const fieldContext = React10__namespace.useContext(FormFieldContext);
+    const fieldContext = React11__namespace.useContext(FormFieldContext);
     const error = errorProp ?? fieldContext?.error;
     const id = fieldContext?.id;
     if (!error && !children) {
@@ -554,7 +554,7 @@ var FormMessage = React10__namespace.forwardRef(
       {
         ref,
         id: id ? `${id}-error` : void 0,
-        className: chunk23BJPJOK_js.cn(
+        className: chunkD2BLWOWK_js.cn(
           "text-sm font-medium",
           error ? "text-rose-500 dark:text-rose-400" : "text-neutral-600 dark:text-neutral-400",
           className
@@ -567,14 +567,14 @@ var FormMessage = React10__namespace.forwardRef(
   }
 );
 FormMessage.displayName = "FormMessage";
-var PopoverContext = React10__namespace.createContext({ open: false });
+var PopoverContext = React11__namespace.createContext({ open: false });
 var Popover = ({
   children,
   open: controlledOpen,
   onOpenChange,
   ...props
 }) => {
-  const [uncontrolledOpen, setUncontrolledOpen] = React10__namespace.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React11__namespace.useState(false);
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : uncontrolledOpen;
   const handleOpenChange = (newOpen) => {
@@ -595,8 +595,8 @@ var Popover = ({
 };
 var PopoverTrigger = PopoverPrimitive__namespace.Trigger;
 var PopoverAnchor = PopoverPrimitive__namespace.Anchor;
-var PopoverContent = React10__namespace.forwardRef(({ className, align = "center", sideOffset = 4, children, ...props }, ref) => {
-  const { open } = React10__namespace.useContext(PopoverContext);
+var PopoverContent = React11__namespace.forwardRef(({ className, align = "center", sideOffset = 4, children, ...props }, ref) => {
+  const { open } = React11__namespace.useContext(PopoverContext);
   const {
     onOpenAutoFocus,
     onCloseAutoFocus,
@@ -645,7 +645,7 @@ var PopoverContent = React10__namespace.forwardRef(({ className, align = "center
             damping: 25,
             mass: 0.8
           },
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "z-50 w-72 rounded-md border border-white/20 bg-white/80 backdrop-blur-xl p-4 text-gray-900 shadow-lg outline-none dark:border-neutral-700/50 dark:bg-neutral-900/80 dark:text-neutral-100 origin-[--radix-popover-content-transform-origin]",
             className
           ),
@@ -656,15 +656,15 @@ var PopoverContent = React10__namespace.forwardRef(({ className, align = "center
   ) }) });
 });
 PopoverContent.displayName = PopoverPrimitive__namespace.Content.displayName;
-var SelectContext = React10__namespace.createContext({ open: false });
-var SelectSearchContext = React10__namespace.createContext("");
+var SelectContext = React11__namespace.createContext({ open: false });
+var SelectSearchContext = React11__namespace.createContext("");
 var Select = ({
   children,
   open: controlledOpen,
   onOpenChange,
   ...props
 }) => {
-  const [uncontrolledOpen, setUncontrolledOpen] = React10__namespace.useState(false);
+  const [uncontrolledOpen, setUncontrolledOpen] = React11__namespace.useState(false);
   const isControlled = controlledOpen !== void 0;
   const open = isControlled ? controlledOpen : uncontrolledOpen;
   const handleOpenChange = (newOpen) => {
@@ -684,13 +684,13 @@ var Select = ({
   ) });
 };
 var SelectGroup = SelectPrimitive__namespace.Group;
-var SelectValue = React10__namespace.forwardRef(({ children, placeholder, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Value, { ref, placeholder, ...props, children }));
+var SelectValue = React11__namespace.forwardRef(({ children, placeholder, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Value, { ref, placeholder, ...props, children }));
 SelectValue.displayName = SelectPrimitive__namespace.Value.displayName;
-var SelectTrigger = React10__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
+var SelectTrigger = React11__namespace.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(
   SelectPrimitive__namespace.Trigger,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "flex h-[52px] w-full items-center justify-between rounded-hz-md border border-gray-300 bg-white px-4 py-2 text-sm text-gray-900 placeholder:text-gray-400 focus:outline-none focus:ring-0  disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-600 dark:bg-neutral-800 dark:text-gray-100 dark:placeholder:text-gray-500 [&>span]:line-clamp-1",
       className
     ),
@@ -702,11 +702,11 @@ var SelectTrigger = React10__namespace.forwardRef(({ className, children, ...pro
   }
 ));
 SelectTrigger.displayName = SelectPrimitive__namespace.Trigger.displayName;
-var SelectScrollUpButton = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectScrollUpButton = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.ScrollUpButton,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "flex cursor-default items-center justify-center py-1",
       className
     ),
@@ -715,11 +715,11 @@ var SelectScrollUpButton = React10__namespace.forwardRef(({ className, ...props
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive__namespace.ScrollUpButton.displayName;
-var SelectScrollDownButton = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectScrollDownButton = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.ScrollDownButton,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "flex cursor-default items-center justify-center py-1",
       className
     ),
@@ -728,11 +728,11 @@ var SelectScrollDownButton = React10__namespace.forwardRef(({ className, ...prop
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive__namespace.ScrollDownButton.displayName;
-var SelectContent = React10__namespace.forwardRef(({ className, children, position = "popper", searchable = false, searchPlaceholder = "Search...", ...props }, ref) => {
-  const { open } = React10__namespace.useContext(SelectContext);
-  const [search, setSearch] = React10__namespace.useState("");
-  const searchInputRef = React10__namespace.useRef(null);
-  React10__namespace.useEffect(() => {
+var SelectContent = React11__namespace.forwardRef(({ className, children, position = "popper", searchable = false, searchPlaceholder = "Search...", ...props }, ref) => {
+  const { open } = React11__namespace.useContext(SelectContext);
+  const [search, setSearch] = React11__namespace.useState("");
+  const searchInputRef = React11__namespace.useRef(null);
+  React11__namespace.useEffect(() => {
     if (open && searchable) {
       const frame = requestAnimationFrame(() => {
         searchInputRef.current?.focus();
@@ -758,7 +758,7 @@ var SelectContent = React10__namespace.forwardRef(({ className, children, positi
   } = props;
   const ForceMountPortal = SelectPrimitive__namespace.Portal;
   const ForceMountContent = SelectPrimitive__namespace.Content;
-  const AnimatedContent = React10__namespace.useMemo(() => React10__namespace.forwardRef(({ forceMount: _, ...props2 }, ref2) => /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { ref: ref2, ...props2 })), []);
+  const AnimatedContent = React11__namespace.useMemo(() => React11__namespace.forwardRef(({ forceMount: _, ...props2 }, ref2) => /* @__PURE__ */ jsxRuntime.jsx(framerMotion.motion.div, { ref: ref2, ...props2 })), []);
   return /* @__PURE__ */ jsxRuntime.jsx(ForceMountPortal, { forceMount: true, children: /* @__PURE__ */ jsxRuntime.jsx(
     ForceMountContent,
     {
@@ -790,7 +790,7 @@ var SelectContent = React10__namespace.forwardRef(({ className, children, positi
             damping: 25,
             mass: 0.8
           },
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] overflow-hidden rounded-hz-lg border border-white/20 bg-white/80 backdrop-blur-xl text-gray-900 shadow-lg dark:border-neutral-700/50 dark:bg-neutral-900/80 dark:text-gray-100 origin-[--radix-select-content-transform-origin]",
             position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
             className
@@ -815,7 +815,7 @@ var SelectContent = React10__namespace.forwardRef(({ className, children, positi
               /* @__PURE__ */ jsxRuntime.jsx(
                 SelectPrimitive__namespace.Viewport,
                 {
-                  className: chunk23BJPJOK_js.cn(
+                  className: chunkD2BLWOWK_js.cn(
                     "p-1",
                     position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
                   ),
@@ -831,17 +831,17 @@ var SelectContent = React10__namespace.forwardRef(({ className, children, positi
   ) });
 });
 SelectContent.displayName = SelectPrimitive__namespace.Content.displayName;
-var SelectLabel = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectLabel = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.Label,
   {
     ref,
-    className: chunk23BJPJOK_js.cn("px-2 py-1.5 text-sm font-semibold", className),
+    className: chunkD2BLWOWK_js.cn("px-2 py-1.5 text-sm font-semibold", className),
     ...props
   }
 ));
 SelectLabel.displayName = SelectPrimitive__namespace.Label.displayName;
-var SelectItem = React10__namespace.forwardRef(({ className, children, textValue, ...props }, ref) => {
-  const search = React10__namespace.useContext(SelectSearchContext);
+var SelectItem = React11__namespace.forwardRef(({ className, children, textValue, ...props }, ref) => {
+  const search = React11__namespace.useContext(SelectSearchContext);
   const itemText = textValue ?? (typeof children === "string" ? children : "");
   if (search && itemText && !itemText.toLowerCase().includes(search.toLowerCase())) {
     return null;
@@ -851,7 +851,7 @@ var SelectItem = React10__namespace.forwardRef(({ className, children, textValue
     {
       ref,
       textValue,
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "relative flex w-full cursor-default select-none items-center rounded-hz-md py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-black/5 focus:text-gray-900 data-[disabled]:pointer-events-none data-[disabled]:opacity-50 dark:focus:bg-white/10 dark:focus:text-gray-100 transition-colors",
         className
       ),
@@ -864,15 +864,316 @@ var SelectItem = React10__namespace.forwardRef(({ className, children, textValue
   );
 });
 SelectItem.displayName = SelectPrimitive__namespace.Item.displayName;
-var SelectSeparator = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var SelectSeparator = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   SelectPrimitive__namespace.Separator,
   {
     ref,
-    className: chunk23BJPJOK_js.cn("-mx-1 my-1 h-px bg-gray-200/50 dark:bg-neutral-700/50", className),
+    className: chunkD2BLWOWK_js.cn("-mx-1 my-1 h-px bg-gray-200/50 dark:bg-neutral-700/50", className),
     ...props
   }
 ));
 SelectSeparator.displayName = SelectPrimitive__namespace.Separator.displayName;
+var SelectBar = React11__namespace.forwardRef(({
+  options,
+  value,
+  onChange,
+  multiple = false,
+  multiValue,
+  onMultiChange,
+  manualApply = false,
+  searchable = false,
+  searchPlaceholder = "Search...",
+  placeholder = "Select\u2026",
+  label,
+  disabled = false,
+  className,
+  maxVisibleChips = 2
+}, ref) => {
+  const [open, setOpen] = React11__namespace.useState(false);
+  const [search, setSearch] = React11__namespace.useState("");
+  const searchRef = React11__namespace.useRef(null);
+  const [internalValue, setInternalValue] = React11__namespace.useState(
+    void 0
+  );
+  const [internalMultiValue, setInternalMultiValue] = React11__namespace.useState(
+    []
+  );
+  const [draftValue, setDraftValue] = React11__namespace.useState(
+    void 0
+  );
+  const [draftMultiValue, setDraftMultiValue] = React11__namespace.useState([]);
+  const committedSingle = value !== void 0 ? value : internalValue;
+  const committedMulti = multiValue !== void 0 ? multiValue : internalMultiValue;
+  const activeSingle = manualApply ? draftValue : committedSingle;
+  const activeMulti = manualApply ? draftMultiValue : committedMulti;
+  const commitSingle = React11__namespace.useCallback(
+    (v) => {
+      if (value === void 0) setInternalValue(v);
+      onChange?.(v);
+    },
+    [value, onChange]
+  );
+  const commitMulti = React11__namespace.useCallback(
+    (v) => {
+      if (multiValue === void 0) setInternalMultiValue(v);
+      onMultiChange?.(v);
+    },
+    [multiValue, onMultiChange]
+  );
+  const handleOpenChange = (newOpen) => {
+    if (newOpen) {
+      setDraftValue(committedSingle);
+      setDraftMultiValue(committedMulti);
+      setSearch("");
+      if (searchable) {
+        requestAnimationFrame(() => searchRef.current?.focus());
+      }
+    }
+    setOpen(newOpen);
+  };
+  const filtered = React11__namespace.useMemo(
+    () => search ? options.filter(
+      (o) => o.label.toLowerCase().includes(search.toLowerCase())
+    ) : options,
+    [options, search]
+  );
+  const handleSingleSelect = (optionValue) => {
+    if (manualApply) {
+      setDraftValue(optionValue);
+    } else {
+      commitSingle(optionValue);
+      setOpen(false);
+    }
+  };
+  const handleMultiToggle = (optionValue) => {
+    const current = manualApply ? draftMultiValue : committedMulti;
+    const next = current.includes(optionValue) ? current.filter((v) => v !== optionValue) : [...current, optionValue];
+    if (manualApply) {
+      setDraftMultiValue(next);
+    } else {
+      commitMulti(next);
+    }
+  };
+  const handleApply = () => {
+    if (multiple) {
+      commitMulti(draftMultiValue);
+    } else {
+      commitSingle(draftValue);
+    }
+    setOpen(false);
+  };
+  const handleClear = () => {
+    if (manualApply) {
+      if (multiple) {
+        setDraftMultiValue([]);
+      } else {
+        setDraftValue(void 0);
+      }
+    } else {
+      if (multiple) {
+        commitMulti([]);
+      } else {
+        commitSingle(void 0);
+      }
+      setOpen(false);
+    }
+  };
+  const handleChipRemove = (e, chipValue) => {
+    e.stopPropagation();
+    const next = committedMulti.filter((v) => v !== chipValue);
+    commitMulti(next);
+  };
+  const canApply = (() => {
+    if (!manualApply) return false;
+    if (multiple) {
+      const a = [...draftMultiValue].sort();
+      const b = [...committedMulti].sort();
+      return JSON.stringify(a) !== JSON.stringify(b);
+    }
+    return draftValue !== committedSingle;
+  })();
+  const canClear = (() => {
+    if (manualApply) {
+      return multiple ? draftMultiValue.length > 0 : draftValue !== void 0;
+    }
+    return multiple ? committedMulti.length > 0 : committedSingle !== void 0;
+  })();
+  const labelFor = (v) => options.find((o) => o.value === v)?.label ?? v;
+  const renderTriggerContent = () => {
+    if (multiple) {
+      if (committedMulti.length === 0) {
+        return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400 dark:text-gray-500 truncate", children: placeholder });
+      }
+      const visible = committedMulti.slice(0, maxVisibleChips);
+      const overflow = committedMulti.length - maxVisibleChips;
+      return /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1 min-w-0 flex-wrap", children: [
+        visible.map((v) => /* @__PURE__ */ jsxRuntime.jsxs(
+          "span",
+          {
+            className: "inline-flex items-center gap-1 bg-blue-50 text-blue-700 border border-blue-200 dark:bg-blue-950/50 dark:text-blue-400 dark:border-blue-800/50 rounded-md px-2 py-0.5 text-xs font-medium max-w-[120px]",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: labelFor(v) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  className: "shrink-0 hover:text-blue-900 dark:hover:text-blue-200",
+                  onClick: (e) => handleChipRemove(e, v),
+                  "aria-label": `Remove ${labelFor(v)}`,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" })
+                }
+              )
+            ]
+          },
+          v
+        )),
+        overflow > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "inline-flex items-center bg-blue-50 text-blue-700 border border-blue-200 dark:bg-blue-950/50 dark:text-blue-400 dark:border-blue-800/50 rounded-md px-2 py-0.5 text-xs font-medium", children: [
+          "+",
+          overflow,
+          " more"
+        ] })
+      ] });
+    }
+    if (committedSingle !== void 0) {
+      return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate text-gray-900 dark:text-gray-100", children: labelFor(committedSingle) });
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-gray-400 dark:text-gray-500 truncate", children: placeholder });
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkD2BLWOWK_js.cn("space-y-1.5", className), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(chunkD2BLWOWK_js.Label, { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          ref,
+          type: "button",
+          disabled,
+          className: chunkD2BLWOWK_js.cn(
+            "flex h-[42px] min-h-[42px] w-full items-center justify-between gap-2 rounded-hz-md border border-gray-300 bg-white px-3 text-sm shadow-sm transition-colors",
+            "hover:bg-gray-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
+            "dark:border-neutral-600 dark:bg-neutral-800 dark:hover:bg-neutral-700",
+            "disabled:pointer-events-none disabled:opacity-50"
+          ),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex-1 min-w-0 flex items-center", children: renderTriggerContent() }),
+            /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDown, { className: "h-4 w-4 shrink-0 opacity-50" })
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsxs(
+        PopoverContent,
+        {
+          align: "start",
+          className: "w-[var(--radix-popover-trigger-width)] min-w-[200px] p-0 overflow-hidden",
+          children: [
+            searchable && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center border-b border-neutral-200/50 dark:border-neutral-700/50", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "mr-2 h-6 w-6 shrink-0 opacity-50 pl-2" }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "input",
+                {
+                  ref: searchRef,
+                  value: search,
+                  onChange: (e) => setSearch(e.target.value),
+                  placeholder: searchPlaceholder,
+                  onKeyDown: (e) => e.stopPropagation(),
+                  className: "flex h-10 w-full py-2 bg-transparent text-sm placeholder:text-neutral-400 dark:placeholder:text-neutral-500 px-2 focus-visible:ring-0 focus-visible:ring-offset-0 focus-visible:outline-none"
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-1 max-h-[240px] overflow-y-auto", children: filtered.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-2 py-4 text-center text-sm text-gray-400 dark:text-gray-500", children: "No results found." }) : filtered.map((option) => {
+              if (multiple) {
+                const checked = activeMulti.includes(option.value);
+                return /* @__PURE__ */ jsxRuntime.jsxs(
+                  "button",
+                  {
+                    type: "button",
+                    disabled: option.disabled,
+                    onClick: () => handleMultiToggle(option.value),
+                    className: chunkD2BLWOWK_js.cn(
+                      "relative flex w-full cursor-default select-none items-center gap-2 rounded-hz-md py-1.5 px-2 text-sm outline-none transition-colors",
+                      "hover:bg-black/5 dark:hover:bg-white/10",
+                      option.disabled && "pointer-events-none opacity-50"
+                    ),
+                    children: [
+                      /* @__PURE__ */ jsxRuntime.jsx(
+                        CheckboxPrimitive__namespace.Root,
+                        {
+                          checked,
+                          tabIndex: -1,
+                          className: chunkD2BLWOWK_js.cn(
+                            "peer h-4 w-4 shrink-0 rounded-hz-sm border border-gray-300 bg-transparent shadow focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-blue-600 data-[state=checked]:border-blue-600 data-[state=checked]:text-white dark:border-neutral-600 dark:data-[state=checked]:bg-blue-600"
+                          ),
+                          style: { pointerEvents: "none" },
+                          children: /* @__PURE__ */ jsxRuntime.jsx(CheckboxPrimitive__namespace.Indicator, { className: "flex items-center justify-center text-current", children: /* @__PURE__ */ jsxRuntime.jsx(
+                            lucideReact.Check,
+                            {
+                              className: "h-3.5 w-3.5",
+                              strokeWidth: 3
+                            }
+                          ) })
+                        }
+                      ),
+                      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: option.label })
+                    ]
+                  },
+                  option.value
+                );
+              }
+              const selected = activeSingle === option.value;
+              return /* @__PURE__ */ jsxRuntime.jsxs(
+                "button",
+                {
+                  type: "button",
+                  disabled: option.disabled,
+                  onClick: () => handleSingleSelect(option.value),
+                  className: chunkD2BLWOWK_js.cn(
+                    "relative flex w-full cursor-default select-none items-center rounded-hz-md py-1.5 pl-2 pr-8 text-sm outline-none transition-colors",
+                    "hover:bg-black/5 dark:hover:bg-white/10",
+                    option.disabled && "pointer-events-none opacity-50"
+                  ),
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: option.label }),
+                    selected && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Check, { className: "h-4 w-4" }) })
+                  ]
+                },
+                option.value
+              );
+            }) }),
+            manualApply && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2 px-2 py-3 border-t border-gray-100 dark:border-neutral-700", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: handleClear,
+                  disabled: !canClear,
+                  className: chunkD2BLWOWK_js.cn(
+                    "px-3 py-1.5 rounded-md text-sm transition-colors",
+                    canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
+                  ),
+                  children: "Clear"
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: handleApply,
+                  disabled: !canApply,
+                  className: chunkD2BLWOWK_js.cn(
+                    "px-3 py-1.5 rounded-md text-sm font-medium transition-colors",
+                    canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
+                  ),
+                  children: "Apply"
+                }
+              )
+            ] })
+          ]
+        }
+      )
+    ] })
+  ] });
+});
+SelectBar.displayName = "SelectBar";
 var separatorVariants = classVarianceAuthority.cva("shrink-0 bg-gray-200 dark:bg-neutral-700", {
   variants: {
     orientation: {
@@ -895,7 +1196,7 @@ function Separator3({
     {
       role: decorative ? "none" : "separator",
       "aria-orientation": decorative ? void 0 : orientation ?? void 0,
-      className: chunk23BJPJOK_js.cn(separatorVariants({ orientation }), className),
+      className: chunkD2BLWOWK_js.cn(separatorVariants({ orientation }), className),
       ...props
     }
   );
@@ -904,7 +1205,7 @@ function Skeleton({ className }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "animate-pulse rounded-hz-md bg-neutral-200 dark:bg-neutral-800",
         className
       )
@@ -912,28 +1213,28 @@ function Skeleton({ className }) {
   );
 }
 function SkeletonText({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("h-4", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("h-4", className) });
 }
 function SkeletonTitle({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("h-6 w-48", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("h-6 w-48", className) });
 }
 function SkeletonSubtitle({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("h-3 w-64", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("h-3 w-64", className) });
 }
 function SkeletonAvatar({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("w-10 h-10 rounded", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("w-10 h-10 rounded", className) });
 }
 function SkeletonBadge({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("h-6 w-24", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("h-6 w-24", className) });
 }
 function SkeletonIcon({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("w-6 h-6 rounded", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("w-6 h-6 rounded", className) });
 }
 function SkeletonButton({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("h-10 w-24 rounded-hz-md", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("h-10 w-24 rounded-hz-md", className) });
 }
 function SkeletonInput({ className }) {
-  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunk23BJPJOK_js.cn("h-10 w-full rounded-hz-md", className) });
+  return /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { className: chunkD2BLWOWK_js.cn("h-10 w-full rounded-hz-md", className) });
 }
 function SkeletonTableRow({
   columns = 4,
@@ -951,7 +1252,7 @@ function SkeletonCard({ className }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "rounded-hz-lg border bg-card p-6 space-y-4",
         className
       ),
@@ -1025,7 +1326,7 @@ function SegmentedControl({
     {
       ...props,
       ...value !== void 0 ? { value, onValueChange: onChange } : {},
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         segmentedControlVariants({ size }),
         containerRadiusClass[radius],
         className
@@ -1035,7 +1336,7 @@ function SegmentedControl({
         {
           value: option.value,
           disabled: option.disabled,
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             segmentedControlItemVariants({ size }),
             itemRadiusClass[radius],
             "border border-transparent text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200",
@@ -1053,8 +1354,8 @@ function SegmentedControl({
   );
 }
 function BulkEditPopover({ column, onApply }) {
-  const [value, setValue] = React10__namespace.useState("");
-  const [open, setOpen] = React10__namespace.useState(false);
+  const [value, setValue] = React11__namespace.useState("");
+  const [open, setOpen] = React11__namespace.useState(false);
   const { bulkEdit } = column;
   if (!bulkEdit) return null;
   const isValid = bulkEdit.kind === "input" ? !!value.trim() : !!value;
@@ -1072,7 +1373,7 @@ function BulkEditPopover({ column, onApply }) {
     }
     if (!next) setValue("");
   };
-  return /* @__PURE__ */ jsxRuntime.jsx(chunk23BJPJOK_js.Tooltip, { content: `Apply to all ${headingLabel}`, side: "top", disabled: open, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex", children: /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+  return /* @__PURE__ */ jsxRuntime.jsx(chunkD2BLWOWK_js.Tooltip, { content: `Apply to all ${headingLabel}`, side: "top", disabled: open, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex", children: /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
     /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
       "button",
       {
@@ -1083,7 +1384,7 @@ function BulkEditPopover({ column, onApply }) {
         children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.PenLine, { className: "h-3.5 w-3.5" })
       }
     ) }),
-    /* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { align: "start", className: chunk23BJPJOK_js.cn("p-3 space-y-3", bulkEdit.kind === "segmented-control" ? "w-auto" : "w-64"), children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { align: "start", className: chunkD2BLWOWK_js.cn("p-3 space-y-3", bulkEdit.kind === "segmented-control" ? "w-auto" : "w-64"), children: [
       /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wide", children: [
         "Apply to all \u2014 ",
         headingLabel
@@ -1104,7 +1405,7 @@ function BulkEditPopover({ column, onApply }) {
               }
             },
             autoFocus: true,
-            className: chunk23BJPJOK_js.cn(
+            className: chunkD2BLWOWK_js.cn(
               "w-full rounded-hz-md border border-gray-300 bg-white py-2 text-sm text-gray-900 placeholder:text-gray-400 focus:outline-none focus:ring-1 focus:ring-blue-500/50 dark:border-neutral-600 dark:bg-neutral-800 dark:text-gray-100 dark:placeholder:text-gray-500",
               bulkEdit.leadingDecorator ? "pl-7 pr-3" : "px-3"
             )
@@ -1128,12 +1429,12 @@ function BulkEditPopover({ column, onApply }) {
     ] })
   ] }) }) });
 }
-var TableContext = React10__namespace.createContext(null);
+var TableContext = React11__namespace.createContext(null);
 var useTableContext = () => {
-  const context = React10__namespace.useContext(TableContext);
+  const context = React11__namespace.useContext(TableContext);
   return context;
 };
-var TableInner = React10__namespace.forwardRef(
+var TableInner = React11__namespace.forwardRef(
   ({
     className,
     selectionMode = "multiple",
@@ -1159,23 +1460,23 @@ var TableInner = React10__namespace.forwardRef(
   }, ref) => {
     const effectiveActionColumns = actionColumns ?? [];
     const effectiveSelectable = effectiveActionColumns.includes("checkbox");
-    const [internalSelectedRows, setInternalSelectedRows] = React10__namespace.useState(/* @__PURE__ */ new Set());
-    const [registeredRowIds, setRegisteredRowIds] = React10__namespace.useState(/* @__PURE__ */ new Set());
-    const wrapperRef = React10__namespace.useRef(null);
+    const [internalSelectedRows, setInternalSelectedRows] = React11__namespace.useState(/* @__PURE__ */ new Set());
+    const [registeredRowIds, setRegisteredRowIds] = React11__namespace.useState(/* @__PURE__ */ new Set());
+    const wrapperRef = React11__namespace.useRef(null);
     const isControlled = controlledSelectedRows !== void 0;
     const selectedRowsSet = isControlled ? new Set(controlledSelectedRows) : internalSelectedRows;
-    const defaultGetRowId = React10__namespace.useCallback((row) => {
+    const defaultGetRowId = React11__namespace.useCallback((row) => {
       if (typeof row === "string") return row;
       if (typeof row === "object" && row?.id) return String(row.id);
       return String(row);
     }, []);
     const finalGetRowId = getRowId || defaultGetRowId;
-    const allRowIds = React10__namespace.useMemo(() => {
+    const allRowIds = React11__namespace.useMemo(() => {
       if (rows) return new Set(rows.map(finalGetRowId));
       if (data) return new Set(data.map(finalGetRowId));
       return registeredRowIds;
     }, [rows, data, finalGetRowId, registeredRowIds]);
-    const registerRowId = React10__namespace.useCallback((rowId) => {
+    const registerRowId = React11__namespace.useCallback((rowId) => {
       if (rowId) {
         setRegisteredRowIds((prev) => {
           if (prev.has(rowId)) return prev;
@@ -1183,7 +1484,7 @@ var TableInner = React10__namespace.forwardRef(
         });
       }
     }, []);
-    const unregisterRowId = React10__namespace.useCallback((rowId) => {
+    const unregisterRowId = React11__namespace.useCallback((rowId) => {
       if (rowId) {
         setRegisteredRowIds((prev) => {
           if (!prev.has(rowId)) return prev;
@@ -1193,7 +1494,7 @@ var TableInner = React10__namespace.forwardRef(
         });
       }
     }, []);
-    const toggleRow = React10__namespace.useCallback(
+    const toggleRow = React11__namespace.useCallback(
       (rowId) => {
         if (!effectiveSelectable) return;
         const next = new Set(selectedRowsSet);
@@ -1218,7 +1519,7 @@ var TableInner = React10__namespace.forwardRef(
       },
       [effectiveSelectable, selectionMode, selectedRowsSet, isControlled, onSelectionChange]
     );
-    const selectAll = React10__namespace.useCallback(() => {
+    const selectAll = React11__namespace.useCallback(() => {
       if (!effectiveSelectable || selectionMode !== "multiple" || allRowIds.size === 0) return;
       const next = new Set(allRowIds);
       if (isControlled) {
@@ -1228,7 +1529,7 @@ var TableInner = React10__namespace.forwardRef(
         onSelectionChange?.(Array.from(next));
       }
     }, [effectiveSelectable, selectionMode, allRowIds, isControlled, onSelectionChange]);
-    const deselectAll = React10__namespace.useCallback(() => {
+    const deselectAll = React11__namespace.useCallback(() => {
       if (!effectiveSelectable) return;
       const next = /* @__PURE__ */ new Set();
       if (isControlled) {
@@ -1238,19 +1539,19 @@ var TableInner = React10__namespace.forwardRef(
         onSelectionChange?.(Array.from(next));
       }
     }, [effectiveSelectable, isControlled, onSelectionChange]);
-    const isRowSelected = React10__namespace.useCallback(
+    const isRowSelected = React11__namespace.useCallback(
       (rowId) => selectedRowsSet.has(rowId),
       [selectedRowsSet]
     );
-    const isAllSelected = React10__namespace.useMemo(() => {
+    const isAllSelected = React11__namespace.useMemo(() => {
       if (!effectiveSelectable || allRowIds.size === 0) return false;
       return allRowIds.size > 0 && Array.from(allRowIds).every((id) => selectedRowsSet.has(id));
     }, [effectiveSelectable, allRowIds, selectedRowsSet]);
-    const isSomeSelected = React10__namespace.useMemo(() => {
+    const isSomeSelected = React11__namespace.useMemo(() => {
       if (!effectiveSelectable) return false;
       return selectedRowsSet.size > 0 && !isAllSelected;
     }, [effectiveSelectable, selectedRowsSet.size, isAllSelected]);
-    const contextValue = React10__namespace.useMemo(() => ({
+    const contextValue = React11__namespace.useMemo(() => ({
       selectable: effectiveSelectable,
       selectionMode,
       selectedRows: selectedRowsSet,
@@ -1279,7 +1580,7 @@ var TableInner = React10__namespace.forwardRef(
       unregisterRowId,
       stickyYHeader
     ]);
-    React10__namespace.useEffect(() => {
+    React11__namespace.useEffect(() => {
       const wrapper = wrapperRef.current;
       if (!wrapper || highlightMode === "none") return;
       let prevCell = null;
@@ -1335,12 +1636,12 @@ var TableInner = React10__namespace.forwardRef(
       "div",
       {
         ref: wrapperRef,
-        className: chunk23BJPJOK_js.cn("relative w-full overflow-auto scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-neutral-600 scrollbar-track-transparent", rounded && "rounded-lg", containerClassName),
+        className: chunkD2BLWOWK_js.cn("relative w-full overflow-auto scrollbar-thin scrollbar-thumb-gray-300 dark:scrollbar-thumb-neutral-600 scrollbar-track-transparent", rounded && "rounded-lg", containerClassName),
         children: /* @__PURE__ */ jsxRuntime.jsx(
           "table",
           {
             ref,
-            className: chunk23BJPJOK_js.cn("w-full caption-bottom text-sm", className),
+            className: chunkD2BLWOWK_js.cn("w-full caption-bottom text-sm", className),
             ...props,
             children: columns && data ? /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: (() => {
               const filteredCols = columns.filter(
@@ -1393,7 +1694,7 @@ var TableInner = React10__namespace.forwardRef(
                       ...col.stickyXHeader ? { left: stickyOffsets[col.key] } : {},
                       ...col.stickyXHeader && stickyYHeader ? { boxShadow: xyShadow } : col.stickyXHeader ? { boxShadow: xShadow } : stickyYHeader ? { boxShadow: yShadow } : {}
                     },
-                    className: chunk23BJPJOK_js.cn(
+                    className: chunkD2BLWOWK_js.cn(
                       "h-12 px-4 text-left align-middle font-medium text-gray-500 dark:text-gray-400",
                       stickyYHeader && "sticky top-0 z-20 bg-gray-50 dark:bg-neutral-800",
                       col.stickyXHeader && "sticky z-20 bg-gray-50 dark:bg-neutral-800",
@@ -1420,7 +1721,7 @@ var TableInner = React10__namespace.forwardRef(
                     "tr",
                     {
                       "data-state": isSelected ? "selected" : void 0,
-                      className: chunk23BJPJOK_js.cn(
+                      className: chunkD2BLWOWK_js.cn(
                         "border-b border-gray-200 transition-colors dark:border-neutral-700",
                         isSelected ? "bg-blue-50 dark:bg-blue-900/20" : (highlightMode === "row" || highlightMode === "cross") && "hover:bg-gray-50 dark:hover:bg-neutral-800/50",
                         onRowClick && "cursor-pointer"
@@ -1442,9 +1743,9 @@ var TableInner = React10__namespace.forwardRef(
                             }
                             contextValue.toggleRow(rowId);
                           } : col.key === "__delete__" ? (e) => e.stopPropagation() : void 0,
-                          className: chunk23BJPJOK_js.cn(
+                          className: chunkD2BLWOWK_js.cn(
                             "p-4 align-middle",
-                            col.stickyXHeader && chunk23BJPJOK_js.cn("sticky z-20", isSelected ? "bg-blue-50 dark:bg-[#242a3a]" : "bg-gray-50 dark:bg-neutral-800"),
+                            col.stickyXHeader && chunkD2BLWOWK_js.cn("sticky z-20", isSelected ? "bg-blue-50 dark:bg-[#242a3a]" : "bg-gray-50 dark:bg-neutral-800"),
                             showDividers && "border-r border-gray-200 dark:border-neutral-700",
                             typeof col.cellClassName === "function" ? col.cellClassName(row) : col.cellClassName
                           ),
@@ -1466,29 +1767,29 @@ var TableInner = React10__namespace.forwardRef(
 );
 TableInner.displayName = "Table";
 var Table = TableInner;
-var TableHeader = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TableHeader = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "thead",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("[&_tr]:border-b [&_tr]:border-gray-200 dark:[&_tr]:border-gray-700", className),
+    className: chunkD2BLWOWK_js.cn("[&_tr]:border-b [&_tr]:border-gray-200 dark:[&_tr]:border-gray-700", className),
     ...props
   }
 ));
 TableHeader.displayName = "TableHeader";
-var TableBody = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TableBody = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "tbody",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("[&_tr:last-child]:border-0", className),
+    className: chunkD2BLWOWK_js.cn("[&_tr:last-child]:border-0", className),
     ...props
   }
 ));
 TableBody.displayName = "TableBody";
-var TableFooter = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TableFooter = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "tfoot",
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "border-t border-gray-200 bg-gray-50 font-medium dark:border-neutral-700 dark:bg-neutral-800/50 [&>tr]:last:border-b-0",
       className
     ),
@@ -1496,19 +1797,19 @@ var TableFooter = React10__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 TableFooter.displayName = "TableFooter";
-var TableRow = React10__namespace.forwardRef(
+var TableRow = React11__namespace.forwardRef(
   ({ className, rowId, rowData, onClick, ...props }, ref) => {
     const context = useTableContext();
     const getRowId = context?.getRowId;
     const selectable = context?.selectable;
     const registerRowId = context?.registerRowId;
     const unregisterRowId = context?.unregisterRowId;
-    const finalRowId = React10__namespace.useMemo(() => {
+    const finalRowId = React11__namespace.useMemo(() => {
       if (rowId) return rowId;
       if (rowData && getRowId) return getRowId(rowData);
       return props.id || void 0;
     }, [rowId, rowData, getRowId, props.id]);
-    React10__namespace.useEffect(() => {
+    React11__namespace.useEffect(() => {
       if (finalRowId && selectable) {
         registerRowId?.(finalRowId);
         return () => {
@@ -1517,7 +1818,7 @@ var TableRow = React10__namespace.forwardRef(
       }
     }, [finalRowId, selectable, registerRowId, unregisterRowId]);
     const isSelected = finalRowId ? context?.isRowSelected(finalRowId) : false;
-    const handleClick = React10__namespace.useCallback(
+    const handleClick = React11__namespace.useCallback(
       (e) => {
         onClick?.(e);
       },
@@ -1529,7 +1830,7 @@ var TableRow = React10__namespace.forwardRef(
         ref,
         "data-state": isSelected ? "selected" : void 0,
         "data-row-id": finalRowId,
-        className: chunk23BJPJOK_js.cn(
+        className: chunkD2BLWOWK_js.cn(
           "border-b border-gray-200 transition-colors hover:bg-gray-50 data-[state=selected]:bg-blue-50 dark:border-neutral-700 dark:hover:bg-neutral-800/50 dark:data-[state=selected]:bg-blue-900/20",
           className
         ),
@@ -1540,7 +1841,7 @@ var TableRow = React10__namespace.forwardRef(
   }
 );
 TableRow.displayName = "TableRow";
-var TableHead = React10__namespace.forwardRef(({ className, style, ...props }, ref) => {
+var TableHead = React11__namespace.forwardRef(({ className, style, ...props }, ref) => {
   const context = useTableContext();
   const isDark = typeof document !== "undefined" && document.documentElement.classList.contains("dark");
   const yShadow = `inset 0 -1px 0 0 ${isDark ? "rgba(255,255,255,0.1)" : "rgba(0,0,0,0.1)"}`;
@@ -1549,7 +1850,7 @@ var TableHead = React10__namespace.forwardRef(({ className, style, ...props }, r
     {
       ref,
       style: context?.stickyHeader ? { boxShadow: yShadow, ...style } : style,
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "h-12 px-4 text-left align-middle font-medium text-gray-500 dark:text-gray-400 [&:has([role=checkbox])]:pr-0",
         context?.stickyHeader && "sticky top-0 z-20 bg-gray-50 dark:bg-neutral-800",
         className
@@ -1559,12 +1860,12 @@ var TableHead = React10__namespace.forwardRef(({ className, style, ...props }, r
   );
 });
 TableHead.displayName = "TableHead";
-var TableCell = React10__namespace.forwardRef(
+var TableCell = React11__namespace.forwardRef(
   ({ className, variant = "default", ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
     "td",
     {
       ref,
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "align-middle [&:has([role=checkbox])]:pr-0",
         variant === "embed" ? "p-1.5" : "p-4",
         className
@@ -1574,16 +1875,16 @@ var TableCell = React10__namespace.forwardRef(
   )
 );
 TableCell.displayName = "TableCell";
-var TableCaption = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TableCaption = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   "caption",
   {
     ref,
-    className: chunk23BJPJOK_js.cn("mt-4 text-sm text-gray-500 dark:text-gray-400", className),
+    className: chunkD2BLWOWK_js.cn("mt-4 text-sm text-gray-500 dark:text-gray-400", className),
     ...props
   }
 ));
 TableCaption.displayName = "TableCaption";
-var TableSelectAll = React10__namespace.forwardRef(({ className, ...props }, ref) => {
+var TableSelectAll = React11__namespace.forwardRef(({ className, ...props }, ref) => {
   const context = useTableContext();
   if (!context?.selectable || context.selectionMode !== "multiple") {
     return null;
@@ -1607,13 +1908,13 @@ var TableSelectAll = React10__namespace.forwardRef(({ className, ...props }, ref
   ) });
 });
 TableSelectAll.displayName = "TableSelectAll";
-var TableRowCheckbox = React10__namespace.forwardRef(({ rowId, rowData, className, ...props }, ref) => {
+var TableRowCheckbox = React11__namespace.forwardRef(({ rowId, rowData, className, ...props }, ref) => {
   const context = useTableContext();
   const getRowId = context?.getRowId;
   if (!context?.selectable) {
     return null;
   }
-  const finalRowId = React10__namespace.useMemo(() => {
+  const finalRowId = React11__namespace.useMemo(() => {
     if (rowId) return rowId;
     if (rowData && getRowId) return getRowId(rowData);
     return void 0;
@@ -1651,7 +1952,7 @@ function getDefaultColumns(columns, isMobile) {
 }
 function useColumnVisibility(columns, options = {}) {
   const { storageKey } = options;
-  const [visibleColumns, setVisibleColumnsState] = React10.useState(() => {
+  const [visibleColumns, setVisibleColumnsState] = React11.useState(() => {
     if (storageKey && typeof window !== "undefined") {
       try {
         const saved = localStorage.getItem(storageKey);
@@ -1665,7 +1966,7 @@ function useColumnVisibility(columns, options = {}) {
     }
     return getDefaultColumns(columns, false);
   });
-  React10.useEffect(() => {
+  React11.useEffect(() => {
     if (storageKey) {
       try {
         const saved = localStorage.getItem(storageKey);
@@ -1678,7 +1979,7 @@ function useColumnVisibility(columns, options = {}) {
       setVisibleColumnsState(getDefaultColumns(columns, true));
     }
   }, []);
-  const setVisibleColumns = React10.useCallback((cols) => {
+  const setVisibleColumns = React11.useCallback((cols) => {
     const stickyKeys = columns.filter((c) => c.stickyXHeader).map((c) => c.key);
     const merged = Array.from(/* @__PURE__ */ new Set([...stickyKeys, ...cols]));
     setVisibleColumnsState(merged);
@@ -1698,7 +1999,7 @@ function ColumnSelection({
   triggerLabel = "Manage Columns",
   trigger
 }) {
-  const handleToggle = React10__namespace.useCallback((key, checked) => {
+  const handleToggle = React11__namespace.useCallback((key, checked) => {
     if (checked) {
       if (!visibleColumns.includes(key)) {
         onVisibleColumnsChange([...visibleColumns, key]);
@@ -1720,7 +2021,7 @@ function ColumnSelection({
         return /* @__PURE__ */ jsxRuntime.jsxs(
           "label",
           {
-            className: chunk23BJPJOK_js.cn(
+            className: chunkD2BLWOWK_js.cn(
               "flex items-center gap-2.5 rounded-hz-md px-2 py-1.5 text-sm cursor-pointer hover:bg-gray-50 dark:hover:bg-neutral-800",
               isSticky && "opacity-50 cursor-not-allowed"
             ),
@@ -1745,33 +2046,33 @@ function ColumnSelection({
     ] })
   ] });
 }
-var TabsContext = React10__namespace.createContext(null);
+var TabsContext = React11__namespace.createContext(null);
 var useTabsContext = () => {
-  const context = React10__namespace.useContext(TabsContext);
+  const context = React11__namespace.useContext(TabsContext);
   if (!context) {
     throw new Error("Tabs components must be used within a Tabs provider");
   }
   return context;
 };
-var TabsListContext = React10__namespace.createContext({ variant: "pill" });
-var useTabsListContext = () => React10__namespace.useContext(TabsListContext);
-var Tabs = React10__namespace.forwardRef(({ defaultValue, value, onValueChange, children, ...props }, ref) => {
-  const [activeTab, setActiveTabState] = React10__namespace.useState(value ?? defaultValue);
-  const tabRefs = React10__namespace.useRef(/* @__PURE__ */ new Map()).current;
-  const listRef = React10__namespace.useRef(null);
-  const setActiveTab = React10__namespace.useCallback(
+var TabsListContext = React11__namespace.createContext({ variant: "pill" });
+var useTabsListContext = () => React11__namespace.useContext(TabsListContext);
+var Tabs = React11__namespace.forwardRef(({ defaultValue, value, onValueChange, children, ...props }, ref) => {
+  const [activeTab, setActiveTabState] = React11__namespace.useState(value ?? defaultValue);
+  const tabRefs = React11__namespace.useRef(/* @__PURE__ */ new Map()).current;
+  const listRef = React11__namespace.useRef(null);
+  const setActiveTab = React11__namespace.useCallback(
     (newValue) => {
       setActiveTabState(newValue);
       onValueChange?.(newValue);
     },
     [onValueChange]
   );
-  React10__namespace.useEffect(() => {
+  React11__namespace.useEffect(() => {
     if (value !== void 0) {
       setActiveTabState(value);
     }
   }, [value]);
-  const registerTab = React10__namespace.useCallback(
+  const registerTab = React11__namespace.useCallback(
     (tabValue, element) => {
       tabRefs.set(tabValue, element);
     },
@@ -1796,10 +2097,10 @@ var Tabs = React10__namespace.forwardRef(({ defaultValue, value, onValueChange,
   );
 });
 Tabs.displayName = "Tabs";
-var TabsList = React10__namespace.forwardRef(({ className, children, variant = "pill", ...props }, ref) => {
+var TabsList = React11__namespace.forwardRef(({ className, children, variant = "pill", ...props }, ref) => {
   const { activeTab, tabRefs, listRef } = useTabsContext();
-  const [indicatorStyle, setIndicatorStyle] = React10__namespace.useState(null);
-  React10__namespace.useEffect(() => {
+  const [indicatorStyle, setIndicatorStyle] = React11__namespace.useState(null);
+  React11__namespace.useEffect(() => {
     if (variant !== "pill") return;
     const updateIndicator = () => {
       if (!activeTab || !listRef.current) return;
@@ -1824,7 +2125,7 @@ var TabsList = React10__namespace.forwardRef(({ className, children, variant = "
         else if (ref) ref.current = node;
         listRef.current = node;
       },
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         variant === "pill" ? "relative inline-flex h-10 items-center justify-center rounded-hz-lg p-1 bg-gray-100 text-gray-500 dark:bg-neutral-700 dark:text-gray-400" : "flex gap-4 border-b border-gray-200 dark:border-neutral-800",
         className
       ),
@@ -1852,11 +2153,11 @@ var TabsList = React10__namespace.forwardRef(({ className, children, variant = "
   ) });
 });
 TabsList.displayName = TabsPrimitive__namespace.List.displayName;
-var TabsTrigger = React10__namespace.forwardRef(({ className, value, icon, children, ...props }, ref) => {
+var TabsTrigger = React11__namespace.forwardRef(({ className, value, icon, children, ...props }, ref) => {
   const { registerTab, activeTab } = useTabsContext();
   const { variant } = useTabsListContext();
-  const triggerRef = React10__namespace.useRef(null);
-  React10__namespace.useEffect(() => {
+  const triggerRef = React11__namespace.useRef(null);
+  React11__namespace.useEffect(() => {
     registerTab(value, triggerRef.current);
     return () => registerTab(value, null);
   }, [value, registerTab]);
@@ -1870,12 +2171,12 @@ var TabsTrigger = React10__namespace.forwardRef(({ className, value, icon, child
         else if (ref) ref.current = node;
       },
       value,
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "inline-flex items-center gap-1.5 whitespace-nowrap text-sm font-medium focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
-        variant === "pill" ? chunk23BJPJOK_js.cn(
+        variant === "pill" ? chunkD2BLWOWK_js.cn(
           "relative z-10 justify-center rounded-hz-md px-3 py-1.5 transition-colors",
           isActive ? "text-gray-900 dark:text-gray-100" : "text-gray-500 dark:text-gray-400"
-        ) : chunk23BJPJOK_js.cn(
+        ) : chunkD2BLWOWK_js.cn(
           "pb-3 border-b-2 transition-colors",
           isActive ? "border-blue-600 text-blue-600 dark:border-blue-400 dark:text-blue-400" : "border-transparent text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300 hover:border-gray-300 dark:hover:border-gray-600"
         ),
@@ -1890,11 +2191,11 @@ var TabsTrigger = React10__namespace.forwardRef(({ className, value, icon, child
   );
 });
 TabsTrigger.displayName = TabsPrimitive__namespace.Trigger.displayName;
-var TabsContent = React10__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
+var TabsContent = React11__namespace.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsxRuntime.jsx(
   TabsPrimitive__namespace.Content,
   {
     ref,
-    className: chunk23BJPJOK_js.cn(
+    className: chunkD2BLWOWK_js.cn(
       "mt-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
       className
     ),
@@ -1902,12 +2203,12 @@ var TabsContent = React10__namespace.forwardRef(({ className, ...props }, ref) =
   }
 ));
 TabsContent.displayName = TabsPrimitive__namespace.Content.displayName;
-var Textarea = React10__namespace.forwardRef(
+var Textarea = React11__namespace.forwardRef(
   ({ className, ...props }, ref) => {
     return /* @__PURE__ */ jsxRuntime.jsx(
       "textarea",
       {
-        className: chunk23BJPJOK_js.cn(
+        className: chunkD2BLWOWK_js.cn(
           "flex min-h-[80px] w-full rounded-hz-md border border-gray-300 bg-white px-3 py-2 text-sm text-gray-900 placeholder:text-gray-400 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 dark:border-neutral-600 dark:bg-neutral-800 dark:text-gray-100 dark:placeholder:text-gray-500",
           className
         ),
@@ -1986,7 +2287,7 @@ function Toggle({
       ...props,
       type: "multiple",
       ...value !== void 0 ? { value, onValueChange: onChange } : {},
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         toggleGroupVariants({ size }),
         containerRadiusClass2[radius],
         className
@@ -1999,7 +2300,7 @@ function Toggle({
             value: option.value,
             disabled: option.disabled,
             "aria-label": iconOnly ? option.ariaLabel ?? option.value : void 0,
-            className: chunk23BJPJOK_js.cn(
+            className: chunkD2BLWOWK_js.cn(
               toggleItemVariants({ size, iconOnly }),
               itemRadiusClass2[radius],
               "border border-transparent text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200",
@@ -2059,8 +2360,8 @@ var switchLabelVariants = classVarianceAuthority.cva("select-none", {
     size: "default"
   }
 });
-var Switch = React10__namespace.forwardRef(({ className, size, label, labelPosition = "right", ...props }, ref) => {
-  const generatedId = React10__namespace.useId();
+var Switch = React11__namespace.forwardRef(({ className, size, label, labelPosition = "right", ...props }, ref) => {
+  const generatedId = React11__namespace.useId();
   const switchId = props.id ?? generatedId;
   const switchEl = /* @__PURE__ */ jsxRuntime.jsx(
     SwitchPrimitive__namespace.Root,
@@ -2068,7 +2369,7 @@ var Switch = React10__namespace.forwardRef(({ className, size, label, labelPosit
       ...props,
       id: switchId,
       ref,
-      className: chunk23BJPJOK_js.cn(switchTrackVariants({ size }), className),
+      className: chunkD2BLWOWK_js.cn(switchTrackVariants({ size }), className),
       children: /* @__PURE__ */ jsxRuntime.jsx(SwitchPrimitive__namespace.Thumb, { className: switchThumbVariants({ size }) })
     }
   );
@@ -2076,7 +2377,7 @@ var Switch = React10__namespace.forwardRef(({ className, size, label, labelPosit
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "inline-flex items-center gap-2",
         props.disabled ? "cursor-not-allowed" : "cursor-pointer"
       ),
@@ -2085,7 +2386,7 @@ var Switch = React10__namespace.forwardRef(({ className, size, label, labelPosit
           "label",
           {
             htmlFor: switchId,
-            className: chunk23BJPJOK_js.cn(
+            className: chunkD2BLWOWK_js.cn(
               switchLabelVariants({ size }),
               props.disabled ? "cursor-not-allowed" : "cursor-pointer"
             ),
@@ -2097,7 +2398,7 @@ var Switch = React10__namespace.forwardRef(({ className, size, label, labelPosit
           "label",
           {
             htmlFor: switchId,
-            className: chunk23BJPJOK_js.cn(
+            className: chunkD2BLWOWK_js.cn(
               switchLabelVariants({ size }),
               props.disabled ? "cursor-not-allowed" : "cursor-pointer"
             ),
@@ -2138,39 +2439,59 @@ function TimeInput({
   max,
   onChange,
   onComplete,
+  onDirty,
   inputRef,
   disabled = false,
   "aria-label": ariaLabel
 }) {
-  const [editValue, setEditValue] = React10__namespace.useState(null);
-  const internalRef = React10__namespace.useRef(null);
-  const committedRef = React10__namespace.useRef(false);
-  const setRefs = React10__namespace.useCallback(chunk23BJPJOK_js.mergeRefs(internalRef, inputRef), [inputRef]);
-  const handleChange = (e) => {
-    const raw = e.target.value.replace(/\D/g, "").slice(0, 2);
-    if (raw === "") {
-      setEditValue(raw);
-      return;
-    }
-    if (raw.length === 1) {
-      setEditValue(raw);
-      return;
-    }
+  const [editValue, setEditValue] = React11__namespace.useState(null);
+  const internalRef = React11__namespace.useRef(null);
+  const committedRef = React11__namespace.useRef(false);
+  const pendingDigitRef = React11__namespace.useRef(null);
+  const setRefs = React11__namespace.useCallback(chunkD2BLWOWK_js.mergeRefs(internalRef, inputRef), [inputRef]);
+  const commitTwoDigits = (raw) => {
     const parsed = parseInt(raw, 10);
     const clamped = clamp(parsed, min2, max);
+    pendingDigitRef.current = null;
     committedRef.current = true;
     onChange(clamped);
     setEditValue(null);
     onComplete?.();
   };
+  const handleChange = (e) => {
+    const allDigits = e.target.value.replace(/\D/g, "");
+    if (allDigits === "") {
+      setEditValue("");
+      pendingDigitRef.current = null;
+      return;
+    }
+    if (pendingDigitRef.current !== null) {
+      if (allDigits.length > 2) {
+        commitTwoDigits(pendingDigitRef.current + allDigits[allDigits.length - 1]);
+        return;
+      }
+      pendingDigitRef.current = null;
+      setEditValue("");
+      return;
+    }
+    if (allDigits.length === 1) {
+      pendingDigitRef.current = allDigits;
+      setEditValue("0" + allDigits);
+      onDirty?.();
+      return;
+    }
+    commitTwoDigits(allDigits.slice(0, 2));
+  };
   const commit = () => {
     if (committedRef.current) {
       committedRef.current = false;
+      pendingDigitRef.current = null;
       setEditValue(null);
       return;
     }
     if (editValue === null) return;
     if (editValue === "") {
+      pendingDigitRef.current = null;
       setEditValue(null);
       return;
     }
@@ -2178,6 +2499,7 @@ function TimeInput({
     if (!isNaN(parsed)) {
       onChange(clamp(parsed, min2, max));
     }
+    pendingDigitRef.current = null;
     setEditValue(null);
   };
   const handleKeyDown = (e) => {
@@ -2185,16 +2507,19 @@ function TimeInput({
       commit();
       internalRef.current?.blur();
     } else if (e.key === "Escape") {
+      pendingDigitRef.current = null;
       setEditValue(null);
       internalRef.current?.blur();
     } else if (e.key === "ArrowUp") {
       e.preventDefault();
+      pendingDigitRef.current = null;
       const curr = value ?? min2;
       const next = curr >= max ? min2 : curr + 1;
       onChange(next);
       setEditValue(pad(next));
     } else if (e.key === "ArrowDown") {
       e.preventDefault();
+      pendingDigitRef.current = null;
       const curr = value ?? max;
       const next = curr <= min2 ? max : curr - 1;
       onChange(next);
@@ -2212,12 +2537,13 @@ function TimeInput({
       value: editValue ?? (value === null ? "--" : pad(value)),
       onChange: handleChange,
       onFocus: (e) => {
+        pendingDigitRef.current = null;
         setEditValue("");
         requestAnimationFrame(() => e.target.select());
       },
       onBlur: () => commit(),
       onKeyDown: handleKeyDown,
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "w-9 h-8 rounded-md border text-center text-sm tabular-nums font-medium outline-none transition-colors",
         "bg-white border-gray-200 text-gray-600",
         "focus:border-blue-500 focus:ring-1 focus:ring-blue-500/30 focus:text-gray-700",
@@ -2232,7 +2558,7 @@ function PeriodToggle({ value, onChange, disabled = false }) {
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "inline-flex rounded-md border overflow-hidden",
         disabled && "opacity-40 cursor-not-allowed",
         "border-gray-200 dark:border-neutral-600"
@@ -2243,7 +2569,7 @@ function PeriodToggle({ value, onChange, disabled = false }) {
           type: "button",
           disabled,
           onClick: () => onChange(p),
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "px-2 h-8 text-xs font-semibold tracking-wide transition-colors",
             "disabled:pointer-events-none",
             value === p ? "!bg-blue-600 !text-white dark:!bg-blue-500" : "bg-white text-gray-500 hover:bg-gray-50 hover:text-gray-600 dark:bg-neutral-800 dark:text-gray-400 dark:hover:bg-neutral-700"
@@ -2262,11 +2588,12 @@ function TimeField({
   hourRef,
   minuteRef,
   onMinuteComplete,
+  onDirty,
   disabled = false
 }) {
   const { hour12, period } = to12Hour(value.hour);
-  const minuteInputRef = React10__namespace.useRef(null);
-  const mergedMinuteRef = React10__namespace.useCallback(chunk23BJPJOK_js.mergeRefs(minuteInputRef, minuteRef), [minuteRef]);
+  const minuteInputRef = React11__namespace.useRef(null);
+  const mergedMinuteRef = React11__namespace.useCallback(chunkD2BLWOWK_js.mergeRefs(minuteInputRef, minuteRef), [minuteRef]);
   const handleHourChange = (newHour12) => {
     onChange({ ...value, hour: to24Hour(newHour12, period) });
   };
@@ -2284,7 +2611,7 @@ function TimeField({
     /* @__PURE__ */ jsxRuntime.jsx(
       "span",
       {
-        className: chunk23BJPJOK_js.cn(
+        className: chunkD2BLWOWK_js.cn(
           "text-xs font-semibold uppercase tracking-wider",
           disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
         ),
@@ -2300,6 +2627,7 @@ function TimeField({
           max: 12,
           onChange: handleHourChange,
           onComplete: focusMinute,
+          onDirty,
           inputRef: hourRef,
           disabled,
           "aria-label": `${label} hour`
@@ -2308,7 +2636,7 @@ function TimeField({
       /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "text-sm font-bold select-none",
             disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
           ),
@@ -2323,6 +2651,7 @@ function TimeField({
           max: 59,
           onChange: handleMinuteChange,
           onComplete: onMinuteComplete,
+          onDirty,
           inputRef: mergedMinuteRef,
           disabled,
           "aria-label": `${label} minute`
@@ -2339,11 +2668,14 @@ function TimeField({
     ] })
   ] });
 }
-function TimePickerColumn({ value, onChange, disabled = false }) {
-  const toHourRef = React10__namespace.useRef(null);
+function useTimeFieldState(value) {
   const fromSet = isTimeSet(value.from);
   const toSet = isTimeSet(value.to);
   const bothSet = fromSet && toSet;
+  const orphanMinutes = value.from.hour === null && value.from.minute !== null || value.to.hour === null && value.to.minute !== null;
+  const fromPartial = !fromSet && (value.from.hour !== null || value.from.minute !== null);
+  const toPartial = !toSet && (value.to.hour !== null || value.to.minute !== null);
+  const oneSideMissing = fromSet && !toSet && !toPartial || toSet && !fromSet && !fromPartial;
   const fromMinutes = (value.from.hour ?? 0) * 60 + (value.from.minute ?? 0);
   const toMinutes = (value.to.hour ?? 0) * 60 + (value.to.minute ?? 0);
   const bothEqual = fromMinutes === toMinutes;
@@ -2353,140 +2685,142 @@ function TimePickerColumn({ value, onChange, disabled = false }) {
   const durationRemaining = durationMinutes % 60;
   const showDuration = bothSet && !bothEqual;
   const durationLabel = durationRemaining > 0 ? `${durationHours}h ${durationRemaining}m window${isOvernight ? " (overnight)" : ""}` : `${durationHours}h window${isOvernight ? " (overnight)" : ""}`;
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: chunk23BJPJOK_js.cn(
-        "flex flex-col px-2 pt-2 pb-2 gap-1",
-        "border-t border-gray-100 dark:border-neutral-700"
+  const incompleteHint = orphanMinutes ? "Please set hours for the time to take effect" : fromPartial || toPartial ? "Please complete both hour and minute fields" : oneSideMissing ? `Please set the ${fromSet ? "to" : "from"} time` : null;
+  return { showDuration, durationLabel, isOvernight, incompleteHint };
+}
+function TimePickerColumn({ value, onChange, disabled = false, onRemove, showRemove = false, onDirty }) {
+  const toHourRef = React11__namespace.useRef(null);
+  const { showDuration, durationLabel, isOvernight, incompleteHint } = useTimeFieldState(value);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col px-2 pt-2 pb-2 gap-1", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        lucideReact.Clock,
+        {
+          className: chunkD2BLWOWK_js.cn(
+            "w-4 h-4 shrink-0",
+            disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
+          )
+        }
       ),
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            lucideReact.Clock,
-            {
-              className: chunk23BJPJOK_js.cn(
-                "w-4 h-4 shrink-0",
-                disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
-            {
-              className: chunk23BJPJOK_js.cn(
-                "text-xs font-semibold uppercase tracking-wider",
-                disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
-              ),
-              children: "Time"
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-medium text-gray-400 dark:text-gray-600 tracking-wide", children: "(Optional)" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 pl-6", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            TimeField,
-            {
-              label: "From",
-              value: value.from,
-              onChange: (from) => onChange({ ...value, from }),
-              onMinuteComplete: () => toHourRef.current?.focus(),
-              disabled
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx(
-            TimeField,
-            {
-              label: "To",
-              value: value.to,
-              onChange: (to) => onChange({ ...value, to }),
-              hourRef: toHourRef,
-              disabled
-            }
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "span",
+        {
+          className: chunkD2BLWOWK_js.cn(
+            "text-xs font-semibold uppercase tracking-wider",
+            disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
           ),
-          showDuration && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunk23BJPJOK_js.cn(
-            "text-[10px] font-medium",
-            isOvernight ? "text-amber-500 dark:text-amber-400" : "text-gray-400 dark:text-gray-500"
-          ), children: durationLabel })
-        ] })
-      ]
-    }
-  );
+          children: "Time"
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-medium text-gray-400 dark:text-gray-600 tracking-wide", children: "(Optional)" }),
+      showRemove && onRemove && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "ml-auto", children: /* @__PURE__ */ jsxRuntime.jsx(
+        chunkD2BLWOWK_js.TextButton,
+        {
+          variant: "danger",
+          onClick: onRemove,
+          size: "sm",
+          className: "!text-[0.625rem]",
+          children: "Remove"
+        }
+      ) })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 pl-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        TimeField,
+        {
+          label: "From",
+          value: value.from,
+          onChange: (from) => onChange({ ...value, from }),
+          onMinuteComplete: () => toHourRef.current?.focus(),
+          onDirty,
+          disabled
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        TimeField,
+        {
+          label: "To",
+          value: value.to,
+          onChange: (to) => onChange({ ...value, to }),
+          hourRef: toHourRef,
+          onDirty,
+          disabled
+        }
+      ),
+      showDuration && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunkD2BLWOWK_js.cn(
+        "text-[10px] font-medium",
+        isOvernight ? "text-amber-500 dark:text-amber-400" : "text-gray-400 dark:text-gray-500"
+      ), children: durationLabel }),
+      incompleteHint && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-medium text-amber-500 dark:text-amber-400", children: incompleteHint })
+    ] })
+  ] });
 }
-function TimePickerRow({ value, onChange, disabled = false }) {
-  const toHourRef = React10__namespace.useRef(null);
-  const fromSet = isTimeSet(value.from);
-  const toSet = isTimeSet(value.to);
-  const bothSet = fromSet && toSet;
-  const fromMinutes = (value.from.hour ?? 0) * 60 + (value.from.minute ?? 0);
-  const toMinutes = (value.to.hour ?? 0) * 60 + (value.to.minute ?? 0);
-  const bothEqual = fromMinutes === toMinutes;
-  const isOvernight = bothSet && toMinutes < fromMinutes;
-  const durationMinutes = bothSet && !bothEqual ? isOvernight ? 24 * 60 - fromMinutes + toMinutes : toMinutes - fromMinutes : 0;
-  const durationHours = Math.floor(durationMinutes / 60);
-  const durationRemaining = durationMinutes % 60;
-  const showDuration = bothSet && !bothEqual;
-  const durationLabel = durationRemaining > 0 ? `${durationHours}h ${durationRemaining}m window${isOvernight ? " (overnight)" : ""}` : `${durationHours}h window${isOvernight ? " (overnight)" : ""}`;
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    "div",
-    {
-      className: chunk23BJPJOK_js.cn(
-        "flex flex-col px-4 pt-2 pb-3 gap-1",
-        "border-t border-gray-100 dark:border-neutral-700"
+function TimePickerRow({ value, onChange, disabled = false, onRemove, showRemove = false, onDirty }) {
+  const toHourRef = React11__namespace.useRef(null);
+  const { showDuration, durationLabel, isOvernight, incompleteHint } = useTimeFieldState(value);
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col px-4 pt-2 pb-3 gap-1", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        lucideReact.Clock,
+        {
+          className: chunkD2BLWOWK_js.cn(
+            "w-4 h-4 shrink-0",
+            disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
+          )
+        }
       ),
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            lucideReact.Clock,
-            {
-              className: chunk23BJPJOK_js.cn(
-                "w-4 h-4 shrink-0",
-                disabled ? "text-gray-300 dark:text-gray-600" : "text-gray-400 dark:text-gray-500"
-              )
-            }
-          ),
-          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-medium text-gray-300 dark:text-gray-600 tracking-wide", children: "OPT" })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 flex-1", children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-5", children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              TimeField,
-              {
-                label: "From",
-                value: value.from,
-                onChange: (from) => onChange({ ...value, from }),
-                onMinuteComplete: () => toHourRef.current?.focus(),
-                disabled
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: chunk23BJPJOK_js.cn(
-                  "w-4 h-px",
-                  disabled ? "bg-gray-200 dark:bg-neutral-700" : "bg-gray-300 dark:bg-neutral-600"
-                )
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              TimeField,
-              {
-                label: "To",
-                value: value.to,
-                onChange: (to) => onChange({ ...value, to }),
-                hourRef: toHourRef,
-                disabled
-              }
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[9px] font-medium text-gray-300 dark:text-gray-600 tracking-wide", children: "OPT" })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1 flex-1", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          TimeField,
+          {
+            label: "From",
+            value: value.from,
+            onChange: (from) => onChange({ ...value, from }),
+            onMinuteComplete: () => toHourRef.current?.focus(),
+            onDirty,
+            disabled
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: chunkD2BLWOWK_js.cn(
+              "w-4 h-px",
+              disabled ? "bg-gray-200 dark:bg-neutral-700" : "bg-gray-300 dark:bg-neutral-600"
             )
-          ] }),
-          showDuration && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunk23BJPJOK_js.cn(
-            "text-[10px] font-medium pl-0.5",
-            isOvernight ? "text-amber-500 dark:text-amber-400" : "text-gray-400 dark:text-gray-500"
-          ), children: durationLabel })
-        ] })
-      ] })
-    }
-  );
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          TimeField,
+          {
+            label: "To",
+            value: value.to,
+            onChange: (to) => onChange({ ...value, to }),
+            hourRef: toHourRef,
+            onDirty,
+            disabled
+          }
+        ),
+        showRemove && onRemove && /* @__PURE__ */ jsxRuntime.jsx(
+          Button,
+          {
+            variant: "outline",
+            onClick: onRemove,
+            className: "text-[0.625rem] border border-red-100 dark:border-red-700 rounded-md px-2 py-1 h-8 text-red-500 hover:text-red-600 dark:text-red-400 dark:hover:text-red-300 transition-colors",
+            children: "Remove"
+          }
+        )
+      ] }),
+      showDuration && /* @__PURE__ */ jsxRuntime.jsx("span", { className: chunkD2BLWOWK_js.cn(
+        "text-[10px] font-medium pl-0.5",
+        isOvernight ? "text-amber-500 dark:text-amber-400" : "text-gray-400 dark:text-gray-500"
+      ), children: durationLabel }),
+      incompleteHint && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-[10px] font-medium pl-0.5 text-amber-500 dark:text-amber-400", children: incompleteHint })
+    ] })
+  ] }) });
 }
 var WEEKDAYS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
 function getCalendarDays(month) {
@@ -2534,7 +2868,7 @@ function CalendarMonth({
         "button",
         {
           onClick: onPrevMonth,
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "p-1 rounded-md transition-colors",
             showPrevNav ? "hover:bg-gray-100 dark:hover:bg-neutral-700 text-gray-500 dark:text-gray-400" : "invisible pointer-events-none"
           ),
@@ -2546,7 +2880,7 @@ function CalendarMonth({
         "button",
         {
           onClick: onNextMonth,
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "p-1 rounded-md transition-colors",
             showNextNav ? "hover:bg-gray-100 dark:hover:bg-neutral-700 text-gray-500 dark:text-gray-400" : "invisible pointer-events-none"
           ),
@@ -2581,7 +2915,7 @@ function CalendarMonth({
           return /* @__PURE__ */ jsxRuntime.jsx(
             "div",
             {
-              className: chunk23BJPJOK_js.cn(
+              className: chunkD2BLWOWK_js.cn(
                 "h-9 flex items-center justify-center",
                 (inRange || rangeStart || rangeEnd) && "bg-blue-50 dark:bg-blue-950/40",
                 rangeStart && !rangeEnd && "rounded-l-full",
@@ -2595,7 +2929,7 @@ function CalendarMonth({
                   onMouseEnter: () => !disabled && onDayHover(day),
                   tabIndex: disabled ? -1 : 0,
                   disabled,
-                  className: chunk23BJPJOK_js.cn(
+                  className: chunkD2BLWOWK_js.cn(
                     "w-8 h-8 rounded-full text-sm flex items-center justify-center transition-colors",
                     isFuture && "text-gray-300 dark:text-gray-600 pointer-events-none cursor-not-allowed",
                     !disabled && !rangeStart && !rangeEnd && "text-gray-700 dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-neutral-700",
@@ -2614,6 +2948,167 @@ function CalendarMonth({
     )
   ] });
 }
+function useDateRangePicker({
+  value,
+  onChange,
+  showTimePicker = false,
+  timeValue,
+  onTimeChange
+}) {
+  const [open, setOpen] = React11__namespace.useState(false);
+  const [internalRange, setInternalRange] = React11__namespace.useState({
+    from: void 0,
+    to: void 0
+  });
+  const [draft, setDraft] = React11__namespace.useState({
+    from: void 0,
+    to: void 0
+  });
+  const [hoverDate, setHoverDate] = React11__namespace.useState();
+  const [viewMonth, setViewMonth] = React11__namespace.useState(
+    () => dateFns.startOfMonth(value?.from ?? /* @__PURE__ */ new Date())
+  );
+  const [activePreset, setActivePreset] = React11__namespace.useState();
+  const [committedInternalTime, setCommittedInternalTime] = React11__namespace.useState(DEFAULT_TIME_RANGE);
+  const [draftTime, setDraftTime] = React11__namespace.useState(DEFAULT_TIME_RANGE);
+  const [timeExpanded, setTimeExpanded] = React11__namespace.useState(false);
+  const [timeDirty, setTimeDirty] = React11__namespace.useState(false);
+  const committedRange = value ?? internalRange;
+  const committedTime = timeValue ?? committedInternalTime;
+  const timeVisible = !!(draft.from && draft.to);
+  const hasAnyTimeInput = timeDirty || draftTime.from.hour !== null || draftTime.from.minute !== null || draftTime.to.hour !== null || draftTime.to.minute !== null;
+  const isTimeComplete2 = draftTime.from.hour !== null && draftTime.from.minute !== null && draftTime.to.hour !== null && draftTime.to.minute !== null;
+  const hasPartialTime = showTimePicker && timeExpanded && !isTimeComplete2;
+  const canClear = !!(draft.from || committedRange.from);
+  const canApply = !(draft.from && !draft.to) && !!(draft.from || committedRange.from) && !hasPartialTime;
+  const resetTime = React11__namespace.useCallback(() => {
+    setDraftTime(DEFAULT_TIME_RANGE);
+    setTimeExpanded(false);
+    setTimeDirty(false);
+  }, []);
+  const handleTimeChange = React11__namespace.useCallback((newTime) => {
+    setDraftTime(newTime);
+  }, []);
+  const handleOpenChange = React11__namespace.useCallback(
+    (newOpen) => {
+      if (newOpen) {
+        setDraft(committedRange);
+        if (committedRange.from)
+          setViewMonth(dateFns.startOfMonth(committedRange.from));
+        setDraftTime(committedTime);
+        const hasExistingTime = committedTime.from.hour !== null || committedTime.from.minute !== null || committedTime.to.hour !== null || committedTime.to.minute !== null;
+        setTimeExpanded(hasExistingTime);
+        setTimeDirty(false);
+      }
+      setOpen(newOpen);
+    },
+    [committedRange, committedTime]
+  );
+  const handleDayClick = React11__namespace.useCallback(
+    (date) => {
+      const { from, to } = draft;
+      if (!from || from && to) {
+        setDraft({ from: date, to: void 0 });
+        setActivePreset(void 0);
+        if (showTimePicker && timeExpanded) {
+          resetTime();
+        }
+        return;
+      }
+      const [start, end] = dateFns.isBefore(from, date) ? [from, date] : [date, from];
+      setDraft({ from: start, to: end });
+      setHoverDate(void 0);
+    },
+    [draft, showTimePicker, timeExpanded, resetTime]
+  );
+  const handlePreset = React11__namespace.useCallback(
+    (preset) => {
+      const newRange = preset.getRange();
+      setDraft(newRange);
+      setActivePreset(preset.label);
+      if (newRange.from) setViewMonth(dateFns.startOfMonth(newRange.from));
+      if (showTimePicker) resetTime();
+    },
+    [showTimePicker, resetTime]
+  );
+  const handleApply = React11__namespace.useCallback(() => {
+    if (draft.from && !draft.to) return;
+    const newRange = draft.from && draft.to ? draft : void 0;
+    const rangeChanged = newRange?.from?.getTime() !== committedRange.from?.getTime() || newRange?.to?.getTime() !== committedRange.to?.getTime();
+    const timeChanged = draftTime.from.hour !== committedTime.from.hour || draftTime.from.minute !== committedTime.from.minute || draftTime.to.hour !== committedTime.to.hour || draftTime.to.minute !== committedTime.to.minute;
+    if (rangeChanged) {
+      if (onChange) onChange(newRange);
+      else setInternalRange(newRange ?? { from: void 0, to: void 0 });
+    }
+    if (timeChanged) {
+      if (onTimeChange) onTimeChange(draftTime);
+      else setCommittedInternalTime(draftTime);
+    }
+    setOpen(false);
+  }, [draft, onChange, committedRange, draftTime, committedTime, onTimeChange]);
+  const handleClear = React11__namespace.useCallback(() => {
+    setDraft({ from: void 0, to: void 0 });
+    setActivePreset(void 0);
+    if (showTimePicker) resetTime();
+  }, [showTimePicker, resetTime]);
+  const expandTime = React11__namespace.useCallback(() => {
+    setTimeExpanded(true);
+  }, []);
+  const markTimeDirty = React11__namespace.useCallback(() => {
+    setTimeDirty(true);
+  }, []);
+  return {
+    open,
+    draft,
+    hoverDate,
+    viewMonth,
+    activePreset,
+    committedRange,
+    committedTime,
+    draftTime,
+    timeExpanded,
+    timeVisible,
+    hasAnyTimeInput,
+    canClear,
+    canApply,
+    showTimePicker,
+    setHoverDate,
+    setViewMonth,
+    handleTimeChange,
+    handleOpenChange,
+    handleDayClick,
+    handlePreset,
+    handleApply,
+    handleClear,
+    resetTime,
+    expandTime,
+    markTimeDirty
+  };
+}
+function formatTime(hour, minute) {
+  const period = hour >= 12 ? "PM" : "AM";
+  const h = hour % 12 || 12;
+  const m = minute.toString().padStart(2, "0");
+  return `${h}:${m} ${period}`;
+}
+function isTimeComplete(time) {
+  return time.from.hour !== null && time.from.minute !== null && time.to.hour !== null && time.to.minute !== null;
+}
+function formatDateRange(range, placeholder, time) {
+  if (!range?.from) return placeholder;
+  const hasTime = time && isTimeComplete(time);
+  if (!range.to || dateFns.isSameDay(range.from, range.to)) {
+    const dateStr = dateFns.format(range.from, "MMM d, yyyy");
+    return hasTime ? `${dateStr} ${formatTime(time.from.hour, time.from.minute)} \u2013 ${formatTime(time.to.hour, time.to.minute)}` : dateStr;
+  }
+  const sameYear = range.from.getFullYear() === range.to.getFullYear();
+  const fromDate = dateFns.format(range.from, sameYear ? "MMM d" : "MMM d, yyyy");
+  const toDate = dateFns.format(range.to, "MMM d, yyyy");
+  if (hasTime) {
+    return `${fromDate} ${formatTime(time.from.hour, time.from.minute)} \u2013 ${toDate} ${formatTime(time.to.hour, time.to.minute)}`;
+  }
+  return `${fromDate} \u2013 ${toDate}`;
+}
 var DEFAULT_PRESETS = [
   {
     label: "Today",
@@ -2661,26 +3156,6 @@ var DEFAULT_PRESETS = [
     }
   }
 ];
-function formatTime(tv) {
-  if (tv.hour === null || tv.minute === null) return "--:--";
-  const period = tv.hour >= 12 ? "PM" : "AM";
-  const h = tv.hour % 12 || 12;
-  const m = tv.minute.toString().padStart(2, "0");
-  return `${h}:${m} ${period}`;
-}
-function formatDateRange(range, placeholder, time) {
-  if (!range?.from) return placeholder;
-  const timeActive = time && time.from.hour !== null && time.to.hour !== null;
-  const timeSuffix = timeActive ? ` ${formatTime(time.from)} \u2013 ${formatTime(time.to)}` : "";
-  if (!range.to || dateFns.isSameDay(range.from, range.to)) {
-    return dateFns.format(range.from, "MMM d, yyyy") + timeSuffix;
-  }
-  const sameYear = range.from.getFullYear() === range.to.getFullYear();
-  if (sameYear) {
-    return `${dateFns.format(range.from, "MMM d")} \u2013 ${dateFns.format(range.to, "MMM d, yyyy")}${timeSuffix}`;
-  }
-  return `${dateFns.format(range.from, "MMM d, yyyy")} \u2013 ${dateFns.format(range.to, "MMM d, yyyy")}${timeSuffix}`;
-}
 function DateRangePicker({
   value,
   onChange,
@@ -2694,102 +3169,48 @@ function DateRangePicker({
   timeValue,
   onTimeChange
 }) {
-  const [open, setOpen] = React10__namespace.useState(false);
-  const [internalRange, setInternalRange] = React10__namespace.useState({
-    from: void 0,
-    to: void 0
-  });
-  const [draft, setDraft] = React10__namespace.useState({
-    from: void 0,
-    to: void 0
+  const picker = useDateRangePicker({
+    value,
+    onChange,
+    showTimePicker,
+    timeValue,
+    onTimeChange
   });
-  const [hoverDate, setHoverDate] = React10__namespace.useState();
-  const [leftMonth, setLeftMonth] = React10__namespace.useState(
-    () => dateFns.startOfMonth(value?.from ?? /* @__PURE__ */ new Date())
-  );
-  const [activePreset, setActivePreset] = React10__namespace.useState();
-  const [internalTime, setInternalTime] = React10__namespace.useState(DEFAULT_TIME_RANGE);
-  const committedRange = value ?? internalRange;
-  const currentTime = timeValue ?? internalTime;
-  const handleTimeChange = (newTime) => {
-    if (onTimeChange) onTimeChange(newTime);
-    else setInternalTime(newTime);
-  };
-  const timeVisible = !!(draft.from && draft.to);
-  const handleOpenChange = (newOpen) => {
-    if (newOpen) {
-      setDraft(committedRange);
-      if (committedRange.from) setLeftMonth(dateFns.startOfMonth(committedRange.from));
-      if (!onTimeChange) setInternalTime(currentTime);
-    }
-    setOpen(newOpen);
-  };
-  const handleDayClick = (date) => {
-    const { from, to } = draft;
-    if (!from || from && to) {
-      setDraft({ from: date, to: void 0 });
-      setActivePreset(void 0);
-      return;
-    }
-    const [start, end] = dateFns.isBefore(from, date) ? [from, date] : [date, from];
-    setDraft({ from: start, to: end });
-    setHoverDate(void 0);
-  };
-  const handlePreset = (preset) => {
-    const newRange = preset.getRange();
-    setDraft(newRange);
-    setActivePreset(preset.label);
-    if (newRange.from) setLeftMonth(dateFns.startOfMonth(newRange.from));
-  };
-  const handleApply = () => {
-    if (draft.from && !draft.to) return;
-    const newRange = draft.from && draft.to ? draft : void 0;
-    if (onChange) onChange(newRange);
-    else setInternalRange(newRange ?? { from: void 0, to: void 0 });
-    setOpen(false);
-  };
-  const handleClear = () => {
-    setDraft({ from: void 0, to: void 0 });
-    setActivePreset(void 0);
-    if (showTimePicker) handleTimeChange(DEFAULT_TIME_RANGE);
-  };
-  const canClear = !!(draft.from || committedRange.from);
-  const canApply = !(draft.from && !draft.to) && !!(draft.from || committedRange.from);
-  const rightMonth = dateFns.addMonths(leftMonth, 1);
-  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+  const rightMonth = dateFns.addMonths(picker.viewMonth, 1);
+  return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: picker.open, onOpenChange: picker.handleOpenChange, children: [
     /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
       "button",
       {
         disabled,
-        className: chunk23BJPJOK_js.cn(
+        className: chunkD2BLWOWK_js.cn(
           "inline-flex items-center gap-2 rounded-md border border-gray-300 bg-white px-3 py-2 text-sm shadow-sm transition-colors",
           "hover:bg-gray-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
           "dark:border-neutral-600 dark:bg-neutral-800 dark:hover:bg-neutral-700",
           "disabled:pointer-events-none disabled:opacity-50",
-          committedRange.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500",
+          picker.committedRange.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500",
           className
         ),
         children: [
           /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "w-4 h-4 shrink-0 text-gray-400 dark:text-gray-500" }),
           /* @__PURE__ */ jsxRuntime.jsx("span", { children: formatDateRange(
-            committedRange,
+            picker.committedRange,
             placeholder,
-            showTimePicker ? currentTime : void 0
+            showTimePicker ? picker.committedTime : void 0
           ) })
         ]
       }
     ) }),
     /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { align, className: "w-auto p-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex divide-x divide-gray-100 dark:divide-neutral-700", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col p-3 gap-0.5 min-w-[130px]", children: (presetSections ?? [{ title: "Presets", options: presets }]).map((section, si) => /* @__PURE__ */ jsxRuntime.jsxs(React10__namespace.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col p-3 gap-0.5 min-w-[130px]", children: (presetSections ?? [{ title: "Presets", options: presets }]).map((section, si) => /* @__PURE__ */ jsxRuntime.jsxs(React11__namespace.Fragment, { children: [
         si > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-2 border-t border-gray-100 dark:border-neutral-700" }),
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider mb-1 px-2", children: section.title }),
         section.options.map((preset) => /* @__PURE__ */ jsxRuntime.jsx(
           "button",
           {
-            onClick: () => handlePreset(preset),
-            className: chunk23BJPJOK_js.cn(
+            onClick: () => picker.handlePreset(preset),
+            className: chunkD2BLWOWK_js.cn(
               "w-full text-left px-2 py-1.5 rounded-md text-sm transition-colors",
-              activePreset === preset.label ? "bg-blue-50 text-blue-600 font-medium dark:bg-blue-950/50 dark:text-blue-400" : "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700"
+              picker.activePreset === preset.label ? "bg-blue-50 text-blue-600 font-medium dark:bg-blue-950/50 dark:text-blue-400" : "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700"
             ),
             children: preset.label
           },
@@ -2801,12 +3222,12 @@ function DateRangePicker({
           /* @__PURE__ */ jsxRuntime.jsx(
             CalendarMonth,
             {
-              month: leftMonth,
-              range: draft,
-              hoverDate,
-              onDayClick: handleDayClick,
-              onDayHover: setHoverDate,
-              onPrevMonth: () => setLeftMonth(dateFns.subMonths(leftMonth, 1)),
+              month: picker.viewMonth,
+              range: picker.draft,
+              hoverDate: picker.hoverDate,
+              onDayClick: picker.handleDayClick,
+              onDayHover: picker.setHoverDate,
+              onPrevMonth: () => picker.setViewMonth(dateFns.subMonths(picker.viewMonth, 1)),
               showPrevNav: true,
               showNextNav: false
             }
@@ -2816,46 +3237,72 @@ function DateRangePicker({
             CalendarMonth,
             {
               month: rightMonth,
-              range: draft,
-              hoverDate,
-              onDayClick: handleDayClick,
-              onDayHover: setHoverDate,
-              onNextMonth: () => setLeftMonth(dateFns.addMonths(leftMonth, 1)),
+              range: picker.draft,
+              hoverDate: picker.hoverDate,
+              onDayClick: picker.handleDayClick,
+              onDayHover: picker.setHoverDate,
+              onNextMonth: () => picker.setViewMonth(dateFns.addMonths(picker.viewMonth, 1)),
               showPrevNav: false,
               showNextNav: true
             }
           )
         ] }),
-        showTimePicker && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, children: timeVisible && /* @__PURE__ */ jsxRuntime.jsx(
+        showTimePicker && /* @__PURE__ */ jsxRuntime.jsx(
           framerMotion.motion.div,
           {
-            initial: { height: 0, opacity: 0 },
-            animate: { height: "auto", opacity: 1 },
-            exit: { height: 0, opacity: 0 },
-            transition: {
-              height: { type: "spring", stiffness: 400, damping: 30, mass: 0.8 },
-              opacity: { duration: 0.2 }
-            },
-            className: "overflow-hidden",
-            children: /* @__PURE__ */ jsxRuntime.jsx(
-              TimePickerRow,
+            layout: true,
+            transition: { layout: { duration: 0.2, ease: "easeInOut" } },
+            className: "border-t border-gray-100 dark:border-neutral-700",
+            children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", initial: false, children: picker.timeVisible && !picker.timeExpanded ? /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.div,
               {
-                value: currentTime,
-                onChange: handleTimeChange
-              }
-            )
-          },
-          "time-picker"
-        ) }),
+                initial: { opacity: 0 },
+                animate: { opacity: 1 },
+                exit: { opacity: 0 },
+                transition: { duration: 0.12 },
+                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-4 py-2 ", children: /* @__PURE__ */ jsxRuntime.jsx(
+                  Button,
+                  {
+                    variant: "outline",
+                    onClick: picker.expandTime,
+                    leadingDecorator: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "w-3.5 h-3.5" }),
+                    className: "w-full rounded-md h-9",
+                    children: "Add time range"
+                  }
+                ) })
+              },
+              "add-time-btn"
+            ) : picker.timeVisible && picker.timeExpanded ? /* @__PURE__ */ jsxRuntime.jsx(
+              framerMotion.motion.div,
+              {
+                initial: { opacity: 0 },
+                animate: { opacity: 1 },
+                exit: { opacity: 0 },
+                transition: { duration: 0.12 },
+                children: /* @__PURE__ */ jsxRuntime.jsx(
+                  TimePickerRow,
+                  {
+                    value: picker.draftTime,
+                    onChange: picker.handleTimeChange,
+                    onRemove: picker.resetTime,
+                    showRemove: picker.timeExpanded,
+                    onDirty: picker.markTimeDirty
+                  }
+                )
+              },
+              "time-picker"
+            ) : null })
+          }
+        ),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2 px-4 py-3 border-t border-gray-100 dark:border-neutral-700", children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             "button",
             {
-              onClick: handleClear,
-              disabled: !canClear,
-              className: chunk23BJPJOK_js.cn(
+              onClick: picker.handleClear,
+              disabled: !picker.canClear,
+              className: chunkD2BLWOWK_js.cn(
                 "px-3 py-1.5 rounded-md text-sm transition-colors",
-                canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
+                picker.canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
               ),
               children: "Clear"
             }
@@ -2863,11 +3310,11 @@ function DateRangePicker({
           /* @__PURE__ */ jsxRuntime.jsx(
             "button",
             {
-              onClick: handleApply,
-              disabled: !canApply,
-              className: chunk23BJPJOK_js.cn(
+              onClick: picker.handleApply,
+              disabled: !picker.canApply,
+              className: chunkD2BLWOWK_js.cn(
                 "px-3 py-1.5 rounded-md text-sm font-medium transition-colors",
-                canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
+                picker.canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
               ),
               children: "Apply"
             }
@@ -2877,30 +3324,6 @@ function DateRangePicker({
     ] }) })
   ] });
 }
-function formatTime2(tv) {
-  if (tv.hour === null || tv.minute === null) return "";
-  const period = tv.hour >= 12 ? "PM" : "AM";
-  const h = tv.hour % 12 || 12;
-  const m = tv.minute.toString().padStart(2, "0");
-  return `${h}:${m} ${period}`;
-}
-function formatDateWithTime(date, dateFmt, time) {
-  const dateStr = dateFns.format(date, dateFmt);
-  const timeStr = time ? formatTime2(time) : "";
-  return timeStr ? `${dateStr}, ${timeStr}` : dateStr;
-}
-function formatDateRange2(range, placeholder, time) {
-  if (!range?.from) return placeholder;
-  const hasTime = time && time.from.hour !== null && time.to.hour !== null;
-  if (!range.to || dateFns.isSameDay(range.from, range.to)) {
-    return formatDateWithTime(range.from, "MMMM d, yyyy", hasTime ? time.from : void 0);
-  }
-  const sameYear = range.from.getFullYear() === range.to.getFullYear();
-  const fromFmt = sameYear ? "MMMM d" : "MMMM d, yyyy";
-  const fromStr = formatDateWithTime(range.from, fromFmt, hasTime ? time.from : void 0);
-  const toStr = formatDateWithTime(range.to, "MMMM d, yyyy", hasTime ? time.to : void 0);
-  return `${fromStr} \u2013 ${toStr}`;
-}
 function DateRangePickerMobile({
   label,
   value,
@@ -2914,103 +3337,49 @@ function DateRangePickerMobile({
   timeValue,
   onTimeChange
 }) {
-  const [open, setOpen] = React10__namespace.useState(false);
-  const [internalRange, setInternalRange] = React10__namespace.useState({
-    from: void 0,
-    to: void 0
+  const picker = useDateRangePicker({
+    value,
+    onChange,
+    showTimePicker,
+    timeValue,
+    onTimeChange
   });
-  const [draft, setDraft] = React10__namespace.useState({
-    from: void 0,
-    to: void 0
-  });
-  const [hoverDate, setHoverDate] = React10__namespace.useState();
-  const [viewMonth, setViewMonth] = React10__namespace.useState(
-    () => dateFns.startOfMonth(value?.from ?? /* @__PURE__ */ new Date())
-  );
-  const [activePreset, setActivePreset] = React10__namespace.useState();
-  const [internalTime, setInternalTime] = React10__namespace.useState(DEFAULT_TIME_RANGE);
-  const committedRange = value ?? internalRange;
-  const currentTime = timeValue ?? internalTime;
-  const handleTimeChange = (newTime) => {
-    if (onTimeChange) onTimeChange(newTime);
-    else setInternalTime(newTime);
-  };
-  const timeVisible = !!(draft.from && draft.to);
-  const handleOpenChange = (newOpen) => {
-    if (newOpen) {
-      setDraft(committedRange);
-      if (committedRange.from) setViewMonth(dateFns.startOfMonth(committedRange.from));
-      if (!onTimeChange) setInternalTime(currentTime);
-    }
-    setOpen(newOpen);
-  };
-  const handleDayClick = (date) => {
-    const { from, to } = draft;
-    if (!from || from && to) {
-      setDraft({ from: date, to: void 0 });
-      setActivePreset(void 0);
-      return;
-    }
-    const [start, end] = dateFns.isBefore(from, date) ? [from, date] : [date, from];
-    setDraft({ from: start, to: end });
-    setHoverDate(void 0);
-  };
-  const handlePreset = (preset) => {
-    const newRange = preset.getRange();
-    setDraft(newRange);
-    setActivePreset(preset.label);
-    if (newRange.from) setViewMonth(dateFns.startOfMonth(newRange.from));
-  };
-  const handleApply = () => {
-    if (draft.from && !draft.to) return;
-    const newRange = draft.from && draft.to ? draft : void 0;
-    if (onChange) onChange(newRange);
-    else setInternalRange(newRange ?? { from: void 0, to: void 0 });
-    setOpen(false);
-  };
-  const handleClear = () => {
-    setDraft({ from: void 0, to: void 0 });
-    setActivePreset(void 0);
-    if (showTimePicker) handleTimeChange(DEFAULT_TIME_RANGE);
-  };
-  const canClear = !!(draft.from || committedRange.from);
-  const canApply = !(draft.from && !draft.to) && !!(draft.from || committedRange.from);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunk23BJPJOK_js.cn("space-y-1.5", className), children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx(chunk23BJPJOK_js.Label, { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: label }),
-    /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkD2BLWOWK_js.cn("space-y-1.5", className), children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(chunkD2BLWOWK_js.Label, { className: "text-sm font-medium text-gray-900 dark:text-gray-100", children: label }),
+    /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: picker.open, onOpenChange: picker.handleOpenChange, children: [
       /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
         "button",
         {
           disabled,
-          className: chunk23BJPJOK_js.cn(
+          className: chunkD2BLWOWK_js.cn(
             "inline-flex w-full items-center gap-2 rounded-md border border-gray-300 bg-white px-3 py-2 text-sm shadow-sm transition-colors",
             "hover:bg-gray-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2",
             "dark:border-neutral-600 dark:bg-neutral-800 dark:hover:bg-neutral-700",
             "disabled:pointer-events-none disabled:opacity-50",
-            committedRange.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500"
+            picker.committedRange.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500"
           ),
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "w-4 h-4 shrink-0 text-gray-400 dark:text-gray-500" }),
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: formatDateRange2(
-              committedRange,
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate", children: formatDateRange(
+              picker.committedRange,
               placeholder,
-              showTimePicker ? currentTime : void 0
+              showTimePicker ? picker.committedTime : void 0
             ) })
           ]
         }
       ) }),
       /* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { align: "center", className: "w-auto p-0 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex divide-x divide-gray-100 dark:divide-neutral-700", children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col p-2 gap-0.5 min-w-[110px] max-h-[360px] overflow-y-auto", children: (presetSections ?? [{ title: "Presets", options: presets }]).map(
-          (section, si) => /* @__PURE__ */ jsxRuntime.jsxs(React10__namespace.Fragment, { children: [
+          (section, si) => /* @__PURE__ */ jsxRuntime.jsxs(React11__namespace.Fragment, { children: [
             si > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "my-2 border-t border-gray-100 dark:border-neutral-700" }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-semibold text-gray-400 dark:text-gray-500 uppercase tracking-wider mb-1 px-2", children: section.title }),
             section.options.map((preset) => /* @__PURE__ */ jsxRuntime.jsx(
               "button",
               {
-                onClick: () => handlePreset(preset),
-                className: chunk23BJPJOK_js.cn(
+                onClick: () => picker.handlePreset(preset),
+                className: chunkD2BLWOWK_js.cn(
                   "w-full text-left px-2 py-1.5 rounded-md text-sm transition-colors",
-                  activePreset === preset.label ? "bg-blue-50 text-blue-600 font-medium dark:bg-blue-950/50 dark:text-blue-400" : "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700"
+                  picker.activePreset === preset.label ? "bg-blue-50 text-blue-600 font-medium dark:bg-blue-950/50 dark:text-blue-400" : "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700"
                 ),
                 children: preset.label
               },
@@ -3022,52 +3391,73 @@ function DateRangePickerMobile({
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-2", children: /* @__PURE__ */ jsxRuntime.jsx(
             CalendarMonth,
             {
-              month: viewMonth,
-              range: draft,
-              hoverDate,
-              onDayClick: handleDayClick,
-              onDayHover: setHoverDate,
-              onPrevMonth: () => setViewMonth(dateFns.subMonths(viewMonth, 1)),
-              onNextMonth: () => setViewMonth(dateFns.addMonths(viewMonth, 1)),
+              month: picker.viewMonth,
+              range: picker.draft,
+              hoverDate: picker.hoverDate,
+              onDayClick: picker.handleDayClick,
+              onDayHover: picker.setHoverDate,
+              onPrevMonth: () => picker.setViewMonth(dateFns.subMonths(picker.viewMonth, 1)),
+              onNextMonth: () => picker.setViewMonth(dateFns.addMonths(picker.viewMonth, 1)),
               showPrevNav: true,
               showNextNav: true
             }
           ) }),
-          showTimePicker && /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { initial: false, children: timeVisible && /* @__PURE__ */ jsxRuntime.jsx(
+          showTimePicker && /* @__PURE__ */ jsxRuntime.jsx(
             framerMotion.motion.div,
             {
-              initial: { height: 0, opacity: 0 },
-              animate: { height: "auto", opacity: 1 },
-              exit: { height: 0, opacity: 0 },
-              transition: {
-                height: {
-                  type: "spring",
-                  stiffness: 400,
-                  damping: 30,
-                  mass: 0.8
+              layout: true,
+              transition: { layout: { duration: 0.2, ease: "easeInOut" } },
+              className: "border-t border-gray-100 dark:border-neutral-700",
+              children: /* @__PURE__ */ jsxRuntime.jsx(framerMotion.AnimatePresence, { mode: "wait", initial: false, children: picker.timeVisible && !picker.timeExpanded ? /* @__PURE__ */ jsxRuntime.jsx(
+                framerMotion.motion.div,
+                {
+                  initial: { opacity: 0 },
+                  animate: { opacity: 1 },
+                  exit: { opacity: 0 },
+                  transition: { duration: 0.12 },
+                  children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-2", children: /* @__PURE__ */ jsxRuntime.jsx(
+                    Button,
+                    {
+                      variant: "outline",
+                      onClick: picker.expandTime,
+                      leadingDecorator: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "w-3.5 h-3.5" }),
+                      className: "w-full rounded-md h-9",
+                      children: "Add time range"
+                    }
+                  ) })
                 },
-                opacity: { duration: 0.2 }
-              },
-              className: "overflow-hidden",
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                TimePickerColumn,
+                "add-time-btn"
+              ) : picker.timeVisible && picker.timeExpanded ? /* @__PURE__ */ jsxRuntime.jsx(
+                framerMotion.motion.div,
                 {
-                  value: currentTime,
-                  onChange: handleTimeChange
-                }
-              )
-            },
-            "time-picker"
-          ) }),
+                  initial: { opacity: 0 },
+                  animate: { opacity: 1 },
+                  exit: { opacity: 0 },
+                  transition: { duration: 0.12 },
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    TimePickerColumn,
+                    {
+                      value: picker.draftTime,
+                      onChange: picker.handleTimeChange,
+                      onRemove: picker.resetTime,
+                      showRemove: picker.timeExpanded,
+                      onDirty: picker.markTimeDirty
+                    }
+                  )
+                },
+                "time-picker"
+              ) : null })
+            }
+          ),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2 px-2 py-3 border-t border-gray-100 dark:border-neutral-700", children: [
             /* @__PURE__ */ jsxRuntime.jsx(
               "button",
               {
-                onClick: handleClear,
-                disabled: !canClear,
-                className: chunk23BJPJOK_js.cn(
+                onClick: picker.handleClear,
+                disabled: !picker.canClear,
+                className: chunkD2BLWOWK_js.cn(
                   "px-3 py-1.5 rounded-md text-sm transition-colors",
-                  canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
+                  picker.canClear ? "text-gray-600 hover:bg-gray-100 dark:text-gray-300 dark:hover:bg-neutral-700" : "text-gray-300 dark:text-gray-600 cursor-not-allowed"
                 ),
                 children: "Clear"
               }
@@ -3075,11 +3465,11 @@ function DateRangePickerMobile({
             /* @__PURE__ */ jsxRuntime.jsx(
               "button",
               {
-                onClick: handleApply,
-                disabled: !canApply,
-                className: chunk23BJPJOK_js.cn(
+                onClick: picker.handleApply,
+                disabled: !picker.canApply,
+                className: chunkD2BLWOWK_js.cn(
                   "px-3 py-1.5 rounded-md text-sm font-medium transition-colors",
-                  canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
+                  picker.canApply ? "bg-blue-600 text-white hover:bg-blue-700 dark:hover:bg-blue-500" : "bg-blue-100 text-blue-300 cursor-not-allowed dark:bg-blue-950/30 dark:text-blue-800"
                 ),
                 children: "Apply"
               }
@@ -3117,7 +3507,7 @@ function MobileDataCard({
     image && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-shrink-0", children: image }),
     /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0 flex-1 space-y-2", children: [
       /* @__PURE__ */ jsxRuntime.jsx(
-        chunk23BJPJOK_js.Text,
+        chunkD2BLWOWK_js.Text,
         {
           size: "sm",
           weight: "semibold",
@@ -3125,7 +3515,7 @@ function MobileDataCard({
           children: title
         }
       ),
-      subtitle && /* @__PURE__ */ jsxRuntime.jsx(chunk23BJPJOK_js.Text, { size: "xs", className: "text-neutral-400 dark:text-neutral-500", children: subtitle }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx(chunkD2BLWOWK_js.Text, { size: "xs", className: "text-neutral-400 dark:text-neutral-500", children: subtitle }),
       contentRows && contentRows.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-x-4 gap-y-1 text-xs", children: contentRows.map((row) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "truncate", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-neutral-400 dark:text-neutral-500", children: [
           row.label,
@@ -3142,7 +3532,7 @@ function MobileDataCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
-      className: chunk23BJPJOK_js.cn(
+      className: chunkD2BLWOWK_js.cn(
         "overflow-hidden rounded-lg border transition-colors",
         isSelected ? "border-blue-500 bg-blue-50/50 dark:border-blue-400 dark:bg-blue-900/10" : "border-neutral-200 bg-white dark:border-neutral-700 dark:bg-neutral-800/30",
         className
@@ -3172,11 +3562,11 @@ function MobileDataCard({
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(
-                chunk23BJPJOK_js.Text,
+                chunkD2BLWOWK_js.Text,
                 {
                   size: "xs",
                   as: "span",
-                  className: chunk23BJPJOK_js.cn(
+                  className: chunkD2BLWOWK_js.cn(
                     isSelected ? "font-medium text-blue-600 dark:text-blue-400" : "text-neutral-400 dark:text-neutral-500"
                   ),
                   children: isSelected ? "Selected" : "Select"
@@ -3195,13 +3585,13 @@ function MobileDataCard({
             children: contentBody
           }
         ) : contentBody,
-        statsRenderer ?? (stats && stats.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunk23BJPJOK_js.cn("grid gap-1.5 px-3 pb-3", colsClass[cols]), children: stats.map((stat) => /* @__PURE__ */ jsxRuntime.jsxs(
+        statsRenderer ?? (stats && stats.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkD2BLWOWK_js.cn("grid gap-1.5 px-3 pb-3", colsClass[cols]), children: stats.map((stat) => /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
             className: "flex flex-col items-center rounded-md bg-neutral-100 py-1.5 dark:bg-neutral-800",
             children: [
               /* @__PURE__ */ jsxRuntime.jsx(
-                chunk23BJPJOK_js.Text,
+                chunkD2BLWOWK_js.Text,
                 {
                   size: "xs",
                   as: "span",
@@ -3210,12 +3600,12 @@ function MobileDataCard({
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsx(
-                chunk23BJPJOK_js.Text,
+                chunkD2BLWOWK_js.Text,
                 {
                   size: "sm",
                   weight: "semibold",
                   as: "span",
-                  className: chunk23BJPJOK_js.cn(
+                  className: chunkD2BLWOWK_js.cn(
                     "mt-0.5 tabular-nums",
                     stat.className ?? "text-neutral-800 dark:text-neutral-200"
                   ),
@@ -3234,7 +3624,7 @@ function MobileDataCard({
               className: "flex items-center justify-between",
               children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
-                  chunk23BJPJOK_js.Text,
+                  chunkD2BLWOWK_js.Text,
                   {
                     size: "xs",
                     as: "span",
@@ -3243,7 +3633,7 @@ function MobileDataCard({
                   }
                 ),
                 detail.pill ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-flex items-center rounded-full bg-blue-50 px-2 py-0.5 dark:bg-blue-900/30", children: /* @__PURE__ */ jsxRuntime.jsx(
-                  chunk23BJPJOK_js.Text,
+                  chunkD2BLWOWK_js.Text,
                   {
                     size: "xs",
                     weight: "medium",
@@ -3391,6 +3781,7 @@ exports.PopoverContent = PopoverContent;
 exports.PopoverTrigger = PopoverTrigger;
 exports.SegmentedControl = SegmentedControl;
 exports.Select = Select;
+exports.SelectBar = SelectBar;
 exports.SelectContent = SelectContent;
 exports.SelectGroup = SelectGroup;
 exports.SelectItem = SelectItem;
@@ -3443,5 +3834,5 @@ exports.useColumnVisibility = useColumnVisibility;
 exports.useFormContext = useFormContext;
 exports.useFormFieldContext = useFormFieldContext;
 exports.useTableSelection = useTableSelection;
-//# sourceMappingURL=chunk-H7KYKSHC.js.map
-//# sourceMappingURL=chunk-H7KYKSHC.js.map
+//# sourceMappingURL=chunk-HKUYZ5K6.js.map
+//# sourceMappingURL=chunk-HKUYZ5K6.js.map