@mlw-packages/react-components 1.5.8 → 1.6.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -485,6 +485,7 @@ var require_colors2 = __commonJS({
485
485
  // src/index.ts
486
486
  var index_exports = {};
487
487
  __export(index_exports, {
488
+ AddButton: () => AddButton,
488
489
  AlertDialogActionBase: () => AlertDialogActionBase,
489
490
  AlertDialogBase: () => AlertDialogBase,
490
491
  AlertDialogCancelBase: () => AlertDialogCancelBase,
@@ -499,6 +500,7 @@ __export(index_exports, {
499
500
  AvatarBase: () => AvatarBase,
500
501
  AvatarFallbackBase: () => AvatarFallbackBase,
501
502
  AvatarImageBase: () => AvatarImageBase,
503
+ BackButton: () => BackButton,
502
504
  BadgeBase: () => BadgeBase,
503
505
  BarChart: () => BarChart_default,
504
506
  BreadcrumbBase: () => BreadcrumbBase,
@@ -523,8 +525,10 @@ __export(index_exports, {
523
525
  CarouselNextBase: () => CarouselNextBase,
524
526
  CarouselPrevious: () => CarouselPrevious,
525
527
  Chart: () => Chart_default,
528
+ CheckButton: () => CheckButton,
526
529
  CheckboxBase: () => CheckboxBase,
527
530
  CloseAllButton: () => CloseAllButton_default,
531
+ CloseButton: () => CloseButton,
528
532
  CollapsibleBase: () => CollapsibleBase,
529
533
  CollapsibleContentBase: () => CollapsibleContentBase,
530
534
  CollapsibleTriggerBase: () => CollapsibleTriggerBase,
@@ -553,7 +557,9 @@ __export(index_exports, {
553
557
  ContextMenuSubContentBase: () => ContextMenuSubContentBase,
554
558
  ContextMenuSubTriggerBase: () => ContextMenuSubTriggerBase,
555
559
  ContextMenuTriggerBase: () => ContextMenuTriggerBase,
560
+ CopyButton: () => CopyButton,
556
561
  DateTimePicker: () => DateTimePicker,
562
+ DeleteButton: () => DeleteButton,
557
563
  DestructiveDialog: () => DestructiveDialog,
558
564
  DialogBase: () => DialogBase,
559
565
  DialogCloseBase: () => DialogCloseBase,
@@ -565,6 +571,7 @@ __export(index_exports, {
565
571
  DialogPortalBase: () => DialogPortalBase,
566
572
  DialogTitleBase: () => DialogTitleBase,
567
573
  DialogTriggerBase: () => DialogTriggerBase,
574
+ DownloadButton: () => DownloadButton,
568
575
  DraggableTooltip: () => DraggableTooltip_default,
569
576
  DrawerBase: () => DrawerBase,
570
577
  DrawerCloseBase: () => DrawerCloseBase,
@@ -591,6 +598,11 @@ __export(index_exports, {
591
598
  DropDownMenuSubContentBase: () => DropDownMenuSubContentBase,
592
599
  DropDownMenuSubTriggerBase: () => DropDownMenuSubTriggerBase,
593
600
  DropDownMenuTriggerBase: () => DropDownMenuTriggerBase,
601
+ EditButton: () => EditButton,
602
+ FavoriteButton: () => FavoriteButton,
603
+ FileUploader: () => FileUploader,
604
+ FilterButton: () => FilterButton,
605
+ HideButton: () => HideButton,
594
606
  Highlights: () => Highlights_default,
595
607
  HoverCardBase: () => HoverCardBase,
596
608
  HoverCardContentBase: () => HoverCardContentBase,
@@ -601,9 +613,12 @@ __export(index_exports, {
601
613
  InputOTPSeparatorBase: () => InputOTPSeparatorBase,
602
614
  InputOTPSlotBase: () => InputOTPSlotBase,
603
615
  LabelBase: () => LabelBase_default,
616
+ LikeButton: () => LikeButton,
604
617
  LineChart: () => LineChart_default,
605
618
  LoadingBase: () => LoadingBase,
619
+ LockButton: () => LockButton,
606
620
  ModeToggleBase: () => ModeToggleBase,
621
+ MoreButton: () => MoreButton,
607
622
  MultiCombobox: () => MultiCombobox,
608
623
  NavigationMenuBase: () => NavigationMenuBase,
609
624
  NavigationMenuContentBase: () => NavigationMenuContentBase,
@@ -613,6 +628,7 @@ __export(index_exports, {
613
628
  NavigationMenuListBase: () => NavigationMenuListBase,
614
629
  NavigationMenuTriggerBase: () => NavigationMenuTriggerBase,
615
630
  NavigationMenuViewportBase: () => NavigationMenuViewportBase,
631
+ NotificationButton: () => NotificationButton,
616
632
  PeriodsDropdown: () => PeriodsDropdown_default,
617
633
  PieChart: () => PieChart_default,
618
634
  PopoverAnchorBase: () => PopoverAnchorBase,
@@ -623,8 +639,11 @@ __export(index_exports, {
623
639
  ProgressCirclesBase: () => ProgressCirclesBase,
624
640
  ProgressPanelsBase: () => ProgressPanelsBase,
625
641
  ProgressSegmentsBase: () => ProgressSegmentsBase,
642
+ RefreshButton: () => RefreshButton,
643
+ SaveButton: () => SaveButton,
626
644
  ScrollAreaBase: () => ScrollAreaBase,
627
645
  ScrollBarBase: () => ScrollBarBase,
646
+ SearchButton: () => SearchButton,
628
647
  Select: () => Select,
629
648
  SelectBase: () => SelectBase,
630
649
  SelectContentBase: () => SelectContentBase,
@@ -637,6 +656,7 @@ __export(index_exports, {
637
656
  SelectTriggerBase: () => SelectTriggerBase,
638
657
  SelectValueBase: () => SelectValueBase,
639
658
  SeparatorBase: () => SeparatorBase,
659
+ SettingsButton: () => SettingsButton,
640
660
  SheetBase: () => SheetBase,
641
661
  SheetCloseBase: () => SheetCloseBase,
642
662
  SheetContentBase: () => SheetContentBase,
@@ -697,7 +717,11 @@ __export(index_exports, {
697
717
  TooltipSimple: () => TooltipSimple_default,
698
718
  TooltipTriggerBase: () => TooltipTriggerBase,
699
719
  TooltipWithTotal: () => TooltipWithTotal_default,
720
+ UnlockButton: () => UnlockButton,
721
+ UploadButton: () => UploadButton,
700
722
  UseSideBarBase: () => UseSideBarBase,
723
+ ViewButton: () => ViewButton,
724
+ VisibilityButton: () => VisibilityButton,
701
725
  badgeVariants: () => badgeVariants,
702
726
  buttonVariantsBase: () => buttonVariantsBase,
703
727
  compactTick: () => compactTick,
@@ -734,22 +758,24 @@ var import_react_slot = require("@radix-ui/react-slot");
734
758
  var import_class_variance_authority = require("class-variance-authority");
735
759
  var import_jsx_runtime = require("react/jsx-runtime");
736
760
  var buttonVariantsBase = (0, import_class_variance_authority.cva)(
737
- "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive",
761
+ "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*='size-'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive active:scale-95",
738
762
  {
739
763
  variants: {
740
764
  variant: {
741
765
  default: "bg-primary text-primary-foreground shadow-xs hover:bg-primary/90",
742
766
  destructive: "bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40",
743
- outline: "bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50",
767
+ outline: "border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-background dark:border-input dark:hover:bg-background/95",
768
+ select: "box-border border border-input bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-background dark:hover:bg-background/95",
744
769
  secondary: "bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80",
745
770
  ghost: "hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50",
746
771
  link: "text-primary underline-offset-4 hover:underline"
747
772
  },
748
773
  size: {
749
- default: " px-4 py-2 has-[>svg]:px-3",
774
+ default: "h-9 py-2 px-4 has-[>svg]:px-3",
750
775
  sm: "h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5",
751
776
  lg: "h-10 rounded-md px-6 has-[>svg]:px-4",
752
- icon: "size-9"
777
+ icon: "size-9",
778
+ select: "h-[34px] py-[7px] px-4 has-[>svg]:px-3"
753
779
  }
754
780
  },
755
781
  defaultVariants: {
@@ -759,7 +785,14 @@ var buttonVariantsBase = (0, import_class_variance_authority.cva)(
759
785
  }
760
786
  );
761
787
  var ButtonBase = React.forwardRef(
762
- ({ className, variant, size, asChild = false, testid = `button-${variant ?? "default"}`, ...props }, ref) => {
788
+ ({
789
+ className,
790
+ variant,
791
+ size,
792
+ asChild = false,
793
+ testid = `button-${variant ?? "default"}`,
794
+ ...props
795
+ }, ref) => {
763
796
  const Comp = asChild ? import_react_slot.Slot : "button";
764
797
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
765
798
  Comp,
@@ -2372,7 +2405,7 @@ var InputBase = React12.forwardRef(
2372
2405
  "div",
2373
2406
  {
2374
2407
  className: cn(
2375
- "flex items-center rounded-md transition focus-within:ring-1 focus-within:ring-ring focus-within:border-ring bg-background overflow-hidden",
2408
+ "flex items-center rounded-md transition h-9 focus-within:ring-1 focus-within:ring-ring focus-within:border-ring bg-background overflow-hidden",
2376
2409
  type !== "file" && "border border-input"
2377
2410
  ),
2378
2411
  children: [
@@ -2382,7 +2415,7 @@ var InputBase = React12.forwardRef(
2382
2415
  {
2383
2416
  type,
2384
2417
  className: cn(
2385
- "w-full flex-1 text-sm py-2 px-3 focus:outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 bg-background text-foreground",
2418
+ "w-full flex-1 text-sm p-1.5 px-3 focus:outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 bg-background text-foreground",
2386
2419
  className
2387
2420
  ),
2388
2421
  ref,
@@ -2428,6 +2461,7 @@ PopoverContentBase.displayName = PopoverPrimitive.Content.displayName;
2428
2461
  // src/components/selects/ComboboxBase.tsx
2429
2462
  var import_react10 = require("@phosphor-icons/react");
2430
2463
  var import_react11 = require("react");
2464
+ var import_framer_motion4 = require("framer-motion");
2431
2465
  var import_jsx_runtime19 = require("react/jsx-runtime");
2432
2466
  function ComboboxBase({
2433
2467
  items,
@@ -2453,17 +2487,25 @@ function ComboboxBase({
2453
2487
  children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
2454
2488
  ButtonBase,
2455
2489
  {
2456
- variant: "outline",
2490
+ variant: "select",
2491
+ size: "select",
2457
2492
  role: "combobox",
2458
2493
  "aria-expanded": open,
2459
2494
  className: cn(
2460
- "flex items-start gap-2 justify-between h-full border border-input",
2495
+ "flex items-center gap-2 justify-between h-auto [&>div]:line-clamp-1 [&>span]:line-clamp-1",
2461
2496
  errorMessage && "border-red-500"
2462
2497
  ),
2463
2498
  "data-testid": testIds.trigger ?? "combobox-trigger",
2464
2499
  children: [
2465
2500
  renderSelected,
2466
- /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react10.CaretDownIcon, { size: 16, className: "mt-0.5" })
2501
+ /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
2502
+ import_framer_motion4.motion.div,
2503
+ {
2504
+ animate: { rotate: open ? 180 : 0 },
2505
+ transition: { duration: 0.3 },
2506
+ children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_react10.CaretDownIcon, { size: 16, className: "mt-0.5 flex-shrink-0" })
2507
+ }
2508
+ )
2467
2509
  ]
2468
2510
  }
2469
2511
  )
@@ -2505,13 +2547,25 @@ function ComboboxBase({
2505
2547
  children: [
2506
2548
  item.label,
2507
2549
  /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
2508
- import_react10.CheckIcon,
2550
+ import_framer_motion4.motion.div,
2509
2551
  {
2510
- className: cn(
2511
- "ml-auto",
2512
- isSelected ? "opacity-100" : "opacity-0"
2513
- ),
2514
- "data-testid": isSelected ? testIds.check ?? "combobox-option-check" : void 0
2552
+ initial: { scale: 0 },
2553
+ animate: { scale: isSelected ? 1 : 0 },
2554
+ transition: {
2555
+ type: "spring",
2556
+ stiffness: 500,
2557
+ damping: 30
2558
+ },
2559
+ children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
2560
+ import_react10.CheckIcon,
2561
+ {
2562
+ className: cn(
2563
+ "ml-auto",
2564
+ isSelected ? "opacity-100" : "opacity-0"
2565
+ ),
2566
+ "data-testid": isSelected ? testIds.check ?? "combobox-option-check" : void 0
2567
+ }
2568
+ )
2515
2569
  }
2516
2570
  )
2517
2571
  ]
@@ -2583,6 +2637,7 @@ function Combobox({
2583
2637
  // src/components/selects/MultiCombobox.tsx
2584
2638
  var import_react13 = require("react");
2585
2639
  var import_react14 = require("@phosphor-icons/react");
2640
+ var import_framer_motion5 = require("framer-motion");
2586
2641
  var import_jsx_runtime21 = require("react/jsx-runtime");
2587
2642
  function MultiCombobox({
2588
2643
  items,
@@ -2617,7 +2672,7 @@ function MultiCombobox({
2617
2672
  "span",
2618
2673
  {
2619
2674
  "data-testid": testIds.emptyPlaceholder ?? "combobox-selected-empty",
2620
- className: "text-gray-500",
2675
+ className: "text-gray-500 truncate",
2621
2676
  children: placeholder ?? "Selecione uma op\xE7\xE3o..."
2622
2677
  }
2623
2678
  );
@@ -2626,16 +2681,25 @@ function MultiCombobox({
2626
2681
  "div",
2627
2682
  {
2628
2683
  "data-testid": testIds.selectedWrapper ?? "combobox-selected-wrapper",
2629
- className: "flex w-full flex-wrap gap-2",
2630
- children: selectedItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
2631
- "div",
2684
+ className: "flex w-full flex-wrap gap-2 overflow-hidden pr-1.5",
2685
+ children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_framer_motion5.AnimatePresence, { mode: "popLayout", children: selectedItems.map((item) => /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
2686
+ import_framer_motion5.motion.div,
2632
2687
  {
2633
- className: "flex items-center gap-1 rounded-md border p-1",
2688
+ layout: true,
2689
+ initial: { scale: 0, opacity: 0 },
2690
+ animate: { scale: 1, opacity: 1 },
2691
+ exit: { scale: 0, opacity: 0 },
2692
+ transition: {
2693
+ type: "spring",
2694
+ stiffness: 500,
2695
+ damping: 30
2696
+ },
2697
+ className: "flex items-center justify-between gap-2 my-1 rounded-md border p-1 max-w-full",
2634
2698
  "data-testid": testIds.selectedItem?.(item.value) ?? `combobox-selected-${item.value}`,
2635
2699
  children: [
2636
- /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "whitespace-break-spaces text-xs", children: item.label }),
2700
+ /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "text-xs truncate", children: item.label }),
2637
2701
  /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
2638
- "span",
2702
+ import_framer_motion5.motion.span,
2639
2703
  {
2640
2704
  role: "button",
2641
2705
  tabIndex: 0,
@@ -2643,14 +2707,16 @@ function MultiCombobox({
2643
2707
  e.stopPropagation();
2644
2708
  handleSelection(item.value);
2645
2709
  },
2646
- className: "cursor-pointer p-0 m-0 text-xs flex items-center justify-center hover:text-red-500 hover:scale-110 transition-all",
2710
+ whileHover: { scale: 1.1 },
2711
+ whileTap: { scale: 0.95 },
2712
+ className: "cursor-pointer p-0.5 text-xs flex items-center justify-center hover:text-red-500 transition-colors flex-shrink-0 rounded hover:bg-red-50 ",
2647
2713
  children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_react14.XIcon, { size: 14 })
2648
2714
  }
2649
2715
  )
2650
2716
  ]
2651
2717
  },
2652
2718
  item.value
2653
- ))
2719
+ )) })
2654
2720
  }
2655
2721
  );
2656
2722
  }, [handleSelection, placeholder, selectedItems, testIds]);
@@ -3128,34 +3194,78 @@ function NavigationMenuIndicatorBase({
3128
3194
  var React17 = __toESM(require("react"));
3129
3195
  var ProgressPrimitive = __toESM(require("@radix-ui/react-progress"));
3130
3196
  var import_jsx_runtime28 = require("react/jsx-runtime");
3131
- var ProgressBase = React17.forwardRef(({ className, value, label, leftIcon, rightIcon, ...props }, ref) => {
3132
- return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
3133
- label && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(LabelBase_default, { className: "py-2", children: label }),
3134
- /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2", children: [
3135
- leftIcon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex items-center justify-center", children: leftIcon }),
3136
- /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3137
- ProgressPrimitive.Root,
3138
- {
3139
- ref,
3140
- className: cn(
3141
- "relative h-3 w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-800 shadow-inner transition-all",
3142
- className
3143
- ),
3144
- value,
3145
- ...props,
3146
- children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3147
- ProgressPrimitive.Indicator,
3148
- {
3149
- className: "h-full w-full flex-1 bg-primary transition-all duration-500 ease-in-out",
3150
- style: { transform: `translateX(-${100 - (value || 0)}%)` }
3151
- }
3152
- )
3153
- }
3154
- ),
3155
- rightIcon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex items-center justify-center", children: rightIcon })
3156
- ] })
3157
- ] });
3158
- });
3197
+ var ProgressBase = React17.forwardRef(
3198
+ ({
3199
+ className,
3200
+ value,
3201
+ label,
3202
+ leftIcon,
3203
+ rightIcon,
3204
+ variant = "bar",
3205
+ segments = 5,
3206
+ steps = [],
3207
+ currentStep = 0,
3208
+ ...props
3209
+ }, ref) => {
3210
+ switch (variant) {
3211
+ case "segments":
3212
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3213
+ ProgressSegmentsBase,
3214
+ {
3215
+ label,
3216
+ segments,
3217
+ value: value || 0
3218
+ }
3219
+ );
3220
+ case "panels":
3221
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3222
+ ProgressPanelsBase,
3223
+ {
3224
+ label,
3225
+ steps,
3226
+ currentStep
3227
+ }
3228
+ );
3229
+ case "circles":
3230
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3231
+ ProgressCirclesBase,
3232
+ {
3233
+ label,
3234
+ steps,
3235
+ currentStep
3236
+ }
3237
+ );
3238
+ case "bar":
3239
+ default:
3240
+ return /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex flex-col gap-1 w-full min-w-[150px]", children: [
3241
+ label && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(LabelBase_default, { className: "py-2", children: label }),
3242
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "flex items-center gap-2", children: [
3243
+ leftIcon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex items-center justify-center", children: leftIcon }),
3244
+ /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3245
+ ProgressPrimitive.Root,
3246
+ {
3247
+ ref,
3248
+ className: cn(
3249
+ "relative h-3 w-full overflow-hidden rounded-full bg-zinc-200 dark:bg-zinc-800 shadow-inner transition-all",
3250
+ className
3251
+ ),
3252
+ value,
3253
+ ...props,
3254
+ children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
3255
+ ProgressPrimitive.Indicator,
3256
+ {
3257
+ className: "h-full w-full flex-1 bg-primary transition-all duration-500 ease-in-out",
3258
+ style: { transform: `translateX(-${100 - (value || 0)}%)` }
3259
+ }
3260
+ )
3261
+ }
3262
+ ),
3263
+ rightIcon && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("div", { className: "flex items-center justify-center", children: rightIcon })
3264
+ ] })
3265
+ ] });
3266
+ }
3267
+ }
3268
+ );
3159
3269
  ProgressBase.displayName = "ProgressBase";
3160
3270
  var ProgressSegmentsBase = ({
3161
3271
  label,
@@ -3306,7 +3416,7 @@ ScrollBarBase.displayName = ScrollAreaPrimitive.ScrollAreaScrollbar.displayName;
3306
3416
  var React19 = __toESM(require("react"));
3307
3417
  var SelectPrimitive = __toESM(require("@radix-ui/react-select"));
3308
3418
  var import_react19 = require("@phosphor-icons/react");
3309
- var import_framer_motion4 = require("framer-motion");
3419
+ var import_framer_motion6 = require("framer-motion");
3310
3420
  var import_jsx_runtime30 = require("react/jsx-runtime");
3311
3421
  var SelectBase = SelectPrimitive.Root;
3312
3422
  var SelectGroupBase = SelectPrimitive.Group;
@@ -3323,7 +3433,7 @@ var SelectTriggerBase = React19.forwardRef(({ className, children, open, ...prop
3323
3433
  children: [
3324
3434
  children,
3325
3435
  /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3326
- import_framer_motion4.motion.span,
3436
+ import_framer_motion6.motion.span,
3327
3437
  {
3328
3438
  animate: { rotate: open ? 180 : 0 },
3329
3439
  transition: { duration: 0.3 },
@@ -3361,43 +3471,51 @@ var SelectScrollDownButtonBase = React19.forwardRef(({ className, ...props }, re
3361
3471
  }
3362
3472
  ));
3363
3473
  SelectScrollDownButtonBase.displayName = SelectPrimitive.ScrollDownButton.displayName;
3364
- var SelectContentBase = React19.forwardRef(({ className, children, position = "popper", testid: dataTestId = "select-content", ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_framer_motion4.AnimatePresence, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3365
- SelectPrimitive.Content,
3366
- {
3367
- ref,
3368
- className: cn(
3369
- "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
3370
- className
3371
- ),
3372
- position,
3373
- "data-testid": dataTestId,
3374
- ...props,
3375
- asChild: true,
3376
- children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3377
- import_framer_motion4.motion.div,
3378
- {
3379
- initial: { opacity: 0, scale: 0.95 },
3380
- animate: { opacity: 1, scale: 1 },
3381
- exit: { opacity: 0, scale: 0.95 },
3382
- transition: { duration: 0.2 },
3383
- children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
3384
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectScrollUpButtonBase, {}),
3385
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3386
- SelectPrimitive.Viewport,
3387
- {
3388
- className: cn(
3389
- "p-1",
3390
- position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
3391
- ),
3392
- children
3393
- }
3394
- ),
3395
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectScrollDownButtonBase, {})
3396
- ] })
3397
- }
3398
- )
3399
- }
3400
- ) }) }));
3474
+ var SelectContentBase = React19.forwardRef(
3475
+ ({
3476
+ className,
3477
+ children,
3478
+ position = "popper",
3479
+ testid: dataTestId = "select-content",
3480
+ ...props
3481
+ }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectPrimitive.Portal, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_framer_motion6.AnimatePresence, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3482
+ SelectPrimitive.Content,
3483
+ {
3484
+ ref,
3485
+ className: cn(
3486
+ "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md",
3487
+ className
3488
+ ),
3489
+ position,
3490
+ "data-testid": dataTestId,
3491
+ ...props,
3492
+ asChild: true,
3493
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3494
+ import_framer_motion6.motion.div,
3495
+ {
3496
+ initial: { opacity: 0, scale: 0.95 },
3497
+ animate: { opacity: 1, scale: 1 },
3498
+ exit: { opacity: 0, scale: 0.95 },
3499
+ transition: { duration: 0.2 },
3500
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(import_jsx_runtime30.Fragment, { children: [
3501
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectScrollUpButtonBase, {}),
3502
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3503
+ SelectPrimitive.Viewport,
3504
+ {
3505
+ className: cn(
3506
+ "p-1",
3507
+ position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
3508
+ ),
3509
+ children
3510
+ }
3511
+ ),
3512
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectScrollDownButtonBase, {})
3513
+ ] })
3514
+ }
3515
+ )
3516
+ }
3517
+ ) }) })
3518
+ );
3401
3519
  SelectContentBase.displayName = SelectPrimitive.Content.displayName;
3402
3520
  var SelectLabelBase = React19.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3403
3521
  SelectPrimitive.Label,
@@ -3408,19 +3526,36 @@ var SelectLabelBase = React19.forwardRef(({ className, ...props }, ref) => /* @_
3408
3526
  }
3409
3527
  ));
3410
3528
  SelectLabelBase.displayName = SelectPrimitive.Label.displayName;
3411
- var SelectItemBase = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
3529
+ var SelectItemBase = React19.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3412
3530
  SelectPrimitive.Item,
3413
3531
  {
3414
3532
  ref,
3415
3533
  className: cn(
3416
- "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
3534
+ "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-2 pr-8 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50 transition-colors",
3417
3535
  className
3418
3536
  ),
3419
3537
  ...props,
3420
- children: [
3421
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react19.CheckIcon, { className: "h-4 w-4" }) }) }),
3422
- /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectPrimitive.ItemText, { children })
3423
- ]
3538
+ asChild: true,
3539
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
3540
+ import_framer_motion6.motion.div,
3541
+ {
3542
+ whileHover: { x: 4 },
3543
+ whileTap: { scale: 0.98 },
3544
+ transition: { duration: 0.2 },
3545
+ children: [
3546
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
3547
+ import_framer_motion6.motion.div,
3548
+ {
3549
+ initial: { scale: 0 },
3550
+ animate: { scale: 1 },
3551
+ transition: { type: "spring", stiffness: 500, damping: 30 },
3552
+ children: /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(import_react19.CheckIcon, { className: "h-4 w-4" })
3553
+ }
3554
+ ) }) }),
3555
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(SelectPrimitive.ItemText, { children })
3556
+ ]
3557
+ }
3558
+ )
3424
3559
  }
3425
3560
  ));
3426
3561
  SelectItemBase.displayName = SelectPrimitive.Item.displayName;
@@ -3437,7 +3572,7 @@ SelectSeparatorBase.displayName = SelectPrimitive.Separator.displayName;
3437
3572
  // src/components/ui/SeparatorBase.tsx
3438
3573
  var React20 = __toESM(require("react"));
3439
3574
  var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"));
3440
- var import_framer_motion5 = require("framer-motion");
3575
+ var import_framer_motion7 = require("framer-motion");
3441
3576
  var import_jsx_runtime31 = require("react/jsx-runtime");
3442
3577
  var SeparatorBase = React20.forwardRef(
3443
3578
  ({ className, orientation = "horizontal", decorative = true, ...props }, ref) => {
@@ -3451,7 +3586,7 @@ var SeparatorBase = React20.forwardRef(
3451
3586
  asChild: true,
3452
3587
  ...props,
3453
3588
  children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
3454
- import_framer_motion5.motion.div,
3589
+ import_framer_motion7.motion.div,
3455
3590
  {
3456
3591
  className: cn(
3457
3592
  "shrink-0 bg-border",
@@ -4458,7 +4593,8 @@ var TabsListBase = React27.forwardRef(({ className, ...props }, ref) => /* @__PU
4458
4593
  {
4459
4594
  ref,
4460
4595
  className: cn(
4461
- "relative flex w-full items-center justify-start gap-4 border-b-2 border-border",
4596
+ "relative flex w-full items-center justify-start gap-2 border-b border-border",
4597
+ "bg-transparent",
4462
4598
  className
4463
4599
  ),
4464
4600
  ...props
@@ -4470,13 +4606,15 @@ var TabsTriggerBase = React27.forwardRef(({ className, ...props }, ref) => /* @_
4470
4606
  {
4471
4607
  ref,
4472
4608
  className: cn(
4473
- "relative inline-flex items-center justify-center whitespace-nowrap px-3 py-2 text-sm font-medium transition-colors",
4474
- "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-3",
4609
+ "relative inline-flex items-center justify-center whitespace-nowrap px-4 py-2 text-sm font-medium",
4610
+ "text-muted-foreground hover:text-foreground",
4611
+ "transition-colors duration-300 ease-in-out",
4612
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
4475
4613
  "disabled:pointer-events-none disabled:opacity-50",
4476
4614
  "data-[state=active]:text-primary",
4477
- "after:absolute after:bottom-0 after:left-0 after:h-[1.5px] after:w-full",
4615
+ "after:absolute after:bottom-0 after:left-0 after:h-[2px] after:w-full",
4478
4616
  "after:scale-x-0 after:bg-primary after:origin-left",
4479
- "after:transition-transform after:duration-300 after:ease-[cubic-bezier(0.65,0,0.35,1)]",
4617
+ "after:transition-transform after:duration-500 after:ease-[cubic-bezier(0.34,1.56,0.64,1)]",
4480
4618
  "data-[state=active]:after:scale-x-100",
4481
4619
  className
4482
4620
  ),
@@ -4488,8 +4626,8 @@ var TabsContentBase = React27.forwardRef(({ className, ...props }, ref) => /* @_
4488
4626
  {
4489
4627
  ref,
4490
4628
  className: cn(
4491
- "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
4492
- "animate-fade-in",
4629
+ "mt-4 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
4630
+ "animate-in fade-in-0 duration-500 ease-in-out",
4493
4631
  className
4494
4632
  ),
4495
4633
  ...props
@@ -4499,41 +4637,198 @@ TabsContentBase.displayName = TabsPrimitive.Content.displayName;
4499
4637
 
4500
4638
  // src/components/ui/TextAreaBase.tsx
4501
4639
  var React28 = __toESM(require("react"));
4640
+ var import_framer_motion8 = require("framer-motion");
4641
+ var import_react23 = require("@phosphor-icons/react");
4502
4642
  var import_jsx_runtime40 = require("react/jsx-runtime");
4503
- var TextAreaBase = React28.forwardRef(({ className, ...props }, ref) => {
4504
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
4505
- "textarea",
4506
- {
4507
- className: cn(
4508
- "flex min-h-[60px] w-full rounded-md border border-input bg-transparent px-3 py-2 text-base shadow-sm placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
4509
- className
4643
+ var TextAreaBase = React28.forwardRef(
4644
+ ({ className, clearable = false, onClear, ...props }, ref) => {
4645
+ const [isFocused, setIsFocused] = React28.useState(false);
4646
+ const [hasContent, setHasContent] = React28.useState(
4647
+ !!props.value || !!props.defaultValue
4648
+ );
4649
+ const [showConfirmTooltip, setShowConfirmTooltip] = React28.useState(false);
4650
+ const textareaRef = React28.useRef(null);
4651
+ const handleFocus = (e) => {
4652
+ setIsFocused(true);
4653
+ props.onFocus?.(e);
4654
+ };
4655
+ const handleBlur = (e) => {
4656
+ setIsFocused(false);
4657
+ props.onBlur?.(e);
4658
+ };
4659
+ const handleChange = (e) => {
4660
+ setHasContent(e.target.value.length > 0);
4661
+ props.onChange?.(e);
4662
+ };
4663
+ const handleClearClick = () => {
4664
+ setShowConfirmTooltip(true);
4665
+ };
4666
+ const handleConfirmClear = () => {
4667
+ if (textareaRef.current) {
4668
+ const nativeInputValueSetter = Object.getOwnPropertyDescriptor(
4669
+ window.HTMLTextAreaElement.prototype,
4670
+ "value"
4671
+ )?.set;
4672
+ if (nativeInputValueSetter) {
4673
+ nativeInputValueSetter.call(textareaRef.current, "");
4674
+ const event = new Event("input", { bubbles: true });
4675
+ textareaRef.current.dispatchEvent(event);
4676
+ }
4677
+ setHasContent(false);
4678
+ setShowConfirmTooltip(false);
4679
+ textareaRef.current.focus();
4680
+ onClear?.();
4681
+ }
4682
+ };
4683
+ const handleCancelClear = () => {
4684
+ setShowConfirmTooltip(false);
4685
+ };
4686
+ React28.useImperativeHandle(ref, () => textareaRef.current);
4687
+ React28.useEffect(() => {
4688
+ setHasContent(!!props.value || !!props.defaultValue);
4689
+ }, [props.value, props.defaultValue]);
4690
+ return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "relative", children: [
4691
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
4692
+ "textarea",
4693
+ {
4694
+ className: cn(
4695
+ "peer flex min-h-[80px] min-w-[200px] w-full rounded-lg border border-input bg-background/50 backdrop-blur-sm",
4696
+ "px-4 py-3 text-base shadow-sm placeholder:text-muted-foreground/60",
4697
+ "transition-all duration-300 ease-out",
4698
+ "hover:border-input/80 hover:shadow-md",
4699
+ "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring/30 focus-visible:border-ring",
4700
+ "focus-visible:shadow-lg focus-visible:bg-background",
4701
+ "disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-muted/30",
4702
+ "resize",
4703
+ "md:text-sm",
4704
+ clearable && hasContent && "pr-10",
4705
+ className
4706
+ ),
4707
+ ref: textareaRef,
4708
+ onFocus: handleFocus,
4709
+ onBlur: handleBlur,
4710
+ onChange: handleChange,
4711
+ ...props
4712
+ }
4510
4713
  ),
4511
- ref,
4512
- ...props
4513
- }
4514
- );
4515
- });
4714
+ clearable && hasContent && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TooltipProviderBase, { children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
4715
+ TooltipBase,
4716
+ {
4717
+ open: showConfirmTooltip,
4718
+ onOpenChange: setShowConfirmTooltip,
4719
+ children: [
4720
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(TooltipTriggerBase, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
4721
+ import_framer_motion8.motion.button,
4722
+ {
4723
+ type: "button",
4724
+ initial: { opacity: 0, scale: 0.8 },
4725
+ animate: { opacity: 1, scale: 1 },
4726
+ exit: { opacity: 0, scale: 0.8 },
4727
+ transition: { duration: 0.2 },
4728
+ onClick: handleClearClick,
4729
+ className: cn(
4730
+ "absolute top-3 right-3 p-1.5 rounded-md",
4731
+ "text-muted-foreground/50 hover:text-destructive hover:bg-destructive/10",
4732
+ "transition-all duration-200",
4733
+ "focus:outline-none focus:ring-2 focus:ring-destructive/30",
4734
+ "disabled:opacity-50 disabled:cursor-not-allowed"
4735
+ ),
4736
+ disabled: props.disabled,
4737
+ "aria-label": "Limpar texto",
4738
+ children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_react23.TrashIcon, { size: 16, weight: "regular" })
4739
+ }
4740
+ ) }),
4741
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
4742
+ TooltipContentBase,
4743
+ {
4744
+ side: "left",
4745
+ className: "bg-background border border-border shadow-lg p-3 flex flex-col gap-2",
4746
+ children: [
4747
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-sm text-foreground font-medium mb-1", children: "Limpar todo o texto?" }),
4748
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex gap-2", children: [
4749
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
4750
+ "button",
4751
+ {
4752
+ type: "button",
4753
+ onClick: handleConfirmClear,
4754
+ className: cn(
4755
+ "px-3 py-1.5 text-xs rounded-md font-medium",
4756
+ "bg-destructive text-destructive-foreground",
4757
+ "hover:bg-destructive/90",
4758
+ "transition-colors"
4759
+ ),
4760
+ children: "Confirmar"
4761
+ }
4762
+ ),
4763
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
4764
+ "button",
4765
+ {
4766
+ type: "button",
4767
+ onClick: handleCancelClear,
4768
+ className: cn(
4769
+ "px-3 py-1.5 text-xs rounded-md font-medium",
4770
+ "bg-secondary text-secondary-foreground",
4771
+ "hover:bg-secondary/80",
4772
+ "transition-colors"
4773
+ ),
4774
+ children: "Cancelar"
4775
+ }
4776
+ )
4777
+ ] })
4778
+ ]
4779
+ }
4780
+ )
4781
+ ]
4782
+ }
4783
+ ) }),
4784
+ /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
4785
+ import_framer_motion8.motion.div,
4786
+ {
4787
+ className: "pointer-events-none absolute inset-0 rounded-lg",
4788
+ initial: { opacity: 0 },
4789
+ animate: { opacity: isFocused ? 1 : 0 },
4790
+ transition: { duration: 0.3 },
4791
+ children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "absolute inset-0 rounded-lg bg-gradient-to-r from-ring/20 via-ring/10 to-ring/20 blur-sm" })
4792
+ }
4793
+ ),
4794
+ isFocused && hasContent && props.maxLength && /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
4795
+ import_framer_motion8.motion.div,
4796
+ {
4797
+ initial: { opacity: 0, y: -10 },
4798
+ animate: { opacity: 1, y: 0 },
4799
+ exit: { opacity: 0, y: -10 },
4800
+ className: "absolute bottom-2 right-3 text-xs text-muted-foreground/70 font-medium",
4801
+ children: [
4802
+ props.value?.length || 0,
4803
+ " / ",
4804
+ props.maxLength
4805
+ ]
4806
+ }
4807
+ )
4808
+ ] });
4809
+ }
4810
+ );
4516
4811
  TextAreaBase.displayName = "TextAreaBase";
4517
4812
 
4518
4813
  // src/components/mode-toggle.tsx
4519
- var import_react24 = require("@phosphor-icons/react");
4814
+ var import_react25 = require("@phosphor-icons/react");
4520
4815
 
4521
4816
  // src/components/theme-provider.tsx
4522
- var import_react23 = require("react");
4817
+ var import_react24 = require("react");
4523
4818
  var import_jsx_runtime41 = require("react/jsx-runtime");
4524
4819
  var initialState = {
4525
4820
  theme: "system",
4526
4821
  setTheme: () => null
4527
4822
  };
4528
- var ThemeProviderContext = (0, import_react23.createContext)(initialState);
4823
+ var ThemeProviderContext = (0, import_react24.createContext)(initialState);
4529
4824
  function ThemeProviderBase({
4530
4825
  children,
4531
4826
  defaultTheme = "system",
4532
4827
  storageKey = "app-ui-theme",
4533
4828
  ...props
4534
4829
  }) {
4535
- const [theme, setThemeState] = (0, import_react23.useState)(defaultTheme);
4536
- (0, import_react23.useEffect)(() => {
4830
+ const [theme, setThemeState] = (0, import_react24.useState)(defaultTheme);
4831
+ (0, import_react24.useEffect)(() => {
4537
4832
  const root = window.document.documentElement;
4538
4833
  root.classList.remove(
4539
4834
  "light",
@@ -4559,7 +4854,7 @@ function ThemeProviderBase({
4559
4854
  document.body.style.color = "";
4560
4855
  }
4561
4856
  }, [theme]);
4562
- (0, import_react23.useEffect)(() => {
4857
+ (0, import_react24.useEffect)(() => {
4563
4858
  const stored = localStorage.getItem(storageKey);
4564
4859
  if (stored) setThemeState(stored);
4565
4860
  }, [storageKey]);
@@ -4573,7 +4868,7 @@ function ThemeProviderBase({
4573
4868
  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ThemeProviderContext.Provider, { ...props, value, children });
4574
4869
  }
4575
4870
  var useTheme = () => {
4576
- const context = (0, import_react23.useContext)(ThemeProviderContext);
4871
+ const context = (0, import_react24.useContext)(ThemeProviderContext);
4577
4872
  if (context === void 0)
4578
4873
  throw new Error("useTheme must be used within a ThemeProvider");
4579
4874
  return context;
@@ -4606,8 +4901,8 @@ function ModeToggleBase({
4606
4901
  className: "relative overflow-hidden border-transparent",
4607
4902
  children: [
4608
4903
  /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(import_jsx_runtime42.Fragment, { children: [
4609
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react24.SunIcon, { className: `h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-90 scale-0" : "rotate-0 scale-100"}` }),
4610
- /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react24.MoonIcon, { className: `absolute h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-0 scale-100" : "rotate-90 scale-0"}` })
4904
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react25.SunIcon, { className: `h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-90 scale-0" : "rotate-0 scale-100"}` }),
4905
+ /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react25.MoonIcon, { className: `absolute h-[1.2rem] w-[1.2rem] transition-transform duration-300 ${isDark ? "rotate-0 scale-100" : "rotate-90 scale-0"}` })
4611
4906
  ] }),
4612
4907
  /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "sr-only", children: "Toggle theme" })
4613
4908
  ]
@@ -4620,7 +4915,7 @@ function ModeToggleBase({
4620
4915
  className: "flex items-center justify-between hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
4621
4916
  children: [
4622
4917
  themeLabels[theme],
4623
- currentTheme === theme && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react24.CheckIcon, { className: "h-4 w-4 opacity-100" })
4918
+ currentTheme === theme && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_react25.CheckIcon, { className: "h-4 w-4 opacity-100" })
4624
4919
  ]
4625
4920
  },
4626
4921
  theme
@@ -4630,7 +4925,7 @@ function ModeToggleBase({
4630
4925
 
4631
4926
  // src/components/ui/DestructiveDialog.tsx
4632
4927
  var React29 = __toESM(require("react"));
4633
- var import_react25 = require("@phosphor-icons/react");
4928
+ var import_react26 = require("@phosphor-icons/react");
4634
4929
  var import_jsx_runtime43 = require("react/jsx-runtime");
4635
4930
  var DestructiveDialog = ({
4636
4931
  title,
@@ -4655,7 +4950,7 @@ var DestructiveDialog = ({
4655
4950
  className: cn("border border-destructive bg-background"),
4656
4951
  children: [
4657
4952
  /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex items-start gap-4", children: [
4658
- /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react25.XCircleIcon, { className: "w-6 h-6 text-destructive" }) }),
4953
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "flex items-center justify-center w-10 h-10 rounded-full ring-1 ring-destructive/30", children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_react26.XCircleIcon, { className: "w-6 h-6 text-destructive" }) }),
4659
4954
  /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex-1", children: [
4660
4955
  /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(
4661
4956
  AlertDialogTitleBase,
@@ -4710,8 +5005,8 @@ var import_date_fns = require("date-fns");
4710
5005
  // src/components/date-time-picker/calendar.tsx
4711
5006
  var React30 = __toESM(require("react"));
4712
5007
  var import_react_day_picker2 = require("react-day-picker");
4713
- var import_react26 = require("@phosphor-icons/react");
4714
- var import_framer_motion6 = require("framer-motion");
5008
+ var import_react27 = require("@phosphor-icons/react");
5009
+ var import_framer_motion9 = require("framer-motion");
4715
5010
  var import_jsx_runtime44 = require("react/jsx-runtime");
4716
5011
  function CalendarBase2({
4717
5012
  className,
@@ -4733,10 +5028,10 @@ function CalendarBase2({
4733
5028
  "div",
4734
5029
  {
4735
5030
  className: cn(
4736
- "rounded-2xl border bg-background p-4 shadow-lg overflow-hidden w-full h-full flex flex-col",
5031
+ "rounded-md border bg-background p-4 shadow-lg overflow-hidden w-full h-full flex flex-col",
4737
5032
  className
4738
5033
  ),
4739
- children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "relative flex-1 flex flex-col min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_framer_motion6.AnimatePresence, { initial: false, mode: "wait", custom: direction, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
5034
+ children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("div", { className: "relative flex-1 flex flex-col min-h-0", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_framer_motion9.AnimatePresence, { initial: false, mode: "wait", custom: direction, children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
4740
5035
  "div",
4741
5036
  {
4742
5037
  className: "w-full h-full flex flex-col",
@@ -4789,8 +5084,8 @@ function CalendarBase2({
4789
5084
  ...classNames
4790
5085
  },
4791
5086
  components: {
4792
- IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react26.CaretLeftIcon, { className: "h-4 w-4" }),
4793
- IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react26.CaretRightIcon, { className: "h-4 w-4" })
5087
+ IconLeft: () => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react27.CaretLeftIcon, { className: "h-4 w-4" }),
5088
+ IconRight: () => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_react27.CaretRightIcon, { className: "h-4 w-4" })
4794
5089
  },
4795
5090
  ...props
4796
5091
  }
@@ -4805,15 +5100,15 @@ CalendarBase2.displayName = "CalendarBase";
4805
5100
 
4806
5101
  // src/components/date-time-picker/DateTimePicker.tsx
4807
5102
  var import_locale = require("date-fns/locale");
4808
- var import_react29 = require("react");
5103
+ var import_react30 = require("react");
4809
5104
 
4810
5105
  // src/components/date-time-picker/TimePicker.tsx
4811
- var import_framer_motion7 = require("framer-motion");
5106
+ var import_framer_motion10 = require("framer-motion");
4812
5107
  var React32 = __toESM(require("react"));
4813
5108
 
4814
5109
  // src/components/date-time-picker/TimePickerInput.tsx
4815
- var import_react27 = require("@phosphor-icons/react");
4816
- var import_react28 = __toESM(require("react"));
5110
+ var import_react28 = require("@phosphor-icons/react");
5111
+ var import_react29 = __toESM(require("react"));
4817
5112
 
4818
5113
  // src/components/date-time-picker/time-picker-utils.ts
4819
5114
  function isValidHour(value) {
@@ -4956,7 +5251,7 @@ function display12HourValue(hours) {
4956
5251
 
4957
5252
  // src/components/date-time-picker/TimePickerInput.tsx
4958
5253
  var import_jsx_runtime45 = require("react/jsx-runtime");
4959
- var TimePickerInput = import_react28.default.forwardRef(
5254
+ var TimePickerInput = import_react29.default.forwardRef(
4960
5255
  ({
4961
5256
  className,
4962
5257
  type = "tel",
@@ -4975,10 +5270,10 @@ var TimePickerInput = import_react28.default.forwardRef(
4975
5270
  label,
4976
5271
  ...props
4977
5272
  }, ref) => {
4978
- const [flag, setFlag] = import_react28.default.useState(false);
4979
- const [prevIntKey, setPrevIntKey] = import_react28.default.useState("0");
4980
- const [isFocused, setIsFocused] = import_react28.default.useState(false);
4981
- import_react28.default.useEffect(() => {
5273
+ const [flag, setFlag] = import_react29.default.useState(false);
5274
+ const [prevIntKey, setPrevIntKey] = import_react29.default.useState("0");
5275
+ const [isFocused, setIsFocused] = import_react29.default.useState(false);
5276
+ import_react29.default.useEffect(() => {
4982
5277
  if (flag) {
4983
5278
  const timer = setTimeout(() => {
4984
5279
  setFlag(false);
@@ -4986,7 +5281,7 @@ var TimePickerInput = import_react28.default.forwardRef(
4986
5281
  return () => clearTimeout(timer);
4987
5282
  }
4988
5283
  }, [flag]);
4989
- const calculatedValue = import_react28.default.useMemo(() => {
5284
+ const calculatedValue = import_react29.default.useMemo(() => {
4990
5285
  return getDateByType(date, picker);
4991
5286
  }, [date, picker]);
4992
5287
  const calculateNewValue = (key) => {
@@ -5075,7 +5370,7 @@ var TimePickerInput = import_react28.default.forwardRef(
5075
5370
  ),
5076
5371
  tabIndex: -1,
5077
5372
  "aria-label": `Incrementar ${getPickerLabel().toLowerCase()}`,
5078
- children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react27.CaretUpIcon, { size: 14, className: "sm:w-4 sm:h-4" })
5373
+ children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react28.CaretUpIcon, { size: 14, className: "sm:w-4 sm:h-4" })
5079
5374
  }
5080
5375
  ),
5081
5376
  /* @__PURE__ */ (0, import_jsx_runtime45.jsxs)("div", { className: "relative", children: [
@@ -5142,7 +5437,7 @@ var TimePickerInput = import_react28.default.forwardRef(
5142
5437
  ),
5143
5438
  tabIndex: -1,
5144
5439
  "aria-label": `Decrementar ${getPickerLabel().toLowerCase()}`,
5145
- children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react27.CaretDownIcon, { size: 14, className: "sm:w-4 sm:h-4" })
5440
+ children: /* @__PURE__ */ (0, import_jsx_runtime45.jsx)(import_react28.CaretDownIcon, { size: 14, className: "sm:w-4 sm:h-4" })
5146
5441
  }
5147
5442
  )
5148
5443
  ]
@@ -5180,7 +5475,7 @@ function TimePicker({
5180
5475
  visible: { opacity: 1, y: 0 }
5181
5476
  };
5182
5477
  return /* @__PURE__ */ (0, import_jsx_runtime46.jsxs)(
5183
- import_framer_motion7.motion.div,
5478
+ import_framer_motion10.motion.div,
5184
5479
  {
5185
5480
  variants: containerVariants,
5186
5481
  initial: "hidden",
@@ -5188,7 +5483,7 @@ function TimePicker({
5188
5483
  className: "flex items-end justify-center gap-2 sm:gap-3 p-2 sm:p-3 md:p-4 rounded-lg bg-muted/20 border border-border/50 w-full max-w-full overflow-hidden",
5189
5484
  children: [
5190
5485
  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
5191
- import_framer_motion7.motion.div,
5486
+ import_framer_motion10.motion.div,
5192
5487
  {
5193
5488
  variants: itemVariants2,
5194
5489
  className: "grid gap-1 sm:gap-2 text-center flex-shrink-0 min-w-0",
@@ -5206,7 +5501,7 @@ function TimePicker({
5206
5501
  }
5207
5502
  ),
5208
5503
  /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
5209
- import_framer_motion7.motion.div,
5504
+ import_framer_motion10.motion.div,
5210
5505
  {
5211
5506
  variants: itemVariants2,
5212
5507
  className: "grid gap-1 sm:gap-2 text-center flex-shrink-0 min-w-0",
@@ -5224,8 +5519,8 @@ function TimePicker({
5224
5519
  )
5225
5520
  }
5226
5521
  ),
5227
- /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_framer_motion7.AnimatePresence, { children: !hideSeconds && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
5228
- import_framer_motion7.motion.div,
5522
+ /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_framer_motion10.AnimatePresence, { children: !hideSeconds && /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_jsx_runtime46.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(
5523
+ import_framer_motion10.motion.div,
5229
5524
  {
5230
5525
  variants: itemVariants2,
5231
5526
  initial: "hidden",
@@ -5251,7 +5546,7 @@ function TimePicker({
5251
5546
  }
5252
5547
 
5253
5548
  // src/components/date-time-picker/DateTimePicker.tsx
5254
- var import_react30 = require("@phosphor-icons/react");
5549
+ var import_react31 = require("@phosphor-icons/react");
5255
5550
  var import_jsx_runtime47 = require("react/jsx-runtime");
5256
5551
  function DateTimePicker({
5257
5552
  label,
@@ -5265,9 +5560,9 @@ function DateTimePicker({
5265
5560
  disabled,
5266
5561
  className
5267
5562
  }) {
5268
- const [internalDate, setInternalDate] = (0, import_react29.useState)(date);
5269
- const [open, setOpen] = (0, import_react29.useState)(false);
5270
- const [timePickerOpen, setTimePickerOpen] = (0, import_react29.useState)(false);
5563
+ const [internalDate, setInternalDate] = (0, import_react30.useState)(date);
5564
+ const [open, setOpen] = (0, import_react30.useState)(false);
5565
+ const [timePickerOpen, setTimePickerOpen] = (0, import_react30.useState)(false);
5271
5566
  const handleSelect = (newDay) => {
5272
5567
  if (!newDay) return;
5273
5568
  if (!internalDate) {
@@ -5296,7 +5591,7 @@ function DateTimePicker({
5296
5591
  if (!timeFormat) return "PPP";
5297
5592
  return `PPP - ${timeFormat}`;
5298
5593
  };
5299
- (0, import_react29.useEffect)(() => {
5594
+ (0, import_react30.useEffect)(() => {
5300
5595
  if (date) {
5301
5596
  setInternalDate(date);
5302
5597
  }
@@ -5308,16 +5603,15 @@ function DateTimePicker({
5308
5603
  ButtonBase,
5309
5604
  {
5310
5605
  variant: "outline",
5311
- size: "lg",
5312
5606
  className: cn(
5313
5607
  "w-full justify-start text-left min-w-0 overflow-hidden",
5314
- "min-h-[44px] sm:min-h-[48px] px-3 sm:px-4",
5608
+ "text-muted-foreground/90",
5315
5609
  "text-sm sm:text-base",
5316
- !date && "text-muted-foreground"
5610
+ !date && "text-muted-foreground/"
5317
5611
  ),
5318
5612
  children: [
5319
5613
  /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "truncate flex-1", children: date ? (0, import_date_fns.format)(date, getDisplayFormat(), { locale: import_locale.ptBR }) : "Pick a date" }),
5320
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react30.CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
5614
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react31.CalendarBlankIcon, { className: "flex-shrink-0 w-5 h-5 sm:w-6 sm:h-6" })
5321
5615
  ]
5322
5616
  }
5323
5617
  ) }),
@@ -5360,13 +5654,13 @@ function DateTimePicker({
5360
5654
  "px-2 sm:px-3 py-1.5 sm:py-2",
5361
5655
  "text-sm sm:text-base font-semibold w-full max-w-xs",
5362
5656
  "border-2 border-primary/20 rounded-lg",
5363
- "bg-primary/5 hover:bg-primary/10 hover:border-primary/30",
5657
+ "bg-background hover:bg-primary/10 hover:border-primary/30",
5364
5658
  "transition-all duration-200",
5365
5659
  "shadow-sm hover:shadow-md active:scale-[0.98]",
5366
5660
  "min-h-[36px] sm:min-h-[40px]"
5367
5661
  ),
5368
5662
  children: [
5369
- /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react30.ClockIcon, { className: "text-primary/70 flex-shrink-0 w-4 h-4 sm:w-5 sm:h-5" }),
5663
+ /* @__PURE__ */ (0, import_jsx_runtime47.jsx)(import_react31.ClockIcon, { className: "text-primary flex-shrink-0 w-4 h-4 sm:w-5 sm:h-5" }),
5370
5664
  /* @__PURE__ */ (0, import_jsx_runtime47.jsx)("span", { className: "text-foreground truncate", children: internalDate ? (0, import_date_fns.format)(internalDate, getTimeFormat() || "HH:mm", {
5371
5665
  locale: import_locale.ptBR
5372
5666
  }) : "00:00" })
@@ -5416,6 +5710,7 @@ function DateTimePicker({
5416
5710
  }
5417
5711
 
5418
5712
  // src/components/selects/Select.tsx
5713
+ var import_framer_motion11 = require("framer-motion");
5419
5714
  var import_jsx_runtime48 = require("react/jsx-runtime");
5420
5715
  function Select({
5421
5716
  items,
@@ -5426,58 +5721,82 @@ function Select({
5426
5721
  testIds = {}
5427
5722
  }) {
5428
5723
  return /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("div", { "data-testid": testIds.root ?? "select-root", children: [
5429
- /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(SelectBase, { onValueChange: onChange, "data-testid": testIds.base ?? "select-base", children: [
5430
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5431
- SelectTriggerBase,
5432
- {
5433
- className: cn(
5434
- "flex h-12 w-full content-start text-lg shadow-md",
5435
- errorMessage && "border-red-500"
5436
- ),
5437
- "data-testid": testIds.trigger ?? "select-trigger",
5438
- children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5439
- SelectValueBase,
5724
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
5725
+ SelectBase,
5726
+ {
5727
+ onValueChange: onChange,
5728
+ "data-testid": testIds.base ?? "select-base",
5729
+ children: [
5730
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5731
+ SelectTriggerBase,
5440
5732
  {
5441
- placeholder,
5442
- "data-testid": testIds.value ?? "select-value"
5733
+ className: cn(
5734
+ "flex h-9 w-full content-start text-lg shadow-md",
5735
+ errorMessage && "border-red-500"
5736
+ ),
5737
+ "data-testid": testIds.trigger ?? "select-trigger",
5738
+ children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5739
+ SelectValueBase,
5740
+ {
5741
+ placeholder,
5742
+ "data-testid": testIds.value ?? "select-value"
5743
+ }
5744
+ )
5443
5745
  }
5444
- )
5445
- }
5446
- ),
5447
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: [
5448
- /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SelectLabelBase, { "data-testid": testIds.label ?? "select-label", children: key }),
5449
- groupItems[key].map((item) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5450
- SelectItemBase,
5451
- {
5452
- value: item.value,
5453
- "data-testid": testIds.item?.(item.value) ?? `select-item-${item.value}`,
5454
- children: item.label
5455
- },
5456
- item.value
5457
- ))
5458
- ] }, key)) }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5459
- SelectItemBase,
5460
- {
5461
- value: item.value,
5462
- "data-testid": testIds.item?.(item.value) ?? `select-item-${item.value}`,
5463
- children: item.label
5464
- },
5465
- item.value
5466
- )) }) }) })
5467
- ] }),
5468
- errorMessage && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5469
- "p",
5746
+ ),
5747
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(ScrollAreaBase, { "data-testid": testIds.scrollarea ?? "select-scrollarea", children: /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SelectContentBase, { "data-testid": testIds.content ?? "select-content", children: groupItems ? /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_jsx_runtime48.Fragment, { children: Object.keys(groupItems).map((key) => /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(
5748
+ SelectGroupBase,
5749
+ {
5750
+ "data-testid": testIds.group ?? "select-group",
5751
+ children: [
5752
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5753
+ SelectLabelBase,
5754
+ {
5755
+ "data-testid": testIds.label ?? "select-label",
5756
+ children: key
5757
+ }
5758
+ ),
5759
+ groupItems[key].map((item) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5760
+ SelectItemBase,
5761
+ {
5762
+ value: item.value,
5763
+ "data-testid": testIds.item?.(item.value) ?? `select-item-${item.value}`,
5764
+ children: item.label
5765
+ },
5766
+ item.value
5767
+ ))
5768
+ ]
5769
+ },
5770
+ key
5771
+ )) }) : /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(SelectGroupBase, { "data-testid": testIds.group ?? "select-group", children: items.map((item) => /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5772
+ SelectItemBase,
5773
+ {
5774
+ value: item.value,
5775
+ "data-testid": testIds.item?.(item.value) ?? `select-item-${item.value}`,
5776
+ children: item.label
5777
+ },
5778
+ item.value
5779
+ )) }) }) })
5780
+ ]
5781
+ }
5782
+ ),
5783
+ /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_framer_motion11.AnimatePresence, { children: errorMessage && /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(
5784
+ import_framer_motion11.motion.p,
5470
5785
  {
5786
+ initial: { opacity: 0, y: -10 },
5787
+ animate: { opacity: 1, y: 0 },
5788
+ exit: { opacity: 0, y: -10 },
5789
+ transition: { duration: 0.2 },
5471
5790
  className: "text-sm text-red-500",
5472
5791
  "data-testid": testIds.error ?? "select-error",
5473
5792
  children: errorMessage
5474
5793
  }
5475
- )
5794
+ ) })
5476
5795
  ] });
5477
5796
  }
5478
5797
 
5479
5798
  // src/components/charts/Chart.tsx
5480
- var import_react35 = require("react");
5799
+ var import_react36 = require("react");
5481
5800
  var import_recharts = require("recharts");
5482
5801
 
5483
5802
  // src/components/charts/utils/helpers.ts
@@ -5624,8 +5943,8 @@ var resolveChartMargins = (margins, chartMargins, showLabels) => {
5624
5943
  var import_sonner2 = require("sonner");
5625
5944
 
5626
5945
  // src/components/charts/components/controls/PeriodsDropdown.tsx
5627
- var import_react31 = require("react");
5628
- var import_framer_motion8 = require("framer-motion");
5946
+ var import_react32 = require("react");
5947
+ var import_framer_motion12 = require("framer-motion");
5629
5948
  var import_ssr = require("@phosphor-icons/react/dist/ssr");
5630
5949
  var import_ssr2 = require("@phosphor-icons/react/dist/ssr");
5631
5950
  var import_jsx_runtime49 = require("react/jsx-runtime");
@@ -5647,11 +5966,11 @@ function PeriodsDropdown({
5647
5966
  activePeriods
5648
5967
  }) {
5649
5968
  const periods = processedData.map((d) => String(d.name));
5650
- const [open, setOpen] = (0, import_react31.useState)(false);
5651
- const wrapperRef = (0, import_react31.useRef)(null);
5652
- const firstItemRef = (0, import_react31.useRef)(null);
5653
- const listRef = (0, import_react31.useRef)(null);
5654
- (0, import_react31.useEffect)(() => {
5969
+ const [open, setOpen] = (0, import_react32.useState)(false);
5970
+ const wrapperRef = (0, import_react32.useRef)(null);
5971
+ const firstItemRef = (0, import_react32.useRef)(null);
5972
+ const listRef = (0, import_react32.useRef)(null);
5973
+ (0, import_react32.useEffect)(() => {
5655
5974
  const handleClickOutside = (e) => {
5656
5975
  if (!wrapperRef.current) return;
5657
5976
  if (!wrapperRef.current.contains(e.target)) setOpen(false);
@@ -5666,7 +5985,7 @@ function PeriodsDropdown({
5666
5985
  document.removeEventListener("keydown", handleEscape);
5667
5986
  };
5668
5987
  }, []);
5669
- (0, import_react31.useEffect)(() => {
5988
+ (0, import_react32.useEffect)(() => {
5670
5989
  if (open && firstItemRef.current) {
5671
5990
  firstItemRef.current.focus();
5672
5991
  }
@@ -5700,8 +6019,8 @@ function PeriodsDropdown({
5700
6019
  ]
5701
6020
  }
5702
6021
  ),
5703
- /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_framer_motion8.AnimatePresence, { children: open && /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
5704
- import_framer_motion8.motion.div,
6022
+ /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_framer_motion12.AnimatePresence, { children: open && /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
6023
+ import_framer_motion12.motion.div,
5705
6024
  {
5706
6025
  initial: "hidden",
5707
6026
  animate: "visible",
@@ -5730,7 +6049,7 @@ function PeriodsDropdown({
5730
6049
  className: "flex flex-col p-2 gap-1",
5731
6050
  style: { maxHeight: 200, overflowY: "auto" },
5732
6051
  children: periods.map((p, idx) => /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)(
5733
- import_framer_motion8.motion.button,
6052
+ import_framer_motion12.motion.button,
5734
6053
  {
5735
6054
  className: "flex items-center justify-between w-full text-left px-3 py-2.5 rounded focus:outline-none transition-colors " + (activePeriods && activePeriods.includes(p) || p === activePeriod ? "bg-accent/10 font-medium" : "hover:bg-accent/15 focus-visible:ring-2 focus-visible:ring-accent/30"),
5736
6055
  variants: itemVariants,
@@ -5758,8 +6077,8 @@ function PeriodsDropdown({
5758
6077
  var PeriodsDropdown_default = PeriodsDropdown;
5759
6078
 
5760
6079
  // src/components/charts/components/controls/ShowOnly.tsx
5761
- var import_framer_motion9 = require("framer-motion");
5762
- var import_react32 = require("@phosphor-icons/react");
6080
+ var import_framer_motion13 = require("framer-motion");
6081
+ var import_react33 = require("@phosphor-icons/react");
5763
6082
  var import_jsx_runtime50 = require("react/jsx-runtime");
5764
6083
  var ShowOnly = ({
5765
6084
  showOnlyHighlighted,
@@ -5769,7 +6088,7 @@ var ShowOnly = ({
5769
6088
  const hasHighlights = highlightedSeriesSize > 0;
5770
6089
  if (!hasHighlights) return null;
5771
6090
  return /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "ml-auto flex items-center gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(
5772
- import_framer_motion9.motion.div,
6091
+ import_framer_motion13.motion.div,
5773
6092
  {
5774
6093
  whileTap: { scale: hasHighlights ? 0.985 : 1 },
5775
6094
  whileHover: { y: hasHighlights ? -2 : 0 },
@@ -5788,10 +6107,10 @@ var ShowOnly = ({
5788
6107
  !hasHighlights ? "opacity-60 cursor-not-allowed pointer-events-none" : showOnlyHighlighted ? "bg-primary/10 text-primary shadow-sm border border-primary/20" : "bg-transparent text-muted-foreground border border-transparent hover:bg-muted/10 hover:text-foreground"
5789
6108
  ),
5790
6109
  children: showOnlyHighlighted ? /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
5791
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react32.EyeSlash, { size: 16, weight: "regular" }),
6110
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react33.EyeSlash, { size: 16, weight: "regular" }),
5792
6111
  /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "sr-only", children: "Exibir todos" })
5793
6112
  ] }) : /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
5794
- /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react32.Eye, { size: 16, weight: "bold" }),
6113
+ /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_react33.Eye, { size: 16, weight: "bold" }),
5795
6114
  /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "sr-only", children: "Mostrar somente destacados" })
5796
6115
  ] })
5797
6116
  }
@@ -5802,7 +6121,7 @@ var ShowOnly = ({
5802
6121
  var ShowOnly_default = ShowOnly;
5803
6122
 
5804
6123
  // src/components/charts/components/controls/Highlights.tsx
5805
- var import_framer_motion10 = require("framer-motion");
6124
+ var import_framer_motion14 = require("framer-motion");
5806
6125
  var import_ssr3 = require("@phosphor-icons/react/dist/ssr");
5807
6126
  var import_jsx_runtime51 = require("react/jsx-runtime");
5808
6127
  var Highlights = ({
@@ -5823,13 +6142,13 @@ var Highlights = ({
5823
6142
  visible: { opacity: 1, transition: { staggerChildren: 0.03 } }
5824
6143
  };
5825
6144
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
5826
- import_framer_motion10.motion.div,
6145
+ import_framer_motion14.motion.div,
5827
6146
  {
5828
6147
  className: "flex-1 flex items-center gap-2 flex-wrap",
5829
6148
  initial: "hidden",
5830
6149
  animate: "visible",
5831
6150
  variants: containerVariants,
5832
- children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_framer_motion10.AnimatePresence, { initial: false, mode: "popLayout", children: allKeys.map((k) => {
6151
+ children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_framer_motion14.AnimatePresence, { initial: false, mode: "popLayout", children: allKeys.map((k) => {
5833
6152
  const isHighlighted = highlightedSeries.has(k);
5834
6153
  const label = mapperConfig[k]?.label ?? k;
5835
6154
  const color = finalColors[k];
@@ -5839,7 +6158,7 @@ var Highlights = ({
5839
6158
  isHighlighted ? "bg-card/95 border-2 text-foreground shadow-[0_6px_18px_rgba(0,0,0,0.12)]" : "bg-muted/10 border-border text-muted-foreground hover:bg-muted/5"
5840
6159
  );
5841
6160
  return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
5842
- import_framer_motion10.motion.div,
6161
+ import_framer_motion14.motion.div,
5843
6162
  {
5844
6163
  layout: true,
5845
6164
  initial: "hidden",
@@ -5856,7 +6175,7 @@ var Highlights = ({
5856
6175
  style: { minWidth: showFullLabel ? void 0 : 36 },
5857
6176
  "aria-pressed": isHighlighted,
5858
6177
  children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
5859
- import_framer_motion10.motion.button,
6178
+ import_framer_motion14.motion.button,
5860
6179
  {
5861
6180
  whileHover: { scale: isHighlighted ? 1.04 : 1.03 },
5862
6181
  whileTap: { scale: 0.96 },
@@ -5864,7 +6183,7 @@ var Highlights = ({
5864
6183
  className: "flex items-center gap-2 min-w-0 pr-2",
5865
6184
  children: [
5866
6185
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
5867
- import_framer_motion10.motion.span,
6186
+ import_framer_motion14.motion.span,
5868
6187
  {
5869
6188
  className: cn("w-3 h-3 rounded-sm flex-shrink-0 border"),
5870
6189
  style: {
@@ -5878,8 +6197,8 @@ var Highlights = ({
5878
6197
  transition: { type: "spring", stiffness: 400, damping: 30 }
5879
6198
  }
5880
6199
  ),
5881
- showFullLabel ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_framer_motion10.motion.span, { className: "truncate max-w-[10rem] pr-2", layout: true, children: label }) : showShortLabel ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
5882
- import_framer_motion10.motion.span,
6200
+ showFullLabel ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_framer_motion14.motion.span, { className: "truncate max-w-[10rem] pr-2", layout: true, children: label }) : showShortLabel ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
6201
+ import_framer_motion14.motion.span,
5883
6202
  {
5884
6203
  className: "truncate max-w-[6rem] text-xs pr-2",
5885
6204
  layout: true,
@@ -5887,7 +6206,7 @@ var Highlights = ({
5887
6206
  }
5888
6207
  ) : null,
5889
6208
  /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
5890
- import_framer_motion10.motion.span,
6209
+ import_framer_motion14.motion.span,
5891
6210
  {
5892
6211
  "aria-hidden": true,
5893
6212
  initial: { opacity: 0, scale: 0.6 },
@@ -5996,9 +6315,9 @@ var CloseAllButton = ({
5996
6315
  var CloseAllButton_default = CloseAllButton;
5997
6316
 
5998
6317
  // src/components/charts/components/tooltips/DraggableTooltip.tsx
5999
- var import_react33 = __toESM(require("react"));
6000
- var import_framer_motion11 = require("framer-motion");
6001
- var import_react34 = require("@phosphor-icons/react");
6318
+ var import_react34 = __toESM(require("react"));
6319
+ var import_framer_motion15 = require("framer-motion");
6320
+ var import_react35 = require("@phosphor-icons/react");
6002
6321
  var import_ssr5 = require("@phosphor-icons/react/dist/ssr");
6003
6322
  var import_jsx_runtime53 = require("react/jsx-runtime");
6004
6323
  var ALIGNMENT_THRESHOLD = 25;
@@ -6075,13 +6394,13 @@ var DraggableTooltipComponent = ({
6075
6394
  toggleHighlight,
6076
6395
  showOnlyHighlighted
6077
6396
  }) => {
6078
- const visibleKeys = (0, import_react33.useMemo)(
6397
+ const visibleKeys = (0, import_react34.useMemo)(
6079
6398
  () => showOnlyHighlighted && highlightedSeries && highlightedSeries.size > 0 ? dataKeys.filter((k) => highlightedSeries.has(k)) : dataKeys,
6080
6399
  [showOnlyHighlighted, highlightedSeries, dataKeys]
6081
6400
  );
6082
- const TotalDisplay = import_react33.default.memo(
6401
+ const TotalDisplay = import_react34.default.memo(
6083
6402
  ({ data: data2, visibleKeys: visibleKeys2 }) => {
6084
- const total = (0, import_react33.useMemo)(() => {
6403
+ const total = (0, import_react34.useMemo)(() => {
6085
6404
  const numeric = visibleKeys2.map((k) => data2[k]).filter((v) => typeof v === "number");
6086
6405
  return numeric.reduce((s, v) => s + (v || 0), 0);
6087
6406
  }, [data2, visibleKeys2]);
@@ -6097,14 +6416,14 @@ var DraggableTooltipComponent = ({
6097
6416
  ] });
6098
6417
  }
6099
6418
  );
6100
- const [localPos, setLocalPos] = (0, import_react33.useState)(position);
6101
- const [dragging, setDragging] = (0, import_react33.useState)(false);
6102
- const offsetRef = (0, import_react33.useRef)({ x: 0, y: 0 });
6103
- const lastMouse = (0, import_react33.useRef)({ x: 0, y: 0 });
6104
- const [alignmentGuides, setAlignmentGuides] = (0, import_react33.useState)([]);
6105
- const [globalTooltipCountLocal, setGlobalTooltipCountLocal] = (0, import_react33.useState)(0);
6106
- (0, import_react33.useEffect)(() => setLocalPos(position), [position]);
6107
- const getAllTooltips = (0, import_react33.useCallback)(() => {
6419
+ const [localPos, setLocalPos] = (0, import_react34.useState)(position);
6420
+ const [dragging, setDragging] = (0, import_react34.useState)(false);
6421
+ const offsetRef = (0, import_react34.useRef)({ x: 0, y: 0 });
6422
+ const lastMouse = (0, import_react34.useRef)({ x: 0, y: 0 });
6423
+ const [alignmentGuides, setAlignmentGuides] = (0, import_react34.useState)([]);
6424
+ const [globalTooltipCountLocal, setGlobalTooltipCountLocal] = (0, import_react34.useState)(0);
6425
+ (0, import_react34.useEffect)(() => setLocalPos(position), [position]);
6426
+ const getAllTooltips = (0, import_react34.useCallback)(() => {
6108
6427
  const response = [];
6109
6428
  const ev = new CustomEvent("requestGlobalTooltips", {
6110
6429
  detail: { requesterId: id, response }
@@ -6112,7 +6431,7 @@ var DraggableTooltipComponent = ({
6112
6431
  window.dispatchEvent(ev);
6113
6432
  return response;
6114
6433
  }, [id]);
6115
- const updateAlignmentGuides = (0, import_react33.useCallback)(
6434
+ const updateAlignmentGuides = (0, import_react34.useCallback)(
6116
6435
  (currentPosition) => {
6117
6436
  const allTooltips = getAllTooltips();
6118
6437
  const otherTooltips = allTooltips.filter((t) => t.id !== id);
@@ -6161,7 +6480,7 @@ var DraggableTooltipComponent = ({
6161
6480
  },
6162
6481
  [getAllTooltips, id]
6163
6482
  );
6164
- const snapToGuides = (0, import_react33.useCallback)(
6483
+ const snapToGuides = (0, import_react34.useCallback)(
6165
6484
  (position2) => {
6166
6485
  const snappedPosition = { ...position2 };
6167
6486
  let hasSnapped = false;
@@ -6208,7 +6527,7 @@ var DraggableTooltipComponent = ({
6208
6527
  },
6209
6528
  [alignmentGuides]
6210
6529
  );
6211
- (0, import_react33.useEffect)(() => {
6530
+ (0, import_react34.useEffect)(() => {
6212
6531
  let rafId = null;
6213
6532
  const handleMouseMove = (e) => {
6214
6533
  if (!dragging) return;
@@ -6250,7 +6569,7 @@ var DraggableTooltipComponent = ({
6250
6569
  document.body.style.userSelect = "";
6251
6570
  };
6252
6571
  }, [dragging, snapToGuides, updateAlignmentGuides, id, onPositionChange]);
6253
- (0, import_react33.useEffect)(() => {
6572
+ (0, import_react34.useEffect)(() => {
6254
6573
  const handleCloseAll = () => onClose(id);
6255
6574
  const handleRequestTooltipCount = () => {
6256
6575
  window.dispatchEvent(
@@ -6281,7 +6600,7 @@ var DraggableTooltipComponent = ({
6281
6600
  });
6282
6601
  };
6283
6602
  }, [id, localPos, onClose]);
6284
- (0, import_react33.useEffect)(() => {
6603
+ (0, import_react34.useEffect)(() => {
6285
6604
  if (dragging) return;
6286
6605
  let total = 0;
6287
6606
  const timeoutId = setTimeout(() => {
@@ -6299,7 +6618,7 @@ var DraggableTooltipComponent = ({
6299
6618
  }, 0);
6300
6619
  return () => clearTimeout(timeoutId);
6301
6620
  }, [localPos, dragging]);
6302
- (0, import_react33.useEffect)(() => {
6621
+ (0, import_react34.useEffect)(() => {
6303
6622
  const recount = () => {
6304
6623
  if (dragging) return;
6305
6624
  let total = 0;
@@ -6317,7 +6636,7 @@ var DraggableTooltipComponent = ({
6317
6636
  window.addEventListener("recountTooltips", recount);
6318
6637
  return () => window.removeEventListener("recountTooltips", recount);
6319
6638
  }, [dragging]);
6320
- const handleMouseDownLocal = (0, import_react33.useCallback)(
6639
+ const handleMouseDownLocal = (0, import_react34.useCallback)(
6321
6640
  (e) => {
6322
6641
  e.preventDefault();
6323
6642
  e.stopPropagation();
@@ -6328,7 +6647,7 @@ var DraggableTooltipComponent = ({
6328
6647
  },
6329
6648
  [id, onMouseDown]
6330
6649
  );
6331
- const handleTouchStartLocal = (0, import_react33.useCallback)(
6650
+ const handleTouchStartLocal = (0, import_react34.useCallback)(
6332
6651
  (e) => {
6333
6652
  e.stopPropagation();
6334
6653
  const touch = e.touches[0];
@@ -6343,7 +6662,7 @@ var DraggableTooltipComponent = ({
6343
6662
  },
6344
6663
  [id, onMouseDown]
6345
6664
  );
6346
- const handleCloseClick = (0, import_react33.useCallback)(
6665
+ const handleCloseClick = (0, import_react34.useCallback)(
6347
6666
  (e) => {
6348
6667
  e.stopPropagation();
6349
6668
  onClose(id);
@@ -6372,7 +6691,7 @@ var DraggableTooltipComponent = ({
6372
6691
  );
6373
6692
  return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { children: [
6374
6693
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
6375
- import_framer_motion11.motion.div,
6694
+ import_framer_motion15.motion.div,
6376
6695
  {
6377
6696
  className: "fixed pointer-events-none z-30",
6378
6697
  variants: guideVariants,
@@ -6394,7 +6713,7 @@ var DraggableTooltipComponent = ({
6394
6713
  }
6395
6714
  ),
6396
6715
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
6397
- import_framer_motion11.motion.div,
6716
+ import_framer_motion15.motion.div,
6398
6717
  {
6399
6718
  className: "fixed pointer-events-none z-31",
6400
6719
  variants: guideDotVariants,
@@ -6413,7 +6732,7 @@ var DraggableTooltipComponent = ({
6413
6732
  }
6414
6733
  ),
6415
6734
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
6416
- import_framer_motion11.motion.div,
6735
+ import_framer_motion15.motion.div,
6417
6736
  {
6418
6737
  className: "fixed pointer-events-none z-31",
6419
6738
  variants: guideDotVariants,
@@ -6433,8 +6752,8 @@ var DraggableTooltipComponent = ({
6433
6752
  )
6434
6753
  ] }, index);
6435
6754
  }),
6436
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_framer_motion11.AnimatePresence, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
6437
- import_framer_motion11.motion.div,
6755
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_framer_motion15.AnimatePresence, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
6756
+ import_framer_motion15.motion.div,
6438
6757
  {
6439
6758
  className: "fixed bg-card border border-border rounded-lg shadow-lg z-50 min-w-80 select-none",
6440
6759
  variants: tooltipVariants,
@@ -6459,7 +6778,7 @@ var DraggableTooltipComponent = ({
6459
6778
  onTouchStart: handleTouchStartLocal,
6460
6779
  style: { touchAction: "none" },
6461
6780
  children: [
6462
- /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react34.DotsSixVerticalIcon, { size: 16 }),
6781
+ /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_react35.DotsSixVerticalIcon, { size: 16 }),
6463
6782
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex flex-col gap-1", children: title && /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("div", { className: "flex items-center gap-2 pb-0.5", children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "font-bold text-foreground text-base", children: title }) }) }),
6464
6783
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
6465
6784
  "button",
@@ -6482,7 +6801,7 @@ var DraggableTooltipComponent = ({
6482
6801
  ] }) }),
6483
6802
  /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "p-3 pt-2 space-y-2", children: [
6484
6803
  /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-xs font-medium text-muted-foreground uppercase tracking-wide mb-2", children: dataLabel }),
6485
- (0, import_react33.useMemo)(
6804
+ (0, import_react34.useMemo)(
6486
6805
  () => visibleKeys.map((key) => {
6487
6806
  const value = data[key];
6488
6807
  if (value === void 0) return null;
@@ -6592,7 +6911,7 @@ var DraggableTooltipComponent = ({
6592
6911
  )
6593
6912
  ] });
6594
6913
  };
6595
- var DraggableTooltip = import_react33.default.memo(DraggableTooltipComponent);
6914
+ var DraggableTooltip = import_react34.default.memo(DraggableTooltipComponent);
6596
6915
  DraggableTooltip.displayName = "DraggableTooltip";
6597
6916
  var DraggableTooltip_default = DraggableTooltip;
6598
6917
 
@@ -6888,7 +7207,7 @@ var Chart = ({
6888
7207
  maxTooltips = 5,
6889
7208
  chartMargin
6890
7209
  }) => {
6891
- const smartConfig = (0, import_react35.useMemo)(() => {
7210
+ const smartConfig = (0, import_react36.useMemo)(() => {
6892
7211
  const resolvedXAxisKey = typeof xAxis === "string" ? xAxis : xAxis && xAxis.dataKey || detectXAxis(data);
6893
7212
  const xAxisConfig2 = typeof xAxis === "string" ? {
6894
7213
  dataKey: resolvedXAxisKey,
@@ -6912,12 +7231,12 @@ var Chart = ({
6912
7231
  return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
6913
7232
  }, [data, xAxis, labelMap]);
6914
7233
  const { xAxisConfig, mapperConfig } = smartConfig;
6915
- const [activeTooltips, setActiveTooltips] = (0, import_react35.useState)([]);
6916
- const [highlightedSeries, setHighlightedSeries] = (0, import_react35.useState)(
7234
+ const [activeTooltips, setActiveTooltips] = (0, import_react36.useState)([]);
7235
+ const [highlightedSeries, setHighlightedSeries] = (0, import_react36.useState)(
6917
7236
  /* @__PURE__ */ new Set()
6918
7237
  );
6919
- const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react35.useState)(false);
6920
- (0, import_react35.useEffect)(() => {
7238
+ const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react36.useState)(false);
7239
+ (0, import_react36.useEffect)(() => {
6921
7240
  if (highlightedSeries.size === 0 && showOnlyHighlighted) {
6922
7241
  setShowOnlyHighlighted(false);
6923
7242
  }
@@ -6926,9 +7245,9 @@ var Chart = ({
6926
7245
  ...item,
6927
7246
  name: String(item[xAxisConfig.dataKey] || "N/A")
6928
7247
  }));
6929
- const wrapperRef = (0, import_react35.useRef)(null);
6930
- const [measuredWidth, setMeasuredWidth] = (0, import_react35.useState)(null);
6931
- (0, import_react35.useLayoutEffect)(() => {
7248
+ const wrapperRef = (0, import_react36.useRef)(null);
7249
+ const [measuredWidth, setMeasuredWidth] = (0, import_react36.useState)(null);
7250
+ (0, import_react36.useLayoutEffect)(() => {
6932
7251
  const el = wrapperRef.current;
6933
7252
  if (!el) return;
6934
7253
  const ro = new ResizeObserver((entries) => {
@@ -6955,7 +7274,7 @@ var Chart = ({
6955
7274
  );
6956
7275
  }
6957
7276
  const allKeys = seriesOrder.map((s) => s.key).filter(Boolean);
6958
- const generateColors = (0, import_react35.useCallback)(
7277
+ const generateColors = (0, import_react36.useCallback)(
6959
7278
  (dataKeys) => {
6960
7279
  const colorMap = {};
6961
7280
  const allColors = generateAdditionalColors(colors2, dataKeys.length);
@@ -6966,25 +7285,25 @@ var Chart = ({
6966
7285
  },
6967
7286
  [colors2, mapperConfig]
6968
7287
  );
6969
- const finalColors = (0, import_react35.useMemo)(
7288
+ const finalColors = (0, import_react36.useMemo)(
6970
7289
  () => generateColors(allKeys),
6971
7290
  [generateColors, allKeys]
6972
7291
  );
6973
- const adaptDataForTooltip = (0, import_react35.useCallback)(
7292
+ const adaptDataForTooltip = (0, import_react36.useCallback)(
6974
7293
  (universalData) => ({
6975
7294
  ...universalData,
6976
7295
  name: String(universalData[xAxisConfig.dataKey] || "N/A")
6977
7296
  }),
6978
7297
  [xAxisConfig.dataKey]
6979
7298
  );
6980
- const activePeriods = (0, import_react35.useMemo)(
7299
+ const activePeriods = (0, import_react36.useMemo)(
6981
7300
  () => activeTooltips.map((t) => adaptDataForTooltip(t.data).name),
6982
7301
  [activeTooltips, adaptDataForTooltip]
6983
7302
  );
6984
- (0, import_react35.useEffect)(() => {
7303
+ (0, import_react36.useEffect)(() => {
6985
7304
  window.dispatchEvent(new Event("recountTooltips"));
6986
7305
  }, [activeTooltips.length]);
6987
- const toggleHighlight = (0, import_react35.useCallback)((key) => {
7306
+ const toggleHighlight = (0, import_react36.useCallback)((key) => {
6988
7307
  setHighlightedSeries((prev) => {
6989
7308
  const next = new Set(prev);
6990
7309
  if (next.has(key)) next.delete(key);
@@ -6992,7 +7311,7 @@ var Chart = ({
6992
7311
  return next;
6993
7312
  });
6994
7313
  }, []);
6995
- const maxDataValue = (0, import_react35.useMemo)(() => {
7314
+ const maxDataValue = (0, import_react36.useMemo)(() => {
6996
7315
  let max = 0;
6997
7316
  const numericKeys = allKeys;
6998
7317
  for (const row of processedData) {
@@ -7004,7 +7323,7 @@ var Chart = ({
7004
7323
  }
7005
7324
  return max;
7006
7325
  }, [processedData, allKeys]);
7007
- const minDataValue = (0, import_react35.useMemo)(() => {
7326
+ const minDataValue = (0, import_react36.useMemo)(() => {
7008
7327
  let min = 0;
7009
7328
  const numericKeys = allKeys;
7010
7329
  for (const row of processedData) {
@@ -7017,7 +7336,7 @@ var Chart = ({
7017
7336
  }
7018
7337
  return min;
7019
7338
  }, [processedData, allKeys]);
7020
- const niceMax = (0, import_react35.useMemo)(() => {
7339
+ const niceMax = (0, import_react36.useMemo)(() => {
7021
7340
  let padding = 0.08;
7022
7341
  if (maxDataValue > 1e6) padding = 0.05;
7023
7342
  if (maxDataValue > 1e7) padding = 0.03;
@@ -7025,7 +7344,7 @@ var Chart = ({
7025
7344
  const padded = maxDataValue * (1 + padding);
7026
7345
  return niceCeil(padded);
7027
7346
  }, [maxDataValue]);
7028
- const computedWidth = (0, import_react35.useMemo)(() => {
7347
+ const computedWidth = (0, import_react36.useMemo)(() => {
7029
7348
  if (typeof width === "number") return width;
7030
7349
  const points = Math.max(1, processedData.length);
7031
7350
  const barCount = series?.bar?.length ?? 0;
@@ -7054,7 +7373,7 @@ var Chart = ({
7054
7373
  series?.area?.length,
7055
7374
  niceMax
7056
7375
  ]);
7057
- const toggleTooltip = (0, import_react35.useCallback)(
7376
+ const toggleTooltip = (0, import_react36.useCallback)(
7058
7377
  (tooltipId, data2, basePosition) => {
7059
7378
  const existingIndex = activeTooltips.findIndex((t) => t.id === tooltipId);
7060
7379
  if (existingIndex !== -1) {
@@ -7083,7 +7402,7 @@ var Chart = ({
7083
7402
  },
7084
7403
  [activeTooltips, maxTooltips]
7085
7404
  );
7086
- const handleChartClick = (0, import_react35.useCallback)(
7405
+ const handleChartClick = (0, import_react36.useCallback)(
7087
7406
  (e) => {
7088
7407
  if (!enableDraggableTooltips) return;
7089
7408
  const ev = e;
@@ -7101,7 +7420,7 @@ var Chart = ({
7101
7420
  },
7102
7421
  [enableDraggableTooltips, xAxisConfig.dataKey, toggleTooltip]
7103
7422
  );
7104
- const handleBarClick = (0, import_react35.useCallback)(
7423
+ const handleBarClick = (0, import_react36.useCallback)(
7105
7424
  (data2, index, event) => {
7106
7425
  if (!enableDraggableTooltips) return;
7107
7426
  event.stopPropagation();
@@ -7115,7 +7434,7 @@ var Chart = ({
7115
7434
  },
7116
7435
  [enableDraggableTooltips, xAxisConfig.dataKey, toggleTooltip]
7117
7436
  );
7118
- const handleSeriesClick = (0, import_react35.useCallback)(
7437
+ const handleSeriesClick = (0, import_react36.useCallback)(
7119
7438
  (...args) => {
7120
7439
  if (args.length >= 3) {
7121
7440
  const [data2, index, event] = args;
@@ -7126,7 +7445,7 @@ var Chart = ({
7126
7445
  },
7127
7446
  [handleBarClick, handleChartClick]
7128
7447
  );
7129
- const onTooltipPositionChange = (0, import_react35.useCallback)(
7448
+ const onTooltipPositionChange = (0, import_react36.useCallback)(
7130
7449
  (id, position) => {
7131
7450
  setActiveTooltips(
7132
7451
  (prev) => prev.map((t) => t.id === id ? { ...t, position } : t)
@@ -7134,7 +7453,7 @@ var Chart = ({
7134
7453
  },
7135
7454
  []
7136
7455
  );
7137
- const titleClassName = (0, import_react35.useMemo)(
7456
+ const titleClassName = (0, import_react36.useMemo)(
7138
7457
  () => "text-xl font-semibold text-foreground mb-3",
7139
7458
  []
7140
7459
  );
@@ -7151,7 +7470,7 @@ var Chart = ({
7151
7470
  const measuredInner = measuredWidth ? Math.max(0, measuredWidth - 32) : void 0;
7152
7471
  const effectiveChartWidth = typeof width === "number" ? width : measuredInner ?? computedWidth;
7153
7472
  const chartInnerWidth = effectiveChartWidth - finalChartLeftMargin - finalChartRightMargin;
7154
- const openTooltipForPeriod = (0, import_react35.useCallback)(
7473
+ const openTooltipForPeriod = (0, import_react36.useCallback)(
7155
7474
  (periodName) => {
7156
7475
  if (!enableDraggableTooltips) return;
7157
7476
  const row = processedData.find((r) => String(r.name) === periodName);
@@ -7534,7 +7853,7 @@ var Chart = ({
7534
7853
  var Chart_default = Chart;
7535
7854
 
7536
7855
  // src/components/charts/BarChart.tsx
7537
- var import_react36 = require("react");
7856
+ var import_react37 = require("react");
7538
7857
  var import_recharts2 = require("recharts");
7539
7858
  var import_jsx_runtime58 = require("react/jsx-runtime");
7540
7859
  var DEFAULT_COLORS2 = ["#55af7d", "#8e68ff", "#2273e1"];
@@ -7566,7 +7885,7 @@ var BarChart = ({
7566
7885
  containerPaddingLeft,
7567
7886
  16
7568
7887
  );
7569
- const smartConfig = (0, import_react36.useMemo)(() => {
7888
+ const smartConfig = (0, import_react37.useMemo)(() => {
7570
7889
  const providedMapper = yAxis ?? mapper;
7571
7890
  if (autoDetect === true || xAxis == null || providedMapper == null) {
7572
7891
  const detectedXAxis = detectXAxis(data);
@@ -7616,14 +7935,14 @@ var BarChart = ({
7616
7935
  return { xAxisConfig: xAxisConfig2, mapperConfig: mapperConfig2 };
7617
7936
  }, [data, xAxis, mapper, yAxis, autoDetect, labelMap]);
7618
7937
  const { xAxisConfig, mapperConfig } = smartConfig;
7619
- const [activeTooltips, setActiveTooltips] = (0, import_react36.useState)([]);
7620
- const [isDragging, setIsDragging] = (0, import_react36.useState)(null);
7621
- const [dragOffset, setDragOffset] = (0, import_react36.useState)({
7938
+ const [activeTooltips, setActiveTooltips] = (0, import_react37.useState)([]);
7939
+ const [isDragging, setIsDragging] = (0, import_react37.useState)(null);
7940
+ const [dragOffset, setDragOffset] = (0, import_react37.useState)({
7622
7941
  x: 0,
7623
7942
  y: 0
7624
7943
  });
7625
- const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react36.useState)(0);
7626
- const [alignmentGuides, setAlignmentGuides] = (0, import_react36.useState)([]);
7944
+ const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react37.useState)(0);
7945
+ const [alignmentGuides, setAlignmentGuides] = (0, import_react37.useState)([]);
7627
7946
  const processedData = data.map((item) => ({
7628
7947
  ...item,
7629
7948
  name: String(item[xAxisConfig.dataKey] || "N/A")
@@ -7646,7 +7965,7 @@ var BarChart = ({
7646
7965
  // Garantir que tem a propriedade 'name'
7647
7966
  };
7648
7967
  };
7649
- const maxDataValue = (0, import_react36.useMemo)(() => {
7968
+ const maxDataValue = (0, import_react37.useMemo)(() => {
7650
7969
  let max = 0;
7651
7970
  const keys = Object.keys(mapperConfig);
7652
7971
  for (const row of processedData) {
@@ -7659,7 +7978,7 @@ var BarChart = ({
7659
7978
  }
7660
7979
  return max;
7661
7980
  }, [processedData, mapperConfig]);
7662
- const niceMax = (0, import_react36.useMemo)(() => {
7981
+ const niceMax = (0, import_react37.useMemo)(() => {
7663
7982
  let padding2 = 0.08;
7664
7983
  if (maxDataValue > 1e6) padding2 = 0.05;
7665
7984
  if (maxDataValue > 1e7) padding2 = 0.03;
@@ -7700,7 +8019,7 @@ var BarChart = ({
7700
8019
  const GUIDE_THRESHOLD2 = 60;
7701
8020
  const STRONG_SNAP_THRESHOLD2 = 35;
7702
8021
  const PRECISION_SNAP_THRESHOLD2 = 8;
7703
- const updateAlignmentGuides = (0, import_react36.useCallback)(
8022
+ const updateAlignmentGuides = (0, import_react37.useCallback)(
7704
8023
  (draggedTooltipId, currentPosition) => {
7705
8024
  if (!isDragging) return;
7706
8025
  const getAllTooltips = () => {
@@ -7764,7 +8083,7 @@ var BarChart = ({
7764
8083
  },
7765
8084
  [isDragging, activeTooltips]
7766
8085
  );
7767
- const snapToGuides = (0, import_react36.useCallback)(
8086
+ const snapToGuides = (0, import_react37.useCallback)(
7768
8087
  (position) => {
7769
8088
  const snappedPosition = { ...position };
7770
8089
  let hasSnapped = false;
@@ -7826,7 +8145,7 @@ var BarChart = ({
7826
8145
  setIsDragging(tooltipId);
7827
8146
  setDragOffset({ x: offsetX, y: offsetY });
7828
8147
  };
7829
- (0, import_react36.useEffect)(() => {
8148
+ (0, import_react37.useEffect)(() => {
7830
8149
  let rafId;
7831
8150
  let lastMousePosition = { x: 0, y: 0 };
7832
8151
  const handleGlobalMouseMove = (e) => {
@@ -7884,7 +8203,7 @@ var BarChart = ({
7884
8203
  updateAlignmentGuides,
7885
8204
  snapToGuides
7886
8205
  ]);
7887
- (0, import_react36.useEffect)(() => {
8206
+ (0, import_react37.useEffect)(() => {
7888
8207
  const handleCloseAllTooltips = () => {
7889
8208
  setActiveTooltips([]);
7890
8209
  setGlobalTooltipCount(0);
@@ -7894,7 +8213,7 @@ var BarChart = ({
7894
8213
  window.removeEventListener("closeAllTooltips", handleCloseAllTooltips);
7895
8214
  };
7896
8215
  }, []);
7897
- (0, import_react36.useEffect)(() => {
8216
+ (0, import_react37.useEffect)(() => {
7898
8217
  const handleTooltipCountRequest = () => {
7899
8218
  window.dispatchEvent(
7900
8219
  new CustomEvent("tooltipCountResponse", {
@@ -7933,7 +8252,7 @@ var BarChart = ({
7933
8252
  );
7934
8253
  };
7935
8254
  }, [activeTooltips]);
7936
- (0, import_react36.useEffect)(() => {
8255
+ (0, import_react37.useEffect)(() => {
7937
8256
  if (isDragging) return;
7938
8257
  let totalCount = 0;
7939
8258
  const handleCountResponse = (event) => {
@@ -8199,7 +8518,7 @@ var BarChart = ({
8199
8518
  var BarChart_default = BarChart;
8200
8519
 
8201
8520
  // src/components/charts/LineChart.tsx
8202
- var import_react37 = require("react");
8521
+ var import_react38 = require("react");
8203
8522
  var import_recharts3 = require("recharts");
8204
8523
  var import_jsx_runtime59 = require("react/jsx-runtime");
8205
8524
  var defaultData = [
@@ -8233,14 +8552,14 @@ var CustomLineChart = ({
8233
8552
  containerPaddingLeft,
8234
8553
  16
8235
8554
  );
8236
- const [activeTooltips, setActiveTooltips] = (0, import_react37.useState)([]);
8237
- const [isDragging, setIsDragging] = (0, import_react37.useState)(null);
8238
- const [dragOffset, setDragOffset] = (0, import_react37.useState)({
8555
+ const [activeTooltips, setActiveTooltips] = (0, import_react38.useState)([]);
8556
+ const [isDragging, setIsDragging] = (0, import_react38.useState)(null);
8557
+ const [dragOffset, setDragOffset] = (0, import_react38.useState)({
8239
8558
  x: 0,
8240
8559
  y: 0
8241
8560
  });
8242
- const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react37.useState)(0);
8243
- const [alignmentGuides, setAlignmentGuides] = (0, import_react37.useState)([]);
8561
+ const [globalTooltipCount, setGlobalTooltipCount] = (0, import_react38.useState)(0);
8562
+ const [alignmentGuides, setAlignmentGuides] = (0, import_react38.useState)([]);
8244
8563
  const generateColors = (dataKeys2) => {
8245
8564
  const colorMap = {};
8246
8565
  const allColors = generateAdditionalColors(colors2, dataKeys2.length);
@@ -8249,12 +8568,12 @@ var CustomLineChart = ({
8249
8568
  });
8250
8569
  return colorMap;
8251
8570
  };
8252
- const dataKeys = (0, import_react37.useMemo)(
8571
+ const dataKeys = (0, import_react38.useMemo)(
8253
8572
  () => data.length > 0 ? Object.keys(data[0]).filter((key) => key !== "name") : [],
8254
8573
  [data]
8255
8574
  );
8256
8575
  const finalColors = generateColors(dataKeys);
8257
- const maxDataValue = (0, import_react37.useMemo)(() => {
8576
+ const maxDataValue = (0, import_react38.useMemo)(() => {
8258
8577
  let max = 0;
8259
8578
  for (const row of data) {
8260
8579
  const r = row;
@@ -8266,7 +8585,7 @@ var CustomLineChart = ({
8266
8585
  }
8267
8586
  return max;
8268
8587
  }, [data, dataKeys]);
8269
- const niceMax = (0, import_react37.useMemo)(() => {
8588
+ const niceMax = (0, import_react38.useMemo)(() => {
8270
8589
  let padding2 = 0.08;
8271
8590
  if (maxDataValue > 1e6) padding2 = 0.05;
8272
8591
  if (maxDataValue > 1e7) padding2 = 0.03;
@@ -8342,10 +8661,10 @@ var CustomLineChart = ({
8342
8661
  const handleChartBackgroundClick = () => {
8343
8662
  setActiveTooltips([]);
8344
8663
  };
8345
- const handleCloseAllTooltips = (0, import_react37.useCallback)(() => {
8664
+ const handleCloseAllTooltips = (0, import_react38.useCallback)(() => {
8346
8665
  window.dispatchEvent(new CustomEvent("closeAllTooltips"));
8347
8666
  }, []);
8348
- const updateAlignmentGuides = (0, import_react37.useCallback)(
8667
+ const updateAlignmentGuides = (0, import_react38.useCallback)(
8349
8668
  (draggedTooltipId, draggedPosition) => {
8350
8669
  const SNAP_THRESHOLD = 15;
8351
8670
  const draggedTooltip = activeTooltips.find(
@@ -8426,7 +8745,7 @@ var CustomLineChart = ({
8426
8745
  },
8427
8746
  [activeTooltips]
8428
8747
  );
8429
- const snapToGuides = (0, import_react37.useCallback)(
8748
+ const snapToGuides = (0, import_react38.useCallback)(
8430
8749
  (position) => {
8431
8750
  const SNAP_DISTANCE = 10;
8432
8751
  const snappedPosition = { ...position };
@@ -8454,7 +8773,7 @@ var CustomLineChart = ({
8454
8773
  setIsDragging(tooltipId);
8455
8774
  setDragOffset({ x: offsetX, y: offsetY });
8456
8775
  };
8457
- (0, import_react37.useEffect)(() => {
8776
+ (0, import_react38.useEffect)(() => {
8458
8777
  let rafId;
8459
8778
  let lastMousePosition = { x: 0, y: 0 };
8460
8779
  const handleGlobalMouseMove = (e) => {
@@ -8501,7 +8820,7 @@ var CustomLineChart = ({
8501
8820
  updateAlignmentGuides,
8502
8821
  snapToGuides
8503
8822
  ]);
8504
- (0, import_react37.useEffect)(() => {
8823
+ (0, import_react38.useEffect)(() => {
8505
8824
  const handleCloseAllTooltips2 = () => {
8506
8825
  setActiveTooltips([]);
8507
8826
  setGlobalTooltipCount(0);
@@ -8511,7 +8830,7 @@ var CustomLineChart = ({
8511
8830
  window.removeEventListener("closeAllTooltips", handleCloseAllTooltips2);
8512
8831
  };
8513
8832
  }, []);
8514
- (0, import_react37.useEffect)(() => {
8833
+ (0, import_react38.useEffect)(() => {
8515
8834
  const handleTooltipCountRequest = () => {
8516
8835
  window.dispatchEvent(
8517
8836
  new CustomEvent("tooltipCountResponse", {
@@ -8555,7 +8874,7 @@ var CustomLineChart = ({
8555
8874
  );
8556
8875
  };
8557
8876
  }, [activeTooltips]);
8558
- (0, import_react37.useEffect)(() => {
8877
+ (0, import_react38.useEffect)(() => {
8559
8878
  if (isDragging) return;
8560
8879
  let totalCount = 0;
8561
8880
  const handleCountResponse = (event) => {
@@ -8877,13 +9196,13 @@ var CustomPieChart = ({
8877
9196
  var PieChart_default = CustomPieChart;
8878
9197
 
8879
9198
  // src/components/charts/hooks/useChartHighlights.tsx
8880
- var import_react38 = require("react");
9199
+ var import_react39 = require("react");
8881
9200
  var useChartHighlights = () => {
8882
- const [highlightedSeries, setHighlightedSeries] = (0, import_react38.useState)(
9201
+ const [highlightedSeries, setHighlightedSeries] = (0, import_react39.useState)(
8883
9202
  /* @__PURE__ */ new Set()
8884
9203
  );
8885
- const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react38.useState)(false);
8886
- const toggleHighlight = (0, import_react38.useCallback)((key) => {
9204
+ const [showOnlyHighlighted, setShowOnlyHighlighted] = (0, import_react39.useState)(false);
9205
+ const toggleHighlight = (0, import_react39.useCallback)((key) => {
8887
9206
  setHighlightedSeries((prev) => {
8888
9207
  const next = new Set(prev);
8889
9208
  if (next.has(key)) {
@@ -8894,17 +9213,17 @@ var useChartHighlights = () => {
8894
9213
  return next;
8895
9214
  });
8896
9215
  }, []);
8897
- const clearHighlights = (0, import_react38.useCallback)(() => {
9216
+ const clearHighlights = (0, import_react39.useCallback)(() => {
8898
9217
  setHighlightedSeries(/* @__PURE__ */ new Set());
8899
9218
  setShowOnlyHighlighted(false);
8900
9219
  }, []);
8901
- const isHighlighted = (0, import_react38.useCallback)(
9220
+ const isHighlighted = (0, import_react39.useCallback)(
8902
9221
  (key) => {
8903
9222
  return highlightedSeries.has(key);
8904
9223
  },
8905
9224
  [highlightedSeries]
8906
9225
  );
8907
- const getSeriesStyle = (0, import_react38.useCallback)(
9226
+ const getSeriesStyle = (0, import_react39.useCallback)(
8908
9227
  (key) => {
8909
9228
  const hasHighlights = highlightedSeries.size > 0;
8910
9229
  const isSeriesHighlighted = highlightedSeries.has(key);
@@ -8949,14 +9268,1143 @@ var useChartHighlights = () => {
8949
9268
  };
8950
9269
  };
8951
9270
 
9271
+ // src/components/ui/SmallButtons.tsx
9272
+ var import_react40 = require("@phosphor-icons/react");
9273
+ var import_jsx_runtime61 = require("react/jsx-runtime");
9274
+ var EditButton = ({
9275
+ disabled,
9276
+ onClick,
9277
+ testid = "button-edit",
9278
+ className,
9279
+ iconSize = 18,
9280
+ iconColor,
9281
+ variant = "default",
9282
+ size = "icon",
9283
+ ...props
9284
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9285
+ ButtonBase,
9286
+ {
9287
+ variant,
9288
+ size,
9289
+ onClick,
9290
+ disabled,
9291
+ testid,
9292
+ className: cn(
9293
+ "transition-all duration-200 ease-in-out group",
9294
+ "hover:scale-105 hover:bg-primary",
9295
+ "active:scale-95",
9296
+ "disabled:hover:scale-100",
9297
+ className
9298
+ ),
9299
+ ...props,
9300
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9301
+ import_react40.PencilSimpleIcon,
9302
+ {
9303
+ size: iconSize,
9304
+ color: iconColor,
9305
+ className: "transition-transform duration-200 group-hover:-rotate-12"
9306
+ }
9307
+ )
9308
+ }
9309
+ );
9310
+ var SaveButton = ({
9311
+ disabled,
9312
+ onClick,
9313
+ testid = "button-save",
9314
+ className,
9315
+ iconSize = 18,
9316
+ iconColor,
9317
+ variant = "default",
9318
+ size = "icon",
9319
+ ...props
9320
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9321
+ ButtonBase,
9322
+ {
9323
+ variant,
9324
+ size,
9325
+ onClick,
9326
+ disabled,
9327
+ testid,
9328
+ className: cn(
9329
+ "transition-all duration-200 ease-in-out group",
9330
+ "hover:scale-105",
9331
+ "active:scale-95",
9332
+ "disabled:hover:scale-100",
9333
+ className
9334
+ ),
9335
+ ...props,
9336
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9337
+ import_react40.FloppyDiskIcon,
9338
+ {
9339
+ size: iconSize,
9340
+ color: iconColor,
9341
+ className: "transition-transform duration-200 group-hover:scale-110"
9342
+ }
9343
+ )
9344
+ }
9345
+ );
9346
+ var AddButton = ({
9347
+ disabled,
9348
+ onClick,
9349
+ testid = "button-add",
9350
+ className,
9351
+ iconSize = 18,
9352
+ iconColor,
9353
+ variant = "default",
9354
+ size = "icon",
9355
+ ...props
9356
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9357
+ ButtonBase,
9358
+ {
9359
+ variant,
9360
+ size,
9361
+ onClick,
9362
+ disabled,
9363
+ testid,
9364
+ className: cn(
9365
+ "transition-all duration-200 ease-in-out",
9366
+ "hover:scale-105",
9367
+ "active:scale-95",
9368
+ "disabled:hover:scale-100",
9369
+ className
9370
+ ),
9371
+ ...props,
9372
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9373
+ import_react40.PlusIcon,
9374
+ {
9375
+ size: iconSize,
9376
+ color: iconColor,
9377
+ className: "transition-transform duration-300"
9378
+ }
9379
+ )
9380
+ }
9381
+ );
9382
+ var CloseButton = ({
9383
+ disabled,
9384
+ onClick,
9385
+ testid = "button-close",
9386
+ className,
9387
+ iconSize = 18,
9388
+ iconColor,
9389
+ variant = "ghost",
9390
+ size = "icon",
9391
+ ...props
9392
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9393
+ ButtonBase,
9394
+ {
9395
+ variant,
9396
+ size,
9397
+ onClick,
9398
+ disabled,
9399
+ testid,
9400
+ className: cn(
9401
+ "transition-all duration-200 ease-in-out",
9402
+ "hover:scale-110 hover:rotate-90 hover:bg-destructive/10",
9403
+ "active:scale-95 active:rotate-0",
9404
+ "disabled:hover:scale-100 disabled:hover:rotate-0",
9405
+ className
9406
+ ),
9407
+ ...props,
9408
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9409
+ import_react40.XIcon,
9410
+ {
9411
+ size: iconSize,
9412
+ color: iconColor,
9413
+ className: "transition-transform duration-300"
9414
+ }
9415
+ )
9416
+ }
9417
+ );
9418
+ var DeleteButton = ({
9419
+ disabled,
9420
+ onClick,
9421
+ testid = "button-delete",
9422
+ className,
9423
+ iconSize = 18,
9424
+ iconColor,
9425
+ variant = "destructive",
9426
+ size = "icon",
9427
+ ...props
9428
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9429
+ ButtonBase,
9430
+ {
9431
+ variant,
9432
+ size,
9433
+ onClick,
9434
+ disabled,
9435
+ testid,
9436
+ className: cn(
9437
+ "transition-all duration-200 ease-in-out group",
9438
+ "hover:scale-105",
9439
+ "active:scale-95",
9440
+ "disabled:hover:scale-100",
9441
+ className
9442
+ ),
9443
+ ...props,
9444
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9445
+ import_react40.TrashIcon,
9446
+ {
9447
+ size: iconSize,
9448
+ color: iconColor,
9449
+ className: "transition-transform duration-200 group-hover:scale-110"
9450
+ }
9451
+ )
9452
+ }
9453
+ );
9454
+ var DownloadButton = ({
9455
+ disabled,
9456
+ onClick,
9457
+ testid = "button-download",
9458
+ ...props
9459
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9460
+ ButtonBase,
9461
+ {
9462
+ variant: "outline",
9463
+ size: "icon",
9464
+ onClick,
9465
+ disabled,
9466
+ testid,
9467
+ className: cn(
9468
+ "transition-all duration-200 ease-in-out group",
9469
+ "hover:scale-105",
9470
+ "active:scale-95",
9471
+ "disabled:hover:scale-100"
9472
+ ),
9473
+ ...props,
9474
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9475
+ import_react40.DownloadSimpleIcon,
9476
+ {
9477
+ size: 18,
9478
+ className: "transition-transform duration-300 group-hover:translate-y-0.5"
9479
+ }
9480
+ )
9481
+ }
9482
+ );
9483
+ var UploadButton = ({
9484
+ disabled,
9485
+ onClick,
9486
+ testid = "button-upload",
9487
+ ...props
9488
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9489
+ ButtonBase,
9490
+ {
9491
+ variant: "outline",
9492
+ size: "icon",
9493
+ onClick,
9494
+ disabled,
9495
+ testid,
9496
+ className: cn(
9497
+ "transition-all duration-200 ease-in-out group",
9498
+ "hover:scale-105",
9499
+ "active:scale-95",
9500
+ "disabled:hover:scale-100"
9501
+ ),
9502
+ ...props,
9503
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9504
+ import_react40.UploadSimpleIcon,
9505
+ {
9506
+ size: 18,
9507
+ className: "transition-transform duration-300 group-hover:-translate-y-0.5"
9508
+ }
9509
+ )
9510
+ }
9511
+ );
9512
+ var CopyButton = ({
9513
+ disabled,
9514
+ onClick,
9515
+ testid = "button-copy",
9516
+ ...props
9517
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9518
+ ButtonBase,
9519
+ {
9520
+ variant: "ghost",
9521
+ size: "icon",
9522
+ onClick,
9523
+ disabled,
9524
+ testid,
9525
+ className: cn(
9526
+ "transition-all duration-200 ease-in-out group",
9527
+ "hover:scale-105",
9528
+ "active:scale-90",
9529
+ "disabled:hover:scale-100"
9530
+ ),
9531
+ ...props,
9532
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9533
+ import_react40.CopyIcon,
9534
+ {
9535
+ size: 18,
9536
+ className: "transition-transform duration-200 group-hover:scale-110"
9537
+ }
9538
+ )
9539
+ }
9540
+ );
9541
+ var RefreshButton = ({
9542
+ disabled,
9543
+ onClick,
9544
+ testid = "button-refresh",
9545
+ ...props
9546
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9547
+ ButtonBase,
9548
+ {
9549
+ variant: "ghost",
9550
+ size: "icon",
9551
+ onClick,
9552
+ disabled,
9553
+ testid,
9554
+ className: cn(
9555
+ "transition-all duration-200 ease-in-out group",
9556
+ "hover:scale-105",
9557
+ "active:scale-95",
9558
+ "disabled:hover:scale-100"
9559
+ ),
9560
+ ...props,
9561
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9562
+ import_react40.ArrowClockwiseIcon,
9563
+ {
9564
+ size: 18,
9565
+ className: "transition-transform duration-500 group-hover:rotate-180"
9566
+ }
9567
+ )
9568
+ }
9569
+ );
9570
+ var SearchButton = ({
9571
+ disabled,
9572
+ onClick,
9573
+ testid = "button-search",
9574
+ ...props
9575
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9576
+ ButtonBase,
9577
+ {
9578
+ variant: "outline",
9579
+ size: "icon",
9580
+ onClick,
9581
+ disabled,
9582
+ testid,
9583
+ className: cn(
9584
+ "transition-all duration-200 ease-in-out group",
9585
+ "hover:scale-105",
9586
+ "active:scale-95",
9587
+ "disabled:hover:scale-100"
9588
+ ),
9589
+ ...props,
9590
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9591
+ import_react40.MagnifyingGlassIcon,
9592
+ {
9593
+ size: 18,
9594
+ className: "transition-transform duration-200 group-hover:scale-110 group-hover:-rotate-12"
9595
+ }
9596
+ )
9597
+ }
9598
+ );
9599
+ var BackButton = ({
9600
+ disabled,
9601
+ onClick,
9602
+ testid = "button-back",
9603
+ ...props
9604
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9605
+ ButtonBase,
9606
+ {
9607
+ variant: "ghost",
9608
+ size: "icon",
9609
+ onClick,
9610
+ disabled,
9611
+ testid,
9612
+ className: cn(
9613
+ "transition-all duration-200 ease-in-out group",
9614
+ "hover:scale-105",
9615
+ "active:scale-95",
9616
+ "disabled:hover:scale-100"
9617
+ ),
9618
+ ...props,
9619
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9620
+ import_react40.ArrowLeftIcon,
9621
+ {
9622
+ size: 18,
9623
+ className: "transition-transform duration-300 group-hover:-translate-x-1"
9624
+ }
9625
+ )
9626
+ }
9627
+ );
9628
+ var SettingsButton = ({
9629
+ disabled,
9630
+ onClick,
9631
+ testid = "button-settings",
9632
+ ...props
9633
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9634
+ ButtonBase,
9635
+ {
9636
+ variant: "ghost",
9637
+ size: "icon",
9638
+ onClick,
9639
+ disabled,
9640
+ testid,
9641
+ className: cn(
9642
+ "transition-all duration-200 ease-in-out group",
9643
+ "hover:scale-105",
9644
+ "active:scale-95",
9645
+ "disabled:hover:scale-100"
9646
+ ),
9647
+ ...props,
9648
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9649
+ import_react40.GearIcon,
9650
+ {
9651
+ size: 18,
9652
+ className: "transition-transform duration-500 group-hover:rotate-90"
9653
+ }
9654
+ )
9655
+ }
9656
+ );
9657
+ var NotificationButton = ({
9658
+ disabled,
9659
+ onClick,
9660
+ testid = "button-notification",
9661
+ ...props
9662
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9663
+ ButtonBase,
9664
+ {
9665
+ variant: "ghost",
9666
+ size: "icon",
9667
+ onClick,
9668
+ disabled,
9669
+ testid,
9670
+ className: cn(
9671
+ "transition-all duration-200 ease-in-out group",
9672
+ "hover:scale-105",
9673
+ "active:scale-95",
9674
+ "disabled:hover:scale-100"
9675
+ ),
9676
+ ...props,
9677
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9678
+ import_react40.BellIcon,
9679
+ {
9680
+ size: 18,
9681
+ className: "transition-transform duration-300 group-hover:scale-110 group-hover:-rotate-12"
9682
+ }
9683
+ )
9684
+ }
9685
+ );
9686
+ var MoreButton = ({
9687
+ disabled,
9688
+ onClick,
9689
+ testid = "button-more",
9690
+ ...props
9691
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9692
+ ButtonBase,
9693
+ {
9694
+ variant: "ghost",
9695
+ size: "icon",
9696
+ onClick,
9697
+ disabled,
9698
+ testid,
9699
+ className: cn(
9700
+ "transition-all duration-200 ease-in-out group",
9701
+ "hover:scale-105",
9702
+ "active:scale-95",
9703
+ "disabled:hover:scale-100"
9704
+ ),
9705
+ ...props,
9706
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9707
+ import_react40.DotsThreeIcon,
9708
+ {
9709
+ size: 18,
9710
+ className: "transition-transform duration-200 group-hover:scale-110"
9711
+ }
9712
+ )
9713
+ }
9714
+ );
9715
+ var CheckButton = ({
9716
+ disabled,
9717
+ onClick,
9718
+ testid = "button-check",
9719
+ ...props
9720
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9721
+ ButtonBase,
9722
+ {
9723
+ variant: "default",
9724
+ size: "icon",
9725
+ onClick,
9726
+ disabled,
9727
+ testid,
9728
+ className: cn(
9729
+ "transition-all duration-200 ease-in-out group",
9730
+ "hover:scale-110",
9731
+ "active:scale-95",
9732
+ "disabled:hover:scale-100"
9733
+ ),
9734
+ ...props,
9735
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9736
+ import_react40.CheckIcon,
9737
+ {
9738
+ size: 18,
9739
+ className: "transition-transform duration-200 group-hover:scale-110"
9740
+ }
9741
+ )
9742
+ }
9743
+ );
9744
+ var FilterButton = ({
9745
+ disabled,
9746
+ onClick,
9747
+ testid = "button-filter",
9748
+ active = false,
9749
+ className,
9750
+ iconSize = 18,
9751
+ iconColor,
9752
+ variant,
9753
+ size = "icon",
9754
+ ...props
9755
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9756
+ ButtonBase,
9757
+ {
9758
+ variant: variant || (active ? "default" : "outline"),
9759
+ size,
9760
+ onClick,
9761
+ disabled,
9762
+ testid,
9763
+ className: cn(
9764
+ "transition-all duration-200 ease-in-out",
9765
+ "hover:scale-105",
9766
+ "active:scale-95",
9767
+ "disabled:hover:scale-100",
9768
+ className
9769
+ ),
9770
+ ...props,
9771
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9772
+ import_react40.FunnelIcon,
9773
+ {
9774
+ size: iconSize,
9775
+ color: iconColor,
9776
+ weight: active ? "fill" : "regular",
9777
+ className: "transition-all duration-200"
9778
+ }
9779
+ )
9780
+ }
9781
+ );
9782
+ var LikeButton = ({
9783
+ disabled,
9784
+ onClick,
9785
+ testid = "button-like",
9786
+ isLiked = false,
9787
+ className,
9788
+ iconSize = 18,
9789
+ iconColor,
9790
+ variant = "ghost",
9791
+ size = "icon",
9792
+ ...props
9793
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9794
+ ButtonBase,
9795
+ {
9796
+ variant,
9797
+ size,
9798
+ onClick,
9799
+ disabled,
9800
+ testid,
9801
+ className: cn(
9802
+ "transition-all duration-200 ease-in-out group",
9803
+ "hover:scale-110",
9804
+ "active:scale-95",
9805
+ "disabled:hover:scale-100",
9806
+ !iconColor && (isLiked ? "text-red-500 dark:text-red-400 hover:text-red-600 dark:hover:text-red-300" : "hover:text-red-500 dark:hover:text-red-400"),
9807
+ className
9808
+ ),
9809
+ ...props,
9810
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9811
+ import_react40.HeartIcon,
9812
+ {
9813
+ size: iconSize,
9814
+ color: iconColor,
9815
+ weight: isLiked ? "fill" : "regular",
9816
+ className: "transition-all duration-300 group-hover:scale-110"
9817
+ }
9818
+ )
9819
+ }
9820
+ );
9821
+ var FavoriteButton = ({
9822
+ disabled,
9823
+ onClick,
9824
+ testid = "button-favorite",
9825
+ isFavorite = false,
9826
+ className,
9827
+ iconSize = 18,
9828
+ iconColor,
9829
+ variant = "ghost",
9830
+ size = "icon",
9831
+ ...props
9832
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9833
+ ButtonBase,
9834
+ {
9835
+ variant,
9836
+ size,
9837
+ onClick,
9838
+ disabled,
9839
+ testid,
9840
+ className: cn(
9841
+ "transition-all duration-200 ease-in-out group",
9842
+ "hover:scale-110",
9843
+ "active:scale-95",
9844
+ "disabled:hover:scale-100",
9845
+ !iconColor && (isFavorite ? "text-yellow-500 dark:text-yellow-400 hover:text-yellow-600 dark:hover:text-yellow-300" : "hover:text-yellow-500 dark:hover:text-yellow-400"),
9846
+ className
9847
+ ),
9848
+ ...props,
9849
+ children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9850
+ import_react40.StarIcon,
9851
+ {
9852
+ size: iconSize,
9853
+ color: iconColor,
9854
+ weight: isFavorite ? "fill" : "regular",
9855
+ className: "transition-all duration-300 group-hover:rotate-12"
9856
+ }
9857
+ )
9858
+ }
9859
+ );
9860
+ var VisibilityButton = ({
9861
+ disabled,
9862
+ onClick,
9863
+ testid = "button-visibility",
9864
+ isVisible = true,
9865
+ className,
9866
+ iconSize = 18,
9867
+ iconColor,
9868
+ variant = "ghost",
9869
+ size = "icon",
9870
+ ...props
9871
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9872
+ ButtonBase,
9873
+ {
9874
+ variant,
9875
+ size,
9876
+ onClick,
9877
+ disabled,
9878
+ testid,
9879
+ className: cn(
9880
+ "transition-all duration-200 ease-in-out",
9881
+ "hover:scale-105",
9882
+ "active:scale-95",
9883
+ "disabled:hover:scale-100",
9884
+ className
9885
+ ),
9886
+ ...props,
9887
+ children: isVisible ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9888
+ import_react40.EyeIcon,
9889
+ {
9890
+ size: iconSize,
9891
+ color: iconColor,
9892
+ className: "transition-opacity duration-200"
9893
+ }
9894
+ ) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9895
+ import_react40.EyeSlashIcon,
9896
+ {
9897
+ size: iconSize,
9898
+ color: iconColor,
9899
+ className: "transition-opacity duration-200"
9900
+ }
9901
+ )
9902
+ }
9903
+ );
9904
+ var ViewButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(VisibilityButton, { isVisible: true, testid: "button-view", ...props });
9905
+ var HideButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(VisibilityButton, { isVisible: false, testid: "button-hide", ...props });
9906
+ var LockButton = ({
9907
+ disabled,
9908
+ onClick,
9909
+ testid = "button-lock",
9910
+ isLocked = true,
9911
+ className,
9912
+ iconSize = 18,
9913
+ iconColor,
9914
+ variant = "ghost",
9915
+ size = "icon",
9916
+ ...props
9917
+ }) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9918
+ ButtonBase,
9919
+ {
9920
+ variant,
9921
+ size,
9922
+ onClick,
9923
+ disabled,
9924
+ testid,
9925
+ className: cn(
9926
+ "transition-all duration-200 ease-in-out group",
9927
+ "hover:scale-105",
9928
+ "active:scale-95",
9929
+ "disabled:hover:scale-100",
9930
+ !iconColor && (isLocked ? "text-red-500 dark:text-red-400 hover:text-red-600 dark:hover:text-red-300" : "text-emerald-500 dark:text-emerald-400 hover:text-emerald-600 dark:hover:text-emerald-300"),
9931
+ className
9932
+ ),
9933
+ ...props,
9934
+ children: isLocked ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9935
+ import_react40.LockIcon,
9936
+ {
9937
+ size: iconSize,
9938
+ color: iconColor,
9939
+ className: "transition-all duration-200 group-hover:scale-110"
9940
+ }
9941
+ ) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
9942
+ import_react40.LockOpenIcon,
9943
+ {
9944
+ size: iconSize,
9945
+ color: iconColor,
9946
+ className: "transition-all duration-200 group-hover:scale-110"
9947
+ }
9948
+ )
9949
+ }
9950
+ );
9951
+ var UnlockButton = (props) => /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(LockButton, { isLocked: false, testid: "button-unlock", ...props });
9952
+
9953
+ // src/components/ui/DebounceInput.tsx
9954
+ var import_react41 = require("react");
9955
+ var import_react42 = require("@phosphor-icons/react");
9956
+ var import_jsx_runtime62 = require("react/jsx-runtime");
9957
+
9958
+ // src/components/ui/FileUploader.tsx
9959
+ var React38 = __toESM(require("react"));
9960
+ var import_framer_motion16 = require("framer-motion");
9961
+ var import_react43 = require("@phosphor-icons/react");
9962
+ var import_jsx_runtime63 = require("react/jsx-runtime");
9963
+ var formatFileSize = (bytes) => {
9964
+ if (bytes === 0) return "0 Bytes";
9965
+ const k = 1024;
9966
+ const sizes = ["Bytes", "KB", "MB", "GB"];
9967
+ const i = Math.floor(Math.log(bytes) / Math.log(k));
9968
+ return Math.round(bytes / Math.pow(k, i) * 100) / 100 + " " + sizes[i];
9969
+ };
9970
+ var getFileExtension = (filename) => {
9971
+ return filename.slice((filename.lastIndexOf(".") - 1 >>> 0) + 2);
9972
+ };
9973
+ var getFileTypeIcon = (file) => {
9974
+ const extension = getFileExtension(file.name).toLowerCase();
9975
+ const mimeType = file.type.toLowerCase();
9976
+ if (extension === "pdf" || mimeType === "application/pdf") {
9977
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FilePdfIcon, { size: 20, className: "text-red-500" });
9978
+ }
9979
+ if (["doc", "docx"].includes(extension) || mimeType.includes("word")) {
9980
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileDocIcon, { size: 20, className: "text-blue-500" });
9981
+ }
9982
+ if (["xls", "xlsx"].includes(extension) || mimeType.includes("sheet")) {
9983
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileXlsIcon, { size: 20, className: "text-green-500" });
9984
+ }
9985
+ if (["ppt", "pptx"].includes(extension) || mimeType.includes("presentation")) {
9986
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FilePptIcon, { size: 20, className: "text-orange-500" });
9987
+ }
9988
+ if (extension === "csv" || mimeType === "text/csv") {
9989
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileCsvIcon, { size: 20, className: "text-green-600" });
9990
+ }
9991
+ if (["txt", "md", "json", "xml", "js", "ts", "html", "css"].includes(
9992
+ extension
9993
+ ) || mimeType.includes("text")) {
9994
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileTextIcon, { size: 20, className: "text-gray-500" });
9995
+ }
9996
+ if (mimeType.startsWith("image/")) {
9997
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileImageIcon, { size: 20, className: "text-purple-500" });
9998
+ }
9999
+ if (mimeType.startsWith("video/")) {
10000
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileVideoIcon, { size: 20, className: "text-pink-500" });
10001
+ }
10002
+ if (mimeType.startsWith("audio/")) {
10003
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileAudioIcon, { size: 20, className: "text-indigo-500" });
10004
+ }
10005
+ if (["zip", "rar", "7z", "tar", "gz"].includes(extension)) {
10006
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileZipIcon, { size: 20, className: "text-yellow-600" });
10007
+ }
10008
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.FileIcon, { size: 20, className: "text-muted-foreground" });
10009
+ };
10010
+ var createImagePreview = (file) => {
10011
+ return new Promise((resolve) => {
10012
+ if (!file.type.startsWith("image/")) {
10013
+ resolve(null);
10014
+ return;
10015
+ }
10016
+ const reader = new FileReader();
10017
+ reader.onload = (e) => {
10018
+ resolve(e.target?.result);
10019
+ };
10020
+ reader.onerror = () => {
10021
+ resolve(null);
10022
+ };
10023
+ reader.readAsDataURL(file);
10024
+ });
10025
+ };
10026
+ var FileUploader = React38.forwardRef(
10027
+ ({
10028
+ className,
10029
+ accept,
10030
+ maxSize,
10031
+ maxFiles = 1,
10032
+ disabled = false,
10033
+ value = [],
10034
+ onValueChange,
10035
+ onUpload,
10036
+ showPreview = true,
10037
+ dropzoneText = "Arraste arquivos aqui ou clique para selecionar",
10038
+ dropzoneSubtext,
10039
+ animate = true,
10040
+ ...props
10041
+ }, ref) => {
10042
+ const [isDragging, setIsDragging] = React38.useState(false);
10043
+ const [files, setFiles] = React38.useState(value);
10044
+ const inputRef = React38.useRef(null);
10045
+ const dragCounterRef = React38.useRef(0);
10046
+ const multiple = maxFiles > 1;
10047
+ React38.useEffect(() => {
10048
+ setFiles(value);
10049
+ }, [value]);
10050
+ React38.useEffect(() => {
10051
+ return () => {
10052
+ files.forEach((file) => {
10053
+ if (file.preview) {
10054
+ URL.revokeObjectURL(file.preview);
10055
+ }
10056
+ });
10057
+ };
10058
+ }, [files]);
10059
+ const validateFile = (file) => {
10060
+ if (file.size > maxSize) {
10061
+ return `Arquivo muito grande. M\xE1ximo: ${formatFileSize(maxSize)}`;
10062
+ }
10063
+ if (accept.length > 0) {
10064
+ const fileExtension = `.${getFileExtension(file.name)}`;
10065
+ const fileType = file.type;
10066
+ const isAccepted = accept.some((acceptItem) => {
10067
+ if (acceptItem.startsWith(".")) {
10068
+ return fileExtension.toLowerCase() === acceptItem.toLowerCase();
10069
+ }
10070
+ if (acceptItem.endsWith("/*")) {
10071
+ return fileType.startsWith(acceptItem.replace("/*", ""));
10072
+ }
10073
+ return fileType === acceptItem;
10074
+ });
10075
+ if (!isAccepted) {
10076
+ return `Tipo de arquivo n\xE3o permitido. Aceitos: ${accept.join(", ")}`;
10077
+ }
10078
+ }
10079
+ return null;
10080
+ };
10081
+ const createFileWithPreview = async (file) => {
10082
+ const fileWithPreview = file;
10083
+ fileWithPreview.id = `${file.name}-${Date.now()}-${Math.random()}`;
10084
+ const error = validateFile(file);
10085
+ if (error) {
10086
+ fileWithPreview.error = error;
10087
+ }
10088
+ if (file.type.startsWith("image/")) {
10089
+ try {
10090
+ const preview = await createImagePreview(file);
10091
+ if (preview) {
10092
+ fileWithPreview.preview = preview;
10093
+ }
10094
+ } catch (error2) {
10095
+ console.warn("Erro ao criar preview da imagem:", error2);
10096
+ }
10097
+ }
10098
+ return fileWithPreview;
10099
+ };
10100
+ const handleFiles = async (newFiles) => {
10101
+ if (disabled) return;
10102
+ const availableSlots = maxFiles - files.length;
10103
+ const filesToAdd = multiple ? newFiles.slice(0, availableSlots) : [newFiles[0]];
10104
+ const filesWithPreview = await Promise.all(
10105
+ filesToAdd.map((file) => createFileWithPreview(file))
10106
+ );
10107
+ const updatedFiles = multiple ? [...files, ...filesWithPreview] : filesWithPreview;
10108
+ setFiles(updatedFiles);
10109
+ onValueChange(updatedFiles);
10110
+ if (onUpload) {
10111
+ const validFiles = filesWithPreview.filter((f) => !f.error);
10112
+ if (validFiles.length > 0) {
10113
+ try {
10114
+ await onUpload(validFiles);
10115
+ } catch (error) {
10116
+ console.error("Erro no upload:", error);
10117
+ }
10118
+ }
10119
+ }
10120
+ };
10121
+ const handleDragEnter = (e) => {
10122
+ e.preventDefault();
10123
+ e.stopPropagation();
10124
+ dragCounterRef.current++;
10125
+ if (e.dataTransfer.items && e.dataTransfer.items.length > 0) {
10126
+ setIsDragging(true);
10127
+ }
10128
+ };
10129
+ const handleDragLeave = (e) => {
10130
+ e.preventDefault();
10131
+ e.stopPropagation();
10132
+ dragCounterRef.current--;
10133
+ if (dragCounterRef.current === 0) {
10134
+ setIsDragging(false);
10135
+ }
10136
+ };
10137
+ const handleDragOver = (e) => {
10138
+ e.preventDefault();
10139
+ e.stopPropagation();
10140
+ };
10141
+ const handleDrop = (e) => {
10142
+ e.preventDefault();
10143
+ e.stopPropagation();
10144
+ setIsDragging(false);
10145
+ dragCounterRef.current = 0;
10146
+ if (disabled) return;
10147
+ const droppedFiles = Array.from(e.dataTransfer.files);
10148
+ handleFiles(droppedFiles);
10149
+ };
10150
+ const handleInputChange = (e) => {
10151
+ if (e.target.files) {
10152
+ const selectedFiles = Array.from(e.target.files);
10153
+ handleFiles(selectedFiles);
10154
+ }
10155
+ };
10156
+ const handleRemoveFile = (fileId) => {
10157
+ const fileToRemove = files.find((f) => f.id === fileId);
10158
+ if (fileToRemove?.preview) {
10159
+ URL.revokeObjectURL(fileToRemove.preview);
10160
+ }
10161
+ const updatedFiles = files.filter((f) => f.id !== fileId);
10162
+ setFiles(updatedFiles);
10163
+ onValueChange(updatedFiles);
10164
+ };
10165
+ const handleClick = () => {
10166
+ if (!disabled) {
10167
+ inputRef.current?.click();
10168
+ }
10169
+ };
10170
+ const acceptString = accept.join(",");
10171
+ const defaultSubtext = dropzoneSubtext || `Formatos: ${accept.join(", ")}. M\xE1ximo: ${formatFileSize(maxSize)}`;
10172
+ return /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { ref, className: cn("w-full", className), ...props, children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
10173
+ import_framer_motion16.motion.div,
10174
+ {
10175
+ className: cn(
10176
+ "relative flex cursor-pointer flex-col items-center justify-center rounded-xl border-2 border-dashed p-10 transition-all duration-300 dark:shadow-black/20",
10177
+ isDragging && "border-primary bg-primary/10 scale-[1.02]",
10178
+ !isDragging && "border-border hover:border-primary/60 hover:bg-muted/50",
10179
+ disabled && "cursor-not-allowed opacity-50 hover:scale-100"
10180
+ ),
10181
+ onDragEnter: handleDragEnter,
10182
+ onDragOver: handleDragOver,
10183
+ onDragLeave: handleDragLeave,
10184
+ onDrop: handleDrop,
10185
+ onClick: handleClick,
10186
+ whileHover: !disabled ? { scale: 1.01 } : void 0,
10187
+ whileTap: !disabled ? { scale: 0.99 } : void 0,
10188
+ animate: isDragging ? {
10189
+ borderColor: `hsl(var(--primary))`,
10190
+ backgroundColor: `hsl(var(--primary) / 0.1)`,
10191
+ scale: 1.02
10192
+ } : {
10193
+ borderColor: `hsl(var(--border))`,
10194
+ backgroundColor: `hsl(var(--background))`,
10195
+ scale: 1
10196
+ },
10197
+ transition: {
10198
+ type: "spring",
10199
+ stiffness: 300,
10200
+ damping: 25,
10201
+ duration: 0.3
10202
+ },
10203
+ children: [
10204
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10205
+ "input",
10206
+ {
10207
+ ref: inputRef,
10208
+ type: "file",
10209
+ className: "hidden",
10210
+ accept: acceptString,
10211
+ multiple,
10212
+ disabled,
10213
+ onChange: handleInputChange
10214
+ }
10215
+ ),
10216
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10217
+ import_framer_motion16.motion.div,
10218
+ {
10219
+ animate: isDragging ? { scale: 1.2, rotate: 10 } : { scale: 1, rotate: 0 },
10220
+ transition: {
10221
+ type: "spring",
10222
+ stiffness: 300,
10223
+ damping: 20,
10224
+ duration: 0.3
10225
+ },
10226
+ children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10227
+ import_framer_motion16.motion.div,
10228
+ {
10229
+ className: cn(
10230
+ "mb-4 h-16 w-16 text-muted-foreground transition-colors duration-300 drop-shadow-lg flex items-center justify-center",
10231
+ isDragging && "text-primary"
10232
+ ),
10233
+ initial: false,
10234
+ animate: {
10235
+ color: isDragging ? `hsl(var(--primary))` : `hsl(var(--muted-foreground))`
10236
+ },
10237
+ transition: { duration: 0.3 },
10238
+ children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.CloudArrowUpIcon, { size: 64 })
10239
+ }
10240
+ )
10241
+ }
10242
+ ),
10243
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10244
+ import_framer_motion16.motion.p,
10245
+ {
10246
+ className: "mb-2 text-base font-semibold text-foreground",
10247
+ initial: animate ? { opacity: 0, y: -10 } : false,
10248
+ animate: { opacity: 1, y: 0 },
10249
+ transition: { delay: 0.1 },
10250
+ children: dropzoneText
10251
+ }
10252
+ ),
10253
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10254
+ import_framer_motion16.motion.p,
10255
+ {
10256
+ className: "text-sm text-muted-foreground",
10257
+ initial: animate ? { opacity: 0, y: -10 } : false,
10258
+ animate: { opacity: 1, y: 0 },
10259
+ transition: { delay: 0.2 },
10260
+ children: defaultSubtext
10261
+ }
10262
+ ),
10263
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_framer_motion16.AnimatePresence, { children: files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
10264
+ import_framer_motion16.motion.div,
10265
+ {
10266
+ initial: { opacity: 0, scale: 0.8, y: 10 },
10267
+ animate: {
10268
+ opacity: 1,
10269
+ scale: 1,
10270
+ y: 0,
10271
+ backgroundColor: `hsl(var(--primary) / 0.1)`,
10272
+ borderColor: `hsl(var(--primary) / 0.2)`
10273
+ },
10274
+ exit: { opacity: 0, scale: 0.8, y: 10 },
10275
+ className: cn(
10276
+ "mt-4 flex items-center gap-2 rounded-full border px-4 py-2 backdrop-blur-sm bg-primary/20 border-primary/30 shadow-lg"
10277
+ ),
10278
+ transition: { duration: 0.3 },
10279
+ children: [
10280
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "h-4 w-4 text-primary flex items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.CheckIcon, { size: 16, className: "text-emerald-500" }) }),
10281
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
10282
+ import_framer_motion16.motion.span,
10283
+ {
10284
+ className: "text-sm font-semibold text-primary",
10285
+ animate: { color: `hsl(var(--primary))` },
10286
+ transition: { duration: 0.3 },
10287
+ children: [
10288
+ files.length,
10289
+ " ",
10290
+ files.length === 1 ? "arquivo selecionado" : "arquivos selecionados"
10291
+ ]
10292
+ }
10293
+ )
10294
+ ]
10295
+ }
10296
+ ) }),
10297
+ showPreview && files.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10298
+ import_framer_motion16.motion.div,
10299
+ {
10300
+ className: "mt-6 w-full",
10301
+ initial: animate ? { opacity: 0, y: 10 } : false,
10302
+ animate: { opacity: 1, y: 0 },
10303
+ transition: { delay: 0.3 },
10304
+ children: /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { children: [
10305
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("h4", { className: "mb-3 text-sm font-medium text-muted-foreground", children: [
10306
+ "Arquivos selecionados (",
10307
+ files.length,
10308
+ "/",
10309
+ maxFiles,
10310
+ ")"
10311
+ ] }),
10312
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "space-y-2 overflow-y-auto max-h-44", children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_framer_motion16.AnimatePresence, { mode: "popLayout", children: files.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(
10313
+ import_framer_motion16.motion.div,
10314
+ {
10315
+ layout: true,
10316
+ initial: animate ? { opacity: 0, x: -20 } : false,
10317
+ animate: { opacity: 1, x: 0 },
10318
+ exit: {
10319
+ opacity: 0,
10320
+ x: -20,
10321
+ transition: { duration: 0.2 }
10322
+ },
10323
+ transition: {
10324
+ delay: animate ? index * 0.05 : 0,
10325
+ layout: { duration: 0.2 }
10326
+ },
10327
+ className: cn(
10328
+ "flex items-center gap-3 rounded-md border p-3 transition-all duration-300",
10329
+ file.error ? "border-destructive/50 bg-destructive/5" : "border-border bg-background/80 hover:bg-muted/50 hover:shadow-md hover:shadow-primary/10 hover:border-primary/30"
10330
+ ),
10331
+ children: [
10332
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("div", { className: "flex h-12 w-12 shrink-0 items-center justify-center rounded-md bg-muted overflow-hidden", children: file.preview ? (
10333
+ // Preview de imagem
10334
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10335
+ "img",
10336
+ {
10337
+ src: file.preview,
10338
+ alt: file.name,
10339
+ className: "h-full w-full object-cover rounded-md"
10340
+ }
10341
+ )
10342
+ ) : (
10343
+ // Ícone baseado no tipo de arquivo
10344
+ getFileTypeIcon(file)
10345
+ ) }),
10346
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "min-w-0 flex-1", children: [
10347
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10348
+ "p",
10349
+ {
10350
+ className: "truncate text-sm font-medium text-foreground",
10351
+ title: `${file.name} (${file.type || "Tipo desconhecido"})`,
10352
+ children: file.name
10353
+ }
10354
+ ),
10355
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)("div", { className: "flex items-center gap-2 text-xs text-muted-foreground", children: [
10356
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: formatFileSize(file.size) }),
10357
+ file.type && /* @__PURE__ */ (0, import_jsx_runtime63.jsxs)(import_jsx_runtime63.Fragment, { children: [
10358
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { children: "\u2022" }),
10359
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)("span", { className: "uppercase", children: getFileExtension(file.name) })
10360
+ ] })
10361
+ ] }),
10362
+ file.error && /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10363
+ import_framer_motion16.motion.p,
10364
+ {
10365
+ className: "mt-1 text-xs text-destructive",
10366
+ initial: { opacity: 0, y: -5 },
10367
+ animate: { opacity: 1, y: 0 },
10368
+ children: file.error
10369
+ }
10370
+ )
10371
+ ] }),
10372
+ /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(
10373
+ DeleteButton,
10374
+ {
10375
+ type: "button",
10376
+ variant: "destructive",
10377
+ size: "icon",
10378
+ onClick: (e) => {
10379
+ e?.stopPropagation();
10380
+ handleRemoveFile(file.id);
10381
+ },
10382
+ className: "",
10383
+ children: /* @__PURE__ */ (0, import_jsx_runtime63.jsx)(import_react43.XIcon, { size: 12 })
10384
+ }
10385
+ )
10386
+ ]
10387
+ },
10388
+ file.id
10389
+ )) }) })
10390
+ ] })
10391
+ }
10392
+ )
10393
+ ]
10394
+ }
10395
+ ) });
10396
+ }
10397
+ );
10398
+ FileUploader.displayName = "FileUploader";
10399
+
8952
10400
  // src/hooks/use-drag.tsx
8953
- var import_react39 = require("react");
10401
+ var import_react44 = require("react");
8954
10402
  var useDrag = (options = {}) => {
8955
- const [isDragging, setIsDragging] = (0, import_react39.useState)(null);
8956
- const [positions, setPositions] = (0, import_react39.useState)({});
8957
- const dragStartPos = (0, import_react39.useRef)(null);
8958
- const dragId = (0, import_react39.useRef)(null);
8959
- const handleMouseDown = (0, import_react39.useCallback)((id, e) => {
10403
+ const [isDragging, setIsDragging] = (0, import_react44.useState)(null);
10404
+ const [positions, setPositions] = (0, import_react44.useState)({});
10405
+ const dragStartPos = (0, import_react44.useRef)(null);
10406
+ const dragId = (0, import_react44.useRef)(null);
10407
+ const handleMouseDown = (0, import_react44.useCallback)((id, e) => {
8960
10408
  e.preventDefault();
8961
10409
  const currentPosition = positions[id] || { top: 0, left: 0 };
8962
10410
  dragStartPos.current = {
@@ -8969,7 +10417,7 @@ var useDrag = (options = {}) => {
8969
10417
  setIsDragging(id);
8970
10418
  options.onDragStart?.(id);
8971
10419
  }, [positions, options]);
8972
- const handleMouseMove = (0, import_react39.useCallback)((e) => {
10420
+ const handleMouseMove = (0, import_react44.useCallback)((e) => {
8973
10421
  if (!isDragging || !dragStartPos.current || !dragId.current) return;
8974
10422
  const deltaX = e.clientX - dragStartPos.current.x;
8975
10423
  const deltaY = e.clientY - dragStartPos.current.y;
@@ -8985,7 +10433,7 @@ var useDrag = (options = {}) => {
8985
10433
  }));
8986
10434
  options.onDrag?.(dragId.current, newPosition);
8987
10435
  }, [isDragging, options]);
8988
- const handleMouseUp = (0, import_react39.useCallback)(() => {
10436
+ const handleMouseUp = (0, import_react44.useCallback)(() => {
8989
10437
  if (dragId.current) {
8990
10438
  options.onDragEnd?.(dragId.current);
8991
10439
  }
@@ -8993,7 +10441,7 @@ var useDrag = (options = {}) => {
8993
10441
  dragStartPos.current = null;
8994
10442
  dragId.current = null;
8995
10443
  }, [options]);
8996
- (0, import_react39.useEffect)(() => {
10444
+ (0, import_react44.useEffect)(() => {
8997
10445
  if (isDragging) {
8998
10446
  document.addEventListener("mousemove", handleMouseMove);
8999
10447
  document.addEventListener("mouseup", handleMouseUp);
@@ -9005,16 +10453,16 @@ var useDrag = (options = {}) => {
9005
10453
  };
9006
10454
  }
9007
10455
  }, [isDragging, handleMouseMove, handleMouseUp]);
9008
- const setPosition = (0, import_react39.useCallback)((id, position) => {
10456
+ const setPosition = (0, import_react44.useCallback)((id, position) => {
9009
10457
  setPositions((prev) => ({
9010
10458
  ...prev,
9011
10459
  [id]: position
9012
10460
  }));
9013
10461
  }, []);
9014
- const getPosition = (0, import_react39.useCallback)((id) => {
10462
+ const getPosition = (0, import_react44.useCallback)((id) => {
9015
10463
  return positions[id] || { top: 0, left: 0 };
9016
10464
  }, [positions]);
9017
- const isElementDragging = (0, import_react39.useCallback)((id) => {
10465
+ const isElementDragging = (0, import_react44.useCallback)((id) => {
9018
10466
  return isDragging === id;
9019
10467
  }, [isDragging]);
9020
10468
  return {