@pos-360/horizon 0.26.0 → 0.27.1

package/dist/{chunk-54W4CEU5.mjs → chunk-2LATCE3V.mjs}

@@ -5,7 +5,7 @@ import { Slot } from '@radix-ui/react-slot';
 import { cva } from 'class-variance-authority';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
-import { Check, X, ChevronRight, Circle, ChevronDown, ChevronUp, Search, PenLine, SlidersHorizontal, CalendarIcon, ChevronLeft } from 'lucide-react';
+import { Check, X, ChevronRight, Circle, ChevronDown, ChevronUp, Search, Minus, PenLine, SlidersHorizontal, CalendarIcon, ChevronLeft } from 'lucide-react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import * as PopoverPrimitive from '@radix-ui/react-popover';
@@ -139,7 +139,7 @@ var CardFooter = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardFooter.displayName = "CardFooter";
-var Checkbox = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Checkbox = React10.forwardRef(({ className, indicatorIcon, ...props }, ref) => /* @__PURE__ */ jsx(
   CheckboxPrimitive.Root,
   {
     ref,
@@ -152,7 +152,7 @@ var Checkbox = React10.forwardRef(({ className, ...props }, ref) => /* @__PURE__
       CheckboxPrimitive.Indicator,
       {
         className: cn("flex items-center justify-center text-current"),
-        children: /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5", strokeWidth: 3 })
+        children: indicatorIcon ?? /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5", strokeWidth: 3 })
       }
     )
   }
@@ -1559,7 +1559,7 @@ var TableSelectAll = React10.forwardRef(({ className, ...props }, ref) => {
     return null;
   }
   const handleCheckedChange = (checked) => {
-    if (checked) {
+    if (checked === true) {
       context.selectAll();
     } else {
       context.deselectAll();
@@ -1571,7 +1571,8 @@ var TableSelectAll = React10.forwardRef(({ className, ...props }, ref) => {
       checked: context.isAllSelected,
       onCheckedChange: handleCheckedChange,
       "aria-label": "Select all rows",
-      ...context.isSomeSelected && { "data-state": "indeterminate" }
+      indicatorIcon: /* @__PURE__ */ jsx(Minus, { className: "h-3.5 w-3.5", strokeWidth: 3 }),
+      className: "data-[state=checked]:bg-white data-[state=checked]:border-blue-600 data-[state=checked]:text-blue-600 dark:data-[state=checked]:bg-white"
     }
   ) });
 });
@@ -2271,27 +2272,33 @@ function DateRangePicker({
     from: void 0,
     to: void 0
   });
+  const [draft, setDraft] = React10.useState({
+    from: void 0,
+    to: void 0
+  });
   const [hoverDate, setHoverDate] = React10.useState();
   const [leftMonth, setLeftMonth] = React10.useState(
     () => startOfMonth(value?.from ?? /* @__PURE__ */ new Date())
   );
   const [activePreset, setActivePreset] = React10.useState();
-  const range = value ?? internalRange;
+  const committedRange = value ?? internalRange;
+  const handleOpenChange = (newOpen) => {
+    if (newOpen) {
+      setDraft(committedRange);
+      if (committedRange.from) setLeftMonth(startOfMonth(committedRange.from));
+    }
+    setOpen(newOpen);
+  };
   const handleDayClick = (date) => {
-    const { from, to } = range;
+    const { from, to } = draft;
     if (!from || from && to) {
-      const newRange2 = { from: date, to: void 0 };
+      setDraft({ from: date, to: void 0 });
       setActivePreset(void 0);
-      if (onChange) onChange(newRange2);
-      else setInternalRange(newRange2);
       return;
     }
     const [start, end] = isBefore(from, date) ? [from, date] : [date, from];
-    const newRange = { from: start, to: end };
-    if (onChange) onChange(newRange);
-    else setInternalRange(newRange);
+    setDraft({ from: start, to: end });
     setHoverDate(void 0);
-    setOpen(false);
   };
   const handlePreset = (preset) => {
     const newRange = preset.getRange();
@@ -2301,8 +2308,21 @@ function DateRangePicker({
     if (newRange.from) setLeftMonth(startOfMonth(newRange.from));
     setOpen(false);
   };
+  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);
+  };
+  const canClear = !!(draft.from || committedRange.from);
+  const canApply = !(draft.from && !draft.to) && !!(draft.from || committedRange.from);
   const rightMonth = addMonths(leftMonth, 1);
-  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: setOpen, children: [
+  return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
     /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
       "button",
       {
@@ -2312,12 +2332,12 @@ function DateRangePicker({
           "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",
-          range.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500",
+          committedRange.from ? "text-gray-900 dark:text-gray-100" : "text-gray-400 dark:text-gray-500",
           className
         ),
         children: [
           /* @__PURE__ */ jsx(CalendarIcon, { className: "w-4 h-4 shrink-0 text-gray-400 dark:text-gray-500" }),
-          /* @__PURE__ */ jsx("span", { children: formatDateRange(range, placeholder) })
+          /* @__PURE__ */ jsx("span", { children: formatDateRange(committedRange, placeholder) })
         ]
       }
     ) }),
@@ -2338,34 +2358,62 @@ function DateRangePicker({
           preset.label
         ))
       ] }, section.title)) }),
-      /* @__PURE__ */ jsxs("div", { className: "flex gap-4 p-4", children: [
-        /* @__PURE__ */ jsx(
-          CalendarMonth,
-          {
-            month: leftMonth,
-            range,
-            hoverDate,
-            onDayClick: handleDayClick,
-            onDayHover: setHoverDate,
-            onPrevMonth: () => setLeftMonth(subMonths(leftMonth, 1)),
-            showPrevNav: true,
-            showNextNav: false
-          }
-        ),
-        /* @__PURE__ */ jsx("div", { className: "w-px bg-gray-100 dark:bg-neutral-700 self-stretch" }),
-        /* @__PURE__ */ jsx(
-          CalendarMonth,
-          {
-            month: rightMonth,
-            range,
-            hoverDate,
-            onDayClick: handleDayClick,
-            onDayHover: setHoverDate,
-            onNextMonth: () => setLeftMonth(addMonths(leftMonth, 1)),
-            showPrevNav: false,
-            showNextNav: true
-          }
-        )
+      /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex gap-4 p-4", children: [
+          /* @__PURE__ */ jsx(
+            CalendarMonth,
+            {
+              month: leftMonth,
+              range: draft,
+              hoverDate,
+              onDayClick: handleDayClick,
+              onDayHover: setHoverDate,
+              onPrevMonth: () => setLeftMonth(subMonths(leftMonth, 1)),
+              showPrevNav: true,
+              showNextNav: false
+            }
+          ),
+          /* @__PURE__ */ jsx("div", { className: "w-px bg-gray-100 dark:bg-neutral-700 self-stretch" }),
+          /* @__PURE__ */ jsx(
+            CalendarMonth,
+            {
+              month: rightMonth,
+              range: draft,
+              hoverDate,
+              onDayClick: handleDayClick,
+              onDayHover: setHoverDate,
+              onNextMonth: () => setLeftMonth(addMonths(leftMonth, 1)),
+              showPrevNav: false,
+              showNextNav: true
+            }
+          )
+        ] }),
+        /* @__PURE__ */ 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__ */ jsx(
+            "button",
+            {
+              onClick: handleClear,
+              disabled: !canClear,
+              className: 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__ */ jsx(
+            "button",
+            {
+              onClick: handleApply,
+              disabled: !canApply,
+              className: 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"
+            }
+          )
+        ] })
       ] })
     ] }) })
   ] });
@@ -2447,5 +2495,5 @@ function PeriodComparisonSelector({
 }
 
 export { Button, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColumnSelection, DEFAULT_COMPARISON_PERIODS, DEFAULT_PRESETS, DateRangePicker, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Form, FormControl, FormDescription, FormField, FormLabel, FormMessage, PeriodComparisonSelector, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, SegmentedControl, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator3 as Separator, Skeleton, SkeletonAvatar, SkeletonBadge, SkeletonButton, SkeletonCard, SkeletonIcon, SkeletonInput, SkeletonSubtitle, SkeletonTableRow, SkeletonTableRows, SkeletonText, SkeletonTitle, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, TableRowCheckbox, TableSelectAll, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toggle, buttonVariants, segmentedControlItemVariants, segmentedControlVariants, separatorVariants, switchLabelVariants, switchThumbVariants, switchTrackVariants, toggleGroupVariants, toggleItemVariants, useColumnVisibility, useFormContext, useFormFieldContext, useTableSelection };
-//# sourceMappingURL=chunk-54W4CEU5.mjs.map
-//# sourceMappingURL=chunk-54W4CEU5.mjs.map
+//# sourceMappingURL=chunk-2LATCE3V.mjs.map
+//# sourceMappingURL=chunk-2LATCE3V.mjs.map