@postxl/ui-components 1.4.2 → 1.5.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -2,6 +2,13 @@ import { clsx } from "clsx";
2
2
  import { twMerge } from "tailwind-merge";
3
3
  import * as AccordionPrimitive from "@radix-ui/react-accordion";
4
4
  import { ArrowLeftIcon, ArrowRightIcon, CalendarIcon, CaretSortIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CircleIcon, Cross1Icon, Cross2Icon, DotFilledIcon, DotsHorizontalIcon, DoubleArrowLeftIcon, DoubleArrowRightIcon, DragHandleDots2Icon, EnterFullScreenIcon, MagnifyingGlassIcon } from "@radix-ui/react-icons";
5
+ import * as React$59 from "react";
6
+ import * as React$58 from "react";
7
+ import * as React$57 from "react";
8
+ import * as React$56 from "react";
9
+ import * as React$55 from "react";
10
+ import * as React$54 from "react";
11
+ import * as React$53 from "react";
5
12
  import * as React$52 from "react";
6
13
  import * as React$51 from "react";
7
14
  import * as React$50 from "react";
@@ -63,7 +70,7 @@ import * as AvatarPrimitive from "@radix-ui/react-avatar";
63
70
  import { DayPicker, getDefaultClassNames } from "react-day-picker";
64
71
  import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
65
72
  import useEmblaCarousel from "embla-carousel-react";
66
- import { BaselineIcon, BookmarkIcon, CalendarIcon as CalendarIcon$1, CheckIcon as CheckIcon$1, CheckSquareIcon, ChevronDownIcon as ChevronDownIcon$1, ChevronRightIcon as ChevronRightIcon$1, ChevronUpIcon as ChevronUpIcon$1, CircleCheckIcon, CopyIcon, EraserIcon, EyeIcon, EyeOffIcon, FilterX, GlobeIcon, GripHorizontalIcon, HashIcon, ListChecksIcon, ListIcon, ListTreeIcon, MessageSquareIcon, MinusIcon, PanelLeftIcon, PencilIcon, PinIcon, PinOffIcon, PlusIcon, SaveIcon, Settings2Icon, SquareIcon, TagIcon, TextInitialIcon, Trash2Icon, TrashIcon, XIcon } from "lucide-react";
73
+ import { BaselineIcon, BookmarkIcon, CalendarIcon as CalendarIcon$1, Check, CheckIcon as CheckIcon$1, CheckSquareIcon, ChevronDownIcon as ChevronDownIcon$1, ChevronRightIcon as ChevronRightIcon$1, ChevronUpIcon as ChevronUpIcon$1, CircleCheckIcon, CopyIcon, DownloadIcon, EraserIcon, EyeIcon, EyeOffIcon, FilterX, GlobeIcon, GripHorizontalIcon, HashIcon, ListChecksIcon, ListIcon, ListTreeIcon, MessageSquareIcon, MinusIcon, PanelLeftIcon, PanelRightIcon, PencilIcon, PinIcon, PinOffIcon, PlusIcon, SaveIcon, Settings2Icon, SquareIcon, TagIcon, TextInitialIcon, Trash2Icon, TrashIcon, XIcon } from "lucide-react";
67
74
  import * as CollapsePrimitive from "@radix-ui/react-collapsible";
68
75
  import { Command as Command$1 } from "cmdk";
69
76
  import * as DialogPrimitive from "@radix-ui/react-dialog";
@@ -90,6 +97,7 @@ import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
90
97
  import * as ResizablePrimitive from "react-resizable-panels";
91
98
  import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
92
99
  import * as SliderPrimitive from "@radix-ui/react-slider";
100
+ import { useDirection } from "@radix-ui/react-direction";
93
101
  import * as SwitchPrimitives from "@radix-ui/react-switch";
94
102
  import * as TabsPrimitive from "@radix-ui/react-tabs";
95
103
  import * as TogglePrimitive from "@radix-ui/react-toggle";
@@ -118,13 +126,13 @@ function testId(baseId, suffix) {
118
126
  //#endregion
119
127
  //#region src/accordion/accordion.tsx
120
128
  const Accordion = AccordionPrimitive.Root;
121
- const AccordionItem = React$52.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Item, {
129
+ const AccordionItem = React$59.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Item, {
122
130
  ref,
123
131
  className: cn("border-b", className),
124
132
  ...props
125
133
  }));
126
134
  AccordionItem.displayName = "AccordionItem";
127
- const AccordionTrigger = React$52.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, {
135
+ const AccordionTrigger = React$59.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, {
128
136
  className: "flex",
129
137
  children: /* @__PURE__ */ jsxs(AccordionPrimitive.Trigger, {
130
138
  ref,
@@ -134,7 +142,7 @@ const AccordionTrigger = React$52.forwardRef(({ className, children,...props },
134
142
  })
135
143
  }));
136
144
  AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
137
- const AccordionContent = React$52.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Content, {
145
+ const AccordionContent = React$59.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Content, {
138
146
  ref,
139
147
  className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
140
148
  ...props,
@@ -154,21 +162,21 @@ const alertVariants = cva("relative w-full rounded-lg border px-4 py-3 text-sm [
154
162
  } },
155
163
  defaultVariants: { variant: "default" }
156
164
  });
157
- const Alert = React$51.forwardRef(({ className, variant,...props }, ref) => /* @__PURE__ */ jsx("div", {
165
+ const Alert = React$58.forwardRef(({ className, variant,...props }, ref) => /* @__PURE__ */ jsx("div", {
158
166
  ref,
159
167
  role: "alert",
160
168
  className: cn(alertVariants({ variant }), className),
161
169
  ...props
162
170
  }));
163
171
  Alert.displayName = "Alert";
164
- const AlertTitle = React$51.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h5", {
172
+ const AlertTitle = React$58.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h5", {
165
173
  ref,
166
174
  className: cn("mb-1 font-medium leading-none tracking-tight", className),
167
175
  ...props,
168
176
  children
169
177
  }));
170
178
  AlertTitle.displayName = "AlertTitle";
171
- const AlertDescription = React$51.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
179
+ const AlertDescription = React$58.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
172
180
  ref,
173
181
  className: cn("text-sm [&_p]:leading-relaxed", className),
174
182
  ...props
@@ -228,13 +236,13 @@ function Button({ className, variant, size, asChild = false, __e2e_test_id__,...
228
236
  const AlertDialog = AlertDialogPrimitive.Root;
229
237
  const AlertDialogTrigger = AlertDialogPrimitive.Trigger;
230
238
  const AlertDialogPortal = AlertDialogPrimitive.Portal;
231
- const AlertDialogOverlay = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Overlay, {
239
+ const AlertDialogOverlay = React$57.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Overlay, {
232
240
  className: 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),
233
241
  ...props,
234
242
  ref
235
243
  }));
236
244
  AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
237
- const AlertDialogContent = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialogPrimitive.Content, {
245
+ const AlertDialogContent = React$57.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialogPrimitive.Content, {
238
246
  ref,
239
247
  className: cn("fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-lg", className),
240
248
  ...props
@@ -250,25 +258,25 @@ const AlertDialogFooter = ({ className,...props }) => /* @__PURE__ */ jsx("div",
250
258
  ...props
251
259
  });
252
260
  AlertDialogFooter.displayName = "AlertDialogFooter";
253
- const AlertDialogTitle = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Title, {
261
+ const AlertDialogTitle = React$57.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Title, {
254
262
  ref,
255
263
  className: cn("text-lg font-semibold", className),
256
264
  ...props
257
265
  }));
258
266
  AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
259
- const AlertDialogDescription = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Description, {
267
+ const AlertDialogDescription = React$57.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Description, {
260
268
  ref,
261
269
  className: cn("text-sm text-muted-foreground", className),
262
270
  ...props
263
271
  }));
264
272
  AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
265
- const AlertDialogAction = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Action, {
273
+ const AlertDialogAction = React$57.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Action, {
266
274
  ref,
267
275
  className: cn(buttonVariants(), className),
268
276
  ...props
269
277
  }));
270
278
  AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
271
- const AlertDialogCancel = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Cancel, {
279
+ const AlertDialogCancel = React$57.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Cancel, {
272
280
  ref,
273
281
  className: cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className),
274
282
  ...props
@@ -277,19 +285,19 @@ AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
277
285
 
278
286
  //#endregion
279
287
  //#region src/avatar/avatar.tsx
280
- const Avatar = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Root, {
288
+ const Avatar = React$56.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Root, {
281
289
  ref,
282
290
  className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className),
283
291
  ...props
284
292
  }));
285
293
  Avatar.displayName = AvatarPrimitive.Root.displayName;
286
- const AvatarImage = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Image, {
294
+ const AvatarImage = React$56.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Image, {
287
295
  ref,
288
296
  className: cn("aspect-square h-full w-full", className),
289
297
  ...props
290
298
  }));
291
299
  AvatarImage.displayName = AvatarPrimitive.Image.displayName;
292
- const AvatarFallback = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Fallback, {
300
+ const AvatarFallback = React$56.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Fallback, {
293
301
  ref,
294
302
  className: cn("flex h-full w-full items-center justify-center rounded-full bg-muted", className),
295
303
  ...props
@@ -335,25 +343,25 @@ function Badge({ className, variant, size, asChild = false,...props }) {
335
343
 
336
344
  //#endregion
337
345
  //#region src/breadcrumb/breadcrumb.tsx
338
- const Breadcrumb = React$48.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("nav", {
346
+ const Breadcrumb = React$55.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("nav", {
339
347
  ref,
340
348
  "aria-label": "breadcrumb",
341
349
  ...props
342
350
  }));
343
351
  Breadcrumb.displayName = "Breadcrumb";
344
- const BreadcrumbList = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ol", {
352
+ const BreadcrumbList = React$55.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ol", {
345
353
  ref,
346
354
  className: cn("flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5", className),
347
355
  ...props
348
356
  }));
349
357
  BreadcrumbList.displayName = "BreadcrumbList";
350
- const BreadcrumbItem = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
358
+ const BreadcrumbItem = React$55.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
351
359
  ref,
352
360
  className: cn("inline-flex items-center gap-1.5", className),
353
361
  ...props
354
362
  }));
355
363
  BreadcrumbItem.displayName = "BreadcrumbItem";
356
- const BreadcrumbLink = React$48.forwardRef(({ asChild, className,...props }, ref) => {
364
+ const BreadcrumbLink = React$55.forwardRef(({ asChild, className,...props }, ref) => {
357
365
  const Comp = asChild ? Slot : "a";
358
366
  return /* @__PURE__ */ jsx(Comp, {
359
367
  ref,
@@ -362,7 +370,7 @@ const BreadcrumbLink = React$48.forwardRef(({ asChild, className,...props }, ref
362
370
  });
363
371
  });
364
372
  BreadcrumbLink.displayName = "BreadcrumbLink";
365
- const BreadcrumbPage = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("span", {
373
+ const BreadcrumbPage = React$55.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("span", {
366
374
  ref,
367
375
  "aria-disabled": "true",
368
376
  "aria-current": "page",
@@ -392,8 +400,8 @@ BreadcrumbEllipsis.displayName = "BreadcrumbElipssis";
392
400
  //#region src/calendar/calendar.tsx
393
401
  function Calendar({ className, classNames, showOutsideDays = true, captionLayout = "label", buttonVariant = "ghost", showYearNavigation = false, formatters, components, __e2e_test_id__,...props }) {
394
402
  const defaultClassNames = getDefaultClassNames();
395
- const [rangeSelectionStep, setRangeSelectionStep] = React$47.useState("from");
396
- const handleDayClick = React$47.useCallback((day, modifiers, e) => {
403
+ const [rangeSelectionStep, setRangeSelectionStep] = React$54.useState("from");
404
+ const handleDayClick = React$54.useCallback((day, modifiers, e) => {
397
405
  if (props.mode === "range") {
398
406
  const range = props.selected;
399
407
  if (rangeSelectionStep === "from") {
@@ -423,8 +431,8 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
423
431
  fromMonth = props.startMonth ?? new Date(nowYear - 100, 0);
424
432
  toMonth = props.endMonth ?? new Date(nowYear + 100, 11);
425
433
  }
426
- const [currentMonth, setCurrentMonth] = React$47.useState(props.defaultMonth ?? props.month ?? new Date());
427
- React$47.useEffect(() => {
434
+ const [currentMonth, setCurrentMonth] = React$54.useState(props.defaultMonth ?? props.month ?? new Date());
435
+ React$54.useEffect(() => {
428
436
  if (props.month) setCurrentMonth(props.month);
429
437
  }, [props.month]);
430
438
  const addMonths = (date, months) => {
@@ -568,8 +576,8 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
568
576
  }
569
577
  function CalendarDayButton({ className, day, modifiers,...props }) {
570
578
  const defaultClassNames = getDefaultClassNames();
571
- const ref = React$47.useRef(null);
572
- React$47.useEffect(() => {
579
+ const ref = React$54.useRef(null);
580
+ React$54.useEffect(() => {
573
581
  if (modifiers.focused) ref.current?.focus();
574
582
  }, [modifiers.focused]);
575
583
  return /* @__PURE__ */ jsx(Button, {
@@ -588,38 +596,38 @@ function CalendarDayButton({ className, day, modifiers,...props }) {
588
596
 
589
597
  //#endregion
590
598
  //#region src/card/card.tsx
591
- const Card = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
599
+ const Card = React$53.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
592
600
  ref,
593
601
  className: cn("rounded-xl border bg-card text-card-foreground shadow", className),
594
602
  ...props
595
603
  }));
596
604
  Card.displayName = "Card";
597
- const CardHeader = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
605
+ const CardHeader = React$53.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
598
606
  ref,
599
607
  className: cn("flex flex-col space-y-1.5 p-6", className),
600
608
  ...props
601
609
  }));
602
610
  CardHeader.displayName = "CardHeader";
603
- const CardTitle = React$46.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h3", {
611
+ const CardTitle = React$53.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h3", {
604
612
  ref,
605
613
  className: cn("font-semibold leading-none tracking-tight", className),
606
614
  ...props,
607
615
  children
608
616
  }));
609
617
  CardTitle.displayName = "CardTitle";
610
- const CardDescription = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("p", {
618
+ const CardDescription = React$53.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("p", {
611
619
  ref,
612
620
  className: cn("text-sm text-muted-foreground", className),
613
621
  ...props
614
622
  }));
615
623
  CardDescription.displayName = "CardDescription";
616
- const CardContent = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
624
+ const CardContent = React$53.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
617
625
  ref,
618
626
  className: cn("p-6 pt-0", className),
619
627
  ...props
620
628
  }));
621
629
  CardContent.displayName = "CardContent";
622
- const CardFooter = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
630
+ const CardFooter = React$53.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
623
631
  ref,
624
632
  className: cn("flex items-center p-6 pt-0", className),
625
633
  ...props
@@ -630,7 +638,7 @@ CardFooter.displayName = "CardFooter";
630
638
  //#region src/card-hover/card-hover.tsx
631
639
  const HoverCard = HoverCardPrimitive.Root;
632
640
  const HoverCardTrigger = HoverCardPrimitive.Trigger;
633
- const HoverCardContent = React$45.forwardRef(({ className, align = "center", sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(HoverCardPrimitive.Content, {
641
+ const HoverCardContent = React$52.forwardRef(({ className, align = "center", sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(HoverCardPrimitive.Content, {
634
642
  ref,
635
643
  align,
636
644
  sideOffset,
@@ -641,31 +649,31 @@ HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
641
649
 
642
650
  //#endregion
643
651
  //#region src/carousel/carousel.tsx
644
- const CarouselContext = React$44.createContext(null);
652
+ const CarouselContext = React$51.createContext(null);
645
653
  function useCarousel() {
646
- const context = React$44.useContext(CarouselContext);
654
+ const context = React$51.useContext(CarouselContext);
647
655
  if (!context) throw new Error("useCarousel must be used within a <Carousel />");
648
656
  return context;
649
657
  }
650
- const Carousel = React$44.forwardRef(({ orientation = "horizontal", opts, setApi, plugins, className, children,...props }, ref) => {
658
+ const Carousel = React$51.forwardRef(({ orientation = "horizontal", opts, setApi, plugins, className, children,...props }, ref) => {
651
659
  const [carouselRef, api] = useEmblaCarousel({
652
660
  ...opts,
653
661
  axis: orientation === "horizontal" ? "x" : "y"
654
662
  }, plugins);
655
- const [canScrollPrev, setCanScrollPrev] = React$44.useState(false);
656
- const [canScrollNext, setCanScrollNext] = React$44.useState(false);
657
- const onSelect = React$44.useCallback(() => {
663
+ const [canScrollPrev, setCanScrollPrev] = React$51.useState(false);
664
+ const [canScrollNext, setCanScrollNext] = React$51.useState(false);
665
+ const onSelect = React$51.useCallback(() => {
658
666
  if (!api) return;
659
667
  setCanScrollPrev(api.canScrollPrev());
660
668
  setCanScrollNext(api.canScrollNext());
661
669
  }, [api]);
662
- const scrollPrev = React$44.useCallback(() => {
670
+ const scrollPrev = React$51.useCallback(() => {
663
671
  api?.scrollPrev();
664
672
  }, [api]);
665
- const scrollNext = React$44.useCallback(() => {
673
+ const scrollNext = React$51.useCallback(() => {
666
674
  api?.scrollNext();
667
675
  }, [api]);
668
- const handleKeyDown = React$44.useCallback((event) => {
676
+ const handleKeyDown = React$51.useCallback((event) => {
669
677
  if (event.key === "ArrowLeft") {
670
678
  event.preventDefault();
671
679
  scrollPrev();
@@ -674,11 +682,11 @@ const Carousel = React$44.forwardRef(({ orientation = "horizontal", opts, setApi
674
682
  scrollNext();
675
683
  }
676
684
  }, [scrollPrev, scrollNext]);
677
- React$44.useEffect(() => {
685
+ React$51.useEffect(() => {
678
686
  if (!api || !setApi) return;
679
687
  setApi(api);
680
688
  }, [api, setApi]);
681
- React$44.useEffect(() => {
689
+ React$51.useEffect(() => {
682
690
  if (!api) return;
683
691
  onSelect();
684
692
  api.on("reInit", onSelect);
@@ -719,7 +727,7 @@ const Carousel = React$44.forwardRef(({ orientation = "horizontal", opts, setApi
719
727
  });
720
728
  });
721
729
  Carousel.displayName = "Carousel";
722
- const CarouselContent = React$44.forwardRef(({ className,...props }, ref) => {
730
+ const CarouselContent = React$51.forwardRef(({ className,...props }, ref) => {
723
731
  const { carouselRef, orientation } = useCarousel();
724
732
  return /* @__PURE__ */ jsx("div", {
725
733
  ref: carouselRef,
@@ -732,7 +740,7 @@ const CarouselContent = React$44.forwardRef(({ className,...props }, ref) => {
732
740
  });
733
741
  });
734
742
  CarouselContent.displayName = "CarouselContent";
735
- const CarouselItem = React$44.forwardRef(({ className,...props }, ref) => {
743
+ const CarouselItem = React$51.forwardRef(({ className,...props }, ref) => {
736
744
  const { orientation } = useCarousel();
737
745
  return /* @__PURE__ */ jsx("div", {
738
746
  ref,
@@ -742,7 +750,7 @@ const CarouselItem = React$44.forwardRef(({ className,...props }, ref) => {
742
750
  });
743
751
  });
744
752
  CarouselItem.displayName = "CarouselItem";
745
- const CarouselPrevious = React$44.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
753
+ const CarouselPrevious = React$51.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
746
754
  const { orientation, scrollPrev, canScrollPrev } = useCarousel();
747
755
  return /* @__PURE__ */ jsxs(Button, {
748
756
  ref,
@@ -759,7 +767,7 @@ const CarouselPrevious = React$44.forwardRef(({ className, variant = "outline",
759
767
  });
760
768
  });
761
769
  CarouselPrevious.displayName = "CarouselPrevious";
762
- const CarouselNext = React$44.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
770
+ const CarouselNext = React$51.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
763
771
  const { orientation, scrollNext, canScrollNext } = useCarousel();
764
772
  return /* @__PURE__ */ jsxs(Button, {
765
773
  ref,
@@ -1209,7 +1217,7 @@ function DialogDescription({ className,...props }) {
1209
1217
 
1210
1218
  //#endregion
1211
1219
  //#region src/command-palette/command-palette.tsx
1212
- const CommandPalette = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1, {
1220
+ const CommandPalette = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1, {
1213
1221
  ref,
1214
1222
  className: cn("flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground", className),
1215
1223
  ...props
@@ -1227,7 +1235,7 @@ const CommandPaletteDialog = ({ children,...props }) => {
1227
1235
  })
1228
1236
  });
1229
1237
  };
1230
- const CommandPaletteInput = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs("div", {
1238
+ const CommandPaletteInput = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs("div", {
1231
1239
  className: "flex items-center border-b px-3",
1232
1240
  "data-cmdk-input-wrapper": "",
1233
1241
  children: [/* @__PURE__ */ jsx(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }), /* @__PURE__ */ jsx(Command$1.Input, {
@@ -1237,31 +1245,31 @@ const CommandPaletteInput = React$43.forwardRef(({ className,...props }, ref) =>
1237
1245
  })]
1238
1246
  }));
1239
1247
  CommandPaletteInput.displayName = Command$1.Input.displayName;
1240
- const CommandPaletteList = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.List, {
1248
+ const CommandPaletteList = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.List, {
1241
1249
  ref,
1242
1250
  className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
1243
1251
  ...props
1244
1252
  }));
1245
1253
  CommandPaletteList.displayName = Command$1.List.displayName;
1246
- const CommandPaletteEmpty = React$43.forwardRef((props, ref) => /* @__PURE__ */ jsx(Command$1.Empty, {
1254
+ const CommandPaletteEmpty = React$50.forwardRef((props, ref) => /* @__PURE__ */ jsx(Command$1.Empty, {
1247
1255
  ref,
1248
1256
  className: "py-6 text-center text-sm",
1249
1257
  ...props
1250
1258
  }));
1251
1259
  CommandPaletteEmpty.displayName = Command$1.Empty.displayName;
1252
- const CommandPaletteGroup = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Group, {
1260
+ const CommandPaletteGroup = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Group, {
1253
1261
  ref,
1254
1262
  className: cn("overflow-hidden p-1 text-foreground [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground", className),
1255
1263
  ...props
1256
1264
  }));
1257
1265
  CommandPaletteGroup.displayName = Command$1.Group.displayName;
1258
- const CommandPaletteSeparator = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Separator, {
1266
+ const CommandPaletteSeparator = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Separator, {
1259
1267
  ref,
1260
1268
  className: cn("-mx-1 h-px bg-border", className),
1261
1269
  ...props
1262
1270
  }));
1263
1271
  CommandPaletteSeparator.displayName = Command$1.Separator.displayName;
1264
- const CommandPaletteItem = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Item, {
1272
+ const CommandPaletteItem = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Item, {
1265
1273
  ref,
1266
1274
  className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled=true]:pointer-events-none data-[selected=true]:bg-accent data-[selected=true]:text-accent-foreground data-[disabled=true]:opacity-50", className),
1267
1275
  ...props
@@ -1337,8 +1345,8 @@ const frameworks = [
1337
1345
  }
1338
1346
  ];
1339
1347
  function ComboboxDemo() {
1340
- const [open, setOpen] = React$42.useState(false);
1341
- const [value, setValue] = React$42.useState("");
1348
+ const [open, setOpen] = React$49.useState(false);
1349
+ const [value, setValue] = React$49.useState("");
1342
1350
  return /* @__PURE__ */ jsxs(Popover, {
1343
1351
  open,
1344
1352
  onOpenChange: setOpen,
@@ -1578,32 +1586,32 @@ const ContextMenuGroup = ContextMenuPrimitive.Group;
1578
1586
  const ContextMenuPortal = ContextMenuPrimitive.Portal;
1579
1587
  const ContextMenuSub = ContextMenuPrimitive.Sub;
1580
1588
  const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
1581
- const ContextMenuSubTrigger = React$41.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.SubTrigger, {
1589
+ const ContextMenuSubTrigger = React$48.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.SubTrigger, {
1582
1590
  ref,
1583
1591
  className: cn("flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground", inset && "pl-8", className),
1584
1592
  ...props,
1585
1593
  children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto h-4 w-4" })]
1586
1594
  }));
1587
1595
  ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
1588
- const ContextMenuSubContent = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.SubContent, {
1596
+ const ContextMenuSubContent = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.SubContent, {
1589
1597
  ref,
1590
1598
  className: cn("z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground 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", className),
1591
1599
  ...props
1592
1600
  }));
1593
1601
  ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
1594
- const ContextMenuContent = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Content, {
1602
+ const ContextMenuContent = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Content, {
1595
1603
  ref,
1596
1604
  className: cn("z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md 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", className),
1597
1605
  ...props
1598
1606
  }) }));
1599
1607
  ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
1600
- const ContextMenuItem = React$41.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Item, {
1608
+ const ContextMenuItem = React$48.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Item, {
1601
1609
  ref,
1602
1610
  className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", inset && "pl-8", className),
1603
1611
  ...props
1604
1612
  }));
1605
1613
  ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
1606
- const ContextMenuCheckboxItem = React$41.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.CheckboxItem, {
1614
+ const ContextMenuCheckboxItem = React$48.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.CheckboxItem, {
1607
1615
  ref,
1608
1616
  className: cn("relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className),
1609
1617
  checked,
@@ -1614,7 +1622,7 @@ const ContextMenuCheckboxItem = React$41.forwardRef(({ className, children, chec
1614
1622
  }), children]
1615
1623
  }));
1616
1624
  ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
1617
- const ContextMenuRadioItem = React$41.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.RadioItem, {
1625
+ const ContextMenuRadioItem = React$48.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.RadioItem, {
1618
1626
  ref,
1619
1627
  className: cn("relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className),
1620
1628
  ...props,
@@ -1624,13 +1632,13 @@ const ContextMenuRadioItem = React$41.forwardRef(({ className, children,...props
1624
1632
  }), children]
1625
1633
  }));
1626
1634
  ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
1627
- const ContextMenuLabel = React$41.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Label, {
1635
+ const ContextMenuLabel = React$48.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Label, {
1628
1636
  ref,
1629
1637
  className: cn("px-2 py-1.5 text-sm font-semibold text-foreground", inset && "pl-8", className),
1630
1638
  ...props
1631
1639
  }));
1632
1640
  ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
1633
- const ContextMenuSeparator = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Separator, {
1641
+ const ContextMenuSeparator = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Separator, {
1634
1642
  ref,
1635
1643
  className: cn("-mx-1 my-1 h-px bg-border", className),
1636
1644
  ...props
@@ -1775,7 +1783,7 @@ function DropdownMenuSubContent({ className,...props }) {
1775
1783
  const TooltipProvider = TooltipPrimitive.Provider;
1776
1784
  const Tooltip = TooltipPrimitive.Root;
1777
1785
  const TooltipTrigger = TooltipPrimitive.Trigger;
1778
- const TooltipContent = React$40.forwardRef(({ className, sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Content, {
1786
+ const TooltipContent = React$47.forwardRef(({ className, sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Content, {
1779
1787
  ref,
1780
1788
  sideOffset,
1781
1789
  className: cn("z-50 overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-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", className),
@@ -2260,7 +2268,7 @@ const inputVariants = cva("file:text-foreground placeholder:text-muted-foregroun
2260
2268
  } },
2261
2269
  defaultVariants: { variant: "default" }
2262
2270
  });
2263
- const Input = React$39.forwardRef(({ className, type, variant, __e2e_test_id__, onEnter, wrapperClassName,...props }, ref) => {
2271
+ const Input = React$46.forwardRef(({ className, type, variant, __e2e_test_id__, onEnter, wrapperClassName,...props }, ref) => {
2264
2272
  const input = /* @__PURE__ */ jsx("input", {
2265
2273
  type,
2266
2274
  "data-slot": "input",
@@ -2342,10 +2350,10 @@ const numberInputWrapperVariants = cva("border-input bg-background grid grid-col
2342
2350
  } },
2343
2351
  defaultVariants: { variant: "default" }
2344
2352
  });
2345
- const NumberInput = React$38.forwardRef(({ className, wrapperClassName, prefix, suffix, variant, showSpinButtons = false, __e2e_test_id__, onEnter, onChange, format: format$1, value: controlledValue,...props }, ref) => {
2346
- const [isFocused, setIsFocused] = React$38.useState(false);
2347
- const [inputString, setInputString] = React$38.useState("");
2348
- const intlFormatter = React$38.useMemo(() => {
2353
+ const NumberInput = React$45.forwardRef(({ className, wrapperClassName, prefix, suffix, variant, showSpinButtons = false, __e2e_test_id__, onEnter, onChange, format: format$1, value: controlledValue,...props }, ref) => {
2354
+ const [isFocused, setIsFocused] = React$45.useState(false);
2355
+ const [inputString, setInputString] = React$45.useState("");
2356
+ const intlFormatter = React$45.useMemo(() => {
2349
2357
  if (!format$1 || typeof format$1 === "function") return void 0;
2350
2358
  return new Intl.NumberFormat(format$1.locale, format$1.options);
2351
2359
  }, [format$1]);
@@ -2392,7 +2400,7 @@ const NumberInput = React$38.forwardRef(({ className, wrapperClassName, prefix,
2392
2400
  setInputString("");
2393
2401
  props.onBlur?.(e);
2394
2402
  };
2395
- const displayValue = React$38.useMemo(() => {
2403
+ const displayValue = React$45.useMemo(() => {
2396
2404
  if (isFocused && format$1) {
2397
2405
  if (inputString !== "") return inputString;
2398
2406
  if (controlledValue !== void 0) {
@@ -2469,20 +2477,20 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2469
2477
  const rowOriginal = cell?.row?.original ?? {};
2470
2478
  const colCellMeta = cell?.column?.columnDef?.meta;
2471
2479
  const align = colCellMeta?.align ?? "left";
2472
- const editableResolver = React$37.useMemo(() => {
2480
+ const editableResolver = React$44.useMemo(() => {
2473
2481
  const v = colCellMeta?.editable;
2474
2482
  if (v === void 0) return () => true;
2475
2483
  return typeof v === "function" ? v : () => Boolean(v);
2476
2484
  }, [colCellMeta?.editable]);
2477
2485
  const isEditable = editableResolver(rowOriginal);
2478
- const classNameResolver = React$37.useMemo(() => {
2486
+ const classNameResolver = React$44.useMemo(() => {
2479
2487
  const v = colCellMeta?.className;
2480
2488
  return typeof v === "function" ? v : () => v;
2481
2489
  }, [colCellMeta?.className]);
2482
2490
  const colCellClassName = classNameResolver(rowOriginal);
2483
2491
  const isSearchMatch = meta?.getIsSearchMatch?.(rowIndex, columnId) ?? false;
2484
2492
  const isActiveSearchMatch = meta?.getIsActiveSearchMatch?.(rowIndex, columnId) ?? false;
2485
- const onClick = React$37.useCallback((event) => {
2493
+ const onClick = React$44.useCallback((event) => {
2486
2494
  if (!isEditing) {
2487
2495
  event.preventDefault();
2488
2496
  onClickProp?.(event);
@@ -2495,7 +2503,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2495
2503
  isEditing,
2496
2504
  onClickProp
2497
2505
  ]);
2498
- const onContextMenu = React$37.useCallback((event) => {
2506
+ const onContextMenu = React$44.useCallback((event) => {
2499
2507
  if (!isEditing) meta?.onCellContextMenu?.(rowIndex, columnId, event);
2500
2508
  }, [
2501
2509
  meta,
@@ -2503,7 +2511,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2503
2511
  columnId,
2504
2512
  isEditing
2505
2513
  ]);
2506
- const onMouseDown = React$37.useCallback((event) => {
2514
+ const onMouseDown = React$44.useCallback((event) => {
2507
2515
  if (!isEditing) meta?.onCellMouseDown?.(rowIndex, columnId, event);
2508
2516
  }, [
2509
2517
  meta,
@@ -2511,7 +2519,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2511
2519
  columnId,
2512
2520
  isEditing
2513
2521
  ]);
2514
- const onMouseEnter = React$37.useCallback((event) => {
2522
+ const onMouseEnter = React$44.useCallback((event) => {
2515
2523
  if (!isEditing) meta?.onCellMouseEnter?.(rowIndex, columnId, event);
2516
2524
  }, [
2517
2525
  meta,
@@ -2519,10 +2527,10 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2519
2527
  columnId,
2520
2528
  isEditing
2521
2529
  ]);
2522
- const onMouseUp = React$37.useCallback(() => {
2530
+ const onMouseUp = React$44.useCallback(() => {
2523
2531
  if (!isEditing) meta?.onCellMouseUp?.();
2524
2532
  }, [meta, isEditing]);
2525
- const onDoubleClick = React$37.useCallback((event) => {
2533
+ const onDoubleClick = React$44.useCallback((event) => {
2526
2534
  if (!isEditing) {
2527
2535
  event.preventDefault();
2528
2536
  if (isEditable) meta?.onCellDoubleClick?.(rowIndex, columnId);
@@ -2534,7 +2542,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2534
2542
  isEditing,
2535
2543
  isEditable
2536
2544
  ]);
2537
- const onKeyDown = React$37.useCallback((event) => {
2545
+ const onKeyDown = React$44.useCallback((event) => {
2538
2546
  onKeyDownProp?.(event);
2539
2547
  if (event.defaultPrevented) return;
2540
2548
  if (event.key === "ArrowUp" || event.key === "ArrowDown" || event.key === "ArrowLeft" || event.key === "ArrowRight" || event.key === "Home" || event.key === "End" || event.key === "PageUp" || event.key === "PageDown" || event.key === "Enter" || event.key === "Tab") return;
@@ -2748,22 +2756,22 @@ function HierarchyItem({ option, selectedValue, expandedIds, onToggleExpand, onS
2748
2756
  }
2749
2757
  function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
2750
2758
  const initialValue = cell.getValue();
2751
- const [value, setValue] = React$36.useState(initialValue);
2752
- const [open, setOpen] = React$36.useState(false);
2753
- const [searchValue, setSearchValue] = React$36.useState("");
2754
- const containerRef = React$36.useRef(null);
2755
- const inputRef = React$36.useRef(null);
2759
+ const [value, setValue] = React$43.useState(initialValue);
2760
+ const [open, setOpen] = React$43.useState(false);
2761
+ const [searchValue, setSearchValue] = React$43.useState("");
2762
+ const containerRef = React$43.useRef(null);
2763
+ const inputRef = React$43.useRef(null);
2756
2764
  const meta = table.options.meta;
2757
2765
  const cellOpts = cell.column.columnDef.meta?.cell;
2758
2766
  const sideOffset = -(containerRef.current?.clientHeight ?? 0);
2759
2767
  const options = cellOpts?.variant === "hierarchy" ? cellOpts.options : [];
2760
- const [expandedIds, setExpandedIds] = React$36.useState(() => getInitialExpandedIds(options, initialValue));
2761
- const labelMap = React$36.useMemo(() => buildLabelMap(options), [options]);
2762
- const displayLabel = React$36.useMemo(() => {
2768
+ const [expandedIds, setExpandedIds] = React$43.useState(() => getInitialExpandedIds(options, initialValue));
2769
+ const labelMap = React$43.useMemo(() => buildLabelMap(options), [options]);
2770
+ const displayLabel = React$43.useMemo(() => {
2763
2771
  if (!value) return "";
2764
2772
  return labelMap.get(value) ?? value;
2765
2773
  }, [value, labelMap]);
2766
- const toggleExpand = React$36.useCallback((id) => {
2774
+ const toggleExpand = React$43.useCallback((id) => {
2767
2775
  setExpandedIds((prev) => {
2768
2776
  const next = new Set(prev);
2769
2777
  if (next.has(id)) next.delete(id);
@@ -2771,7 +2779,7 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2771
2779
  return next;
2772
2780
  });
2773
2781
  }, []);
2774
- const onOptionSelect = React$36.useCallback((option) => {
2782
+ const onOptionSelect = React$43.useCallback((option) => {
2775
2783
  const newValue = option.id;
2776
2784
  setValue(newValue);
2777
2785
  meta?.onDataUpdate?.({
@@ -2786,18 +2794,18 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2786
2794
  rowIndex,
2787
2795
  columnId
2788
2796
  ]);
2789
- const onOpenChange = React$36.useCallback((isOpen) => {
2797
+ const onOpenChange = React$43.useCallback((isOpen) => {
2790
2798
  setOpen(isOpen);
2791
2799
  if (!isOpen) {
2792
2800
  setSearchValue("");
2793
2801
  meta?.onCellEditingStop?.();
2794
2802
  }
2795
2803
  }, [meta]);
2796
- const onOpenAutoFocus = React$36.useCallback((event) => {
2804
+ const onOpenAutoFocus = React$43.useCallback((event) => {
2797
2805
  event.preventDefault();
2798
2806
  inputRef.current?.focus();
2799
2807
  }, []);
2800
- const onWrapperKeyDown = React$36.useCallback((event) => {
2808
+ const onWrapperKeyDown = React$43.useCallback((event) => {
2801
2809
  if (isEditing) {
2802
2810
  if (event.key === "Escape") {
2803
2811
  event.preventDefault();
@@ -2817,10 +2825,10 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2817
2825
  initialValue,
2818
2826
  meta
2819
2827
  ]);
2820
- React$36.useEffect(() => {
2828
+ React$43.useEffect(() => {
2821
2829
  setValue(initialValue);
2822
2830
  }, [initialValue]);
2823
- React$36.useEffect(() => {
2831
+ React$43.useEffect(() => {
2824
2832
  if (value) {
2825
2833
  const ancestors = getAncestorIds(options, value);
2826
2834
  if (ancestors && ancestors.length > 0) setExpandedIds((prev) => {
@@ -2830,7 +2838,7 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2830
2838
  });
2831
2839
  }
2832
2840
  }, [value, options]);
2833
- React$36.useEffect(() => {
2841
+ React$43.useEffect(() => {
2834
2842
  if (isEditing && !open) setOpen(true);
2835
2843
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
2836
2844
  }, [
@@ -2928,9 +2936,9 @@ function EditorFooter({ count, onApply, onCancel }) {
2928
2936
  });
2929
2937
  }
2930
2938
  function BulkEditShortText({ columnId, selectedRowIndices, onApply, onCancel }) {
2931
- const [value, setValue] = React$35.useState("");
2932
- const inputRef = React$35.useRef(null);
2933
- const handleApply = React$35.useCallback(() => {
2939
+ const [value, setValue] = React$42.useState("");
2940
+ const inputRef = React$42.useRef(null);
2941
+ const handleApply = React$42.useCallback(() => {
2934
2942
  onApply(selectedRowIndices.map((rowIndex) => ({
2935
2943
  rowIndex,
2936
2944
  columnId,
@@ -2942,14 +2950,14 @@ function BulkEditShortText({ columnId, selectedRowIndices, onApply, onCancel })
2942
2950
  value,
2943
2951
  onApply
2944
2952
  ]);
2945
- const onKeyDown = React$35.useCallback((e) => {
2953
+ const onKeyDown = React$42.useCallback((e) => {
2946
2954
  stopGridKeys(e);
2947
2955
  if (e.key === "Enter") {
2948
2956
  e.preventDefault();
2949
2957
  handleApply();
2950
2958
  }
2951
2959
  }, [handleApply]);
2952
- React$35.useEffect(() => {
2960
+ React$42.useEffect(() => {
2953
2961
  inputRef.current?.focus();
2954
2962
  }, []);
2955
2963
  return /* @__PURE__ */ jsxs("div", {
@@ -2971,9 +2979,9 @@ function BulkEditShortText({ columnId, selectedRowIndices, onApply, onCancel })
2971
2979
  });
2972
2980
  }
2973
2981
  function BulkEditLongText({ columnId, selectedRowIndices, onApply, onCancel }) {
2974
- const [value, setValue] = React$35.useState("");
2975
- const textareaRef = React$35.useRef(null);
2976
- const handleApply = React$35.useCallback(() => {
2982
+ const [value, setValue] = React$42.useState("");
2983
+ const textareaRef = React$42.useRef(null);
2984
+ const handleApply = React$42.useCallback(() => {
2977
2985
  onApply(selectedRowIndices.map((rowIndex) => ({
2978
2986
  rowIndex,
2979
2987
  columnId,
@@ -2985,14 +2993,14 @@ function BulkEditLongText({ columnId, selectedRowIndices, onApply, onCancel }) {
2985
2993
  value,
2986
2994
  onApply
2987
2995
  ]);
2988
- const onKeyDown = React$35.useCallback((e) => {
2996
+ const onKeyDown = React$42.useCallback((e) => {
2989
2997
  stopGridKeys(e);
2990
2998
  if ((e.ctrlKey || e.metaKey) && e.key === "Enter") {
2991
2999
  e.preventDefault();
2992
3000
  handleApply();
2993
3001
  }
2994
3002
  }, [handleApply]);
2995
- React$35.useEffect(() => {
3003
+ React$42.useEffect(() => {
2996
3004
  textareaRef.current?.focus();
2997
3005
  }, []);
2998
3006
  return /* @__PURE__ */ jsxs("div", {
@@ -3015,12 +3023,12 @@ function BulkEditLongText({ columnId, selectedRowIndices, onApply, onCancel }) {
3015
3023
  });
3016
3024
  }
3017
3025
  function BulkEditNumber({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3018
- const [value, setValue] = React$35.useState(void 0);
3019
- const inputRef = React$35.useRef(null);
3026
+ const [value, setValue] = React$42.useState(void 0);
3027
+ const inputRef = React$42.useRef(null);
3020
3028
  const { min, max, step, prefix, suffix } = cell.variant === "number" ? cell : {};
3021
3029
  const stringPrefix = typeof prefix === "string" ? prefix : void 0;
3022
3030
  const stringSuffix = typeof suffix === "string" ? suffix : void 0;
3023
- const handleApply = React$35.useCallback(() => {
3031
+ const handleApply = React$42.useCallback(() => {
3024
3032
  const numValue = value ?? null;
3025
3033
  onApply(selectedRowIndices.map((rowIndex) => ({
3026
3034
  rowIndex,
@@ -3033,14 +3041,14 @@ function BulkEditNumber({ cell, columnId, selectedRowIndices, onApply, onCancel
3033
3041
  value,
3034
3042
  onApply
3035
3043
  ]);
3036
- const onKeyDown = React$35.useCallback((e) => {
3044
+ const onKeyDown = React$42.useCallback((e) => {
3037
3045
  stopGridKeys(e);
3038
3046
  if (e.key === "Enter") {
3039
3047
  e.preventDefault();
3040
3048
  handleApply();
3041
3049
  }
3042
3050
  }, [handleApply]);
3043
- React$35.useEffect(() => {
3051
+ React$42.useEffect(() => {
3044
3052
  inputRef.current?.focus();
3045
3053
  }, []);
3046
3054
  return /* @__PURE__ */ jsxs("div", {
@@ -3069,8 +3077,8 @@ function BulkEditNumber({ cell, columnId, selectedRowIndices, onApply, onCancel
3069
3077
  }
3070
3078
  function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3071
3079
  const { options: arrayOptions, optionsMap, optionsRenderer } = cell.variant === "select" ? cell : {};
3072
- const inputRef = React$35.useRef(null);
3073
- const options = React$35.useMemo(() => {
3080
+ const inputRef = React$42.useRef(null);
3081
+ const options = React$42.useMemo(() => {
3074
3082
  if (arrayOptions) return arrayOptions.map((opt) => ({
3075
3083
  value: opt.value,
3076
3084
  data: opt.label
@@ -3081,7 +3089,7 @@ function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel
3081
3089
  }));
3082
3090
  return [];
3083
3091
  }, [arrayOptions, optionsMap]);
3084
- const handleSelect = React$35.useCallback((newValue) => {
3092
+ const handleSelect = React$42.useCallback((newValue) => {
3085
3093
  onApply(selectedRowIndices.map((rowIndex) => ({
3086
3094
  rowIndex,
3087
3095
  columnId,
@@ -3092,7 +3100,7 @@ function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel
3092
3100
  columnId,
3093
3101
  onApply
3094
3102
  ]);
3095
- React$35.useEffect(() => {
3103
+ React$42.useEffect(() => {
3096
3104
  inputRef.current?.focus();
3097
3105
  }, []);
3098
3106
  return /* @__PURE__ */ jsxs("div", {
@@ -3116,10 +3124,10 @@ function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel
3116
3124
  }
3117
3125
  function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3118
3126
  const { options: arrayOptions, optionsMap } = cell.variant === "multi-select" ? cell : {};
3119
- const [selectedValues, setSelectedValues] = React$35.useState([]);
3120
- const [searchValue, setSearchValue] = React$35.useState("");
3121
- const inputRef = React$35.useRef(null);
3122
- const options = React$35.useMemo(() => {
3127
+ const [selectedValues, setSelectedValues] = React$42.useState([]);
3128
+ const [searchValue, setSearchValue] = React$42.useState("");
3129
+ const inputRef = React$42.useRef(null);
3130
+ const options = React$42.useMemo(() => {
3123
3131
  if (arrayOptions) return arrayOptions;
3124
3132
  if (optionsMap) return Array.from(optionsMap.entries()).map(([id, label]) => ({
3125
3133
  value: id,
@@ -3127,12 +3135,12 @@ function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCa
3127
3135
  }));
3128
3136
  return [];
3129
3137
  }, [arrayOptions, optionsMap]);
3130
- const toggleValue = React$35.useCallback((value) => {
3138
+ const toggleValue = React$42.useCallback((value) => {
3131
3139
  setSelectedValues((prev) => prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]);
3132
3140
  setSearchValue("");
3133
3141
  queueMicrotask(() => inputRef.current?.focus());
3134
3142
  }, []);
3135
- const handleApply = React$35.useCallback(() => {
3143
+ const handleApply = React$42.useCallback(() => {
3136
3144
  onApply(selectedRowIndices.map((rowIndex) => ({
3137
3145
  rowIndex,
3138
3146
  columnId,
@@ -3144,7 +3152,7 @@ function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCa
3144
3152
  selectedValues,
3145
3153
  onApply
3146
3154
  ]);
3147
- React$35.useEffect(() => {
3155
+ React$42.useEffect(() => {
3148
3156
  inputRef.current?.focus();
3149
3157
  }, []);
3150
3158
  return /* @__PURE__ */ jsxs("div", {
@@ -3210,7 +3218,7 @@ function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCa
3210
3218
  });
3211
3219
  }
3212
3220
  function BulkEditCheckbox({ columnId, selectedRowIndices, onApply, onCancel }) {
3213
- const setAll = React$35.useCallback((val) => {
3221
+ const setAll = React$42.useCallback((val) => {
3214
3222
  onApply(selectedRowIndices.map((rowIndex) => ({
3215
3223
  rowIndex,
3216
3224
  columnId,
@@ -3247,10 +3255,10 @@ function BulkEditCheckbox({ columnId, selectedRowIndices, onApply, onCancel }) {
3247
3255
  }
3248
3256
  function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3249
3257
  const options = cell.variant === "hierarchy" ? cell.options : [];
3250
- const inputRef = React$35.useRef(null);
3251
- const [searchValue, setSearchValue] = React$35.useState("");
3252
- const [expandedIds, setExpandedIds] = React$35.useState(() => getInitialExpandedIds(options, null));
3253
- const toggleExpand = React$35.useCallback((id) => {
3258
+ const inputRef = React$42.useRef(null);
3259
+ const [searchValue, setSearchValue] = React$42.useState("");
3260
+ const [expandedIds, setExpandedIds] = React$42.useState(() => getInitialExpandedIds(options, null));
3261
+ const toggleExpand = React$42.useCallback((id) => {
3254
3262
  setExpandedIds((prev) => {
3255
3263
  const next = new Set(prev);
3256
3264
  if (next.has(id)) next.delete(id);
@@ -3258,7 +3266,7 @@ function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCanc
3258
3266
  return next;
3259
3267
  });
3260
3268
  }, []);
3261
- const handleSelect = React$35.useCallback((option) => {
3269
+ const handleSelect = React$42.useCallback((option) => {
3262
3270
  onApply(selectedRowIndices.map((rowIndex) => ({
3263
3271
  rowIndex,
3264
3272
  columnId,
@@ -3269,7 +3277,7 @@ function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCanc
3269
3277
  columnId,
3270
3278
  onApply
3271
3279
  ]);
3272
- React$35.useEffect(() => {
3280
+ React$42.useEffect(() => {
3273
3281
  inputRef.current?.focus();
3274
3282
  }, []);
3275
3283
  return /* @__PURE__ */ jsxs("div", {
@@ -3300,7 +3308,7 @@ function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCanc
3300
3308
  });
3301
3309
  }
3302
3310
  function BulkEditDate({ columnId, selectedRowIndices, onApply, onCancel }) {
3303
- const onDateSelect = React$35.useCallback((date) => {
3311
+ const onDateSelect = React$42.useCallback((date) => {
3304
3312
  if (!date) return;
3305
3313
  const year = date.getFullYear();
3306
3314
  const month = String(date.getMonth() + 1).padStart(2, "0");
@@ -3332,28 +3340,28 @@ function BulkEditDate({ columnId, selectedRowIndices, onApply, onCancel }) {
3332
3340
  });
3333
3341
  }
3334
3342
  function BulkEditPopover({ table, cell, columnId, open, onOpenChange, children }) {
3335
- const selectedRowIndices = React$35.useMemo(() => {
3343
+ const selectedRowIndices = React$42.useMemo(() => {
3336
3344
  if (!open) return [];
3337
3345
  const allRows = table.getRowModel().rows;
3338
3346
  const indices = [];
3339
3347
  for (let i = 0; i < allRows.length; i++) if (allRows[i].getIsSelected()) indices.push(i);
3340
3348
  return indices;
3341
3349
  }, [open, table]);
3342
- React$35.useEffect(() => {
3350
+ React$42.useEffect(() => {
3343
3351
  if (open && selectedRowIndices.length === 0) onOpenChange(false);
3344
3352
  }, [
3345
3353
  open,
3346
3354
  selectedRowIndices.length,
3347
3355
  onOpenChange
3348
3356
  ]);
3349
- const onApply = React$35.useCallback((updates) => {
3357
+ const onApply = React$42.useCallback((updates) => {
3350
3358
  table.options.meta?.onDataUpdate?.(updates);
3351
3359
  onOpenChange(false);
3352
3360
  }, [table, onOpenChange]);
3353
- const onCancel = React$35.useCallback(() => {
3361
+ const onCancel = React$42.useCallback(() => {
3354
3362
  onOpenChange(false);
3355
3363
  }, [onOpenChange]);
3356
- const onOpenAutoFocus = React$35.useCallback((e) => {
3364
+ const onOpenAutoFocus = React$42.useCallback((e) => {
3357
3365
  e.preventDefault();
3358
3366
  }, []);
3359
3367
  const editorProps = {
@@ -3363,7 +3371,7 @@ function BulkEditPopover({ table, cell, columnId, open, onOpenChange, children }
3363
3371
  onApply,
3364
3372
  onCancel
3365
3373
  };
3366
- const editor = React$35.useMemo(() => {
3374
+ const editor = React$42.useMemo(() => {
3367
3375
  switch (cell.variant) {
3368
3376
  case "short-text": return /* @__PURE__ */ jsx(BulkEditShortText, { ...editorProps });
3369
3377
  case "long-text": return /* @__PURE__ */ jsx(BulkEditLongText, { ...editorProps });
@@ -3437,12 +3445,16 @@ function getColumnVariant(variant) {
3437
3445
  icon: CalendarIcon$1,
3438
3446
  label: "Date"
3439
3447
  };
3448
+ case "download-file": return {
3449
+ icon: DownloadIcon,
3450
+ label: "File download"
3451
+ };
3440
3452
  default: return null;
3441
3453
  }
3442
3454
  }
3443
3455
  function DataGridColumnHeader({ header, table, className, onPointerDown,...props }) {
3444
- const [open, setOpen] = React$34.useState(false);
3445
- const [bulkEditOpen, setBulkEditOpen] = React$34.useState(false);
3456
+ const [open, setOpen] = React$41.useState(false);
3457
+ const [bulkEditOpen, setBulkEditOpen] = React$41.useState(false);
3446
3458
  const column = header.column;
3447
3459
  const label = column.columnDef.meta?.label ? column.columnDef.meta.label : typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
3448
3460
  const isAnyColumnResizing = table.getState().columnSizingInfo.isResizingColumn;
@@ -3451,13 +3463,13 @@ function DataGridColumnHeader({ header, table, className, onPointerDown,...props
3451
3463
  const enableBulkEdit = column.columnDef.meta?.enableBulkEdit ?? false;
3452
3464
  const selectedRowCount = Object.keys(table.getState().rowSelection).length;
3453
3465
  const showBulkEdit = enableBulkEdit && selectedRowCount > 1 && cellVariant != null && EditableCellVariantsSet.has(cellVariant?.variant);
3454
- React$34.useEffect(() => {
3466
+ React$41.useEffect(() => {
3455
3467
  if (!showBulkEdit) setBulkEditOpen(false);
3456
3468
  }, [showBulkEdit]);
3457
3469
  const pinnedPosition = column.getIsPinned();
3458
3470
  const isPinnedLeft = pinnedPosition === "left";
3459
3471
  const isPinnedRight = pinnedPosition === "right";
3460
- const onSortingChange = React$34.useCallback((direction) => {
3472
+ const onSortingChange = React$41.useCallback((direction) => {
3461
3473
  table.setSorting((prev) => {
3462
3474
  const existingSortIndex = prev.findIndex((sort) => sort.id === column.id);
3463
3475
  const newSort = {
@@ -3471,19 +3483,19 @@ function DataGridColumnHeader({ header, table, className, onPointerDown,...props
3471
3483
  } else return [...prev, newSort];
3472
3484
  });
3473
3485
  }, [column.id, table]);
3474
- const onSortRemove = React$34.useCallback(() => {
3486
+ const onSortRemove = React$41.useCallback(() => {
3475
3487
  table.setSorting((prev) => prev.filter((sort) => sort.id !== column.id));
3476
3488
  }, [column.id, table]);
3477
- const onLeftPin = React$34.useCallback(() => {
3489
+ const onLeftPin = React$41.useCallback(() => {
3478
3490
  column.pin("left");
3479
3491
  }, [column]);
3480
- const onRightPin = React$34.useCallback(() => {
3492
+ const onRightPin = React$41.useCallback(() => {
3481
3493
  column.pin("right");
3482
3494
  }, [column]);
3483
- const onUnpin = React$34.useCallback(() => {
3495
+ const onUnpin = React$41.useCallback(() => {
3484
3496
  column.pin(false);
3485
3497
  }, [column]);
3486
- const onTriggerPointerDown = React$34.useCallback((event) => {
3498
+ const onTriggerPointerDown = React$41.useCallback((event) => {
3487
3499
  onPointerDown?.(event);
3488
3500
  if (event.defaultPrevented) return;
3489
3501
  if (event.button !== 0) return;
@@ -3610,7 +3622,7 @@ function DataGridColumnHeader({ header, table, className, onPointerDown,...props
3610
3622
  })
3611
3623
  ] });
3612
3624
  }
3613
- const DataGridColumnResizer = React$34.memo(DataGridColumnResizerImpl, (prev, next) => {
3625
+ const DataGridColumnResizer = React$41.memo(DataGridColumnResizerImpl, (prev, next) => {
3614
3626
  const prevColumn = prev.header.column;
3615
3627
  const nextColumn = next.header.column;
3616
3628
  if (prevColumn.getIsResizing() !== nextColumn.getIsResizing() || prevColumn.getSize() !== nextColumn.getSize()) return false;
@@ -3619,7 +3631,7 @@ const DataGridColumnResizer = React$34.memo(DataGridColumnResizerImpl, (prev, ne
3619
3631
  });
3620
3632
  function DataGridColumnResizerImpl({ header, table, label }) {
3621
3633
  const defaultColumnDef = table._getDefaultColumnDef();
3622
- const onDoubleClick = React$34.useCallback(() => {
3634
+ const onDoubleClick = React$41.useCallback(() => {
3623
3635
  header.column.resetSize();
3624
3636
  }, [header.column]);
3625
3637
  return /* @__PURE__ */ jsx("div", {
@@ -3728,7 +3740,7 @@ function DataGridContextMenu({ table }) {
3728
3740
  onRowsDelete
3729
3741
  });
3730
3742
  }
3731
- const ContextMenu$1 = React$33.memo(ContextMenuImpl, (prev, next) => {
3743
+ const ContextMenu$1 = React$40.memo(ContextMenuImpl, (prev, next) => {
3732
3744
  if (prev.contextMenu.open !== next.contextMenu.open) return false;
3733
3745
  if (!next.contextMenu.open) return true;
3734
3746
  if (prev.contextMenu.x !== next.contextMenu.x) return false;
@@ -3739,7 +3751,7 @@ const ContextMenu$1 = React$33.memo(ContextMenuImpl, (prev, next) => {
3739
3751
  return true;
3740
3752
  });
3741
3753
  function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenChange, selectionState, onDataUpdate, onRowsDelete }) {
3742
- const triggerStyle = React$33.useMemo(() => ({
3754
+ const triggerStyle = React$40.useMemo(() => ({
3743
3755
  position: "fixed",
3744
3756
  left: `${contextMenu.x}px`,
3745
3757
  top: `${contextMenu.y}px`,
@@ -3752,11 +3764,11 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3752
3764
  pointerEvents: "none",
3753
3765
  opacity: 0
3754
3766
  }), [contextMenu.x, contextMenu.y]);
3755
- const onCloseAutoFocus = React$33.useCallback((event) => {
3767
+ const onCloseAutoFocus = React$40.useCallback((event) => {
3756
3768
  event.preventDefault();
3757
3769
  dataGridRef?.current?.focus();
3758
3770
  }, [dataGridRef]);
3759
- const onCopy = React$33.useCallback(async () => {
3771
+ const onCopy = React$40.useCallback(async () => {
3760
3772
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return;
3761
3773
  const rows = table.getRowModel().rows;
3762
3774
  const columnIds = [];
@@ -3795,7 +3807,7 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3795
3807
  await navigator.clipboard.writeText(tsvData);
3796
3808
  toast$1.success(`${selectionState.selectedCells.size} cell${selectionState.selectedCells.size !== 1 ? "s" : ""} copied`);
3797
3809
  }, [table, selectionState]);
3798
- const canClear = React$33.useMemo(() => {
3810
+ const canClear = React$40.useMemo(() => {
3799
3811
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return false;
3800
3812
  const visibleCols = table.getVisibleLeafColumns();
3801
3813
  const rows = table.getRowModel().rows;
@@ -3812,7 +3824,7 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3812
3824
  }
3813
3825
  return true;
3814
3826
  }, [selectionState, table]);
3815
- const onClear = React$33.useCallback(() => {
3827
+ const onClear = React$40.useCallback(() => {
3816
3828
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return;
3817
3829
  if (!canClear) return;
3818
3830
  const updates = [];
@@ -3831,7 +3843,7 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3831
3843
  selectionState,
3832
3844
  canClear
3833
3845
  ]);
3834
- const onDelete = React$33.useCallback(async () => {
3846
+ const onDelete = React$40.useCallback(async () => {
3835
3847
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return;
3836
3848
  const rowIndices = new Set();
3837
3849
  for (const cellKey of selectionState.selectedCells) {
@@ -3908,12 +3920,12 @@ function composeRefs(...refs) {
3908
3920
  * Accepts callback refs and RefObject(s)
3909
3921
  */
3910
3922
  function useComposedRefs(...refs) {
3911
- return React$32.useCallback(composeRefs(...refs), refs);
3923
+ return React$39.useCallback(composeRefs(...refs), refs);
3912
3924
  }
3913
3925
 
3914
3926
  //#endregion
3915
3927
  //#region src/data-grid/data-grid-row.tsx
3916
- const DataGridRow = React$31.memo(DataGridRowImpl, (prev, next) => {
3928
+ const DataGridRow = React$38.memo(DataGridRowImpl, (prev, next) => {
3917
3929
  if (prev.row.id !== next.row.id) return false;
3918
3930
  if (prev.row.original !== next.row.original) return false;
3919
3931
  const prevRowIndex = prev.virtualRowIndex;
@@ -3945,7 +3957,7 @@ function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, r
3945
3957
  }
3946
3958
  });
3947
3959
  const isRowSelected = row.getIsSelected();
3948
- const handleRowClick = React$31.useCallback((event) => {
3960
+ const handleRowClick = React$38.useCallback((event) => {
3949
3961
  const target = event.target;
3950
3962
  if (target.closest("input, button, [role=\"checkbox\"]")) return;
3951
3963
  if (event.detail === 1) onRowClick?.(virtualRowIndex);
@@ -3974,7 +3986,7 @@ function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, r
3974
3986
  "data-highlighted": isCellFocused ? "" : void 0,
3975
3987
  "data-slot": "grid-cell",
3976
3988
  tabIndex: -1,
3977
- className: cn({ "border-r": cell.column.id !== "select" }),
3989
+ className: cn("shrink-0 overflow-hidden", { "border-r": cell.column.id !== "select" }),
3978
3990
  style: {
3979
3991
  ...getCommonPinningStyles({ column: cell.column }),
3980
3992
  width: `calc(var(--col-${cell.column.id}-size) * 1px)`
@@ -3995,20 +4007,20 @@ function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, r
3995
4007
  * prop or avoid re-executing effects when passed as a dependency
3996
4008
  */
3997
4009
  function useCallbackRef(callback) {
3998
- const callbackRef = React$30.useRef(callback);
3999
- React$30.useEffect(() => {
4010
+ const callbackRef = React$37.useRef(callback);
4011
+ React$37.useEffect(() => {
4000
4012
  callbackRef.current = callback;
4001
4013
  });
4002
- return React$30.useMemo(() => (...args) => callbackRef.current?.(...args), []);
4014
+ return React$37.useMemo(() => (...args) => callbackRef.current?.(...args), []);
4003
4015
  }
4004
4016
 
4005
4017
  //#endregion
4006
4018
  //#region src/hooks/use-debounced-callback.ts
4007
4019
  function useDebouncedCallback(callback, delay) {
4008
4020
  const handleCallback = useCallbackRef(callback);
4009
- const debounceTimerRef = React$29.useRef(0);
4010
- React$29.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
4011
- const setValue = React$29.useCallback((...args) => {
4021
+ const debounceTimerRef = React$36.useRef(0);
4022
+ React$36.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
4023
+ const setValue = React$36.useCallback((...args) => {
4012
4024
  window.clearTimeout(debounceTimerRef.current);
4013
4025
  debounceTimerRef.current = window.setTimeout(() => handleCallback(...args), delay);
4014
4026
  }, [handleCallback, delay]);
@@ -4017,7 +4029,7 @@ function useDebouncedCallback(callback, delay) {
4017
4029
 
4018
4030
  //#endregion
4019
4031
  //#region src/data-grid/data-grid-search.tsx
4020
- const DataGridSearch = React$28.memo(DataGridSearchImpl, (prev, next) => {
4032
+ const DataGridSearch = React$35.memo(DataGridSearchImpl, (prev, next) => {
4021
4033
  if (prev.searchOpen !== next.searchOpen) return false;
4022
4034
  if (!next.searchOpen) return true;
4023
4035
  if (prev.searchQuery !== next.searchQuery || prev.matchIndex !== next.matchIndex) return false;
@@ -4031,13 +4043,13 @@ const DataGridSearch = React$28.memo(DataGridSearchImpl, (prev, next) => {
4031
4043
  return true;
4032
4044
  });
4033
4045
  function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpenChange, searchQuery, onSearchQueryChange, onSearch, onNavigateToNextMatch, onNavigateToPrevMatch }) {
4034
- const inputRef = React$28.useRef(null);
4035
- React$28.useEffect(() => {
4046
+ const inputRef = React$35.useRef(null);
4047
+ React$35.useEffect(() => {
4036
4048
  if (searchOpen) requestAnimationFrame(() => {
4037
4049
  inputRef.current?.focus();
4038
4050
  });
4039
4051
  }, [searchOpen]);
4040
- React$28.useEffect(() => {
4052
+ React$35.useEffect(() => {
4041
4053
  if (!searchOpen) return;
4042
4054
  function onEscape(event) {
4043
4055
  if (event.key === "Escape") {
@@ -4048,7 +4060,7 @@ function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpe
4048
4060
  document.addEventListener("keydown", onEscape);
4049
4061
  return () => document.removeEventListener("keydown", onEscape);
4050
4062
  }, [searchOpen, onSearchOpenChange]);
4051
- const onKeyDown = React$28.useCallback((event) => {
4063
+ const onKeyDown = React$35.useCallback((event) => {
4052
4064
  event.stopPropagation();
4053
4065
  if (event.key === "Enter") {
4054
4066
  event.preventDefault();
@@ -4059,20 +4071,20 @@ function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpe
4059
4071
  const debouncedSearch = useDebouncedCallback((query) => {
4060
4072
  onSearch(query);
4061
4073
  }, 150);
4062
- const onChange = React$28.useCallback((event) => {
4074
+ const onChange = React$35.useCallback((event) => {
4063
4075
  const value = event.target.value;
4064
4076
  onSearchQueryChange(value);
4065
4077
  debouncedSearch(value);
4066
4078
  }, [onSearchQueryChange, debouncedSearch]);
4067
- const onTriggerPointerDown = React$28.useCallback((event) => {
4079
+ const onTriggerPointerDown = React$35.useCallback((event) => {
4068
4080
  const target = event.target;
4069
4081
  if (!(target instanceof HTMLElement)) return;
4070
4082
  if (target.hasPointerCapture(event.pointerId)) target.releasePointerCapture(event.pointerId);
4071
4083
  if (event.button === 0 && event.ctrlKey === false && event.pointerType === "mouse" && !(event.target instanceof HTMLInputElement)) event.preventDefault();
4072
4084
  }, []);
4073
- const onPrevMatchPointerDown = React$28.useCallback((event) => onTriggerPointerDown(event), [onTriggerPointerDown]);
4074
- const onNextMatchPointerDown = React$28.useCallback((event) => onTriggerPointerDown(event), [onTriggerPointerDown]);
4075
- const onClose = React$28.useCallback(() => {
4085
+ const onPrevMatchPointerDown = React$35.useCallback((event) => onTriggerPointerDown(event), [onTriggerPointerDown]);
4086
+ const onNextMatchPointerDown = React$35.useCallback((event) => onTriggerPointerDown(event), [onTriggerPointerDown]);
4087
+ const onClose = React$35.useCallback(() => {
4076
4088
  onSearchOpenChange(false);
4077
4089
  }, [onSearchOpenChange]);
4078
4090
  if (!searchOpen) return null;
@@ -4153,15 +4165,15 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
4153
4165
  const visibleColumnIds = table.getVisibleLeafColumns().map((c) => c.id).join(",");
4154
4166
  const pinningState = table.getState().columnPinning;
4155
4167
  const columnPinningKey = `${(pinningState.left ?? []).join(",")}|${(pinningState.right ?? []).join(",")}`;
4156
- const prevVisibleColumnIdsRef = React$27.useRef(visibleColumnIds);
4168
+ const prevVisibleColumnIdsRef = React$34.useRef(visibleColumnIds);
4157
4169
  if (prevVisibleColumnIdsRef.current !== visibleColumnIds) {
4158
4170
  rowMapRef.current.clear();
4159
4171
  prevVisibleColumnIdsRef.current = visibleColumnIds;
4160
4172
  }
4161
- const onGridContextMenu = React$27.useCallback((event) => {
4173
+ const onGridContextMenu = React$34.useCallback((event) => {
4162
4174
  event.preventDefault();
4163
4175
  }, []);
4164
- const onAddRowKeyDown = React$27.useCallback(async (event) => {
4176
+ const onAddRowKeyDown = React$34.useCallback(async (event) => {
4165
4177
  if (!onRowAdd) return;
4166
4178
  if (event.key === "Enter" || event.key === "") {
4167
4179
  event.preventDefault();
@@ -4218,7 +4230,7 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
4218
4230
  "aria-sort": currentSort?.desc === false ? "ascending" : currentSort?.desc === true ? "descending" : isSortable ? "none" : void 0,
4219
4231
  "data-slot": "grid-header-cell",
4220
4232
  tabIndex: -1,
4221
- className: cn("relative", { "border-r": header.column.id !== "select" }),
4233
+ className: cn("relative shrink-0", { "border-r": header.column.id !== "select" }),
4222
4234
  style: {
4223
4235
  ...getCommonPinningStyles({ column: header.column }),
4224
4236
  width: `calc(var(--header-${header.id}-size) * 1px)`
@@ -4248,7 +4260,7 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
4248
4260
  transform: `translateY(${virtualItem.start}px)`
4249
4261
  },
4250
4262
  children: table.getVisibleLeafColumns().map((col) => /* @__PURE__ */ jsx("div", {
4251
- className: "px-3",
4263
+ className: "shrink-0 px-3",
4252
4264
  style: { width: `calc(var(--col-${col.id}-size) * 1px)` },
4253
4265
  children: /* @__PURE__ */ jsx(Skeleton, { className: "h-4 w-full" })
4254
4266
  }, col.id))
@@ -4313,17 +4325,17 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
4313
4325
  function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }) {
4314
4326
  const cellValue = cell.getValue();
4315
4327
  const cellValueAsBoolean = Boolean(cellValue);
4316
- const [value, setValue] = React$26.useState(cellValueAsBoolean);
4317
- const containerRef = React$26.useRef(null);
4328
+ const [value, setValue] = React$33.useState(cellValueAsBoolean);
4329
+ const containerRef = React$33.useRef(null);
4318
4330
  const meta = table.options.meta;
4319
4331
  const colMeta = cell.column.columnDef.meta;
4320
- const editableResolver = React$26.useMemo(() => {
4332
+ const editableResolver = React$33.useMemo(() => {
4321
4333
  const v = colMeta?.editable;
4322
4334
  if (v === void 0) return () => true;
4323
4335
  return typeof v === "function" ? v : () => Boolean(v);
4324
4336
  }, [colMeta?.editable]);
4325
4337
  const isEditable = editableResolver(cell.row.original);
4326
- const onCheckedChange = React$26.useCallback((checked) => {
4338
+ const onCheckedChange = React$33.useCallback((checked) => {
4327
4339
  setValue(checked);
4328
4340
  meta?.onDataUpdate?.({
4329
4341
  rowIndex,
@@ -4335,7 +4347,7 @@ function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }
4335
4347
  rowIndex,
4336
4348
  columnId
4337
4349
  ]);
4338
- const onWrapperKeyDown = React$26.useCallback((event) => {
4350
+ const onWrapperKeyDown = React$33.useCallback((event) => {
4339
4351
  if (!isEditable) return;
4340
4352
  if (isFocused && (event.key === "" || event.key === "Enter")) {
4341
4353
  event.preventDefault();
@@ -4348,17 +4360,17 @@ function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }
4348
4360
  onCheckedChange,
4349
4361
  isEditable
4350
4362
  ]);
4351
- React$26.useEffect(() => {
4363
+ React$33.useEffect(() => {
4352
4364
  setValue(cellValueAsBoolean);
4353
4365
  }, [cellValueAsBoolean]);
4354
- React$26.useEffect(() => {
4366
+ React$33.useEffect(() => {
4355
4367
  if (isFocused && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4356
4368
  }, [
4357
4369
  isFocused,
4358
4370
  meta?.searchOpen,
4359
4371
  meta?.isScrolling
4360
4372
  ]);
4361
- const onWrapperClick = React$26.useCallback((event) => {
4373
+ const onWrapperClick = React$33.useCallback((event) => {
4362
4374
  if (!isEditable) return;
4363
4375
  if (isFocused) {
4364
4376
  event.preventDefault();
@@ -4371,13 +4383,13 @@ function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }
4371
4383
  onCheckedChange,
4372
4384
  isEditable
4373
4385
  ]);
4374
- const onCheckboxClick = React$26.useCallback((event) => {
4386
+ const onCheckboxClick = React$33.useCallback((event) => {
4375
4387
  event.stopPropagation();
4376
4388
  }, []);
4377
- const onCheckboxMouseDown = React$26.useCallback((event) => {
4389
+ const onCheckboxMouseDown = React$33.useCallback((event) => {
4378
4390
  event.stopPropagation();
4379
4391
  }, []);
4380
- const onCheckboxDoubleClick = React$26.useCallback((event) => {
4392
+ const onCheckboxDoubleClick = React$33.useCallback((event) => {
4381
4393
  event.stopPropagation();
4382
4394
  }, []);
4383
4395
  return /* @__PURE__ */ jsx(DataGridCellWrapper, {
@@ -4432,20 +4444,20 @@ function formatDateToISOString(date) {
4432
4444
  }
4433
4445
  function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4434
4446
  const initialValue = cell.getValue();
4435
- const [value, setValue] = React$25.useState(parseToLocalDate(initialValue));
4436
- const [open, setOpen] = React$25.useState(false);
4437
- const containerRef = React$25.useRef(null);
4438
- const hasStoppedRef = React$25.useRef(false);
4447
+ const [value, setValue] = React$32.useState(parseToLocalDate(initialValue));
4448
+ const [open, setOpen] = React$32.useState(false);
4449
+ const containerRef = React$32.useRef(null);
4450
+ const hasStoppedRef = React$32.useRef(false);
4439
4451
  const meta = table.options.meta;
4440
- const prevInitialValueRef = React$25.useRef(initialValue);
4452
+ const prevInitialValueRef = React$32.useRef(initialValue);
4441
4453
  if (initialValue !== prevInitialValueRef.current) {
4442
4454
  prevInitialValueRef.current = initialValue;
4443
4455
  setValue(parseToLocalDate(initialValue));
4444
4456
  }
4445
- React$25.useEffect(() => {
4457
+ React$32.useEffect(() => {
4446
4458
  if (isEditing) hasStoppedRef.current = false;
4447
4459
  }, [isEditing]);
4448
- const onDateSelect = React$25.useCallback((date) => {
4460
+ const onDateSelect = React$32.useCallback((date) => {
4449
4461
  if (!date) return;
4450
4462
  setValue(date);
4451
4463
  meta?.onDataUpdate?.({
@@ -4461,14 +4473,14 @@ function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSel
4461
4473
  rowIndex,
4462
4474
  columnId
4463
4475
  ]);
4464
- const onOpenChange = React$25.useCallback((isOpen) => {
4476
+ const onOpenChange = React$32.useCallback((isOpen) => {
4465
4477
  setOpen(isOpen);
4466
4478
  if (!isOpen && isEditing && !hasStoppedRef.current) {
4467
4479
  hasStoppedRef.current = true;
4468
4480
  meta?.onCellEditingStop?.();
4469
4481
  }
4470
4482
  }, [isEditing, meta]);
4471
- const onWrapperKeyDown = React$25.useCallback((event) => {
4483
+ const onWrapperKeyDown = React$32.useCallback((event) => {
4472
4484
  if (isEditing) {
4473
4485
  if (event.key === "Escape") {
4474
4486
  event.preventDefault();
@@ -4488,10 +4500,10 @@ function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSel
4488
4500
  initialValue,
4489
4501
  meta
4490
4502
  ]);
4491
- React$25.useEffect(() => {
4503
+ React$32.useEffect(() => {
4492
4504
  setOpen(isEditing);
4493
4505
  }, [isEditing]);
4494
- React$25.useEffect(() => {
4506
+ React$32.useEffect(() => {
4495
4507
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4496
4508
  }, [
4497
4509
  isFocused,
@@ -4539,11 +4551,52 @@ function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSel
4539
4551
  });
4540
4552
  }
4541
4553
 
4554
+ //#endregion
4555
+ //#region src/data-grid/cell-variants/download-file-cell.tsx
4556
+ function DownloadFileCell({ cell, table, rowIndex, columnId, isEditing, isFocused, isSelected }) {
4557
+ const cellOpts = cell.column.columnDef.meta?.cell;
4558
+ const downloadCellOpts = cellOpts?.variant === "download-file" ? cellOpts : void 0;
4559
+ const cellValue = cell.getValue();
4560
+ const row = cell.row.original;
4561
+ const resolvedUrl = downloadCellOpts?.getUrl?.(cellValue, row) ?? (typeof cellValue === "string" ? cellValue : void 0);
4562
+ const resolvedFileName = typeof downloadCellOpts?.fileName === "function" ? downloadCellOpts.fileName(row, cellValue) : downloadCellOpts?.fileName;
4563
+ const label = downloadCellOpts?.label ?? "Download";
4564
+ return /* @__PURE__ */ jsx(DataGridCellWrapper, {
4565
+ cell,
4566
+ table,
4567
+ rowIndex,
4568
+ columnId,
4569
+ isEditing,
4570
+ isFocused,
4571
+ isSelected,
4572
+ children: /* @__PURE__ */ jsx("div", {
4573
+ "data-slot": "grid-cell-content",
4574
+ className: "size-full overflow-hidden outline-none",
4575
+ children: resolvedUrl ? /* @__PURE__ */ jsx(Button, {
4576
+ asChild: true,
4577
+ variant: "ghost",
4578
+ size: "sm",
4579
+ className: "h-7 gap-1 px-2",
4580
+ children: /* @__PURE__ */ jsxs("a", {
4581
+ href: resolvedUrl,
4582
+ download: resolvedFileName,
4583
+ target: "_blank",
4584
+ rel: "noreferrer",
4585
+ children: [/* @__PURE__ */ jsx(DownloadIcon, { className: "size-3.5" }), label]
4586
+ })
4587
+ }) : /* @__PURE__ */ jsx("span", {
4588
+ className: "text-muted-foreground",
4589
+ children: "-"
4590
+ })
4591
+ })
4592
+ });
4593
+ }
4594
+
4542
4595
  //#endregion
4543
4596
  //#region src/data-grid/cell-variants/gantt-cell.tsx
4544
4597
  function GanttCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4545
4598
  const initialValue = cell.getValue();
4546
- const containerRef = React$24.useRef(null);
4599
+ const containerRef = React$31.useRef(null);
4547
4600
  const cellOpts = cell.column.columnDef.meta?.cell;
4548
4601
  const ts = cellOpts?.dateRangeFrom ?? cellOpts?.timelineStart;
4549
4602
  const te = cellOpts?.dateRangeTo ?? cellOpts?.timelineEnd;
@@ -4582,19 +4635,19 @@ function GanttCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSe
4582
4635
  //#region src/data-grid/cell-variants/long-text-cell.tsx
4583
4636
  function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4584
4637
  const initialValue = cell.getValue();
4585
- const [value, setValue] = React$23.useState(initialValue ?? "");
4586
- const [open, setOpen] = React$23.useState(false);
4587
- const textareaRef = React$23.useRef(null);
4588
- const containerRef = React$23.useRef(null);
4589
- const hasSubmittedRef = React$23.useRef(false);
4638
+ const [value, setValue] = React$30.useState(initialValue ?? "");
4639
+ const [open, setOpen] = React$30.useState(false);
4640
+ const textareaRef = React$30.useRef(null);
4641
+ const containerRef = React$30.useRef(null);
4642
+ const hasSubmittedRef = React$30.useRef(false);
4590
4643
  const meta = table.options.meta;
4591
4644
  const sideOffset = -(containerRef.current?.clientHeight ?? 0);
4592
- const prevInitialValueRef = React$23.useRef(initialValue);
4645
+ const prevInitialValueRef = React$30.useRef(initialValue);
4593
4646
  if (initialValue !== prevInitialValueRef.current) {
4594
4647
  prevInitialValueRef.current = initialValue;
4595
4648
  setValue(initialValue ?? "");
4596
4649
  }
4597
- React$23.useEffect(() => {
4650
+ React$30.useEffect(() => {
4598
4651
  if (isEditing) hasSubmittedRef.current = false;
4599
4652
  }, [isEditing]);
4600
4653
  const debouncedSave = useDebouncedCallback((newValue) => {
@@ -4604,7 +4657,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4604
4657
  value: newValue
4605
4658
  });
4606
4659
  }, 300);
4607
- const onSave = React$23.useCallback(() => {
4660
+ const onSave = React$30.useCallback(() => {
4608
4661
  if (hasSubmittedRef.current) return;
4609
4662
  hasSubmittedRef.current = true;
4610
4663
  if (value !== initialValue) meta?.onDataUpdate?.({
@@ -4621,7 +4674,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4621
4674
  rowIndex,
4622
4675
  columnId
4623
4676
  ]);
4624
- const onCancel = React$23.useCallback(() => {
4677
+ const onCancel = React$30.useCallback(() => {
4625
4678
  if (hasSubmittedRef.current) return;
4626
4679
  hasSubmittedRef.current = true;
4627
4680
  setValue(initialValue ?? "");
@@ -4638,12 +4691,12 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4638
4691
  rowIndex,
4639
4692
  columnId
4640
4693
  ]);
4641
- const onChange = React$23.useCallback((event) => {
4694
+ const onChange = React$30.useCallback((event) => {
4642
4695
  const newValue = event.target.value;
4643
4696
  setValue(newValue);
4644
4697
  debouncedSave(newValue);
4645
4698
  }, [debouncedSave]);
4646
- const onOpenChange = React$23.useCallback((isOpen) => {
4699
+ const onOpenChange = React$30.useCallback((isOpen) => {
4647
4700
  setOpen(isOpen);
4648
4701
  if (!isOpen && !hasSubmittedRef.current) {
4649
4702
  hasSubmittedRef.current = true;
@@ -4661,7 +4714,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4661
4714
  rowIndex,
4662
4715
  columnId
4663
4716
  ]);
4664
- const onOpenAutoFocus = React$23.useCallback((event) => {
4717
+ const onOpenAutoFocus = React$30.useCallback((event) => {
4665
4718
  event.preventDefault();
4666
4719
  if (textareaRef.current) {
4667
4720
  textareaRef.current.focus();
@@ -4669,7 +4722,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4669
4722
  textareaRef.current.setSelectionRange(length, length);
4670
4723
  }
4671
4724
  }, []);
4672
- const onWrapperKeyDown = React$23.useCallback((event) => {
4725
+ const onWrapperKeyDown = React$30.useCallback((event) => {
4673
4726
  if (isEditing && !open) {
4674
4727
  if (event.key === "Escape") {
4675
4728
  event.preventDefault();
@@ -4695,7 +4748,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4695
4748
  rowIndex,
4696
4749
  columnId
4697
4750
  ]);
4698
- const onTextareaKeyDown = React$23.useCallback((event) => {
4751
+ const onTextareaKeyDown = React$30.useCallback((event) => {
4699
4752
  if (event.key === "Escape") {
4700
4753
  event.preventDefault();
4701
4754
  onCancel();
@@ -4705,7 +4758,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4705
4758
  }
4706
4759
  event.stopPropagation();
4707
4760
  }, [onCancel, onSave]);
4708
- const onTextareaBlur = React$23.useCallback(() => {
4761
+ const onTextareaBlur = React$30.useCallback(() => {
4709
4762
  if (hasSubmittedRef.current) return;
4710
4763
  hasSubmittedRef.current = true;
4711
4764
  if (value !== initialValue) meta?.onDataUpdate?.({
@@ -4722,7 +4775,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4722
4775
  rowIndex,
4723
4776
  columnId
4724
4777
  ]);
4725
- React$23.useEffect(() => {
4778
+ React$30.useEffect(() => {
4726
4779
  if (isEditing && !open) setOpen(true);
4727
4780
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4728
4781
  }, [
@@ -4775,26 +4828,26 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4775
4828
  //#endregion
4776
4829
  //#region src/data-grid/cell-variants/multi-select-cell.tsx
4777
4830
  function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4778
- const cellValue = React$22.useMemo(() => cell.getValue() ?? [], [cell]);
4831
+ const cellValue = React$29.useMemo(() => cell.getValue() ?? [], [cell]);
4779
4832
  const cellId = `${rowIndex}-${columnId}`;
4780
- const prevCellIdRef = React$22.useRef(cellId);
4781
- const [selectedValues, setSelectedValues] = React$22.useState(cellValue);
4782
- const [open, setOpen] = React$22.useState(false);
4783
- const [searchValue, setSearchValue] = React$22.useState("");
4784
- const containerRef = React$22.useRef(null);
4785
- const inputRef = React$22.useRef(null);
4833
+ const prevCellIdRef = React$29.useRef(cellId);
4834
+ const [selectedValues, setSelectedValues] = React$29.useState(cellValue);
4835
+ const [open, setOpen] = React$29.useState(false);
4836
+ const [searchValue, setSearchValue] = React$29.useState("");
4837
+ const containerRef = React$29.useRef(null);
4838
+ const inputRef = React$29.useRef(null);
4786
4839
  const meta = table.options.meta;
4787
4840
  const cellOpts = cell.column.columnDef.meta?.cell;
4788
4841
  const sideOffset = -(containerRef.current?.clientHeight ?? 0);
4789
4842
  const arrayOptions = cellOpts?.variant === "multi-select" ? cellOpts.options : void 0;
4790
4843
  const optionsMap = cellOpts?.variant === "multi-select" ? cellOpts.optionsMap : void 0;
4791
- const arrayOptionsLabelMap = React$22.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
4792
- const getLabel = React$22.useCallback((val) => {
4844
+ const arrayOptionsLabelMap = React$29.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
4845
+ const getLabel = React$29.useCallback((val) => {
4793
4846
  if (optionsMap) return optionsMap.get(val) ?? val;
4794
4847
  if (arrayOptionsLabelMap) return arrayOptionsLabelMap.get(val) ?? val;
4795
4848
  return val;
4796
4849
  }, [optionsMap, arrayOptionsLabelMap]);
4797
- const options = React$22.useMemo(() => {
4850
+ const options = React$29.useMemo(() => {
4798
4851
  if (!isEditing) return [];
4799
4852
  if (arrayOptions) return arrayOptions;
4800
4853
  if (optionsMap) return Array.from(optionsMap.entries()).map(([id, label]) => ({
@@ -4813,10 +4866,10 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4813
4866
  setOpen(false);
4814
4867
  setSearchValue("");
4815
4868
  }
4816
- React$22.useEffect(() => {
4869
+ React$29.useEffect(() => {
4817
4870
  setSelectedValues(cellValue);
4818
4871
  }, [cellValue]);
4819
- const onValueChange = React$22.useCallback((value) => {
4872
+ const onValueChange = React$29.useCallback((value) => {
4820
4873
  const newValues = selectedValues.includes(value) ? selectedValues.filter((v) => v !== value) : [...selectedValues, value];
4821
4874
  setSelectedValues(newValues);
4822
4875
  meta?.onDataUpdate?.({
@@ -4832,7 +4885,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4832
4885
  rowIndex,
4833
4886
  columnId
4834
4887
  ]);
4835
- const removeValue = React$22.useCallback((valueToRemove, event) => {
4888
+ const removeValue = React$29.useCallback((valueToRemove, event) => {
4836
4889
  event?.stopPropagation();
4837
4890
  event?.preventDefault();
4838
4891
  const newValues = selectedValues.filter((v) => v !== valueToRemove);
@@ -4849,7 +4902,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4849
4902
  rowIndex,
4850
4903
  columnId
4851
4904
  ]);
4852
- const clearAll = React$22.useCallback(() => {
4905
+ const clearAll = React$29.useCallback(() => {
4853
4906
  setSelectedValues([]);
4854
4907
  meta?.onDataUpdate?.({
4855
4908
  rowIndex,
@@ -4862,18 +4915,18 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4862
4915
  rowIndex,
4863
4916
  columnId
4864
4917
  ]);
4865
- const onOpenChange = React$22.useCallback((isOpen) => {
4918
+ const onOpenChange = React$29.useCallback((isOpen) => {
4866
4919
  setOpen(isOpen);
4867
4920
  if (!isOpen) {
4868
4921
  setSearchValue("");
4869
4922
  meta?.onCellEditingStop?.();
4870
4923
  }
4871
4924
  }, [meta]);
4872
- const onOpenAutoFocus = React$22.useCallback((event) => {
4925
+ const onOpenAutoFocus = React$29.useCallback((event) => {
4873
4926
  event.preventDefault();
4874
4927
  inputRef.current?.focus();
4875
4928
  }, []);
4876
- const onWrapperKeyDown = React$22.useCallback((event) => {
4929
+ const onWrapperKeyDown = React$29.useCallback((event) => {
4877
4930
  if (isEditing) {
4878
4931
  if (event.key === "Escape") {
4879
4932
  event.preventDefault();
@@ -4893,7 +4946,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4893
4946
  cellValue,
4894
4947
  meta
4895
4948
  ]);
4896
- const onInputKeyDown = React$22.useCallback((event) => {
4949
+ const onInputKeyDown = React$29.useCallback((event) => {
4897
4950
  if (event.key === "Backspace" && searchValue === "" && selectedValues.length > 0) {
4898
4951
  event.preventDefault();
4899
4952
  const lastValue = selectedValues.at(-1);
@@ -4905,7 +4958,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4905
4958
  selectedValues,
4906
4959
  removeValue
4907
4960
  ]);
4908
- React$22.useEffect(() => {
4961
+ React$29.useEffect(() => {
4909
4962
  if (isEditing && !open) setOpen(true);
4910
4963
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4911
4964
  }, [
@@ -4915,7 +4968,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4915
4968
  meta?.searchOpen,
4916
4969
  meta?.isScrolling
4917
4970
  ]);
4918
- React$22.useEffect(() => {
4971
+ React$29.useEffect(() => {
4919
4972
  if (open && inputRef.current) setTimeout(() => inputRef.current?.focus(), 0);
4920
4973
  }, [open]);
4921
4974
  const displayLabels = selectedValues.map(getLabel).filter(Boolean);
@@ -5016,19 +5069,19 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
5016
5069
  //#region src/data-grid/cell-variants/number-cell.tsx
5017
5070
  function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
5018
5071
  const initialValue = cell.getValue();
5019
- const inputRef = React$21.useRef(null);
5020
- const containerRef = React$21.useRef(null);
5072
+ const inputRef = React$28.useRef(null);
5073
+ const containerRef = React$28.useRef(null);
5021
5074
  const meta = table.options.meta;
5022
5075
  const colMeta = cell.column.columnDef.meta;
5023
5076
  const cellOptions = colMeta?.cell;
5024
- const editableResolver = React$21.useMemo(() => {
5077
+ const editableResolver = React$28.useMemo(() => {
5025
5078
  const v = colMeta?.editable;
5026
5079
  if (v === void 0) return () => true;
5027
5080
  return typeof v === "function" ? v : () => Boolean(v);
5028
5081
  }, [colMeta?.editable]);
5029
5082
  const isEditable = editableResolver(cell.row.original);
5030
5083
  const { min, max, step, prefix, suffix, fallbackValue = "" } = cellOptions?.variant === "number" ? cellOptions : {};
5031
- const resolvedPrefix = React$21.useMemo(() => {
5084
+ const resolvedPrefix = React$28.useMemo(() => {
5032
5085
  if (typeof prefix === "function") return prefix(cell.row.original, initialValue);
5033
5086
  return prefix ?? null;
5034
5087
  }, [
@@ -5036,7 +5089,7 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5036
5089
  cell.row.original,
5037
5090
  initialValue
5038
5091
  ]);
5039
- const resolvedSuffix = React$21.useMemo(() => {
5092
+ const resolvedSuffix = React$28.useMemo(() => {
5040
5093
  if (typeof suffix === "function") return suffix(cell.row.original, initialValue);
5041
5094
  return suffix ?? null;
5042
5095
  }, [
@@ -5044,12 +5097,12 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5044
5097
  cell.row.original,
5045
5098
  initialValue
5046
5099
  ]);
5047
- const [editValue, setEditValue] = React$21.useState(initialValue !== null && initialValue !== void 0 ? String(initialValue) : "");
5048
- const hasSubmittedRef = React$21.useRef(false);
5049
- React$21.useEffect(() => {
5100
+ const [editValue, setEditValue] = React$28.useState(initialValue !== null && initialValue !== void 0 ? String(initialValue) : "");
5101
+ const hasSubmittedRef = React$28.useRef(false);
5102
+ React$28.useEffect(() => {
5050
5103
  if (isEditing) hasSubmittedRef.current = false;
5051
5104
  }, [isEditing]);
5052
- const onBlur = React$21.useCallback(() => {
5105
+ const onBlur = React$28.useCallback(() => {
5053
5106
  if (hasSubmittedRef.current) return;
5054
5107
  const numValue = editValue === "" ? null : Number(editValue);
5055
5108
  if (numValue !== initialValue) meta?.onDataUpdate?.({
@@ -5065,13 +5118,13 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5065
5118
  initialValue,
5066
5119
  editValue
5067
5120
  ]);
5068
- const onChange = React$21.useCallback((event) => {
5121
+ const onChange = React$28.useCallback((event) => {
5069
5122
  setEditValue(event.target.value);
5070
5123
  }, []);
5071
- const parseNumValue = React$21.useCallback(() => {
5124
+ const parseNumValue = React$28.useCallback(() => {
5072
5125
  return editValue === "" ? null : Number(editValue);
5073
5126
  }, [editValue]);
5074
- const saveAndStop = React$21.useCallback((options) => {
5127
+ const saveAndStop = React$28.useCallback((options) => {
5075
5128
  hasSubmittedRef.current = true;
5076
5129
  const numValue = parseNumValue();
5077
5130
  meta?.onDataUpdate?.({
@@ -5086,7 +5139,7 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5086
5139
  rowIndex,
5087
5140
  columnId
5088
5141
  ]);
5089
- const handleEditingKeyDown = React$21.useCallback((event) => {
5142
+ const handleEditingKeyDown = React$28.useCallback((event) => {
5090
5143
  if (event.key === "Enter") {
5091
5144
  event.preventDefault();
5092
5145
  saveAndStop({ moveToNextRow: true });
@@ -5105,12 +5158,12 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5105
5158
  initialValue,
5106
5159
  meta
5107
5160
  ]);
5108
- const handleFocusedKeyDown = React$21.useCallback((event) => {
5161
+ const handleFocusedKeyDown = React$28.useCallback((event) => {
5109
5162
  if (!isEditable) return;
5110
5163
  if (event.key === "Backspace") setEditValue("");
5111
5164
  else if (event.key.length === 1 && !event.ctrlKey && !event.metaKey) setEditValue(event.key);
5112
5165
  }, [isEditable]);
5113
- const onWrapperKeyDown = React$21.useCallback((event) => {
5166
+ const onWrapperKeyDown = React$28.useCallback((event) => {
5114
5167
  if (isEditing) handleEditingKeyDown(event);
5115
5168
  else if (isFocused) handleFocusedKeyDown(event);
5116
5169
  }, [
@@ -5119,10 +5172,10 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5119
5172
  handleEditingKeyDown,
5120
5173
  handleFocusedKeyDown
5121
5174
  ]);
5122
- React$21.useEffect(() => {
5175
+ React$28.useEffect(() => {
5123
5176
  setEditValue(initialValue !== null && initialValue !== void 0 ? String(initialValue) : "");
5124
5177
  }, [initialValue]);
5125
- React$21.useEffect(() => {
5178
+ React$28.useEffect(() => {
5126
5179
  if (isEditing && inputRef.current) {
5127
5180
  inputRef.current.focus();
5128
5181
  inputRef.current.select();
@@ -5169,7 +5222,7 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5169
5222
  //#endregion
5170
5223
  //#region src/data-grid/cell-variants/react-node-cell.tsx
5171
5224
  function ReactNodeCell({ cell, table, rowIndex, columnId, isFocused, isSelected, isEditing }) {
5172
- const containerRef = React$20.useRef(null);
5225
+ const containerRef = React$27.useRef(null);
5173
5226
  const cellOpts = cell.column.columnDef.meta?.cell;
5174
5227
  const renderFn = cellOpts?.variant === "react-node" ? cellOpts.render : void 0;
5175
5228
  const children = renderFn ? renderFn({
@@ -5199,17 +5252,17 @@ function ReactNodeCell({ cell, table, rowIndex, columnId, isFocused, isSelected,
5199
5252
  //#region src/data-grid/cell-variants/select-cell.tsx
5200
5253
  function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
5201
5254
  const initialValue = cell.getValue();
5202
- const [value, setValue] = React$19.useState(initialValue);
5203
- const [open, setOpen] = React$19.useState(false);
5204
- const containerRef = React$19.useRef(null);
5205
- const inputRef = React$19.useRef(null);
5255
+ const [value, setValue] = React$26.useState(initialValue);
5256
+ const [open, setOpen] = React$26.useState(false);
5257
+ const containerRef = React$26.useRef(null);
5258
+ const inputRef = React$26.useRef(null);
5206
5259
  const meta = table.options.meta;
5207
5260
  const cellOpts = cell.column.columnDef.meta?.cell;
5208
5261
  const hasSearch = (cellOpts?.variant === "select" && cellOpts?.hasSearch) ?? false;
5209
5262
  const sideOffset = -(inputRef.current?.clientHeight ?? 0);
5210
5263
  const { options: arrayOptions, optionsMap, optionsRenderer } = cellOpts?.variant === "select" ? cellOpts : {};
5211
- const arrayOptionsLabelMap = React$19.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
5212
- const displayLabel = React$19.useMemo(() => {
5264
+ const arrayOptionsLabelMap = React$26.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
5265
+ const displayLabel = React$26.useMemo(() => {
5213
5266
  if (optionsMap) {
5214
5267
  const data = optionsMap.get(value ?? "");
5215
5268
  if (optionsRenderer) return optionsRenderer(data, "cell");
@@ -5223,7 +5276,7 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5223
5276
  arrayOptionsLabelMap,
5224
5277
  optionsRenderer
5225
5278
  ]);
5226
- const options = React$19.useMemo(() => {
5279
+ const options = React$26.useMemo(() => {
5227
5280
  if (!isEditing) return [];
5228
5281
  if (arrayOptions) return arrayOptions.map((opt) => ({
5229
5282
  value: opt.value,
@@ -5239,7 +5292,7 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5239
5292
  arrayOptions,
5240
5293
  optionsMap
5241
5294
  ]);
5242
- const onValueChange = React$19.useCallback((newValue) => {
5295
+ const onValueChange = React$26.useCallback((newValue) => {
5243
5296
  setValue(newValue);
5244
5297
  meta?.onDataUpdate?.({
5245
5298
  rowIndex,
@@ -5252,15 +5305,15 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5252
5305
  rowIndex,
5253
5306
  columnId
5254
5307
  ]);
5255
- const onOpenChange = React$19.useCallback((isOpen) => {
5308
+ const onOpenChange = React$26.useCallback((isOpen) => {
5256
5309
  setOpen(isOpen);
5257
5310
  if (!isOpen) meta?.onCellEditingStop?.();
5258
5311
  }, [meta]);
5259
- const onOpenAutoFocus = React$19.useCallback((event) => {
5312
+ const onOpenAutoFocus = React$26.useCallback((event) => {
5260
5313
  event.preventDefault();
5261
5314
  inputRef.current?.focus();
5262
5315
  }, []);
5263
- const onWrapperKeyDown = React$19.useCallback((event) => {
5316
+ const onWrapperKeyDown = React$26.useCallback((event) => {
5264
5317
  if (isEditing) {
5265
5318
  if (event.key === "Escape") {
5266
5319
  event.preventDefault();
@@ -5278,10 +5331,10 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5278
5331
  initialValue,
5279
5332
  meta
5280
5333
  ]);
5281
- React$19.useEffect(() => {
5334
+ React$26.useEffect(() => {
5282
5335
  setValue(initialValue);
5283
5336
  }, [initialValue]);
5284
- React$19.useEffect(() => {
5337
+ React$26.useEffect(() => {
5285
5338
  if (isEditing && !open) setOpen(true);
5286
5339
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
5287
5340
  }, [
@@ -5366,22 +5419,22 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5366
5419
  //#region src/data-grid/cell-variants/short-text-cell.tsx
5367
5420
  function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused, isSelected }) {
5368
5421
  const initialValue = cell.getValue();
5369
- const [value, setValue] = React$18.useState(initialValue);
5370
- const inputRef = React$18.useRef(null);
5371
- const containerRef = React$18.useRef(null);
5372
- const hasSubmittedRef = React$18.useRef(false);
5422
+ const [value, setValue] = React$25.useState(initialValue);
5423
+ const inputRef = React$25.useRef(null);
5424
+ const containerRef = React$25.useRef(null);
5425
+ const hasSubmittedRef = React$25.useRef(false);
5373
5426
  const meta = table.options.meta;
5374
5427
  const colMeta = cell.column.columnDef.meta;
5375
- const editableResolver = React$18.useMemo(() => {
5428
+ const editableResolver = React$25.useMemo(() => {
5376
5429
  const v = colMeta?.editable;
5377
5430
  if (v === void 0) return () => true;
5378
5431
  return typeof v === "function" ? v : () => Boolean(v);
5379
5432
  }, [colMeta?.editable]);
5380
5433
  const isEditable = editableResolver(cell.row.original);
5381
- React$18.useEffect(() => {
5434
+ React$25.useEffect(() => {
5382
5435
  if (isEditing) hasSubmittedRef.current = false;
5383
5436
  }, [isEditing]);
5384
- const onBlur = React$18.useCallback(() => {
5437
+ const onBlur = React$25.useCallback(() => {
5385
5438
  if (hasSubmittedRef.current) return;
5386
5439
  const currentValue = inputRef.current?.value ?? "";
5387
5440
  const normalizedInitial = initialValue ?? "";
@@ -5397,10 +5450,10 @@ function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused,
5397
5450
  columnId,
5398
5451
  initialValue
5399
5452
  ]);
5400
- const onChange = React$18.useCallback((event) => {
5453
+ const onChange = React$25.useCallback((event) => {
5401
5454
  setValue(event.target.value);
5402
5455
  }, []);
5403
- const handleEditingKeyDown = React$18.useCallback((event) => {
5456
+ const handleEditingKeyDown = React$25.useCallback((event) => {
5404
5457
  if (event.key === "Enter") {
5405
5458
  event.preventDefault();
5406
5459
  hasSubmittedRef.current = true;
@@ -5434,13 +5487,13 @@ function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused,
5434
5487
  rowIndex,
5435
5488
  columnId
5436
5489
  ]);
5437
- const handleFocusedKeyDown = React$18.useCallback((event) => {
5490
+ const handleFocusedKeyDown = React$25.useCallback((event) => {
5438
5491
  if (event.key.length === 1 && !event.ctrlKey && !event.metaKey) {
5439
5492
  if (!isEditable) return;
5440
5493
  setValue(event.key);
5441
5494
  }
5442
5495
  }, [isEditable]);
5443
- const onWrapperKeyDown = React$18.useCallback((event) => {
5496
+ const onWrapperKeyDown = React$25.useCallback((event) => {
5444
5497
  if (isEditing) handleEditingKeyDown(event);
5445
5498
  else if (isFocused) handleFocusedKeyDown(event);
5446
5499
  }, [
@@ -5449,10 +5502,10 @@ function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused,
5449
5502
  handleEditingKeyDown,
5450
5503
  handleFocusedKeyDown
5451
5504
  ]);
5452
- React$18.useEffect(() => {
5505
+ React$25.useEffect(() => {
5453
5506
  setValue(initialValue);
5454
5507
  }, [initialValue]);
5455
- React$18.useEffect(() => {
5508
+ React$25.useEffect(() => {
5456
5509
  if (isEditing && inputRef.current) {
5457
5510
  inputRef.current.focus();
5458
5511
  inputRef.current.setSelectionRange(inputRef.current.value.length, inputRef.current.value.length);
@@ -5576,6 +5629,15 @@ function DataGridCell({ cell, table }) {
5576
5629
  isFocused,
5577
5630
  isSelected
5578
5631
  });
5632
+ case "download-file": return /* @__PURE__ */ jsx(DownloadFileCell, {
5633
+ cell,
5634
+ table,
5635
+ rowIndex,
5636
+ columnId,
5637
+ isEditing,
5638
+ isFocused,
5639
+ isSelected
5640
+ });
5579
5641
  case "react-node": return /* @__PURE__ */ jsx(ReactNodeCell, {
5580
5642
  cell,
5581
5643
  table,
@@ -5608,7 +5670,7 @@ function DataGridCell({ cell, table }) {
5608
5670
 
5609
5671
  //#endregion
5610
5672
  //#region src/separator/separator.tsx
5611
- const Separator = React$17.forwardRef(({ className, orientation = "horizontal", decorative = true,...props }, ref) => /* @__PURE__ */ jsx(SeparatorPrimitive.Root, {
5673
+ const Separator = React$24.forwardRef(({ className, orientation = "horizontal", decorative = true,...props }, ref) => /* @__PURE__ */ jsx(SeparatorPrimitive.Root, {
5612
5674
  ref,
5613
5675
  decorative,
5614
5676
  orientation,
@@ -5620,22 +5682,22 @@ Separator.displayName = SeparatorPrimitive.Root.displayName;
5620
5682
  //#endregion
5621
5683
  //#region src/data-grid/data-grid-view-menu.tsx
5622
5684
  function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAdmin, onApplyView, onSaveView, onUpdateView, onRenameView, onDeleteView, onClearView,...props }) {
5623
- const viewableColumns = React$16.useMemo(() => table.getAllColumns().filter((column) => typeof column.accessorFn !== "undefined"), [table]);
5624
- const [order, setOrder] = React$16.useState(() => {
5685
+ const viewableColumns = React$23.useMemo(() => table.getAllColumns().filter((column) => typeof column.accessorFn !== "undefined"), [table]);
5686
+ const [order, setOrder] = React$23.useState(() => {
5625
5687
  const stateOrder = table.getState().columnOrder ?? [];
5626
5688
  if (stateOrder && stateOrder.length > 0) return stateOrder;
5627
5689
  return table.getAllColumns().map((c) => c.id);
5628
5690
  });
5629
- const [searchQuery, setSearchQuery] = React$16.useState("");
5630
- const [isDragging, setIsDragging] = React$16.useState(false);
5631
- const [insertionIndex, setInsertionIndex] = React$16.useState(null);
5632
- const [isCreating, setIsCreating] = React$16.useState(false);
5633
- const [newViewName, setNewViewName] = React$16.useState("");
5634
- const [newViewGlobal, setNewViewGlobal] = React$16.useState(false);
5635
- const [renamingViewId, setRenamingViewId] = React$16.useState(null);
5636
- const [renameValue, setRenameValue] = React$16.useState("");
5637
- const [deletingViewId, setDeletingViewId] = React$16.useState(null);
5638
- const [updatingViewId, setUpdatingViewId] = React$16.useState(null);
5691
+ const [searchQuery, setSearchQuery] = React$23.useState("");
5692
+ const [isDragging, setIsDragging] = React$23.useState(false);
5693
+ const [insertionIndex, setInsertionIndex] = React$23.useState(null);
5694
+ const [isCreating, setIsCreating] = React$23.useState(false);
5695
+ const [newViewName, setNewViewName] = React$23.useState("");
5696
+ const [newViewGlobal, setNewViewGlobal] = React$23.useState(false);
5697
+ const [renamingViewId, setRenamingViewId] = React$23.useState(null);
5698
+ const [renameValue, setRenameValue] = React$23.useState("");
5699
+ const [deletingViewId, setDeletingViewId] = React$23.useState(null);
5700
+ const [updatingViewId, setUpdatingViewId] = React$23.useState(null);
5639
5701
  function resetAllStates() {
5640
5702
  setIsCreating(false);
5641
5703
  setNewViewName("");
@@ -5646,7 +5708,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5646
5708
  setSearchQuery("");
5647
5709
  }
5648
5710
  const tableColumnOrder = table.getState().columnOrder;
5649
- React$16.useEffect(() => {
5711
+ React$23.useEffect(() => {
5650
5712
  const stateOrder = tableColumnOrder ?? [];
5651
5713
  if (stateOrder && stateOrder.length > 0) {
5652
5714
  setOrder(stateOrder);
@@ -5654,8 +5716,8 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5654
5716
  }
5655
5717
  setOrder(table.getAllColumns().map((c) => c.id));
5656
5718
  }, [table, tableColumnOrder]);
5657
- const visibleSet = React$16.useMemo(() => new Set(viewableColumns.map((c) => c.id)), [viewableColumns]);
5658
- const orderedColumns = React$16.useMemo(() => {
5719
+ const visibleSet = React$23.useMemo(() => new Set(viewableColumns.map((c) => c.id)), [viewableColumns]);
5720
+ const orderedColumns = React$23.useMemo(() => {
5659
5721
  const ordered = [];
5660
5722
  for (const id of order) {
5661
5723
  const col = viewableColumns.find((c) => c.id === id);
@@ -5668,12 +5730,12 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5668
5730
  viewableColumns,
5669
5731
  table
5670
5732
  ]);
5671
- const draggingRef = React$16.useRef(null);
5672
- const groupRef = React$16.useRef(null);
5673
- const getBaseOrder = React$16.useCallback(() => {
5733
+ const draggingRef = React$23.useRef(null);
5734
+ const groupRef = React$23.useRef(null);
5735
+ const getBaseOrder = React$23.useCallback(() => {
5674
5736
  return table.getState().columnOrder && table.getState().columnOrder.length ? table.getState().columnOrder.slice() : table.getAllColumns().map((c) => c.id);
5675
5737
  }, [table]);
5676
- const computeInsertionIndex = React$16.useCallback((clientY) => {
5738
+ const computeInsertionIndex = React$23.useCallback((clientY) => {
5677
5739
  const baseOrder = getBaseOrder();
5678
5740
  const el = groupRef.current;
5679
5741
  if (!el) return baseOrder.length;
@@ -5695,7 +5757,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5695
5757
  setIsDragging(false);
5696
5758
  setInsertionIndex(null);
5697
5759
  }
5698
- const doDrop = React$16.useCallback((dragId, toIndex) => {
5760
+ const doDrop = React$23.useCallback((dragId, toIndex) => {
5699
5761
  const baseOrder = table.getState().columnOrder && table.getState().columnOrder.length ? table.getState().columnOrder.slice() : table.getAllColumns().map((c) => c.id);
5700
5762
  const fromIndex = baseOrder.indexOf(dragId);
5701
5763
  if (fromIndex === -1) {
@@ -5712,7 +5774,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5712
5774
  setOrder(copy.filter((id) => visibleSet.has(id)));
5713
5775
  onDragEnd();
5714
5776
  }, [table, visibleSet]);
5715
- const startPointerDrag = React$16.useCallback((e, id) => {
5777
+ const startPointerDrag = React$23.useCallback((e, id) => {
5716
5778
  e.preventDefault();
5717
5779
  draggingRef.current = id;
5718
5780
  setIsDragging(true);
@@ -5745,7 +5807,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5745
5807
  if (fromIndex < targetIndex) insertAt = targetIndex - 1;
5746
5808
  return insertAt === fromIndex;
5747
5809
  }
5748
- const dragFromHandle = React$16.useRef(false);
5810
+ const dragFromHandle = React$23.useRef(false);
5749
5811
  function resetTableView() {
5750
5812
  const defaultOrder = table.getAllColumns().map((c) => c.id);
5751
5813
  try {
@@ -5768,7 +5830,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5768
5830
  } catch (_) {}
5769
5831
  }
5770
5832
  }
5771
- const sortedViews = React$16.useMemo(() => {
5833
+ const sortedViews = React$23.useMemo(() => {
5772
5834
  if (!savedViews || savedViews.length === 0) return savedViews;
5773
5835
  return [...savedViews].sort((a, b) => {
5774
5836
  if (a.isGlobal !== b.isGlobal) return a.isGlobal ? -1 : 1;
@@ -6084,7 +6146,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
6084
6146
  const currentBase = table.getState().columnOrder && table.getState().columnOrder.length ? table.getState().columnOrder.slice() : table.getAllColumns().map((c) => c.id);
6085
6147
  const pos = currentBase.indexOf(column.id);
6086
6148
  const isHideable = column.getCanHide();
6087
- return /* @__PURE__ */ jsxs(React$16.Fragment, { children: [/* @__PURE__ */ jsxs(CommandItem, {
6149
+ return /* @__PURE__ */ jsxs(React$23.Fragment, { children: [/* @__PURE__ */ jsxs(CommandItem, {
6088
6150
  value: column.id,
6089
6151
  "data-col-id": column.id,
6090
6152
  className: cn("flex items-center gap-2 px-2 py-1 rounded", !isDragging ? "data-[selected=true]:bg-accent" : "data-[selected=true]:bg-transparent cursor-grabbing", draggingRef.current === column.id && isDragging && "bg-accent data-[selected=true]:bg-accent"),
@@ -6206,33 +6268,33 @@ const MIN_COLUMN_SIZE = 60;
6206
6268
  const MAX_COLUMN_SIZE = 800;
6207
6269
  const SEARCH_SHORTCUT_KEY = "f";
6208
6270
  const NON_NAVIGABLE_COLUMN_IDS = ["select", "actions"];
6209
- const useIsomorphicLayoutEffect = typeof window !== "undefined" ? React$15.useLayoutEffect : React$15.useEffect;
6210
- function useLazyRef(fn) {
6211
- const ref = React$15.useRef(null);
6271
+ const useIsomorphicLayoutEffect$1 = typeof window !== "undefined" ? React$22.useLayoutEffect : React$22.useEffect;
6272
+ function useLazyRef$1(fn) {
6273
+ const ref = React$22.useRef(null);
6212
6274
  if (ref.current === null) ref.current = fn();
6213
6275
  return ref;
6214
6276
  }
6215
- function useAsRef(data) {
6216
- const ref = React$15.useRef(data);
6217
- useIsomorphicLayoutEffect(() => {
6277
+ function useAsRef$1(data) {
6278
+ const ref = React$22.useRef(data);
6279
+ useIsomorphicLayoutEffect$1(() => {
6218
6280
  ref.current = data;
6219
6281
  });
6220
6282
  return ref;
6221
6283
  }
6222
- function useStore(store, selector) {
6223
- const getSnapshot = React$15.useCallback(() => selector(store.getState()), [store, selector]);
6224
- return React$15.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
6284
+ function useStore$1(store, selector) {
6285
+ const getSnapshot = React$22.useCallback(() => selector(store.getState()), [store, selector]);
6286
+ return React$22.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
6225
6287
  }
6226
6288
  function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRowsDelete: onRowsDeleteProp, onCellFocus: onCellFocusProp, onRowClick: onRowClickProp, highlightedRowIndex, rowHeight: rowHeightProp = DEFAULT_ROW_HEIGHT, overscan = OVERSCAN, initialState, autoFocus = false, enableColumnSelection = false, enableSearch = false, manualSorting, sorting: externalSorting, onSortingChange: externalOnSortingChange, onLoadMore, loadMoreThreshold = 25, totalRowCount, persistColumnState = false,...dataGridProps }) {
6227
- const dataGridRef = React$15.useRef(null);
6228
- const tableRef = React$15.useRef(null);
6229
- const rowVirtualizerRef = React$15.useRef(null);
6230
- const headerRef = React$15.useRef(null);
6231
- const rowMapRef = React$15.useRef(new Map());
6232
- const footerRef = React$15.useRef(null);
6233
- const dataGridPropsRef = useAsRef(dataGridProps);
6234
- const listenersRef = useLazyRef(() => new Set());
6235
- const stateRef = useLazyRef(() => {
6289
+ const dataGridRef = React$22.useRef(null);
6290
+ const tableRef = React$22.useRef(null);
6291
+ const rowVirtualizerRef = React$22.useRef(null);
6292
+ const headerRef = React$22.useRef(null);
6293
+ const rowMapRef = React$22.useRef(new Map());
6294
+ const footerRef = React$22.useRef(null);
6295
+ const dataGridPropsRef = useAsRef$1(dataGridProps);
6296
+ const listenersRef = useLazyRef$1(() => new Set());
6297
+ const stateRef = useLazyRef$1(() => {
6236
6298
  return {
6237
6299
  sorting: initialState?.sorting ?? [],
6238
6300
  rowHeight: rowHeightProp,
@@ -6257,7 +6319,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6257
6319
  isScrolling: false
6258
6320
  };
6259
6321
  });
6260
- const store = React$15.useMemo(() => {
6322
+ const store = React$22.useMemo(() => {
6261
6323
  let isBatching = false;
6262
6324
  let pendingNotification = false;
6263
6325
  return {
@@ -6301,43 +6363,43 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6301
6363
  }
6302
6364
  };
6303
6365
  }, [listenersRef, stateRef]);
6304
- React$15.useEffect(() => {
6366
+ React$22.useEffect(() => {
6305
6367
  store.setState("rowHeight", rowHeightProp);
6306
6368
  }, [rowHeightProp, store]);
6307
- const focusedCell = useStore(store, (state) => state.focusedCell);
6308
- const editingCell = useStore(store, (state) => state.editingCell);
6309
- const selectionState = useStore(store, (state) => state.selectionState);
6310
- const searchQuery = useStore(store, (state) => state.searchQuery);
6311
- const searchMatches = useStore(store, (state) => state.searchMatches);
6312
- const matchIndex = useStore(store, (state) => state.matchIndex);
6313
- const searchOpen = useStore(store, (state) => state.searchOpen);
6314
- const sorting = useStore(store, (state) => state.sorting);
6315
- const rowSelection = useStore(store, (state) => state.rowSelection);
6316
- const contextMenu = useStore(store, (state) => state.contextMenu);
6317
- const rowHeight = useStore(store, (state) => state.rowHeight);
6318
- const isScrolling = useStore(store, (state) => state.isScrolling);
6369
+ const focusedCell = useStore$1(store, (state) => state.focusedCell);
6370
+ const editingCell = useStore$1(store, (state) => state.editingCell);
6371
+ const selectionState = useStore$1(store, (state) => state.selectionState);
6372
+ const searchQuery = useStore$1(store, (state) => state.searchQuery);
6373
+ const searchMatches = useStore$1(store, (state) => state.searchMatches);
6374
+ const matchIndex = useStore$1(store, (state) => state.matchIndex);
6375
+ const searchOpen = useStore$1(store, (state) => state.searchOpen);
6376
+ const sorting = useStore$1(store, (state) => state.sorting);
6377
+ const rowSelection = useStore$1(store, (state) => state.rowSelection);
6378
+ const contextMenu = useStore$1(store, (state) => state.contextMenu);
6379
+ const rowHeight = useStore$1(store, (state) => state.rowHeight);
6380
+ const isScrolling = useStore$1(store, (state) => state.isScrolling);
6319
6381
  const rowHeightValue = getRowHeightValue(rowHeight);
6320
- const columnIds = React$15.useMemo(() => {
6382
+ const columnIds = React$22.useMemo(() => {
6321
6383
  return columns.map((c) => {
6322
6384
  if (c.id) return c.id;
6323
6385
  if ("accessorKey" in c) return c.accessorKey;
6324
6386
  return void 0;
6325
6387
  }).filter((id) => Boolean(id));
6326
6388
  }, [columns]);
6327
- const columnDefsVersionRef = React$15.useRef(0);
6328
- const prevColumnsRef = React$15.useRef(columns);
6389
+ const columnDefsVersionRef = React$22.useRef(0);
6390
+ const prevColumnsRef = React$22.useRef(columns);
6329
6391
  if (prevColumnsRef.current !== columns) {
6330
6392
  prevColumnsRef.current = columns;
6331
6393
  columnDefsVersionRef.current += 1;
6332
6394
  }
6333
6395
  const columnDefsVersion = columnDefsVersionRef.current;
6334
- const storageKey = React$15.useMemo(() => {
6396
+ const storageKey = React$22.useMemo(() => {
6335
6397
  if (!persistColumnState || typeof window === "undefined") return void 0;
6336
6398
  const path = globalThis.location?.pathname ?? "unknown";
6337
6399
  const cols = columnIds.join("|");
6338
6400
  return `pxl.dataGrid:${path}:${cols}`;
6339
6401
  }, [columnIds, persistColumnState]);
6340
- const persistedState = React$15.useMemo(() => {
6402
+ const persistedState = React$22.useMemo(() => {
6341
6403
  if (!storageKey) return void 0;
6342
6404
  try {
6343
6405
  const raw = localStorage.getItem(storageKey);
@@ -6348,7 +6410,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6348
6410
  return void 0;
6349
6411
  }
6350
6412
  }, [storageKey]);
6351
- const mergedInitialState = React$15.useMemo(() => {
6413
+ const mergedInitialState = React$22.useMemo(() => {
6352
6414
  const base = { ...initialState ?? {} };
6353
6415
  if (persistedState) try {
6354
6416
  if (persistedState.columnOrder) base.columnOrder = persistedState.columnOrder;
@@ -6357,12 +6419,12 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6357
6419
  } catch (_) {}
6358
6420
  return base;
6359
6421
  }, [initialState, persistedState]);
6360
- const getNavigableColumnIds = React$15.useCallback(() => {
6422
+ const getNavigableColumnIds = React$22.useCallback(() => {
6361
6423
  const t = tableRef.current;
6362
6424
  if (t) return t.getVisibleLeafColumns().map((c) => c.id).filter((c) => !NON_NAVIGABLE_COLUMN_IDS.includes(c));
6363
6425
  return columnIds.filter((c) => !NON_NAVIGABLE_COLUMN_IDS.includes(c));
6364
6426
  }, [columnIds]);
6365
- const onDataUpdate = React$15.useCallback((updates) => {
6427
+ const onDataUpdate = React$22.useCallback((updates) => {
6366
6428
  const updateArray = Array.isArray(updates) ? updates : [updates];
6367
6429
  if (updateArray.length === 0) return;
6368
6430
  const currentTable = tableRef.current;
@@ -6410,10 +6472,10 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6410
6472
  });
6411
6473
  onDataChange?.(newData);
6412
6474
  }, [data, onDataChange]);
6413
- const getIsCellSelected = React$15.useCallback((rowIndex, columnId) => {
6475
+ const getIsCellSelected = React$22.useCallback((rowIndex, columnId) => {
6414
6476
  return selectionState.selectedCells.has(getCellKey(rowIndex, columnId));
6415
6477
  }, [selectionState.selectedCells]);
6416
- const clearSelection = React$15.useCallback(() => {
6478
+ const clearSelection = React$22.useCallback(() => {
6417
6479
  store.batch(() => {
6418
6480
  store.setState("selectionState", {
6419
6481
  selectedCells: new Set(),
@@ -6423,7 +6485,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6423
6485
  store.setState("rowSelection", {});
6424
6486
  });
6425
6487
  }, [store]);
6426
- const selectAll = React$15.useCallback(() => {
6488
+ const selectAll = React$22.useCallback(() => {
6427
6489
  const allCells = new Set();
6428
6490
  const currentTable = tableRef.current;
6429
6491
  const rows = currentTable?.getRowModel().rows ?? [];
@@ -6450,7 +6512,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6450
6512
  data.length,
6451
6513
  store
6452
6514
  ]);
6453
- const selectColumn = React$15.useCallback((columnId) => {
6515
+ const selectColumn = React$22.useCallback((columnId) => {
6454
6516
  const currentTable = tableRef.current;
6455
6517
  const rows = currentTable?.getRowModel().rows ?? [];
6456
6518
  const rowCount = rows.length ?? data.length;
@@ -6472,7 +6534,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6472
6534
  isSelecting: false
6473
6535
  });
6474
6536
  }, [data.length, store]);
6475
- const selectRange = React$15.useCallback((start, end, isSelecting = false) => {
6537
+ const selectRange = React$22.useCallback((start, end, isSelecting = false) => {
6476
6538
  const visibleCols = getNavigableColumnIds();
6477
6539
  const startColIndex = visibleCols.indexOf(start.columnId);
6478
6540
  const endColIndex = visibleCols.indexOf(end.columnId);
@@ -6494,7 +6556,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6494
6556
  isSelecting
6495
6557
  });
6496
6558
  }, [getNavigableColumnIds, store]);
6497
- const focusCell = React$15.useCallback((rowIndex, columnId) => {
6559
+ const focusCell = React$22.useCallback((rowIndex, columnId) => {
6498
6560
  store.batch(() => {
6499
6561
  store.setState("focusedCell", {
6500
6562
  rowIndex,
@@ -6510,7 +6572,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6510
6572
  if (currentState.searchOpen) return;
6511
6573
  if (dataGridRef.current && document.activeElement !== dataGridRef.current) dataGridRef.current.focus();
6512
6574
  }, [store, onCellFocusProp]);
6513
- const onRowsDelete = React$15.useCallback(async (rowIndices) => {
6575
+ const onRowsDelete = React$22.useCallback(async (rowIndices) => {
6514
6576
  if (!onRowsDeleteProp || rowIndices.length === 0) return;
6515
6577
  const currentTable = tableRef.current;
6516
6578
  const rows = currentTable?.getRowModel().rows;
@@ -6562,7 +6624,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6562
6624
  const debouncedRowClick = useDebouncedCallback((rowIndex) => {
6563
6625
  onRowClickProp?.(rowIndex);
6564
6626
  }, 300);
6565
- const navigateCell = React$15.useCallback((direction) => {
6627
+ const navigateCell = React$22.useCallback((direction) => {
6566
6628
  const currentState = store.getState();
6567
6629
  if (!currentState.focusedCell) return;
6568
6630
  const { rowIndex, columnId } = currentState.focusedCell;
@@ -6692,7 +6754,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6692
6754
  onRowClickProp,
6693
6755
  debouncedRowClick
6694
6756
  ]);
6695
- const onCellEditingStart = React$15.useCallback((rowIndex, columnId) => {
6757
+ const onCellEditingStart = React$22.useCallback((rowIndex, columnId) => {
6696
6758
  const col = tableRef.current?.getColumn(columnId);
6697
6759
  const editable = col?.columnDef?.meta?.editable;
6698
6760
  if (editable === false) return;
@@ -6711,7 +6773,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6711
6773
  });
6712
6774
  });
6713
6775
  }, [store]);
6714
- const onCellEditingStop = React$15.useCallback((opts) => {
6776
+ const onCellEditingStop = React$22.useCallback((opts) => {
6715
6777
  const currentState = store.getState();
6716
6778
  const currentEditing = currentState.editingCell;
6717
6779
  store.setState("editingCell", null);
@@ -6737,7 +6799,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6737
6799
  focusCell,
6738
6800
  navigateCell
6739
6801
  ]);
6740
- const onSearchOpenChange = React$15.useCallback((open) => {
6802
+ const onSearchOpenChange = React$22.useCallback((open) => {
6741
6803
  if (open) {
6742
6804
  store.setState("searchOpen", true);
6743
6805
  return;
@@ -6756,7 +6818,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6756
6818
  });
6757
6819
  if (dataGridRef.current && document.activeElement !== dataGridRef.current) dataGridRef.current.focus();
6758
6820
  }, [store]);
6759
- const onSearch = React$15.useCallback((query) => {
6821
+ const onSearch = React$22.useCallback((query) => {
6760
6822
  if (!query.trim()) {
6761
6823
  store.batch(() => {
6762
6824
  store.setState("searchMatches", []);
@@ -6791,8 +6853,8 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6791
6853
  rowVirtualizerRef.current?.scrollToIndex(firstMatch.rowIndex, { align: "center" });
6792
6854
  }
6793
6855
  }, [columnIds, store]);
6794
- const onSearchQueryChange = React$15.useCallback((query) => store.setState("searchQuery", query), [store]);
6795
- const onNavigateToPrevMatch = React$15.useCallback(() => {
6856
+ const onSearchQueryChange = React$22.useCallback((query) => store.setState("searchQuery", query), [store]);
6857
+ const onNavigateToPrevMatch = React$22.useCallback(() => {
6796
6858
  const currentState = store.getState();
6797
6859
  if (currentState.searchMatches.length === 0) return;
6798
6860
  const prevIndex = currentState.matchIndex - 1 < 0 ? currentState.searchMatches.length - 1 : currentState.matchIndex - 1;
@@ -6807,7 +6869,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6807
6869
  });
6808
6870
  }
6809
6871
  }, [store, focusCell]);
6810
- const onNavigateToNextMatch = React$15.useCallback(() => {
6872
+ const onNavigateToNextMatch = React$22.useCallback(() => {
6811
6873
  const currentState = store.getState();
6812
6874
  if (currentState.searchMatches.length === 0) return;
6813
6875
  const nextIndex = (currentState.matchIndex + 1) % currentState.searchMatches.length;
@@ -6822,15 +6884,15 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6822
6884
  });
6823
6885
  }
6824
6886
  }, [store, focusCell]);
6825
- const getIsSearchMatch = React$15.useCallback((rowIndex, columnId) => {
6887
+ const getIsSearchMatch = React$22.useCallback((rowIndex, columnId) => {
6826
6888
  return searchMatches.some((match) => match.rowIndex === rowIndex && match.columnId === columnId);
6827
6889
  }, [searchMatches]);
6828
- const getIsActiveSearchMatch = React$15.useCallback((rowIndex, columnId) => {
6890
+ const getIsActiveSearchMatch = React$22.useCallback((rowIndex, columnId) => {
6829
6891
  if (matchIndex < 0) return false;
6830
6892
  const currentMatch = searchMatches[matchIndex];
6831
6893
  return currentMatch?.rowIndex === rowIndex && currentMatch?.columnId === columnId;
6832
6894
  }, [searchMatches, matchIndex]);
6833
- const blurCell = React$15.useCallback(() => {
6895
+ const blurCell = React$22.useCallback(() => {
6834
6896
  const currentState = store.getState();
6835
6897
  if (currentState.editingCell && document.activeElement instanceof HTMLElement) document.activeElement.blur();
6836
6898
  store.batch(() => {
@@ -6838,7 +6900,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6838
6900
  store.setState("editingCell", null);
6839
6901
  });
6840
6902
  }, [store]);
6841
- const onCellClick = React$15.useCallback((rowIndex, columnId, event) => {
6903
+ const onCellClick = React$22.useCallback((rowIndex, columnId, event) => {
6842
6904
  if (event?.button === 2) return;
6843
6905
  const currentState = store.getState();
6844
6906
  const currentFocused = currentState.focusedCell;
@@ -6886,11 +6948,11 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6886
6948
  selectRange,
6887
6949
  clearSelection
6888
6950
  ]);
6889
- const onCellDoubleClick = React$15.useCallback((rowIndex, columnId, event) => {
6951
+ const onCellDoubleClick = React$22.useCallback((rowIndex, columnId, event) => {
6890
6952
  if (event?.defaultPrevented) return;
6891
6953
  onCellEditingStart(rowIndex, columnId);
6892
6954
  }, [onCellEditingStart]);
6893
- const onCellMouseDown = React$15.useCallback((rowIndex, columnId, event) => {
6955
+ const onCellMouseDown = React$22.useCallback((rowIndex, columnId, event) => {
6894
6956
  if (event.button === 2) return;
6895
6957
  event.preventDefault();
6896
6958
  if (!event.ctrlKey && !event.metaKey && !event.shiftKey) store.batch(() => {
@@ -6911,7 +6973,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6911
6973
  store.setState("rowSelection", {});
6912
6974
  });
6913
6975
  }, [store]);
6914
- const onCellMouseEnter = React$15.useCallback((rowIndex, columnId, _event) => {
6976
+ const onCellMouseEnter = React$22.useCallback((rowIndex, columnId, _event) => {
6915
6977
  const currentState = store.getState();
6916
6978
  if (currentState.selectionState.isSelecting && currentState.selectionState.selectionRange) {
6917
6979
  const start = currentState.selectionState.selectionRange.start;
@@ -6927,14 +6989,14 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6927
6989
  selectRange,
6928
6990
  focusCell
6929
6991
  ]);
6930
- const onCellMouseUp = React$15.useCallback(() => {
6992
+ const onCellMouseUp = React$22.useCallback(() => {
6931
6993
  const currentState = store.getState();
6932
6994
  store.setState("selectionState", {
6933
6995
  ...currentState.selectionState,
6934
6996
  isSelecting: false
6935
6997
  });
6936
6998
  }, [store]);
6937
- const onCellContextMenu = React$15.useCallback((rowIndex, columnId, event) => {
6999
+ const onCellContextMenu = React$22.useCallback((rowIndex, columnId, event) => {
6938
7000
  event.preventDefault();
6939
7001
  event.stopPropagation();
6940
7002
  const currentState = store.getState();
@@ -6966,7 +7028,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6966
7028
  y: event.clientY
6967
7029
  });
6968
7030
  }, [store]);
6969
- const onContextMenuOpenChange = React$15.useCallback((open) => {
7031
+ const onContextMenuOpenChange = React$22.useCallback((open) => {
6970
7032
  if (!open) {
6971
7033
  const currentMenu = store.getState().contextMenu;
6972
7034
  store.setState("contextMenu", {
@@ -6976,7 +7038,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6976
7038
  });
6977
7039
  }
6978
7040
  }, [store]);
6979
- const onDataGridKeyDown = React$15.useCallback((event) => {
7041
+ const onDataGridKeyDown = React$22.useCallback((event) => {
6980
7042
  const currentState = store.getState();
6981
7043
  const { key, ctrlKey, metaKey, shiftKey } = event;
6982
7044
  const isCtrlPressed = ctrlKey || metaKey;
@@ -7135,7 +7197,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7135
7197
  enableSearch,
7136
7198
  onCellEditingStart
7137
7199
  ]);
7138
- const onSortingChange = React$15.useCallback((updater) => {
7200
+ const onSortingChange = React$22.useCallback((updater) => {
7139
7201
  if (manualSorting && externalOnSortingChange) externalOnSortingChange(updater);
7140
7202
  else {
7141
7203
  const currentState = store.getState();
@@ -7147,7 +7209,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7147
7209
  manualSorting,
7148
7210
  externalOnSortingChange
7149
7211
  ]);
7150
- const onRowSelectionChange = React$15.useCallback((updater) => {
7212
+ const onRowSelectionChange = React$22.useCallback((updater) => {
7151
7213
  const currentState = store.getState();
7152
7214
  const newRowSelection = typeof updater === "function" ? updater(currentState.rowSelection) : updater;
7153
7215
  const selectedRows = Object.keys(newRowSelection).filter((key) => newRowSelection[key]);
@@ -7169,7 +7231,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7169
7231
  store.setState("editingCell", null);
7170
7232
  });
7171
7233
  }, [store, columnIds]);
7172
- const onRowSelect = React$15.useCallback((rowIndex, selected, shiftKey) => {
7234
+ const onRowSelect = React$22.useCallback((rowIndex, selected, shiftKey) => {
7173
7235
  const currentState = store.getState();
7174
7236
  const rows = tableRef.current?.getRowModel().rows ?? [];
7175
7237
  const currentRow = rows[rowIndex];
@@ -7189,12 +7251,12 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7189
7251
  });
7190
7252
  store.setState("lastClickedRowIndex", rowIndex);
7191
7253
  }, [store, onRowSelectionChange]);
7192
- const onRowHeightChange = React$15.useCallback((updater) => {
7254
+ const onRowHeightChange = React$22.useCallback((updater) => {
7193
7255
  const currentState = store.getState();
7194
7256
  const newRowHeight = typeof updater === "function" ? updater(currentState.rowHeight) : updater;
7195
7257
  store.setState("rowHeight", newRowHeight);
7196
7258
  }, [store]);
7197
- const onColumnClick = React$15.useCallback((columnId) => {
7259
+ const onColumnClick = React$22.useCallback((columnId) => {
7198
7260
  if (!enableColumnSelection) {
7199
7261
  clearSelection();
7200
7262
  return;
@@ -7205,13 +7267,13 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7205
7267
  selectColumn,
7206
7268
  clearSelection
7207
7269
  ]);
7208
- const defaultColumn = React$15.useMemo(() => ({
7270
+ const defaultColumn = React$22.useMemo(() => ({
7209
7271
  cell: DataGridCell,
7210
7272
  minSize: MIN_COLUMN_SIZE,
7211
7273
  maxSize: MAX_COLUMN_SIZE
7212
7274
  }), []);
7213
7275
  const effectiveSorting = manualSorting && externalSorting ? externalSorting : sorting;
7214
- const tableOptions = React$15.useMemo(() => ({
7276
+ const tableOptions = React$22.useMemo(() => ({
7215
7277
  ...dataGridPropsRef.current,
7216
7278
  data,
7217
7279
  columns,
@@ -7303,7 +7365,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7303
7365
  if (!tableRef.current) tableRef.current = table;
7304
7366
  const columnSizing = table.getState().columnSizing;
7305
7367
  const columnVisibility = table.getState().columnVisibility;
7306
- const columnSizeVars = React$15.useMemo(() => {
7368
+ const columnSizeVars = React$22.useMemo(() => {
7307
7369
  const headers = table.getFlatHeaders();
7308
7370
  const colSizes = {};
7309
7371
  for (const header of headers) {
@@ -7345,7 +7407,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7345
7407
  }
7346
7408
  });
7347
7409
  if (!rowVirtualizerRef.current) rowVirtualizerRef.current = rowVirtualizer;
7348
- const onScrollToRow = React$15.useCallback((opts) => {
7410
+ const onScrollToRow = React$22.useCallback((opts) => {
7349
7411
  const rowIndex = opts?.rowIndex ?? 0;
7350
7412
  const columnId = opts?.columnId;
7351
7413
  rowVirtualizer.scrollToIndex(rowIndex, { align: "center" });
@@ -7369,7 +7431,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7369
7431
  getNavigableColumnIds,
7370
7432
  store
7371
7433
  ]);
7372
- const onRowAdd = React$15.useCallback(async (event) => {
7434
+ const onRowAdd = React$22.useCallback(async (event) => {
7373
7435
  if (!onRowAddProp) return;
7374
7436
  const result = await onRowAddProp(event);
7375
7437
  if (event?.defaultPrevented || result === null) return;
@@ -7385,7 +7447,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7385
7447
  }
7386
7448
  onScrollToRow({ rowIndex: rows.length });
7387
7449
  }, [onRowAddProp, onScrollToRow]);
7388
- useIsomorphicLayoutEffect(() => {
7450
+ useIsomorphicLayoutEffect$1(() => {
7389
7451
  if (!storageKey) return;
7390
7452
  try {
7391
7453
  const state = table.getState();
@@ -7402,7 +7464,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7402
7464
  table.getState().columnVisibility,
7403
7465
  table.getState().columnPinning
7404
7466
  ]);
7405
- const searchState = React$15.useMemo(() => {
7467
+ const searchState = React$22.useMemo(() => {
7406
7468
  if (!enableSearch) return void 0;
7407
7469
  return {
7408
7470
  searchMatches,
@@ -7427,7 +7489,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7427
7489
  onNavigateToNextMatch,
7428
7490
  onNavigateToPrevMatch
7429
7491
  ]);
7430
- React$15.useEffect(() => {
7492
+ React$22.useEffect(() => {
7431
7493
  const dataGridElement = dataGridRef.current;
7432
7494
  if (!dataGridElement) return;
7433
7495
  dataGridElement.addEventListener("keydown", onDataGridKeyDown);
@@ -7435,7 +7497,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7435
7497
  dataGridElement.removeEventListener("keydown", onDataGridKeyDown);
7436
7498
  };
7437
7499
  }, [onDataGridKeyDown]);
7438
- React$15.useEffect(() => {
7500
+ React$22.useEffect(() => {
7439
7501
  function onGlobalKeyDown(event) {
7440
7502
  const dataGridElement = dataGridRef.current;
7441
7503
  if (!dataGridElement) return;
@@ -7479,7 +7541,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7479
7541
  store,
7480
7542
  clearSelection
7481
7543
  ]);
7482
- React$15.useEffect(() => {
7544
+ React$22.useEffect(() => {
7483
7545
  const currentState = store.getState();
7484
7546
  if (autoFocus && data.length > 0 && columns.length > 0 && !currentState.focusedCell) {
7485
7547
  const _nav = getNavigableColumnIds();
@@ -7505,7 +7567,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7505
7567
  getNavigableColumnIds,
7506
7568
  focusCell
7507
7569
  ]);
7508
- React$15.useEffect(() => {
7570
+ React$22.useEffect(() => {
7509
7571
  function onOutsideClick(event) {
7510
7572
  if (event.button === 2) return;
7511
7573
  if (dataGridRef.current && !dataGridRef.current.contains(event.target)) {
@@ -7527,7 +7589,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7527
7589
  blurCell,
7528
7590
  clearSelection
7529
7591
  ]);
7530
- React$15.useEffect(() => {
7592
+ React$22.useEffect(() => {
7531
7593
  function onCleanup() {
7532
7594
  document.removeEventListener("selectstart", preventSelection);
7533
7595
  document.removeEventListener("contextmenu", preventContextMenu);
@@ -7552,7 +7614,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7552
7614
  onUnsubscribe();
7553
7615
  };
7554
7616
  }, [store]);
7555
- useIsomorphicLayoutEffect(() => {
7617
+ useIsomorphicLayoutEffect$1(() => {
7556
7618
  const rafId = requestAnimationFrame(() => {
7557
7619
  rowVirtualizer.measure();
7558
7620
  });
@@ -7587,7 +7649,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7587
7649
  //#endregion
7588
7650
  //#region src/date-picker/date-picker.tsx
7589
7651
  function DatePickerDemo() {
7590
- const [date, setDate] = React$14.useState();
7652
+ const [date, setDate] = React$21.useState();
7591
7653
  return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
7592
7654
  asChild: true,
7593
7655
  children: /* @__PURE__ */ jsxs(Button, {
@@ -7617,13 +7679,13 @@ Drawer.displayName = "Drawer";
7617
7679
  const DrawerTrigger = Drawer$1.Trigger;
7618
7680
  const DrawerPortal = Drawer$1.Portal;
7619
7681
  const DrawerClose = Drawer$1.Close;
7620
- const DrawerOverlay = React$13.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Overlay, {
7682
+ const DrawerOverlay = React$20.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Overlay, {
7621
7683
  ref,
7622
7684
  className: cn("fixed inset-0 z-50 bg-black/80", className),
7623
7685
  ...props
7624
7686
  }));
7625
7687
  DrawerOverlay.displayName = Drawer$1.Overlay.displayName;
7626
- const DrawerContent = React$13.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsxs(Drawer$1.Content, {
7688
+ const DrawerContent = React$20.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsxs(Drawer$1.Content, {
7627
7689
  ref,
7628
7690
  className: cn("fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background", className),
7629
7691
  ...props,
@@ -7640,13 +7702,13 @@ const DrawerFooter = ({ className,...props }) => /* @__PURE__ */ jsx("div", {
7640
7702
  ...props
7641
7703
  });
7642
7704
  DrawerFooter.displayName = "DrawerFooter";
7643
- const DrawerTitle = React$13.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Title, {
7705
+ const DrawerTitle = React$20.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Title, {
7644
7706
  ref,
7645
7707
  className: cn("text-lg font-semibold leading-none tracking-tight", className),
7646
7708
  ...props
7647
7709
  }));
7648
7710
  DrawerTitle.displayName = Drawer$1.Title.displayName;
7649
- const DrawerDescription = React$13.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Description, {
7711
+ const DrawerDescription = React$20.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Description, {
7650
7712
  ref,
7651
7713
  className: cn("text-sm text-muted-foreground", className),
7652
7714
  ...props
@@ -7776,8 +7838,8 @@ function FieldError({ className, children, errors,...props }) {
7776
7838
  //#endregion
7777
7839
  //#region src/hooks/use-is-mobile.ts
7778
7840
  function useIsMobile(mobileBreakpoint = 768) {
7779
- const [isMobile, setIsMobile] = React$12.useState(false);
7780
- React$12.useEffect(() => {
7841
+ const [isMobile, setIsMobile] = React$19.useState(false);
7842
+ React$19.useEffect(() => {
7781
7843
  const mql = globalThis.matchMedia(`(max-width: ${mobileBreakpoint - 1}px)`);
7782
7844
  const onChange = () => {
7783
7845
  setIsMobile(globalThis.innerWidth < mobileBreakpoint);
@@ -7921,36 +7983,36 @@ const coordinateGetter = (event, { context }) => {
7921
7983
  }
7922
7984
  return void 0;
7923
7985
  };
7924
- const ROOT_NAME = "Kanban";
7986
+ const ROOT_NAME$1 = "Kanban";
7925
7987
  const BOARD_NAME = "KanbanBoard";
7926
7988
  const COLUMN_NAME = "KanbanColumn";
7927
7989
  const COLUMN_HANDLE_NAME = "KanbanColumnHandle";
7928
- const ITEM_NAME = "KanbanItem";
7990
+ const ITEM_NAME$1 = "KanbanItem";
7929
7991
  const ITEM_HANDLE_NAME = "KanbanItemHandle";
7930
7992
  const OVERLAY_NAME = "KanbanOverlay";
7931
- const KanbanContext = React$11.createContext(null);
7993
+ const KanbanContext = React$18.createContext(null);
7932
7994
  function useKanbanContext(consumerName) {
7933
- const context = React$11.useContext(KanbanContext);
7934
- if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME}\``);
7995
+ const context = React$18.useContext(KanbanContext);
7996
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME$1}\``);
7935
7997
  return context;
7936
7998
  }
7937
7999
  function KanbanRoot(props) {
7938
8000
  const { value, onValueChange, modifiers, strategy = verticalListSortingStrategy, orientation = "horizontal", onMove, getItemValue: getItemValueProp, accessibility, flatCursor = false,...kanbanProps } = props;
7939
- const id = React$11.useId();
7940
- const [activeId, setActiveId] = React$11.useState(null);
7941
- const lastOverIdRef = React$11.useRef(null);
7942
- const hasMovedRef = React$11.useRef(false);
8001
+ const id = React$18.useId();
8002
+ const [activeId, setActiveId] = React$18.useState(null);
8003
+ const lastOverIdRef = React$18.useRef(null);
8004
+ const hasMovedRef = React$18.useRef(false);
7943
8005
  const sensors = useSensors(useSensor(MouseSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter }));
7944
- const getItemValue = React$11.useCallback((item) => {
8006
+ const getItemValue = React$18.useCallback((item) => {
7945
8007
  if (typeof item === "object" && !getItemValueProp) throw new Error("`getItemValue` is required when using array of objects");
7946
8008
  return getItemValueProp ? getItemValueProp(item) : item;
7947
8009
  }, [getItemValueProp]);
7948
- const getColumn = React$11.useCallback((id$1) => {
8010
+ const getColumn = React$18.useCallback((id$1) => {
7949
8011
  if (id$1 in value) return id$1;
7950
8012
  for (const [columnId, items] of Object.entries(value)) if (items.some((item) => getItemValue(item) === id$1)) return columnId;
7951
8013
  return null;
7952
8014
  }, [value, getItemValue]);
7953
- const collisionDetection = React$11.useCallback((args) => {
8015
+ const collisionDetection = React$18.useCallback((args) => {
7954
8016
  if (activeId && activeId in value) return closestCenter({
7955
8017
  ...args,
7956
8018
  droppableContainers: args.droppableContainers.filter((container) => container.id in value)
@@ -7979,12 +8041,12 @@ function KanbanRoot(props) {
7979
8041
  value,
7980
8042
  getItemValue
7981
8043
  ]);
7982
- const onDragStart = React$11.useCallback((event) => {
8044
+ const onDragStart = React$18.useCallback((event) => {
7983
8045
  kanbanProps.onDragStart?.(event);
7984
8046
  if (event.activatorEvent.defaultPrevented) return;
7985
8047
  setActiveId(event.active.id);
7986
8048
  }, [kanbanProps]);
7987
- const onDragOver = React$11.useCallback((event) => {
8049
+ const onDragOver = React$18.useCallback((event) => {
7988
8050
  kanbanProps.onDragOver?.(event);
7989
8051
  if (event.activatorEvent.defaultPrevented) return;
7990
8052
  const { active, over } = event;
@@ -8025,7 +8087,7 @@ function KanbanRoot(props) {
8025
8087
  getItemValue,
8026
8088
  onValueChange
8027
8089
  ]);
8028
- const onDragEnd = React$11.useCallback((event) => {
8090
+ const onDragEnd = React$18.useCallback((event) => {
8029
8091
  kanbanProps.onDragEnd?.(event);
8030
8092
  if (event.activatorEvent.defaultPrevented) return;
8031
8093
  const { active, over } = event;
@@ -8088,13 +8150,13 @@ function KanbanRoot(props) {
8088
8150
  getColumn,
8089
8151
  getItemValue
8090
8152
  ]);
8091
- const onDragCancel = React$11.useCallback((event) => {
8153
+ const onDragCancel = React$18.useCallback((event) => {
8092
8154
  kanbanProps.onDragCancel?.(event);
8093
8155
  if (event.activatorEvent.defaultPrevented) return;
8094
8156
  setActiveId(null);
8095
8157
  hasMovedRef.current = false;
8096
8158
  }, [kanbanProps]);
8097
- const announcements = React$11.useMemo(() => ({
8159
+ const announcements = React$18.useMemo(() => ({
8098
8160
  onDragStart({ active }) {
8099
8161
  const isColumn = active.id in value;
8100
8162
  const itemType = isColumn ? "column" : "item";
@@ -8157,7 +8219,7 @@ function KanbanRoot(props) {
8157
8219
  getColumn,
8158
8220
  getItemValue
8159
8221
  ]);
8160
- const contextValue = React$11.useMemo(() => ({
8222
+ const contextValue = React$18.useMemo(() => ({
8161
8223
  id,
8162
8224
  items: value,
8163
8225
  modifiers,
@@ -8202,11 +8264,11 @@ function KanbanRoot(props) {
8202
8264
  })
8203
8265
  });
8204
8266
  }
8205
- const KanbanBoardContext = React$11.createContext(false);
8267
+ const KanbanBoardContext = React$18.createContext(false);
8206
8268
  function KanbanBoard(props) {
8207
8269
  const { asChild, className, ref,...boardProps } = props;
8208
8270
  const context = useKanbanContext(BOARD_NAME);
8209
- const columns = React$11.useMemo(() => {
8271
+ const columns = React$18.useMemo(() => {
8210
8272
  return Object.keys(context.items);
8211
8273
  }, [context.items]);
8212
8274
  const BoardPrimitive = asChild ? Slot : "div";
@@ -8226,9 +8288,9 @@ function KanbanBoard(props) {
8226
8288
  })
8227
8289
  });
8228
8290
  }
8229
- const KanbanColumnContext = React$11.createContext(null);
8291
+ const KanbanColumnContext = React$18.createContext(null);
8230
8292
  function useKanbanColumnContext(consumerName) {
8231
- const context = React$11.useContext(KanbanColumnContext);
8293
+ const context = React$18.useContext(KanbanColumnContext);
8232
8294
  if (!context) throw new Error(`\`${consumerName}\` must be used within \`${COLUMN_NAME}\``);
8233
8295
  return context;
8234
8296
  }
@@ -8238,10 +8300,10 @@ const animateLayoutChanges = (args) => defaultAnimateLayoutChanges({
8238
8300
  });
8239
8301
  function KanbanColumn(props) {
8240
8302
  const { value, asChild, asHandle, disabled, className, style, ref,...columnProps } = props;
8241
- const id = React$11.useId();
8303
+ const id = React$18.useId();
8242
8304
  const context = useKanbanContext(COLUMN_NAME);
8243
- const inBoard = React$11.useContext(KanbanBoardContext);
8244
- const inOverlay = React$11.useContext(KanbanOverlayContext);
8305
+ const inBoard = React$18.useContext(KanbanBoardContext);
8306
+ const inOverlay = React$18.useContext(KanbanOverlayContext);
8245
8307
  if (!inBoard && !inOverlay) throw new Error(`\`${COLUMN_NAME}\` must be used within \`${BOARD_NAME}\` or \`${OVERLAY_NAME}\``);
8246
8308
  if (value === "") throw new Error(`\`${COLUMN_NAME}\` value cannot be an empty string`);
8247
8309
  const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({
@@ -8253,7 +8315,7 @@ function KanbanColumn(props) {
8253
8315
  if (disabled) return;
8254
8316
  setNodeRef(node);
8255
8317
  });
8256
- const composedStyle = React$11.useMemo(() => {
8318
+ const composedStyle = React$18.useMemo(() => {
8257
8319
  return {
8258
8320
  transform: CSS.Transform.toString(transform),
8259
8321
  transition,
@@ -8264,11 +8326,11 @@ function KanbanColumn(props) {
8264
8326
  transition,
8265
8327
  style
8266
8328
  ]);
8267
- const items = React$11.useMemo(() => {
8329
+ const items = React$18.useMemo(() => {
8268
8330
  const items$1 = context.items[value] ?? [];
8269
8331
  return items$1.map((item) => context.getItemValue(item));
8270
8332
  }, [context, value]);
8271
- const columnContext = React$11.useMemo(() => ({
8333
+ const columnContext = React$18.useMemo(() => ({
8272
8334
  id,
8273
8335
  attributes,
8274
8336
  listeners,
@@ -8335,29 +8397,29 @@ function KanbanColumnHandle(props) {
8335
8397
  disabled: isDisabled
8336
8398
  });
8337
8399
  }
8338
- const KanbanItemContext = React$11.createContext(null);
8400
+ const KanbanItemContext = React$18.createContext(null);
8339
8401
  function useKanbanItemContext(consumerName) {
8340
- const context = React$11.useContext(KanbanItemContext);
8341
- if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ITEM_NAME}\``);
8402
+ const context = React$18.useContext(KanbanItemContext);
8403
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ITEM_NAME$1}\``);
8342
8404
  return context;
8343
8405
  }
8344
8406
  function KanbanItem(props) {
8345
8407
  const { value, style, asHandle, asChild, disabled, className, ref,...itemProps } = props;
8346
- const id = React$11.useId();
8347
- const context = useKanbanContext(ITEM_NAME);
8348
- const inBoard = React$11.useContext(KanbanBoardContext);
8349
- const inOverlay = React$11.useContext(KanbanOverlayContext);
8350
- if (!inBoard && !inOverlay) throw new Error(`\`${ITEM_NAME}\` must be used within \`${BOARD_NAME}\``);
8408
+ const id = React$18.useId();
8409
+ const context = useKanbanContext(ITEM_NAME$1);
8410
+ const inBoard = React$18.useContext(KanbanBoardContext);
8411
+ const inOverlay = React$18.useContext(KanbanOverlayContext);
8412
+ if (!inBoard && !inOverlay) throw new Error(`\`${ITEM_NAME$1}\` must be used within \`${BOARD_NAME}\``);
8351
8413
  const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({
8352
8414
  id: value,
8353
8415
  disabled
8354
8416
  });
8355
- if (value === "") throw new Error(`\`${ITEM_NAME}\` value cannot be an empty string`);
8417
+ if (value === "") throw new Error(`\`${ITEM_NAME$1}\` value cannot be an empty string`);
8356
8418
  const composedRef = useComposedRefs(ref, (node) => {
8357
8419
  if (disabled) return;
8358
8420
  setNodeRef(node);
8359
8421
  });
8360
- const composedStyle = React$11.useMemo(() => {
8422
+ const composedStyle = React$18.useMemo(() => {
8361
8423
  return {
8362
8424
  transform: CSS.Transform.toString(transform),
8363
8425
  transition,
@@ -8368,7 +8430,7 @@ function KanbanItem(props) {
8368
8430
  transition,
8369
8431
  style
8370
8432
  ]);
8371
- const itemContext = React$11.useMemo(() => ({
8433
+ const itemContext = React$18.useMemo(() => ({
8372
8434
  id,
8373
8435
  attributes,
8374
8436
  listeners,
@@ -8431,13 +8493,13 @@ function KanbanItemHandle(props) {
8431
8493
  disabled: isDisabled
8432
8494
  });
8433
8495
  }
8434
- const KanbanOverlayContext = React$11.createContext(false);
8496
+ const KanbanOverlayContext = React$18.createContext(false);
8435
8497
  const dropAnimation = { sideEffects: defaultDropAnimationSideEffects({ styles: { active: { opacity: "0.4" } } }) };
8436
8498
  function KanbanOverlay(props) {
8437
8499
  const { container: containerProp, children,...overlayProps } = props;
8438
8500
  const context = useKanbanContext(OVERLAY_NAME);
8439
- const [mounted, setMounted] = React$11.useState(false);
8440
- React$11.useLayoutEffect(() => setMounted(true), []);
8501
+ const [mounted, setMounted] = React$18.useState(false);
8502
+ React$18.useLayoutEffect(() => setMounted(true), []);
8441
8503
  const container = containerProp ?? (mounted ? globalThis.document?.body : null);
8442
8504
  if (!container) return null;
8443
8505
  const variant = context.activeId && context.activeId in context.items ? "column" : "item";
@@ -8573,32 +8635,32 @@ const MenubarGroup = MenubarPrimitive.Group;
8573
8635
  const MenubarPortal = MenubarPrimitive.Portal;
8574
8636
  const MenubarSub = MenubarPrimitive.Sub;
8575
8637
  const MenubarRadioGroup = MenubarPrimitive.RadioGroup;
8576
- const Menubar = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Root, {
8638
+ const Menubar = React$17.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Root, {
8577
8639
  ref,
8578
8640
  className: cn("flex h-9 items-center space-x-1 rounded-md border bg-background p-1 shadow-sm", className),
8579
8641
  ...props
8580
8642
  }));
8581
8643
  Menubar.displayName = MenubarPrimitive.Root.displayName;
8582
- const MenubarTrigger = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Trigger, {
8644
+ const MenubarTrigger = React$17.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Trigger, {
8583
8645
  ref,
8584
8646
  className: cn("flex cursor-default select-none items-center rounded-sm px-3 py-1 text-sm font-medium outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground", className),
8585
8647
  ...props
8586
8648
  }));
8587
8649
  MenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;
8588
- const MenubarSubTrigger = React$10.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.SubTrigger, {
8650
+ const MenubarSubTrigger = React$17.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.SubTrigger, {
8589
8651
  ref,
8590
8652
  className: cn("flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground", inset && "pl-8", className),
8591
8653
  ...props,
8592
8654
  children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto h-4 w-4" })]
8593
8655
  }));
8594
8656
  MenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName;
8595
- const MenubarSubContent = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.SubContent, {
8657
+ const MenubarSubContent = React$17.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.SubContent, {
8596
8658
  ref,
8597
8659
  className: cn("z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground 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", className),
8598
8660
  ...props
8599
8661
  }));
8600
8662
  MenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName;
8601
- const MenubarContent = React$10.forwardRef(({ className, align = "start", alignOffset = -4, sideOffset = 8,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx(MenubarPrimitive.Content, {
8663
+ const MenubarContent = React$17.forwardRef(({ className, align = "start", alignOffset = -4, sideOffset = 8,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx(MenubarPrimitive.Content, {
8602
8664
  ref,
8603
8665
  align,
8604
8666
  alignOffset,
@@ -8607,13 +8669,13 @@ const MenubarContent = React$10.forwardRef(({ className, align = "start", alignO
8607
8669
  ...props
8608
8670
  }) }));
8609
8671
  MenubarContent.displayName = MenubarPrimitive.Content.displayName;
8610
- const MenubarItem = React$10.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Item, {
8672
+ const MenubarItem = React$17.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Item, {
8611
8673
  ref,
8612
8674
  className: cn("relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", inset && "pl-8", className),
8613
8675
  ...props
8614
8676
  }));
8615
8677
  MenubarItem.displayName = MenubarPrimitive.Item.displayName;
8616
- const MenubarCheckboxItem = React$10.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.CheckboxItem, {
8678
+ const MenubarCheckboxItem = React$17.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.CheckboxItem, {
8617
8679
  ref,
8618
8680
  className: cn("relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className),
8619
8681
  checked,
@@ -8624,7 +8686,7 @@ const MenubarCheckboxItem = React$10.forwardRef(({ className, children, checked,
8624
8686
  }), children]
8625
8687
  }));
8626
8688
  MenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;
8627
- const MenubarRadioItem = React$10.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.RadioItem, {
8689
+ const MenubarRadioItem = React$17.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.RadioItem, {
8628
8690
  ref,
8629
8691
  className: cn("relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50", className),
8630
8692
  ...props,
@@ -8634,13 +8696,13 @@ const MenubarRadioItem = React$10.forwardRef(({ className, children,...props },
8634
8696
  }), children]
8635
8697
  }));
8636
8698
  MenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName;
8637
- const MenubarLabel = React$10.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Label, {
8699
+ const MenubarLabel = React$17.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Label, {
8638
8700
  ref,
8639
8701
  className: cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className),
8640
8702
  ...props
8641
8703
  }));
8642
8704
  MenubarLabel.displayName = MenubarPrimitive.Label.displayName;
8643
- const MenubarSeparator = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Separator, {
8705
+ const MenubarSeparator = React$17.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Separator, {
8644
8706
  ref,
8645
8707
  className: cn("-mx-1 my-1 h-px bg-muted", className),
8646
8708
  ...props
@@ -8789,13 +8851,13 @@ const Pagination = ({ className,...props }) => /* @__PURE__ */ jsx("nav", {
8789
8851
  ...props
8790
8852
  });
8791
8853
  Pagination.displayName = "Pagination";
8792
- const PaginationContent = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ul", {
8854
+ const PaginationContent = React$16.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ul", {
8793
8855
  ref,
8794
8856
  className: cn("flex flex-row items-center gap-1", className),
8795
8857
  ...props
8796
8858
  }));
8797
8859
  PaginationContent.displayName = "PaginationContent";
8798
- const PaginationItem = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
8860
+ const PaginationItem = React$16.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
8799
8861
  ref,
8800
8862
  className: cn("", className),
8801
8863
  ...props
@@ -8917,7 +8979,7 @@ const ResizableHandle = ({ withHandle, className,...props }) => /* @__PURE__ */
8917
8979
 
8918
8980
  //#endregion
8919
8981
  //#region src/scroll-area/scroll-area.tsx
8920
- const ScrollArea = React$8.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ScrollAreaPrimitive.Root, {
8982
+ const ScrollArea = React$15.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ScrollAreaPrimitive.Root, {
8921
8983
  ref,
8922
8984
  className: cn("relative overflow-hidden", className),
8923
8985
  ...props,
@@ -8931,7 +8993,7 @@ const ScrollArea = React$8.forwardRef(({ className, children,...props }, ref) =>
8931
8993
  ]
8932
8994
  }));
8933
8995
  ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
8934
- const ScrollBar = React$8.forwardRef(({ className, orientation = "vertical",...props }, ref) => /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, {
8996
+ const ScrollBar = React$15.forwardRef(({ className, orientation = "vertical",...props }, ref) => /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, {
8935
8997
  ref,
8936
8998
  orientation,
8937
8999
  className: cn("flex touch-none select-none transition-colors", orientation === "vertical" && "h-full w-2.5 border-l border-l-transparent p-[1px]", orientation === "horizontal" && "h-2.5 flex-col border-t border-t-transparent p-[1px]", className),
@@ -8946,7 +9008,7 @@ const Sheet = SheetPrimitive.Root;
8946
9008
  const SheetTrigger = SheetPrimitive.Trigger;
8947
9009
  const SheetClose = SheetPrimitive.Close;
8948
9010
  const SheetPortal = SheetPrimitive.Portal;
8949
- const SheetOverlay = React$7.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Overlay, {
9011
+ const SheetOverlay = React$14.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Overlay, {
8950
9012
  className: 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),
8951
9013
  ...props,
8952
9014
  ref
@@ -8961,7 +9023,7 @@ const sheetVariants = cva("fixed z-50 gap-4 bg-background p-6 shadow-lg transiti
8961
9023
  } },
8962
9024
  defaultVariants: { side: "right" }
8963
9025
  });
8964
- const SheetContent = React$7.forwardRef(({ side = "right", className, children, __e2e_test_id__,...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsxs(SheetPrimitive.Content, {
9026
+ const SheetContent = React$14.forwardRef(({ side = "right", className, children, __e2e_test_id__,...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsxs(SheetPrimitive.Content, {
8965
9027
  ref,
8966
9028
  className: cn(sheetVariants({ side }), className),
8967
9029
  "data-test-id": __e2e_test_id__,
@@ -8986,13 +9048,13 @@ const SheetFooter = ({ className,...props }) => /* @__PURE__ */ jsx("div", {
8986
9048
  ...props
8987
9049
  });
8988
9050
  SheetFooter.displayName = "SheetFooter";
8989
- const SheetTitle = React$7.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Title, {
9051
+ const SheetTitle = React$14.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Title, {
8990
9052
  ref,
8991
9053
  className: cn("text-lg font-semibold text-foreground", className),
8992
9054
  ...props
8993
9055
  }));
8994
9056
  SheetTitle.displayName = SheetPrimitive.Title.displayName;
8995
- const SheetDescription = React$7.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Description, {
9057
+ const SheetDescription = React$14.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Description, {
8996
9058
  ref,
8997
9059
  className: cn("text-sm text-muted-foreground", className),
8998
9060
  ...props
@@ -9000,105 +9062,316 @@ const SheetDescription = React$7.forwardRef(({ className,...props }, ref) => /*
9000
9062
  SheetDescription.displayName = SheetPrimitive.Description.displayName;
9001
9063
 
9002
9064
  //#endregion
9003
- //#region src/sidebar/sidebar.tsx
9065
+ //#region src/sidebar/sidebar-context-provider.tsx
9004
9066
  const SIDEBAR_WIDTH = "16rem";
9005
9067
  const SIDEBAR_WIDTH_MOBILE = "18rem";
9006
9068
  const SIDEBAR_WIDTH_ICON = "3rem";
9007
9069
  const SIDEBAR_KEYBOARD_SHORTCUT = "b";
9070
+ const SIDEBAR_KEYBOARD_SHORTCUT_RIGHT = ".";
9008
9071
  const SIDEBAR_MIN_WIDTH = 200;
9009
9072
  const SIDEBAR_MAX_WIDTH = 600;
9010
- const SidebarContext = React$6.createContext(null);
9011
- const SidebarResizeContext = React$6.createContext(null);
9012
- function useSidebar() {
9013
- const context = React$6.useContext(SidebarContext);
9014
- if (!context) throw new Error("useSidebar must be used within a SidebarProvider.");
9015
- return context;
9073
+ /**
9074
+ * Internal store context. Exported for use by `Sidebar` component in the same
9075
+ * package to build per-sidebar resize contexts.
9076
+ */
9077
+ const SidebarContext = React$13.createContext(null);
9078
+ /**
9079
+ * Context that identifies which sidebar a component belongs to.
9080
+ * Set by `<Sidebar sidebarId="...">`, consumed by `useSidebar()`.
9081
+ */
9082
+ const SidebarIdContext = React$13.createContext("default");
9083
+ /**
9084
+ * Returns the state and controls for a specific sidebar.
9085
+ *
9086
+ * @param sidebarId - Optional explicit sidebar ID. Falls back to the nearest
9087
+ * `SidebarIdContext` (set by the parent `<Sidebar>`), then to `"default"`.
9088
+ */
9089
+ function useSidebar(sidebarId) {
9090
+ const store = React$13.useContext(SidebarContext);
9091
+ const ctxId = React$13.useContext(SidebarIdContext);
9092
+ const id = sidebarId ?? ctxId;
9093
+ if (!store) throw new Error("useSidebar must be used within a SidebarProvider.");
9094
+ const open = store.openStates[id] ?? store.defaultOpen;
9095
+ const openMobile = store.mobileStates[id] ?? false;
9096
+ const width = store.widthStates[id];
9097
+ const { isMobile, isResizing } = store;
9098
+ const registry = store.sidebarRegistry[id];
9099
+ const minWidth = registry?.minWidth ?? store.providerMinWidth;
9100
+ const maxWidth = registry?.maxWidth ?? store.providerMaxWidth;
9101
+ const setOpen = React$13.useCallback((value) => store.setOpen(id, value), [store.setOpen, id]);
9102
+ const setOpenMobile = React$13.useCallback((value) => store.setOpenMobile(id, value), [store.setOpenMobile, id]);
9103
+ const setWidth = React$13.useCallback((value) => store.setWidth(id, value), [store.setWidth, id]);
9104
+ const toggleSidebar = React$13.useCallback(() => {
9105
+ if (store.isMobile) store.setOpenMobile(id, !(store.mobileStates[id] ?? false));
9106
+ else store.setOpen(id, !(store.openStates[id] ?? store.defaultOpen));
9107
+ }, [store, id]);
9108
+ const state = open ? "expanded" : "collapsed";
9109
+ return React$13.useMemo(() => ({
9110
+ state,
9111
+ open,
9112
+ setOpen,
9113
+ openMobile,
9114
+ setOpenMobile,
9115
+ isMobile,
9116
+ toggleSidebar,
9117
+ width,
9118
+ setWidth,
9119
+ isResizing,
9120
+ minWidth,
9121
+ maxWidth
9122
+ }), [
9123
+ state,
9124
+ open,
9125
+ setOpen,
9126
+ openMobile,
9127
+ setOpenMobile,
9128
+ isMobile,
9129
+ toggleSidebar,
9130
+ width,
9131
+ setWidth,
9132
+ isResizing,
9133
+ minWidth,
9134
+ maxWidth
9135
+ ]);
9016
9136
  }
9017
- function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: setOpenProp, width: widthProp, onWidthChange, minWidth = SIDEBAR_MIN_WIDTH, maxWidth = SIDEBAR_MAX_WIDTH, className, style, children,...props }) {
9137
+ /**
9138
+ * Returns a list of all registered sidebars with their IDs and sides.
9139
+ */
9140
+ function useRegisteredSidebars() {
9141
+ const store = React$13.useContext(SidebarContext);
9142
+ if (!store) throw new Error("useRegisteredSidebars must be used within a SidebarProvider.");
9143
+ return React$13.useMemo(() => Object.entries(store.sidebarRegistry).map(([sidebarId, entry]) => ({
9144
+ sidebarId,
9145
+ side: entry.side
9146
+ })), [store.sidebarRegistry]);
9147
+ }
9148
+ function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: setOpenProp, width: widthProp, onWidthChange, minWidth = SIDEBAR_MIN_WIDTH, maxWidth = SIDEBAR_MAX_WIDTH, storageKey, defaultOpenSidebars, defaultWidths, keyboardShortcuts, className, style, children,...props }) {
9018
9149
  const isMobile = useIsMobile();
9019
- const [openMobile, setOpenMobile] = React$6.useState(false);
9020
- const [isResizing, setIsResizing] = React$6.useState(false);
9021
- const [_open, _setOpen] = React$6.useState(defaultOpen);
9022
- const open = openProp ?? _open;
9023
- const setOpen = React$6.useCallback((value) => {
9024
- const openState = typeof value === "function" ? value(open) : value;
9025
- if (setOpenProp) setOpenProp(openState);
9026
- else _setOpen(openState);
9027
- }, [setOpenProp, open]);
9028
- const toggleSidebar = React$6.useCallback(() => {
9029
- return isMobile ? setOpenMobile((open$1) => !open$1) : setOpen((open$1) => !open$1);
9150
+ const [isResizing, setIsResizing] = React$13.useState(false);
9151
+ const storedRef = React$13.useRef(null);
9152
+ if (storedRef.current === null && storageKey) try {
9153
+ storedRef.current = JSON.parse(localStorage.getItem(storageKey) ?? "{}");
9154
+ } catch {
9155
+ storedRef.current = {};
9156
+ }
9157
+ const [openStates, setOpenStates] = React$13.useState(() => {
9158
+ const states = { default: defaultOpen };
9159
+ if (defaultOpenSidebars) Object.assign(states, defaultOpenSidebars);
9160
+ if (storedRef.current) {
9161
+ for (const [id, data] of Object.entries(storedRef.current)) if (data && typeof data === "object" && "open" in data) states[id] = data.open;
9162
+ }
9163
+ return states;
9164
+ });
9165
+ const [mobileStates, setMobileStates] = React$13.useState({});
9166
+ React$13.useEffect(() => {
9167
+ if (openProp !== void 0) setOpenStates((prev) => prev["default"] === openProp ? prev : {
9168
+ ...prev,
9169
+ default: openProp
9170
+ });
9171
+ }, [openProp]);
9172
+ const effectiveOpenStates = React$13.useMemo(() => {
9173
+ if (openProp !== void 0) return {
9174
+ ...openStates,
9175
+ default: openProp
9176
+ };
9177
+ return openStates;
9178
+ }, [openStates, openProp]);
9179
+ const [widthStates, setWidthStates] = React$13.useState(() => {
9180
+ const states = {};
9181
+ if (widthProp !== void 0) states["default"] = widthProp;
9182
+ if (defaultWidths) Object.assign(states, defaultWidths);
9183
+ if (storedRef.current) {
9184
+ for (const [id, data] of Object.entries(storedRef.current)) if (data && typeof data === "object" && typeof data.width === "number") states[id] = data.width;
9185
+ }
9186
+ return states;
9187
+ });
9188
+ React$13.useEffect(() => {
9189
+ if (widthProp !== void 0) setWidthStates((prev) => prev["default"] === widthProp ? prev : {
9190
+ ...prev,
9191
+ default: widthProp
9192
+ });
9193
+ }, [widthProp]);
9194
+ const effectiveWidthStates = React$13.useMemo(() => {
9195
+ if (widthProp !== void 0) return {
9196
+ ...widthStates,
9197
+ default: widthProp
9198
+ };
9199
+ return widthStates;
9200
+ }, [widthStates, widthProp]);
9201
+ React$13.useEffect(() => {
9202
+ if (!storageKey) return;
9203
+ const toStore = {};
9204
+ const allIds = new Set([...Object.keys(openStates), ...Object.keys(widthStates)]);
9205
+ for (const id of allIds) toStore[id] = {
9206
+ open: openStates[id] ?? defaultOpen,
9207
+ ...widthStates[id] === void 0 ? {} : { width: widthStates[id] }
9208
+ };
9209
+ localStorage.setItem(storageKey, JSON.stringify(toStore));
9030
9210
  }, [
9031
- isMobile,
9032
- setOpen,
9033
- setOpenMobile
9211
+ storageKey,
9212
+ openStates,
9213
+ widthStates,
9214
+ defaultOpen
9034
9215
  ]);
9035
- React$6.useEffect(() => {
9216
+ const setOpen = React$13.useCallback((id, open) => {
9217
+ if (id === "default" && setOpenProp) setOpenProp(open);
9218
+ setOpenStates((prev) => ({
9219
+ ...prev,
9220
+ [id]: open
9221
+ }));
9222
+ }, [setOpenProp]);
9223
+ const setOpenMobile = React$13.useCallback((id, open) => {
9224
+ setMobileStates((prev) => ({
9225
+ ...prev,
9226
+ [id]: open
9227
+ }));
9228
+ }, []);
9229
+ const setWidth = React$13.useCallback((id, width) => {
9230
+ if (id === "default" && onWidthChange) onWidthChange(width);
9231
+ setWidthStates((prev) => ({
9232
+ ...prev,
9233
+ [id]: width
9234
+ }));
9235
+ }, [onWidthChange]);
9236
+ const [sidebarRegistry, setSidebarRegistry] = React$13.useState({});
9237
+ const registerSidebar = React$13.useCallback((id, config) => {
9238
+ setSidebarRegistry((prev) => {
9239
+ const existing = prev[id];
9240
+ if (existing && existing.side === config.side && existing.minWidth === config.minWidth && existing.maxWidth === config.maxWidth) return prev;
9241
+ return {
9242
+ ...prev,
9243
+ [id]: config
9244
+ };
9245
+ });
9246
+ }, []);
9247
+ const unregisterSidebar = React$13.useCallback((id) => {
9248
+ setSidebarRegistry((prev) => {
9249
+ const { [id]: _,...rest } = prev;
9250
+ return rest;
9251
+ });
9252
+ }, []);
9253
+ const effectiveOpenStatesRef = React$13.useRef(effectiveOpenStates);
9254
+ effectiveOpenStatesRef.current = effectiveOpenStates;
9255
+ const resolvedShortcuts = React$13.useMemo(() => {
9256
+ if (keyboardShortcuts === false) return {};
9257
+ return keyboardShortcuts ?? { [SIDEBAR_KEYBOARD_SHORTCUT]: "default" };
9258
+ }, [keyboardShortcuts]);
9259
+ React$13.useEffect(() => {
9260
+ const entries = Object.entries(resolvedShortcuts);
9261
+ if (entries.length === 0) return;
9036
9262
  const handleKeyDown = (event) => {
9037
- if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
9263
+ if (!(event.metaKey || event.ctrlKey)) return;
9264
+ for (const [key, sidebarId] of entries) if (event.key === key) {
9038
9265
  event.preventDefault();
9039
- toggleSidebar();
9266
+ if (isMobile) setMobileStates((prev) => ({
9267
+ ...prev,
9268
+ [sidebarId]: !(prev[sidebarId] ?? false)
9269
+ }));
9270
+ else {
9271
+ const currentOpen = effectiveOpenStatesRef.current[sidebarId] ?? defaultOpen;
9272
+ setOpen(sidebarId, !currentOpen);
9273
+ }
9274
+ return;
9040
9275
  }
9041
9276
  };
9042
9277
  globalThis.addEventListener("keydown", handleKeyDown);
9043
9278
  return () => globalThis.removeEventListener("keydown", handleKeyDown);
9044
- }, [toggleSidebar]);
9045
- const state = open ? "expanded" : "collapsed";
9046
- const contextValue = React$6.useMemo(() => ({
9047
- state,
9048
- open,
9049
- setOpen,
9279
+ }, [
9280
+ resolvedShortcuts,
9050
9281
  isMobile,
9051
- openMobile,
9282
+ defaultOpen,
9283
+ setOpen
9284
+ ]);
9285
+ const storeValue = React$13.useMemo(() => ({
9286
+ openStates: effectiveOpenStates,
9287
+ mobileStates,
9288
+ widthStates: effectiveWidthStates,
9289
+ sidebarRegistry,
9290
+ setOpen,
9052
9291
  setOpenMobile,
9053
- toggleSidebar,
9054
- width: widthProp,
9055
- isResizing
9292
+ setWidth,
9293
+ registerSidebar,
9294
+ unregisterSidebar,
9295
+ isMobile,
9296
+ defaultOpen,
9297
+ isResizing,
9298
+ setIsResizing,
9299
+ providerMinWidth: minWidth,
9300
+ providerMaxWidth: maxWidth
9056
9301
  }), [
9057
- state,
9058
- open,
9302
+ effectiveOpenStates,
9303
+ mobileStates,
9304
+ effectiveWidthStates,
9305
+ sidebarRegistry,
9059
9306
  setOpen,
9060
- isMobile,
9061
- openMobile,
9062
9307
  setOpenMobile,
9063
- toggleSidebar,
9064
- widthProp,
9065
- isResizing
9308
+ setWidth,
9309
+ registerSidebar,
9310
+ unregisterSidebar,
9311
+ isMobile,
9312
+ defaultOpen,
9313
+ isResizing,
9314
+ minWidth,
9315
+ maxWidth
9066
9316
  ]);
9067
- const sidebarWidthValue = widthProp ? `${widthProp}px` : SIDEBAR_WIDTH;
9317
+ const defaultWidth = effectiveWidthStates["default"];
9318
+ const sidebarWidthValue = defaultWidth ? `${defaultWidth}px` : SIDEBAR_WIDTH;
9068
9319
  return /* @__PURE__ */ jsx(SidebarContext.Provider, {
9069
- value: contextValue,
9070
- children: /* @__PURE__ */ jsx(SidebarResizeContext.Provider, {
9071
- value: {
9072
- onWidthChange,
9073
- minWidth,
9074
- maxWidth,
9075
- isResizing,
9076
- setIsResizing
9077
- },
9078
- children: /* @__PURE__ */ jsx(TooltipProvider, {
9079
- delayDuration: 0,
9080
- children: /* @__PURE__ */ jsx("div", {
9081
- "data-slot": "sidebar-wrapper",
9082
- style: {
9083
- "--sidebar-width": sidebarWidthValue,
9084
- "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
9085
- ...style
9086
- },
9087
- className: cn("group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full", className),
9088
- ...props,
9089
- children
9090
- })
9320
+ value: storeValue,
9321
+ children: /* @__PURE__ */ jsx(TooltipProvider, {
9322
+ delayDuration: 0,
9323
+ children: /* @__PURE__ */ jsx("div", {
9324
+ "data-slot": "sidebar-wrapper",
9325
+ style: {
9326
+ "--sidebar-width": sidebarWidthValue,
9327
+ "--sidebar-width-icon": SIDEBAR_WIDTH_ICON,
9328
+ ...style
9329
+ },
9330
+ className: cn("group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full", className),
9331
+ ...props,
9332
+ children
9091
9333
  })
9092
9334
  })
9093
9335
  });
9094
9336
  }
9095
- function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas", className, children,...props }) {
9096
- const { isMobile, state, openMobile, setOpenMobile, isResizing } = useSidebar();
9337
+
9338
+ //#endregion
9339
+ //#region src/sidebar/sidebar.tsx
9340
+ function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas", sidebarId = "default", minWidth, maxWidth, className, children,...props }) {
9341
+ const { isMobile, state, openMobile, setOpenMobile, width, isResizing } = useSidebar(sidebarId);
9342
+ const store = React$12.useContext(SidebarContext);
9343
+ const storeRef = React$12.useRef(store);
9344
+ storeRef.current = store;
9345
+ const effectiveMinWidth = minWidth ?? store?.providerMinWidth ?? SIDEBAR_MIN_WIDTH;
9346
+ const effectiveMaxWidth = maxWidth ?? store?.providerMaxWidth ?? SIDEBAR_MAX_WIDTH;
9347
+ React$12.useEffect(() => {
9348
+ storeRef.current?.registerSidebar(sidebarId, {
9349
+ side,
9350
+ minWidth: effectiveMinWidth,
9351
+ maxWidth: effectiveMaxWidth
9352
+ });
9353
+ return () => storeRef.current?.unregisterSidebar(sidebarId);
9354
+ }, [
9355
+ sidebarId,
9356
+ side,
9357
+ effectiveMinWidth,
9358
+ effectiveMaxWidth
9359
+ ]);
9360
+ const sidebarWidthValue = width ? `${width}px` : SIDEBAR_WIDTH;
9361
+ const sidebarStyle = {
9362
+ "--sidebar-width": sidebarWidthValue,
9363
+ "--sidebar-width-icon": SIDEBAR_WIDTH_ICON
9364
+ };
9365
+ const wrappedChildren = /* @__PURE__ */ jsx(SidebarIdContext.Provider, {
9366
+ value: sidebarId,
9367
+ children
9368
+ });
9097
9369
  if (collapsible === "none") return /* @__PURE__ */ jsx("div", {
9098
9370
  "data-slot": "sidebar",
9371
+ style: sidebarStyle,
9099
9372
  className: cn("bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col", className),
9100
9373
  ...props,
9101
- children
9374
+ children: wrappedChildren
9102
9375
  });
9103
9376
  if (isMobile) return /* @__PURE__ */ jsx(Sheet, {
9104
9377
  open: openMobile,
@@ -9116,12 +9389,13 @@ function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas"
9116
9389
  children: [/* @__PURE__ */ jsx(SheetTitle, { children: "Sidebar" }), /* @__PURE__ */ jsx(SheetDescription, { children: "Displays the mobile sidebar." })]
9117
9390
  }), /* @__PURE__ */ jsx("div", {
9118
9391
  className: "flex h-full w-full flex-col",
9119
- children
9392
+ children: wrappedChildren
9120
9393
  })]
9121
9394
  })
9122
9395
  });
9123
9396
  return /* @__PURE__ */ jsxs("div", {
9124
9397
  className: "group peer text-sidebar-foreground hidden md:block",
9398
+ style: sidebarStyle,
9125
9399
  "data-state": state,
9126
9400
  "data-collapsible": state === "collapsed" ? collapsible : "",
9127
9401
  "data-variant": variant,
@@ -9145,14 +9419,19 @@ function Sidebar({ side = "left", variant = "sidebar", collapsible = "offcanvas"
9145
9419
  "data-sidebar": "sidebar",
9146
9420
  "data-slot": "sidebar-inner",
9147
9421
  className: "bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm",
9148
- children
9422
+ children: wrappedChildren
9149
9423
  })
9150
9424
  })]
9151
9425
  });
9152
9426
  }
9153
- function SidebarTrigger({ className, onClick,...props }) {
9154
- const { toggleSidebar } = useSidebar();
9155
- return /* @__PURE__ */ jsxs(Button, {
9427
+ function SidebarTrigger({ className, onClick, sidebarId, children,...props }) {
9428
+ const { toggleSidebar } = useSidebar(sidebarId);
9429
+ const store = React$12.useContext(SidebarContext);
9430
+ const ctxId = React$12.useContext(SidebarIdContext);
9431
+ const resolvedId = sidebarId ?? ctxId;
9432
+ const side = store?.sidebarRegistry[resolvedId]?.side;
9433
+ const Icon = side === "right" ? PanelRightIcon : PanelLeftIcon;
9434
+ return /* @__PURE__ */ jsx(Button, {
9156
9435
  "data-sidebar": "trigger",
9157
9436
  "data-slot": "sidebar-trigger",
9158
9437
  variant: "ghost",
@@ -9163,24 +9442,25 @@ function SidebarTrigger({ className, onClick,...props }) {
9163
9442
  toggleSidebar();
9164
9443
  },
9165
9444
  ...props,
9166
- children: [/* @__PURE__ */ jsx(PanelLeftIcon, {}), /* @__PURE__ */ jsx("span", {
9445
+ children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Icon, {}), /* @__PURE__ */ jsx("span", {
9167
9446
  className: "sr-only",
9168
9447
  children: "Toggle Sidebar"
9169
- })]
9448
+ })] })
9170
9449
  });
9171
9450
  }
9172
9451
  function SidebarRail({ className,...props }) {
9173
- const { toggleSidebar } = useSidebar();
9174
- const resizeCtx = React$6.useContext(SidebarResizeContext);
9175
- const startXRef = React$6.useRef(0);
9176
- const hasDraggedRef = React$6.useRef(false);
9177
- const isResizable = !!resizeCtx?.onWidthChange;
9178
- const handleMouseDown = React$6.useCallback((e) => {
9179
- if (!isResizable || !resizeCtx) return;
9452
+ const { toggleSidebar, setWidth, minWidth, maxWidth } = useSidebar();
9453
+ const store = React$12.useContext(SidebarContext);
9454
+ const startXRef = React$12.useRef(0);
9455
+ const hasDraggedRef = React$12.useRef(false);
9456
+ const sidebarId = React$12.useContext(SidebarIdContext);
9457
+ const isResizable = !!store?.sidebarRegistry[sidebarId];
9458
+ const handleMouseDown = React$12.useCallback((e) => {
9459
+ if (!isResizable) return;
9180
9460
  e.preventDefault();
9181
9461
  startXRef.current = e.clientX;
9182
9462
  hasDraggedRef.current = false;
9183
- resizeCtx.setIsResizing(true);
9463
+ store?.setIsResizing(true);
9184
9464
  const sidebarEl = e.target.closest("[data-slot=\"sidebar-container\"]");
9185
9465
  const sidebarLeft = sidebarEl?.getBoundingClientRect().left ?? 0;
9186
9466
  const side = e.target.closest("[data-side]")?.getAttribute("data-side");
@@ -9191,10 +9471,10 @@ function SidebarRail({ className,...props }) {
9191
9471
  const sidebarRight = sidebarEl?.getBoundingClientRect().right ?? globalThis.innerWidth;
9192
9472
  newWidth = sidebarRight - moveEvent.clientX;
9193
9473
  } else newWidth = moveEvent.clientX - sidebarLeft;
9194
- if (newWidth >= resizeCtx.minWidth && newWidth <= resizeCtx.maxWidth) resizeCtx.onWidthChange?.(newWidth);
9474
+ if (newWidth >= minWidth && newWidth <= maxWidth) setWidth(newWidth);
9195
9475
  };
9196
9476
  const handleMouseUp = () => {
9197
- resizeCtx.setIsResizing(false);
9477
+ store?.setIsResizing(false);
9198
9478
  document.removeEventListener("mousemove", handleMouseMove);
9199
9479
  document.removeEventListener("mouseup", handleMouseUp);
9200
9480
  document.body.style.cursor = "";
@@ -9204,8 +9484,14 @@ function SidebarRail({ className,...props }) {
9204
9484
  document.addEventListener("mouseup", handleMouseUp);
9205
9485
  document.body.style.cursor = "col-resize";
9206
9486
  document.body.style.userSelect = "none";
9207
- }, [isResizable, resizeCtx]);
9208
- const handleClick = React$6.useCallback(() => {
9487
+ }, [
9488
+ isResizable,
9489
+ store,
9490
+ setWidth,
9491
+ minWidth,
9492
+ maxWidth
9493
+ ]);
9494
+ const handleClick = React$12.useCallback(() => {
9209
9495
  if (hasDraggedRef.current) return;
9210
9496
  toggleSidebar();
9211
9497
  }, [toggleSidebar]);
@@ -9440,6 +9726,271 @@ function SidebarMenuSubButton({ asChild = false, size = "md", isActive = false,
9440
9726
  });
9441
9727
  }
9442
9728
 
9729
+ //#endregion
9730
+ //#region src/sidebar/sidebar-tab-context-provider.tsx
9731
+ const SidebarTabsContext = React$11.createContext(null);
9732
+ function SidebarTabsProvider({ children }) {
9733
+ const [tabsMap, setTabsMap] = React$11.useState({});
9734
+ const [activeTab, setActiveTabState] = React$11.useState({});
9735
+ const register = React$11.useCallback((side, tab) => {
9736
+ setTabsMap((prev) => {
9737
+ const next = new Map(prev[side]);
9738
+ next.set(tab.id, tab);
9739
+ return {
9740
+ ...prev,
9741
+ [side]: next
9742
+ };
9743
+ });
9744
+ setActiveTabState((prev) => {
9745
+ if (prev[side] === void 0 || prev[side] === null) return {
9746
+ ...prev,
9747
+ [side]: tab.id
9748
+ };
9749
+ return prev;
9750
+ });
9751
+ }, []);
9752
+ const unregister = React$11.useCallback((side, tabId) => {
9753
+ setTabsMap((prev) => {
9754
+ const next = new Map(prev[side]);
9755
+ next.delete(tabId);
9756
+ return {
9757
+ ...prev,
9758
+ [side]: next
9759
+ };
9760
+ });
9761
+ setActiveTabState((prev) => {
9762
+ if (prev[side] === tabId) return {
9763
+ ...prev,
9764
+ [side]: null
9765
+ };
9766
+ return prev;
9767
+ });
9768
+ }, []);
9769
+ const setActiveTab = React$11.useCallback((side, tabId) => {
9770
+ setActiveTabState((prev) => {
9771
+ if (prev[side] === tabId) return prev;
9772
+ return {
9773
+ ...prev,
9774
+ [side]: tabId
9775
+ };
9776
+ });
9777
+ }, []);
9778
+ const sortedTabs = React$11.useMemo(() => {
9779
+ const sort = (map) => [...map.values()].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
9780
+ const result = {};
9781
+ for (const [side, map] of Object.entries(tabsMap)) result[side] = sort(map);
9782
+ return result;
9783
+ }, [tabsMap]);
9784
+ const value = React$11.useMemo(() => ({
9785
+ tabs: sortedTabs,
9786
+ activeTab,
9787
+ register,
9788
+ unregister,
9789
+ setActiveTab
9790
+ }), [
9791
+ sortedTabs,
9792
+ activeTab,
9793
+ register,
9794
+ unregister,
9795
+ setActiveTab
9796
+ ]);
9797
+ return /* @__PURE__ */ jsx(SidebarTabsContext.Provider, {
9798
+ value,
9799
+ children
9800
+ });
9801
+ }
9802
+ function useSidebarTabs(side) {
9803
+ const ctx = React$11.useContext(SidebarTabsContext);
9804
+ if (!ctx) throw new Error("useSidebarTabs must be used within a SidebarTabsProvider.");
9805
+ const boundSetActiveTab = React$11.useCallback((tabId) => {
9806
+ if (side) ctx.setActiveTab(side, tabId);
9807
+ }, [ctx.setActiveTab, side]);
9808
+ const boundResult = React$11.useMemo(() => side ? {
9809
+ tabs: ctx.tabs[side] ?? [],
9810
+ activeTab: ctx.activeTab[side] ?? null,
9811
+ setActiveTab: boundSetActiveTab
9812
+ } : null, [
9813
+ side,
9814
+ ctx.tabs,
9815
+ ctx.activeTab,
9816
+ boundSetActiveTab
9817
+ ]);
9818
+ if (side) return boundResult;
9819
+ return ctx;
9820
+ }
9821
+
9822
+ //#endregion
9823
+ //#region src/sidebar/sidebar-tab.tsx
9824
+ function SidebarTab({ side, id, icon, label, render, order }) {
9825
+ const ctx = React$10.useContext(SidebarTabsContext);
9826
+ if (!ctx) throw new Error("SidebarTab must be used within a SidebarTabsProvider.");
9827
+ const { register, unregister } = ctx;
9828
+ const renderRef = React$10.useRef(render);
9829
+ renderRef.current = render;
9830
+ const iconRef = React$10.useRef(icon);
9831
+ iconRef.current = icon;
9832
+ const stableRender = React$10.useCallback(() => renderRef.current(), []);
9833
+ React$10.useEffect(() => {
9834
+ register(side, {
9835
+ id,
9836
+ icon: iconRef.current,
9837
+ label,
9838
+ render: stableRender,
9839
+ order
9840
+ });
9841
+ return () => unregister(side, id);
9842
+ }, [
9843
+ side,
9844
+ id,
9845
+ label,
9846
+ order,
9847
+ register,
9848
+ unregister,
9849
+ stableRender
9850
+ ]);
9851
+ return null;
9852
+ }
9853
+ function DynamicTabbedSidebar({ side, orientation = "horizontal", collapsible = "offcanvas", className,...sidebarProps }) {
9854
+ const ctx = React$10.useContext(SidebarTabsContext);
9855
+ if (!ctx) throw new Error("DynamicTabbedSidebar must be used within a SidebarTabsProvider.");
9856
+ const { setActiveTab } = ctx;
9857
+ const tabs = ctx.tabs[side] ?? [];
9858
+ const activeTabId = ctx.activeTab[side] ?? null;
9859
+ const activeTab = tabs.find((t) => t.id === activeTabId);
9860
+ React$10.useEffect(() => {
9861
+ if (tabs.length > 0 && tabs[0] && !activeTab) setActiveTab(side, tabs[0].id);
9862
+ }, [
9863
+ tabs,
9864
+ activeTab,
9865
+ side,
9866
+ setActiveTab
9867
+ ]);
9868
+ const isVertical = orientation === "vertical";
9869
+ const effectiveCollapsible = isVertical && collapsible === "offcanvas" ? "icon" : collapsible;
9870
+ return /* @__PURE__ */ jsxs(Sidebar, {
9871
+ side,
9872
+ sidebarId: side,
9873
+ collapsible: effectiveCollapsible,
9874
+ className,
9875
+ ...sidebarProps,
9876
+ children: [/* @__PURE__ */ jsx(TabbedSidebarContent, {
9877
+ side,
9878
+ tabs,
9879
+ activeTabId,
9880
+ activeTab,
9881
+ isVertical,
9882
+ collapsible: effectiveCollapsible
9883
+ }), /* @__PURE__ */ jsx(SidebarRail, {})]
9884
+ });
9885
+ }
9886
+ function TabbedSidebarContent({ side, tabs, activeTabId, activeTab, isVertical, collapsible }) {
9887
+ const { state } = useSidebar(side);
9888
+ const isCollapsed = state === "collapsed";
9889
+ const isIconCollapsible = collapsible === "icon";
9890
+ if (isCollapsed && isIconCollapsible) return /* @__PURE__ */ jsx("div", {
9891
+ className: "flex h-full flex-col",
9892
+ children: /* @__PURE__ */ jsx(VerticalTabBar, {
9893
+ side,
9894
+ tabs,
9895
+ activeTabId
9896
+ })
9897
+ });
9898
+ if (isVertical) return /* @__PURE__ */ jsxs("div", {
9899
+ className: "flex h-full flex-row",
9900
+ children: [/* @__PURE__ */ jsx(VerticalTabBar, {
9901
+ side,
9902
+ tabs,
9903
+ activeTabId
9904
+ }), /* @__PURE__ */ jsx("div", {
9905
+ className: "flex min-w-0 flex-1 flex-col",
9906
+ children: /* @__PURE__ */ jsx(SidebarContent, { children: activeTab?.render() })
9907
+ })]
9908
+ });
9909
+ return /* @__PURE__ */ jsxs("div", {
9910
+ className: "flex h-full flex-col",
9911
+ children: [
9912
+ /* @__PURE__ */ jsx(HorizontalTabBar, {
9913
+ side,
9914
+ tabs,
9915
+ activeTabId
9916
+ }),
9917
+ tabs.length > 0 && /* @__PURE__ */ jsx(SidebarSeparator, {}),
9918
+ /* @__PURE__ */ jsx("div", {
9919
+ className: "flex min-w-0 flex-1 flex-col",
9920
+ children: /* @__PURE__ */ jsx(SidebarContent, { children: activeTab?.render() })
9921
+ })
9922
+ ]
9923
+ });
9924
+ }
9925
+ function HorizontalTabBar({ side, tabs, activeTabId }) {
9926
+ const ctx = React$10.useContext(SidebarTabsContext);
9927
+ const { state, toggleSidebar } = useSidebar(side);
9928
+ if (tabs.length === 0) return null;
9929
+ const handleTabClick = (tabId) => {
9930
+ if (state === "collapsed") {
9931
+ ctx.setActiveTab(side, tabId);
9932
+ toggleSidebar();
9933
+ } else if (tabId === activeTabId) toggleSidebar();
9934
+ else ctx.setActiveTab(side, tabId);
9935
+ };
9936
+ return /* @__PURE__ */ jsx(SidebarHeader, { children: /* @__PURE__ */ jsx("div", {
9937
+ className: "flex w-full items-center gap-0.5 rounded-md bg-muted p-1",
9938
+ role: "tablist",
9939
+ children: tabs.map((tab) => {
9940
+ const Icon = tab.icon;
9941
+ const isActive = tab.id === activeTabId;
9942
+ return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
9943
+ asChild: true,
9944
+ children: /* @__PURE__ */ jsx("button", {
9945
+ role: "tab",
9946
+ "aria-selected": isActive,
9947
+ className: cn("flex flex-1 items-center justify-center rounded-sm p-1.5 transition-colors", isActive ? "bg-background text-foreground shadow-sm" : "text-muted-foreground hover:text-foreground"),
9948
+ onClick: () => handleTabClick(tab.id),
9949
+ children: /* @__PURE__ */ jsx(Icon, { className: "size-4" })
9950
+ })
9951
+ }), /* @__PURE__ */ jsx(TooltipContent, {
9952
+ side: "bottom",
9953
+ children: tab.label
9954
+ })] }, tab.id);
9955
+ })
9956
+ }) });
9957
+ }
9958
+ function VerticalTabBar({ side, tabs, activeTabId }) {
9959
+ const ctx = React$10.useContext(SidebarTabsContext);
9960
+ const { state, toggleSidebar } = useSidebar(side);
9961
+ const isCollapsed = state === "collapsed";
9962
+ if (tabs.length === 0) return null;
9963
+ const handleTabClick = (tabId) => {
9964
+ if (isCollapsed) {
9965
+ ctx.setActiveTab(side, tabId);
9966
+ toggleSidebar();
9967
+ } else if (tabId === activeTabId) toggleSidebar();
9968
+ else ctx.setActiveTab(side, tabId);
9969
+ };
9970
+ return /* @__PURE__ */ jsx("div", {
9971
+ className: "flex flex-col gap-1 border-r border-sidebar-border p-1",
9972
+ role: "tablist",
9973
+ children: tabs.map((tab) => {
9974
+ const Icon = tab.icon;
9975
+ const isActive = tab.id === activeTabId;
9976
+ return /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
9977
+ asChild: true,
9978
+ children: /* @__PURE__ */ jsx("button", {
9979
+ role: "tab",
9980
+ "aria-selected": isActive,
9981
+ className: cn("size-9 flex items-center justify-center rounded-md transition-colors", isActive ? "bg-sidebar-accent text-sidebar-accent-foreground" : "text-muted-foreground hover:text-foreground hover:bg-sidebar-accent/50"),
9982
+ onClick: () => handleTabClick(tab.id),
9983
+ children: /* @__PURE__ */ jsx(Icon, { className: "size-4" })
9984
+ })
9985
+ }), /* @__PURE__ */ jsx(TooltipContent, {
9986
+ side: side === "left" ? "right" : "left",
9987
+ hidden: state === "expanded",
9988
+ children: tab.label
9989
+ })] }, tab.id);
9990
+ })
9991
+ });
9992
+ }
9993
+
9443
9994
  //#endregion
9444
9995
  //#region src/slicer/slicer.tsx
9445
9996
  /**
@@ -9722,7 +10273,7 @@ const knobVariants = cva("bg-background block size-4 shrink-0 rounded-full borde
9722
10273
  defaultVariants: { knobVariant: "default" }
9723
10274
  });
9724
10275
  function Slider({ className, defaultValue, value, min = 0, max = 100, sliderVariant, knobVariant, knobSize,...props }) {
9725
- const _values = React$5.useMemo(() => {
10276
+ const _values = React$9.useMemo(() => {
9726
10277
  if (Array.isArray(value)) return value;
9727
10278
  else if (Array.isArray(defaultValue)) return defaultValue;
9728
10279
  return [min, max];
@@ -9755,6 +10306,785 @@ function Slider({ className, defaultValue, value, min = 0, max = 100, sliderVari
9755
10306
  });
9756
10307
  }
9757
10308
 
10309
+ //#endregion
10310
+ //#region src/hooks/use-isomorphic-layout-effect.ts
10311
+ const useIsomorphicLayoutEffect = typeof window !== "undefined" ? React$8.useLayoutEffect : React$8.useEffect;
10312
+
10313
+ //#endregion
10314
+ //#region src/hooks/use-as-ref.ts
10315
+ function useAsRef(props) {
10316
+ const ref = React$7.useRef(props);
10317
+ useIsomorphicLayoutEffect(() => {
10318
+ ref.current = props;
10319
+ });
10320
+ return ref;
10321
+ }
10322
+
10323
+ //#endregion
10324
+ //#region src/hooks/use-lazy-ref.ts
10325
+ function useLazyRef(fn) {
10326
+ const ref = React$6.useRef(null);
10327
+ if (ref.current === null) ref.current = fn();
10328
+ return ref;
10329
+ }
10330
+
10331
+ //#endregion
10332
+ //#region src/stepper/stepper.tsx
10333
+ const ROOT_NAME = "Stepper";
10334
+ const LIST_NAME = "StepperList";
10335
+ const ITEM_NAME = "StepperItem";
10336
+ const TRIGGER_NAME = "StepperTrigger";
10337
+ const INDICATOR_NAME = "StepperIndicator";
10338
+ const SEPARATOR_NAME = "StepperSeparator";
10339
+ const TITLE_NAME = "StepperTitle";
10340
+ const DESCRIPTION_NAME = "StepperDescription";
10341
+ const CONTENT_NAME = "StepperContent";
10342
+ const PREV_NAME = "StepperPrev";
10343
+ const NEXT_NAME = "StepperNext";
10344
+ const ENTRY_FOCUS = "stepperFocusGroup.onEntryFocus";
10345
+ const EVENT_OPTIONS = {
10346
+ bubbles: false,
10347
+ cancelable: true
10348
+ };
10349
+ const ARROW_KEYS = [
10350
+ "ArrowUp",
10351
+ "ArrowDown",
10352
+ "ArrowLeft",
10353
+ "ArrowRight"
10354
+ ];
10355
+ function getId(id, variant, value) {
10356
+ return `${id}-${variant}-${value}`;
10357
+ }
10358
+ const MAP_KEY_TO_FOCUS_INTENT = {
10359
+ ArrowLeft: "prev",
10360
+ ArrowUp: "prev",
10361
+ ArrowRight: "next",
10362
+ ArrowDown: "next",
10363
+ PageUp: "first",
10364
+ Home: "first",
10365
+ PageDown: "last",
10366
+ End: "last"
10367
+ };
10368
+ function getDirectionAwareKey(key, dir) {
10369
+ if (dir !== "rtl") return key;
10370
+ return key === "ArrowLeft" ? "ArrowRight" : key === "ArrowRight" ? "ArrowLeft" : key;
10371
+ }
10372
+ function getFocusIntent(event, dir, orientation) {
10373
+ const key = getDirectionAwareKey(event.key, dir);
10374
+ if (orientation === "horizontal" && ["ArrowUp", "ArrowDown"].includes(key)) return void 0;
10375
+ if (orientation === "vertical" && ["ArrowLeft", "ArrowRight"].includes(key)) return void 0;
10376
+ return MAP_KEY_TO_FOCUS_INTENT[key];
10377
+ }
10378
+ function focusFirst(candidates, preventScroll = false) {
10379
+ const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
10380
+ for (const candidateRef of candidates) {
10381
+ const candidate = candidateRef.current;
10382
+ if (!candidate) continue;
10383
+ if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
10384
+ candidate.focus({ preventScroll });
10385
+ if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
10386
+ }
10387
+ }
10388
+ function wrapArray(array, startIndex) {
10389
+ return array.map((_, index) => array[(startIndex + index) % array.length]);
10390
+ }
10391
+ function getDataState(value, itemValue, stepState, steps, variant = "item") {
10392
+ const stepKeys = Array.from(steps.keys());
10393
+ const currentIndex = stepKeys.indexOf(itemValue);
10394
+ if (stepState?.completed) return "completed";
10395
+ if (value === itemValue) return variant === "separator" ? "inactive" : "active";
10396
+ if (value) {
10397
+ const activeIndex = stepKeys.indexOf(value);
10398
+ if (activeIndex > currentIndex) return "completed";
10399
+ }
10400
+ return "inactive";
10401
+ }
10402
+ const StoreContext = React$5.createContext(null);
10403
+ function useStoreContext(consumerName) {
10404
+ const context = React$5.useContext(StoreContext);
10405
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME}\``);
10406
+ return context;
10407
+ }
10408
+ function useStore(selector) {
10409
+ const store = useStoreContext("useStore");
10410
+ const getSnapshot = React$5.useCallback(() => selector(store.getState()), [store, selector]);
10411
+ return React$5.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
10412
+ }
10413
+ const StepperContext = React$5.createContext(null);
10414
+ function useStepperContext(consumerName) {
10415
+ const context = React$5.useContext(StepperContext);
10416
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME}\``);
10417
+ return context;
10418
+ }
10419
+ function Stepper(props) {
10420
+ const { value, defaultValue, onValueChange, onValueComplete, onValueAdd, onValueRemove, onValidate, dir: dirProp, orientation = "horizontal", activationMode = "automatic", asChild, disabled = false, nonInteractive = false, loop = false, className, id,...rootProps } = props;
10421
+ const listenersRef = useLazyRef(() => new Set());
10422
+ const stateRef = useLazyRef(() => ({
10423
+ steps: new Map(),
10424
+ value: value ?? defaultValue ?? ""
10425
+ }));
10426
+ const propsRef = useAsRef({
10427
+ onValueChange,
10428
+ onValueComplete,
10429
+ onValueAdd,
10430
+ onValueRemove,
10431
+ onValidate
10432
+ });
10433
+ const store = React$5.useMemo(() => {
10434
+ return {
10435
+ subscribe: (cb) => {
10436
+ listenersRef.current.add(cb);
10437
+ return () => listenersRef.current.delete(cb);
10438
+ },
10439
+ getState: () => stateRef.current,
10440
+ setState: (key, value$1) => {
10441
+ if (Object.is(stateRef.current[key], value$1)) return;
10442
+ if (key === "value" && typeof value$1 === "string") {
10443
+ stateRef.current.value = value$1;
10444
+ propsRef.current.onValueChange?.(value$1);
10445
+ } else stateRef.current[key] = value$1;
10446
+ store.notify();
10447
+ },
10448
+ setStateWithValidation: async (value$1, direction) => {
10449
+ if (!propsRef.current.onValidate) {
10450
+ store.setState("value", value$1);
10451
+ return true;
10452
+ }
10453
+ try {
10454
+ const isValid = await propsRef.current.onValidate(value$1, direction);
10455
+ if (isValid) store.setState("value", value$1);
10456
+ return isValid;
10457
+ } catch {
10458
+ return false;
10459
+ }
10460
+ },
10461
+ hasValidation: () => !!propsRef.current.onValidate,
10462
+ addStep: (value$1, completed, disabled$1) => {
10463
+ const newStep = {
10464
+ value: value$1,
10465
+ completed,
10466
+ disabled: disabled$1
10467
+ };
10468
+ stateRef.current.steps.set(value$1, newStep);
10469
+ propsRef.current.onValueAdd?.(value$1);
10470
+ store.notify();
10471
+ },
10472
+ removeStep: (value$1) => {
10473
+ stateRef.current.steps.delete(value$1);
10474
+ propsRef.current.onValueRemove?.(value$1);
10475
+ store.notify();
10476
+ },
10477
+ setStep: (value$1, completed, disabled$1) => {
10478
+ const step = stateRef.current.steps.get(value$1);
10479
+ if (step) {
10480
+ const updatedStep = {
10481
+ ...step,
10482
+ completed,
10483
+ disabled: disabled$1
10484
+ };
10485
+ stateRef.current.steps.set(value$1, updatedStep);
10486
+ if (completed !== step.completed) propsRef.current.onValueComplete?.(value$1, completed);
10487
+ store.notify();
10488
+ }
10489
+ },
10490
+ notify: () => {
10491
+ for (const cb of listenersRef.current) cb();
10492
+ }
10493
+ };
10494
+ }, [
10495
+ listenersRef,
10496
+ stateRef,
10497
+ propsRef
10498
+ ]);
10499
+ useIsomorphicLayoutEffect(() => {
10500
+ if (value !== void 0) store.setState("value", value);
10501
+ }, [value]);
10502
+ const dir = useDirection(dirProp);
10503
+ const instanceId = React$5.useId();
10504
+ const rootId = id ?? instanceId;
10505
+ const contextValue = React$5.useMemo(() => ({
10506
+ rootId,
10507
+ dir,
10508
+ orientation,
10509
+ activationMode,
10510
+ disabled,
10511
+ nonInteractive,
10512
+ loop
10513
+ }), [
10514
+ rootId,
10515
+ dir,
10516
+ orientation,
10517
+ activationMode,
10518
+ disabled,
10519
+ nonInteractive,
10520
+ loop
10521
+ ]);
10522
+ const RootPrimitive = asChild ? Slot : "div";
10523
+ return /* @__PURE__ */ jsx(StoreContext.Provider, {
10524
+ value: store,
10525
+ children: /* @__PURE__ */ jsx(StepperContext.Provider, {
10526
+ value: contextValue,
10527
+ children: /* @__PURE__ */ jsx(RootPrimitive, {
10528
+ id: rootId,
10529
+ "data-disabled": disabled ? "" : void 0,
10530
+ "data-orientation": orientation,
10531
+ "data-slot": "stepper",
10532
+ dir,
10533
+ ...rootProps,
10534
+ className: cn("flex gap-6", orientation === "horizontal" ? "w-full flex-col" : "flex-row", className)
10535
+ })
10536
+ })
10537
+ });
10538
+ }
10539
+ const FocusContext = React$5.createContext(null);
10540
+ function useFocusContext(consumerName) {
10541
+ const context = React$5.useContext(FocusContext);
10542
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`FocusProvider\``);
10543
+ return context;
10544
+ }
10545
+ function StepperList(props) {
10546
+ const { asChild, onBlur: onBlurProp, onFocus: onFocusProp, onMouseDown: onMouseDownProp, className, children, ref,...listProps } = props;
10547
+ const context = useStepperContext(LIST_NAME);
10548
+ const orientation = context.orientation;
10549
+ const currentValue = useStore((state) => state.value);
10550
+ const propsRef = useAsRef({
10551
+ onBlur: onBlurProp,
10552
+ onFocus: onFocusProp,
10553
+ onMouseDown: onMouseDownProp
10554
+ });
10555
+ const [tabStopId, setTabStopId] = React$5.useState(null);
10556
+ const [isTabbingBackOut, setIsTabbingBackOut] = React$5.useState(false);
10557
+ const [focusableItemCount, setFocusableItemCount] = React$5.useState(0);
10558
+ const isClickFocusRef = React$5.useRef(false);
10559
+ const itemsRef = React$5.useRef(new Map());
10560
+ const listRef = React$5.useRef(null);
10561
+ const composedRef = useComposedRefs(ref, listRef);
10562
+ const onItemFocus = React$5.useCallback((tabStopId$1) => {
10563
+ setTabStopId(tabStopId$1);
10564
+ }, []);
10565
+ const onItemShiftTab = React$5.useCallback(() => {
10566
+ setIsTabbingBackOut(true);
10567
+ }, []);
10568
+ const onFocusableItemAdd = React$5.useCallback(() => {
10569
+ setFocusableItemCount((prevCount) => prevCount + 1);
10570
+ }, []);
10571
+ const onFocusableItemRemove = React$5.useCallback(() => {
10572
+ setFocusableItemCount((prevCount) => prevCount - 1);
10573
+ }, []);
10574
+ const onItemRegister = React$5.useCallback((item) => {
10575
+ itemsRef.current.set(item.id, item);
10576
+ }, []);
10577
+ const onItemUnregister = React$5.useCallback((id) => {
10578
+ itemsRef.current.delete(id);
10579
+ }, []);
10580
+ const getItems = React$5.useCallback(() => {
10581
+ return Array.from(itemsRef.current.values()).filter((item) => item.ref.current).sort((a, b) => {
10582
+ const elementA = a.ref.current;
10583
+ const elementB = b.ref.current;
10584
+ if (!elementA || !elementB) return 0;
10585
+ const position = elementA.compareDocumentPosition(elementB);
10586
+ if (position & Node.DOCUMENT_POSITION_FOLLOWING) return -1;
10587
+ if (position & Node.DOCUMENT_POSITION_PRECEDING) return 1;
10588
+ return 0;
10589
+ });
10590
+ }, []);
10591
+ const onBlur = React$5.useCallback((event) => {
10592
+ propsRef.current.onBlur?.(event);
10593
+ if (event.defaultPrevented) return;
10594
+ setIsTabbingBackOut(false);
10595
+ }, [propsRef]);
10596
+ const onFocus = React$5.useCallback((event) => {
10597
+ propsRef.current.onFocus?.(event);
10598
+ if (event.defaultPrevented) return;
10599
+ const isKeyboardFocus = !isClickFocusRef.current;
10600
+ if (event.target === event.currentTarget && isKeyboardFocus && !isTabbingBackOut) {
10601
+ const entryFocusEvent = new CustomEvent(ENTRY_FOCUS, EVENT_OPTIONS);
10602
+ event.currentTarget.dispatchEvent(entryFocusEvent);
10603
+ if (!entryFocusEvent.defaultPrevented) {
10604
+ const items = Array.from(itemsRef.current.values()).filter((item) => !item.disabled);
10605
+ const selectedItem = currentValue ? items.find((item) => item.value === currentValue) : void 0;
10606
+ const activeItem = items.find((item) => item.active);
10607
+ const currentItem = items.find((item) => item.id === tabStopId);
10608
+ const candidateItems = [
10609
+ selectedItem,
10610
+ activeItem,
10611
+ currentItem,
10612
+ ...items
10613
+ ].filter(Boolean);
10614
+ const candidateRefs = candidateItems.map((item) => item.ref);
10615
+ focusFirst(candidateRefs, false);
10616
+ }
10617
+ }
10618
+ isClickFocusRef.current = false;
10619
+ }, [
10620
+ propsRef,
10621
+ isTabbingBackOut,
10622
+ currentValue,
10623
+ tabStopId
10624
+ ]);
10625
+ const onMouseDown = React$5.useCallback((event) => {
10626
+ propsRef.current.onMouseDown?.(event);
10627
+ if (event.defaultPrevented) return;
10628
+ isClickFocusRef.current = true;
10629
+ }, [propsRef]);
10630
+ const focusContextValue = React$5.useMemo(() => ({
10631
+ tabStopId,
10632
+ onItemFocus,
10633
+ onItemShiftTab,
10634
+ onFocusableItemAdd,
10635
+ onFocusableItemRemove,
10636
+ onItemRegister,
10637
+ onItemUnregister,
10638
+ getItems
10639
+ }), [
10640
+ tabStopId,
10641
+ onItemFocus,
10642
+ onItemShiftTab,
10643
+ onFocusableItemAdd,
10644
+ onFocusableItemRemove,
10645
+ onItemRegister,
10646
+ onItemUnregister,
10647
+ getItems
10648
+ ]);
10649
+ const ListPrimitive = asChild ? Slot : "div";
10650
+ return /* @__PURE__ */ jsx(FocusContext.Provider, {
10651
+ value: focusContextValue,
10652
+ children: /* @__PURE__ */ jsx(ListPrimitive, {
10653
+ role: "tablist",
10654
+ "aria-orientation": orientation,
10655
+ "data-orientation": orientation,
10656
+ "data-slot": "stepper-list",
10657
+ dir: context.dir,
10658
+ tabIndex: isTabbingBackOut || focusableItemCount === 0 ? -1 : 0,
10659
+ ...listProps,
10660
+ ref: composedRef,
10661
+ className: cn("flex outline-none", orientation === "horizontal" ? "flex-row items-center" : "flex-col items-start", className),
10662
+ onBlur,
10663
+ onFocus,
10664
+ onMouseDown,
10665
+ children
10666
+ })
10667
+ });
10668
+ }
10669
+ const StepperItemContext = React$5.createContext(null);
10670
+ function useStepperItemContext(consumerName) {
10671
+ const context = React$5.useContext(StepperItemContext);
10672
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ITEM_NAME}\``);
10673
+ return context;
10674
+ }
10675
+ function StepperItem(props) {
10676
+ const { value: itemValue, completed = false, disabled = false, asChild, className, children, ref,...itemProps } = props;
10677
+ const context = useStepperContext(ITEM_NAME);
10678
+ const store = useStoreContext(ITEM_NAME);
10679
+ const orientation = context.orientation;
10680
+ const value = useStore((state) => state.value);
10681
+ useIsomorphicLayoutEffect(() => {
10682
+ store.addStep(itemValue, completed, disabled);
10683
+ return () => {
10684
+ store.removeStep(itemValue);
10685
+ };
10686
+ }, [
10687
+ itemValue,
10688
+ completed,
10689
+ disabled
10690
+ ]);
10691
+ useIsomorphicLayoutEffect(() => {
10692
+ store.setStep(itemValue, completed, disabled);
10693
+ }, [
10694
+ itemValue,
10695
+ completed,
10696
+ disabled
10697
+ ]);
10698
+ const stepState = useStore((state) => state.steps.get(itemValue));
10699
+ const steps = useStore((state) => state.steps);
10700
+ const dataState = getDataState(value, itemValue, stepState, steps);
10701
+ const itemContextValue = React$5.useMemo(() => ({
10702
+ value: itemValue,
10703
+ stepState
10704
+ }), [itemValue, stepState]);
10705
+ const ItemPrimitive = asChild ? Slot : "div";
10706
+ return /* @__PURE__ */ jsx(StepperItemContext.Provider, {
10707
+ value: itemContextValue,
10708
+ children: /* @__PURE__ */ jsx(ItemPrimitive, {
10709
+ "data-disabled": stepState?.disabled ? "" : void 0,
10710
+ "data-orientation": orientation,
10711
+ "data-state": dataState,
10712
+ "data-slot": "stepper-item",
10713
+ dir: context.dir,
10714
+ ...itemProps,
10715
+ ref,
10716
+ className: cn("relative flex not-last:flex-1 items-center", orientation === "horizontal" ? "flex-row" : "flex-col", className),
10717
+ children
10718
+ })
10719
+ });
10720
+ }
10721
+ function StepperTrigger(props) {
10722
+ const { asChild, onClick: onClickProp, onFocus: onFocusProp, onKeyDown: onKeyDownProp, onMouseDown: onMouseDownProp, disabled, className, ref,...triggerProps } = props;
10723
+ const context = useStepperContext(TRIGGER_NAME);
10724
+ const itemContext = useStepperItemContext(TRIGGER_NAME);
10725
+ const itemValue = itemContext.value;
10726
+ const store = useStoreContext(TRIGGER_NAME);
10727
+ const focusContext = useFocusContext(TRIGGER_NAME);
10728
+ const value = useStore((state) => state.value);
10729
+ const steps = useStore((state) => state.steps);
10730
+ const stepState = useStore((state) => state.steps.get(itemValue));
10731
+ const propsRef = useAsRef({
10732
+ onClick: onClickProp,
10733
+ onFocus: onFocusProp,
10734
+ onKeyDown: onKeyDownProp,
10735
+ onMouseDown: onMouseDownProp
10736
+ });
10737
+ const activationMode = context.activationMode;
10738
+ const orientation = context.orientation;
10739
+ const loop = context.loop;
10740
+ const stepIndex = Array.from(steps.keys()).indexOf(itemValue);
10741
+ const stepPosition = stepIndex + 1;
10742
+ const stepCount = steps.size;
10743
+ const triggerId = getId(context.rootId, "trigger", itemValue);
10744
+ const contentId = getId(context.rootId, "content", itemValue);
10745
+ const titleId = getId(context.rootId, "title", itemValue);
10746
+ const descriptionId = getId(context.rootId, "description", itemValue);
10747
+ const isDisabled = disabled || stepState?.disabled || context.disabled;
10748
+ const isActive = value === itemValue;
10749
+ const isTabStop = focusContext.tabStopId === triggerId;
10750
+ const dataState = getDataState(value, itemValue, stepState, steps);
10751
+ const triggerRef = React$5.useRef(null);
10752
+ const composedRef = useComposedRefs(ref, triggerRef);
10753
+ const isArrowKeyPressedRef = React$5.useRef(false);
10754
+ const isMouseClickRef = React$5.useRef(false);
10755
+ React$5.useEffect(() => {
10756
+ function onKeyDown$1(event) {
10757
+ if (ARROW_KEYS.includes(event.key)) isArrowKeyPressedRef.current = true;
10758
+ }
10759
+ function onKeyUp() {
10760
+ isArrowKeyPressedRef.current = false;
10761
+ }
10762
+ document.addEventListener("keydown", onKeyDown$1);
10763
+ document.addEventListener("keyup", onKeyUp);
10764
+ return () => {
10765
+ document.removeEventListener("keydown", onKeyDown$1);
10766
+ document.removeEventListener("keyup", onKeyUp);
10767
+ };
10768
+ }, []);
10769
+ useIsomorphicLayoutEffect(() => {
10770
+ focusContext.onItemRegister({
10771
+ id: triggerId,
10772
+ ref: triggerRef,
10773
+ value: itemValue,
10774
+ active: isTabStop,
10775
+ disabled: !!isDisabled
10776
+ });
10777
+ if (!isDisabled) focusContext.onFocusableItemAdd();
10778
+ return () => {
10779
+ focusContext.onItemUnregister(triggerId);
10780
+ if (!isDisabled) focusContext.onFocusableItemRemove();
10781
+ };
10782
+ }, [
10783
+ focusContext,
10784
+ triggerId,
10785
+ itemValue,
10786
+ isTabStop,
10787
+ isDisabled
10788
+ ]);
10789
+ const onClick = React$5.useCallback(async (event) => {
10790
+ propsRef.current.onClick?.(event);
10791
+ if (event.defaultPrevented) return;
10792
+ if (!isDisabled && !context.nonInteractive) {
10793
+ const currentStepIndex = Array.from(steps.keys()).indexOf(value ?? "");
10794
+ const targetStepIndex = Array.from(steps.keys()).indexOf(itemValue);
10795
+ const direction = targetStepIndex > currentStepIndex ? "next" : "prev";
10796
+ await store.setStateWithValidation(itemValue, direction);
10797
+ }
10798
+ }, [
10799
+ isDisabled,
10800
+ context.nonInteractive,
10801
+ store,
10802
+ itemValue,
10803
+ value,
10804
+ steps,
10805
+ propsRef
10806
+ ]);
10807
+ const onFocus = React$5.useCallback(async (event) => {
10808
+ propsRef.current.onFocus?.(event);
10809
+ if (event.defaultPrevented) return;
10810
+ focusContext.onItemFocus(triggerId);
10811
+ const isKeyboardFocus = !isMouseClickRef.current;
10812
+ if (!isActive && !isDisabled && activationMode !== "manual" && !context.nonInteractive && isKeyboardFocus) {
10813
+ const currentStepIndex = Array.from(steps.keys()).indexOf(value || "");
10814
+ const targetStepIndex = Array.from(steps.keys()).indexOf(itemValue);
10815
+ const direction = targetStepIndex > currentStepIndex ? "next" : "prev";
10816
+ await store.setStateWithValidation(itemValue, direction);
10817
+ }
10818
+ isMouseClickRef.current = false;
10819
+ }, [
10820
+ focusContext,
10821
+ triggerId,
10822
+ activationMode,
10823
+ isActive,
10824
+ isDisabled,
10825
+ context.nonInteractive,
10826
+ store,
10827
+ itemValue,
10828
+ value,
10829
+ steps,
10830
+ propsRef
10831
+ ]);
10832
+ const onKeyDown = React$5.useCallback(async (event) => {
10833
+ propsRef.current.onKeyDown?.(event);
10834
+ if (event.defaultPrevented) return;
10835
+ if (event.key === "Enter" && context.nonInteractive) {
10836
+ event.preventDefault();
10837
+ return;
10838
+ }
10839
+ if ((event.key === "Enter" || event.key === " ") && activationMode === "manual" && !context.nonInteractive) {
10840
+ event.preventDefault();
10841
+ if (!isDisabled && triggerRef.current) triggerRef.current.click();
10842
+ return;
10843
+ }
10844
+ if (event.key === "Tab" && event.shiftKey) {
10845
+ focusContext.onItemShiftTab();
10846
+ return;
10847
+ }
10848
+ if (event.target !== event.currentTarget) return;
10849
+ const focusIntent = getFocusIntent(event, context.dir, orientation);
10850
+ if (focusIntent !== void 0) {
10851
+ if (event.metaKey || event.ctrlKey || event.altKey || event.shiftKey) return;
10852
+ event.preventDefault();
10853
+ const items = focusContext.getItems().filter((item) => !item.disabled);
10854
+ let candidateRefs = items.map((item) => item.ref);
10855
+ if (focusIntent === "last") candidateRefs.reverse();
10856
+ else if (focusIntent === "prev" || focusIntent === "next") {
10857
+ if (focusIntent === "prev") candidateRefs.reverse();
10858
+ const currentIndex = candidateRefs.findIndex((ref$1) => ref$1.current === event.currentTarget);
10859
+ candidateRefs = loop ? wrapArray(candidateRefs, currentIndex + 1) : candidateRefs.slice(currentIndex + 1);
10860
+ }
10861
+ if (store.hasValidation() && candidateRefs.length > 0) {
10862
+ const nextRef = candidateRefs[0];
10863
+ const nextElement = nextRef?.current;
10864
+ const nextItem = items.find((item) => item.ref.current === nextElement);
10865
+ if (nextItem && nextItem.value !== itemValue) {
10866
+ const currentStepIndex = Array.from(steps.keys()).indexOf(value || "");
10867
+ const targetStepIndex = Array.from(steps.keys()).indexOf(nextItem.value);
10868
+ const direction = targetStepIndex > currentStepIndex ? "next" : "prev";
10869
+ if (direction === "next") {
10870
+ const isValid = await store.setStateWithValidation(nextItem.value, direction);
10871
+ if (!isValid) return;
10872
+ } else store.setState("value", nextItem.value);
10873
+ queueMicrotask(() => nextElement?.focus());
10874
+ return;
10875
+ }
10876
+ }
10877
+ queueMicrotask(() => focusFirst(candidateRefs));
10878
+ }
10879
+ }, [
10880
+ focusContext,
10881
+ context.nonInteractive,
10882
+ context.dir,
10883
+ activationMode,
10884
+ orientation,
10885
+ loop,
10886
+ isDisabled,
10887
+ store,
10888
+ propsRef,
10889
+ itemValue,
10890
+ value,
10891
+ steps
10892
+ ]);
10893
+ const onMouseDown = React$5.useCallback((event) => {
10894
+ propsRef.current.onMouseDown?.(event);
10895
+ if (event.defaultPrevented) return;
10896
+ isMouseClickRef.current = true;
10897
+ if (isDisabled) event.preventDefault();
10898
+ else focusContext.onItemFocus(triggerId);
10899
+ }, [
10900
+ focusContext,
10901
+ triggerId,
10902
+ isDisabled,
10903
+ propsRef
10904
+ ]);
10905
+ const TriggerPrimitive = asChild ? Slot : "button";
10906
+ return /* @__PURE__ */ jsx(TriggerPrimitive, {
10907
+ id: triggerId,
10908
+ role: "tab",
10909
+ type: "button",
10910
+ "aria-controls": contentId,
10911
+ "aria-current": isActive ? "step" : void 0,
10912
+ "aria-describedby": `${titleId} ${descriptionId}`,
10913
+ "aria-posinset": stepPosition,
10914
+ "aria-selected": isActive,
10915
+ "aria-setsize": stepCount,
10916
+ "data-disabled": isDisabled ? "" : void 0,
10917
+ "data-state": dataState,
10918
+ "data-slot": "stepper-trigger",
10919
+ disabled: isDisabled,
10920
+ tabIndex: isTabStop ? 0 : -1,
10921
+ ...triggerProps,
10922
+ ref: composedRef,
10923
+ className: cn("inline-flex items-center justify-center gap-3 rounded-md text-left outline-none transition-all focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 disabled:pointer-events-none disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0", "not-has-data-[slot=description]:rounded-full not-has-data-[slot=title]:rounded-full", className),
10924
+ onClick,
10925
+ onFocus,
10926
+ onKeyDown,
10927
+ onMouseDown
10928
+ });
10929
+ }
10930
+ function StepperIndicator(props) {
10931
+ const { className, children, asChild, ref,...indicatorProps } = props;
10932
+ const context = useStepperContext(INDICATOR_NAME);
10933
+ const itemContext = useStepperItemContext(INDICATOR_NAME);
10934
+ const value = useStore((state) => state.value);
10935
+ const itemValue = itemContext.value;
10936
+ const stepState = useStore((state) => state.steps.get(itemValue));
10937
+ const steps = useStore((state) => state.steps);
10938
+ const stepPosition = Array.from(steps.keys()).indexOf(itemValue) + 1;
10939
+ const dataState = getDataState(value, itemValue, stepState, steps);
10940
+ const IndicatorPrimitive = asChild ? Slot : "div";
10941
+ return /* @__PURE__ */ jsx(IndicatorPrimitive, {
10942
+ "data-state": dataState,
10943
+ "data-slot": "stepper-indicator",
10944
+ dir: context.dir,
10945
+ ...indicatorProps,
10946
+ ref,
10947
+ className: cn("flex size-7 shrink-0 items-center justify-center rounded-full border-2 border-muted bg-background font-medium text-muted-foreground text-sm transition-colors data-[state=active]:border-primary data-[state=completed]:border-primary data-[state=active]:bg-primary data-[state=completed]:bg-primary data-[state=active]:text-primary-foreground data-[state=completed]:text-primary-foreground", className),
10948
+ children: typeof children === "function" ? children(dataState) : children ? children : dataState === "completed" ? /* @__PURE__ */ jsx(Check, { className: "size-4" }) : stepPosition
10949
+ });
10950
+ }
10951
+ function StepperSeparator(props) {
10952
+ const { className, asChild, forceMount = false, ref,...separatorProps } = props;
10953
+ const context = useStepperContext(SEPARATOR_NAME);
10954
+ const itemContext = useStepperItemContext(SEPARATOR_NAME);
10955
+ const value = useStore((state) => state.value);
10956
+ const steps = useStore((state) => state.steps);
10957
+ const orientation = context.orientation;
10958
+ const stepIndex = Array.from(steps.keys()).indexOf(itemContext.value);
10959
+ const isLastStep = stepIndex === steps.size - 1;
10960
+ if (isLastStep && !forceMount) return null;
10961
+ const dataState = getDataState(value, itemContext.value, itemContext.stepState, steps, "separator");
10962
+ const SeparatorPrimitive$1 = asChild ? Slot : "div";
10963
+ return /* @__PURE__ */ jsx(SeparatorPrimitive$1, {
10964
+ role: "separator",
10965
+ "aria-hidden": "true",
10966
+ "aria-orientation": orientation,
10967
+ "data-orientation": orientation,
10968
+ "data-state": dataState,
10969
+ "data-slot": "stepper-separator",
10970
+ dir: context.dir,
10971
+ ...separatorProps,
10972
+ ref,
10973
+ className: cn("bg-border transition-colors data-[state=active]:bg-primary data-[state=completed]:bg-primary", orientation === "horizontal" ? "h-px flex-1" : "h-10 w-px", className)
10974
+ });
10975
+ }
10976
+ function StepperTitle(props) {
10977
+ const { className, asChild, ref,...titleProps } = props;
10978
+ const context = useStepperContext(TITLE_NAME);
10979
+ const itemContext = useStepperItemContext(TITLE_NAME);
10980
+ const titleId = getId(context.rootId, "title", itemContext.value);
10981
+ const TitlePrimitive = asChild ? Slot : "span";
10982
+ return /* @__PURE__ */ jsx(TitlePrimitive, {
10983
+ id: titleId,
10984
+ "data-slot": "title",
10985
+ dir: context.dir,
10986
+ ...titleProps,
10987
+ ref,
10988
+ className: cn("font-medium text-sm", className)
10989
+ });
10990
+ }
10991
+ function StepperDescription(props) {
10992
+ const { className, asChild, ref,...descriptionProps } = props;
10993
+ const context = useStepperContext(DESCRIPTION_NAME);
10994
+ const itemContext = useStepperItemContext(DESCRIPTION_NAME);
10995
+ const descriptionId = getId(context.rootId, "description", itemContext.value);
10996
+ const DescriptionPrimitive = asChild ? Slot : "span";
10997
+ return /* @__PURE__ */ jsx(DescriptionPrimitive, {
10998
+ id: descriptionId,
10999
+ "data-slot": "description",
11000
+ dir: context.dir,
11001
+ ...descriptionProps,
11002
+ ref,
11003
+ className: cn("text-muted-foreground text-xs", className)
11004
+ });
11005
+ }
11006
+ function StepperContent(props) {
11007
+ const { value: valueProp, asChild, forceMount = false, ref, className,...contentProps } = props;
11008
+ const context = useStepperContext(CONTENT_NAME);
11009
+ const value = useStore((state) => state.value);
11010
+ const contentId = getId(context.rootId, "content", valueProp);
11011
+ const triggerId = getId(context.rootId, "trigger", valueProp);
11012
+ if (valueProp !== value && !forceMount) return null;
11013
+ const ContentPrimitive = asChild ? Slot : "div";
11014
+ return /* @__PURE__ */ jsx(ContentPrimitive, {
11015
+ id: contentId,
11016
+ role: "tabpanel",
11017
+ "aria-labelledby": triggerId,
11018
+ "data-slot": "stepper-content",
11019
+ dir: context.dir,
11020
+ ...contentProps,
11021
+ ref,
11022
+ className: cn("flex-1 outline-none", className)
11023
+ });
11024
+ }
11025
+ function StepperPrev(props) {
11026
+ const { asChild, onClick: onClickProp, disabled,...prevProps } = props;
11027
+ const store = useStoreContext(PREV_NAME);
11028
+ const value = useStore((state) => state.value);
11029
+ const steps = useStore((state) => state.steps);
11030
+ const propsRef = useAsRef({ onClick: onClickProp });
11031
+ const stepKeys = Array.from(steps.keys());
11032
+ const currentIndex = value ? stepKeys.indexOf(value) : -1;
11033
+ const isDisabled = disabled || currentIndex <= 0;
11034
+ const onClick = React$5.useCallback((event) => {
11035
+ propsRef.current.onClick?.(event);
11036
+ if (event.defaultPrevented || isDisabled) return;
11037
+ const prevIndex = Math.max(currentIndex - 1, 0);
11038
+ const prevStepValue = stepKeys[prevIndex];
11039
+ if (prevStepValue) store.setState("value", prevStepValue);
11040
+ }, [
11041
+ propsRef,
11042
+ isDisabled,
11043
+ currentIndex,
11044
+ stepKeys,
11045
+ store
11046
+ ]);
11047
+ const PrevPrimitive = asChild ? Slot : "button";
11048
+ return /* @__PURE__ */ jsx(PrevPrimitive, {
11049
+ type: "button",
11050
+ "data-slot": "stepper-prev",
11051
+ disabled: isDisabled,
11052
+ ...prevProps,
11053
+ onClick
11054
+ });
11055
+ }
11056
+ function StepperNext(props) {
11057
+ const { asChild, onClick: onClickProp, disabled,...nextProps } = props;
11058
+ const store = useStoreContext(NEXT_NAME);
11059
+ const value = useStore((state) => state.value);
11060
+ const steps = useStore((state) => state.steps);
11061
+ const propsRef = useAsRef({ onClick: onClickProp });
11062
+ const stepKeys = Array.from(steps.keys());
11063
+ const currentIndex = value ? stepKeys.indexOf(value) : -1;
11064
+ const isDisabled = disabled || currentIndex >= stepKeys.length - 1;
11065
+ const onClick = React$5.useCallback(async (event) => {
11066
+ propsRef.current.onClick?.(event);
11067
+ if (event.defaultPrevented || isDisabled) return;
11068
+ const nextIndex = Math.min(currentIndex + 1, stepKeys.length - 1);
11069
+ const nextStepValue = stepKeys[nextIndex];
11070
+ if (nextStepValue) await store.setStateWithValidation(nextStepValue, "next");
11071
+ }, [
11072
+ propsRef,
11073
+ isDisabled,
11074
+ currentIndex,
11075
+ stepKeys,
11076
+ store
11077
+ ]);
11078
+ const NextPrimitive = asChild ? Slot : "button";
11079
+ return /* @__PURE__ */ jsx(NextPrimitive, {
11080
+ type: "button",
11081
+ "data-slot": "stepper-next",
11082
+ disabled: isDisabled,
11083
+ ...nextProps,
11084
+ onClick
11085
+ });
11086
+ }
11087
+
9758
11088
  //#endregion
9759
11089
  //#region src/switch/switch.tsx
9760
11090
  const Switch = React$4.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SwitchPrimitives.Root, {
@@ -10039,5 +11369,5 @@ const TreeView = React$1.forwardRef(({ data, onNodeSelect, onGroupSelect, onTogg
10039
11369
  TreeView.displayName = "TreeView";
10040
11370
 
10041
11371
  //#endregion
10042
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, KanbanBoard as Board, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, CheckboxCell, Collapse, CollapseContent, CollapseTrigger, KanbanColumn as Column, KanbanColumnHandle as ColumnHandle, ComboboxDemo, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandPalette, CommandPaletteDialog, CommandPaletteEmpty, CommandPaletteGroup, CommandPaletteInput, CommandPaletteItem, CommandPaletteList, CommandPaletteSeparator, CommandPaletteShortcut, CommandSeparator, CommandShortcut, CommentCreate, CommentList, CommentThread, ContentFrame, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataGrid, DataGridCell, DataGridCellWrapper, DataGridColumnHeader, DataGridContextMenu, DataGridRow, DataGridSearch, DataGridViewMenu, DateCell, DatePickerDemo, DeferredInput, DeferredNumberInput, DeferredTextarea, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, GanttCell, GanttTimeline, GanttTimerangePicker, HeaderComponents, HierarchyCell, HierarchyItem, HoverCard, HoverCardContent, HoverCardTrigger, InfoCard, Input, KanbanItem as Item, KanbanItemHandle as ItemHandle, KanbanRoot as Kanban, KanbanBoard, KanbanColumn, KanbanColumnHandle, KanbanItem, KanbanItemHandle, KanbanOverlay, Label, Loader, LongTextCell, MarkValueRenderer, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Modal, MultiSelectCell, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NumberCell, NumberInput, KanbanOverlay as Overlay, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ReactNodeCell, ResizableHandle, ResizablePanel, ResizablePanelGroup, KanbanRoot as Root, ScrollArea, ScrollBar, Select, SelectCell, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, ShortTextCell, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slicer, SlicerHierarchyItem, Slider, Spinner, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TreeBranch, TreeView, badgeVariants, buildLabelMap, buttonVariants, checkboxVariants, cn, commandInputVariants, createSelectColumn, findOptionById, getAllDescendantIds, getAllDescendantValues, getAllIds, getAncestorIds, getCellKey, getCommonPinningStyles, getInitialExpandedIds, getLabelPath, getLineCount, getRowHeightValue, inputVariants, isoToLocalDate, knobVariants, matchesSearch, navigationMenuTriggerStyle, parseCellKey, sliderVariants, testId, toast, toggleVariants, useCallbackRef, useDataGrid, useDebouncedCallback, useIsMobile, useSidebar };
11372
+ export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, KanbanBoard as Board, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Calendar, CalendarDayButton, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, Checkbox, CheckboxCell, Collapse, CollapseContent, CollapseTrigger, KanbanColumn as Column, KanbanColumnHandle as ColumnHandle, ComboboxDemo, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandPalette, CommandPaletteDialog, CommandPaletteEmpty, CommandPaletteGroup, CommandPaletteInput, CommandPaletteItem, CommandPaletteList, CommandPaletteSeparator, CommandPaletteShortcut, CommandSeparator, CommandShortcut, CommentCreate, CommentList, CommentThread, ContentFrame, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, DataGrid, DataGridCell, DataGridCellWrapper, DataGridColumnHeader, DataGridContextMenu, DataGridRow, DataGridSearch, DataGridViewMenu, DateCell, DatePickerDemo, DeferredInput, DeferredNumberInput, DeferredTextarea, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, DynamicTabbedSidebar, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, GanttCell, GanttTimeline, GanttTimerangePicker, HeaderComponents, HierarchyCell, HierarchyItem, HoverCard, HoverCardContent, HoverCardTrigger, InfoCard, Input, KanbanItem as Item, KanbanItemHandle as ItemHandle, KanbanRoot as Kanban, KanbanBoard, KanbanColumn, KanbanColumnHandle, KanbanItem, KanbanItemHandle, KanbanOverlay, Label, Loader, LongTextCell, MarkValueRenderer, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, Modal, MultiSelectCell, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, NumberCell, NumberInput, KanbanOverlay as Overlay, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ReactNodeCell, ResizableHandle, ResizablePanel, ResizablePanelGroup, KanbanRoot as Root, SIDEBAR_KEYBOARD_SHORTCUT, SIDEBAR_KEYBOARD_SHORTCUT_RIGHT, SIDEBAR_MAX_WIDTH, SIDEBAR_MIN_WIDTH, SIDEBAR_WIDTH, SIDEBAR_WIDTH_ICON, SIDEBAR_WIDTH_MOBILE, ScrollArea, ScrollBar, Select, SelectCell, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetOverlay, SheetPortal, SheetTitle, SheetTrigger, ShortTextCell, Sidebar, SidebarContent, SidebarContext, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarIdContext, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTab, SidebarTabsContext, SidebarTabsProvider, SidebarTrigger, Skeleton, Slicer, SlicerHierarchyItem, Slider, Spinner, Stepper, StepperContent, StepperDescription, StepperIndicator, StepperItem, StepperList, StepperNext, StepperPrev, StepperSeparator, StepperTitle, StepperTrigger, Switch, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, TreeBranch, TreeView, badgeVariants, buildLabelMap, buttonVariants, checkboxVariants, cn, commandInputVariants, createSelectColumn, findOptionById, getAllDescendantIds, getAllDescendantValues, getAllIds, getAncestorIds, getCellKey, getCommonPinningStyles, getInitialExpandedIds, getLabelPath, getLineCount, getRowHeightValue, inputVariants, isoToLocalDate, knobVariants, matchesSearch, navigationMenuTriggerStyle, parseCellKey, sliderVariants, testId, toast, toggleVariants, useCallbackRef, useDataGrid, useDebouncedCallback, useIsMobile, useRegisteredSidebars, useSidebar, useSidebarTabs, useStore as useStepper };
10043
11373
  //# sourceMappingURL=index.js.map