@iclips/ui 1.0.3 → 1.0.6
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.cjs +1844 -515
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +423 -29
- package/dist/index.d.ts +423 -29
- package/dist/index.js +1841 -518
- package/dist/index.js.map +1 -1
- package/package.json +5 -5
package/dist/index.cjs
CHANGED
|
@@ -13,6 +13,7 @@ var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
|
|
|
13
13
|
var AspectRatioPrimitive = require('@radix-ui/react-aspect-ratio');
|
|
14
14
|
var AvatarPrimitive = require('@radix-ui/react-avatar');
|
|
15
15
|
var reactDayPicker = require('react-day-picker');
|
|
16
|
+
var locale = require('date-fns/locale');
|
|
16
17
|
var useEmblaCarousel = require('embla-carousel-react');
|
|
17
18
|
var RechartsPrimitive = require('recharts');
|
|
18
19
|
var CheckboxPrimitive = require('@radix-ui/react-checkbox');
|
|
@@ -21,7 +22,7 @@ var PopoverPrimitive = require('@radix-ui/react-popover');
|
|
|
21
22
|
var LabelPrimitive = require('@radix-ui/react-label');
|
|
22
23
|
var CollapsiblePrimitive = require('@radix-ui/react-collapsible');
|
|
23
24
|
var dateFns = require('date-fns');
|
|
24
|
-
var
|
|
25
|
+
var SelectPrimitive = require('@radix-ui/react-select');
|
|
25
26
|
var ProgressPrimitive = require('@radix-ui/react-progress');
|
|
26
27
|
var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
|
|
27
28
|
var cmdk = require('cmdk');
|
|
@@ -35,7 +36,7 @@ var MenubarPrimitive = require('@radix-ui/react-menubar');
|
|
|
35
36
|
var NavigationMenuPrimitive = require('@radix-ui/react-navigation-menu');
|
|
36
37
|
var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
|
|
37
38
|
var ResizablePrimitive = require('react-resizable-panels');
|
|
38
|
-
var
|
|
39
|
+
var SeparatorPrimitive = require('@radix-ui/react-separator');
|
|
39
40
|
var TooltipPrimitive = require('@radix-ui/react-tooltip');
|
|
40
41
|
var SliderPrimitive = require('@radix-ui/react-slider');
|
|
41
42
|
var nextThemes = require('next-themes');
|
|
@@ -77,7 +78,7 @@ var CheckboxPrimitive__namespace = /*#__PURE__*/_interopNamespace(CheckboxPrimit
|
|
|
77
78
|
var PopoverPrimitive__namespace = /*#__PURE__*/_interopNamespace(PopoverPrimitive);
|
|
78
79
|
var LabelPrimitive__namespace = /*#__PURE__*/_interopNamespace(LabelPrimitive);
|
|
79
80
|
var CollapsiblePrimitive__namespace = /*#__PURE__*/_interopNamespace(CollapsiblePrimitive);
|
|
80
|
-
var
|
|
81
|
+
var SelectPrimitive__namespace = /*#__PURE__*/_interopNamespace(SelectPrimitive);
|
|
81
82
|
var ProgressPrimitive__namespace = /*#__PURE__*/_interopNamespace(ProgressPrimitive);
|
|
82
83
|
var DropdownMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(DropdownMenuPrimitive);
|
|
83
84
|
var DialogPrimitive__namespace = /*#__PURE__*/_interopNamespace(DialogPrimitive);
|
|
@@ -87,7 +88,7 @@ var MenubarPrimitive__namespace = /*#__PURE__*/_interopNamespace(MenubarPrimitiv
|
|
|
87
88
|
var NavigationMenuPrimitive__namespace = /*#__PURE__*/_interopNamespace(NavigationMenuPrimitive);
|
|
88
89
|
var RadioGroupPrimitive__namespace = /*#__PURE__*/_interopNamespace(RadioGroupPrimitive);
|
|
89
90
|
var ResizablePrimitive__namespace = /*#__PURE__*/_interopNamespace(ResizablePrimitive);
|
|
90
|
-
var
|
|
91
|
+
var SeparatorPrimitive__namespace = /*#__PURE__*/_interopNamespace(SeparatorPrimitive);
|
|
91
92
|
var TooltipPrimitive__namespace = /*#__PURE__*/_interopNamespace(TooltipPrimitive);
|
|
92
93
|
var SliderPrimitive__namespace = /*#__PURE__*/_interopNamespace(SliderPrimitive);
|
|
93
94
|
var SwitchPrimitive__namespace = /*#__PURE__*/_interopNamespace(SwitchPrimitive);
|
|
@@ -866,6 +867,62 @@ function BreadcrumbEllipsis({
|
|
|
866
867
|
}
|
|
867
868
|
);
|
|
868
869
|
}
|
|
870
|
+
function Calendar2({
|
|
871
|
+
className,
|
|
872
|
+
classNames,
|
|
873
|
+
showOutsideDays = true,
|
|
874
|
+
locale: locale$1 = locale.ptBR,
|
|
875
|
+
...props
|
|
876
|
+
}) {
|
|
877
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
878
|
+
reactDayPicker.DayPicker,
|
|
879
|
+
{
|
|
880
|
+
showOutsideDays,
|
|
881
|
+
locale: locale$1,
|
|
882
|
+
className: cn("p-3", className),
|
|
883
|
+
classNames: {
|
|
884
|
+
months: "flex flex-col sm:flex-row space-y-4 sm:space-x-4 sm:space-y-0",
|
|
885
|
+
month: "space-y-4",
|
|
886
|
+
month_caption: "flex justify-center pt-1 relative items-center",
|
|
887
|
+
caption_label: "text-sm font-medium",
|
|
888
|
+
nav: "space-x-1 flex items-center",
|
|
889
|
+
button_previous: cn(
|
|
890
|
+
buttonVariants({ variant: "outline" }),
|
|
891
|
+
"absolute left-1 top-0 size-7 bg-background p-0 hover:bg-accent hover:text-accent-foreground rounded-md border-border m-5 z-10"
|
|
892
|
+
),
|
|
893
|
+
button_next: cn(
|
|
894
|
+
buttonVariants({ variant: "outline" }),
|
|
895
|
+
"absolute right-1 top-0 size-7 bg-background p-0 hover:bg-accent hover:text-accent-foreground rounded-md border-border m-5 z-10"
|
|
896
|
+
),
|
|
897
|
+
month_grid: "w-full border-collapse space-y-1",
|
|
898
|
+
weekdays: "flex",
|
|
899
|
+
weekday: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
|
|
900
|
+
week: "flex w-full mt-2",
|
|
901
|
+
day: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].day-outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20 rounded-md",
|
|
902
|
+
day_button: cn(
|
|
903
|
+
buttonVariants({ variant: "ghost" }),
|
|
904
|
+
"h-9 w-9 p-0 font-normal aria-selected:opacity-100 rounded-md"
|
|
905
|
+
),
|
|
906
|
+
range_end: "day-range-end",
|
|
907
|
+
selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground rounded-md",
|
|
908
|
+
today: "bg-accent text-accent-foreground rounded-md",
|
|
909
|
+
outside: "day-outside text-muted-foreground opacity-50 aria-selected:bg-accent/50 aria-selected:text-muted-foreground aria-selected:opacity-30",
|
|
910
|
+
disabled: "text-muted-foreground opacity-50",
|
|
911
|
+
range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
|
|
912
|
+
hidden: "invisible",
|
|
913
|
+
...classNames
|
|
914
|
+
},
|
|
915
|
+
components: {
|
|
916
|
+
Chevron: ({ orientation }) => {
|
|
917
|
+
const Icon2 = orientation === "left" ? lucideReact.ChevronLeft : lucideReact.ChevronRight;
|
|
918
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "h-4 w-4" });
|
|
919
|
+
}
|
|
920
|
+
},
|
|
921
|
+
...props
|
|
922
|
+
}
|
|
923
|
+
);
|
|
924
|
+
}
|
|
925
|
+
Calendar2.displayName = "Calendar";
|
|
869
926
|
function Card({ className, ...props }) {
|
|
870
927
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
871
928
|
"div",
|
|
@@ -1744,59 +1801,6 @@ var ContractPrintPreview = React7__namespace.forwardRef(({ data, logo, showServi
|
|
|
1744
1801
|
) });
|
|
1745
1802
|
});
|
|
1746
1803
|
ContractPrintPreview.displayName = "ContractPrintPreview";
|
|
1747
|
-
function Calendar2({
|
|
1748
|
-
className,
|
|
1749
|
-
classNames,
|
|
1750
|
-
showOutsideDays = true,
|
|
1751
|
-
...props
|
|
1752
|
-
}) {
|
|
1753
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1754
|
-
reactDayPicker.DayPicker,
|
|
1755
|
-
{
|
|
1756
|
-
showOutsideDays,
|
|
1757
|
-
className: cn("p-3", className),
|
|
1758
|
-
classNames: {
|
|
1759
|
-
months: "flex flex-col sm:flex-row gap-2",
|
|
1760
|
-
month: "flex flex-col gap-4",
|
|
1761
|
-
caption: "flex justify-center pt-1 relative items-center w-full",
|
|
1762
|
-
caption_label: "text-sm font-medium",
|
|
1763
|
-
nav: "flex items-center gap-1",
|
|
1764
|
-
nav_button: cn(
|
|
1765
|
-
"size-7 bg-transparent p-0 opacity-50 hover:opacity-100"
|
|
1766
|
-
),
|
|
1767
|
-
nav_button_previous: "absolute left-1",
|
|
1768
|
-
nav_button_next: "absolute right-1",
|
|
1769
|
-
table: "w-full border-collapse space-x-1",
|
|
1770
|
-
head_row: "flex",
|
|
1771
|
-
head_cell: "text-muted-foreground rounded-md w-8 font-normal text-[0.8rem]",
|
|
1772
|
-
row: "flex w-full mt-2",
|
|
1773
|
-
cell: cn(
|
|
1774
|
-
"relative p-0 text-center text-sm focus-within:relative focus-within:z-20 [&:has([aria-selected])]:bg-accent [&:has([aria-selected].day-range-end)]:rounded-r-md",
|
|
1775
|
-
props.mode === "range" ? "[&:has(>.day-range-end)]:rounded-r-md [&:has(>.day-range-start)]:rounded-l-md first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md" : "[&:has([aria-selected])]:rounded-md"
|
|
1776
|
-
),
|
|
1777
|
-
day: cn(
|
|
1778
|
-
"size-8 p-0 font-normal aria-selected:opacity-100"
|
|
1779
|
-
),
|
|
1780
|
-
day_range_start: "day-range-start aria-selected:bg-primary aria-selected:text-primary-foreground",
|
|
1781
|
-
day_range_end: "day-range-end aria-selected:bg-primary aria-selected:text-primary-foreground",
|
|
1782
|
-
day_selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground",
|
|
1783
|
-
day_today: "bg-accent text-accent-foreground",
|
|
1784
|
-
day_outside: "day-outside text-muted-foreground aria-selected:text-muted-foreground",
|
|
1785
|
-
day_disabled: "text-muted-foreground opacity-50",
|
|
1786
|
-
day_range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
|
|
1787
|
-
day_hidden: "invisible",
|
|
1788
|
-
...classNames
|
|
1789
|
-
},
|
|
1790
|
-
components: {
|
|
1791
|
-
Chevron: ({ orientation, ...props2 }) => {
|
|
1792
|
-
const Icon2 = orientation === "left" ? lucideReact.ChevronLeft : lucideReact.ChevronRight;
|
|
1793
|
-
return /* @__PURE__ */ jsxRuntime.jsx(Icon2, { className: "size-4", ...props2 });
|
|
1794
|
-
}
|
|
1795
|
-
},
|
|
1796
|
-
...props
|
|
1797
|
-
}
|
|
1798
|
-
);
|
|
1799
|
-
}
|
|
1800
1804
|
var CarouselContext = React7__namespace.createContext(null);
|
|
1801
1805
|
function useCarousel() {
|
|
1802
1806
|
const context = React7__namespace.useContext(CarouselContext);
|
|
@@ -2470,362 +2474,725 @@ function CollapsibleContent2({
|
|
|
2470
2474
|
}
|
|
2471
2475
|
);
|
|
2472
2476
|
}
|
|
2473
|
-
function
|
|
2474
|
-
|
|
2475
|
-
|
|
2476
|
-
|
|
2477
|
+
function Select({
|
|
2478
|
+
...props
|
|
2479
|
+
}) {
|
|
2480
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Root, { "data-slot": "select", ...props });
|
|
2481
|
+
}
|
|
2482
|
+
function SelectGroup({
|
|
2483
|
+
...props
|
|
2484
|
+
}) {
|
|
2485
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Group, { "data-slot": "select-group", ...props });
|
|
2486
|
+
}
|
|
2487
|
+
function SelectValue({
|
|
2488
|
+
...props
|
|
2489
|
+
}) {
|
|
2490
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Value, { "data-slot": "select-value", ...props });
|
|
2491
|
+
}
|
|
2492
|
+
function SelectTrigger({
|
|
2477
2493
|
className,
|
|
2478
|
-
|
|
2494
|
+
size = "default",
|
|
2495
|
+
children,
|
|
2496
|
+
...props
|
|
2479
2497
|
}) {
|
|
2480
|
-
|
|
2481
|
-
|
|
2482
|
-
|
|
2483
|
-
|
|
2484
|
-
|
|
2485
|
-
|
|
2486
|
-
|
|
2487
|
-
|
|
2488
|
-
setHours(String(date.getHours()).padStart(2, "0"));
|
|
2489
|
-
setMinutes(String(date.getMinutes()).padStart(2, "0"));
|
|
2490
|
-
}
|
|
2491
|
-
}, [date]);
|
|
2492
|
-
const handleHoursChange = (e) => {
|
|
2493
|
-
let value = e.target.value.replace(/\D/g, "");
|
|
2494
|
-
if (value.length > 2) {
|
|
2495
|
-
value = value.slice(0, 2);
|
|
2496
|
-
}
|
|
2497
|
-
const numValue = parseInt(value) || 0;
|
|
2498
|
-
if (numValue > 23) {
|
|
2499
|
-
value = "23";
|
|
2500
|
-
}
|
|
2501
|
-
setHours(value);
|
|
2502
|
-
if (value.length === 2) {
|
|
2503
|
-
updateDateTime(parseInt(value), parseInt(minutes));
|
|
2504
|
-
}
|
|
2505
|
-
};
|
|
2506
|
-
const handleMinutesChange = (e) => {
|
|
2507
|
-
let value = e.target.value.replace(/\D/g, "");
|
|
2508
|
-
if (value.length > 2) {
|
|
2509
|
-
value = value.slice(0, 2);
|
|
2510
|
-
}
|
|
2511
|
-
const numValue = parseInt(value) || 0;
|
|
2512
|
-
if (numValue > 59) {
|
|
2513
|
-
value = "59";
|
|
2514
|
-
}
|
|
2515
|
-
setMinutes(value);
|
|
2516
|
-
if (value.length === 2) {
|
|
2517
|
-
updateDateTime(parseInt(hours), parseInt(value));
|
|
2518
|
-
}
|
|
2519
|
-
};
|
|
2520
|
-
const handleHoursBlur = () => {
|
|
2521
|
-
const paddedHours = hours.padStart(2, "0");
|
|
2522
|
-
setHours(paddedHours);
|
|
2523
|
-
updateDateTime(parseInt(paddedHours), parseInt(minutes));
|
|
2524
|
-
};
|
|
2525
|
-
const handleMinutesBlur = () => {
|
|
2526
|
-
const paddedMinutes = minutes.padStart(2, "0");
|
|
2527
|
-
setMinutes(paddedMinutes);
|
|
2528
|
-
updateDateTime(parseInt(hours), parseInt(paddedMinutes));
|
|
2529
|
-
};
|
|
2530
|
-
const updateDateTime = (h, m) => {
|
|
2531
|
-
const newDate = date ? new Date(date) : /* @__PURE__ */ new Date();
|
|
2532
|
-
newDate.setHours(h);
|
|
2533
|
-
newDate.setMinutes(m);
|
|
2534
|
-
newDate.setSeconds(0);
|
|
2535
|
-
newDate.setMilliseconds(0);
|
|
2536
|
-
onChange?.(newDate);
|
|
2537
|
-
};
|
|
2538
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-2", className), children: [
|
|
2539
|
-
label && /* @__PURE__ */ jsxRuntime.jsx(Label, { children: label }),
|
|
2540
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
|
|
2541
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2542
|
-
Input,
|
|
2543
|
-
{
|
|
2544
|
-
type: "text",
|
|
2545
|
-
value: hours,
|
|
2546
|
-
onChange: handleHoursChange,
|
|
2547
|
-
onBlur: handleHoursBlur,
|
|
2548
|
-
placeholder: "00",
|
|
2549
|
-
className: "w-16 text-center font-mono",
|
|
2550
|
-
maxLength: 2,
|
|
2551
|
-
disabled,
|
|
2552
|
-
"aria-label": "Horas"
|
|
2553
|
-
}
|
|
2498
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2499
|
+
SelectPrimitive__namespace.Trigger,
|
|
2500
|
+
{
|
|
2501
|
+
"data-slot": "select-trigger",
|
|
2502
|
+
"data-size": size,
|
|
2503
|
+
className: cn(
|
|
2504
|
+
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-full items-center justify-between gap-2 rounded-md border bg-input-background px-3 py-2 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
2505
|
+
className
|
|
2554
2506
|
),
|
|
2555
|
-
|
|
2556
|
-
|
|
2557
|
-
|
|
2558
|
-
{
|
|
2559
|
-
|
|
2560
|
-
|
|
2561
|
-
|
|
2562
|
-
onBlur: handleMinutesBlur,
|
|
2563
|
-
placeholder: "00",
|
|
2564
|
-
className: "w-16 text-center font-mono",
|
|
2565
|
-
maxLength: 2,
|
|
2566
|
-
disabled,
|
|
2567
|
-
"aria-label": "Minutos"
|
|
2568
|
-
}
|
|
2569
|
-
)
|
|
2570
|
-
] })
|
|
2571
|
-
] });
|
|
2507
|
+
...props,
|
|
2508
|
+
children: [
|
|
2509
|
+
children,
|
|
2510
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "size-4 opacity-50" }) })
|
|
2511
|
+
]
|
|
2512
|
+
}
|
|
2513
|
+
);
|
|
2572
2514
|
}
|
|
2573
|
-
function
|
|
2574
|
-
date,
|
|
2575
|
-
onChange,
|
|
2576
|
-
label,
|
|
2577
|
-
placeholder = "Selecione data e hora",
|
|
2515
|
+
function SelectContent({
|
|
2578
2516
|
className,
|
|
2579
|
-
|
|
2517
|
+
children,
|
|
2518
|
+
position = "popper",
|
|
2519
|
+
...props
|
|
2580
2520
|
}) {
|
|
2581
|
-
|
|
2582
|
-
|
|
2583
|
-
|
|
2584
|
-
|
|
2585
|
-
|
|
2586
|
-
|
|
2587
|
-
|
|
2588
|
-
|
|
2589
|
-
|
|
2590
|
-
|
|
2591
|
-
|
|
2592
|
-
|
|
2593
|
-
|
|
2594
|
-
} else {
|
|
2595
|
-
setSelectedDate(void 0);
|
|
2596
|
-
}
|
|
2597
|
-
};
|
|
2598
|
-
const handleTimeChange = (newDate) => {
|
|
2599
|
-
setSelectedDate(newDate);
|
|
2600
|
-
};
|
|
2601
|
-
const handleConfirm = () => {
|
|
2602
|
-
onChange?.(selectedDate);
|
|
2603
|
-
setOpen(false);
|
|
2604
|
-
};
|
|
2605
|
-
const handleCancel = () => {
|
|
2606
|
-
setSelectedDate(date);
|
|
2607
|
-
setOpen(false);
|
|
2608
|
-
};
|
|
2609
|
-
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-2", className), children: [
|
|
2610
|
-
label && /* @__PURE__ */ jsxRuntime.jsx(Label, { children: label }),
|
|
2611
|
-
/* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
|
|
2612
|
-
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2613
|
-
Button,
|
|
2614
|
-
{
|
|
2615
|
-
variant: "outline",
|
|
2616
|
-
className: cn(
|
|
2617
|
-
"w-full justify-start text-left font-normal",
|
|
2618
|
-
!selectedDate && "text-muted-foreground"
|
|
2619
|
-
),
|
|
2620
|
-
disabled,
|
|
2621
|
-
children: [
|
|
2622
|
-
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Calendar, { className: "mr-2 h-4 w-4" }),
|
|
2623
|
-
selectedDate ? dateFns.format(selectedDate, "dd/MM/yyyy HH:mm") : /* @__PURE__ */ jsxRuntime.jsx("span", { children: placeholder })
|
|
2624
|
-
]
|
|
2625
|
-
}
|
|
2626
|
-
) }),
|
|
2627
|
-
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-3 space-y-3", children: [
|
|
2521
|
+
return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2522
|
+
SelectPrimitive__namespace.Content,
|
|
2523
|
+
{
|
|
2524
|
+
"data-slot": "select-content",
|
|
2525
|
+
className: cn(
|
|
2526
|
+
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
|
2527
|
+
position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
2528
|
+
className
|
|
2529
|
+
),
|
|
2530
|
+
position,
|
|
2531
|
+
...props,
|
|
2532
|
+
children: [
|
|
2533
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
|
|
2628
2534
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2629
|
-
|
|
2535
|
+
SelectPrimitive__namespace.Viewport,
|
|
2630
2536
|
{
|
|
2631
|
-
|
|
2632
|
-
|
|
2633
|
-
|
|
2634
|
-
|
|
2537
|
+
className: cn(
|
|
2538
|
+
"p-1",
|
|
2539
|
+
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
|
|
2540
|
+
),
|
|
2541
|
+
children
|
|
2635
2542
|
}
|
|
2636
2543
|
),
|
|
2637
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2638
|
-
|
|
2639
|
-
|
|
2640
|
-
|
|
2641
|
-
onChange: handleTimeChange,
|
|
2642
|
-
label: "Hor\xE1rio"
|
|
2643
|
-
}
|
|
2644
|
-
) }),
|
|
2645
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-2 pt-2", children: [
|
|
2646
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2647
|
-
Button,
|
|
2648
|
-
{
|
|
2649
|
-
variant: "outline",
|
|
2650
|
-
size: "sm",
|
|
2651
|
-
onClick: handleCancel,
|
|
2652
|
-
className: "flex-1",
|
|
2653
|
-
children: "Cancelar"
|
|
2654
|
-
}
|
|
2655
|
-
),
|
|
2656
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2657
|
-
Button,
|
|
2658
|
-
{
|
|
2659
|
-
size: "sm",
|
|
2660
|
-
onClick: handleConfirm,
|
|
2661
|
-
className: "flex-1",
|
|
2662
|
-
children: "Confirmar"
|
|
2663
|
-
}
|
|
2664
|
-
)
|
|
2665
|
-
] })
|
|
2666
|
-
] }) })
|
|
2667
|
-
] })
|
|
2668
|
-
] });
|
|
2544
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
|
|
2545
|
+
]
|
|
2546
|
+
}
|
|
2547
|
+
) });
|
|
2669
2548
|
}
|
|
2670
|
-
function
|
|
2549
|
+
function SelectLabel({
|
|
2671
2550
|
className,
|
|
2672
|
-
orientation = "horizontal",
|
|
2673
|
-
decorative = true,
|
|
2674
2551
|
...props
|
|
2675
2552
|
}) {
|
|
2676
2553
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2677
|
-
|
|
2554
|
+
SelectPrimitive__namespace.Label,
|
|
2678
2555
|
{
|
|
2679
|
-
"data-slot": "
|
|
2680
|
-
|
|
2681
|
-
|
|
2556
|
+
"data-slot": "select-label",
|
|
2557
|
+
className: cn("text-muted-foreground px-2 py-1.5 text-xs", className),
|
|
2558
|
+
...props
|
|
2559
|
+
}
|
|
2560
|
+
);
|
|
2561
|
+
}
|
|
2562
|
+
function SelectItem({
|
|
2563
|
+
className,
|
|
2564
|
+
children,
|
|
2565
|
+
...props
|
|
2566
|
+
}) {
|
|
2567
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2568
|
+
SelectPrimitive__namespace.Item,
|
|
2569
|
+
{
|
|
2570
|
+
"data-slot": "select-item",
|
|
2682
2571
|
className: cn(
|
|
2683
|
-
"bg-
|
|
2572
|
+
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
2684
2573
|
className
|
|
2685
2574
|
),
|
|
2686
|
-
...props
|
|
2575
|
+
...props,
|
|
2576
|
+
children: [
|
|
2577
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckIcon, { className: "size-4" }) }) }),
|
|
2578
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children })
|
|
2579
|
+
]
|
|
2687
2580
|
}
|
|
2688
2581
|
);
|
|
2689
2582
|
}
|
|
2690
|
-
function
|
|
2691
|
-
dateRange,
|
|
2692
|
-
onChange,
|
|
2693
|
-
label,
|
|
2694
|
-
placeholder = "Selecione o per\xEDodo",
|
|
2583
|
+
function SelectSeparator({
|
|
2695
2584
|
className,
|
|
2696
|
-
|
|
2697
|
-
withTime = false
|
|
2585
|
+
...props
|
|
2698
2586
|
}) {
|
|
2699
|
-
|
|
2700
|
-
|
|
2701
|
-
|
|
2702
|
-
|
|
2703
|
-
|
|
2704
|
-
|
|
2705
|
-
if (newRange?.from && range?.from) {
|
|
2706
|
-
const updatedFrom = new Date(newRange.from);
|
|
2707
|
-
updatedFrom.setHours(range.from.getHours());
|
|
2708
|
-
updatedFrom.setMinutes(range.from.getMinutes());
|
|
2709
|
-
let updatedTo = newRange.to ? new Date(newRange.to) : void 0;
|
|
2710
|
-
if (updatedTo && range?.to) {
|
|
2711
|
-
updatedTo.setHours(range.to.getHours());
|
|
2712
|
-
updatedTo.setMinutes(range.to.getMinutes());
|
|
2713
|
-
}
|
|
2714
|
-
setRange({ from: updatedFrom, to: updatedTo });
|
|
2715
|
-
} else {
|
|
2716
|
-
setRange(newRange);
|
|
2717
|
-
}
|
|
2718
|
-
};
|
|
2719
|
-
const handleStartTimeChange = (newDate) => {
|
|
2720
|
-
if (newDate && range?.from) {
|
|
2721
|
-
setRange({
|
|
2722
|
-
...range,
|
|
2723
|
-
from: newDate
|
|
2724
|
-
});
|
|
2587
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2588
|
+
SelectPrimitive__namespace.Separator,
|
|
2589
|
+
{
|
|
2590
|
+
"data-slot": "select-separator",
|
|
2591
|
+
className: cn("bg-border pointer-events-none -mx-1 my-1 h-px", className),
|
|
2592
|
+
...props
|
|
2725
2593
|
}
|
|
2726
|
-
|
|
2727
|
-
|
|
2728
|
-
|
|
2729
|
-
|
|
2730
|
-
|
|
2731
|
-
|
|
2732
|
-
|
|
2594
|
+
);
|
|
2595
|
+
}
|
|
2596
|
+
function SelectScrollUpButton({
|
|
2597
|
+
className,
|
|
2598
|
+
...props
|
|
2599
|
+
}) {
|
|
2600
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2601
|
+
SelectPrimitive__namespace.ScrollUpButton,
|
|
2602
|
+
{
|
|
2603
|
+
"data-slot": "select-scroll-up-button",
|
|
2604
|
+
className: cn(
|
|
2605
|
+
"flex cursor-default items-center justify-center py-1",
|
|
2606
|
+
className
|
|
2607
|
+
),
|
|
2608
|
+
...props,
|
|
2609
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUpIcon, { className: "size-4" })
|
|
2733
2610
|
}
|
|
2734
|
-
|
|
2735
|
-
|
|
2736
|
-
|
|
2737
|
-
|
|
2738
|
-
|
|
2739
|
-
|
|
2740
|
-
|
|
2741
|
-
|
|
2742
|
-
|
|
2743
|
-
|
|
2744
|
-
|
|
2745
|
-
|
|
2611
|
+
);
|
|
2612
|
+
}
|
|
2613
|
+
function SelectScrollDownButton({
|
|
2614
|
+
className,
|
|
2615
|
+
...props
|
|
2616
|
+
}) {
|
|
2617
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
2618
|
+
SelectPrimitive__namespace.ScrollDownButton,
|
|
2619
|
+
{
|
|
2620
|
+
"data-slot": "select-scroll-down-button",
|
|
2621
|
+
className: cn(
|
|
2622
|
+
"flex cursor-default items-center justify-center py-1",
|
|
2623
|
+
className
|
|
2624
|
+
),
|
|
2625
|
+
...props,
|
|
2626
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "size-4" })
|
|
2627
|
+
}
|
|
2628
|
+
);
|
|
2629
|
+
}
|
|
2630
|
+
var generateHours = (format3) => {
|
|
2631
|
+
const hours = [];
|
|
2632
|
+
const max = format3 === "24h" ? 24 : 12;
|
|
2633
|
+
const start = format3 === "24h" ? 0 : 1;
|
|
2634
|
+
for (let i = start; i < max + start; i++) {
|
|
2635
|
+
hours.push(i.toString().padStart(2, "0"));
|
|
2636
|
+
}
|
|
2637
|
+
return hours;
|
|
2638
|
+
};
|
|
2639
|
+
var generateMinutes = (step) => {
|
|
2640
|
+
const minutes = [];
|
|
2641
|
+
for (let i = 0; i < 60; i += step) {
|
|
2642
|
+
minutes.push(i.toString().padStart(2, "0"));
|
|
2643
|
+
}
|
|
2644
|
+
return minutes;
|
|
2645
|
+
};
|
|
2646
|
+
var to12HourFormat = (hour) => {
|
|
2647
|
+
const period = hour >= 12 ? "PM" : "AM";
|
|
2648
|
+
const hour12 = hour % 12 || 12;
|
|
2649
|
+
return { hour: hour12, period };
|
|
2650
|
+
};
|
|
2651
|
+
var to24HourFormat = (hour, period) => {
|
|
2652
|
+
if (period === "AM") {
|
|
2653
|
+
return hour === 12 ? 0 : hour;
|
|
2654
|
+
}
|
|
2655
|
+
return hour === 12 ? 12 : hour + 12;
|
|
2656
|
+
};
|
|
2657
|
+
var isTimeInRange = (time, minTime, maxTime) => {
|
|
2658
|
+
if (!minTime && !maxTime) return true;
|
|
2659
|
+
const [h, m] = time.split(":").map(Number);
|
|
2660
|
+
const timeMinutes = h * 60 + m;
|
|
2661
|
+
if (minTime) {
|
|
2662
|
+
const [minH, minM] = minTime.split(":").map(Number);
|
|
2663
|
+
if (timeMinutes < minH * 60 + minM) return false;
|
|
2664
|
+
}
|
|
2665
|
+
if (maxTime) {
|
|
2666
|
+
const [maxH, maxM] = maxTime.split(":").map(Number);
|
|
2667
|
+
if (timeMinutes > maxH * 60 + maxM) return false;
|
|
2668
|
+
}
|
|
2669
|
+
return true;
|
|
2670
|
+
};
|
|
2671
|
+
function TimePicker({
|
|
2672
|
+
value,
|
|
2673
|
+
onChange,
|
|
2674
|
+
format: format3 = "24h",
|
|
2675
|
+
minuteStep = 5,
|
|
2676
|
+
minTime,
|
|
2677
|
+
maxTime,
|
|
2678
|
+
disabled = false,
|
|
2679
|
+
placeholder = "HH:MM",
|
|
2680
|
+
className,
|
|
2681
|
+
showIcon = true,
|
|
2682
|
+
variant = "input"
|
|
2683
|
+
}) {
|
|
2684
|
+
const [hour, minute] = React7__namespace.useMemo(() => {
|
|
2685
|
+
if (!value) return ["", ""];
|
|
2686
|
+
const [h, m] = value.split(":");
|
|
2687
|
+
return [h || "", m || ""];
|
|
2688
|
+
}, [value]);
|
|
2689
|
+
const [period, setPeriod] = React7__namespace.useState(() => {
|
|
2690
|
+
if (!hour) return "AM";
|
|
2691
|
+
return parseInt(hour) >= 12 ? "PM" : "AM";
|
|
2692
|
+
});
|
|
2693
|
+
const updateTime = (newHour, newMinute, newPeriod) => {
|
|
2694
|
+
if (!newHour || !newMinute) return;
|
|
2695
|
+
let h = parseInt(newHour);
|
|
2696
|
+
const m = parseInt(newMinute);
|
|
2697
|
+
if (format3 === "12h" && newPeriod) {
|
|
2698
|
+
h = to24HourFormat(h, newPeriod);
|
|
2746
2699
|
}
|
|
2747
|
-
const
|
|
2748
|
-
|
|
2749
|
-
|
|
2750
|
-
return `${dateFns.format(range.from, fromFormat)} - ${dateFns.format(range.to, toFormat)}`;
|
|
2700
|
+
const timeStr = `${h.toString().padStart(2, "0")}:${m.toString().padStart(2, "0")}`;
|
|
2701
|
+
if (isTimeInRange(timeStr, minTime, maxTime)) {
|
|
2702
|
+
onChange?.(timeStr);
|
|
2751
2703
|
}
|
|
2752
|
-
return dateFns.format(range.from, fromFormat);
|
|
2753
2704
|
};
|
|
2754
|
-
|
|
2755
|
-
|
|
2756
|
-
|
|
2757
|
-
|
|
2758
|
-
|
|
2705
|
+
const handleInputChange = (e) => {
|
|
2706
|
+
const inputValue = e.target.value;
|
|
2707
|
+
const cleaned = inputValue.replace(/[^\d:]/g, "");
|
|
2708
|
+
if (cleaned.length === 2 && !cleaned.includes(":")) {
|
|
2709
|
+
const formatted = cleaned + ":";
|
|
2710
|
+
onChange?.(formatted);
|
|
2711
|
+
return;
|
|
2712
|
+
}
|
|
2713
|
+
if (cleaned.match(/^\d{2}:\d{2}$/)) {
|
|
2714
|
+
const [h, m] = cleaned.split(":").map(Number);
|
|
2715
|
+
if (h >= 0 && h <= 23 && m >= 0 && m <= 59) {
|
|
2716
|
+
if (isTimeInRange(cleaned, minTime, maxTime)) {
|
|
2717
|
+
onChange?.(cleaned);
|
|
2718
|
+
}
|
|
2719
|
+
}
|
|
2720
|
+
} else {
|
|
2721
|
+
onChange?.(cleaned);
|
|
2722
|
+
}
|
|
2723
|
+
};
|
|
2724
|
+
if (variant === "input") {
|
|
2725
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("relative", className), children: [
|
|
2726
|
+
showIcon && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "absolute left-3 top-1/2 -translate-y-1/2 size-4 text-muted-foreground pointer-events-none" }),
|
|
2727
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2728
|
+
Input,
|
|
2759
2729
|
{
|
|
2760
|
-
|
|
2761
|
-
|
|
2762
|
-
|
|
2763
|
-
|
|
2764
|
-
|
|
2730
|
+
type: "text",
|
|
2731
|
+
value: value || "",
|
|
2732
|
+
onChange: handleInputChange,
|
|
2733
|
+
placeholder,
|
|
2734
|
+
disabled,
|
|
2735
|
+
className: cn(showIcon && "pl-9"),
|
|
2736
|
+
maxLength: 5
|
|
2737
|
+
}
|
|
2738
|
+
)
|
|
2739
|
+
] });
|
|
2740
|
+
}
|
|
2741
|
+
if (variant === "select") {
|
|
2742
|
+
const hours = generateHours(format3);
|
|
2743
|
+
const minutes = generateMinutes(minuteStep);
|
|
2744
|
+
const displayHour = format3 === "12h" && hour ? to12HourFormat(parseInt(hour)).hour.toString().padStart(2, "0") : hour;
|
|
2745
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2", className), children: [
|
|
2746
|
+
showIcon && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "size-4 text-muted-foreground" }),
|
|
2747
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2748
|
+
Select,
|
|
2749
|
+
{
|
|
2750
|
+
value: displayHour,
|
|
2751
|
+
onValueChange: (h) => {
|
|
2752
|
+
const effectivePeriod = format3 === "12h" ? period : void 0;
|
|
2753
|
+
updateTime(h, minute || "00", effectivePeriod);
|
|
2754
|
+
},
|
|
2755
|
+
disabled,
|
|
2756
|
+
children: [
|
|
2757
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[70px]", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "HH" }) }),
|
|
2758
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: hours.map((h) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: h, children: h }, h)) })
|
|
2759
|
+
]
|
|
2760
|
+
}
|
|
2761
|
+
),
|
|
2762
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground font-medium", children: ":" }),
|
|
2763
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2764
|
+
Select,
|
|
2765
|
+
{
|
|
2766
|
+
value: minute,
|
|
2767
|
+
onValueChange: (m) => {
|
|
2768
|
+
const effectivePeriod = format3 === "12h" ? period : void 0;
|
|
2769
|
+
updateTime(hour || "00", m, effectivePeriod);
|
|
2770
|
+
},
|
|
2771
|
+
disabled,
|
|
2772
|
+
children: [
|
|
2773
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[70px]", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "MM" }) }),
|
|
2774
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: minutes.map((m) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: m, children: m }, m)) })
|
|
2775
|
+
]
|
|
2776
|
+
}
|
|
2777
|
+
),
|
|
2778
|
+
format3 === "12h" && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2779
|
+
Select,
|
|
2780
|
+
{
|
|
2781
|
+
value: period,
|
|
2782
|
+
onValueChange: (p) => {
|
|
2783
|
+
setPeriod(p);
|
|
2784
|
+
if (hour && minute) {
|
|
2785
|
+
updateTime(hour, minute, p);
|
|
2786
|
+
}
|
|
2787
|
+
},
|
|
2788
|
+
disabled,
|
|
2789
|
+
children: [
|
|
2790
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[70px]", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {}) }),
|
|
2791
|
+
/* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { children: [
|
|
2792
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "AM", children: "AM" }),
|
|
2793
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "PM", children: "PM" })
|
|
2794
|
+
] })
|
|
2795
|
+
]
|
|
2796
|
+
}
|
|
2797
|
+
)
|
|
2798
|
+
] });
|
|
2799
|
+
}
|
|
2800
|
+
if (variant === "inline") {
|
|
2801
|
+
const hours = generateHours(format3);
|
|
2802
|
+
const minutes = generateMinutes(minuteStep);
|
|
2803
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2", className), children: [
|
|
2804
|
+
showIcon && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Clock, { className: "size-4 text-muted-foreground" }),
|
|
2805
|
+
/* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-sm text-muted-foreground", children: "Hor\xE1rio:" }),
|
|
2806
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2807
|
+
Select,
|
|
2808
|
+
{
|
|
2809
|
+
value: hour,
|
|
2810
|
+
onValueChange: (h) => updateTime(h, minute || "00", format3 === "12h" ? period : void 0),
|
|
2811
|
+
disabled,
|
|
2812
|
+
children: [
|
|
2813
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[65px] h-8 text-sm", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "HH" }) }),
|
|
2814
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: hours.map((h) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: h, children: h }, h)) })
|
|
2815
|
+
]
|
|
2816
|
+
}
|
|
2817
|
+
),
|
|
2818
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: ":" }),
|
|
2819
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
2820
|
+
Select,
|
|
2821
|
+
{
|
|
2822
|
+
value: minute,
|
|
2823
|
+
onValueChange: (m) => updateTime(hour || "00", m, format3 === "12h" ? period : void 0),
|
|
2824
|
+
disabled,
|
|
2825
|
+
children: [
|
|
2826
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[65px] h-8 text-sm", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, { placeholder: "MM" }) }),
|
|
2827
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectContent, { children: minutes.map((m) => /* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: m, children: m }, m)) })
|
|
2828
|
+
]
|
|
2829
|
+
}
|
|
2830
|
+
),
|
|
2831
|
+
format3 === "12h" && /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2832
|
+
Select,
|
|
2833
|
+
{
|
|
2834
|
+
value: period,
|
|
2835
|
+
onValueChange: (p) => {
|
|
2836
|
+
setPeriod(p);
|
|
2837
|
+
if (hour && minute) {
|
|
2838
|
+
updateTime(hour, minute, p);
|
|
2839
|
+
}
|
|
2840
|
+
},
|
|
2765
2841
|
disabled,
|
|
2766
2842
|
children: [
|
|
2767
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2768
|
-
/* @__PURE__ */ jsxRuntime.
|
|
2843
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectTrigger, { className: "w-[65px] h-8 text-sm", children: /* @__PURE__ */ jsxRuntime.jsx(SelectValue, {}) }),
|
|
2844
|
+
/* @__PURE__ */ jsxRuntime.jsxs(SelectContent, { children: [
|
|
2845
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "AM", children: "AM" }),
|
|
2846
|
+
/* @__PURE__ */ jsxRuntime.jsx(SelectItem, { value: "PM", children: "PM" })
|
|
2847
|
+
] })
|
|
2769
2848
|
]
|
|
2770
2849
|
}
|
|
2850
|
+
)
|
|
2851
|
+
] });
|
|
2852
|
+
}
|
|
2853
|
+
return null;
|
|
2854
|
+
}
|
|
2855
|
+
TimePicker.displayName = "TimePicker";
|
|
2856
|
+
function DatePicker({
|
|
2857
|
+
value,
|
|
2858
|
+
onChange,
|
|
2859
|
+
placeholder = "Selecione uma data",
|
|
2860
|
+
disabled = false,
|
|
2861
|
+
minDate,
|
|
2862
|
+
maxDate,
|
|
2863
|
+
dateFormat,
|
|
2864
|
+
locale: locale$1 = locale.ptBR,
|
|
2865
|
+
className,
|
|
2866
|
+
error = false,
|
|
2867
|
+
showTime = false,
|
|
2868
|
+
timeFormat = "24h",
|
|
2869
|
+
minuteStep = 5,
|
|
2870
|
+
defaultTime = "09:00",
|
|
2871
|
+
id,
|
|
2872
|
+
name
|
|
2873
|
+
}) {
|
|
2874
|
+
const [open, setOpen] = React7__namespace.useState(false);
|
|
2875
|
+
const displayFormat = dateFormat || (showTime ? "dd/MM/yyyy HH:mm" : "dd/MM/yyyy");
|
|
2876
|
+
const currentTime = React7__namespace.useMemo(() => {
|
|
2877
|
+
if (!value) return defaultTime;
|
|
2878
|
+
const hours = value.getHours().toString().padStart(2, "0");
|
|
2879
|
+
const minutes = value.getMinutes().toString().padStart(2, "0");
|
|
2880
|
+
return `${hours}:${minutes}`;
|
|
2881
|
+
}, [value, defaultTime]);
|
|
2882
|
+
const handleDateSelect = (date) => {
|
|
2883
|
+
if (!date) {
|
|
2884
|
+
onChange?.(void 0);
|
|
2885
|
+
return;
|
|
2886
|
+
}
|
|
2887
|
+
if (showTime) {
|
|
2888
|
+
const [hours, minutes] = currentTime.split(":").map(Number);
|
|
2889
|
+
date.setHours(hours, minutes, 0, 0);
|
|
2890
|
+
} else {
|
|
2891
|
+
date.setHours(0, 0, 0, 0);
|
|
2892
|
+
}
|
|
2893
|
+
onChange?.(date);
|
|
2894
|
+
if (!showTime) {
|
|
2895
|
+
setOpen(false);
|
|
2896
|
+
}
|
|
2897
|
+
};
|
|
2898
|
+
const handleTimeChange = (time) => {
|
|
2899
|
+
if (!value) {
|
|
2900
|
+
const today = /* @__PURE__ */ new Date();
|
|
2901
|
+
const [hours, minutes] = time.split(":").map(Number);
|
|
2902
|
+
today.setHours(hours, minutes, 0, 0);
|
|
2903
|
+
onChange?.(today);
|
|
2904
|
+
} else {
|
|
2905
|
+
const newDate = new Date(value);
|
|
2906
|
+
const [hours, minutes] = time.split(":").map(Number);
|
|
2907
|
+
newDate.setHours(hours, minutes, 0, 0);
|
|
2908
|
+
onChange?.(newDate);
|
|
2909
|
+
}
|
|
2910
|
+
};
|
|
2911
|
+
const displayValue = React7__namespace.useMemo(() => {
|
|
2912
|
+
if (!value) return "";
|
|
2913
|
+
return dateFns.format(value, displayFormat, { locale: locale$1 });
|
|
2914
|
+
}, [value, displayFormat, locale$1]);
|
|
2915
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
|
|
2916
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
2917
|
+
Button,
|
|
2918
|
+
{
|
|
2919
|
+
id,
|
|
2920
|
+
name,
|
|
2921
|
+
variant: "outline",
|
|
2922
|
+
disabled,
|
|
2923
|
+
className: cn(
|
|
2924
|
+
"w-full justify-start text-left font-normal",
|
|
2925
|
+
!value && "text-muted-foreground",
|
|
2926
|
+
error && "border-destructive focus-visible:ring-destructive/20",
|
|
2927
|
+
className
|
|
2928
|
+
),
|
|
2929
|
+
children: [
|
|
2930
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "mr-2 size-4" }),
|
|
2931
|
+
displayValue || placeholder
|
|
2932
|
+
]
|
|
2933
|
+
}
|
|
2934
|
+
) }),
|
|
2935
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { className: "w-auto p-0", align: "start", children: [
|
|
2936
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2937
|
+
Calendar2,
|
|
2938
|
+
{
|
|
2939
|
+
mode: "single",
|
|
2940
|
+
selected: value,
|
|
2941
|
+
onSelect: handleDateSelect,
|
|
2942
|
+
disabled: (date) => {
|
|
2943
|
+
if (minDate && date < minDate) return true;
|
|
2944
|
+
if (maxDate && date > maxDate) return true;
|
|
2945
|
+
return false;
|
|
2946
|
+
},
|
|
2947
|
+
locale: locale$1,
|
|
2948
|
+
initialFocus: true
|
|
2949
|
+
}
|
|
2950
|
+
),
|
|
2951
|
+
showTime && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t p-3", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2952
|
+
TimePicker,
|
|
2953
|
+
{
|
|
2954
|
+
value: currentTime,
|
|
2955
|
+
onChange: handleTimeChange,
|
|
2956
|
+
format: timeFormat,
|
|
2957
|
+
minuteStep,
|
|
2958
|
+
variant: "inline",
|
|
2959
|
+
showIcon: true
|
|
2960
|
+
}
|
|
2771
2961
|
) }),
|
|
2772
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2962
|
+
showTime && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t p-3 flex justify-end", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
2963
|
+
Button,
|
|
2964
|
+
{
|
|
2965
|
+
size: "sm",
|
|
2966
|
+
onClick: () => setOpen(false),
|
|
2967
|
+
children: "Confirmar"
|
|
2968
|
+
}
|
|
2969
|
+
) })
|
|
2970
|
+
] })
|
|
2971
|
+
] });
|
|
2972
|
+
}
|
|
2973
|
+
DatePicker.displayName = "DatePicker";
|
|
2974
|
+
var getDefaultPresets = () => {
|
|
2975
|
+
const today = /* @__PURE__ */ new Date();
|
|
2976
|
+
today.setHours(0, 0, 0, 0);
|
|
2977
|
+
return [
|
|
2978
|
+
{
|
|
2979
|
+
label: "Hoje",
|
|
2980
|
+
value: { from: today, to: today }
|
|
2981
|
+
},
|
|
2982
|
+
{
|
|
2983
|
+
label: "\xDAltimos 7 dias",
|
|
2984
|
+
value: { from: dateFns.subDays(today, 6), to: today }
|
|
2985
|
+
},
|
|
2986
|
+
{
|
|
2987
|
+
label: "\xDAltimos 30 dias",
|
|
2988
|
+
value: { from: dateFns.subDays(today, 29), to: today }
|
|
2989
|
+
},
|
|
2990
|
+
{
|
|
2991
|
+
label: "Este m\xEAs",
|
|
2992
|
+
value: { from: dateFns.startOfMonth(today), to: today }
|
|
2993
|
+
},
|
|
2994
|
+
{
|
|
2995
|
+
label: "M\xEAs passado",
|
|
2996
|
+
value: {
|
|
2997
|
+
from: dateFns.startOfMonth(dateFns.subMonths(today, 1)),
|
|
2998
|
+
to: dateFns.endOfMonth(dateFns.subMonths(today, 1))
|
|
2999
|
+
}
|
|
3000
|
+
}
|
|
3001
|
+
];
|
|
3002
|
+
};
|
|
3003
|
+
function DateRangePicker({
|
|
3004
|
+
value,
|
|
3005
|
+
onChange,
|
|
3006
|
+
placeholder = "Selecione um per\xEDodo",
|
|
3007
|
+
disabled = false,
|
|
3008
|
+
minDate,
|
|
3009
|
+
maxDate,
|
|
3010
|
+
dateFormat = "dd/MM/yyyy",
|
|
3011
|
+
locale: locale$1 = locale.ptBR,
|
|
3012
|
+
className,
|
|
3013
|
+
error = false,
|
|
3014
|
+
numberOfMonths = 2,
|
|
3015
|
+
showTime = false,
|
|
3016
|
+
timeFormat = "24h",
|
|
3017
|
+
minuteStep = 15,
|
|
3018
|
+
presets,
|
|
3019
|
+
showDefaultPresets = true,
|
|
3020
|
+
id,
|
|
3021
|
+
name
|
|
3022
|
+
}) {
|
|
3023
|
+
const [open, setOpen] = React7__namespace.useState(false);
|
|
3024
|
+
const displayFormat = showTime ? `${dateFormat} HH:mm` : dateFormat;
|
|
3025
|
+
const allPresets = React7__namespace.useMemo(() => {
|
|
3026
|
+
const defaults = showDefaultPresets ? getDefaultPresets() : [];
|
|
3027
|
+
return [...defaults, ...presets || []];
|
|
3028
|
+
}, [presets, showDefaultPresets]);
|
|
3029
|
+
const startTime = React7__namespace.useMemo(() => {
|
|
3030
|
+
if (!value?.from) return "00:00";
|
|
3031
|
+
const h = value.from.getHours().toString().padStart(2, "0");
|
|
3032
|
+
const m = value.from.getMinutes().toString().padStart(2, "0");
|
|
3033
|
+
return `${h}:${m}`;
|
|
3034
|
+
}, [value?.from]);
|
|
3035
|
+
const endTime = React7__namespace.useMemo(() => {
|
|
3036
|
+
if (!value?.to) return "23:59";
|
|
3037
|
+
const h = value.to.getHours().toString().padStart(2, "0");
|
|
3038
|
+
const m = value.to.getMinutes().toString().padStart(2, "0");
|
|
3039
|
+
return `${h}:${m}`;
|
|
3040
|
+
}, [value?.to]);
|
|
3041
|
+
const handleDateSelect = (range) => {
|
|
3042
|
+
if (!range) {
|
|
3043
|
+
onChange?.(void 0);
|
|
3044
|
+
return;
|
|
3045
|
+
}
|
|
3046
|
+
if (showTime) {
|
|
3047
|
+
if (range.from) {
|
|
3048
|
+
const [h, m] = startTime.split(":").map(Number);
|
|
3049
|
+
range.from.setHours(h, m, 0, 0);
|
|
3050
|
+
}
|
|
3051
|
+
if (range.to) {
|
|
3052
|
+
const [h, m] = endTime.split(":").map(Number);
|
|
3053
|
+
range.to.setHours(h, m, 0, 0);
|
|
3054
|
+
}
|
|
3055
|
+
} else {
|
|
3056
|
+
if (range.from) range.from.setHours(0, 0, 0, 0);
|
|
3057
|
+
if (range.to) range.to.setHours(23, 59, 59, 999);
|
|
3058
|
+
}
|
|
3059
|
+
onChange?.(range);
|
|
3060
|
+
};
|
|
3061
|
+
const handleStartTimeChange = (time) => {
|
|
3062
|
+
if (!value?.from) return;
|
|
3063
|
+
const newFrom = new Date(value.from);
|
|
3064
|
+
const [h, m] = time.split(":").map(Number);
|
|
3065
|
+
newFrom.setHours(h, m, 0, 0);
|
|
3066
|
+
onChange?.({ ...value, from: newFrom });
|
|
3067
|
+
};
|
|
3068
|
+
const handleEndTimeChange = (time) => {
|
|
3069
|
+
if (!value?.to) return;
|
|
3070
|
+
const newTo = new Date(value.to);
|
|
3071
|
+
const [h, m] = time.split(":").map(Number);
|
|
3072
|
+
newTo.setHours(h, m, 0, 0);
|
|
3073
|
+
onChange?.({ ...value, to: newTo });
|
|
3074
|
+
};
|
|
3075
|
+
const handlePresetSelect = (preset) => {
|
|
3076
|
+
const newRange = {
|
|
3077
|
+
from: new Date(preset.value.from),
|
|
3078
|
+
to: new Date(preset.value.to)
|
|
3079
|
+
};
|
|
3080
|
+
if (showTime) {
|
|
3081
|
+
const [sh, sm] = startTime.split(":").map(Number);
|
|
3082
|
+
const [eh, em] = endTime.split(":").map(Number);
|
|
3083
|
+
newRange.from.setHours(sh, sm, 0, 0);
|
|
3084
|
+
newRange.to.setHours(eh, em, 0, 0);
|
|
3085
|
+
}
|
|
3086
|
+
onChange?.(newRange);
|
|
3087
|
+
};
|
|
3088
|
+
const displayValue = React7__namespace.useMemo(() => {
|
|
3089
|
+
if (!value?.from) return "";
|
|
3090
|
+
const fromStr = dateFns.format(value.from, displayFormat, { locale: locale$1 });
|
|
3091
|
+
if (!value.to) return fromStr;
|
|
3092
|
+
const toStr = dateFns.format(value.to, displayFormat, { locale: locale$1 });
|
|
3093
|
+
return `${fromStr} \u2192 ${toStr}`;
|
|
3094
|
+
}, [value, displayFormat, locale$1]);
|
|
3095
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open, onOpenChange: setOpen, children: [
|
|
3096
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
3097
|
+
Button,
|
|
3098
|
+
{
|
|
3099
|
+
id,
|
|
3100
|
+
name,
|
|
3101
|
+
variant: "outline",
|
|
3102
|
+
disabled,
|
|
3103
|
+
className: cn(
|
|
3104
|
+
"w-full justify-start text-left font-normal",
|
|
3105
|
+
!value && "text-muted-foreground",
|
|
3106
|
+
error && "border-destructive focus-visible:ring-destructive/20",
|
|
3107
|
+
className
|
|
3108
|
+
),
|
|
3109
|
+
children: [
|
|
3110
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.CalendarIcon, { className: "mr-2 size-4" }),
|
|
3111
|
+
displayValue || placeholder
|
|
3112
|
+
]
|
|
3113
|
+
}
|
|
3114
|
+
) }),
|
|
3115
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", children: [
|
|
3116
|
+
allPresets.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-r p-3 space-y-1 min-w-[140px]", children: [
|
|
3117
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-muted-foreground mb-2", children: "Atalhos" }),
|
|
3118
|
+
allPresets.map((preset) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
3119
|
+
Button,
|
|
3120
|
+
{
|
|
3121
|
+
variant: "ghost",
|
|
3122
|
+
size: "sm",
|
|
3123
|
+
className: "w-full justify-start text-sm h-8",
|
|
3124
|
+
onClick: () => handlePresetSelect(preset),
|
|
3125
|
+
children: preset.label
|
|
3126
|
+
},
|
|
3127
|
+
preset.label
|
|
3128
|
+
))
|
|
3129
|
+
] }),
|
|
3130
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
2773
3131
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2774
3132
|
Calendar2,
|
|
2775
3133
|
{
|
|
2776
3134
|
mode: "range",
|
|
2777
|
-
selected:
|
|
2778
|
-
onSelect:
|
|
2779
|
-
numberOfMonths
|
|
3135
|
+
selected: value,
|
|
3136
|
+
onSelect: handleDateSelect,
|
|
3137
|
+
numberOfMonths,
|
|
3138
|
+
disabled: (date) => {
|
|
3139
|
+
if (minDate && date < minDate) return true;
|
|
3140
|
+
if (maxDate && date > maxDate) return true;
|
|
3141
|
+
return false;
|
|
3142
|
+
},
|
|
3143
|
+
locale: locale$1,
|
|
2780
3144
|
initialFocus: true
|
|
2781
3145
|
}
|
|
2782
3146
|
),
|
|
2783
|
-
|
|
2784
|
-
/* @__PURE__ */ jsxRuntime.
|
|
2785
|
-
|
|
3147
|
+
showTime && value?.from && value?.to && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t p-3 flex gap-6", children: [
|
|
3148
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
|
|
3149
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-muted-foreground mb-2", children: "Hora in\xEDcio" }),
|
|
2786
3150
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2787
3151
|
TimePicker,
|
|
2788
3152
|
{
|
|
2789
|
-
|
|
3153
|
+
value: startTime,
|
|
2790
3154
|
onChange: handleStartTimeChange,
|
|
2791
|
-
|
|
3155
|
+
format: timeFormat,
|
|
3156
|
+
minuteStep,
|
|
3157
|
+
variant: "select",
|
|
3158
|
+
showIcon: false
|
|
2792
3159
|
}
|
|
2793
|
-
)
|
|
2794
|
-
|
|
3160
|
+
)
|
|
3161
|
+
] }),
|
|
3162
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1", children: [
|
|
3163
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs font-medium text-muted-foreground mb-2", children: "Hora fim" }),
|
|
3164
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2795
3165
|
TimePicker,
|
|
2796
3166
|
{
|
|
2797
|
-
|
|
3167
|
+
value: endTime,
|
|
2798
3168
|
onChange: handleEndTimeChange,
|
|
2799
|
-
|
|
3169
|
+
format: timeFormat,
|
|
3170
|
+
minuteStep,
|
|
3171
|
+
variant: "select",
|
|
3172
|
+
showIcon: false
|
|
2800
3173
|
}
|
|
2801
3174
|
)
|
|
2802
3175
|
] })
|
|
2803
3176
|
] }),
|
|
2804
|
-
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex
|
|
3177
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t p-3 flex justify-end gap-2", children: [
|
|
2805
3178
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2806
3179
|
Button,
|
|
2807
3180
|
{
|
|
2808
3181
|
variant: "outline",
|
|
2809
3182
|
size: "sm",
|
|
2810
|
-
onClick:
|
|
2811
|
-
|
|
2812
|
-
|
|
3183
|
+
onClick: () => {
|
|
3184
|
+
onChange?.(void 0);
|
|
3185
|
+
},
|
|
3186
|
+
children: "Limpar"
|
|
2813
3187
|
}
|
|
2814
3188
|
),
|
|
2815
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
2816
|
-
Button,
|
|
2817
|
-
{
|
|
2818
|
-
size: "sm",
|
|
2819
|
-
onClick: handleConfirm,
|
|
2820
|
-
className: "flex-1",
|
|
2821
|
-
children: "Confirmar"
|
|
2822
|
-
}
|
|
2823
|
-
)
|
|
3189
|
+
/* @__PURE__ */ jsxRuntime.jsx(Button, { size: "sm", onClick: () => setOpen(false), children: "Confirmar" })
|
|
2824
3190
|
] })
|
|
2825
|
-
] })
|
|
2826
|
-
] })
|
|
3191
|
+
] })
|
|
3192
|
+
] }) })
|
|
2827
3193
|
] });
|
|
2828
3194
|
}
|
|
3195
|
+
DateRangePicker.displayName = "DateRangePicker";
|
|
2829
3196
|
function Progress({
|
|
2830
3197
|
className,
|
|
2831
3198
|
value,
|
|
@@ -4618,180 +4985,47 @@ function ResizableHandle({
|
|
|
4618
4985
|
}
|
|
4619
4986
|
);
|
|
4620
4987
|
}
|
|
4621
|
-
function
|
|
4988
|
+
function Separator5({
|
|
4989
|
+
className,
|
|
4990
|
+
orientation = "horizontal",
|
|
4991
|
+
decorative = true,
|
|
4622
4992
|
...props
|
|
4623
4993
|
}) {
|
|
4624
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4994
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4995
|
+
SeparatorPrimitive__namespace.Root,
|
|
4996
|
+
{
|
|
4997
|
+
"data-slot": "separator-root",
|
|
4998
|
+
decorative,
|
|
4999
|
+
orientation,
|
|
5000
|
+
className: cn(
|
|
5001
|
+
"bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px",
|
|
5002
|
+
className
|
|
5003
|
+
),
|
|
5004
|
+
...props
|
|
5005
|
+
}
|
|
5006
|
+
);
|
|
4625
5007
|
}
|
|
4626
|
-
function
|
|
5008
|
+
function Sheet({ ...props }) {
|
|
5009
|
+
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { "data-slot": "sheet", ...props });
|
|
5010
|
+
}
|
|
5011
|
+
function SheetTrigger({
|
|
4627
5012
|
...props
|
|
4628
5013
|
}) {
|
|
4629
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5014
|
+
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Trigger, { "data-slot": "sheet-trigger", ...props });
|
|
4630
5015
|
}
|
|
4631
|
-
function
|
|
5016
|
+
function SheetClose({
|
|
4632
5017
|
...props
|
|
4633
5018
|
}) {
|
|
4634
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5019
|
+
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Close, { "data-slot": "sheet-close", ...props });
|
|
4635
5020
|
}
|
|
4636
|
-
function
|
|
4637
|
-
className,
|
|
4638
|
-
size = "default",
|
|
4639
|
-
children,
|
|
5021
|
+
function SheetPortal({
|
|
4640
5022
|
...props
|
|
4641
5023
|
}) {
|
|
4642
|
-
return /* @__PURE__ */ jsxRuntime.
|
|
4643
|
-
|
|
4644
|
-
|
|
4645
|
-
|
|
4646
|
-
|
|
4647
|
-
className: cn(
|
|
4648
|
-
"border-input data-[placeholder]:text-muted-foreground [&_svg:not([class*='text-'])]:text-muted-foreground focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:bg-input/30 dark:hover:bg-input/50 flex w-full items-center justify-between gap-2 rounded-md border bg-input-background px-3 py-2 text-sm whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 data-[size=default]:h-9 data-[size=sm]:h-8 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-2 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
|
|
4649
|
-
className
|
|
4650
|
-
),
|
|
4651
|
-
...props,
|
|
4652
|
-
children: [
|
|
4653
|
-
children,
|
|
4654
|
-
/* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Icon, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "size-4 opacity-50" }) })
|
|
4655
|
-
]
|
|
4656
|
-
}
|
|
4657
|
-
);
|
|
4658
|
-
}
|
|
4659
|
-
function SelectContent({
|
|
4660
|
-
className,
|
|
4661
|
-
children,
|
|
4662
|
-
position = "popper",
|
|
4663
|
-
...props
|
|
4664
|
-
}) {
|
|
4665
|
-
return /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.Portal, { children: /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4666
|
-
SelectPrimitive__namespace.Content,
|
|
4667
|
-
{
|
|
4668
|
-
"data-slot": "select-content",
|
|
4669
|
-
className: cn(
|
|
4670
|
-
"bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 max-h-(--radix-select-content-available-height) min-w-[8rem] origin-(--radix-select-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
|
|
4671
|
-
position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
|
|
4672
|
-
className
|
|
4673
|
-
),
|
|
4674
|
-
position,
|
|
4675
|
-
...props,
|
|
4676
|
-
children: [
|
|
4677
|
-
/* @__PURE__ */ jsxRuntime.jsx(SelectScrollUpButton, {}),
|
|
4678
|
-
/* @__PURE__ */ jsxRuntime.jsx(
|
|
4679
|
-
SelectPrimitive__namespace.Viewport,
|
|
4680
|
-
{
|
|
4681
|
-
className: cn(
|
|
4682
|
-
"p-1",
|
|
4683
|
-
position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"
|
|
4684
|
-
),
|
|
4685
|
-
children
|
|
4686
|
-
}
|
|
4687
|
-
),
|
|
4688
|
-
/* @__PURE__ */ jsxRuntime.jsx(SelectScrollDownButton, {})
|
|
4689
|
-
]
|
|
4690
|
-
}
|
|
4691
|
-
) });
|
|
4692
|
-
}
|
|
4693
|
-
function SelectLabel({
|
|
4694
|
-
className,
|
|
4695
|
-
...props
|
|
4696
|
-
}) {
|
|
4697
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4698
|
-
SelectPrimitive__namespace.Label,
|
|
4699
|
-
{
|
|
4700
|
-
"data-slot": "select-label",
|
|
4701
|
-
className: cn("text-muted-foreground px-2 py-1.5 text-xs", className),
|
|
4702
|
-
...props
|
|
4703
|
-
}
|
|
4704
|
-
);
|
|
4705
|
-
}
|
|
4706
|
-
function SelectItem({
|
|
4707
|
-
className,
|
|
4708
|
-
children,
|
|
4709
|
-
...props
|
|
4710
|
-
}) {
|
|
4711
|
-
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
4712
|
-
SelectPrimitive__namespace.Item,
|
|
4713
|
-
{
|
|
4714
|
-
"data-slot": "select-item",
|
|
4715
|
-
className: cn(
|
|
4716
|
-
"focus:bg-accent focus:text-accent-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex w-full cursor-default items-center gap-2 rounded-sm py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
4717
|
-
className
|
|
4718
|
-
),
|
|
4719
|
-
...props,
|
|
4720
|
-
children: [
|
|
4721
|
-
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "absolute right-2 flex size-3.5 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemIndicator, { children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.CheckIcon, { className: "size-4" }) }) }),
|
|
4722
|
-
/* @__PURE__ */ jsxRuntime.jsx(SelectPrimitive__namespace.ItemText, { children })
|
|
4723
|
-
]
|
|
4724
|
-
}
|
|
4725
|
-
);
|
|
4726
|
-
}
|
|
4727
|
-
function SelectSeparator({
|
|
4728
|
-
className,
|
|
4729
|
-
...props
|
|
4730
|
-
}) {
|
|
4731
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4732
|
-
SelectPrimitive__namespace.Separator,
|
|
4733
|
-
{
|
|
4734
|
-
"data-slot": "select-separator",
|
|
4735
|
-
className: cn("bg-border pointer-events-none -mx-1 my-1 h-px", className),
|
|
4736
|
-
...props
|
|
4737
|
-
}
|
|
4738
|
-
);
|
|
4739
|
-
}
|
|
4740
|
-
function SelectScrollUpButton({
|
|
4741
|
-
className,
|
|
4742
|
-
...props
|
|
4743
|
-
}) {
|
|
4744
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4745
|
-
SelectPrimitive__namespace.ScrollUpButton,
|
|
4746
|
-
{
|
|
4747
|
-
"data-slot": "select-scroll-up-button",
|
|
4748
|
-
className: cn(
|
|
4749
|
-
"flex cursor-default items-center justify-center py-1",
|
|
4750
|
-
className
|
|
4751
|
-
),
|
|
4752
|
-
...props,
|
|
4753
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronUpIcon, { className: "size-4" })
|
|
4754
|
-
}
|
|
4755
|
-
);
|
|
4756
|
-
}
|
|
4757
|
-
function SelectScrollDownButton({
|
|
4758
|
-
className,
|
|
4759
|
-
...props
|
|
4760
|
-
}) {
|
|
4761
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4762
|
-
SelectPrimitive__namespace.ScrollDownButton,
|
|
4763
|
-
{
|
|
4764
|
-
"data-slot": "select-scroll-down-button",
|
|
4765
|
-
className: cn(
|
|
4766
|
-
"flex cursor-default items-center justify-center py-1",
|
|
4767
|
-
className
|
|
4768
|
-
),
|
|
4769
|
-
...props,
|
|
4770
|
-
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ChevronDownIcon, { className: "size-4" })
|
|
4771
|
-
}
|
|
4772
|
-
);
|
|
4773
|
-
}
|
|
4774
|
-
function Sheet({ ...props }) {
|
|
4775
|
-
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Root, { "data-slot": "sheet", ...props });
|
|
4776
|
-
}
|
|
4777
|
-
function SheetTrigger({
|
|
4778
|
-
...props
|
|
4779
|
-
}) {
|
|
4780
|
-
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Trigger, { "data-slot": "sheet-trigger", ...props });
|
|
4781
|
-
}
|
|
4782
|
-
function SheetClose({
|
|
4783
|
-
...props
|
|
4784
|
-
}) {
|
|
4785
|
-
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Close, { "data-slot": "sheet-close", ...props });
|
|
4786
|
-
}
|
|
4787
|
-
function SheetPortal({
|
|
4788
|
-
...props
|
|
4789
|
-
}) {
|
|
4790
|
-
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Portal, { "data-slot": "sheet-portal", ...props });
|
|
4791
|
-
}
|
|
4792
|
-
var SheetOverlay = React7__namespace.forwardRef(({ className, ...props }, ref) => {
|
|
4793
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
4794
|
-
DialogPrimitive__namespace.Overlay,
|
|
5024
|
+
return /* @__PURE__ */ jsxRuntime.jsx(DialogPrimitive__namespace.Portal, { "data-slot": "sheet-portal", ...props });
|
|
5025
|
+
}
|
|
5026
|
+
var SheetOverlay = React7__namespace.forwardRef(({ className, ...props }, ref) => {
|
|
5027
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5028
|
+
DialogPrimitive__namespace.Overlay,
|
|
4795
5029
|
{
|
|
4796
5030
|
ref,
|
|
4797
5031
|
"data-slot": "sheet-overlay",
|
|
@@ -5226,7 +5460,7 @@ function SidebarSeparator({
|
|
|
5226
5460
|
...props
|
|
5227
5461
|
}) {
|
|
5228
5462
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
5229
|
-
|
|
5463
|
+
Separator5,
|
|
5230
5464
|
{
|
|
5231
5465
|
"data-slot": "sidebar-separator",
|
|
5232
5466
|
"data-sidebar": "separator",
|
|
@@ -5977,6 +6211,1095 @@ function calculatePaginationMetadata(config) {
|
|
|
5977
6211
|
hasPreviousPage: currentPage > 1
|
|
5978
6212
|
};
|
|
5979
6213
|
}
|
|
6214
|
+
function useTablePagination({
|
|
6215
|
+
data,
|
|
6216
|
+
initialPageSize = 10,
|
|
6217
|
+
resetOnDataChange = true
|
|
6218
|
+
}) {
|
|
6219
|
+
const [currentPage, setCurrentPage] = React7.useState(1);
|
|
6220
|
+
const [pageSize, setPageSize] = React7.useState(initialPageSize);
|
|
6221
|
+
React7.useMemo(() => {
|
|
6222
|
+
if (resetOnDataChange) {
|
|
6223
|
+
setCurrentPage(1);
|
|
6224
|
+
}
|
|
6225
|
+
}, [data.length, resetOnDataChange]);
|
|
6226
|
+
const totalItems = data.length;
|
|
6227
|
+
const totalPages = Math.ceil(totalItems / pageSize);
|
|
6228
|
+
const safeCurrentPage = Math.min(Math.max(1, currentPage), Math.max(1, totalPages));
|
|
6229
|
+
const startIndex = (safeCurrentPage - 1) * pageSize;
|
|
6230
|
+
const endIndex = Math.min(startIndex + pageSize, totalItems);
|
|
6231
|
+
const paginatedData = React7.useMemo(() => {
|
|
6232
|
+
return data.slice(startIndex, endIndex);
|
|
6233
|
+
}, [data, startIndex, endIndex]);
|
|
6234
|
+
const goToPage = (page) => {
|
|
6235
|
+
const targetPage = Math.max(1, Math.min(page, totalPages));
|
|
6236
|
+
setCurrentPage(targetPage);
|
|
6237
|
+
};
|
|
6238
|
+
const nextPage = () => {
|
|
6239
|
+
if (currentPage < totalPages) {
|
|
6240
|
+
setCurrentPage((p) => p + 1);
|
|
6241
|
+
}
|
|
6242
|
+
};
|
|
6243
|
+
const prevPage = () => {
|
|
6244
|
+
if (currentPage > 1) {
|
|
6245
|
+
setCurrentPage((p) => p - 1);
|
|
6246
|
+
}
|
|
6247
|
+
};
|
|
6248
|
+
const handleSetPageSize = (newSize) => {
|
|
6249
|
+
setPageSize(newSize);
|
|
6250
|
+
setCurrentPage(1);
|
|
6251
|
+
};
|
|
6252
|
+
const paginationConfig = {
|
|
6253
|
+
currentPage: safeCurrentPage,
|
|
6254
|
+
pageSize,
|
|
6255
|
+
totalItems,
|
|
6256
|
+
onPageChange: goToPage,
|
|
6257
|
+
onPageSizeChange: handleSetPageSize
|
|
6258
|
+
};
|
|
6259
|
+
const metadata = calculatePaginationMetadata(paginationConfig);
|
|
6260
|
+
return {
|
|
6261
|
+
currentPage: safeCurrentPage,
|
|
6262
|
+
pageSize,
|
|
6263
|
+
totalItems,
|
|
6264
|
+
totalPages,
|
|
6265
|
+
paginatedData,
|
|
6266
|
+
goToPage,
|
|
6267
|
+
nextPage,
|
|
6268
|
+
prevPage,
|
|
6269
|
+
setPageSize: handleSetPageSize,
|
|
6270
|
+
paginationConfig,
|
|
6271
|
+
metadata
|
|
6272
|
+
};
|
|
6273
|
+
}
|
|
6274
|
+
|
|
6275
|
+
// hooks/use-data-table.ts
|
|
6276
|
+
function useDataTable({
|
|
6277
|
+
data,
|
|
6278
|
+
initialSort = { column: null, direction: null },
|
|
6279
|
+
initialPageSize = 10,
|
|
6280
|
+
enablePagination = true
|
|
6281
|
+
}) {
|
|
6282
|
+
const [sortConfig, setSortConfig] = React7.useState(initialSort);
|
|
6283
|
+
const [filters, setFilters] = React7.useState([]);
|
|
6284
|
+
const filteredData = React7.useMemo(() => {
|
|
6285
|
+
if (filters.length === 0) return data;
|
|
6286
|
+
return data.filter((item) => {
|
|
6287
|
+
return filters.every((filter) => {
|
|
6288
|
+
const itemValue = item[filter.column];
|
|
6289
|
+
switch (filter.operator) {
|
|
6290
|
+
case "equals":
|
|
6291
|
+
return itemValue == filter.value;
|
|
6292
|
+
case "contains":
|
|
6293
|
+
return String(itemValue).toLowerCase().includes(String(filter.value).toLowerCase());
|
|
6294
|
+
case "startsWith":
|
|
6295
|
+
return String(itemValue).toLowerCase().startsWith(String(filter.value).toLowerCase());
|
|
6296
|
+
case "greaterThan":
|
|
6297
|
+
return itemValue > filter.value;
|
|
6298
|
+
case "lessThan":
|
|
6299
|
+
return itemValue < filter.value;
|
|
6300
|
+
default:
|
|
6301
|
+
return true;
|
|
6302
|
+
}
|
|
6303
|
+
});
|
|
6304
|
+
});
|
|
6305
|
+
}, [data, filters]);
|
|
6306
|
+
const sortedData = React7.useMemo(() => {
|
|
6307
|
+
if (!sortConfig.column || !sortConfig.direction) return filteredData;
|
|
6308
|
+
return [...filteredData].sort((a, b) => {
|
|
6309
|
+
const aValue = a[sortConfig.column];
|
|
6310
|
+
const bValue = b[sortConfig.column];
|
|
6311
|
+
if (aValue < bValue) return sortConfig.direction === "asc" ? -1 : 1;
|
|
6312
|
+
if (aValue > bValue) return sortConfig.direction === "asc" ? 1 : -1;
|
|
6313
|
+
return 0;
|
|
6314
|
+
});
|
|
6315
|
+
}, [filteredData, sortConfig]);
|
|
6316
|
+
const pagination = useTablePagination({
|
|
6317
|
+
data: sortedData,
|
|
6318
|
+
initialPageSize,
|
|
6319
|
+
resetOnDataChange: true
|
|
6320
|
+
// Reset to page 1 if filters change
|
|
6321
|
+
});
|
|
6322
|
+
const handleSort = (column) => {
|
|
6323
|
+
setSortConfig((current) => {
|
|
6324
|
+
if (current.column === column) {
|
|
6325
|
+
if (current.direction === "asc") return { column, direction: "desc" };
|
|
6326
|
+
if (current.direction === "desc") return { column: null, direction: null };
|
|
6327
|
+
}
|
|
6328
|
+
return { column, direction: "asc" };
|
|
6329
|
+
});
|
|
6330
|
+
};
|
|
6331
|
+
const setFilter = (column, value, operator = "contains") => {
|
|
6332
|
+
setFilters((prev) => {
|
|
6333
|
+
const existing = prev.filter((f) => f.column !== column);
|
|
6334
|
+
if (value === "" || value === null || value === void 0) {
|
|
6335
|
+
return existing;
|
|
6336
|
+
}
|
|
6337
|
+
return [...existing, { column, operator, value }];
|
|
6338
|
+
});
|
|
6339
|
+
};
|
|
6340
|
+
const removeFilter = (column) => {
|
|
6341
|
+
setFilters((prev) => prev.filter((f) => f.column !== column));
|
|
6342
|
+
};
|
|
6343
|
+
const getSortDirection = (column) => {
|
|
6344
|
+
return sortConfig.column === column ? sortConfig.direction : null;
|
|
6345
|
+
};
|
|
6346
|
+
return {
|
|
6347
|
+
data: enablePagination ? pagination.paginatedData : sortedData,
|
|
6348
|
+
state: {
|
|
6349
|
+
sort: sortConfig,
|
|
6350
|
+
filters,
|
|
6351
|
+
pagination: pagination.paginationConfig
|
|
6352
|
+
},
|
|
6353
|
+
handlers: {
|
|
6354
|
+
onSort: handleSort,
|
|
6355
|
+
setFilter,
|
|
6356
|
+
removeFilter,
|
|
6357
|
+
clearFilters: () => setFilters([])
|
|
6358
|
+
},
|
|
6359
|
+
getSortDirection
|
|
6360
|
+
};
|
|
6361
|
+
}
|
|
6362
|
+
function FilterChip({ label, value, onRemove, className }) {
|
|
6363
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
6364
|
+
Badge,
|
|
6365
|
+
{
|
|
6366
|
+
variant: "secondary",
|
|
6367
|
+
className: cn(
|
|
6368
|
+
"gap-1 pr-1 pl-2 h-7",
|
|
6369
|
+
onRemove && "pr-1",
|
|
6370
|
+
className
|
|
6371
|
+
),
|
|
6372
|
+
children: [
|
|
6373
|
+
/* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-sm", children: [
|
|
6374
|
+
label,
|
|
6375
|
+
value && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
6376
|
+
": ",
|
|
6377
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-semibold", children: value })
|
|
6378
|
+
] })
|
|
6379
|
+
] }),
|
|
6380
|
+
onRemove && /* @__PURE__ */ jsxRuntime.jsx(
|
|
6381
|
+
"button",
|
|
6382
|
+
{
|
|
6383
|
+
type: "button",
|
|
6384
|
+
onClick: onRemove,
|
|
6385
|
+
className: "ml-1 rounded-sm hover:bg-muted p-0.5 transition-colors",
|
|
6386
|
+
"aria-label": `Remove ${label} filter`,
|
|
6387
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" })
|
|
6388
|
+
}
|
|
6389
|
+
)
|
|
6390
|
+
]
|
|
6391
|
+
}
|
|
6392
|
+
);
|
|
6393
|
+
}
|
|
6394
|
+
function FilterBar({
|
|
6395
|
+
activeFilters = [],
|
|
6396
|
+
onClearAll,
|
|
6397
|
+
onOpenFilters,
|
|
6398
|
+
className,
|
|
6399
|
+
children
|
|
6400
|
+
}) {
|
|
6401
|
+
const hasFilters = activeFilters.length > 0;
|
|
6402
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2 flex-wrap", className), children: [
|
|
6403
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
6404
|
+
Button,
|
|
6405
|
+
{
|
|
6406
|
+
variant: "outline",
|
|
6407
|
+
size: "sm",
|
|
6408
|
+
onClick: onOpenFilters,
|
|
6409
|
+
className: "gap-2",
|
|
6410
|
+
children: [
|
|
6411
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Filter, { className: "h-4 w-4" }),
|
|
6412
|
+
"Filters",
|
|
6413
|
+
hasFilters && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 rounded-full bg-primary text-primary-foreground w-5 h-5 text-xs flex items-center justify-center", children: activeFilters.length })
|
|
6414
|
+
]
|
|
6415
|
+
}
|
|
6416
|
+
),
|
|
6417
|
+
hasFilters && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
6418
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-4 w-px bg-border" }),
|
|
6419
|
+
activeFilters.map((filter) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
6420
|
+
FilterChip,
|
|
6421
|
+
{
|
|
6422
|
+
label: filter.label,
|
|
6423
|
+
value: filter.value,
|
|
6424
|
+
onRemove: filter.onRemove
|
|
6425
|
+
},
|
|
6426
|
+
filter.id
|
|
6427
|
+
)),
|
|
6428
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
6429
|
+
Button,
|
|
6430
|
+
{
|
|
6431
|
+
variant: "ghost",
|
|
6432
|
+
size: "sm",
|
|
6433
|
+
onClick: onClearAll,
|
|
6434
|
+
className: "gap-1 h-7 px-2",
|
|
6435
|
+
children: [
|
|
6436
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" }),
|
|
6437
|
+
"Clear all"
|
|
6438
|
+
]
|
|
6439
|
+
}
|
|
6440
|
+
)
|
|
6441
|
+
] }),
|
|
6442
|
+
children
|
|
6443
|
+
] });
|
|
6444
|
+
}
|
|
6445
|
+
var OPERATORS = [
|
|
6446
|
+
{ value: "is", label: "\xE9", multiSelect: false },
|
|
6447
|
+
{ value: "is_not", label: "n\xE3o \xE9", multiSelect: false },
|
|
6448
|
+
{ value: "is_any_of", label: "\xE9 qualquer um de", multiSelect: true },
|
|
6449
|
+
{ value: "is_none_of", label: "n\xE3o \xE9 nenhum de", multiSelect: true },
|
|
6450
|
+
{ value: "contains", label: "cont\xE9m", multiSelect: false },
|
|
6451
|
+
{ value: "does_not_contain", label: "n\xE3o cont\xE9m", multiSelect: false },
|
|
6452
|
+
{ value: "greater_than", label: "maior que", multiSelect: false },
|
|
6453
|
+
{ value: "less_than", label: "menor que", multiSelect: false },
|
|
6454
|
+
{ value: "is_empty", label: "est\xE1 vazio", multiSelect: false },
|
|
6455
|
+
{ value: "is_not_empty", label: "n\xE3o est\xE1 vazio", multiSelect: false }
|
|
6456
|
+
];
|
|
6457
|
+
function FilterBuilder({
|
|
6458
|
+
conditions,
|
|
6459
|
+
onConditionsChange,
|
|
6460
|
+
fields,
|
|
6461
|
+
className
|
|
6462
|
+
}) {
|
|
6463
|
+
const addCondition = () => {
|
|
6464
|
+
const newCondition = {
|
|
6465
|
+
id: Math.random().toString(36).substr(2, 9),
|
|
6466
|
+
field: fields[0]?.value || "",
|
|
6467
|
+
operator: "is",
|
|
6468
|
+
value: ""
|
|
6469
|
+
};
|
|
6470
|
+
onConditionsChange([...conditions, newCondition]);
|
|
6471
|
+
};
|
|
6472
|
+
const removeCondition = (id) => {
|
|
6473
|
+
onConditionsChange(conditions.filter((c) => c.id !== id));
|
|
6474
|
+
};
|
|
6475
|
+
const updateCondition = (id, updates) => {
|
|
6476
|
+
onConditionsChange(
|
|
6477
|
+
conditions.map((c) => c.id === id ? { ...c, ...updates } : c)
|
|
6478
|
+
);
|
|
6479
|
+
};
|
|
6480
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-3", className), children: [
|
|
6481
|
+
conditions.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-center py-8 text-muted-foreground text-sm", children: 'Nenhuma condi\xE7\xE3o de filtro. Clique em "Adicionar condi\xE7\xE3o" para come\xE7ar.' }) : conditions.map((condition, index) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
6482
|
+
ConditionRow,
|
|
6483
|
+
{
|
|
6484
|
+
condition,
|
|
6485
|
+
fields,
|
|
6486
|
+
index,
|
|
6487
|
+
onUpdate: (updates) => updateCondition(condition.id, updates),
|
|
6488
|
+
onRemove: () => removeCondition(condition.id)
|
|
6489
|
+
},
|
|
6490
|
+
condition.id
|
|
6491
|
+
)),
|
|
6492
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
6493
|
+
Button,
|
|
6494
|
+
{
|
|
6495
|
+
type: "button",
|
|
6496
|
+
variant: "outline",
|
|
6497
|
+
size: "sm",
|
|
6498
|
+
onClick: addCondition,
|
|
6499
|
+
className: "gap-2",
|
|
6500
|
+
children: [
|
|
6501
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4" }),
|
|
6502
|
+
"Adicionar condi\xE7\xE3o"
|
|
6503
|
+
]
|
|
6504
|
+
}
|
|
6505
|
+
)
|
|
6506
|
+
] });
|
|
6507
|
+
}
|
|
6508
|
+
function ConditionRow({
|
|
6509
|
+
condition,
|
|
6510
|
+
fields,
|
|
6511
|
+
index,
|
|
6512
|
+
onUpdate,
|
|
6513
|
+
onRemove
|
|
6514
|
+
}) {
|
|
6515
|
+
const selectedField = fields.find((f) => f.value === condition.field);
|
|
6516
|
+
const selectedOperator = OPERATORS.find((op) => op.value === condition.operator);
|
|
6517
|
+
const isMultiSelect = selectedField?.multiSelect || selectedOperator?.multiSelect || false;
|
|
6518
|
+
const needsValue = !["is_empty", "is_not_empty"].includes(condition.operator);
|
|
6519
|
+
const valueAsArray = Array.isArray(condition.value) ? condition.value : condition.value ? [condition.value] : [];
|
|
6520
|
+
const toggleValue = (val) => {
|
|
6521
|
+
if (!isMultiSelect) {
|
|
6522
|
+
onUpdate({ value: val });
|
|
6523
|
+
return;
|
|
6524
|
+
}
|
|
6525
|
+
const currentValues = Array.isArray(condition.value) ? condition.value : [];
|
|
6526
|
+
const newValues = currentValues.includes(val) ? currentValues.filter((v) => v !== val) : [...currentValues, val];
|
|
6527
|
+
onUpdate({ value: newValues });
|
|
6528
|
+
};
|
|
6529
|
+
const removeValue = (val) => {
|
|
6530
|
+
if (!isMultiSelect) return;
|
|
6531
|
+
const currentValues = Array.isArray(condition.value) ? condition.value : [];
|
|
6532
|
+
onUpdate({ value: currentValues.filter((v) => v !== val) });
|
|
6533
|
+
};
|
|
6534
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-2 group", children: [
|
|
6535
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center h-9 px-2 text-sm text-muted-foreground", children: index === 0 ? "Onde" : "E" }),
|
|
6536
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 flex items-center gap-2 flex-wrap p-2 border rounded-lg bg-background", children: [
|
|
6537
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
|
|
6538
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6539
|
+
Button,
|
|
6540
|
+
{
|
|
6541
|
+
variant: "ghost",
|
|
6542
|
+
size: "sm",
|
|
6543
|
+
className: "h-7 px-2 font-normal hover:bg-muted",
|
|
6544
|
+
children: selectedField?.label || "Selecionar campo"
|
|
6545
|
+
}
|
|
6546
|
+
) }),
|
|
6547
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-[200px] p-2", align: "start", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: fields.map((field) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
6548
|
+
Button,
|
|
6549
|
+
{
|
|
6550
|
+
variant: "ghost",
|
|
6551
|
+
size: "sm",
|
|
6552
|
+
className: cn(
|
|
6553
|
+
"w-full justify-start",
|
|
6554
|
+
condition.field === field.value && "bg-muted"
|
|
6555
|
+
),
|
|
6556
|
+
onClick: () => onUpdate({
|
|
6557
|
+
field: field.value,
|
|
6558
|
+
value: field.multiSelect ? [] : ""
|
|
6559
|
+
}),
|
|
6560
|
+
children: field.label
|
|
6561
|
+
},
|
|
6562
|
+
field.value
|
|
6563
|
+
)) }) })
|
|
6564
|
+
] }),
|
|
6565
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
|
|
6566
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6567
|
+
Button,
|
|
6568
|
+
{
|
|
6569
|
+
variant: "ghost",
|
|
6570
|
+
size: "sm",
|
|
6571
|
+
className: "h-7 px-2 font-normal hover:bg-muted text-muted-foreground",
|
|
6572
|
+
children: selectedOperator?.label || "is"
|
|
6573
|
+
}
|
|
6574
|
+
) }),
|
|
6575
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-[200px] p-2", align: "start", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: OPERATORS.map((op) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
6576
|
+
Button,
|
|
6577
|
+
{
|
|
6578
|
+
variant: "ghost",
|
|
6579
|
+
size: "sm",
|
|
6580
|
+
className: cn(
|
|
6581
|
+
"w-full justify-start",
|
|
6582
|
+
condition.operator === op.value && "bg-muted"
|
|
6583
|
+
),
|
|
6584
|
+
onClick: () => onUpdate({
|
|
6585
|
+
operator: op.value,
|
|
6586
|
+
value: op.multiSelect ? [] : ""
|
|
6587
|
+
}),
|
|
6588
|
+
children: op.label
|
|
6589
|
+
},
|
|
6590
|
+
op.value
|
|
6591
|
+
)) }) })
|
|
6592
|
+
] }),
|
|
6593
|
+
needsValue && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
6594
|
+
selectedField?.options ? (
|
|
6595
|
+
// Select field with options
|
|
6596
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
|
|
6597
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6598
|
+
Button,
|
|
6599
|
+
{
|
|
6600
|
+
variant: "ghost",
|
|
6601
|
+
size: "sm",
|
|
6602
|
+
className: "h-7 px-2 font-normal hover:bg-muted",
|
|
6603
|
+
children: isMultiSelect && valueAsArray.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-1", children: [
|
|
6604
|
+
valueAsArray.length,
|
|
6605
|
+
" selecionado",
|
|
6606
|
+
valueAsArray.length > 1 ? "s" : ""
|
|
6607
|
+
] }) : !isMultiSelect && condition.value ? selectedField.options.find(
|
|
6608
|
+
(opt) => opt.value === condition.value
|
|
6609
|
+
)?.label || "Selecionar valor" : "Selecionar valor"
|
|
6610
|
+
}
|
|
6611
|
+
) }),
|
|
6612
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-[240px] p-3", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
6613
|
+
/* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-xs text-muted-foreground", children: isMultiSelect ? "Selecionar valores" : "Selecionar valor" }),
|
|
6614
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2 max-h-[200px] overflow-y-auto", children: selectedField.options.map((option) => {
|
|
6615
|
+
const isSelected = isMultiSelect ? valueAsArray.includes(option.value) : condition.value === option.value;
|
|
6616
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
6617
|
+
"div",
|
|
6618
|
+
{
|
|
6619
|
+
className: "flex items-center space-x-2",
|
|
6620
|
+
children: isMultiSelect ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
6621
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6622
|
+
Checkbox,
|
|
6623
|
+
{
|
|
6624
|
+
id: `${condition.id}-${option.value}`,
|
|
6625
|
+
checked: isSelected,
|
|
6626
|
+
onCheckedChange: () => toggleValue(option.value)
|
|
6627
|
+
}
|
|
6628
|
+
),
|
|
6629
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6630
|
+
"label",
|
|
6631
|
+
{
|
|
6632
|
+
htmlFor: `${condition.id}-${option.value}`,
|
|
6633
|
+
className: "text-sm cursor-pointer flex-1",
|
|
6634
|
+
children: option.label
|
|
6635
|
+
}
|
|
6636
|
+
)
|
|
6637
|
+
] }) : /* @__PURE__ */ jsxRuntime.jsx(
|
|
6638
|
+
Button,
|
|
6639
|
+
{
|
|
6640
|
+
variant: "ghost",
|
|
6641
|
+
size: "sm",
|
|
6642
|
+
className: cn(
|
|
6643
|
+
"w-full justify-start",
|
|
6644
|
+
isSelected && "bg-muted"
|
|
6645
|
+
),
|
|
6646
|
+
onClick: () => onUpdate({ value: option.value }),
|
|
6647
|
+
children: option.label
|
|
6648
|
+
}
|
|
6649
|
+
)
|
|
6650
|
+
},
|
|
6651
|
+
option.value
|
|
6652
|
+
);
|
|
6653
|
+
}) })
|
|
6654
|
+
] }) })
|
|
6655
|
+
] })
|
|
6656
|
+
) : (
|
|
6657
|
+
// Text/Number input
|
|
6658
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Popover, { children: [
|
|
6659
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6660
|
+
Button,
|
|
6661
|
+
{
|
|
6662
|
+
variant: "ghost",
|
|
6663
|
+
size: "sm",
|
|
6664
|
+
className: "h-7 px-2 font-normal hover:bg-muted max-w-[200px] truncate",
|
|
6665
|
+
children: condition.value || "Inserir valor"
|
|
6666
|
+
}
|
|
6667
|
+
) }),
|
|
6668
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverContent, { className: "w-[240px] p-3", align: "start", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
|
|
6669
|
+
/* @__PURE__ */ jsxRuntime.jsx(Label, { className: "text-xs text-muted-foreground", children: "Inserir valor" }),
|
|
6670
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6671
|
+
Input,
|
|
6672
|
+
{
|
|
6673
|
+
type: selectedField?.type === "number" ? "number" : "text",
|
|
6674
|
+
value: Array.isArray(condition.value) ? "" : condition.value,
|
|
6675
|
+
onChange: (e) => onUpdate({ value: e.target.value }),
|
|
6676
|
+
placeholder: "Digite o valor...",
|
|
6677
|
+
autoFocus: true
|
|
6678
|
+
}
|
|
6679
|
+
)
|
|
6680
|
+
] }) })
|
|
6681
|
+
] })
|
|
6682
|
+
),
|
|
6683
|
+
isMultiSelect && valueAsArray.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-1 flex-wrap", children: valueAsArray.map((val) => {
|
|
6684
|
+
const optionLabel = selectedField?.options?.find((opt) => opt.value === val)?.label || val;
|
|
6685
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
6686
|
+
Badge,
|
|
6687
|
+
{
|
|
6688
|
+
variant: "secondary",
|
|
6689
|
+
className: "gap-1 h-6 text-xs",
|
|
6690
|
+
children: [
|
|
6691
|
+
optionLabel,
|
|
6692
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6693
|
+
"button",
|
|
6694
|
+
{
|
|
6695
|
+
type: "button",
|
|
6696
|
+
onClick: () => removeValue(val),
|
|
6697
|
+
className: "ml-1 rounded-sm hover:bg-muted p-0.5 transition-colors",
|
|
6698
|
+
"aria-label": `Remover ${optionLabel}`,
|
|
6699
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-3 w-3" })
|
|
6700
|
+
}
|
|
6701
|
+
)
|
|
6702
|
+
]
|
|
6703
|
+
},
|
|
6704
|
+
val
|
|
6705
|
+
);
|
|
6706
|
+
}) })
|
|
6707
|
+
] })
|
|
6708
|
+
] }),
|
|
6709
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6710
|
+
Button,
|
|
6711
|
+
{
|
|
6712
|
+
type: "button",
|
|
6713
|
+
variant: "ghost",
|
|
6714
|
+
size: "sm",
|
|
6715
|
+
onClick: onRemove,
|
|
6716
|
+
className: "h-9 w-9 p-0 opacity-0 group-hover:opacity-100 transition-opacity",
|
|
6717
|
+
"aria-label": "Remover condi\xE7\xE3o",
|
|
6718
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.X, { className: "h-4 w-4" })
|
|
6719
|
+
}
|
|
6720
|
+
)
|
|
6721
|
+
] });
|
|
6722
|
+
}
|
|
6723
|
+
function DataTable({
|
|
6724
|
+
data,
|
|
6725
|
+
columns,
|
|
6726
|
+
searchPlaceholder = "Buscar...",
|
|
6727
|
+
searchableColumns,
|
|
6728
|
+
enableSearch = true,
|
|
6729
|
+
filterFields = [],
|
|
6730
|
+
enableFilters = false,
|
|
6731
|
+
pageSizeOptions = [5, 10, 20, 50],
|
|
6732
|
+
initialPageSize = 10,
|
|
6733
|
+
toolbarActions,
|
|
6734
|
+
className
|
|
6735
|
+
}) {
|
|
6736
|
+
const {
|
|
6737
|
+
data: processedData,
|
|
6738
|
+
state,
|
|
6739
|
+
handlers,
|
|
6740
|
+
getSortDirection
|
|
6741
|
+
} = useDataTable({
|
|
6742
|
+
data,
|
|
6743
|
+
initialPageSize,
|
|
6744
|
+
initialSort: { column: null, direction: null }
|
|
6745
|
+
});
|
|
6746
|
+
const [searchQuery, setSearchQuery] = React7.useState("");
|
|
6747
|
+
const [filterDialogOpen, setFilterDialogOpen] = React7.useState(false);
|
|
6748
|
+
const [advancedFilters, setAdvancedFilters] = React7.useState([]);
|
|
6749
|
+
const defaultSearchColumn = searchableColumns ? searchableColumns[0] : columns.find((c) => c.key === "nome" || c.key === "name" || c.key === "title" || c.key === "titulo")?.key || columns[0]?.key;
|
|
6750
|
+
const handleSearchChange = (value) => {
|
|
6751
|
+
setSearchQuery(value);
|
|
6752
|
+
handlers.setFilter(defaultSearchColumn, value, "contains");
|
|
6753
|
+
};
|
|
6754
|
+
const activeFilterChips = advancedFilters.map((filter) => {
|
|
6755
|
+
const field = filterFields.find((f) => f.value === filter.field);
|
|
6756
|
+
const operatorLabel = filter.operator === "is" ? "" : ` ${filter.operator}`;
|
|
6757
|
+
const valueLabel = Array.isArray(filter.value) ? filter.value.join(", ") : filter.value;
|
|
6758
|
+
return {
|
|
6759
|
+
id: filter.id,
|
|
6760
|
+
label: field?.label || filter.field,
|
|
6761
|
+
value: `${operatorLabel} ${valueLabel}`.trim(),
|
|
6762
|
+
onRemove: () => {
|
|
6763
|
+
const updated = advancedFilters.filter((f) => f.id !== filter.id);
|
|
6764
|
+
setAdvancedFilters(updated);
|
|
6765
|
+
applyAdvancedFilters(updated);
|
|
6766
|
+
}
|
|
6767
|
+
};
|
|
6768
|
+
});
|
|
6769
|
+
const applyAdvancedFilters = (filters) => {
|
|
6770
|
+
handlers.clearFilters();
|
|
6771
|
+
if (searchQuery) {
|
|
6772
|
+
handlers.setFilter(defaultSearchColumn, searchQuery, "contains");
|
|
6773
|
+
}
|
|
6774
|
+
filters.forEach((filter) => {
|
|
6775
|
+
const operator = mapFilterOperator(filter.operator);
|
|
6776
|
+
handlers.setFilter(filter.field, filter.value, operator);
|
|
6777
|
+
});
|
|
6778
|
+
};
|
|
6779
|
+
const mapFilterOperator = (operator) => {
|
|
6780
|
+
switch (operator) {
|
|
6781
|
+
case "is":
|
|
6782
|
+
return "equals";
|
|
6783
|
+
case "contains":
|
|
6784
|
+
return "contains";
|
|
6785
|
+
case "starts_with":
|
|
6786
|
+
return "startsWith";
|
|
6787
|
+
case "greater_than":
|
|
6788
|
+
return "greaterThan";
|
|
6789
|
+
case "less_than":
|
|
6790
|
+
return "lessThan";
|
|
6791
|
+
default:
|
|
6792
|
+
return "contains";
|
|
6793
|
+
}
|
|
6794
|
+
};
|
|
6795
|
+
const handleApplyFilters = () => {
|
|
6796
|
+
applyAdvancedFilters(advancedFilters);
|
|
6797
|
+
setFilterDialogOpen(false);
|
|
6798
|
+
};
|
|
6799
|
+
const handleClearAllFilters = () => {
|
|
6800
|
+
setAdvancedFilters([]);
|
|
6801
|
+
handlers.clearFilters();
|
|
6802
|
+
if (searchQuery) {
|
|
6803
|
+
handlers.setFilter(defaultSearchColumn, searchQuery, "contains");
|
|
6804
|
+
}
|
|
6805
|
+
};
|
|
6806
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-4", className), children: [
|
|
6807
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-2", children: [
|
|
6808
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2 flex-1", children: [
|
|
6809
|
+
enableSearch && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative max-w-sm flex-1", children: [
|
|
6810
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Search, { className: "absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground pointer-events-none" }),
|
|
6811
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6812
|
+
Input,
|
|
6813
|
+
{
|
|
6814
|
+
placeholder: searchPlaceholder,
|
|
6815
|
+
value: searchQuery,
|
|
6816
|
+
onChange: (event) => handleSearchChange(event.target.value),
|
|
6817
|
+
className: "pl-9"
|
|
6818
|
+
}
|
|
6819
|
+
)
|
|
6820
|
+
] }),
|
|
6821
|
+
enableFilters && filterFields.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: filterDialogOpen, onOpenChange: setFilterDialogOpen, children: [
|
|
6822
|
+
/* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", className: "gap-2", children: [
|
|
6823
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Filter, { className: "h-4 w-4" }),
|
|
6824
|
+
"Filtros",
|
|
6825
|
+
advancedFilters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "ml-1 rounded-full bg-primary text-primary-foreground w-5 h-5 text-xs flex items-center justify-center", children: advancedFilters.length })
|
|
6826
|
+
] }) }),
|
|
6827
|
+
/* @__PURE__ */ jsxRuntime.jsxs(PopoverContent, { className: "w-[700px] p-0", align: "start", sideOffset: 8, children: [
|
|
6828
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-6 border-b", children: [
|
|
6829
|
+
/* @__PURE__ */ jsxRuntime.jsx("h3", { className: "font-semibold", children: "Filtros Avan\xE7ados" }),
|
|
6830
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground mt-1", children: "Adicione condi\xE7\xF5es de filtro para refinar os resultados." })
|
|
6831
|
+
] }),
|
|
6832
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "p-6", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6833
|
+
FilterBuilder,
|
|
6834
|
+
{
|
|
6835
|
+
conditions: advancedFilters,
|
|
6836
|
+
onConditionsChange: setAdvancedFilters,
|
|
6837
|
+
fields: filterFields
|
|
6838
|
+
}
|
|
6839
|
+
) }),
|
|
6840
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-end gap-2 p-4 border-t bg-muted/50", children: [
|
|
6841
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6842
|
+
Button,
|
|
6843
|
+
{
|
|
6844
|
+
variant: "outline",
|
|
6845
|
+
size: "sm",
|
|
6846
|
+
onClick: () => setFilterDialogOpen(false),
|
|
6847
|
+
children: "Cancelar"
|
|
6848
|
+
}
|
|
6849
|
+
),
|
|
6850
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6851
|
+
Button,
|
|
6852
|
+
{
|
|
6853
|
+
size: "sm",
|
|
6854
|
+
onClick: handleApplyFilters,
|
|
6855
|
+
children: "Aplicar Filtros"
|
|
6856
|
+
}
|
|
6857
|
+
)
|
|
6858
|
+
] })
|
|
6859
|
+
] })
|
|
6860
|
+
] })
|
|
6861
|
+
] }),
|
|
6862
|
+
toolbarActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center gap-2", children: toolbarActions })
|
|
6863
|
+
] }),
|
|
6864
|
+
advancedFilters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
|
|
6865
|
+
FilterBar,
|
|
6866
|
+
{
|
|
6867
|
+
activeFilters: activeFilterChips,
|
|
6868
|
+
onClearAll: handleClearAllFilters
|
|
6869
|
+
}
|
|
6870
|
+
),
|
|
6871
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-md border", children: /* @__PURE__ */ jsxRuntime.jsxs(Table, { children: [
|
|
6872
|
+
/* @__PURE__ */ jsxRuntime.jsx(TableHeader, { children: /* @__PURE__ */ jsxRuntime.jsx(TableRow, { children: columns.map((column) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
6873
|
+
TableHead,
|
|
6874
|
+
{
|
|
6875
|
+
className: cn(
|
|
6876
|
+
column.headerClassName,
|
|
6877
|
+
column.sortable && "cursor-pointer select-none hover:bg-muted/50 transition-colors"
|
|
6878
|
+
),
|
|
6879
|
+
style: { width: column.width },
|
|
6880
|
+
onClick: () => column.sortable && handlers.onSort(column.key),
|
|
6881
|
+
"aria-sort": column.sortable ? getSortDirection(column.key) === "asc" ? "ascending" : getSortDirection(column.key) === "desc" ? "descending" : "none" : void 0,
|
|
6882
|
+
children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex items-center gap-2", column.align ? `justify-${column.align}` : "justify-start"), children: [
|
|
6883
|
+
column.header,
|
|
6884
|
+
column.sortable && /* @__PURE__ */ jsxRuntime.jsx(lucideReact.ArrowUpDown, { className: cn("h-4 w-4", getSortDirection(column.key) ? "opacity-100" : "opacity-40") })
|
|
6885
|
+
] })
|
|
6886
|
+
},
|
|
6887
|
+
String(column.key)
|
|
6888
|
+
)) }) }),
|
|
6889
|
+
/* @__PURE__ */ jsxRuntime.jsx(TableBody, { children: processedData.length > 0 ? processedData.map((row, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx(TableRow, { children: columns.map((column) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
6890
|
+
TableCell,
|
|
6891
|
+
{
|
|
6892
|
+
className: cn(column.className, column.align ? `text-${column.align}` : "text-left"),
|
|
6893
|
+
children: column.render ? column.render(row[column.key], row, rowIndex) : row[column.key]
|
|
6894
|
+
},
|
|
6895
|
+
String(column.key)
|
|
6896
|
+
)) }, rowIndex)) : /* @__PURE__ */ jsxRuntime.jsx(TableRow, { children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6897
|
+
TableCell,
|
|
6898
|
+
{
|
|
6899
|
+
colSpan: columns.length,
|
|
6900
|
+
className: "h-24 text-center",
|
|
6901
|
+
children: "Nenhum resultado encontrado."
|
|
6902
|
+
}
|
|
6903
|
+
) }) })
|
|
6904
|
+
] }) }),
|
|
6905
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
6906
|
+
TablePagination,
|
|
6907
|
+
{
|
|
6908
|
+
currentPage: state.pagination.currentPage,
|
|
6909
|
+
totalPages: Math.ceil(state.pagination.totalItems / state.pagination.pageSize),
|
|
6910
|
+
pageSize: state.pagination.pageSize,
|
|
6911
|
+
totalItems: state.pagination.totalItems,
|
|
6912
|
+
onPageChange: state.pagination.onPageChange || (() => {
|
|
6913
|
+
}),
|
|
6914
|
+
onPageSizeChange: state.pagination.onPageSizeChange,
|
|
6915
|
+
pageSizeOptions
|
|
6916
|
+
}
|
|
6917
|
+
)
|
|
6918
|
+
] });
|
|
6919
|
+
}
|
|
6920
|
+
var sampleCampaigns = [
|
|
6921
|
+
{
|
|
6922
|
+
id: "1",
|
|
6923
|
+
name: "Campanha de Natal 2025",
|
|
6924
|
+
client: "Coca-Cola",
|
|
6925
|
+
status: "active",
|
|
6926
|
+
budget: 5e4,
|
|
6927
|
+
spent: 32e3,
|
|
6928
|
+
startDate: "2025-12-01",
|
|
6929
|
+
endDate: "2025-12-25"
|
|
6930
|
+
},
|
|
6931
|
+
{
|
|
6932
|
+
id: "2",
|
|
6933
|
+
name: "Black Friday Especial",
|
|
6934
|
+
client: "Nike",
|
|
6935
|
+
status: "completed",
|
|
6936
|
+
budget: 8e4,
|
|
6937
|
+
spent: 78500,
|
|
6938
|
+
startDate: "2025-11-15",
|
|
6939
|
+
endDate: "2025-11-30"
|
|
6940
|
+
},
|
|
6941
|
+
{
|
|
6942
|
+
id: "3",
|
|
6943
|
+
name: "Lan\xE7amento Produto X",
|
|
6944
|
+
client: "Apple",
|
|
6945
|
+
status: "active",
|
|
6946
|
+
budget: 12e4,
|
|
6947
|
+
spent: 45e3,
|
|
6948
|
+
startDate: "2025-12-05",
|
|
6949
|
+
endDate: "2026-01-15"
|
|
6950
|
+
},
|
|
6951
|
+
{
|
|
6952
|
+
id: "4",
|
|
6953
|
+
name: "Campanha Ver\xE3o",
|
|
6954
|
+
client: "Havaianas",
|
|
6955
|
+
status: "paused",
|
|
6956
|
+
budget: 35e3,
|
|
6957
|
+
spent: 18e3,
|
|
6958
|
+
startDate: "2025-11-20",
|
|
6959
|
+
endDate: "2026-02-28"
|
|
6960
|
+
},
|
|
6961
|
+
{
|
|
6962
|
+
id: "5",
|
|
6963
|
+
name: "Awareness Brand",
|
|
6964
|
+
client: "Google",
|
|
6965
|
+
status: "draft",
|
|
6966
|
+
budget: 95e3,
|
|
6967
|
+
spent: 0,
|
|
6968
|
+
startDate: "2026-01-01",
|
|
6969
|
+
endDate: "2026-03-31"
|
|
6970
|
+
},
|
|
6971
|
+
{
|
|
6972
|
+
id: "6",
|
|
6973
|
+
name: "Retargeting Q4",
|
|
6974
|
+
client: "Amazon",
|
|
6975
|
+
status: "active",
|
|
6976
|
+
budget: 65e3,
|
|
6977
|
+
spent: 42e3,
|
|
6978
|
+
startDate: "2025-10-01",
|
|
6979
|
+
endDate: "2025-12-31"
|
|
6980
|
+
},
|
|
6981
|
+
{
|
|
6982
|
+
id: "7",
|
|
6983
|
+
name: "Social Media Boost",
|
|
6984
|
+
client: "Nike",
|
|
6985
|
+
status: "active",
|
|
6986
|
+
budget: 28e3,
|
|
6987
|
+
spent: 15e3,
|
|
6988
|
+
startDate: "2025-11-01",
|
|
6989
|
+
endDate: "2025-12-31"
|
|
6990
|
+
},
|
|
6991
|
+
{
|
|
6992
|
+
id: "8",
|
|
6993
|
+
name: "Email Campaign",
|
|
6994
|
+
client: "Coca-Cola",
|
|
6995
|
+
status: "completed",
|
|
6996
|
+
budget: 12e3,
|
|
6997
|
+
spent: 11500,
|
|
6998
|
+
startDate: "2025-10-15",
|
|
6999
|
+
endDate: "2025-11-15"
|
|
7000
|
+
}
|
|
7001
|
+
];
|
|
7002
|
+
function DataTableExample() {
|
|
7003
|
+
const [campaigns] = React7.useState(sampleCampaigns);
|
|
7004
|
+
const columns = [
|
|
7005
|
+
{
|
|
7006
|
+
key: "name",
|
|
7007
|
+
header: "Campanha",
|
|
7008
|
+
sortable: true,
|
|
7009
|
+
width: "25%",
|
|
7010
|
+
className: "font-medium"
|
|
7011
|
+
},
|
|
7012
|
+
{
|
|
7013
|
+
key: "client",
|
|
7014
|
+
header: "Cliente",
|
|
7015
|
+
sortable: true
|
|
7016
|
+
},
|
|
7017
|
+
{
|
|
7018
|
+
key: "status",
|
|
7019
|
+
header: "Status",
|
|
7020
|
+
sortable: true,
|
|
7021
|
+
render: (value) => {
|
|
7022
|
+
const variants = {
|
|
7023
|
+
active: "default",
|
|
7024
|
+
paused: "secondary",
|
|
7025
|
+
completed: "outline",
|
|
7026
|
+
draft: "secondary"
|
|
7027
|
+
};
|
|
7028
|
+
const labels = {
|
|
7029
|
+
active: "Ativa",
|
|
7030
|
+
paused: "Pausada",
|
|
7031
|
+
completed: "Conclu\xEDda",
|
|
7032
|
+
draft: "Rascunho"
|
|
7033
|
+
};
|
|
7034
|
+
return /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: variants[value], children: labels[value] });
|
|
7035
|
+
}
|
|
7036
|
+
},
|
|
7037
|
+
{
|
|
7038
|
+
key: "budget",
|
|
7039
|
+
header: "Or\xE7amento",
|
|
7040
|
+
align: "right",
|
|
7041
|
+
sortable: true,
|
|
7042
|
+
render: (value) => `R$ ${value.toLocaleString("pt-BR")}`
|
|
7043
|
+
},
|
|
7044
|
+
{
|
|
7045
|
+
key: "spent",
|
|
7046
|
+
header: "Gasto",
|
|
7047
|
+
align: "right",
|
|
7048
|
+
sortable: true,
|
|
7049
|
+
render: (value, row) => {
|
|
7050
|
+
const spent = value;
|
|
7051
|
+
const budget = row.budget;
|
|
7052
|
+
const percentage = spent / budget * 100;
|
|
7053
|
+
const color = percentage > 90 ? "text-red-600" : percentage > 70 ? "text-orange-600" : "text-green-600";
|
|
7054
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-right", children: [
|
|
7055
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: color, children: [
|
|
7056
|
+
"R$ ",
|
|
7057
|
+
spent.toLocaleString("pt-BR")
|
|
7058
|
+
] }),
|
|
7059
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-muted-foreground", children: [
|
|
7060
|
+
percentage.toFixed(0),
|
|
7061
|
+
"%"
|
|
7062
|
+
] })
|
|
7063
|
+
] });
|
|
7064
|
+
}
|
|
7065
|
+
},
|
|
7066
|
+
{
|
|
7067
|
+
key: "startDate",
|
|
7068
|
+
header: "In\xEDcio",
|
|
7069
|
+
sortable: true,
|
|
7070
|
+
render: (value) => new Date(value).toLocaleDateString("pt-BR")
|
|
7071
|
+
},
|
|
7072
|
+
{
|
|
7073
|
+
key: "id",
|
|
7074
|
+
header: "A\xE7\xF5es",
|
|
7075
|
+
align: "right",
|
|
7076
|
+
width: "80px",
|
|
7077
|
+
render: (id, row) => /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
|
|
7078
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Button, { variant: "ghost", size: "sm", children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.MoreVertical, { className: "h-4 w-4" }) }) }),
|
|
7079
|
+
/* @__PURE__ */ jsxRuntime.jsxs(DropdownMenuContent, { align: "end", children: [
|
|
7080
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuItem, { onClick: () => console.log("View", row), children: "Ver detalhes" }),
|
|
7081
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuItem, { onClick: () => console.log("Edit", row), children: "Editar" }),
|
|
7082
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuItem, { onClick: () => console.log("Duplicate", row), children: "Duplicar" }),
|
|
7083
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7084
|
+
DropdownMenuItem,
|
|
7085
|
+
{
|
|
7086
|
+
onClick: () => console.log("Delete", id),
|
|
7087
|
+
className: "text-destructive",
|
|
7088
|
+
children: "Excluir"
|
|
7089
|
+
}
|
|
7090
|
+
)
|
|
7091
|
+
] })
|
|
7092
|
+
] })
|
|
7093
|
+
}
|
|
7094
|
+
];
|
|
7095
|
+
const filterFields = [
|
|
7096
|
+
{
|
|
7097
|
+
value: "status",
|
|
7098
|
+
label: "Status",
|
|
7099
|
+
type: "select",
|
|
7100
|
+
options: [
|
|
7101
|
+
{ value: "active", label: "Ativa" },
|
|
7102
|
+
{ value: "paused", label: "Pausada" },
|
|
7103
|
+
{ value: "completed", label: "Conclu\xEDda" },
|
|
7104
|
+
{ value: "draft", label: "Rascunho" }
|
|
7105
|
+
],
|
|
7106
|
+
multiSelect: true
|
|
7107
|
+
// Allow selecting multiple statuses
|
|
7108
|
+
},
|
|
7109
|
+
{
|
|
7110
|
+
value: "client",
|
|
7111
|
+
label: "Cliente",
|
|
7112
|
+
type: "select",
|
|
7113
|
+
options: [
|
|
7114
|
+
{ value: "Coca-Cola", label: "Coca-Cola" },
|
|
7115
|
+
{ value: "Nike", label: "Nike" },
|
|
7116
|
+
{ value: "Apple", label: "Apple" },
|
|
7117
|
+
{ value: "Havaianas", label: "Havaianas" },
|
|
7118
|
+
{ value: "Google", label: "Google" },
|
|
7119
|
+
{ value: "Amazon", label: "Amazon" }
|
|
7120
|
+
]
|
|
7121
|
+
},
|
|
7122
|
+
{
|
|
7123
|
+
value: "budget",
|
|
7124
|
+
label: "Or\xE7amento",
|
|
7125
|
+
type: "number"
|
|
7126
|
+
},
|
|
7127
|
+
{
|
|
7128
|
+
value: "startDate",
|
|
7129
|
+
label: "Data de In\xEDcio",
|
|
7130
|
+
type: "date"
|
|
7131
|
+
}
|
|
7132
|
+
];
|
|
7133
|
+
const handleExport = () => {
|
|
7134
|
+
console.log("Exporting campaigns...", campaigns);
|
|
7135
|
+
};
|
|
7136
|
+
const handleCreateNew = () => {
|
|
7137
|
+
console.log("Creating new campaign...");
|
|
7138
|
+
};
|
|
7139
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6 p-6", children: [
|
|
7140
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between", children: [
|
|
7141
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
|
|
7142
|
+
/* @__PURE__ */ jsxRuntime.jsx("h1", { className: "text-3xl font-bold tracking-tight", children: "Campanhas" }),
|
|
7143
|
+
/* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground mt-2", children: "Gerencie suas campanhas de publicidade e acompanhe o desempenho" })
|
|
7144
|
+
] }),
|
|
7145
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Button, { onClick: handleCreateNew, children: [
|
|
7146
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Plus, { className: "h-4 w-4 mr-2" }),
|
|
7147
|
+
"Nova Campanha"
|
|
7148
|
+
] })
|
|
7149
|
+
] }),
|
|
7150
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 md:grid-cols-4 gap-4", children: [
|
|
7151
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Card, { className: "p-4", children: [
|
|
7152
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground", children: "Total de Campanhas" }),
|
|
7153
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl font-bold mt-1", children: campaigns.length })
|
|
7154
|
+
] }),
|
|
7155
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Card, { className: "p-4", children: [
|
|
7156
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground", children: "Campanhas Ativas" }),
|
|
7157
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl font-bold mt-1 text-green-600", children: campaigns.filter((c) => c.status === "active").length })
|
|
7158
|
+
] }),
|
|
7159
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Card, { className: "p-4", children: [
|
|
7160
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground", children: "Or\xE7amento Total" }),
|
|
7161
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-2xl font-bold mt-1", children: [
|
|
7162
|
+
"R$ ",
|
|
7163
|
+
campaigns.reduce((sum, c) => sum + c.budget, 0).toLocaleString("pt-BR")
|
|
7164
|
+
] })
|
|
7165
|
+
] }),
|
|
7166
|
+
/* @__PURE__ */ jsxRuntime.jsxs(Card, { className: "p-4", children: [
|
|
7167
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground", children: "Total Gasto" }),
|
|
7168
|
+
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-2xl font-bold mt-1", children: [
|
|
7169
|
+
"R$ ",
|
|
7170
|
+
campaigns.reduce((sum, c) => sum + c.spent, 0).toLocaleString("pt-BR")
|
|
7171
|
+
] })
|
|
7172
|
+
] })
|
|
7173
|
+
] }),
|
|
7174
|
+
/* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-6", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7175
|
+
DataTable,
|
|
7176
|
+
{
|
|
7177
|
+
data: campaigns,
|
|
7178
|
+
columns,
|
|
7179
|
+
searchPlaceholder: "Buscar por campanha ou cliente...",
|
|
7180
|
+
searchableColumns: ["name", "client"],
|
|
7181
|
+
enableSearch: true,
|
|
7182
|
+
enableFilters: true,
|
|
7183
|
+
filterFields,
|
|
7184
|
+
initialPageSize: 10,
|
|
7185
|
+
pageSizeOptions: [5, 10, 20, 50],
|
|
7186
|
+
toolbarActions: /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", onClick: handleExport, children: [
|
|
7187
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "h-4 w-4 mr-2" }),
|
|
7188
|
+
"Exportar"
|
|
7189
|
+
] }) })
|
|
7190
|
+
}
|
|
7191
|
+
) }),
|
|
7192
|
+
/* @__PURE__ */ jsxRuntime.jsx(Card, { className: "p-4 bg-blue-50 dark:bg-blue-950/20 border-blue-200 dark:border-blue-900", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-sm", children: [
|
|
7193
|
+
/* @__PURE__ */ jsxRuntime.jsx("strong", { children: "\u{1F4A1} Dica:" }),
|
|
7194
|
+
' Use o campo de busca para encontrar campanhas rapidamente. Use os filtros avan\xE7ados para combinar m\xFAltiplas condi\xE7\xF5es (ex: "Status = Ativa" E "Cliente = Nike").'
|
|
7195
|
+
] }) })
|
|
7196
|
+
] });
|
|
7197
|
+
}
|
|
7198
|
+
function SavedFilters({
|
|
7199
|
+
filters = [],
|
|
7200
|
+
onSelectFilter,
|
|
7201
|
+
onToggleFavorite,
|
|
7202
|
+
onDeleteFilter,
|
|
7203
|
+
className
|
|
7204
|
+
}) {
|
|
7205
|
+
const favoriteFilters = filters.filter((f) => f.isFavorite);
|
|
7206
|
+
const otherFilters = filters.filter((f) => !f.isFavorite);
|
|
7207
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(DropdownMenu, { children: [
|
|
7208
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(Button, { variant: "outline", size: "sm", className: cn("gap-2", className), children: [
|
|
7209
|
+
/* @__PURE__ */ jsxRuntime.jsx(lucideReact.Download, { className: "h-4 w-4" }),
|
|
7210
|
+
"Saved Filters",
|
|
7211
|
+
filters.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "text-xs text-muted-foreground", children: [
|
|
7212
|
+
"(",
|
|
7213
|
+
filters.length,
|
|
7214
|
+
")"
|
|
7215
|
+
] })
|
|
7216
|
+
] }) }),
|
|
7217
|
+
/* @__PURE__ */ jsxRuntime.jsx(DropdownMenuContent, { align: "start", className: "w-[280px]", children: filters.length === 0 ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-6 text-center text-sm text-muted-foreground", children: "No saved filters yet" }) : /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
7218
|
+
favoriteFilters.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
7219
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-1.5 text-xs font-semibold text-muted-foreground", children: "Favorites" }),
|
|
7220
|
+
favoriteFilters.map((filter) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
7221
|
+
FilterMenuItem,
|
|
7222
|
+
{
|
|
7223
|
+
filter,
|
|
7224
|
+
onSelect: onSelectFilter,
|
|
7225
|
+
onToggleFavorite,
|
|
7226
|
+
onDelete: onDeleteFilter
|
|
7227
|
+
},
|
|
7228
|
+
filter.id
|
|
7229
|
+
)),
|
|
7230
|
+
otherFilters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(DropdownMenuSeparator, {})
|
|
7231
|
+
] }),
|
|
7232
|
+
otherFilters.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
7233
|
+
favoriteFilters.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-2 py-1.5 text-xs font-semibold text-muted-foreground", children: "All Filters" }),
|
|
7234
|
+
otherFilters.map((filter) => /* @__PURE__ */ jsxRuntime.jsx(
|
|
7235
|
+
FilterMenuItem,
|
|
7236
|
+
{
|
|
7237
|
+
filter,
|
|
7238
|
+
onSelect: onSelectFilter,
|
|
7239
|
+
onToggleFavorite,
|
|
7240
|
+
onDelete: onDeleteFilter
|
|
7241
|
+
},
|
|
7242
|
+
filter.id
|
|
7243
|
+
))
|
|
7244
|
+
] })
|
|
7245
|
+
] }) })
|
|
7246
|
+
] });
|
|
7247
|
+
}
|
|
7248
|
+
function FilterMenuItem({
|
|
7249
|
+
filter,
|
|
7250
|
+
onSelect,
|
|
7251
|
+
onToggleFavorite,
|
|
7252
|
+
onDelete
|
|
7253
|
+
}) {
|
|
7254
|
+
return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-1 px-2 py-1.5 hover:bg-muted rounded-sm group", children: [
|
|
7255
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7256
|
+
"button",
|
|
7257
|
+
{
|
|
7258
|
+
onClick: (e) => {
|
|
7259
|
+
e.stopPropagation();
|
|
7260
|
+
onToggleFavorite?.(filter.id);
|
|
7261
|
+
},
|
|
7262
|
+
className: "p-1 hover:bg-accent rounded-sm",
|
|
7263
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
7264
|
+
lucideReact.Star,
|
|
7265
|
+
{
|
|
7266
|
+
className: cn(
|
|
7267
|
+
"h-3.5 w-3.5",
|
|
7268
|
+
filter.isFavorite ? "fill-yellow-500 text-yellow-500" : "text-muted-foreground"
|
|
7269
|
+
)
|
|
7270
|
+
}
|
|
7271
|
+
)
|
|
7272
|
+
}
|
|
7273
|
+
),
|
|
7274
|
+
/* @__PURE__ */ jsxRuntime.jsxs(
|
|
7275
|
+
"button",
|
|
7276
|
+
{
|
|
7277
|
+
onClick: () => onSelect?.(filter.id),
|
|
7278
|
+
className: "flex-1 text-left px-2",
|
|
7279
|
+
children: [
|
|
7280
|
+
/* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm", children: filter.name }),
|
|
7281
|
+
filter.description && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-muted-foreground", children: filter.description }),
|
|
7282
|
+
filter.filterCount !== void 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-xs text-muted-foreground mt-0.5", children: [
|
|
7283
|
+
filter.filterCount,
|
|
7284
|
+
" ",
|
|
7285
|
+
filter.filterCount === 1 ? "filter" : "filters"
|
|
7286
|
+
] })
|
|
7287
|
+
]
|
|
7288
|
+
}
|
|
7289
|
+
),
|
|
7290
|
+
/* @__PURE__ */ jsxRuntime.jsx(
|
|
7291
|
+
"button",
|
|
7292
|
+
{
|
|
7293
|
+
onClick: (e) => {
|
|
7294
|
+
e.stopPropagation();
|
|
7295
|
+
onDelete?.(filter.id);
|
|
7296
|
+
},
|
|
7297
|
+
className: "p-1 hover:bg-accent rounded-sm opacity-0 group-hover:opacity-100 transition-opacity",
|
|
7298
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Trash2, { className: "h-3.5 w-3.5 text-destructive" })
|
|
7299
|
+
}
|
|
7300
|
+
)
|
|
7301
|
+
] });
|
|
7302
|
+
}
|
|
5980
7303
|
function Tabs({
|
|
5981
7304
|
className,
|
|
5982
7305
|
...props
|
|
@@ -6619,8 +7942,10 @@ exports.ContextMenuTrigger = ContextMenuTrigger;
|
|
|
6619
7942
|
exports.ContractPrint = ContractPrint;
|
|
6620
7943
|
exports.ContractPrintPreview = ContractPrintPreview;
|
|
6621
7944
|
exports.ContractTemplate = ContractTemplate;
|
|
7945
|
+
exports.DataTable = DataTable;
|
|
7946
|
+
exports.DataTableExample = DataTableExample;
|
|
7947
|
+
exports.DatePicker = DatePicker;
|
|
6622
7948
|
exports.DateRangePicker = DateRangePicker;
|
|
6623
|
-
exports.DateTimePicker = DateTimePicker;
|
|
6624
7949
|
exports.Dialog = Dialog;
|
|
6625
7950
|
exports.DialogClose = DialogClose;
|
|
6626
7951
|
exports.DialogContent = DialogContent;
|
|
@@ -6657,6 +7982,9 @@ exports.EmptyInboxIllustration = EmptyInboxIllustration;
|
|
|
6657
7982
|
exports.EmptyProjectsIllustration = EmptyProjectsIllustration;
|
|
6658
7983
|
exports.EmptySearchIllustration = EmptySearchIllustration;
|
|
6659
7984
|
exports.ErrorStateIllustration = ErrorStateIllustration;
|
|
7985
|
+
exports.FilterBar = FilterBar;
|
|
7986
|
+
exports.FilterBuilder = FilterBuilder;
|
|
7987
|
+
exports.FilterChip = FilterChip;
|
|
6660
7988
|
exports.Form = Form;
|
|
6661
7989
|
exports.FormControl = FormControl;
|
|
6662
7990
|
exports.FormDescription = FormDescription;
|
|
@@ -6721,6 +8049,7 @@ exports.RadioGroupItem = RadioGroupItem;
|
|
|
6721
8049
|
exports.ResizableHandle = ResizableHandle;
|
|
6722
8050
|
exports.ResizablePanel = ResizablePanel;
|
|
6723
8051
|
exports.ResizablePanelGroup = ResizablePanelGroup;
|
|
8052
|
+
exports.SavedFilters = SavedFilters;
|
|
6724
8053
|
exports.ScrollArea = ScrollArea;
|
|
6725
8054
|
exports.ScrollBar = ScrollBar;
|
|
6726
8055
|
exports.Select = Select;
|
|
@@ -6731,7 +8060,7 @@ exports.SelectLabel = SelectLabel;
|
|
|
6731
8060
|
exports.SelectSeparator = SelectSeparator;
|
|
6732
8061
|
exports.SelectTrigger = SelectTrigger;
|
|
6733
8062
|
exports.SelectValue = SelectValue;
|
|
6734
|
-
exports.Separator =
|
|
8063
|
+
exports.Separator = Separator5;
|
|
6735
8064
|
exports.Sheet = Sheet;
|
|
6736
8065
|
exports.SheetClose = SheetClose;
|
|
6737
8066
|
exports.SheetContent = SheetContent;
|