@postxl/ui-components 1.3.11 → 1.4.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.
Files changed (4) hide show
  1. package/dist/index.d.ts +513 -396
  2. package/dist/index.js +1151 -430
  3. package/dist/index.js.map +1 -1
  4. package/package.json +4 -1
package/dist/index.js CHANGED
@@ -2,6 +2,8 @@ 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$52 from "react";
6
+ import * as React$51 from "react";
5
7
  import * as React$50 from "react";
6
8
  import * as React$49 from "react";
7
9
  import * as React$48 from "react";
@@ -78,6 +80,10 @@ import { useVirtualizer } from "@tanstack/react-virtual";
78
80
  import { format } from "date-fns";
79
81
  import { Drawer as Drawer$1 } from "vaul";
80
82
  import * as LabelPrimitive from "@radix-ui/react-label";
83
+ import { DndContext, DragOverlay, KeyboardCode, KeyboardSensor, MeasuringStrategy, MouseSensor, TouchSensor, closestCenter, closestCorners, defaultDropAnimationSideEffects, getFirstCollision, pointerWithin, rectIntersection, useSensor, useSensors } from "@dnd-kit/core";
84
+ import { SortableContext, arrayMove, defaultAnimateLayoutChanges, horizontalListSortingStrategy, useSortable, verticalListSortingStrategy } from "@dnd-kit/sortable";
85
+ import { CSS } from "@dnd-kit/utilities";
86
+ import * as ReactDOM from "react-dom";
81
87
  import * as MenubarPrimitive from "@radix-ui/react-menubar";
82
88
  import * as NavigationMenuPrimitive from "@radix-ui/react-navigation-menu";
83
89
  import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
@@ -112,13 +118,13 @@ function testId(baseId, suffix) {
112
118
  //#endregion
113
119
  //#region src/accordion/accordion.tsx
114
120
  const Accordion = AccordionPrimitive.Root;
115
- const AccordionItem = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Item, {
121
+ const AccordionItem = React$52.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Item, {
116
122
  ref,
117
123
  className: cn("border-b", className),
118
124
  ...props
119
125
  }));
120
126
  AccordionItem.displayName = "AccordionItem";
121
- const AccordionTrigger = React$50.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, {
127
+ const AccordionTrigger = React$52.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Header, {
122
128
  className: "flex",
123
129
  children: /* @__PURE__ */ jsxs(AccordionPrimitive.Trigger, {
124
130
  ref,
@@ -128,7 +134,7 @@ const AccordionTrigger = React$50.forwardRef(({ className, children,...props },
128
134
  })
129
135
  }));
130
136
  AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
131
- const AccordionContent = React$50.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Content, {
137
+ const AccordionContent = React$52.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx(AccordionPrimitive.Content, {
132
138
  ref,
133
139
  className: "overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",
134
140
  ...props,
@@ -148,21 +154,21 @@ const alertVariants = cva("relative w-full rounded-lg border px-4 py-3 text-sm [
148
154
  } },
149
155
  defaultVariants: { variant: "default" }
150
156
  });
151
- const Alert = React$49.forwardRef(({ className, variant,...props }, ref) => /* @__PURE__ */ jsx("div", {
157
+ const Alert = React$51.forwardRef(({ className, variant,...props }, ref) => /* @__PURE__ */ jsx("div", {
152
158
  ref,
153
159
  role: "alert",
154
160
  className: cn(alertVariants({ variant }), className),
155
161
  ...props
156
162
  }));
157
163
  Alert.displayName = "Alert";
158
- const AlertTitle = React$49.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h5", {
164
+ const AlertTitle = React$51.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h5", {
159
165
  ref,
160
166
  className: cn("mb-1 font-medium leading-none tracking-tight", className),
161
167
  ...props,
162
168
  children
163
169
  }));
164
170
  AlertTitle.displayName = "AlertTitle";
165
- const AlertDescription = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
171
+ const AlertDescription = React$51.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
166
172
  ref,
167
173
  className: cn("text-sm [&_p]:leading-relaxed", className),
168
174
  ...props
@@ -222,13 +228,13 @@ function Button({ className, variant, size, asChild = false, __e2e_test_id__,...
222
228
  const AlertDialog = AlertDialogPrimitive.Root;
223
229
  const AlertDialogTrigger = AlertDialogPrimitive.Trigger;
224
230
  const AlertDialogPortal = AlertDialogPrimitive.Portal;
225
- const AlertDialogOverlay = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Overlay, {
231
+ const AlertDialogOverlay = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Overlay, {
226
232
  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),
227
233
  ...props,
228
234
  ref
229
235
  }));
230
236
  AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
231
- const AlertDialogContent = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialogPrimitive.Content, {
237
+ const AlertDialogContent = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs(AlertDialogPortal, { children: [/* @__PURE__ */ jsx(AlertDialogOverlay, {}), /* @__PURE__ */ jsx(AlertDialogPrimitive.Content, {
232
238
  ref,
233
239
  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),
234
240
  ...props
@@ -244,25 +250,25 @@ const AlertDialogFooter = ({ className,...props }) => /* @__PURE__ */ jsx("div",
244
250
  ...props
245
251
  });
246
252
  AlertDialogFooter.displayName = "AlertDialogFooter";
247
- const AlertDialogTitle = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Title, {
253
+ const AlertDialogTitle = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Title, {
248
254
  ref,
249
255
  className: cn("text-lg font-semibold", className),
250
256
  ...props
251
257
  }));
252
258
  AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
253
- const AlertDialogDescription = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Description, {
259
+ const AlertDialogDescription = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Description, {
254
260
  ref,
255
261
  className: cn("text-sm text-muted-foreground", className),
256
262
  ...props
257
263
  }));
258
264
  AlertDialogDescription.displayName = AlertDialogPrimitive.Description.displayName;
259
- const AlertDialogAction = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Action, {
265
+ const AlertDialogAction = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Action, {
260
266
  ref,
261
267
  className: cn(buttonVariants(), className),
262
268
  ...props
263
269
  }));
264
270
  AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
265
- const AlertDialogCancel = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Cancel, {
271
+ const AlertDialogCancel = React$50.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AlertDialogPrimitive.Cancel, {
266
272
  ref,
267
273
  className: cn(buttonVariants({ variant: "outline" }), "mt-2 sm:mt-0", className),
268
274
  ...props
@@ -271,19 +277,19 @@ AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
271
277
 
272
278
  //#endregion
273
279
  //#region src/avatar/avatar.tsx
274
- const Avatar = React$47.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Root, {
280
+ const Avatar = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Root, {
275
281
  ref,
276
282
  className: cn("relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full", className),
277
283
  ...props
278
284
  }));
279
285
  Avatar.displayName = AvatarPrimitive.Root.displayName;
280
- const AvatarImage = React$47.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Image, {
286
+ const AvatarImage = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Image, {
281
287
  ref,
282
288
  className: cn("aspect-square h-full w-full", className),
283
289
  ...props
284
290
  }));
285
291
  AvatarImage.displayName = AvatarPrimitive.Image.displayName;
286
- const AvatarFallback = React$47.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Fallback, {
292
+ const AvatarFallback = React$49.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(AvatarPrimitive.Fallback, {
287
293
  ref,
288
294
  className: cn("flex h-full w-full items-center justify-center rounded-full bg-muted", className),
289
295
  ...props
@@ -329,25 +335,25 @@ function Badge({ className, variant, size, asChild = false,...props }) {
329
335
 
330
336
  //#endregion
331
337
  //#region src/breadcrumb/breadcrumb.tsx
332
- const Breadcrumb = React$46.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("nav", {
338
+ const Breadcrumb = React$48.forwardRef(({ ...props }, ref) => /* @__PURE__ */ jsx("nav", {
333
339
  ref,
334
340
  "aria-label": "breadcrumb",
335
341
  ...props
336
342
  }));
337
343
  Breadcrumb.displayName = "Breadcrumb";
338
- const BreadcrumbList = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ol", {
344
+ const BreadcrumbList = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ol", {
339
345
  ref,
340
346
  className: cn("flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5", className),
341
347
  ...props
342
348
  }));
343
349
  BreadcrumbList.displayName = "BreadcrumbList";
344
- const BreadcrumbItem = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
350
+ const BreadcrumbItem = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
345
351
  ref,
346
352
  className: cn("inline-flex items-center gap-1.5", className),
347
353
  ...props
348
354
  }));
349
355
  BreadcrumbItem.displayName = "BreadcrumbItem";
350
- const BreadcrumbLink = React$46.forwardRef(({ asChild, className,...props }, ref) => {
356
+ const BreadcrumbLink = React$48.forwardRef(({ asChild, className,...props }, ref) => {
351
357
  const Comp = asChild ? Slot : "a";
352
358
  return /* @__PURE__ */ jsx(Comp, {
353
359
  ref,
@@ -356,7 +362,7 @@ const BreadcrumbLink = React$46.forwardRef(({ asChild, className,...props }, ref
356
362
  });
357
363
  });
358
364
  BreadcrumbLink.displayName = "BreadcrumbLink";
359
- const BreadcrumbPage = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("span", {
365
+ const BreadcrumbPage = React$48.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("span", {
360
366
  ref,
361
367
  "aria-disabled": "true",
362
368
  "aria-current": "page",
@@ -386,8 +392,8 @@ BreadcrumbEllipsis.displayName = "BreadcrumbElipssis";
386
392
  //#region src/calendar/calendar.tsx
387
393
  function Calendar({ className, classNames, showOutsideDays = true, captionLayout = "label", buttonVariant = "ghost", showYearNavigation = false, formatters, components, __e2e_test_id__,...props }) {
388
394
  const defaultClassNames = getDefaultClassNames();
389
- const [rangeSelectionStep, setRangeSelectionStep] = React$45.useState("from");
390
- const handleDayClick = React$45.useCallback((day, modifiers, e) => {
395
+ const [rangeSelectionStep, setRangeSelectionStep] = React$47.useState("from");
396
+ const handleDayClick = React$47.useCallback((day, modifiers, e) => {
391
397
  if (props.mode === "range") {
392
398
  const range = props.selected;
393
399
  if (rangeSelectionStep === "from") {
@@ -417,8 +423,8 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
417
423
  fromMonth = props.startMonth ?? new Date(nowYear - 100, 0);
418
424
  toMonth = props.endMonth ?? new Date(nowYear + 100, 11);
419
425
  }
420
- const [currentMonth, setCurrentMonth] = React$45.useState(props.defaultMonth ?? props.month ?? new Date());
421
- React$45.useEffect(() => {
426
+ const [currentMonth, setCurrentMonth] = React$47.useState(props.defaultMonth ?? props.month ?? new Date());
427
+ React$47.useEffect(() => {
422
428
  if (props.month) setCurrentMonth(props.month);
423
429
  }, [props.month]);
424
430
  const addMonths = (date, months) => {
@@ -562,8 +568,8 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
562
568
  }
563
569
  function CalendarDayButton({ className, day, modifiers,...props }) {
564
570
  const defaultClassNames = getDefaultClassNames();
565
- const ref = React$45.useRef(null);
566
- React$45.useEffect(() => {
571
+ const ref = React$47.useRef(null);
572
+ React$47.useEffect(() => {
567
573
  if (modifiers.focused) ref.current?.focus();
568
574
  }, [modifiers.focused]);
569
575
  return /* @__PURE__ */ jsx(Button, {
@@ -582,38 +588,38 @@ function CalendarDayButton({ className, day, modifiers,...props }) {
582
588
 
583
589
  //#endregion
584
590
  //#region src/card/card.tsx
585
- const Card = React$44.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
591
+ const Card = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
586
592
  ref,
587
593
  className: cn("rounded-xl border bg-card text-card-foreground shadow", className),
588
594
  ...props
589
595
  }));
590
596
  Card.displayName = "Card";
591
- const CardHeader = React$44.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
597
+ const CardHeader = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
592
598
  ref,
593
599
  className: cn("flex flex-col space-y-1.5 p-6", className),
594
600
  ...props
595
601
  }));
596
602
  CardHeader.displayName = "CardHeader";
597
- const CardTitle = React$44.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h3", {
603
+ const CardTitle = React$46.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsx("h3", {
598
604
  ref,
599
605
  className: cn("font-semibold leading-none tracking-tight", className),
600
606
  ...props,
601
607
  children
602
608
  }));
603
609
  CardTitle.displayName = "CardTitle";
604
- const CardDescription = React$44.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("p", {
610
+ const CardDescription = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("p", {
605
611
  ref,
606
612
  className: cn("text-sm text-muted-foreground", className),
607
613
  ...props
608
614
  }));
609
615
  CardDescription.displayName = "CardDescription";
610
- const CardContent = React$44.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
616
+ const CardContent = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
611
617
  ref,
612
618
  className: cn("p-6 pt-0", className),
613
619
  ...props
614
620
  }));
615
621
  CardContent.displayName = "CardContent";
616
- const CardFooter = React$44.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
622
+ const CardFooter = React$46.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("div", {
617
623
  ref,
618
624
  className: cn("flex items-center p-6 pt-0", className),
619
625
  ...props
@@ -624,7 +630,7 @@ CardFooter.displayName = "CardFooter";
624
630
  //#region src/card-hover/card-hover.tsx
625
631
  const HoverCard = HoverCardPrimitive.Root;
626
632
  const HoverCardTrigger = HoverCardPrimitive.Trigger;
627
- const HoverCardContent = React$43.forwardRef(({ className, align = "center", sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(HoverCardPrimitive.Content, {
633
+ const HoverCardContent = React$45.forwardRef(({ className, align = "center", sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(HoverCardPrimitive.Content, {
628
634
  ref,
629
635
  align,
630
636
  sideOffset,
@@ -635,31 +641,31 @@ HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;
635
641
 
636
642
  //#endregion
637
643
  //#region src/carousel/carousel.tsx
638
- const CarouselContext = React$42.createContext(null);
644
+ const CarouselContext = React$44.createContext(null);
639
645
  function useCarousel() {
640
- const context = React$42.useContext(CarouselContext);
646
+ const context = React$44.useContext(CarouselContext);
641
647
  if (!context) throw new Error("useCarousel must be used within a <Carousel />");
642
648
  return context;
643
649
  }
644
- const Carousel = React$42.forwardRef(({ orientation = "horizontal", opts, setApi, plugins, className, children,...props }, ref) => {
650
+ const Carousel = React$44.forwardRef(({ orientation = "horizontal", opts, setApi, plugins, className, children,...props }, ref) => {
645
651
  const [carouselRef, api] = useEmblaCarousel({
646
652
  ...opts,
647
653
  axis: orientation === "horizontal" ? "x" : "y"
648
654
  }, plugins);
649
- const [canScrollPrev, setCanScrollPrev] = React$42.useState(false);
650
- const [canScrollNext, setCanScrollNext] = React$42.useState(false);
651
- const onSelect = React$42.useCallback(() => {
655
+ const [canScrollPrev, setCanScrollPrev] = React$44.useState(false);
656
+ const [canScrollNext, setCanScrollNext] = React$44.useState(false);
657
+ const onSelect = React$44.useCallback(() => {
652
658
  if (!api) return;
653
659
  setCanScrollPrev(api.canScrollPrev());
654
660
  setCanScrollNext(api.canScrollNext());
655
661
  }, [api]);
656
- const scrollPrev = React$42.useCallback(() => {
662
+ const scrollPrev = React$44.useCallback(() => {
657
663
  api?.scrollPrev();
658
664
  }, [api]);
659
- const scrollNext = React$42.useCallback(() => {
665
+ const scrollNext = React$44.useCallback(() => {
660
666
  api?.scrollNext();
661
667
  }, [api]);
662
- const handleKeyDown = React$42.useCallback((event) => {
668
+ const handleKeyDown = React$44.useCallback((event) => {
663
669
  if (event.key === "ArrowLeft") {
664
670
  event.preventDefault();
665
671
  scrollPrev();
@@ -668,11 +674,11 @@ const Carousel = React$42.forwardRef(({ orientation = "horizontal", opts, setApi
668
674
  scrollNext();
669
675
  }
670
676
  }, [scrollPrev, scrollNext]);
671
- React$42.useEffect(() => {
677
+ React$44.useEffect(() => {
672
678
  if (!api || !setApi) return;
673
679
  setApi(api);
674
680
  }, [api, setApi]);
675
- React$42.useEffect(() => {
681
+ React$44.useEffect(() => {
676
682
  if (!api) return;
677
683
  onSelect();
678
684
  api.on("reInit", onSelect);
@@ -713,7 +719,7 @@ const Carousel = React$42.forwardRef(({ orientation = "horizontal", opts, setApi
713
719
  });
714
720
  });
715
721
  Carousel.displayName = "Carousel";
716
- const CarouselContent = React$42.forwardRef(({ className,...props }, ref) => {
722
+ const CarouselContent = React$44.forwardRef(({ className,...props }, ref) => {
717
723
  const { carouselRef, orientation } = useCarousel();
718
724
  return /* @__PURE__ */ jsx("div", {
719
725
  ref: carouselRef,
@@ -726,7 +732,7 @@ const CarouselContent = React$42.forwardRef(({ className,...props }, ref) => {
726
732
  });
727
733
  });
728
734
  CarouselContent.displayName = "CarouselContent";
729
- const CarouselItem = React$42.forwardRef(({ className,...props }, ref) => {
735
+ const CarouselItem = React$44.forwardRef(({ className,...props }, ref) => {
730
736
  const { orientation } = useCarousel();
731
737
  return /* @__PURE__ */ jsx("div", {
732
738
  ref,
@@ -736,7 +742,7 @@ const CarouselItem = React$42.forwardRef(({ className,...props }, ref) => {
736
742
  });
737
743
  });
738
744
  CarouselItem.displayName = "CarouselItem";
739
- const CarouselPrevious = React$42.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
745
+ const CarouselPrevious = React$44.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
740
746
  const { orientation, scrollPrev, canScrollPrev } = useCarousel();
741
747
  return /* @__PURE__ */ jsxs(Button, {
742
748
  ref,
@@ -753,7 +759,7 @@ const CarouselPrevious = React$42.forwardRef(({ className, variant = "outline",
753
759
  });
754
760
  });
755
761
  CarouselPrevious.displayName = "CarouselPrevious";
756
- const CarouselNext = React$42.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
762
+ const CarouselNext = React$44.forwardRef(({ className, variant = "outline", size = "icon",...props }, ref) => {
757
763
  const { orientation, scrollNext, canScrollNext } = useCarousel();
758
764
  return /* @__PURE__ */ jsxs(Button, {
759
765
  ref,
@@ -1203,7 +1209,7 @@ function DialogDescription({ className,...props }) {
1203
1209
 
1204
1210
  //#endregion
1205
1211
  //#region src/command-palette/command-palette.tsx
1206
- const CommandPalette = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1, {
1212
+ const CommandPalette = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1, {
1207
1213
  ref,
1208
1214
  className: cn("flex h-full w-full flex-col overflow-hidden rounded-md bg-popover text-popover-foreground", className),
1209
1215
  ...props
@@ -1221,7 +1227,7 @@ const CommandPaletteDialog = ({ children,...props }) => {
1221
1227
  })
1222
1228
  });
1223
1229
  };
1224
- const CommandPaletteInput = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs("div", {
1230
+ const CommandPaletteInput = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsxs("div", {
1225
1231
  className: "flex items-center border-b px-3",
1226
1232
  "data-cmdk-input-wrapper": "",
1227
1233
  children: [/* @__PURE__ */ jsx(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }), /* @__PURE__ */ jsx(Command$1.Input, {
@@ -1231,31 +1237,31 @@ const CommandPaletteInput = React$41.forwardRef(({ className,...props }, ref) =>
1231
1237
  })]
1232
1238
  }));
1233
1239
  CommandPaletteInput.displayName = Command$1.Input.displayName;
1234
- const CommandPaletteList = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.List, {
1240
+ const CommandPaletteList = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.List, {
1235
1241
  ref,
1236
1242
  className: cn("max-h-[300px] overflow-y-auto overflow-x-hidden", className),
1237
1243
  ...props
1238
1244
  }));
1239
1245
  CommandPaletteList.displayName = Command$1.List.displayName;
1240
- const CommandPaletteEmpty = React$41.forwardRef((props, ref) => /* @__PURE__ */ jsx(Command$1.Empty, {
1246
+ const CommandPaletteEmpty = React$43.forwardRef((props, ref) => /* @__PURE__ */ jsx(Command$1.Empty, {
1241
1247
  ref,
1242
1248
  className: "py-6 text-center text-sm",
1243
1249
  ...props
1244
1250
  }));
1245
1251
  CommandPaletteEmpty.displayName = Command$1.Empty.displayName;
1246
- const CommandPaletteGroup = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Group, {
1252
+ const CommandPaletteGroup = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Group, {
1247
1253
  ref,
1248
1254
  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),
1249
1255
  ...props
1250
1256
  }));
1251
1257
  CommandPaletteGroup.displayName = Command$1.Group.displayName;
1252
- const CommandPaletteSeparator = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Separator, {
1258
+ const CommandPaletteSeparator = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Separator, {
1253
1259
  ref,
1254
1260
  className: cn("-mx-1 h-px bg-border", className),
1255
1261
  ...props
1256
1262
  }));
1257
1263
  CommandPaletteSeparator.displayName = Command$1.Separator.displayName;
1258
- const CommandPaletteItem = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Item, {
1264
+ const CommandPaletteItem = React$43.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Command$1.Item, {
1259
1265
  ref,
1260
1266
  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),
1261
1267
  ...props
@@ -1331,8 +1337,8 @@ const frameworks = [
1331
1337
  }
1332
1338
  ];
1333
1339
  function ComboboxDemo() {
1334
- const [open, setOpen] = React$40.useState(false);
1335
- const [value, setValue] = React$40.useState("");
1340
+ const [open, setOpen] = React$42.useState(false);
1341
+ const [value, setValue] = React$42.useState("");
1336
1342
  return /* @__PURE__ */ jsxs(Popover, {
1337
1343
  open,
1338
1344
  onOpenChange: setOpen,
@@ -1572,32 +1578,32 @@ const ContextMenuGroup = ContextMenuPrimitive.Group;
1572
1578
  const ContextMenuPortal = ContextMenuPrimitive.Portal;
1573
1579
  const ContextMenuSub = ContextMenuPrimitive.Sub;
1574
1580
  const ContextMenuRadioGroup = ContextMenuPrimitive.RadioGroup;
1575
- const ContextMenuSubTrigger = React$39.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.SubTrigger, {
1581
+ const ContextMenuSubTrigger = React$41.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.SubTrigger, {
1576
1582
  ref,
1577
1583
  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),
1578
1584
  ...props,
1579
1585
  children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto h-4 w-4" })]
1580
1586
  }));
1581
1587
  ContextMenuSubTrigger.displayName = ContextMenuPrimitive.SubTrigger.displayName;
1582
- const ContextMenuSubContent = React$39.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.SubContent, {
1588
+ const ContextMenuSubContent = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.SubContent, {
1583
1589
  ref,
1584
1590
  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),
1585
1591
  ...props
1586
1592
  }));
1587
1593
  ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
1588
- const ContextMenuContent = React$39.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Content, {
1594
+ const ContextMenuContent = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx(ContextMenuPrimitive.Content, {
1589
1595
  ref,
1590
1596
  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),
1591
1597
  ...props
1592
1598
  }) }));
1593
1599
  ContextMenuContent.displayName = ContextMenuPrimitive.Content.displayName;
1594
- const ContextMenuItem = React$39.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Item, {
1600
+ const ContextMenuItem = React$41.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Item, {
1595
1601
  ref,
1596
1602
  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),
1597
1603
  ...props
1598
1604
  }));
1599
1605
  ContextMenuItem.displayName = ContextMenuPrimitive.Item.displayName;
1600
- const ContextMenuCheckboxItem = React$39.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.CheckboxItem, {
1606
+ const ContextMenuCheckboxItem = React$41.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.CheckboxItem, {
1601
1607
  ref,
1602
1608
  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),
1603
1609
  checked,
@@ -1608,7 +1614,7 @@ const ContextMenuCheckboxItem = React$39.forwardRef(({ className, children, chec
1608
1614
  }), children]
1609
1615
  }));
1610
1616
  ContextMenuCheckboxItem.displayName = ContextMenuPrimitive.CheckboxItem.displayName;
1611
- const ContextMenuRadioItem = React$39.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.RadioItem, {
1617
+ const ContextMenuRadioItem = React$41.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ContextMenuPrimitive.RadioItem, {
1612
1618
  ref,
1613
1619
  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),
1614
1620
  ...props,
@@ -1618,13 +1624,13 @@ const ContextMenuRadioItem = React$39.forwardRef(({ className, children,...props
1618
1624
  }), children]
1619
1625
  }));
1620
1626
  ContextMenuRadioItem.displayName = ContextMenuPrimitive.RadioItem.displayName;
1621
- const ContextMenuLabel = React$39.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Label, {
1627
+ const ContextMenuLabel = React$41.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Label, {
1622
1628
  ref,
1623
1629
  className: cn("px-2 py-1.5 text-sm font-semibold text-foreground", inset && "pl-8", className),
1624
1630
  ...props
1625
1631
  }));
1626
1632
  ContextMenuLabel.displayName = ContextMenuPrimitive.Label.displayName;
1627
- const ContextMenuSeparator = React$39.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Separator, {
1633
+ const ContextMenuSeparator = React$41.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(ContextMenuPrimitive.Separator, {
1628
1634
  ref,
1629
1635
  className: cn("-mx-1 my-1 h-px bg-border", className),
1630
1636
  ...props
@@ -1769,7 +1775,7 @@ function DropdownMenuSubContent({ className,...props }) {
1769
1775
  const TooltipProvider = TooltipPrimitive.Provider;
1770
1776
  const Tooltip = TooltipPrimitive.Root;
1771
1777
  const TooltipTrigger = TooltipPrimitive.Trigger;
1772
- const TooltipContent = React$38.forwardRef(({ className, sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Content, {
1778
+ const TooltipContent = React$40.forwardRef(({ className, sideOffset = 4,...props }, ref) => /* @__PURE__ */ jsx(TooltipPrimitive.Portal, { children: /* @__PURE__ */ jsx(TooltipPrimitive.Content, {
1773
1779
  ref,
1774
1780
  sideOffset,
1775
1781
  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),
@@ -2254,7 +2260,7 @@ const inputVariants = cva("file:text-foreground placeholder:text-muted-foregroun
2254
2260
  } },
2255
2261
  defaultVariants: { variant: "default" }
2256
2262
  });
2257
- const Input = React$37.forwardRef(({ className, type, variant, __e2e_test_id__, onEnter, wrapperClassName,...props }, ref) => {
2263
+ const Input = React$39.forwardRef(({ className, type, variant, __e2e_test_id__, onEnter, wrapperClassName,...props }, ref) => {
2258
2264
  const input = /* @__PURE__ */ jsx("input", {
2259
2265
  type,
2260
2266
  "data-slot": "input",
@@ -2336,10 +2342,10 @@ const numberInputWrapperVariants = cva("border-input bg-background grid grid-col
2336
2342
  } },
2337
2343
  defaultVariants: { variant: "default" }
2338
2344
  });
2339
- const NumberInput = React$36.forwardRef(({ className, wrapperClassName, prefix, suffix, variant, showSpinButtons = false, __e2e_test_id__, onEnter, onChange, format: format$1, value: controlledValue,...props }, ref) => {
2340
- const [isFocused, setIsFocused] = React$36.useState(false);
2341
- const [inputString, setInputString] = React$36.useState("");
2342
- const intlFormatter = React$36.useMemo(() => {
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(() => {
2343
2349
  if (!format$1 || typeof format$1 === "function") return void 0;
2344
2350
  return new Intl.NumberFormat(format$1.locale, format$1.options);
2345
2351
  }, [format$1]);
@@ -2386,7 +2392,7 @@ const NumberInput = React$36.forwardRef(({ className, wrapperClassName, prefix,
2386
2392
  setInputString("");
2387
2393
  props.onBlur?.(e);
2388
2394
  };
2389
- const displayValue = React$36.useMemo(() => {
2395
+ const displayValue = React$38.useMemo(() => {
2390
2396
  if (isFocused && format$1) {
2391
2397
  if (inputString !== "") return inputString;
2392
2398
  if (controlledValue !== void 0) {
@@ -2463,20 +2469,20 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2463
2469
  const rowOriginal = cell?.row?.original ?? {};
2464
2470
  const colCellMeta = cell?.column?.columnDef?.meta;
2465
2471
  const align = colCellMeta?.align ?? "left";
2466
- const editableResolver = React$35.useMemo(() => {
2472
+ const editableResolver = React$37.useMemo(() => {
2467
2473
  const v = colCellMeta?.editable;
2468
2474
  if (v === void 0) return () => true;
2469
2475
  return typeof v === "function" ? v : () => Boolean(v);
2470
2476
  }, [colCellMeta?.editable]);
2471
2477
  const isEditable = editableResolver(rowOriginal);
2472
- const classNameResolver = React$35.useMemo(() => {
2478
+ const classNameResolver = React$37.useMemo(() => {
2473
2479
  const v = colCellMeta?.className;
2474
2480
  return typeof v === "function" ? v : () => v;
2475
2481
  }, [colCellMeta?.className]);
2476
2482
  const colCellClassName = classNameResolver(rowOriginal);
2477
2483
  const isSearchMatch = meta?.getIsSearchMatch?.(rowIndex, columnId) ?? false;
2478
2484
  const isActiveSearchMatch = meta?.getIsActiveSearchMatch?.(rowIndex, columnId) ?? false;
2479
- const onClick = React$35.useCallback((event) => {
2485
+ const onClick = React$37.useCallback((event) => {
2480
2486
  if (!isEditing) {
2481
2487
  event.preventDefault();
2482
2488
  onClickProp?.(event);
@@ -2489,7 +2495,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2489
2495
  isEditing,
2490
2496
  onClickProp
2491
2497
  ]);
2492
- const onContextMenu = React$35.useCallback((event) => {
2498
+ const onContextMenu = React$37.useCallback((event) => {
2493
2499
  if (!isEditing) meta?.onCellContextMenu?.(rowIndex, columnId, event);
2494
2500
  }, [
2495
2501
  meta,
@@ -2497,7 +2503,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2497
2503
  columnId,
2498
2504
  isEditing
2499
2505
  ]);
2500
- const onMouseDown = React$35.useCallback((event) => {
2506
+ const onMouseDown = React$37.useCallback((event) => {
2501
2507
  if (!isEditing) meta?.onCellMouseDown?.(rowIndex, columnId, event);
2502
2508
  }, [
2503
2509
  meta,
@@ -2505,7 +2511,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2505
2511
  columnId,
2506
2512
  isEditing
2507
2513
  ]);
2508
- const onMouseEnter = React$35.useCallback((event) => {
2514
+ const onMouseEnter = React$37.useCallback((event) => {
2509
2515
  if (!isEditing) meta?.onCellMouseEnter?.(rowIndex, columnId, event);
2510
2516
  }, [
2511
2517
  meta,
@@ -2513,10 +2519,10 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2513
2519
  columnId,
2514
2520
  isEditing
2515
2521
  ]);
2516
- const onMouseUp = React$35.useCallback(() => {
2522
+ const onMouseUp = React$37.useCallback(() => {
2517
2523
  if (!isEditing) meta?.onCellMouseUp?.();
2518
2524
  }, [meta, isEditing]);
2519
- const onDoubleClick = React$35.useCallback((event) => {
2525
+ const onDoubleClick = React$37.useCallback((event) => {
2520
2526
  if (!isEditing) {
2521
2527
  event.preventDefault();
2522
2528
  if (isEditable) meta?.onCellDoubleClick?.(rowIndex, columnId);
@@ -2528,7 +2534,7 @@ function DataGridCellWrapper({ cell, table, rowIndex, columnId, isEditing, isFoc
2528
2534
  isEditing,
2529
2535
  isEditable
2530
2536
  ]);
2531
- const onKeyDown = React$35.useCallback((event) => {
2537
+ const onKeyDown = React$37.useCallback((event) => {
2532
2538
  onKeyDownProp?.(event);
2533
2539
  if (event.defaultPrevented) return;
2534
2540
  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;
@@ -2742,22 +2748,22 @@ function HierarchyItem({ option, selectedValue, expandedIds, onToggleExpand, onS
2742
2748
  }
2743
2749
  function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
2744
2750
  const initialValue = cell.getValue();
2745
- const [value, setValue] = React$34.useState(initialValue);
2746
- const [open, setOpen] = React$34.useState(false);
2747
- const [searchValue, setSearchValue] = React$34.useState("");
2748
- const containerRef = React$34.useRef(null);
2749
- const inputRef = React$34.useRef(null);
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);
2750
2756
  const meta = table.options.meta;
2751
2757
  const cellOpts = cell.column.columnDef.meta?.cell;
2752
2758
  const sideOffset = -(containerRef.current?.clientHeight ?? 0);
2753
2759
  const options = cellOpts?.variant === "hierarchy" ? cellOpts.options : [];
2754
- const [expandedIds, setExpandedIds] = React$34.useState(() => getInitialExpandedIds(options, initialValue));
2755
- const labelMap = React$34.useMemo(() => buildLabelMap(options), [options]);
2756
- const displayLabel = React$34.useMemo(() => {
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(() => {
2757
2763
  if (!value) return "";
2758
2764
  return labelMap.get(value) ?? value;
2759
2765
  }, [value, labelMap]);
2760
- const toggleExpand = React$34.useCallback((id) => {
2766
+ const toggleExpand = React$36.useCallback((id) => {
2761
2767
  setExpandedIds((prev) => {
2762
2768
  const next = new Set(prev);
2763
2769
  if (next.has(id)) next.delete(id);
@@ -2765,7 +2771,7 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2765
2771
  return next;
2766
2772
  });
2767
2773
  }, []);
2768
- const onOptionSelect = React$34.useCallback((option) => {
2774
+ const onOptionSelect = React$36.useCallback((option) => {
2769
2775
  const newValue = option.id;
2770
2776
  setValue(newValue);
2771
2777
  meta?.onDataUpdate?.({
@@ -2780,18 +2786,18 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2780
2786
  rowIndex,
2781
2787
  columnId
2782
2788
  ]);
2783
- const onOpenChange = React$34.useCallback((isOpen) => {
2789
+ const onOpenChange = React$36.useCallback((isOpen) => {
2784
2790
  setOpen(isOpen);
2785
2791
  if (!isOpen) {
2786
2792
  setSearchValue("");
2787
2793
  meta?.onCellEditingStop?.();
2788
2794
  }
2789
2795
  }, [meta]);
2790
- const onOpenAutoFocus = React$34.useCallback((event) => {
2796
+ const onOpenAutoFocus = React$36.useCallback((event) => {
2791
2797
  event.preventDefault();
2792
2798
  inputRef.current?.focus();
2793
2799
  }, []);
2794
- const onWrapperKeyDown = React$34.useCallback((event) => {
2800
+ const onWrapperKeyDown = React$36.useCallback((event) => {
2795
2801
  if (isEditing) {
2796
2802
  if (event.key === "Escape") {
2797
2803
  event.preventDefault();
@@ -2811,10 +2817,10 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2811
2817
  initialValue,
2812
2818
  meta
2813
2819
  ]);
2814
- React$34.useEffect(() => {
2820
+ React$36.useEffect(() => {
2815
2821
  setValue(initialValue);
2816
2822
  }, [initialValue]);
2817
- React$34.useEffect(() => {
2823
+ React$36.useEffect(() => {
2818
2824
  if (value) {
2819
2825
  const ancestors = getAncestorIds(options, value);
2820
2826
  if (ancestors && ancestors.length > 0) setExpandedIds((prev) => {
@@ -2824,7 +2830,7 @@ function HierarchyCell({ cell, table, rowIndex, columnId, isFocused, isEditing,
2824
2830
  });
2825
2831
  }
2826
2832
  }, [value, options]);
2827
- React$34.useEffect(() => {
2833
+ React$36.useEffect(() => {
2828
2834
  if (isEditing && !open) setOpen(true);
2829
2835
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
2830
2836
  }, [
@@ -2922,9 +2928,9 @@ function EditorFooter({ count, onApply, onCancel }) {
2922
2928
  });
2923
2929
  }
2924
2930
  function BulkEditShortText({ columnId, selectedRowIndices, onApply, onCancel }) {
2925
- const [value, setValue] = React$33.useState("");
2926
- const inputRef = React$33.useRef(null);
2927
- const handleApply = React$33.useCallback(() => {
2931
+ const [value, setValue] = React$35.useState("");
2932
+ const inputRef = React$35.useRef(null);
2933
+ const handleApply = React$35.useCallback(() => {
2928
2934
  onApply(selectedRowIndices.map((rowIndex) => ({
2929
2935
  rowIndex,
2930
2936
  columnId,
@@ -2936,14 +2942,14 @@ function BulkEditShortText({ columnId, selectedRowIndices, onApply, onCancel })
2936
2942
  value,
2937
2943
  onApply
2938
2944
  ]);
2939
- const onKeyDown = React$33.useCallback((e) => {
2945
+ const onKeyDown = React$35.useCallback((e) => {
2940
2946
  stopGridKeys(e);
2941
2947
  if (e.key === "Enter") {
2942
2948
  e.preventDefault();
2943
2949
  handleApply();
2944
2950
  }
2945
2951
  }, [handleApply]);
2946
- React$33.useEffect(() => {
2952
+ React$35.useEffect(() => {
2947
2953
  inputRef.current?.focus();
2948
2954
  }, []);
2949
2955
  return /* @__PURE__ */ jsxs("div", {
@@ -2965,9 +2971,9 @@ function BulkEditShortText({ columnId, selectedRowIndices, onApply, onCancel })
2965
2971
  });
2966
2972
  }
2967
2973
  function BulkEditLongText({ columnId, selectedRowIndices, onApply, onCancel }) {
2968
- const [value, setValue] = React$33.useState("");
2969
- const textareaRef = React$33.useRef(null);
2970
- const handleApply = React$33.useCallback(() => {
2974
+ const [value, setValue] = React$35.useState("");
2975
+ const textareaRef = React$35.useRef(null);
2976
+ const handleApply = React$35.useCallback(() => {
2971
2977
  onApply(selectedRowIndices.map((rowIndex) => ({
2972
2978
  rowIndex,
2973
2979
  columnId,
@@ -2979,14 +2985,14 @@ function BulkEditLongText({ columnId, selectedRowIndices, onApply, onCancel }) {
2979
2985
  value,
2980
2986
  onApply
2981
2987
  ]);
2982
- const onKeyDown = React$33.useCallback((e) => {
2988
+ const onKeyDown = React$35.useCallback((e) => {
2983
2989
  stopGridKeys(e);
2984
2990
  if ((e.ctrlKey || e.metaKey) && e.key === "Enter") {
2985
2991
  e.preventDefault();
2986
2992
  handleApply();
2987
2993
  }
2988
2994
  }, [handleApply]);
2989
- React$33.useEffect(() => {
2995
+ React$35.useEffect(() => {
2990
2996
  textareaRef.current?.focus();
2991
2997
  }, []);
2992
2998
  return /* @__PURE__ */ jsxs("div", {
@@ -3009,12 +3015,12 @@ function BulkEditLongText({ columnId, selectedRowIndices, onApply, onCancel }) {
3009
3015
  });
3010
3016
  }
3011
3017
  function BulkEditNumber({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3012
- const [value, setValue] = React$33.useState(void 0);
3013
- const inputRef = React$33.useRef(null);
3018
+ const [value, setValue] = React$35.useState(void 0);
3019
+ const inputRef = React$35.useRef(null);
3014
3020
  const { min, max, step, prefix, suffix } = cell.variant === "number" ? cell : {};
3015
3021
  const stringPrefix = typeof prefix === "string" ? prefix : void 0;
3016
3022
  const stringSuffix = typeof suffix === "string" ? suffix : void 0;
3017
- const handleApply = React$33.useCallback(() => {
3023
+ const handleApply = React$35.useCallback(() => {
3018
3024
  const numValue = value ?? null;
3019
3025
  onApply(selectedRowIndices.map((rowIndex) => ({
3020
3026
  rowIndex,
@@ -3027,14 +3033,14 @@ function BulkEditNumber({ cell, columnId, selectedRowIndices, onApply, onCancel
3027
3033
  value,
3028
3034
  onApply
3029
3035
  ]);
3030
- const onKeyDown = React$33.useCallback((e) => {
3036
+ const onKeyDown = React$35.useCallback((e) => {
3031
3037
  stopGridKeys(e);
3032
3038
  if (e.key === "Enter") {
3033
3039
  e.preventDefault();
3034
3040
  handleApply();
3035
3041
  }
3036
3042
  }, [handleApply]);
3037
- React$33.useEffect(() => {
3043
+ React$35.useEffect(() => {
3038
3044
  inputRef.current?.focus();
3039
3045
  }, []);
3040
3046
  return /* @__PURE__ */ jsxs("div", {
@@ -3063,8 +3069,8 @@ function BulkEditNumber({ cell, columnId, selectedRowIndices, onApply, onCancel
3063
3069
  }
3064
3070
  function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3065
3071
  const { options: arrayOptions, optionsMap, optionsRenderer } = cell.variant === "select" ? cell : {};
3066
- const inputRef = React$33.useRef(null);
3067
- const options = React$33.useMemo(() => {
3072
+ const inputRef = React$35.useRef(null);
3073
+ const options = React$35.useMemo(() => {
3068
3074
  if (arrayOptions) return arrayOptions.map((opt) => ({
3069
3075
  value: opt.value,
3070
3076
  data: opt.label
@@ -3075,7 +3081,7 @@ function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel
3075
3081
  }));
3076
3082
  return [];
3077
3083
  }, [arrayOptions, optionsMap]);
3078
- const handleSelect = React$33.useCallback((newValue) => {
3084
+ const handleSelect = React$35.useCallback((newValue) => {
3079
3085
  onApply(selectedRowIndices.map((rowIndex) => ({
3080
3086
  rowIndex,
3081
3087
  columnId,
@@ -3086,7 +3092,7 @@ function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel
3086
3092
  columnId,
3087
3093
  onApply
3088
3094
  ]);
3089
- React$33.useEffect(() => {
3095
+ React$35.useEffect(() => {
3090
3096
  inputRef.current?.focus();
3091
3097
  }, []);
3092
3098
  return /* @__PURE__ */ jsxs("div", {
@@ -3110,10 +3116,10 @@ function BulkEditSelect({ cell, columnId, selectedRowIndices, onApply, onCancel
3110
3116
  }
3111
3117
  function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3112
3118
  const { options: arrayOptions, optionsMap } = cell.variant === "multi-select" ? cell : {};
3113
- const [selectedValues, setSelectedValues] = React$33.useState([]);
3114
- const [searchValue, setSearchValue] = React$33.useState("");
3115
- const inputRef = React$33.useRef(null);
3116
- const options = React$33.useMemo(() => {
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(() => {
3117
3123
  if (arrayOptions) return arrayOptions;
3118
3124
  if (optionsMap) return Array.from(optionsMap.entries()).map(([id, label]) => ({
3119
3125
  value: id,
@@ -3121,12 +3127,12 @@ function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCa
3121
3127
  }));
3122
3128
  return [];
3123
3129
  }, [arrayOptions, optionsMap]);
3124
- const toggleValue = React$33.useCallback((value) => {
3130
+ const toggleValue = React$35.useCallback((value) => {
3125
3131
  setSelectedValues((prev) => prev.includes(value) ? prev.filter((v) => v !== value) : [...prev, value]);
3126
3132
  setSearchValue("");
3127
3133
  queueMicrotask(() => inputRef.current?.focus());
3128
3134
  }, []);
3129
- const handleApply = React$33.useCallback(() => {
3135
+ const handleApply = React$35.useCallback(() => {
3130
3136
  onApply(selectedRowIndices.map((rowIndex) => ({
3131
3137
  rowIndex,
3132
3138
  columnId,
@@ -3138,7 +3144,7 @@ function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCa
3138
3144
  selectedValues,
3139
3145
  onApply
3140
3146
  ]);
3141
- React$33.useEffect(() => {
3147
+ React$35.useEffect(() => {
3142
3148
  inputRef.current?.focus();
3143
3149
  }, []);
3144
3150
  return /* @__PURE__ */ jsxs("div", {
@@ -3204,7 +3210,7 @@ function BulkEditMultiSelect({ cell, columnId, selectedRowIndices, onApply, onCa
3204
3210
  });
3205
3211
  }
3206
3212
  function BulkEditCheckbox({ columnId, selectedRowIndices, onApply, onCancel }) {
3207
- const setAll = React$33.useCallback((val) => {
3213
+ const setAll = React$35.useCallback((val) => {
3208
3214
  onApply(selectedRowIndices.map((rowIndex) => ({
3209
3215
  rowIndex,
3210
3216
  columnId,
@@ -3241,10 +3247,10 @@ function BulkEditCheckbox({ columnId, selectedRowIndices, onApply, onCancel }) {
3241
3247
  }
3242
3248
  function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCancel }) {
3243
3249
  const options = cell.variant === "hierarchy" ? cell.options : [];
3244
- const inputRef = React$33.useRef(null);
3245
- const [searchValue, setSearchValue] = React$33.useState("");
3246
- const [expandedIds, setExpandedIds] = React$33.useState(() => getInitialExpandedIds(options, null));
3247
- const toggleExpand = React$33.useCallback((id) => {
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) => {
3248
3254
  setExpandedIds((prev) => {
3249
3255
  const next = new Set(prev);
3250
3256
  if (next.has(id)) next.delete(id);
@@ -3252,7 +3258,7 @@ function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCanc
3252
3258
  return next;
3253
3259
  });
3254
3260
  }, []);
3255
- const handleSelect = React$33.useCallback((option) => {
3261
+ const handleSelect = React$35.useCallback((option) => {
3256
3262
  onApply(selectedRowIndices.map((rowIndex) => ({
3257
3263
  rowIndex,
3258
3264
  columnId,
@@ -3263,7 +3269,7 @@ function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCanc
3263
3269
  columnId,
3264
3270
  onApply
3265
3271
  ]);
3266
- React$33.useEffect(() => {
3272
+ React$35.useEffect(() => {
3267
3273
  inputRef.current?.focus();
3268
3274
  }, []);
3269
3275
  return /* @__PURE__ */ jsxs("div", {
@@ -3294,7 +3300,7 @@ function BulkEditHierarchy({ cell, columnId, selectedRowIndices, onApply, onCanc
3294
3300
  });
3295
3301
  }
3296
3302
  function BulkEditDate({ columnId, selectedRowIndices, onApply, onCancel }) {
3297
- const onDateSelect = React$33.useCallback((date) => {
3303
+ const onDateSelect = React$35.useCallback((date) => {
3298
3304
  if (!date) return;
3299
3305
  const year = date.getFullYear();
3300
3306
  const month = String(date.getMonth() + 1).padStart(2, "0");
@@ -3326,28 +3332,28 @@ function BulkEditDate({ columnId, selectedRowIndices, onApply, onCancel }) {
3326
3332
  });
3327
3333
  }
3328
3334
  function BulkEditPopover({ table, cell, columnId, open, onOpenChange, children }) {
3329
- const selectedRowIndices = React$33.useMemo(() => {
3335
+ const selectedRowIndices = React$35.useMemo(() => {
3330
3336
  if (!open) return [];
3331
3337
  const allRows = table.getRowModel().rows;
3332
3338
  const indices = [];
3333
3339
  for (let i = 0; i < allRows.length; i++) if (allRows[i].getIsSelected()) indices.push(i);
3334
3340
  return indices;
3335
3341
  }, [open, table]);
3336
- React$33.useEffect(() => {
3342
+ React$35.useEffect(() => {
3337
3343
  if (open && selectedRowIndices.length === 0) onOpenChange(false);
3338
3344
  }, [
3339
3345
  open,
3340
3346
  selectedRowIndices.length,
3341
3347
  onOpenChange
3342
3348
  ]);
3343
- const onApply = React$33.useCallback((updates) => {
3349
+ const onApply = React$35.useCallback((updates) => {
3344
3350
  table.options.meta?.onDataUpdate?.(updates);
3345
3351
  onOpenChange(false);
3346
3352
  }, [table, onOpenChange]);
3347
- const onCancel = React$33.useCallback(() => {
3353
+ const onCancel = React$35.useCallback(() => {
3348
3354
  onOpenChange(false);
3349
3355
  }, [onOpenChange]);
3350
- const onOpenAutoFocus = React$33.useCallback((e) => {
3356
+ const onOpenAutoFocus = React$35.useCallback((e) => {
3351
3357
  e.preventDefault();
3352
3358
  }, []);
3353
3359
  const editorProps = {
@@ -3357,7 +3363,7 @@ function BulkEditPopover({ table, cell, columnId, open, onOpenChange, children }
3357
3363
  onApply,
3358
3364
  onCancel
3359
3365
  };
3360
- const editor = React$33.useMemo(() => {
3366
+ const editor = React$35.useMemo(() => {
3361
3367
  switch (cell.variant) {
3362
3368
  case "short-text": return /* @__PURE__ */ jsx(BulkEditShortText, { ...editorProps });
3363
3369
  case "long-text": return /* @__PURE__ */ jsx(BulkEditLongText, { ...editorProps });
@@ -3435,8 +3441,8 @@ function getColumnVariant(variant) {
3435
3441
  }
3436
3442
  }
3437
3443
  function DataGridColumnHeader({ header, table, className, onPointerDown,...props }) {
3438
- const [open, setOpen] = React$32.useState(false);
3439
- const [bulkEditOpen, setBulkEditOpen] = React$32.useState(false);
3444
+ const [open, setOpen] = React$34.useState(false);
3445
+ const [bulkEditOpen, setBulkEditOpen] = React$34.useState(false);
3440
3446
  const column = header.column;
3441
3447
  const label = column.columnDef.meta?.label ? column.columnDef.meta.label : typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
3442
3448
  const isAnyColumnResizing = table.getState().columnSizingInfo.isResizingColumn;
@@ -3445,13 +3451,13 @@ function DataGridColumnHeader({ header, table, className, onPointerDown,...props
3445
3451
  const enableBulkEdit = column.columnDef.meta?.enableBulkEdit ?? false;
3446
3452
  const selectedRowCount = Object.keys(table.getState().rowSelection).length;
3447
3453
  const showBulkEdit = enableBulkEdit && selectedRowCount > 1 && cellVariant != null && EditableCellVariantsSet.has(cellVariant?.variant);
3448
- React$32.useEffect(() => {
3454
+ React$34.useEffect(() => {
3449
3455
  if (!showBulkEdit) setBulkEditOpen(false);
3450
3456
  }, [showBulkEdit]);
3451
3457
  const pinnedPosition = column.getIsPinned();
3452
3458
  const isPinnedLeft = pinnedPosition === "left";
3453
3459
  const isPinnedRight = pinnedPosition === "right";
3454
- const onSortingChange = React$32.useCallback((direction) => {
3460
+ const onSortingChange = React$34.useCallback((direction) => {
3455
3461
  table.setSorting((prev) => {
3456
3462
  const existingSortIndex = prev.findIndex((sort) => sort.id === column.id);
3457
3463
  const newSort = {
@@ -3465,19 +3471,19 @@ function DataGridColumnHeader({ header, table, className, onPointerDown,...props
3465
3471
  } else return [...prev, newSort];
3466
3472
  });
3467
3473
  }, [column.id, table]);
3468
- const onSortRemove = React$32.useCallback(() => {
3474
+ const onSortRemove = React$34.useCallback(() => {
3469
3475
  table.setSorting((prev) => prev.filter((sort) => sort.id !== column.id));
3470
3476
  }, [column.id, table]);
3471
- const onLeftPin = React$32.useCallback(() => {
3477
+ const onLeftPin = React$34.useCallback(() => {
3472
3478
  column.pin("left");
3473
3479
  }, [column]);
3474
- const onRightPin = React$32.useCallback(() => {
3480
+ const onRightPin = React$34.useCallback(() => {
3475
3481
  column.pin("right");
3476
3482
  }, [column]);
3477
- const onUnpin = React$32.useCallback(() => {
3483
+ const onUnpin = React$34.useCallback(() => {
3478
3484
  column.pin(false);
3479
3485
  }, [column]);
3480
- const onTriggerPointerDown = React$32.useCallback((event) => {
3486
+ const onTriggerPointerDown = React$34.useCallback((event) => {
3481
3487
  onPointerDown?.(event);
3482
3488
  if (event.defaultPrevented) return;
3483
3489
  if (event.button !== 0) return;
@@ -3604,7 +3610,7 @@ function DataGridColumnHeader({ header, table, className, onPointerDown,...props
3604
3610
  })
3605
3611
  ] });
3606
3612
  }
3607
- const DataGridColumnResizer = React$32.memo(DataGridColumnResizerImpl, (prev, next) => {
3613
+ const DataGridColumnResizer = React$34.memo(DataGridColumnResizerImpl, (prev, next) => {
3608
3614
  const prevColumn = prev.header.column;
3609
3615
  const nextColumn = next.header.column;
3610
3616
  if (prevColumn.getIsResizing() !== nextColumn.getIsResizing() || prevColumn.getSize() !== nextColumn.getSize()) return false;
@@ -3613,7 +3619,7 @@ const DataGridColumnResizer = React$32.memo(DataGridColumnResizerImpl, (prev, ne
3613
3619
  });
3614
3620
  function DataGridColumnResizerImpl({ header, table, label }) {
3615
3621
  const defaultColumnDef = table._getDefaultColumnDef();
3616
- const onDoubleClick = React$32.useCallback(() => {
3622
+ const onDoubleClick = React$34.useCallback(() => {
3617
3623
  header.column.resetSize();
3618
3624
  }, [header.column]);
3619
3625
  return /* @__PURE__ */ jsx("div", {
@@ -3722,7 +3728,7 @@ function DataGridContextMenu({ table }) {
3722
3728
  onRowsDelete
3723
3729
  });
3724
3730
  }
3725
- const ContextMenu$1 = React$31.memo(ContextMenuImpl, (prev, next) => {
3731
+ const ContextMenu$1 = React$33.memo(ContextMenuImpl, (prev, next) => {
3726
3732
  if (prev.contextMenu.open !== next.contextMenu.open) return false;
3727
3733
  if (!next.contextMenu.open) return true;
3728
3734
  if (prev.contextMenu.x !== next.contextMenu.x) return false;
@@ -3733,7 +3739,7 @@ const ContextMenu$1 = React$31.memo(ContextMenuImpl, (prev, next) => {
3733
3739
  return true;
3734
3740
  });
3735
3741
  function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenChange, selectionState, onDataUpdate, onRowsDelete }) {
3736
- const triggerStyle = React$31.useMemo(() => ({
3742
+ const triggerStyle = React$33.useMemo(() => ({
3737
3743
  position: "fixed",
3738
3744
  left: `${contextMenu.x}px`,
3739
3745
  top: `${contextMenu.y}px`,
@@ -3746,11 +3752,11 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3746
3752
  pointerEvents: "none",
3747
3753
  opacity: 0
3748
3754
  }), [contextMenu.x, contextMenu.y]);
3749
- const onCloseAutoFocus = React$31.useCallback((event) => {
3755
+ const onCloseAutoFocus = React$33.useCallback((event) => {
3750
3756
  event.preventDefault();
3751
3757
  dataGridRef?.current?.focus();
3752
3758
  }, [dataGridRef]);
3753
- const onCopy = React$31.useCallback(async () => {
3759
+ const onCopy = React$33.useCallback(async () => {
3754
3760
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return;
3755
3761
  const rows = table.getRowModel().rows;
3756
3762
  const columnIds = [];
@@ -3789,7 +3795,7 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3789
3795
  await navigator.clipboard.writeText(tsvData);
3790
3796
  toast$1.success(`${selectionState.selectedCells.size} cell${selectionState.selectedCells.size !== 1 ? "s" : ""} copied`);
3791
3797
  }, [table, selectionState]);
3792
- const canClear = React$31.useMemo(() => {
3798
+ const canClear = React$33.useMemo(() => {
3793
3799
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return false;
3794
3800
  const visibleCols = table.getVisibleLeafColumns();
3795
3801
  const rows = table.getRowModel().rows;
@@ -3806,7 +3812,7 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3806
3812
  }
3807
3813
  return true;
3808
3814
  }, [selectionState, table]);
3809
- const onClear = React$31.useCallback(() => {
3815
+ const onClear = React$33.useCallback(() => {
3810
3816
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return;
3811
3817
  if (!canClear) return;
3812
3818
  const updates = [];
@@ -3825,7 +3831,7 @@ function ContextMenuImpl({ table, dataGridRef, contextMenu, onContextMenuOpenCha
3825
3831
  selectionState,
3826
3832
  canClear
3827
3833
  ]);
3828
- const onDelete = React$31.useCallback(async () => {
3834
+ const onDelete = React$33.useCallback(async () => {
3829
3835
  if (!selectionState?.selectedCells || selectionState.selectedCells.size === 0) return;
3830
3836
  const rowIndices = new Set();
3831
3837
  for (const cellKey of selectionState.selectedCells) {
@@ -3902,12 +3908,12 @@ function composeRefs(...refs) {
3902
3908
  * Accepts callback refs and RefObject(s)
3903
3909
  */
3904
3910
  function useComposedRefs(...refs) {
3905
- return React$30.useCallback(composeRefs(...refs), refs);
3911
+ return React$32.useCallback(composeRefs(...refs), refs);
3906
3912
  }
3907
3913
 
3908
3914
  //#endregion
3909
3915
  //#region src/data-grid/data-grid-row.tsx
3910
- const DataGridRow = React$29.memo(DataGridRowImpl, (prev, next) => {
3916
+ const DataGridRow = React$31.memo(DataGridRowImpl, (prev, next) => {
3911
3917
  if (prev.row.id !== next.row.id) return false;
3912
3918
  if (prev.row.original !== next.row.original) return false;
3913
3919
  const prevRowIndex = prev.virtualRowIndex;
@@ -3939,7 +3945,7 @@ function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, r
3939
3945
  }
3940
3946
  });
3941
3947
  const isRowSelected = row.getIsSelected();
3942
- const handleRowClick = React$29.useCallback((event) => {
3948
+ const handleRowClick = React$31.useCallback((event) => {
3943
3949
  const target = event.target;
3944
3950
  if (target.closest("input, button, [role=\"checkbox\"]")) return;
3945
3951
  if (event.detail === 1) onRowClick?.(virtualRowIndex);
@@ -3989,20 +3995,20 @@ function DataGridRowImpl({ row, virtualRowIndex, virtualStart, rowVirtualizer, r
3989
3995
  * prop or avoid re-executing effects when passed as a dependency
3990
3996
  */
3991
3997
  function useCallbackRef(callback) {
3992
- const callbackRef = React$28.useRef(callback);
3993
- React$28.useEffect(() => {
3998
+ const callbackRef = React$30.useRef(callback);
3999
+ React$30.useEffect(() => {
3994
4000
  callbackRef.current = callback;
3995
4001
  });
3996
- return React$28.useMemo(() => (...args) => callbackRef.current?.(...args), []);
4002
+ return React$30.useMemo(() => (...args) => callbackRef.current?.(...args), []);
3997
4003
  }
3998
4004
 
3999
4005
  //#endregion
4000
4006
  //#region src/hooks/use-debounced-callback.ts
4001
4007
  function useDebouncedCallback(callback, delay) {
4002
4008
  const handleCallback = useCallbackRef(callback);
4003
- const debounceTimerRef = React$27.useRef(0);
4004
- React$27.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
4005
- const setValue = React$27.useCallback((...args) => {
4009
+ const debounceTimerRef = React$29.useRef(0);
4010
+ React$29.useEffect(() => () => window.clearTimeout(debounceTimerRef.current), []);
4011
+ const setValue = React$29.useCallback((...args) => {
4006
4012
  window.clearTimeout(debounceTimerRef.current);
4007
4013
  debounceTimerRef.current = window.setTimeout(() => handleCallback(...args), delay);
4008
4014
  }, [handleCallback, delay]);
@@ -4011,7 +4017,7 @@ function useDebouncedCallback(callback, delay) {
4011
4017
 
4012
4018
  //#endregion
4013
4019
  //#region src/data-grid/data-grid-search.tsx
4014
- const DataGridSearch = React$26.memo(DataGridSearchImpl, (prev, next) => {
4020
+ const DataGridSearch = React$28.memo(DataGridSearchImpl, (prev, next) => {
4015
4021
  if (prev.searchOpen !== next.searchOpen) return false;
4016
4022
  if (!next.searchOpen) return true;
4017
4023
  if (prev.searchQuery !== next.searchQuery || prev.matchIndex !== next.matchIndex) return false;
@@ -4025,13 +4031,13 @@ const DataGridSearch = React$26.memo(DataGridSearchImpl, (prev, next) => {
4025
4031
  return true;
4026
4032
  });
4027
4033
  function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpenChange, searchQuery, onSearchQueryChange, onSearch, onNavigateToNextMatch, onNavigateToPrevMatch }) {
4028
- const inputRef = React$26.useRef(null);
4029
- React$26.useEffect(() => {
4034
+ const inputRef = React$28.useRef(null);
4035
+ React$28.useEffect(() => {
4030
4036
  if (searchOpen) requestAnimationFrame(() => {
4031
4037
  inputRef.current?.focus();
4032
4038
  });
4033
4039
  }, [searchOpen]);
4034
- React$26.useEffect(() => {
4040
+ React$28.useEffect(() => {
4035
4041
  if (!searchOpen) return;
4036
4042
  function onEscape(event) {
4037
4043
  if (event.key === "Escape") {
@@ -4042,7 +4048,7 @@ function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpe
4042
4048
  document.addEventListener("keydown", onEscape);
4043
4049
  return () => document.removeEventListener("keydown", onEscape);
4044
4050
  }, [searchOpen, onSearchOpenChange]);
4045
- const onKeyDown = React$26.useCallback((event) => {
4051
+ const onKeyDown = React$28.useCallback((event) => {
4046
4052
  event.stopPropagation();
4047
4053
  if (event.key === "Enter") {
4048
4054
  event.preventDefault();
@@ -4053,20 +4059,20 @@ function DataGridSearchImpl({ searchMatches, matchIndex, searchOpen, onSearchOpe
4053
4059
  const debouncedSearch = useDebouncedCallback((query) => {
4054
4060
  onSearch(query);
4055
4061
  }, 150);
4056
- const onChange = React$26.useCallback((event) => {
4062
+ const onChange = React$28.useCallback((event) => {
4057
4063
  const value = event.target.value;
4058
4064
  onSearchQueryChange(value);
4059
4065
  debouncedSearch(value);
4060
4066
  }, [onSearchQueryChange, debouncedSearch]);
4061
- const onTriggerPointerDown = React$26.useCallback((event) => {
4067
+ const onTriggerPointerDown = React$28.useCallback((event) => {
4062
4068
  const target = event.target;
4063
4069
  if (!(target instanceof HTMLElement)) return;
4064
4070
  if (target.hasPointerCapture(event.pointerId)) target.releasePointerCapture(event.pointerId);
4065
4071
  if (event.button === 0 && event.ctrlKey === false && event.pointerType === "mouse" && !(event.target instanceof HTMLInputElement)) event.preventDefault();
4066
4072
  }, []);
4067
- const onPrevMatchPointerDown = React$26.useCallback((event) => onTriggerPointerDown(event), [onTriggerPointerDown]);
4068
- const onNextMatchPointerDown = React$26.useCallback((event) => onTriggerPointerDown(event), [onTriggerPointerDown]);
4069
- const onClose = React$26.useCallback(() => {
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(() => {
4070
4076
  onSearchOpenChange(false);
4071
4077
  }, [onSearchOpenChange]);
4072
4078
  if (!searchOpen) return null;
@@ -4147,15 +4153,15 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
4147
4153
  const visibleColumnIds = table.getVisibleLeafColumns().map((c) => c.id).join(",");
4148
4154
  const pinningState = table.getState().columnPinning;
4149
4155
  const columnPinningKey = `${(pinningState.left ?? []).join(",")}|${(pinningState.right ?? []).join(",")}`;
4150
- const prevVisibleColumnIdsRef = React$25.useRef(visibleColumnIds);
4156
+ const prevVisibleColumnIdsRef = React$27.useRef(visibleColumnIds);
4151
4157
  if (prevVisibleColumnIdsRef.current !== visibleColumnIds) {
4152
4158
  rowMapRef.current.clear();
4153
4159
  prevVisibleColumnIdsRef.current = visibleColumnIds;
4154
4160
  }
4155
- const onGridContextMenu = React$25.useCallback((event) => {
4161
+ const onGridContextMenu = React$27.useCallback((event) => {
4156
4162
  event.preventDefault();
4157
4163
  }, []);
4158
- const onAddRowKeyDown = React$25.useCallback(async (event) => {
4164
+ const onAddRowKeyDown = React$27.useCallback(async (event) => {
4159
4165
  if (!onRowAdd) return;
4160
4166
  if (event.key === "Enter" || event.key === "") {
4161
4167
  event.preventDefault();
@@ -4307,17 +4313,17 @@ function DataGrid({ dataGridRef, headerRef, rowMapRef, footerRef, table, rowVirt
4307
4313
  function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }) {
4308
4314
  const cellValue = cell.getValue();
4309
4315
  const cellValueAsBoolean = Boolean(cellValue);
4310
- const [value, setValue] = React$24.useState(cellValueAsBoolean);
4311
- const containerRef = React$24.useRef(null);
4316
+ const [value, setValue] = React$26.useState(cellValueAsBoolean);
4317
+ const containerRef = React$26.useRef(null);
4312
4318
  const meta = table.options.meta;
4313
4319
  const colMeta = cell.column.columnDef.meta;
4314
- const editableResolver = React$24.useMemo(() => {
4320
+ const editableResolver = React$26.useMemo(() => {
4315
4321
  const v = colMeta?.editable;
4316
4322
  if (v === void 0) return () => true;
4317
4323
  return typeof v === "function" ? v : () => Boolean(v);
4318
4324
  }, [colMeta?.editable]);
4319
4325
  const isEditable = editableResolver(cell.row.original);
4320
- const onCheckedChange = React$24.useCallback((checked) => {
4326
+ const onCheckedChange = React$26.useCallback((checked) => {
4321
4327
  setValue(checked);
4322
4328
  meta?.onDataUpdate?.({
4323
4329
  rowIndex,
@@ -4329,7 +4335,7 @@ function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }
4329
4335
  rowIndex,
4330
4336
  columnId
4331
4337
  ]);
4332
- const onWrapperKeyDown = React$24.useCallback((event) => {
4338
+ const onWrapperKeyDown = React$26.useCallback((event) => {
4333
4339
  if (!isEditable) return;
4334
4340
  if (isFocused && (event.key === "" || event.key === "Enter")) {
4335
4341
  event.preventDefault();
@@ -4342,17 +4348,17 @@ function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }
4342
4348
  onCheckedChange,
4343
4349
  isEditable
4344
4350
  ]);
4345
- React$24.useEffect(() => {
4351
+ React$26.useEffect(() => {
4346
4352
  setValue(cellValueAsBoolean);
4347
4353
  }, [cellValueAsBoolean]);
4348
- React$24.useEffect(() => {
4354
+ React$26.useEffect(() => {
4349
4355
  if (isFocused && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4350
4356
  }, [
4351
4357
  isFocused,
4352
4358
  meta?.searchOpen,
4353
4359
  meta?.isScrolling
4354
4360
  ]);
4355
- const onWrapperClick = React$24.useCallback((event) => {
4361
+ const onWrapperClick = React$26.useCallback((event) => {
4356
4362
  if (!isEditable) return;
4357
4363
  if (isFocused) {
4358
4364
  event.preventDefault();
@@ -4365,13 +4371,13 @@ function CheckboxCell({ cell, table, rowIndex, columnId, isFocused, isSelected }
4365
4371
  onCheckedChange,
4366
4372
  isEditable
4367
4373
  ]);
4368
- const onCheckboxClick = React$24.useCallback((event) => {
4374
+ const onCheckboxClick = React$26.useCallback((event) => {
4369
4375
  event.stopPropagation();
4370
4376
  }, []);
4371
- const onCheckboxMouseDown = React$24.useCallback((event) => {
4377
+ const onCheckboxMouseDown = React$26.useCallback((event) => {
4372
4378
  event.stopPropagation();
4373
4379
  }, []);
4374
- const onCheckboxDoubleClick = React$24.useCallback((event) => {
4380
+ const onCheckboxDoubleClick = React$26.useCallback((event) => {
4375
4381
  event.stopPropagation();
4376
4382
  }, []);
4377
4383
  return /* @__PURE__ */ jsx(DataGridCellWrapper, {
@@ -4426,20 +4432,20 @@ function formatDateToISOString(date) {
4426
4432
  }
4427
4433
  function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4428
4434
  const initialValue = cell.getValue();
4429
- const [value, setValue] = React$23.useState(parseToLocalDate(initialValue));
4430
- const [open, setOpen] = React$23.useState(false);
4431
- const containerRef = React$23.useRef(null);
4432
- const hasStoppedRef = React$23.useRef(false);
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);
4433
4439
  const meta = table.options.meta;
4434
- const prevInitialValueRef = React$23.useRef(initialValue);
4440
+ const prevInitialValueRef = React$25.useRef(initialValue);
4435
4441
  if (initialValue !== prevInitialValueRef.current) {
4436
4442
  prevInitialValueRef.current = initialValue;
4437
4443
  setValue(parseToLocalDate(initialValue));
4438
4444
  }
4439
- React$23.useEffect(() => {
4445
+ React$25.useEffect(() => {
4440
4446
  if (isEditing) hasStoppedRef.current = false;
4441
4447
  }, [isEditing]);
4442
- const onDateSelect = React$23.useCallback((date) => {
4448
+ const onDateSelect = React$25.useCallback((date) => {
4443
4449
  if (!date) return;
4444
4450
  setValue(date);
4445
4451
  meta?.onDataUpdate?.({
@@ -4455,14 +4461,14 @@ function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSel
4455
4461
  rowIndex,
4456
4462
  columnId
4457
4463
  ]);
4458
- const onOpenChange = React$23.useCallback((isOpen) => {
4464
+ const onOpenChange = React$25.useCallback((isOpen) => {
4459
4465
  setOpen(isOpen);
4460
4466
  if (!isOpen && isEditing && !hasStoppedRef.current) {
4461
4467
  hasStoppedRef.current = true;
4462
4468
  meta?.onCellEditingStop?.();
4463
4469
  }
4464
4470
  }, [isEditing, meta]);
4465
- const onWrapperKeyDown = React$23.useCallback((event) => {
4471
+ const onWrapperKeyDown = React$25.useCallback((event) => {
4466
4472
  if (isEditing) {
4467
4473
  if (event.key === "Escape") {
4468
4474
  event.preventDefault();
@@ -4482,10 +4488,10 @@ function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSel
4482
4488
  initialValue,
4483
4489
  meta
4484
4490
  ]);
4485
- React$23.useEffect(() => {
4491
+ React$25.useEffect(() => {
4486
4492
  setOpen(isEditing);
4487
4493
  }, [isEditing]);
4488
- React$23.useEffect(() => {
4494
+ React$25.useEffect(() => {
4489
4495
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4490
4496
  }, [
4491
4497
  isFocused,
@@ -4537,7 +4543,7 @@ function DateCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSel
4537
4543
  //#region src/data-grid/cell-variants/gantt-cell.tsx
4538
4544
  function GanttCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4539
4545
  const initialValue = cell.getValue();
4540
- const containerRef = React$22.useRef(null);
4546
+ const containerRef = React$24.useRef(null);
4541
4547
  const cellOpts = cell.column.columnDef.meta?.cell;
4542
4548
  const ts = cellOpts?.dateRangeFrom ?? cellOpts?.timelineStart;
4543
4549
  const te = cellOpts?.dateRangeTo ?? cellOpts?.timelineEnd;
@@ -4576,19 +4582,19 @@ function GanttCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSe
4576
4582
  //#region src/data-grid/cell-variants/long-text-cell.tsx
4577
4583
  function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4578
4584
  const initialValue = cell.getValue();
4579
- const [value, setValue] = React$21.useState(initialValue ?? "");
4580
- const [open, setOpen] = React$21.useState(false);
4581
- const textareaRef = React$21.useRef(null);
4582
- const containerRef = React$21.useRef(null);
4583
- const hasSubmittedRef = React$21.useRef(false);
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);
4584
4590
  const meta = table.options.meta;
4585
4591
  const sideOffset = -(containerRef.current?.clientHeight ?? 0);
4586
- const prevInitialValueRef = React$21.useRef(initialValue);
4592
+ const prevInitialValueRef = React$23.useRef(initialValue);
4587
4593
  if (initialValue !== prevInitialValueRef.current) {
4588
4594
  prevInitialValueRef.current = initialValue;
4589
4595
  setValue(initialValue ?? "");
4590
4596
  }
4591
- React$21.useEffect(() => {
4597
+ React$23.useEffect(() => {
4592
4598
  if (isEditing) hasSubmittedRef.current = false;
4593
4599
  }, [isEditing]);
4594
4600
  const debouncedSave = useDebouncedCallback((newValue) => {
@@ -4598,7 +4604,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4598
4604
  value: newValue
4599
4605
  });
4600
4606
  }, 300);
4601
- const onSave = React$21.useCallback(() => {
4607
+ const onSave = React$23.useCallback(() => {
4602
4608
  if (hasSubmittedRef.current) return;
4603
4609
  hasSubmittedRef.current = true;
4604
4610
  if (value !== initialValue) meta?.onDataUpdate?.({
@@ -4615,7 +4621,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4615
4621
  rowIndex,
4616
4622
  columnId
4617
4623
  ]);
4618
- const onCancel = React$21.useCallback(() => {
4624
+ const onCancel = React$23.useCallback(() => {
4619
4625
  if (hasSubmittedRef.current) return;
4620
4626
  hasSubmittedRef.current = true;
4621
4627
  setValue(initialValue ?? "");
@@ -4632,12 +4638,12 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4632
4638
  rowIndex,
4633
4639
  columnId
4634
4640
  ]);
4635
- const onChange = React$21.useCallback((event) => {
4641
+ const onChange = React$23.useCallback((event) => {
4636
4642
  const newValue = event.target.value;
4637
4643
  setValue(newValue);
4638
4644
  debouncedSave(newValue);
4639
4645
  }, [debouncedSave]);
4640
- const onOpenChange = React$21.useCallback((isOpen) => {
4646
+ const onOpenChange = React$23.useCallback((isOpen) => {
4641
4647
  setOpen(isOpen);
4642
4648
  if (!isOpen && !hasSubmittedRef.current) {
4643
4649
  hasSubmittedRef.current = true;
@@ -4655,7 +4661,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4655
4661
  rowIndex,
4656
4662
  columnId
4657
4663
  ]);
4658
- const onOpenAutoFocus = React$21.useCallback((event) => {
4664
+ const onOpenAutoFocus = React$23.useCallback((event) => {
4659
4665
  event.preventDefault();
4660
4666
  if (textareaRef.current) {
4661
4667
  textareaRef.current.focus();
@@ -4663,7 +4669,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4663
4669
  textareaRef.current.setSelectionRange(length, length);
4664
4670
  }
4665
4671
  }, []);
4666
- const onWrapperKeyDown = React$21.useCallback((event) => {
4672
+ const onWrapperKeyDown = React$23.useCallback((event) => {
4667
4673
  if (isEditing && !open) {
4668
4674
  if (event.key === "Escape") {
4669
4675
  event.preventDefault();
@@ -4689,7 +4695,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4689
4695
  rowIndex,
4690
4696
  columnId
4691
4697
  ]);
4692
- const onTextareaKeyDown = React$21.useCallback((event) => {
4698
+ const onTextareaKeyDown = React$23.useCallback((event) => {
4693
4699
  if (event.key === "Escape") {
4694
4700
  event.preventDefault();
4695
4701
  onCancel();
@@ -4699,7 +4705,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4699
4705
  }
4700
4706
  event.stopPropagation();
4701
4707
  }, [onCancel, onSave]);
4702
- const onTextareaBlur = React$21.useCallback(() => {
4708
+ const onTextareaBlur = React$23.useCallback(() => {
4703
4709
  if (hasSubmittedRef.current) return;
4704
4710
  hasSubmittedRef.current = true;
4705
4711
  if (value !== initialValue) meta?.onDataUpdate?.({
@@ -4716,7 +4722,7 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4716
4722
  rowIndex,
4717
4723
  columnId
4718
4724
  ]);
4719
- React$21.useEffect(() => {
4725
+ React$23.useEffect(() => {
4720
4726
  if (isEditing && !open) setOpen(true);
4721
4727
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4722
4728
  }, [
@@ -4769,26 +4775,26 @@ function LongTextCell({ cell, table, rowIndex, columnId, isFocused, isEditing, i
4769
4775
  //#endregion
4770
4776
  //#region src/data-grid/cell-variants/multi-select-cell.tsx
4771
4777
  function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
4772
- const cellValue = React$20.useMemo(() => cell.getValue() ?? [], [cell]);
4778
+ const cellValue = React$22.useMemo(() => cell.getValue() ?? [], [cell]);
4773
4779
  const cellId = `${rowIndex}-${columnId}`;
4774
- const prevCellIdRef = React$20.useRef(cellId);
4775
- const [selectedValues, setSelectedValues] = React$20.useState(cellValue);
4776
- const [open, setOpen] = React$20.useState(false);
4777
- const [searchValue, setSearchValue] = React$20.useState("");
4778
- const containerRef = React$20.useRef(null);
4779
- const inputRef = React$20.useRef(null);
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);
4780
4786
  const meta = table.options.meta;
4781
4787
  const cellOpts = cell.column.columnDef.meta?.cell;
4782
4788
  const sideOffset = -(containerRef.current?.clientHeight ?? 0);
4783
4789
  const arrayOptions = cellOpts?.variant === "multi-select" ? cellOpts.options : void 0;
4784
4790
  const optionsMap = cellOpts?.variant === "multi-select" ? cellOpts.optionsMap : void 0;
4785
- const arrayOptionsLabelMap = React$20.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
4786
- const getLabel = React$20.useCallback((val) => {
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) => {
4787
4793
  if (optionsMap) return optionsMap.get(val) ?? val;
4788
4794
  if (arrayOptionsLabelMap) return arrayOptionsLabelMap.get(val) ?? val;
4789
4795
  return val;
4790
4796
  }, [optionsMap, arrayOptionsLabelMap]);
4791
- const options = React$20.useMemo(() => {
4797
+ const options = React$22.useMemo(() => {
4792
4798
  if (!isEditing) return [];
4793
4799
  if (arrayOptions) return arrayOptions;
4794
4800
  if (optionsMap) return Array.from(optionsMap.entries()).map(([id, label]) => ({
@@ -4807,10 +4813,10 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4807
4813
  setOpen(false);
4808
4814
  setSearchValue("");
4809
4815
  }
4810
- React$20.useEffect(() => {
4816
+ React$22.useEffect(() => {
4811
4817
  setSelectedValues(cellValue);
4812
4818
  }, [cellValue]);
4813
- const onValueChange = React$20.useCallback((value) => {
4819
+ const onValueChange = React$22.useCallback((value) => {
4814
4820
  const newValues = selectedValues.includes(value) ? selectedValues.filter((v) => v !== value) : [...selectedValues, value];
4815
4821
  setSelectedValues(newValues);
4816
4822
  meta?.onDataUpdate?.({
@@ -4826,7 +4832,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4826
4832
  rowIndex,
4827
4833
  columnId
4828
4834
  ]);
4829
- const removeValue = React$20.useCallback((valueToRemove, event) => {
4835
+ const removeValue = React$22.useCallback((valueToRemove, event) => {
4830
4836
  event?.stopPropagation();
4831
4837
  event?.preventDefault();
4832
4838
  const newValues = selectedValues.filter((v) => v !== valueToRemove);
@@ -4843,7 +4849,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4843
4849
  rowIndex,
4844
4850
  columnId
4845
4851
  ]);
4846
- const clearAll = React$20.useCallback(() => {
4852
+ const clearAll = React$22.useCallback(() => {
4847
4853
  setSelectedValues([]);
4848
4854
  meta?.onDataUpdate?.({
4849
4855
  rowIndex,
@@ -4856,18 +4862,18 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4856
4862
  rowIndex,
4857
4863
  columnId
4858
4864
  ]);
4859
- const onOpenChange = React$20.useCallback((isOpen) => {
4865
+ const onOpenChange = React$22.useCallback((isOpen) => {
4860
4866
  setOpen(isOpen);
4861
4867
  if (!isOpen) {
4862
4868
  setSearchValue("");
4863
4869
  meta?.onCellEditingStop?.();
4864
4870
  }
4865
4871
  }, [meta]);
4866
- const onOpenAutoFocus = React$20.useCallback((event) => {
4872
+ const onOpenAutoFocus = React$22.useCallback((event) => {
4867
4873
  event.preventDefault();
4868
4874
  inputRef.current?.focus();
4869
4875
  }, []);
4870
- const onWrapperKeyDown = React$20.useCallback((event) => {
4876
+ const onWrapperKeyDown = React$22.useCallback((event) => {
4871
4877
  if (isEditing) {
4872
4878
  if (event.key === "Escape") {
4873
4879
  event.preventDefault();
@@ -4887,7 +4893,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4887
4893
  cellValue,
4888
4894
  meta
4889
4895
  ]);
4890
- const onInputKeyDown = React$20.useCallback((event) => {
4896
+ const onInputKeyDown = React$22.useCallback((event) => {
4891
4897
  if (event.key === "Backspace" && searchValue === "" && selectedValues.length > 0) {
4892
4898
  event.preventDefault();
4893
4899
  const lastValue = selectedValues.at(-1);
@@ -4899,7 +4905,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4899
4905
  selectedValues,
4900
4906
  removeValue
4901
4907
  ]);
4902
- React$20.useEffect(() => {
4908
+ React$22.useEffect(() => {
4903
4909
  if (isEditing && !open) setOpen(true);
4904
4910
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
4905
4911
  }, [
@@ -4909,7 +4915,7 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
4909
4915
  meta?.searchOpen,
4910
4916
  meta?.isScrolling
4911
4917
  ]);
4912
- React$20.useEffect(() => {
4918
+ React$22.useEffect(() => {
4913
4919
  if (open && inputRef.current) setTimeout(() => inputRef.current?.focus(), 0);
4914
4920
  }, [open]);
4915
4921
  const displayLabels = selectedValues.map(getLabel).filter(Boolean);
@@ -5010,19 +5016,19 @@ function MultiSelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing
5010
5016
  //#region src/data-grid/cell-variants/number-cell.tsx
5011
5017
  function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
5012
5018
  const initialValue = cell.getValue();
5013
- const inputRef = React$19.useRef(null);
5014
- const containerRef = React$19.useRef(null);
5019
+ const inputRef = React$21.useRef(null);
5020
+ const containerRef = React$21.useRef(null);
5015
5021
  const meta = table.options.meta;
5016
5022
  const colMeta = cell.column.columnDef.meta;
5017
5023
  const cellOptions = colMeta?.cell;
5018
- const editableResolver = React$19.useMemo(() => {
5024
+ const editableResolver = React$21.useMemo(() => {
5019
5025
  const v = colMeta?.editable;
5020
5026
  if (v === void 0) return () => true;
5021
5027
  return typeof v === "function" ? v : () => Boolean(v);
5022
5028
  }, [colMeta?.editable]);
5023
5029
  const isEditable = editableResolver(cell.row.original);
5024
5030
  const { min, max, step, prefix, suffix, fallbackValue = "" } = cellOptions?.variant === "number" ? cellOptions : {};
5025
- const resolvedPrefix = React$19.useMemo(() => {
5031
+ const resolvedPrefix = React$21.useMemo(() => {
5026
5032
  if (typeof prefix === "function") return prefix(cell.row.original, initialValue);
5027
5033
  return prefix ?? null;
5028
5034
  }, [
@@ -5030,7 +5036,7 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5030
5036
  cell.row.original,
5031
5037
  initialValue
5032
5038
  ]);
5033
- const resolvedSuffix = React$19.useMemo(() => {
5039
+ const resolvedSuffix = React$21.useMemo(() => {
5034
5040
  if (typeof suffix === "function") return suffix(cell.row.original, initialValue);
5035
5041
  return suffix ?? null;
5036
5042
  }, [
@@ -5038,12 +5044,12 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5038
5044
  cell.row.original,
5039
5045
  initialValue
5040
5046
  ]);
5041
- const [editValue, setEditValue] = React$19.useState(initialValue !== null && initialValue !== void 0 ? String(initialValue) : "");
5042
- const hasSubmittedRef = React$19.useRef(false);
5043
- React$19.useEffect(() => {
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(() => {
5044
5050
  if (isEditing) hasSubmittedRef.current = false;
5045
5051
  }, [isEditing]);
5046
- const onBlur = React$19.useCallback(() => {
5052
+ const onBlur = React$21.useCallback(() => {
5047
5053
  if (hasSubmittedRef.current) return;
5048
5054
  const numValue = editValue === "" ? null : Number(editValue);
5049
5055
  if (numValue !== initialValue) meta?.onDataUpdate?.({
@@ -5059,13 +5065,13 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5059
5065
  initialValue,
5060
5066
  editValue
5061
5067
  ]);
5062
- const onChange = React$19.useCallback((event) => {
5068
+ const onChange = React$21.useCallback((event) => {
5063
5069
  setEditValue(event.target.value);
5064
5070
  }, []);
5065
- const parseNumValue = React$19.useCallback(() => {
5071
+ const parseNumValue = React$21.useCallback(() => {
5066
5072
  return editValue === "" ? null : Number(editValue);
5067
5073
  }, [editValue]);
5068
- const saveAndStop = React$19.useCallback((options) => {
5074
+ const saveAndStop = React$21.useCallback((options) => {
5069
5075
  hasSubmittedRef.current = true;
5070
5076
  const numValue = parseNumValue();
5071
5077
  meta?.onDataUpdate?.({
@@ -5080,7 +5086,7 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5080
5086
  rowIndex,
5081
5087
  columnId
5082
5088
  ]);
5083
- const handleEditingKeyDown = React$19.useCallback((event) => {
5089
+ const handleEditingKeyDown = React$21.useCallback((event) => {
5084
5090
  if (event.key === "Enter") {
5085
5091
  event.preventDefault();
5086
5092
  saveAndStop({ moveToNextRow: true });
@@ -5099,12 +5105,12 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5099
5105
  initialValue,
5100
5106
  meta
5101
5107
  ]);
5102
- const handleFocusedKeyDown = React$19.useCallback((event) => {
5108
+ const handleFocusedKeyDown = React$21.useCallback((event) => {
5103
5109
  if (!isEditable) return;
5104
5110
  if (event.key === "Backspace") setEditValue("");
5105
5111
  else if (event.key.length === 1 && !event.ctrlKey && !event.metaKey) setEditValue(event.key);
5106
5112
  }, [isEditable]);
5107
- const onWrapperKeyDown = React$19.useCallback((event) => {
5113
+ const onWrapperKeyDown = React$21.useCallback((event) => {
5108
5114
  if (isEditing) handleEditingKeyDown(event);
5109
5115
  else if (isFocused) handleFocusedKeyDown(event);
5110
5116
  }, [
@@ -5113,10 +5119,10 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5113
5119
  handleEditingKeyDown,
5114
5120
  handleFocusedKeyDown
5115
5121
  ]);
5116
- React$19.useEffect(() => {
5122
+ React$21.useEffect(() => {
5117
5123
  setEditValue(initialValue !== null && initialValue !== void 0 ? String(initialValue) : "");
5118
5124
  }, [initialValue]);
5119
- React$19.useEffect(() => {
5125
+ React$21.useEffect(() => {
5120
5126
  if (isEditing && inputRef.current) {
5121
5127
  inputRef.current.focus();
5122
5128
  inputRef.current.select();
@@ -5163,7 +5169,7 @@ function NumberCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5163
5169
  //#endregion
5164
5170
  //#region src/data-grid/cell-variants/react-node-cell.tsx
5165
5171
  function ReactNodeCell({ cell, table, rowIndex, columnId, isFocused, isSelected, isEditing }) {
5166
- const containerRef = React$18.useRef(null);
5172
+ const containerRef = React$20.useRef(null);
5167
5173
  const cellOpts = cell.column.columnDef.meta?.cell;
5168
5174
  const renderFn = cellOpts?.variant === "react-node" ? cellOpts.render : void 0;
5169
5175
  const children = renderFn ? renderFn({
@@ -5193,17 +5199,17 @@ function ReactNodeCell({ cell, table, rowIndex, columnId, isFocused, isSelected,
5193
5199
  //#region src/data-grid/cell-variants/select-cell.tsx
5194
5200
  function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isSelected }) {
5195
5201
  const initialValue = cell.getValue();
5196
- const [value, setValue] = React$17.useState(initialValue);
5197
- const [open, setOpen] = React$17.useState(false);
5198
- const containerRef = React$17.useRef(null);
5199
- const inputRef = React$17.useRef(null);
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);
5200
5206
  const meta = table.options.meta;
5201
5207
  const cellOpts = cell.column.columnDef.meta?.cell;
5202
5208
  const hasSearch = (cellOpts?.variant === "select" && cellOpts?.hasSearch) ?? false;
5203
5209
  const sideOffset = -(inputRef.current?.clientHeight ?? 0);
5204
5210
  const { options: arrayOptions, optionsMap, optionsRenderer } = cellOpts?.variant === "select" ? cellOpts : {};
5205
- const arrayOptionsLabelMap = React$17.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
5206
- const displayLabel = React$17.useMemo(() => {
5211
+ const arrayOptionsLabelMap = React$19.useMemo(() => arrayOptions ? new Map(arrayOptions.map((opt) => [opt.value, opt.label])) : null, [arrayOptions]);
5212
+ const displayLabel = React$19.useMemo(() => {
5207
5213
  if (optionsMap) {
5208
5214
  const data = optionsMap.get(value ?? "");
5209
5215
  if (optionsRenderer) return optionsRenderer(data, "cell");
@@ -5217,7 +5223,7 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5217
5223
  arrayOptionsLabelMap,
5218
5224
  optionsRenderer
5219
5225
  ]);
5220
- const options = React$17.useMemo(() => {
5226
+ const options = React$19.useMemo(() => {
5221
5227
  if (!isEditing) return [];
5222
5228
  if (arrayOptions) return arrayOptions.map((opt) => ({
5223
5229
  value: opt.value,
@@ -5233,7 +5239,7 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5233
5239
  arrayOptions,
5234
5240
  optionsMap
5235
5241
  ]);
5236
- const onValueChange = React$17.useCallback((newValue) => {
5242
+ const onValueChange = React$19.useCallback((newValue) => {
5237
5243
  setValue(newValue);
5238
5244
  meta?.onDataUpdate?.({
5239
5245
  rowIndex,
@@ -5246,15 +5252,15 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5246
5252
  rowIndex,
5247
5253
  columnId
5248
5254
  ]);
5249
- const onOpenChange = React$17.useCallback((isOpen) => {
5255
+ const onOpenChange = React$19.useCallback((isOpen) => {
5250
5256
  setOpen(isOpen);
5251
5257
  if (!isOpen) meta?.onCellEditingStop?.();
5252
5258
  }, [meta]);
5253
- const onOpenAutoFocus = React$17.useCallback((event) => {
5259
+ const onOpenAutoFocus = React$19.useCallback((event) => {
5254
5260
  event.preventDefault();
5255
5261
  inputRef.current?.focus();
5256
5262
  }, []);
5257
- const onWrapperKeyDown = React$17.useCallback((event) => {
5263
+ const onWrapperKeyDown = React$19.useCallback((event) => {
5258
5264
  if (isEditing) {
5259
5265
  if (event.key === "Escape") {
5260
5266
  event.preventDefault();
@@ -5272,10 +5278,10 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5272
5278
  initialValue,
5273
5279
  meta
5274
5280
  ]);
5275
- React$17.useEffect(() => {
5281
+ React$19.useEffect(() => {
5276
5282
  setValue(initialValue);
5277
5283
  }, [initialValue]);
5278
- React$17.useEffect(() => {
5284
+ React$19.useEffect(() => {
5279
5285
  if (isEditing && !open) setOpen(true);
5280
5286
  if (isFocused && !isEditing && !meta?.searchOpen && !meta?.isScrolling && containerRef.current) containerRef.current.focus();
5281
5287
  }, [
@@ -5360,22 +5366,22 @@ function SelectCell({ cell, table, rowIndex, columnId, isFocused, isEditing, isS
5360
5366
  //#region src/data-grid/cell-variants/short-text-cell.tsx
5361
5367
  function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused, isSelected }) {
5362
5368
  const initialValue = cell.getValue();
5363
- const [value, setValue] = React$16.useState(initialValue);
5364
- const inputRef = React$16.useRef(null);
5365
- const containerRef = React$16.useRef(null);
5366
- const hasSubmittedRef = React$16.useRef(false);
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);
5367
5373
  const meta = table.options.meta;
5368
5374
  const colMeta = cell.column.columnDef.meta;
5369
- const editableResolver = React$16.useMemo(() => {
5375
+ const editableResolver = React$18.useMemo(() => {
5370
5376
  const v = colMeta?.editable;
5371
5377
  if (v === void 0) return () => true;
5372
5378
  return typeof v === "function" ? v : () => Boolean(v);
5373
5379
  }, [colMeta?.editable]);
5374
5380
  const isEditable = editableResolver(cell.row.original);
5375
- React$16.useEffect(() => {
5381
+ React$18.useEffect(() => {
5376
5382
  if (isEditing) hasSubmittedRef.current = false;
5377
5383
  }, [isEditing]);
5378
- const onBlur = React$16.useCallback(() => {
5384
+ const onBlur = React$18.useCallback(() => {
5379
5385
  if (hasSubmittedRef.current) return;
5380
5386
  const currentValue = inputRef.current?.value ?? "";
5381
5387
  const normalizedInitial = initialValue ?? "";
@@ -5391,10 +5397,10 @@ function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused,
5391
5397
  columnId,
5392
5398
  initialValue
5393
5399
  ]);
5394
- const onChange = React$16.useCallback((event) => {
5400
+ const onChange = React$18.useCallback((event) => {
5395
5401
  setValue(event.target.value);
5396
5402
  }, []);
5397
- const handleEditingKeyDown = React$16.useCallback((event) => {
5403
+ const handleEditingKeyDown = React$18.useCallback((event) => {
5398
5404
  if (event.key === "Enter") {
5399
5405
  event.preventDefault();
5400
5406
  hasSubmittedRef.current = true;
@@ -5428,13 +5434,13 @@ function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused,
5428
5434
  rowIndex,
5429
5435
  columnId
5430
5436
  ]);
5431
- const handleFocusedKeyDown = React$16.useCallback((event) => {
5437
+ const handleFocusedKeyDown = React$18.useCallback((event) => {
5432
5438
  if (event.key.length === 1 && !event.ctrlKey && !event.metaKey) {
5433
5439
  if (!isEditable) return;
5434
5440
  setValue(event.key);
5435
5441
  }
5436
5442
  }, [isEditable]);
5437
- const onWrapperKeyDown = React$16.useCallback((event) => {
5443
+ const onWrapperKeyDown = React$18.useCallback((event) => {
5438
5444
  if (isEditing) handleEditingKeyDown(event);
5439
5445
  else if (isFocused) handleFocusedKeyDown(event);
5440
5446
  }, [
@@ -5443,10 +5449,10 @@ function ShortTextCell({ cell, table, rowIndex, columnId, isEditing, isFocused,
5443
5449
  handleEditingKeyDown,
5444
5450
  handleFocusedKeyDown
5445
5451
  ]);
5446
- React$16.useEffect(() => {
5452
+ React$18.useEffect(() => {
5447
5453
  setValue(initialValue);
5448
5454
  }, [initialValue]);
5449
- React$16.useEffect(() => {
5455
+ React$18.useEffect(() => {
5450
5456
  if (isEditing && inputRef.current) {
5451
5457
  inputRef.current.focus();
5452
5458
  inputRef.current.setSelectionRange(inputRef.current.value.length, inputRef.current.value.length);
@@ -5602,7 +5608,7 @@ function DataGridCell({ cell, table }) {
5602
5608
 
5603
5609
  //#endregion
5604
5610
  //#region src/separator/separator.tsx
5605
- const Separator = React$15.forwardRef(({ className, orientation = "horizontal", decorative = true,...props }, ref) => /* @__PURE__ */ jsx(SeparatorPrimitive.Root, {
5611
+ const Separator = React$17.forwardRef(({ className, orientation = "horizontal", decorative = true,...props }, ref) => /* @__PURE__ */ jsx(SeparatorPrimitive.Root, {
5606
5612
  ref,
5607
5613
  decorative,
5608
5614
  orientation,
@@ -5614,22 +5620,22 @@ Separator.displayName = SeparatorPrimitive.Root.displayName;
5614
5620
  //#endregion
5615
5621
  //#region src/data-grid/data-grid-view-menu.tsx
5616
5622
  function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAdmin, onApplyView, onSaveView, onUpdateView, onRenameView, onDeleteView, onClearView,...props }) {
5617
- const viewableColumns = React$14.useMemo(() => table.getAllColumns().filter((column) => typeof column.accessorFn !== "undefined"), [table]);
5618
- const [order, setOrder] = React$14.useState(() => {
5623
+ const viewableColumns = React$16.useMemo(() => table.getAllColumns().filter((column) => typeof column.accessorFn !== "undefined"), [table]);
5624
+ const [order, setOrder] = React$16.useState(() => {
5619
5625
  const stateOrder = table.getState().columnOrder ?? [];
5620
5626
  if (stateOrder && stateOrder.length > 0) return stateOrder;
5621
5627
  return table.getAllColumns().map((c) => c.id);
5622
5628
  });
5623
- const [searchQuery, setSearchQuery] = React$14.useState("");
5624
- const [isDragging, setIsDragging] = React$14.useState(false);
5625
- const [insertionIndex, setInsertionIndex] = React$14.useState(null);
5626
- const [isCreating, setIsCreating] = React$14.useState(false);
5627
- const [newViewName, setNewViewName] = React$14.useState("");
5628
- const [newViewGlobal, setNewViewGlobal] = React$14.useState(false);
5629
- const [renamingViewId, setRenamingViewId] = React$14.useState(null);
5630
- const [renameValue, setRenameValue] = React$14.useState("");
5631
- const [deletingViewId, setDeletingViewId] = React$14.useState(null);
5632
- const [updatingViewId, setUpdatingViewId] = React$14.useState(null);
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);
5633
5639
  function resetAllStates() {
5634
5640
  setIsCreating(false);
5635
5641
  setNewViewName("");
@@ -5640,7 +5646,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5640
5646
  setSearchQuery("");
5641
5647
  }
5642
5648
  const tableColumnOrder = table.getState().columnOrder;
5643
- React$14.useEffect(() => {
5649
+ React$16.useEffect(() => {
5644
5650
  const stateOrder = tableColumnOrder ?? [];
5645
5651
  if (stateOrder && stateOrder.length > 0) {
5646
5652
  setOrder(stateOrder);
@@ -5648,8 +5654,8 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5648
5654
  }
5649
5655
  setOrder(table.getAllColumns().map((c) => c.id));
5650
5656
  }, [table, tableColumnOrder]);
5651
- const visibleSet = React$14.useMemo(() => new Set(viewableColumns.map((c) => c.id)), [viewableColumns]);
5652
- const orderedColumns = React$14.useMemo(() => {
5657
+ const visibleSet = React$16.useMemo(() => new Set(viewableColumns.map((c) => c.id)), [viewableColumns]);
5658
+ const orderedColumns = React$16.useMemo(() => {
5653
5659
  const ordered = [];
5654
5660
  for (const id of order) {
5655
5661
  const col = viewableColumns.find((c) => c.id === id);
@@ -5662,12 +5668,12 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5662
5668
  viewableColumns,
5663
5669
  table
5664
5670
  ]);
5665
- const draggingRef = React$14.useRef(null);
5666
- const groupRef = React$14.useRef(null);
5667
- const getBaseOrder = React$14.useCallback(() => {
5671
+ const draggingRef = React$16.useRef(null);
5672
+ const groupRef = React$16.useRef(null);
5673
+ const getBaseOrder = React$16.useCallback(() => {
5668
5674
  return table.getState().columnOrder && table.getState().columnOrder.length ? table.getState().columnOrder.slice() : table.getAllColumns().map((c) => c.id);
5669
5675
  }, [table]);
5670
- const computeInsertionIndex = React$14.useCallback((clientY) => {
5676
+ const computeInsertionIndex = React$16.useCallback((clientY) => {
5671
5677
  const baseOrder = getBaseOrder();
5672
5678
  const el = groupRef.current;
5673
5679
  if (!el) return baseOrder.length;
@@ -5689,7 +5695,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5689
5695
  setIsDragging(false);
5690
5696
  setInsertionIndex(null);
5691
5697
  }
5692
- const doDrop = React$14.useCallback((dragId, toIndex) => {
5698
+ const doDrop = React$16.useCallback((dragId, toIndex) => {
5693
5699
  const baseOrder = table.getState().columnOrder && table.getState().columnOrder.length ? table.getState().columnOrder.slice() : table.getAllColumns().map((c) => c.id);
5694
5700
  const fromIndex = baseOrder.indexOf(dragId);
5695
5701
  if (fromIndex === -1) {
@@ -5706,7 +5712,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5706
5712
  setOrder(copy.filter((id) => visibleSet.has(id)));
5707
5713
  onDragEnd();
5708
5714
  }, [table, visibleSet]);
5709
- const startPointerDrag = React$14.useCallback((e, id) => {
5715
+ const startPointerDrag = React$16.useCallback((e, id) => {
5710
5716
  e.preventDefault();
5711
5717
  draggingRef.current = id;
5712
5718
  setIsDragging(true);
@@ -5739,7 +5745,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5739
5745
  if (fromIndex < targetIndex) insertAt = targetIndex - 1;
5740
5746
  return insertAt === fromIndex;
5741
5747
  }
5742
- const dragFromHandle = React$14.useRef(false);
5748
+ const dragFromHandle = React$16.useRef(false);
5743
5749
  function resetTableView() {
5744
5750
  const defaultOrder = table.getAllColumns().map((c) => c.id);
5745
5751
  try {
@@ -5762,7 +5768,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5762
5768
  } catch (_) {}
5763
5769
  }
5764
5770
  }
5765
- const sortedViews = React$14.useMemo(() => {
5771
+ const sortedViews = React$16.useMemo(() => {
5766
5772
  if (!savedViews || savedViews.length === 0) return savedViews;
5767
5773
  return [...savedViews].sort((a, b) => {
5768
5774
  if (a.isGlobal !== b.isGlobal) return a.isGlobal ? -1 : 1;
@@ -5921,12 +5927,15 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5921
5927
  })
5922
5928
  ]
5923
5929
  }, view.id);
5924
- return /* @__PURE__ */ jsxs(Button, {
5925
- variant: "ghost",
5926
- size: "max",
5927
- className: cn("text-start gap-1 px-2 h-6 rounded-sm cursor-pointer group hover:bg-accent", isActive && "bg-accent/50"),
5928
- onClick: () => onApplyView?.(view.id),
5930
+ return /* @__PURE__ */ jsxs("div", {
5931
+ className: cn("relative flex items-center text-start gap-1 px-2 h-6 rounded-sm cursor-pointer group hover:bg-accent", isActive && "bg-accent/50"),
5929
5932
  children: [
5933
+ /* @__PURE__ */ jsx("button", {
5934
+ type: "button",
5935
+ className: "absolute inset-0 hover:cursor-pointer",
5936
+ onClick: () => onApplyView?.(view.id),
5937
+ "aria-label": `Apply view "${view.name}"`
5938
+ }),
5930
5939
  view.isGlobal ? /* @__PURE__ */ jsx(GlobeIcon, { className: cn("size-3.5 shrink-0", isActive ? "text-primary" : "text-muted-foreground") }) : /* @__PURE__ */ jsx(BookmarkIcon, { className: cn("size-3.5 shrink-0", isActive ? "text-primary" : "text-muted-foreground") }),
5931
5940
  /* @__PURE__ */ jsx("span", {
5932
5941
  className: "text-sm truncate flex-1",
@@ -5934,7 +5943,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5934
5943
  }),
5935
5944
  isActive ? /* @__PURE__ */ jsx(CheckIcon$1, { className: "group-hover:hidden size-3.5 text-primary shrink-0" }) : null,
5936
5945
  canEdit && /* @__PURE__ */ jsxs("div", {
5937
- className: "hidden group-hover:flex items-center shrink-0",
5946
+ className: "relative z-10 hidden group-hover:flex items-center shrink-0",
5938
5947
  children: [
5939
5948
  onUpdateView && /* @__PURE__ */ jsx(TooltipProvider, {
5940
5949
  delayDuration: 300,
@@ -5943,8 +5952,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5943
5952
  children: /* @__PURE__ */ jsx(Button, {
5944
5953
  variant: "ghost",
5945
5954
  size: "iconXs",
5946
- onClick: (e) => {
5947
- e.stopPropagation();
5955
+ onClick: () => {
5948
5956
  resetAllStates();
5949
5957
  setUpdatingViewId(view.id);
5950
5958
  },
@@ -5962,8 +5970,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5962
5970
  children: /* @__PURE__ */ jsx(Button, {
5963
5971
  variant: "ghost",
5964
5972
  size: "iconXs",
5965
- onClick: (e) => {
5966
- e.stopPropagation();
5973
+ onClick: () => {
5967
5974
  resetAllStates();
5968
5975
  setRenamingViewId(view.id);
5969
5976
  setRenameValue(view.name);
@@ -5983,8 +5990,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
5983
5990
  variant: "ghost",
5984
5991
  size: "iconXs",
5985
5992
  className: "text-destructive hover:text-destructive",
5986
- onClick: (e) => {
5987
- e.stopPropagation();
5993
+ onClick: () => {
5988
5994
  resetAllStates();
5989
5995
  setDeletingViewId(view.id);
5990
5996
  },
@@ -6078,7 +6084,7 @@ function DataGridViewMenu({ table, savedViews, activeViewId, currentUserId, isAd
6078
6084
  const currentBase = table.getState().columnOrder && table.getState().columnOrder.length ? table.getState().columnOrder.slice() : table.getAllColumns().map((c) => c.id);
6079
6085
  const pos = currentBase.indexOf(column.id);
6080
6086
  const isHideable = column.getCanHide();
6081
- return /* @__PURE__ */ jsxs(React$14.Fragment, { children: [/* @__PURE__ */ jsxs(CommandItem, {
6087
+ return /* @__PURE__ */ jsxs(React$16.Fragment, { children: [/* @__PURE__ */ jsxs(CommandItem, {
6082
6088
  value: column.id,
6083
6089
  "data-col-id": column.id,
6084
6090
  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"),
@@ -6200,30 +6206,30 @@ const MIN_COLUMN_SIZE = 60;
6200
6206
  const MAX_COLUMN_SIZE = 800;
6201
6207
  const SEARCH_SHORTCUT_KEY = "f";
6202
6208
  const NON_NAVIGABLE_COLUMN_IDS = ["select", "actions"];
6203
- const useIsomorphicLayoutEffect = typeof window !== "undefined" ? React$13.useLayoutEffect : React$13.useEffect;
6209
+ const useIsomorphicLayoutEffect = typeof window !== "undefined" ? React$15.useLayoutEffect : React$15.useEffect;
6204
6210
  function useLazyRef(fn) {
6205
- const ref = React$13.useRef(null);
6211
+ const ref = React$15.useRef(null);
6206
6212
  if (ref.current === null) ref.current = fn();
6207
6213
  return ref;
6208
6214
  }
6209
6215
  function useAsRef(data) {
6210
- const ref = React$13.useRef(data);
6216
+ const ref = React$15.useRef(data);
6211
6217
  useIsomorphicLayoutEffect(() => {
6212
6218
  ref.current = data;
6213
6219
  });
6214
6220
  return ref;
6215
6221
  }
6216
6222
  function useStore(store, selector) {
6217
- const getSnapshot = React$13.useCallback(() => selector(store.getState()), [store, selector]);
6218
- return React$13.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
6223
+ const getSnapshot = React$15.useCallback(() => selector(store.getState()), [store, selector]);
6224
+ return React$15.useSyncExternalStore(store.subscribe, getSnapshot, getSnapshot);
6219
6225
  }
6220
6226
  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 }) {
6221
- const dataGridRef = React$13.useRef(null);
6222
- const tableRef = React$13.useRef(null);
6223
- const rowVirtualizerRef = React$13.useRef(null);
6224
- const headerRef = React$13.useRef(null);
6225
- const rowMapRef = React$13.useRef(new Map());
6226
- const footerRef = React$13.useRef(null);
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);
6227
6233
  const dataGridPropsRef = useAsRef(dataGridProps);
6228
6234
  const listenersRef = useLazyRef(() => new Set());
6229
6235
  const stateRef = useLazyRef(() => {
@@ -6251,7 +6257,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6251
6257
  isScrolling: false
6252
6258
  };
6253
6259
  });
6254
- const store = React$13.useMemo(() => {
6260
+ const store = React$15.useMemo(() => {
6255
6261
  let isBatching = false;
6256
6262
  let pendingNotification = false;
6257
6263
  return {
@@ -6295,7 +6301,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6295
6301
  }
6296
6302
  };
6297
6303
  }, [listenersRef, stateRef]);
6298
- React$13.useEffect(() => {
6304
+ React$15.useEffect(() => {
6299
6305
  store.setState("rowHeight", rowHeightProp);
6300
6306
  }, [rowHeightProp, store]);
6301
6307
  const focusedCell = useStore(store, (state) => state.focusedCell);
@@ -6311,27 +6317,27 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6311
6317
  const rowHeight = useStore(store, (state) => state.rowHeight);
6312
6318
  const isScrolling = useStore(store, (state) => state.isScrolling);
6313
6319
  const rowHeightValue = getRowHeightValue(rowHeight);
6314
- const columnIds = React$13.useMemo(() => {
6320
+ const columnIds = React$15.useMemo(() => {
6315
6321
  return columns.map((c) => {
6316
6322
  if (c.id) return c.id;
6317
6323
  if ("accessorKey" in c) return c.accessorKey;
6318
6324
  return void 0;
6319
6325
  }).filter((id) => Boolean(id));
6320
6326
  }, [columns]);
6321
- const columnDefsVersionRef = React$13.useRef(0);
6322
- const prevColumnsRef = React$13.useRef(columns);
6327
+ const columnDefsVersionRef = React$15.useRef(0);
6328
+ const prevColumnsRef = React$15.useRef(columns);
6323
6329
  if (prevColumnsRef.current !== columns) {
6324
6330
  prevColumnsRef.current = columns;
6325
6331
  columnDefsVersionRef.current += 1;
6326
6332
  }
6327
6333
  const columnDefsVersion = columnDefsVersionRef.current;
6328
- const storageKey = React$13.useMemo(() => {
6334
+ const storageKey = React$15.useMemo(() => {
6329
6335
  if (!persistColumnState || typeof window === "undefined") return void 0;
6330
6336
  const path = globalThis.location?.pathname ?? "unknown";
6331
6337
  const cols = columnIds.join("|");
6332
6338
  return `pxl.dataGrid:${path}:${cols}`;
6333
6339
  }, [columnIds, persistColumnState]);
6334
- const persistedState = React$13.useMemo(() => {
6340
+ const persistedState = React$15.useMemo(() => {
6335
6341
  if (!storageKey) return void 0;
6336
6342
  try {
6337
6343
  const raw = localStorage.getItem(storageKey);
@@ -6342,7 +6348,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6342
6348
  return void 0;
6343
6349
  }
6344
6350
  }, [storageKey]);
6345
- const mergedInitialState = React$13.useMemo(() => {
6351
+ const mergedInitialState = React$15.useMemo(() => {
6346
6352
  const base = { ...initialState ?? {} };
6347
6353
  if (persistedState) try {
6348
6354
  if (persistedState.columnOrder) base.columnOrder = persistedState.columnOrder;
@@ -6351,12 +6357,12 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6351
6357
  } catch (_) {}
6352
6358
  return base;
6353
6359
  }, [initialState, persistedState]);
6354
- const getNavigableColumnIds = React$13.useCallback(() => {
6360
+ const getNavigableColumnIds = React$15.useCallback(() => {
6355
6361
  const t = tableRef.current;
6356
6362
  if (t) return t.getVisibleLeafColumns().map((c) => c.id).filter((c) => !NON_NAVIGABLE_COLUMN_IDS.includes(c));
6357
6363
  return columnIds.filter((c) => !NON_NAVIGABLE_COLUMN_IDS.includes(c));
6358
6364
  }, [columnIds]);
6359
- const onDataUpdate = React$13.useCallback((updates) => {
6365
+ const onDataUpdate = React$15.useCallback((updates) => {
6360
6366
  const updateArray = Array.isArray(updates) ? updates : [updates];
6361
6367
  if (updateArray.length === 0) return;
6362
6368
  const currentTable = tableRef.current;
@@ -6404,10 +6410,10 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6404
6410
  });
6405
6411
  onDataChange?.(newData);
6406
6412
  }, [data, onDataChange]);
6407
- const getIsCellSelected = React$13.useCallback((rowIndex, columnId) => {
6413
+ const getIsCellSelected = React$15.useCallback((rowIndex, columnId) => {
6408
6414
  return selectionState.selectedCells.has(getCellKey(rowIndex, columnId));
6409
6415
  }, [selectionState.selectedCells]);
6410
- const clearSelection = React$13.useCallback(() => {
6416
+ const clearSelection = React$15.useCallback(() => {
6411
6417
  store.batch(() => {
6412
6418
  store.setState("selectionState", {
6413
6419
  selectedCells: new Set(),
@@ -6417,7 +6423,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6417
6423
  store.setState("rowSelection", {});
6418
6424
  });
6419
6425
  }, [store]);
6420
- const selectAll = React$13.useCallback(() => {
6426
+ const selectAll = React$15.useCallback(() => {
6421
6427
  const allCells = new Set();
6422
6428
  const currentTable = tableRef.current;
6423
6429
  const rows = currentTable?.getRowModel().rows ?? [];
@@ -6444,7 +6450,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6444
6450
  data.length,
6445
6451
  store
6446
6452
  ]);
6447
- const selectColumn = React$13.useCallback((columnId) => {
6453
+ const selectColumn = React$15.useCallback((columnId) => {
6448
6454
  const currentTable = tableRef.current;
6449
6455
  const rows = currentTable?.getRowModel().rows ?? [];
6450
6456
  const rowCount = rows.length ?? data.length;
@@ -6466,7 +6472,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6466
6472
  isSelecting: false
6467
6473
  });
6468
6474
  }, [data.length, store]);
6469
- const selectRange = React$13.useCallback((start, end, isSelecting = false) => {
6475
+ const selectRange = React$15.useCallback((start, end, isSelecting = false) => {
6470
6476
  const visibleCols = getNavigableColumnIds();
6471
6477
  const startColIndex = visibleCols.indexOf(start.columnId);
6472
6478
  const endColIndex = visibleCols.indexOf(end.columnId);
@@ -6488,7 +6494,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6488
6494
  isSelecting
6489
6495
  });
6490
6496
  }, [getNavigableColumnIds, store]);
6491
- const focusCell = React$13.useCallback((rowIndex, columnId) => {
6497
+ const focusCell = React$15.useCallback((rowIndex, columnId) => {
6492
6498
  store.batch(() => {
6493
6499
  store.setState("focusedCell", {
6494
6500
  rowIndex,
@@ -6504,7 +6510,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6504
6510
  if (currentState.searchOpen) return;
6505
6511
  if (dataGridRef.current && document.activeElement !== dataGridRef.current) dataGridRef.current.focus();
6506
6512
  }, [store, onCellFocusProp]);
6507
- const onRowsDelete = React$13.useCallback(async (rowIndices) => {
6513
+ const onRowsDelete = React$15.useCallback(async (rowIndices) => {
6508
6514
  if (!onRowsDeleteProp || rowIndices.length === 0) return;
6509
6515
  const currentTable = tableRef.current;
6510
6516
  const rows = currentTable?.getRowModel().rows;
@@ -6556,7 +6562,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6556
6562
  const debouncedRowClick = useDebouncedCallback((rowIndex) => {
6557
6563
  onRowClickProp?.(rowIndex);
6558
6564
  }, 300);
6559
- const navigateCell = React$13.useCallback((direction) => {
6565
+ const navigateCell = React$15.useCallback((direction) => {
6560
6566
  const currentState = store.getState();
6561
6567
  if (!currentState.focusedCell) return;
6562
6568
  const { rowIndex, columnId } = currentState.focusedCell;
@@ -6686,7 +6692,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6686
6692
  onRowClickProp,
6687
6693
  debouncedRowClick
6688
6694
  ]);
6689
- const onCellEditingStart = React$13.useCallback((rowIndex, columnId) => {
6695
+ const onCellEditingStart = React$15.useCallback((rowIndex, columnId) => {
6690
6696
  const col = tableRef.current?.getColumn(columnId);
6691
6697
  const editable = col?.columnDef?.meta?.editable;
6692
6698
  if (editable === false) return;
@@ -6705,7 +6711,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6705
6711
  });
6706
6712
  });
6707
6713
  }, [store]);
6708
- const onCellEditingStop = React$13.useCallback((opts) => {
6714
+ const onCellEditingStop = React$15.useCallback((opts) => {
6709
6715
  const currentState = store.getState();
6710
6716
  const currentEditing = currentState.editingCell;
6711
6717
  store.setState("editingCell", null);
@@ -6731,7 +6737,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6731
6737
  focusCell,
6732
6738
  navigateCell
6733
6739
  ]);
6734
- const onSearchOpenChange = React$13.useCallback((open) => {
6740
+ const onSearchOpenChange = React$15.useCallback((open) => {
6735
6741
  if (open) {
6736
6742
  store.setState("searchOpen", true);
6737
6743
  return;
@@ -6750,7 +6756,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6750
6756
  });
6751
6757
  if (dataGridRef.current && document.activeElement !== dataGridRef.current) dataGridRef.current.focus();
6752
6758
  }, [store]);
6753
- const onSearch = React$13.useCallback((query) => {
6759
+ const onSearch = React$15.useCallback((query) => {
6754
6760
  if (!query.trim()) {
6755
6761
  store.batch(() => {
6756
6762
  store.setState("searchMatches", []);
@@ -6785,8 +6791,8 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6785
6791
  rowVirtualizerRef.current?.scrollToIndex(firstMatch.rowIndex, { align: "center" });
6786
6792
  }
6787
6793
  }, [columnIds, store]);
6788
- const onSearchQueryChange = React$13.useCallback((query) => store.setState("searchQuery", query), [store]);
6789
- const onNavigateToPrevMatch = React$13.useCallback(() => {
6794
+ const onSearchQueryChange = React$15.useCallback((query) => store.setState("searchQuery", query), [store]);
6795
+ const onNavigateToPrevMatch = React$15.useCallback(() => {
6790
6796
  const currentState = store.getState();
6791
6797
  if (currentState.searchMatches.length === 0) return;
6792
6798
  const prevIndex = currentState.matchIndex - 1 < 0 ? currentState.searchMatches.length - 1 : currentState.matchIndex - 1;
@@ -6801,7 +6807,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6801
6807
  });
6802
6808
  }
6803
6809
  }, [store, focusCell]);
6804
- const onNavigateToNextMatch = React$13.useCallback(() => {
6810
+ const onNavigateToNextMatch = React$15.useCallback(() => {
6805
6811
  const currentState = store.getState();
6806
6812
  if (currentState.searchMatches.length === 0) return;
6807
6813
  const nextIndex = (currentState.matchIndex + 1) % currentState.searchMatches.length;
@@ -6816,15 +6822,15 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6816
6822
  });
6817
6823
  }
6818
6824
  }, [store, focusCell]);
6819
- const getIsSearchMatch = React$13.useCallback((rowIndex, columnId) => {
6825
+ const getIsSearchMatch = React$15.useCallback((rowIndex, columnId) => {
6820
6826
  return searchMatches.some((match) => match.rowIndex === rowIndex && match.columnId === columnId);
6821
6827
  }, [searchMatches]);
6822
- const getIsActiveSearchMatch = React$13.useCallback((rowIndex, columnId) => {
6828
+ const getIsActiveSearchMatch = React$15.useCallback((rowIndex, columnId) => {
6823
6829
  if (matchIndex < 0) return false;
6824
6830
  const currentMatch = searchMatches[matchIndex];
6825
6831
  return currentMatch?.rowIndex === rowIndex && currentMatch?.columnId === columnId;
6826
6832
  }, [searchMatches, matchIndex]);
6827
- const blurCell = React$13.useCallback(() => {
6833
+ const blurCell = React$15.useCallback(() => {
6828
6834
  const currentState = store.getState();
6829
6835
  if (currentState.editingCell && document.activeElement instanceof HTMLElement) document.activeElement.blur();
6830
6836
  store.batch(() => {
@@ -6832,7 +6838,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6832
6838
  store.setState("editingCell", null);
6833
6839
  });
6834
6840
  }, [store]);
6835
- const onCellClick = React$13.useCallback((rowIndex, columnId, event) => {
6841
+ const onCellClick = React$15.useCallback((rowIndex, columnId, event) => {
6836
6842
  if (event?.button === 2) return;
6837
6843
  const currentState = store.getState();
6838
6844
  const currentFocused = currentState.focusedCell;
@@ -6880,11 +6886,11 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6880
6886
  selectRange,
6881
6887
  clearSelection
6882
6888
  ]);
6883
- const onCellDoubleClick = React$13.useCallback((rowIndex, columnId, event) => {
6889
+ const onCellDoubleClick = React$15.useCallback((rowIndex, columnId, event) => {
6884
6890
  if (event?.defaultPrevented) return;
6885
6891
  onCellEditingStart(rowIndex, columnId);
6886
6892
  }, [onCellEditingStart]);
6887
- const onCellMouseDown = React$13.useCallback((rowIndex, columnId, event) => {
6893
+ const onCellMouseDown = React$15.useCallback((rowIndex, columnId, event) => {
6888
6894
  if (event.button === 2) return;
6889
6895
  event.preventDefault();
6890
6896
  if (!event.ctrlKey && !event.metaKey && !event.shiftKey) store.batch(() => {
@@ -6905,7 +6911,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6905
6911
  store.setState("rowSelection", {});
6906
6912
  });
6907
6913
  }, [store]);
6908
- const onCellMouseEnter = React$13.useCallback((rowIndex, columnId, _event) => {
6914
+ const onCellMouseEnter = React$15.useCallback((rowIndex, columnId, _event) => {
6909
6915
  const currentState = store.getState();
6910
6916
  if (currentState.selectionState.isSelecting && currentState.selectionState.selectionRange) {
6911
6917
  const start = currentState.selectionState.selectionRange.start;
@@ -6921,14 +6927,14 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6921
6927
  selectRange,
6922
6928
  focusCell
6923
6929
  ]);
6924
- const onCellMouseUp = React$13.useCallback(() => {
6930
+ const onCellMouseUp = React$15.useCallback(() => {
6925
6931
  const currentState = store.getState();
6926
6932
  store.setState("selectionState", {
6927
6933
  ...currentState.selectionState,
6928
6934
  isSelecting: false
6929
6935
  });
6930
6936
  }, [store]);
6931
- const onCellContextMenu = React$13.useCallback((rowIndex, columnId, event) => {
6937
+ const onCellContextMenu = React$15.useCallback((rowIndex, columnId, event) => {
6932
6938
  event.preventDefault();
6933
6939
  event.stopPropagation();
6934
6940
  const currentState = store.getState();
@@ -6960,7 +6966,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6960
6966
  y: event.clientY
6961
6967
  });
6962
6968
  }, [store]);
6963
- const onContextMenuOpenChange = React$13.useCallback((open) => {
6969
+ const onContextMenuOpenChange = React$15.useCallback((open) => {
6964
6970
  if (!open) {
6965
6971
  const currentMenu = store.getState().contextMenu;
6966
6972
  store.setState("contextMenu", {
@@ -6970,7 +6976,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
6970
6976
  });
6971
6977
  }
6972
6978
  }, [store]);
6973
- const onDataGridKeyDown = React$13.useCallback((event) => {
6979
+ const onDataGridKeyDown = React$15.useCallback((event) => {
6974
6980
  const currentState = store.getState();
6975
6981
  const { key, ctrlKey, metaKey, shiftKey } = event;
6976
6982
  const isCtrlPressed = ctrlKey || metaKey;
@@ -7129,7 +7135,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7129
7135
  enableSearch,
7130
7136
  onCellEditingStart
7131
7137
  ]);
7132
- const onSortingChange = React$13.useCallback((updater) => {
7138
+ const onSortingChange = React$15.useCallback((updater) => {
7133
7139
  if (manualSorting && externalOnSortingChange) externalOnSortingChange(updater);
7134
7140
  else {
7135
7141
  const currentState = store.getState();
@@ -7141,7 +7147,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7141
7147
  manualSorting,
7142
7148
  externalOnSortingChange
7143
7149
  ]);
7144
- const onRowSelectionChange = React$13.useCallback((updater) => {
7150
+ const onRowSelectionChange = React$15.useCallback((updater) => {
7145
7151
  const currentState = store.getState();
7146
7152
  const newRowSelection = typeof updater === "function" ? updater(currentState.rowSelection) : updater;
7147
7153
  const selectedRows = Object.keys(newRowSelection).filter((key) => newRowSelection[key]);
@@ -7163,7 +7169,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7163
7169
  store.setState("editingCell", null);
7164
7170
  });
7165
7171
  }, [store, columnIds]);
7166
- const onRowSelect = React$13.useCallback((rowIndex, selected, shiftKey) => {
7172
+ const onRowSelect = React$15.useCallback((rowIndex, selected, shiftKey) => {
7167
7173
  const currentState = store.getState();
7168
7174
  const rows = tableRef.current?.getRowModel().rows ?? [];
7169
7175
  const currentRow = rows[rowIndex];
@@ -7183,12 +7189,12 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7183
7189
  });
7184
7190
  store.setState("lastClickedRowIndex", rowIndex);
7185
7191
  }, [store, onRowSelectionChange]);
7186
- const onRowHeightChange = React$13.useCallback((updater) => {
7192
+ const onRowHeightChange = React$15.useCallback((updater) => {
7187
7193
  const currentState = store.getState();
7188
7194
  const newRowHeight = typeof updater === "function" ? updater(currentState.rowHeight) : updater;
7189
7195
  store.setState("rowHeight", newRowHeight);
7190
7196
  }, [store]);
7191
- const onColumnClick = React$13.useCallback((columnId) => {
7197
+ const onColumnClick = React$15.useCallback((columnId) => {
7192
7198
  if (!enableColumnSelection) {
7193
7199
  clearSelection();
7194
7200
  return;
@@ -7199,13 +7205,13 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7199
7205
  selectColumn,
7200
7206
  clearSelection
7201
7207
  ]);
7202
- const defaultColumn = React$13.useMemo(() => ({
7208
+ const defaultColumn = React$15.useMemo(() => ({
7203
7209
  cell: DataGridCell,
7204
7210
  minSize: MIN_COLUMN_SIZE,
7205
7211
  maxSize: MAX_COLUMN_SIZE
7206
7212
  }), []);
7207
7213
  const effectiveSorting = manualSorting && externalSorting ? externalSorting : sorting;
7208
- const tableOptions = React$13.useMemo(() => ({
7214
+ const tableOptions = React$15.useMemo(() => ({
7209
7215
  ...dataGridPropsRef.current,
7210
7216
  data,
7211
7217
  columns,
@@ -7297,7 +7303,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7297
7303
  if (!tableRef.current) tableRef.current = table;
7298
7304
  const columnSizing = table.getState().columnSizing;
7299
7305
  const columnVisibility = table.getState().columnVisibility;
7300
- const columnSizeVars = React$13.useMemo(() => {
7306
+ const columnSizeVars = React$15.useMemo(() => {
7301
7307
  const headers = table.getFlatHeaders();
7302
7308
  const colSizes = {};
7303
7309
  for (const header of headers) {
@@ -7339,7 +7345,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7339
7345
  }
7340
7346
  });
7341
7347
  if (!rowVirtualizerRef.current) rowVirtualizerRef.current = rowVirtualizer;
7342
- const onScrollToRow = React$13.useCallback((opts) => {
7348
+ const onScrollToRow = React$15.useCallback((opts) => {
7343
7349
  const rowIndex = opts?.rowIndex ?? 0;
7344
7350
  const columnId = opts?.columnId;
7345
7351
  rowVirtualizer.scrollToIndex(rowIndex, { align: "center" });
@@ -7363,7 +7369,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7363
7369
  getNavigableColumnIds,
7364
7370
  store
7365
7371
  ]);
7366
- const onRowAdd = React$13.useCallback(async (event) => {
7372
+ const onRowAdd = React$15.useCallback(async (event) => {
7367
7373
  if (!onRowAddProp) return;
7368
7374
  const result = await onRowAddProp(event);
7369
7375
  if (event?.defaultPrevented || result === null) return;
@@ -7396,7 +7402,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7396
7402
  table.getState().columnVisibility,
7397
7403
  table.getState().columnPinning
7398
7404
  ]);
7399
- const searchState = React$13.useMemo(() => {
7405
+ const searchState = React$15.useMemo(() => {
7400
7406
  if (!enableSearch) return void 0;
7401
7407
  return {
7402
7408
  searchMatches,
@@ -7421,7 +7427,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7421
7427
  onNavigateToNextMatch,
7422
7428
  onNavigateToPrevMatch
7423
7429
  ]);
7424
- React$13.useEffect(() => {
7430
+ React$15.useEffect(() => {
7425
7431
  const dataGridElement = dataGridRef.current;
7426
7432
  if (!dataGridElement) return;
7427
7433
  dataGridElement.addEventListener("keydown", onDataGridKeyDown);
@@ -7429,7 +7435,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7429
7435
  dataGridElement.removeEventListener("keydown", onDataGridKeyDown);
7430
7436
  };
7431
7437
  }, [onDataGridKeyDown]);
7432
- React$13.useEffect(() => {
7438
+ React$15.useEffect(() => {
7433
7439
  function onGlobalKeyDown(event) {
7434
7440
  const dataGridElement = dataGridRef.current;
7435
7441
  if (!dataGridElement) return;
@@ -7473,7 +7479,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7473
7479
  store,
7474
7480
  clearSelection
7475
7481
  ]);
7476
- React$13.useEffect(() => {
7482
+ React$15.useEffect(() => {
7477
7483
  const currentState = store.getState();
7478
7484
  if (autoFocus && data.length > 0 && columns.length > 0 && !currentState.focusedCell) {
7479
7485
  const _nav = getNavigableColumnIds();
@@ -7499,7 +7505,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7499
7505
  getNavigableColumnIds,
7500
7506
  focusCell
7501
7507
  ]);
7502
- React$13.useEffect(() => {
7508
+ React$15.useEffect(() => {
7503
7509
  function onOutsideClick(event) {
7504
7510
  if (event.button === 2) return;
7505
7511
  if (dataGridRef.current && !dataGridRef.current.contains(event.target)) {
@@ -7521,7 +7527,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7521
7527
  blurCell,
7522
7528
  clearSelection
7523
7529
  ]);
7524
- React$13.useEffect(() => {
7530
+ React$15.useEffect(() => {
7525
7531
  function onCleanup() {
7526
7532
  document.removeEventListener("selectstart", preventSelection);
7527
7533
  document.removeEventListener("contextmenu", preventContextMenu);
@@ -7581,7 +7587,7 @@ function useDataGrid({ columns, data, onDataChange, onRowAdd: onRowAddProp, onRo
7581
7587
  //#endregion
7582
7588
  //#region src/date-picker/date-picker.tsx
7583
7589
  function DatePickerDemo() {
7584
- const [date, setDate] = React$12.useState();
7590
+ const [date, setDate] = React$14.useState();
7585
7591
  return /* @__PURE__ */ jsxs(Popover, { children: [/* @__PURE__ */ jsx(PopoverTrigger, {
7586
7592
  asChild: true,
7587
7593
  children: /* @__PURE__ */ jsxs(Button, {
@@ -7611,13 +7617,13 @@ Drawer.displayName = "Drawer";
7611
7617
  const DrawerTrigger = Drawer$1.Trigger;
7612
7618
  const DrawerPortal = Drawer$1.Portal;
7613
7619
  const DrawerClose = Drawer$1.Close;
7614
- const DrawerOverlay = React$11.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Overlay, {
7620
+ const DrawerOverlay = React$13.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Overlay, {
7615
7621
  ref,
7616
7622
  className: cn("fixed inset-0 z-50 bg-black/80", className),
7617
7623
  ...props
7618
7624
  }));
7619
7625
  DrawerOverlay.displayName = Drawer$1.Overlay.displayName;
7620
- const DrawerContent = React$11.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsxs(Drawer$1.Content, {
7626
+ const DrawerContent = React$13.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(DrawerPortal, { children: [/* @__PURE__ */ jsx(DrawerOverlay, {}), /* @__PURE__ */ jsxs(Drawer$1.Content, {
7621
7627
  ref,
7622
7628
  className: cn("fixed inset-x-0 bottom-0 z-50 mt-24 flex h-auto flex-col rounded-t-[10px] border bg-background", className),
7623
7629
  ...props,
@@ -7634,13 +7640,13 @@ const DrawerFooter = ({ className,...props }) => /* @__PURE__ */ jsx("div", {
7634
7640
  ...props
7635
7641
  });
7636
7642
  DrawerFooter.displayName = "DrawerFooter";
7637
- const DrawerTitle = React$11.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Title, {
7643
+ const DrawerTitle = React$13.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Title, {
7638
7644
  ref,
7639
7645
  className: cn("text-lg font-semibold leading-none tracking-tight", className),
7640
7646
  ...props
7641
7647
  }));
7642
7648
  DrawerTitle.displayName = Drawer$1.Title.displayName;
7643
- const DrawerDescription = React$11.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Description, {
7649
+ const DrawerDescription = React$13.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(Drawer$1.Description, {
7644
7650
  ref,
7645
7651
  className: cn("text-sm text-muted-foreground", className),
7646
7652
  ...props
@@ -7698,10 +7704,10 @@ const fieldVariants = cva("group/field flex w-full gap-3 data-[invalid=true]:tex
7698
7704
  defaultVariants: { orientation: "vertical" }
7699
7705
  });
7700
7706
  function Field({ className, orientation = "vertical",...props }) {
7701
- return /* @__PURE__ */ jsx("fieldset", {
7707
+ return /* @__PURE__ */ jsx("div", {
7702
7708
  "data-slot": "field",
7703
7709
  "data-orientation": orientation,
7704
- className: cn(fieldVariants({ orientation }), "border-0 p-0 m-0", className),
7710
+ className: cn(fieldVariants({ orientation }), className),
7705
7711
  ...props
7706
7712
  });
7707
7713
  }
@@ -7770,8 +7776,8 @@ function FieldError({ className, children, errors,...props }) {
7770
7776
  //#endregion
7771
7777
  //#region src/hooks/use-is-mobile.ts
7772
7778
  function useIsMobile(mobileBreakpoint = 768) {
7773
- const [isMobile, setIsMobile] = React$10.useState(false);
7774
- React$10.useEffect(() => {
7779
+ const [isMobile, setIsMobile] = React$12.useState(false);
7780
+ React$12.useEffect(() => {
7775
7781
  const mql = globalThis.matchMedia(`(max-width: ${mobileBreakpoint - 1}px)`);
7776
7782
  const onChange = () => {
7777
7783
  setIsMobile(globalThis.innerWidth < mobileBreakpoint);
@@ -7845,6 +7851,611 @@ const InfoCard = ({ variant, title, message, showHomeButton = false, children })
7845
7851
  });
7846
7852
  };
7847
7853
 
7854
+ //#endregion
7855
+ //#region src/kanban/kanban.tsx
7856
+ const directions = [
7857
+ KeyboardCode.Down,
7858
+ KeyboardCode.Right,
7859
+ KeyboardCode.Up,
7860
+ KeyboardCode.Left
7861
+ ];
7862
+ const coordinateGetter = (event, { context }) => {
7863
+ const { active, droppableRects, droppableContainers, collisionRect } = context;
7864
+ if (directions.includes(event.code)) {
7865
+ event.preventDefault();
7866
+ if (!active || !collisionRect) return;
7867
+ const filteredContainers = [];
7868
+ for (const entry of droppableContainers.getEnabled()) {
7869
+ if (!entry || entry?.disabled) return;
7870
+ const rect = droppableRects.get(entry.id);
7871
+ if (!rect) return;
7872
+ const data = entry.data.current;
7873
+ if (data) {
7874
+ const { type, children } = data;
7875
+ if (type === "container" && children?.length > 0) {
7876
+ if (active.data.current?.type !== "container") return;
7877
+ }
7878
+ }
7879
+ switch (event.code) {
7880
+ case KeyboardCode.Down:
7881
+ if (collisionRect.top < rect.top) filteredContainers.push(entry);
7882
+ break;
7883
+ case KeyboardCode.Up:
7884
+ if (collisionRect.top > rect.top) filteredContainers.push(entry);
7885
+ break;
7886
+ case KeyboardCode.Left:
7887
+ if (collisionRect.left >= rect.left + rect.width) filteredContainers.push(entry);
7888
+ break;
7889
+ case KeyboardCode.Right:
7890
+ if (collisionRect.left + collisionRect.width <= rect.left) filteredContainers.push(entry);
7891
+ break;
7892
+ }
7893
+ }
7894
+ const collisions = closestCorners({
7895
+ active,
7896
+ collisionRect,
7897
+ droppableRects,
7898
+ droppableContainers: filteredContainers,
7899
+ pointerCoordinates: null
7900
+ });
7901
+ const closestId = getFirstCollision(collisions, "id");
7902
+ if (closestId != null) {
7903
+ const newDroppable = droppableContainers.get(closestId);
7904
+ const newNode = newDroppable?.node.current;
7905
+ const newRect = newDroppable?.rect.current;
7906
+ if (newNode && newRect) {
7907
+ if (newDroppable.id === "placeholder") return {
7908
+ x: newRect.left + (newRect.width - collisionRect.width) / 2,
7909
+ y: newRect.top + (newRect.height - collisionRect.height) / 2
7910
+ };
7911
+ if (newDroppable.data.current?.type === "container") return {
7912
+ x: newRect.left + 20,
7913
+ y: newRect.top + 74
7914
+ };
7915
+ return {
7916
+ x: newRect.left,
7917
+ y: newRect.top
7918
+ };
7919
+ }
7920
+ }
7921
+ }
7922
+ return void 0;
7923
+ };
7924
+ const ROOT_NAME = "Kanban";
7925
+ const BOARD_NAME = "KanbanBoard";
7926
+ const COLUMN_NAME = "KanbanColumn";
7927
+ const COLUMN_HANDLE_NAME = "KanbanColumnHandle";
7928
+ const ITEM_NAME = "KanbanItem";
7929
+ const ITEM_HANDLE_NAME = "KanbanItemHandle";
7930
+ const OVERLAY_NAME = "KanbanOverlay";
7931
+ const KanbanContext = React$11.createContext(null);
7932
+ function useKanbanContext(consumerName) {
7933
+ const context = React$11.useContext(KanbanContext);
7934
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ROOT_NAME}\``);
7935
+ return context;
7936
+ }
7937
+ function KanbanRoot(props) {
7938
+ 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);
7943
+ const sensors = useSensors(useSensor(MouseSensor), useSensor(TouchSensor), useSensor(KeyboardSensor, { coordinateGetter }));
7944
+ const getItemValue = React$11.useCallback((item) => {
7945
+ if (typeof item === "object" && !getItemValueProp) throw new Error("`getItemValue` is required when using array of objects");
7946
+ return getItemValueProp ? getItemValueProp(item) : item;
7947
+ }, [getItemValueProp]);
7948
+ const getColumn = React$11.useCallback((id$1) => {
7949
+ if (id$1 in value) return id$1;
7950
+ for (const [columnId, items] of Object.entries(value)) if (items.some((item) => getItemValue(item) === id$1)) return columnId;
7951
+ return null;
7952
+ }, [value, getItemValue]);
7953
+ const collisionDetection = React$11.useCallback((args) => {
7954
+ if (activeId && activeId in value) return closestCenter({
7955
+ ...args,
7956
+ droppableContainers: args.droppableContainers.filter((container) => container.id in value)
7957
+ });
7958
+ const pointerIntersections = pointerWithin(args);
7959
+ const intersections = pointerIntersections.length > 0 ? pointerIntersections : rectIntersection(args);
7960
+ let overId = getFirstCollision(intersections, "id");
7961
+ if (!overId) {
7962
+ if (hasMovedRef.current) lastOverIdRef.current = activeId;
7963
+ return lastOverIdRef.current ? [{ id: lastOverIdRef.current }] : [];
7964
+ }
7965
+ if (overId in value) {
7966
+ const containerItems = value[overId];
7967
+ if (containerItems && containerItems.length > 0) {
7968
+ const closestItem = closestCenter({
7969
+ ...args,
7970
+ droppableContainers: args.droppableContainers.filter((container) => container.id !== overId && containerItems.some((item) => getItemValue(item) === container.id))
7971
+ });
7972
+ if (closestItem.length > 0) overId = closestItem[0]?.id ?? overId;
7973
+ }
7974
+ }
7975
+ lastOverIdRef.current = overId;
7976
+ return [{ id: overId }];
7977
+ }, [
7978
+ activeId,
7979
+ value,
7980
+ getItemValue
7981
+ ]);
7982
+ const onDragStart = React$11.useCallback((event) => {
7983
+ kanbanProps.onDragStart?.(event);
7984
+ if (event.activatorEvent.defaultPrevented) return;
7985
+ setActiveId(event.active.id);
7986
+ }, [kanbanProps]);
7987
+ const onDragOver = React$11.useCallback((event) => {
7988
+ kanbanProps.onDragOver?.(event);
7989
+ if (event.activatorEvent.defaultPrevented) return;
7990
+ const { active, over } = event;
7991
+ if (!over) return;
7992
+ const activeColumn = getColumn(active.id);
7993
+ const overColumn = getColumn(over.id);
7994
+ if (!activeColumn || !overColumn) return;
7995
+ if (activeColumn === overColumn) {
7996
+ const items = value[activeColumn];
7997
+ if (!items) return;
7998
+ const activeIndex = items.findIndex((item) => getItemValue(item) === active.id);
7999
+ const overIndex = items.findIndex((item) => getItemValue(item) === over.id);
8000
+ if (activeIndex !== overIndex) {
8001
+ const newColumns = { ...value };
8002
+ newColumns[activeColumn] = arrayMove(items, activeIndex, overIndex);
8003
+ onValueChange?.(newColumns);
8004
+ }
8005
+ } else {
8006
+ const activeItems = value[activeColumn];
8007
+ const overItems = value[overColumn];
8008
+ if (!activeItems || !overItems) return;
8009
+ const activeIndex = activeItems.findIndex((item) => getItemValue(item) === active.id);
8010
+ if (activeIndex === -1) return;
8011
+ const activeItem = activeItems[activeIndex];
8012
+ if (!activeItem) return;
8013
+ const updatedItems = {
8014
+ ...value,
8015
+ [activeColumn]: activeItems.filter((item) => getItemValue(item) !== active.id),
8016
+ [overColumn]: [...overItems, activeItem]
8017
+ };
8018
+ onValueChange?.(updatedItems);
8019
+ hasMovedRef.current = true;
8020
+ }
8021
+ }, [
8022
+ kanbanProps,
8023
+ getColumn,
8024
+ value,
8025
+ getItemValue,
8026
+ onValueChange
8027
+ ]);
8028
+ const onDragEnd = React$11.useCallback((event) => {
8029
+ kanbanProps.onDragEnd?.(event);
8030
+ if (event.activatorEvent.defaultPrevented) return;
8031
+ const { active, over } = event;
8032
+ if (!over) {
8033
+ setActiveId(null);
8034
+ return;
8035
+ }
8036
+ if (active.id in value && over.id in value) {
8037
+ const activeIndex = Object.keys(value).indexOf(active.id);
8038
+ const overIndex = Object.keys(value).indexOf(over.id);
8039
+ if (activeIndex !== overIndex) {
8040
+ const orderedColumns = Object.keys(value);
8041
+ const newOrder = arrayMove(orderedColumns, activeIndex, overIndex);
8042
+ const newColumns = {};
8043
+ for (const key of newOrder) {
8044
+ const items = value[key];
8045
+ if (items) newColumns[key] = items;
8046
+ }
8047
+ if (onMove) onMove({
8048
+ ...event,
8049
+ activeIndex,
8050
+ overIndex
8051
+ });
8052
+ else onValueChange?.(newColumns);
8053
+ }
8054
+ } else {
8055
+ const activeColumn = getColumn(active.id);
8056
+ const overColumn = getColumn(over.id);
8057
+ if (!activeColumn || !overColumn) {
8058
+ setActiveId(null);
8059
+ return;
8060
+ }
8061
+ if (activeColumn === overColumn) {
8062
+ const items = value[activeColumn];
8063
+ if (!items) {
8064
+ setActiveId(null);
8065
+ return;
8066
+ }
8067
+ const activeIndex = items.findIndex((item) => getItemValue(item) === active.id);
8068
+ const overIndex = items.findIndex((item) => getItemValue(item) === over.id);
8069
+ if (activeIndex !== overIndex) {
8070
+ const newColumns = { ...value };
8071
+ newColumns[activeColumn] = arrayMove(items, activeIndex, overIndex);
8072
+ if (onMove) onMove({
8073
+ ...event,
8074
+ activeIndex,
8075
+ overIndex
8076
+ });
8077
+ else onValueChange?.(newColumns);
8078
+ }
8079
+ }
8080
+ }
8081
+ setActiveId(null);
8082
+ hasMovedRef.current = false;
8083
+ }, [
8084
+ kanbanProps,
8085
+ value,
8086
+ onMove,
8087
+ onValueChange,
8088
+ getColumn,
8089
+ getItemValue
8090
+ ]);
8091
+ const onDragCancel = React$11.useCallback((event) => {
8092
+ kanbanProps.onDragCancel?.(event);
8093
+ if (event.activatorEvent.defaultPrevented) return;
8094
+ setActiveId(null);
8095
+ hasMovedRef.current = false;
8096
+ }, [kanbanProps]);
8097
+ const announcements = React$11.useMemo(() => ({
8098
+ onDragStart({ active }) {
8099
+ const isColumn = active.id in value;
8100
+ const itemType = isColumn ? "column" : "item";
8101
+ const position = isColumn ? Object.keys(value).indexOf(active.id) + 1 : (() => {
8102
+ const column = getColumn(active.id);
8103
+ if (!column || !value[column]) return 1;
8104
+ return value[column].findIndex((item) => getItemValue(item) === active.id) + 1;
8105
+ })();
8106
+ const total = isColumn ? Object.keys(value).length : (() => {
8107
+ const column = getColumn(active.id);
8108
+ return column ? value[column]?.length ?? 0 : 0;
8109
+ })();
8110
+ return `Picked up ${itemType} at position ${position} of ${total}`;
8111
+ },
8112
+ onDragOver({ active, over }) {
8113
+ if (!over) return;
8114
+ const isColumn = active.id in value;
8115
+ const itemType = isColumn ? "column" : "item";
8116
+ const position = isColumn ? Object.keys(value).indexOf(over.id) + 1 : (() => {
8117
+ const column = getColumn(over.id);
8118
+ if (!column || !value[column]) return 1;
8119
+ return value[column].findIndex((item) => getItemValue(item) === over.id) + 1;
8120
+ })();
8121
+ const total = isColumn ? Object.keys(value).length : (() => {
8122
+ const column = getColumn(over.id);
8123
+ return column ? value[column]?.length ?? 0 : 0;
8124
+ })();
8125
+ const overColumn = getColumn(over.id);
8126
+ const activeColumn = getColumn(active.id);
8127
+ if (isColumn) return `${itemType} is now at position ${position} of ${total}`;
8128
+ if (activeColumn !== overColumn) return `${itemType} is now at position ${position} of ${total} in ${overColumn}`;
8129
+ return `${itemType} is now at position ${position} of ${total}`;
8130
+ },
8131
+ onDragEnd({ active, over }) {
8132
+ if (!over) return;
8133
+ const isColumn = active.id in value;
8134
+ const itemType = isColumn ? "column" : "item";
8135
+ const position = isColumn ? Object.keys(value).indexOf(over.id) + 1 : (() => {
8136
+ const column = getColumn(over.id);
8137
+ if (!column || !value[column]) return 1;
8138
+ return value[column].findIndex((item) => getItemValue(item) === over.id) + 1;
8139
+ })();
8140
+ const total = isColumn ? Object.keys(value).length : (() => {
8141
+ const column = getColumn(over.id);
8142
+ return column ? value[column]?.length ?? 0 : 0;
8143
+ })();
8144
+ const overColumn = getColumn(over.id);
8145
+ const activeColumn = getColumn(active.id);
8146
+ if (isColumn) return `${itemType} was dropped at position ${position} of ${total}`;
8147
+ if (activeColumn !== overColumn) return `${itemType} was dropped at position ${position} of ${total} in ${overColumn}`;
8148
+ return `${itemType} was dropped at position ${position} of ${total}`;
8149
+ },
8150
+ onDragCancel({ active }) {
8151
+ const isColumn = active.id in value;
8152
+ const itemType = isColumn ? "column" : "item";
8153
+ return `Dragging was cancelled. ${itemType} was dropped.`;
8154
+ }
8155
+ }), [
8156
+ value,
8157
+ getColumn,
8158
+ getItemValue
8159
+ ]);
8160
+ const contextValue = React$11.useMemo(() => ({
8161
+ id,
8162
+ items: value,
8163
+ modifiers,
8164
+ strategy,
8165
+ orientation,
8166
+ activeId,
8167
+ setActiveId,
8168
+ getItemValue,
8169
+ flatCursor
8170
+ }), [
8171
+ id,
8172
+ value,
8173
+ activeId,
8174
+ modifiers,
8175
+ strategy,
8176
+ orientation,
8177
+ getItemValue,
8178
+ flatCursor
8179
+ ]);
8180
+ return /* @__PURE__ */ jsx(KanbanContext.Provider, {
8181
+ value: contextValue,
8182
+ children: /* @__PURE__ */ jsx(DndContext, {
8183
+ collisionDetection,
8184
+ modifiers,
8185
+ sensors,
8186
+ ...kanbanProps,
8187
+ id,
8188
+ measuring: { droppable: { strategy: MeasuringStrategy.Always } },
8189
+ onDragStart,
8190
+ onDragOver,
8191
+ onDragEnd,
8192
+ onDragCancel,
8193
+ accessibility: {
8194
+ announcements,
8195
+ screenReaderInstructions: { draggable: `
8196
+ To pick up a kanban item or column, press space or enter.
8197
+ While dragging, use the arrow keys to move the item.
8198
+ Press space or enter again to drop the item in its new position, or press escape to cancel.
8199
+ ` },
8200
+ ...accessibility
8201
+ }
8202
+ })
8203
+ });
8204
+ }
8205
+ const KanbanBoardContext = React$11.createContext(false);
8206
+ function KanbanBoard(props) {
8207
+ const { asChild, className, ref,...boardProps } = props;
8208
+ const context = useKanbanContext(BOARD_NAME);
8209
+ const columns = React$11.useMemo(() => {
8210
+ return Object.keys(context.items);
8211
+ }, [context.items]);
8212
+ const BoardPrimitive = asChild ? Slot : "div";
8213
+ return /* @__PURE__ */ jsx(KanbanBoardContext.Provider, {
8214
+ value: true,
8215
+ children: /* @__PURE__ */ jsx(SortableContext, {
8216
+ items: columns,
8217
+ strategy: context.orientation === "horizontal" ? horizontalListSortingStrategy : verticalListSortingStrategy,
8218
+ children: /* @__PURE__ */ jsx(BoardPrimitive, {
8219
+ "aria-orientation": context.orientation,
8220
+ "data-orientation": context.orientation,
8221
+ "data-slot": "kanban-board",
8222
+ ...boardProps,
8223
+ ref,
8224
+ className: cn("flex size-full gap-4", context.orientation === "horizontal" ? "flex-row" : "flex-col", className)
8225
+ })
8226
+ })
8227
+ });
8228
+ }
8229
+ const KanbanColumnContext = React$11.createContext(null);
8230
+ function useKanbanColumnContext(consumerName) {
8231
+ const context = React$11.useContext(KanbanColumnContext);
8232
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${COLUMN_NAME}\``);
8233
+ return context;
8234
+ }
8235
+ const animateLayoutChanges = (args) => defaultAnimateLayoutChanges({
8236
+ ...args,
8237
+ wasDragging: true
8238
+ });
8239
+ function KanbanColumn(props) {
8240
+ const { value, asChild, asHandle, disabled, className, style, ref,...columnProps } = props;
8241
+ const id = React$11.useId();
8242
+ const context = useKanbanContext(COLUMN_NAME);
8243
+ const inBoard = React$11.useContext(KanbanBoardContext);
8244
+ const inOverlay = React$11.useContext(KanbanOverlayContext);
8245
+ if (!inBoard && !inOverlay) throw new Error(`\`${COLUMN_NAME}\` must be used within \`${BOARD_NAME}\` or \`${OVERLAY_NAME}\``);
8246
+ if (value === "") throw new Error(`\`${COLUMN_NAME}\` value cannot be an empty string`);
8247
+ const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({
8248
+ id: value,
8249
+ disabled,
8250
+ animateLayoutChanges
8251
+ });
8252
+ const composedRef = useComposedRefs(ref, (node) => {
8253
+ if (disabled) return;
8254
+ setNodeRef(node);
8255
+ });
8256
+ const composedStyle = React$11.useMemo(() => {
8257
+ return {
8258
+ transform: CSS.Transform.toString(transform),
8259
+ transition,
8260
+ ...style
8261
+ };
8262
+ }, [
8263
+ transform,
8264
+ transition,
8265
+ style
8266
+ ]);
8267
+ const items = React$11.useMemo(() => {
8268
+ const items$1 = context.items[value] ?? [];
8269
+ return items$1.map((item) => context.getItemValue(item));
8270
+ }, [context, value]);
8271
+ const columnContext = React$11.useMemo(() => ({
8272
+ id,
8273
+ attributes,
8274
+ listeners,
8275
+ setActivatorNodeRef,
8276
+ isDragging,
8277
+ disabled
8278
+ }), [
8279
+ id,
8280
+ attributes,
8281
+ listeners,
8282
+ setActivatorNodeRef,
8283
+ isDragging,
8284
+ disabled
8285
+ ]);
8286
+ const ColumnPrimitive = asChild ? Slot : "div";
8287
+ return /* @__PURE__ */ jsx(KanbanColumnContext.Provider, {
8288
+ value: columnContext,
8289
+ children: /* @__PURE__ */ jsx(SortableContext, {
8290
+ items,
8291
+ strategy: context.orientation === "horizontal" ? horizontalListSortingStrategy : verticalListSortingStrategy,
8292
+ children: /* @__PURE__ */ jsx(ColumnPrimitive, {
8293
+ id,
8294
+ "data-disabled": disabled,
8295
+ "data-dragging": isDragging ? "" : void 0,
8296
+ "data-slot": "kanban-column",
8297
+ ...columnProps,
8298
+ ...asHandle && !disabled ? attributes : {},
8299
+ ...asHandle && !disabled ? listeners : {},
8300
+ ref: composedRef,
8301
+ style: composedStyle,
8302
+ className: cn("flex size-full flex-col gap-2 rounded-lg border bg-zinc-100 p-2.5 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:bg-zinc-900", {
8303
+ "touch-none select-none": asHandle,
8304
+ "cursor-default": context.flatCursor,
8305
+ "data-dragging:cursor-grabbing": !context.flatCursor,
8306
+ "cursor-grab": !isDragging && asHandle && !context.flatCursor,
8307
+ "opacity-50": isDragging,
8308
+ "pointer-events-none opacity-50": disabled
8309
+ }, className)
8310
+ })
8311
+ })
8312
+ });
8313
+ }
8314
+ function KanbanColumnHandle(props) {
8315
+ const { asChild, disabled, className, ref,...columnHandleProps } = props;
8316
+ const context = useKanbanContext(COLUMN_NAME);
8317
+ const columnContext = useKanbanColumnContext(COLUMN_HANDLE_NAME);
8318
+ const isDisabled = disabled ?? columnContext.disabled;
8319
+ const composedRef = useComposedRefs(ref, (node) => {
8320
+ if (isDisabled) return;
8321
+ columnContext.setActivatorNodeRef(node);
8322
+ });
8323
+ const HandlePrimitive = asChild ? Slot : "button";
8324
+ return /* @__PURE__ */ jsx(HandlePrimitive, {
8325
+ type: "button",
8326
+ "aria-controls": columnContext.id,
8327
+ "data-disabled": isDisabled,
8328
+ "data-dragging": columnContext.isDragging ? "" : void 0,
8329
+ "data-slot": "kanban-column-handle",
8330
+ ...columnHandleProps,
8331
+ ...isDisabled ? {} : columnContext.attributes,
8332
+ ...isDisabled ? {} : columnContext.listeners,
8333
+ ref: composedRef,
8334
+ className: cn("select-none disabled:pointer-events-none disabled:opacity-50", context.flatCursor ? "cursor-default" : "cursor-grab data-dragging:cursor-grabbing", className),
8335
+ disabled: isDisabled
8336
+ });
8337
+ }
8338
+ const KanbanItemContext = React$11.createContext(null);
8339
+ function useKanbanItemContext(consumerName) {
8340
+ const context = React$11.useContext(KanbanItemContext);
8341
+ if (!context) throw new Error(`\`${consumerName}\` must be used within \`${ITEM_NAME}\``);
8342
+ return context;
8343
+ }
8344
+ function KanbanItem(props) {
8345
+ 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}\``);
8351
+ const { attributes, listeners, setNodeRef, setActivatorNodeRef, transform, transition, isDragging } = useSortable({
8352
+ id: value,
8353
+ disabled
8354
+ });
8355
+ if (value === "") throw new Error(`\`${ITEM_NAME}\` value cannot be an empty string`);
8356
+ const composedRef = useComposedRefs(ref, (node) => {
8357
+ if (disabled) return;
8358
+ setNodeRef(node);
8359
+ });
8360
+ const composedStyle = React$11.useMemo(() => {
8361
+ return {
8362
+ transform: CSS.Transform.toString(transform),
8363
+ transition,
8364
+ ...style
8365
+ };
8366
+ }, [
8367
+ transform,
8368
+ transition,
8369
+ style
8370
+ ]);
8371
+ const itemContext = React$11.useMemo(() => ({
8372
+ id,
8373
+ attributes,
8374
+ listeners,
8375
+ setActivatorNodeRef,
8376
+ isDragging,
8377
+ disabled
8378
+ }), [
8379
+ id,
8380
+ attributes,
8381
+ listeners,
8382
+ setActivatorNodeRef,
8383
+ isDragging,
8384
+ disabled
8385
+ ]);
8386
+ const ItemPrimitive = asChild ? Slot : "div";
8387
+ return /* @__PURE__ */ jsx(KanbanItemContext.Provider, {
8388
+ value: itemContext,
8389
+ children: /* @__PURE__ */ jsx(ItemPrimitive, {
8390
+ id,
8391
+ "data-disabled": disabled,
8392
+ "data-dragging": isDragging ? "" : void 0,
8393
+ "data-slot": "kanban-item",
8394
+ ...itemProps,
8395
+ ...asHandle && !disabled ? attributes : {},
8396
+ ...asHandle && !disabled ? listeners : {},
8397
+ ref: composedRef,
8398
+ style: composedStyle,
8399
+ className: cn("focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring focus-visible:ring-offset-1", {
8400
+ "touch-none select-none": asHandle,
8401
+ "cursor-default": context.flatCursor,
8402
+ "data-dragging:cursor-grabbing": !context.flatCursor,
8403
+ "cursor-grab": !isDragging && asHandle && !context.flatCursor,
8404
+ "opacity-50": isDragging,
8405
+ "pointer-events-none opacity-50": disabled
8406
+ }, className)
8407
+ })
8408
+ });
8409
+ }
8410
+ function KanbanItemHandle(props) {
8411
+ const { asChild, disabled, className, ref,...itemHandleProps } = props;
8412
+ const context = useKanbanContext(ITEM_HANDLE_NAME);
8413
+ const itemContext = useKanbanItemContext(ITEM_HANDLE_NAME);
8414
+ const isDisabled = disabled ?? itemContext.disabled;
8415
+ const composedRef = useComposedRefs(ref, (node) => {
8416
+ if (isDisabled) return;
8417
+ itemContext.setActivatorNodeRef(node);
8418
+ });
8419
+ const HandlePrimitive = asChild ? Slot : "button";
8420
+ return /* @__PURE__ */ jsx(HandlePrimitive, {
8421
+ type: "button",
8422
+ "aria-controls": itemContext.id,
8423
+ "data-disabled": isDisabled,
8424
+ "data-dragging": itemContext.isDragging ? "" : void 0,
8425
+ "data-slot": "kanban-item-handle",
8426
+ ...itemHandleProps,
8427
+ ...isDisabled ? {} : itemContext.attributes,
8428
+ ...isDisabled ? {} : itemContext.listeners,
8429
+ ref: composedRef,
8430
+ className: cn("select-none disabled:pointer-events-none disabled:opacity-50", context.flatCursor ? "cursor-default" : "cursor-grab data-dragging:cursor-grabbing", className),
8431
+ disabled: isDisabled
8432
+ });
8433
+ }
8434
+ const KanbanOverlayContext = React$11.createContext(false);
8435
+ const dropAnimation = { sideEffects: defaultDropAnimationSideEffects({ styles: { active: { opacity: "0.4" } } }) };
8436
+ function KanbanOverlay(props) {
8437
+ const { container: containerProp, children,...overlayProps } = props;
8438
+ const context = useKanbanContext(OVERLAY_NAME);
8439
+ const [mounted, setMounted] = React$11.useState(false);
8440
+ React$11.useLayoutEffect(() => setMounted(true), []);
8441
+ const container = containerProp ?? (mounted ? globalThis.document?.body : null);
8442
+ if (!container) return null;
8443
+ const variant = context.activeId && context.activeId in context.items ? "column" : "item";
8444
+ return ReactDOM.createPortal(/* @__PURE__ */ jsx(DragOverlay, {
8445
+ dropAnimation,
8446
+ modifiers: context.modifiers,
8447
+ className: cn(!context.flatCursor && "cursor-grabbing"),
8448
+ ...overlayProps,
8449
+ children: /* @__PURE__ */ jsx(KanbanOverlayContext.Provider, {
8450
+ value: true,
8451
+ children: context.activeId && children ? typeof children === "function" ? children({
8452
+ value: context.activeId,
8453
+ variant
8454
+ }) : children : null
8455
+ })
8456
+ }), container);
8457
+ }
8458
+
7848
8459
  //#endregion
7849
8460
  //#region src/input/deferred-input.tsx
7850
8461
  /**
@@ -7962,32 +8573,32 @@ const MenubarGroup = MenubarPrimitive.Group;
7962
8573
  const MenubarPortal = MenubarPrimitive.Portal;
7963
8574
  const MenubarSub = MenubarPrimitive.Sub;
7964
8575
  const MenubarRadioGroup = MenubarPrimitive.RadioGroup;
7965
- const Menubar = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Root, {
8576
+ const Menubar = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Root, {
7966
8577
  ref,
7967
8578
  className: cn("flex h-9 items-center space-x-1 rounded-md border bg-background p-1 shadow-sm", className),
7968
8579
  ...props
7969
8580
  }));
7970
8581
  Menubar.displayName = MenubarPrimitive.Root.displayName;
7971
- const MenubarTrigger = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Trigger, {
8582
+ const MenubarTrigger = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Trigger, {
7972
8583
  ref,
7973
8584
  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),
7974
8585
  ...props
7975
8586
  }));
7976
8587
  MenubarTrigger.displayName = MenubarPrimitive.Trigger.displayName;
7977
- const MenubarSubTrigger = React$9.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.SubTrigger, {
8588
+ const MenubarSubTrigger = React$10.forwardRef(({ className, inset, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.SubTrigger, {
7978
8589
  ref,
7979
8590
  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),
7980
8591
  ...props,
7981
8592
  children: [children, /* @__PURE__ */ jsx(ChevronRightIcon, { className: "ml-auto h-4 w-4" })]
7982
8593
  }));
7983
8594
  MenubarSubTrigger.displayName = MenubarPrimitive.SubTrigger.displayName;
7984
- const MenubarSubContent = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.SubContent, {
8595
+ const MenubarSubContent = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.SubContent, {
7985
8596
  ref,
7986
8597
  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),
7987
8598
  ...props
7988
8599
  }));
7989
8600
  MenubarSubContent.displayName = MenubarPrimitive.SubContent.displayName;
7990
- const MenubarContent = React$9.forwardRef(({ className, align = "start", alignOffset = -4, sideOffset = 8,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx(MenubarPrimitive.Content, {
8601
+ const MenubarContent = React$10.forwardRef(({ className, align = "start", alignOffset = -4, sideOffset = 8,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Portal, { children: /* @__PURE__ */ jsx(MenubarPrimitive.Content, {
7991
8602
  ref,
7992
8603
  align,
7993
8604
  alignOffset,
@@ -7996,13 +8607,13 @@ const MenubarContent = React$9.forwardRef(({ className, align = "start", alignOf
7996
8607
  ...props
7997
8608
  }) }));
7998
8609
  MenubarContent.displayName = MenubarPrimitive.Content.displayName;
7999
- const MenubarItem = React$9.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Item, {
8610
+ const MenubarItem = React$10.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Item, {
8000
8611
  ref,
8001
8612
  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),
8002
8613
  ...props
8003
8614
  }));
8004
8615
  MenubarItem.displayName = MenubarPrimitive.Item.displayName;
8005
- const MenubarCheckboxItem = React$9.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.CheckboxItem, {
8616
+ const MenubarCheckboxItem = React$10.forwardRef(({ className, children, checked,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.CheckboxItem, {
8006
8617
  ref,
8007
8618
  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),
8008
8619
  checked,
@@ -8013,7 +8624,7 @@ const MenubarCheckboxItem = React$9.forwardRef(({ className, children, checked,.
8013
8624
  }), children]
8014
8625
  }));
8015
8626
  MenubarCheckboxItem.displayName = MenubarPrimitive.CheckboxItem.displayName;
8016
- const MenubarRadioItem = React$9.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.RadioItem, {
8627
+ const MenubarRadioItem = React$10.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(MenubarPrimitive.RadioItem, {
8017
8628
  ref,
8018
8629
  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),
8019
8630
  ...props,
@@ -8023,13 +8634,13 @@ const MenubarRadioItem = React$9.forwardRef(({ className, children,...props }, r
8023
8634
  }), children]
8024
8635
  }));
8025
8636
  MenubarRadioItem.displayName = MenubarPrimitive.RadioItem.displayName;
8026
- const MenubarLabel = React$9.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Label, {
8637
+ const MenubarLabel = React$10.forwardRef(({ className, inset,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Label, {
8027
8638
  ref,
8028
8639
  className: cn("px-2 py-1.5 text-sm font-semibold", inset && "pl-8", className),
8029
8640
  ...props
8030
8641
  }));
8031
8642
  MenubarLabel.displayName = MenubarPrimitive.Label.displayName;
8032
- const MenubarSeparator = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Separator, {
8643
+ const MenubarSeparator = React$10.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(MenubarPrimitive.Separator, {
8033
8644
  ref,
8034
8645
  className: cn("-mx-1 my-1 h-px bg-muted", className),
8035
8646
  ...props
@@ -8166,13 +8777,13 @@ const Pagination = ({ className,...props }) => /* @__PURE__ */ jsx("nav", {
8166
8777
  ...props
8167
8778
  });
8168
8779
  Pagination.displayName = "Pagination";
8169
- const PaginationContent = React$8.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ul", {
8780
+ const PaginationContent = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("ul", {
8170
8781
  ref,
8171
8782
  className: cn("flex flex-row items-center gap-1", className),
8172
8783
  ...props
8173
8784
  }));
8174
8785
  PaginationContent.displayName = "PaginationContent";
8175
- const PaginationItem = React$8.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
8786
+ const PaginationItem = React$9.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx("li", {
8176
8787
  ref,
8177
8788
  className: cn("", className),
8178
8789
  ...props
@@ -8294,7 +8905,7 @@ const ResizableHandle = ({ withHandle, className,...props }) => /* @__PURE__ */
8294
8905
 
8295
8906
  //#endregion
8296
8907
  //#region src/scroll-area/scroll-area.tsx
8297
- const ScrollArea = React$7.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ScrollAreaPrimitive.Root, {
8908
+ const ScrollArea = React$8.forwardRef(({ className, children,...props }, ref) => /* @__PURE__ */ jsxs(ScrollAreaPrimitive.Root, {
8298
8909
  ref,
8299
8910
  className: cn("relative overflow-hidden", className),
8300
8911
  ...props,
@@ -8308,7 +8919,7 @@ const ScrollArea = React$7.forwardRef(({ className, children,...props }, ref) =>
8308
8919
  ]
8309
8920
  }));
8310
8921
  ScrollArea.displayName = ScrollAreaPrimitive.Root.displayName;
8311
- const ScrollBar = React$7.forwardRef(({ className, orientation = "vertical",...props }, ref) => /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, {
8922
+ const ScrollBar = React$8.forwardRef(({ className, orientation = "vertical",...props }, ref) => /* @__PURE__ */ jsx(ScrollAreaPrimitive.ScrollAreaScrollbar, {
8312
8923
  ref,
8313
8924
  orientation,
8314
8925
  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),
@@ -8323,7 +8934,7 @@ const Sheet = SheetPrimitive.Root;
8323
8934
  const SheetTrigger = SheetPrimitive.Trigger;
8324
8935
  const SheetClose = SheetPrimitive.Close;
8325
8936
  const SheetPortal = SheetPrimitive.Portal;
8326
- const SheetOverlay = React$6.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Overlay, {
8937
+ const SheetOverlay = React$7.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Overlay, {
8327
8938
  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),
8328
8939
  ...props,
8329
8940
  ref
@@ -8338,7 +8949,7 @@ const sheetVariants = cva("fixed z-50 gap-4 bg-background p-6 shadow-lg transiti
8338
8949
  } },
8339
8950
  defaultVariants: { side: "right" }
8340
8951
  });
8341
- const SheetContent = React$6.forwardRef(({ side = "right", className, children, __e2e_test_id__,...props }, ref) => /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsxs(SheetPrimitive.Content, {
8952
+ 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, {
8342
8953
  ref,
8343
8954
  className: cn(sheetVariants({ side }), className),
8344
8955
  "data-test-id": __e2e_test_id__,
@@ -8363,13 +8974,13 @@ const SheetFooter = ({ className,...props }) => /* @__PURE__ */ jsx("div", {
8363
8974
  ...props
8364
8975
  });
8365
8976
  SheetFooter.displayName = "SheetFooter";
8366
- const SheetTitle = React$6.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Title, {
8977
+ const SheetTitle = React$7.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Title, {
8367
8978
  ref,
8368
8979
  className: cn("text-lg font-semibold text-foreground", className),
8369
8980
  ...props
8370
8981
  }));
8371
8982
  SheetTitle.displayName = SheetPrimitive.Title.displayName;
8372
- const SheetDescription = React$6.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Description, {
8983
+ const SheetDescription = React$7.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SheetPrimitive.Description, {
8373
8984
  ref,
8374
8985
  className: cn("text-sm text-muted-foreground", className),
8375
8986
  ...props
@@ -8384,32 +8995,32 @@ const SIDEBAR_WIDTH_ICON = "3rem";
8384
8995
  const SIDEBAR_KEYBOARD_SHORTCUT = "b";
8385
8996
  const SIDEBAR_MIN_WIDTH = 200;
8386
8997
  const SIDEBAR_MAX_WIDTH = 600;
8387
- const SidebarContext = React$5.createContext(null);
8388
- const SidebarResizeContext = React$5.createContext(null);
8998
+ const SidebarContext = React$6.createContext(null);
8999
+ const SidebarResizeContext = React$6.createContext(null);
8389
9000
  function useSidebar() {
8390
- const context = React$5.useContext(SidebarContext);
9001
+ const context = React$6.useContext(SidebarContext);
8391
9002
  if (!context) throw new Error("useSidebar must be used within a SidebarProvider.");
8392
9003
  return context;
8393
9004
  }
8394
9005
  function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: setOpenProp, width: widthProp, onWidthChange, minWidth = SIDEBAR_MIN_WIDTH, maxWidth = SIDEBAR_MAX_WIDTH, className, style, children,...props }) {
8395
9006
  const isMobile = useIsMobile();
8396
- const [openMobile, setOpenMobile] = React$5.useState(false);
8397
- const [isResizing, setIsResizing] = React$5.useState(false);
8398
- const [_open, _setOpen] = React$5.useState(defaultOpen);
9007
+ const [openMobile, setOpenMobile] = React$6.useState(false);
9008
+ const [isResizing, setIsResizing] = React$6.useState(false);
9009
+ const [_open, _setOpen] = React$6.useState(defaultOpen);
8399
9010
  const open = openProp ?? _open;
8400
- const setOpen = React$5.useCallback((value) => {
9011
+ const setOpen = React$6.useCallback((value) => {
8401
9012
  const openState = typeof value === "function" ? value(open) : value;
8402
9013
  if (setOpenProp) setOpenProp(openState);
8403
9014
  else _setOpen(openState);
8404
9015
  }, [setOpenProp, open]);
8405
- const toggleSidebar = React$5.useCallback(() => {
9016
+ const toggleSidebar = React$6.useCallback(() => {
8406
9017
  return isMobile ? setOpenMobile((open$1) => !open$1) : setOpen((open$1) => !open$1);
8407
9018
  }, [
8408
9019
  isMobile,
8409
9020
  setOpen,
8410
9021
  setOpenMobile
8411
9022
  ]);
8412
- React$5.useEffect(() => {
9023
+ React$6.useEffect(() => {
8413
9024
  const handleKeyDown = (event) => {
8414
9025
  if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
8415
9026
  event.preventDefault();
@@ -8420,7 +9031,7 @@ function SidebarProvider({ defaultOpen = true, open: openProp, onOpenChange: set
8420
9031
  return () => globalThis.removeEventListener("keydown", handleKeyDown);
8421
9032
  }, [toggleSidebar]);
8422
9033
  const state = open ? "expanded" : "collapsed";
8423
- const contextValue = React$5.useMemo(() => ({
9034
+ const contextValue = React$6.useMemo(() => ({
8424
9035
  state,
8425
9036
  open,
8426
9037
  setOpen,
@@ -8548,11 +9159,11 @@ function SidebarTrigger({ className, onClick,...props }) {
8548
9159
  }
8549
9160
  function SidebarRail({ className,...props }) {
8550
9161
  const { toggleSidebar } = useSidebar();
8551
- const resizeCtx = React$5.useContext(SidebarResizeContext);
8552
- const startXRef = React$5.useRef(0);
8553
- const hasDraggedRef = React$5.useRef(false);
9162
+ const resizeCtx = React$6.useContext(SidebarResizeContext);
9163
+ const startXRef = React$6.useRef(0);
9164
+ const hasDraggedRef = React$6.useRef(false);
8554
9165
  const isResizable = !!resizeCtx?.onWidthChange;
8555
- const handleMouseDown = React$5.useCallback((e) => {
9166
+ const handleMouseDown = React$6.useCallback((e) => {
8556
9167
  if (!isResizable || !resizeCtx) return;
8557
9168
  e.preventDefault();
8558
9169
  startXRef.current = e.clientX;
@@ -8582,7 +9193,7 @@ function SidebarRail({ className,...props }) {
8582
9193
  document.body.style.cursor = "col-resize";
8583
9194
  document.body.style.userSelect = "none";
8584
9195
  }, [isResizable, resizeCtx]);
8585
- const handleClick = React$5.useCallback(() => {
9196
+ const handleClick = React$6.useCallback(() => {
8586
9197
  if (hasDraggedRef.current) return;
8587
9198
  toggleSidebar();
8588
9199
  }, [toggleSidebar]);
@@ -9099,7 +9710,7 @@ const knobVariants = cva("bg-background block size-4 shrink-0 rounded-full borde
9099
9710
  defaultVariants: { knobVariant: "default" }
9100
9711
  });
9101
9712
  function Slider({ className, defaultValue, value, min = 0, max = 100, sliderVariant, knobVariant, knobSize,...props }) {
9102
- const _values = React$4.useMemo(() => {
9713
+ const _values = React$5.useMemo(() => {
9103
9714
  if (Array.isArray(value)) return value;
9104
9715
  else if (Array.isArray(defaultValue)) return defaultValue;
9105
9716
  return [min, max];
@@ -9134,7 +9745,7 @@ function Slider({ className, defaultValue, value, min = 0, max = 100, sliderVari
9134
9745
 
9135
9746
  //#endregion
9136
9747
  //#region src/switch/switch.tsx
9137
- const Switch = React$3.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SwitchPrimitives.Root, {
9748
+ const Switch = React$4.forwardRef(({ className,...props }, ref) => /* @__PURE__ */ jsx(SwitchPrimitives.Root, {
9138
9749
  className: cn("peer inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent shadow-sm transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input", className),
9139
9750
  ...props,
9140
9751
  ref,
@@ -9258,7 +9869,7 @@ const toggleVariants = cva("inline-flex items-center justify-center rounded-md t
9258
9869
  size: "default"
9259
9870
  }
9260
9871
  });
9261
- const Toggle = React$2.forwardRef(({ className, variant, size,...props }, ref) => /* @__PURE__ */ jsx(TogglePrimitive.Root, {
9872
+ const Toggle = React$3.forwardRef(({ className, variant, size,...props }, ref) => /* @__PURE__ */ jsx(TogglePrimitive.Root, {
9262
9873
  ref,
9263
9874
  className: cn(toggleVariants({
9264
9875
  variant,
@@ -9271,11 +9882,11 @@ Toggle.displayName = TogglePrimitive.Root.displayName;
9271
9882
 
9272
9883
  //#endregion
9273
9884
  //#region src/toggle-group/toggle-group.tsx
9274
- const ToggleGroupContext = React$1.createContext({
9885
+ const ToggleGroupContext = React$2.createContext({
9275
9886
  size: "default",
9276
9887
  variant: "default"
9277
9888
  });
9278
- const ToggleGroup = React$1.forwardRef(({ className, variant, size, children,...props }, ref) => {
9889
+ const ToggleGroup = React$2.forwardRef(({ className, variant, size, children,...props }, ref) => {
9279
9890
  const memoizedValue = useMemo(() => ({
9280
9891
  variant,
9281
9892
  size
@@ -9291,8 +9902,8 @@ const ToggleGroup = React$1.forwardRef(({ className, variant, size, children,...
9291
9902
  });
9292
9903
  });
9293
9904
  ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
9294
- const ToggleGroupItem = React$1.forwardRef(({ className, children, variant, size,...props }, ref) => {
9295
- const context = React$1.useContext(ToggleGroupContext);
9905
+ const ToggleGroupItem = React$2.forwardRef(({ className, children, variant, size,...props }, ref) => {
9906
+ const context = React$2.useContext(ToggleGroupContext);
9296
9907
  return /* @__PURE__ */ jsx(ToggleGroupPrimitive.Item, {
9297
9908
  ref,
9298
9909
  className: cn(toggleVariants({
@@ -9306,5 +9917,115 @@ const ToggleGroupItem = React$1.forwardRef(({ className, children, variant, size
9306
9917
  ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
9307
9918
 
9308
9919
  //#endregion
9309
- export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, Avatar, AvatarFallback, AvatarImage, Badge, 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, 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, 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, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ReactNodeCell, ResizableHandle, ResizablePanel, ResizablePanelGroup, 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, 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 };
9920
+ //#region src/tree-view/tree-view.tsx
9921
+ const TreeBranch = ({ node, level, onNodeSelect, onGroupSelect, onToggleGroup, isLast = false, parentIsLast = [], defaultExpandedIds = [], selectedId }) => {
9922
+ const isGroup = node.type === "group";
9923
+ const hasChildren = node.children && node.children.length > 0;
9924
+ if (!isGroup) return /* @__PURE__ */ jsxs("div", {
9925
+ "data-test-id": `tree-node-${node.id}`,
9926
+ className: cn("relative flex items-center gap-2 py-1.5 px-2 rounded-md cursor-pointer hover:bg-accent hover:text-accent-foreground transition-colors border border-transparent hover:border hover:border-(--discreet-border)", { "bg-primary text-primary-foreground hover:border hover:border-(--discreet-border)": selectedId === node.id }),
9927
+ style: { marginLeft: `${level * 24}px` },
9928
+ onClick: () => onNodeSelect?.(node),
9929
+ children: [
9930
+ node.icon,
9931
+ /* @__PURE__ */ jsx("span", {
9932
+ className: "text-sm select-none truncate",
9933
+ children: node.name
9934
+ }),
9935
+ node.trailing
9936
+ ]
9937
+ });
9938
+ return /* @__PURE__ */ jsxs(AccordionItem, {
9939
+ value: node.id,
9940
+ className: "border-0",
9941
+ "data-test-id": `tree-group-${node.id}`,
9942
+ children: [/* @__PURE__ */ jsxs(AccordionTrigger, {
9943
+ style: { "--margin-left": `calc(${level * 24 + 16}px - 16px)` },
9944
+ className: cn("flex flex-1 overflow-hidden items-center gap-2 py-1.5 px-2 rounded-md ml-(--margin-left) hover:bg-accent hover:text-accent-foreground hover:no-underline transition-colors border border-transparent hover:border hover:border-(--discreet-border)", "[&>svg:last-child]:hidden", { "bg-primary text-primary-foreground": selectedId === node.id }),
9945
+ children: [
9946
+ /* @__PURE__ */ jsx(PlusIcon, {
9947
+ "data-test-id": `tree-expand-${node.id}`,
9948
+ className: "size-4 shrink-0 hidden [[data-state=closed]>&]:block hover:border rounded",
9949
+ onClick: () => {
9950
+ onToggleGroup?.({
9951
+ isExpanded: true,
9952
+ node
9953
+ });
9954
+ }
9955
+ }),
9956
+ /* @__PURE__ */ jsx(MinusIcon, {
9957
+ "data-test-id": `tree-collapse-${node.id}`,
9958
+ className: "size-4 shrink-0 hidden [[data-state=open]>&]:block hover:border rounded",
9959
+ onClick: () => {
9960
+ onToggleGroup?.({
9961
+ isExpanded: false,
9962
+ node
9963
+ });
9964
+ }
9965
+ }),
9966
+ /* @__PURE__ */ jsxs("div", {
9967
+ "data-test-id": `tree-group-label-${node.id}`,
9968
+ className: "flex w-[calc(100%-16px)] gap-2",
9969
+ onClick: (e) => {
9970
+ e.stopPropagation();
9971
+ onGroupSelect?.(node);
9972
+ },
9973
+ children: [
9974
+ node.icon,
9975
+ /* @__PURE__ */ jsx("span", {
9976
+ className: "text-sm select-none truncate text-left",
9977
+ children: node.name
9978
+ }),
9979
+ node.trailing
9980
+ ]
9981
+ })
9982
+ ]
9983
+ }), hasChildren && /* @__PURE__ */ jsxs(AccordionContent, {
9984
+ className: "pb-0 pt-0 relative",
9985
+ children: [/* @__PURE__ */ jsx("div", {
9986
+ style: { "--left-offset": `calc(${level * 24 + 32}px - 16px)` },
9987
+ className: "before:absolute before:top-0 before:start-(--left-offset) before:w-0.5 before:-ms-px before:h-full before:bg-sidebar-ring dark:before:bg-sidebar-ring"
9988
+ }), /* @__PURE__ */ jsx(Accordion, {
9989
+ type: "multiple",
9990
+ value: defaultExpandedIds,
9991
+ children: node.children?.map((child, index) => /* @__PURE__ */ jsx(TreeBranch, {
9992
+ node: child,
9993
+ level: level + 1,
9994
+ onNodeSelect,
9995
+ onGroupSelect,
9996
+ onToggleGroup,
9997
+ isLast: index === node.children.length - 1,
9998
+ parentIsLast: [...parentIsLast, isLast],
9999
+ defaultExpandedIds,
10000
+ selectedId
10001
+ }, child.id))
10002
+ })]
10003
+ })]
10004
+ });
10005
+ };
10006
+ const TreeView = React$1.forwardRef(({ data, onNodeSelect, onGroupSelect, onToggleGroup, className, defaultExpandedIds = [], selectedId }, ref) => {
10007
+ return /* @__PURE__ */ jsx("div", {
10008
+ ref,
10009
+ className: cn("w-full select-none", className),
10010
+ children: /* @__PURE__ */ jsx(Accordion, {
10011
+ type: "multiple",
10012
+ value: defaultExpandedIds,
10013
+ children: data.map((node, index) => /* @__PURE__ */ jsx(TreeBranch, {
10014
+ node,
10015
+ level: 0,
10016
+ onNodeSelect,
10017
+ onGroupSelect,
10018
+ onToggleGroup,
10019
+ isLast: index === data.length - 1,
10020
+ parentIsLast: [],
10021
+ defaultExpandedIds,
10022
+ selectedId
10023
+ }, node.id))
10024
+ })
10025
+ });
10026
+ });
10027
+ TreeView.displayName = "TreeView";
10028
+
10029
+ //#endregion
10030
+ 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 };
9310
10031
  //# sourceMappingURL=index.js.map