@prediktif/ui 0.1.17 → 0.1.19
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.d.mts +287 -2
- package/dist/index.d.ts +287 -2
- package/dist/index.js +2064 -69
- package/dist/index.mjs +2078 -68
- package/package.json +4 -2
package/dist/index.mjs
CHANGED
|
@@ -496,6 +496,57 @@ function DropdownMenuItem(_a) {
|
|
|
496
496
|
}, props)
|
|
497
497
|
);
|
|
498
498
|
}
|
|
499
|
+
function DropdownMenuCheckboxItem(_a) {
|
|
500
|
+
var _b = _a, {
|
|
501
|
+
className,
|
|
502
|
+
children,
|
|
503
|
+
checked,
|
|
504
|
+
inset
|
|
505
|
+
} = _b, props = __objRest(_b, [
|
|
506
|
+
"className",
|
|
507
|
+
"children",
|
|
508
|
+
"checked",
|
|
509
|
+
"inset"
|
|
510
|
+
]);
|
|
511
|
+
return /* @__PURE__ */ jsxs3(
|
|
512
|
+
MenuPrimitive.CheckboxItem,
|
|
513
|
+
__spreadProps(__spreadValues({
|
|
514
|
+
"data-slot": "dropdown-menu-checkbox-item",
|
|
515
|
+
"data-inset": inset,
|
|
516
|
+
className: cn5(
|
|
517
|
+
"relative flex min-h-7 cursor-default items-center gap-2 rounded-md py-1.5 pr-8 pl-2 text-xs outline-hidden select-none focus:bg-accent focus:text-accent-foreground focus:**:text-accent-foreground data-inset:pl-7.5 data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
|
|
518
|
+
className
|
|
519
|
+
),
|
|
520
|
+
checked
|
|
521
|
+
}, props), {
|
|
522
|
+
children: [
|
|
523
|
+
/* @__PURE__ */ jsx5(
|
|
524
|
+
"span",
|
|
525
|
+
{
|
|
526
|
+
className: "pointer-events-none absolute right-2 flex items-center justify-center",
|
|
527
|
+
"data-slot": "dropdown-menu-checkbox-item-indicator",
|
|
528
|
+
children: /* @__PURE__ */ jsx5(MenuPrimitive.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx5(CheckIcon, {}) })
|
|
529
|
+
}
|
|
530
|
+
),
|
|
531
|
+
children
|
|
532
|
+
]
|
|
533
|
+
})
|
|
534
|
+
);
|
|
535
|
+
}
|
|
536
|
+
function DropdownMenuSeparator(_a) {
|
|
537
|
+
var _b = _a, {
|
|
538
|
+
className
|
|
539
|
+
} = _b, props = __objRest(_b, [
|
|
540
|
+
"className"
|
|
541
|
+
]);
|
|
542
|
+
return /* @__PURE__ */ jsx5(
|
|
543
|
+
MenuPrimitive.Separator,
|
|
544
|
+
__spreadValues({
|
|
545
|
+
"data-slot": "dropdown-menu-separator",
|
|
546
|
+
className: cn5("-mx-1 my-1 h-px bg-border/50", className)
|
|
547
|
+
}, props)
|
|
548
|
+
);
|
|
549
|
+
}
|
|
499
550
|
|
|
500
551
|
// src/components/ui/separator.tsx
|
|
501
552
|
import { Separator as SeparatorPrimitive } from "@base-ui/react/separator";
|
|
@@ -534,6 +585,20 @@ import * as React2 from "react";
|
|
|
534
585
|
import { Input as InputPrimitive } from "@base-ui/react/input";
|
|
535
586
|
import { cn as cn7 } from "cn";
|
|
536
587
|
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
588
|
+
function Input(_a) {
|
|
589
|
+
var _b = _a, { className, type } = _b, props = __objRest(_b, ["className", "type"]);
|
|
590
|
+
return /* @__PURE__ */ jsx7(
|
|
591
|
+
InputPrimitive,
|
|
592
|
+
__spreadValues({
|
|
593
|
+
type,
|
|
594
|
+
"data-slot": "input",
|
|
595
|
+
className: cn7(
|
|
596
|
+
"h-7 w-full min-w-0 rounded-md border border-input bg-input/20 px-2 py-0.5 text-sm transition-colors outline-none file:inline-flex file:h-6 file:border-0 file:bg-transparent file:text-xs/relaxed file:font-medium file:text-foreground placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 md:text-xs/relaxed dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40",
|
|
597
|
+
className
|
|
598
|
+
)
|
|
599
|
+
}, props)
|
|
600
|
+
);
|
|
601
|
+
}
|
|
537
602
|
|
|
538
603
|
// src/components/ui/sheet.tsx
|
|
539
604
|
import { Dialog as SheetPrimitive } from "@base-ui/react/dialog";
|
|
@@ -651,6 +716,16 @@ function SheetDescription(_a) {
|
|
|
651
716
|
// src/components/ui/skeleton.tsx
|
|
652
717
|
import { cn as cn9 } from "cn";
|
|
653
718
|
import { jsx as jsx9 } from "react/jsx-runtime";
|
|
719
|
+
function Skeleton(_a) {
|
|
720
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
721
|
+
return /* @__PURE__ */ jsx9(
|
|
722
|
+
"div",
|
|
723
|
+
__spreadValues({
|
|
724
|
+
"data-slot": "skeleton",
|
|
725
|
+
className: cn9("animate-pulse rounded-md bg-muted", className)
|
|
726
|
+
}, props)
|
|
727
|
+
);
|
|
728
|
+
}
|
|
654
729
|
|
|
655
730
|
// src/components/ui/tooltip.tsx
|
|
656
731
|
import { Tooltip as TooltipPrimitive } from "@base-ui/react/tooltip";
|
|
@@ -1406,43 +1481,51 @@ var AppSidebar = memo(function AppSidebar2({
|
|
|
1406
1481
|
] });
|
|
1407
1482
|
});
|
|
1408
1483
|
|
|
1409
|
-
// src/components/composed/
|
|
1410
|
-
import
|
|
1411
|
-
|
|
1484
|
+
// src/components/composed/data-table/data-table.tsx
|
|
1485
|
+
import {
|
|
1486
|
+
flexRender as flexRender3,
|
|
1487
|
+
useTable
|
|
1488
|
+
} from "@tanstack/react-table";
|
|
1489
|
+
import { FolderOpenIcon } from "lucide-react";
|
|
1490
|
+
import { useMemo as useMemo3, useState as useState5 } from "react";
|
|
1491
|
+
|
|
1492
|
+
// src/components/composed/state-empty.tsx
|
|
1412
1493
|
import { memo as memo2 } from "react";
|
|
1413
1494
|
|
|
1414
|
-
// src/components/ui/
|
|
1415
|
-
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
|
|
1495
|
+
// src/components/ui/empty.tsx
|
|
1416
1496
|
import { cva as cva3 } from "class-variance-authority";
|
|
1417
1497
|
import { cn as cn12 } from "cn";
|
|
1418
1498
|
import { jsx as jsx13 } from "react/jsx-runtime";
|
|
1419
|
-
function
|
|
1420
|
-
var _b = _a, {
|
|
1421
|
-
className,
|
|
1422
|
-
orientation = "horizontal"
|
|
1423
|
-
} = _b, props = __objRest(_b, [
|
|
1424
|
-
"className",
|
|
1425
|
-
"orientation"
|
|
1426
|
-
]);
|
|
1499
|
+
function Empty(_a) {
|
|
1500
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1427
1501
|
return /* @__PURE__ */ jsx13(
|
|
1428
|
-
|
|
1502
|
+
"div",
|
|
1429
1503
|
__spreadValues({
|
|
1430
|
-
"data-slot": "
|
|
1431
|
-
"data-orientation": orientation,
|
|
1504
|
+
"data-slot": "empty",
|
|
1432
1505
|
className: cn12(
|
|
1433
|
-
"
|
|
1506
|
+
"flex w-full min-w-0 flex-1 flex-col items-center justify-center gap-4 rounded-xl border-dashed p-6 text-center text-balance",
|
|
1434
1507
|
className
|
|
1435
1508
|
)
|
|
1436
1509
|
}, props)
|
|
1437
1510
|
);
|
|
1438
1511
|
}
|
|
1439
|
-
|
|
1440
|
-
|
|
1512
|
+
function EmptyHeader(_a) {
|
|
1513
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1514
|
+
return /* @__PURE__ */ jsx13(
|
|
1515
|
+
"div",
|
|
1516
|
+
__spreadValues({
|
|
1517
|
+
"data-slot": "empty-header",
|
|
1518
|
+
className: cn12("flex max-w-sm flex-col items-center gap-1", className)
|
|
1519
|
+
}, props)
|
|
1520
|
+
);
|
|
1521
|
+
}
|
|
1522
|
+
var emptyMediaVariants = cva3(
|
|
1523
|
+
"mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
1441
1524
|
{
|
|
1442
1525
|
variants: {
|
|
1443
1526
|
variant: {
|
|
1444
|
-
default: "bg-
|
|
1445
|
-
|
|
1527
|
+
default: "bg-transparent",
|
|
1528
|
+
icon: "flex size-8 shrink-0 items-center justify-center rounded-md bg-muted text-foreground [&_svg:not([class*='size-'])]:size-4"
|
|
1446
1529
|
}
|
|
1447
1530
|
},
|
|
1448
1531
|
defaultVariants: {
|
|
@@ -1450,7 +1533,7 @@ var tabsListVariants = cva3(
|
|
|
1450
1533
|
}
|
|
1451
1534
|
}
|
|
1452
1535
|
);
|
|
1453
|
-
function
|
|
1536
|
+
function EmptyMedia(_a) {
|
|
1454
1537
|
var _b = _a, {
|
|
1455
1538
|
className,
|
|
1456
1539
|
variant = "default"
|
|
@@ -1459,89 +1542,2016 @@ function TabsList(_a) {
|
|
|
1459
1542
|
"variant"
|
|
1460
1543
|
]);
|
|
1461
1544
|
return /* @__PURE__ */ jsx13(
|
|
1462
|
-
|
|
1545
|
+
"div",
|
|
1463
1546
|
__spreadValues({
|
|
1464
|
-
"data-slot": "
|
|
1547
|
+
"data-slot": "empty-icon",
|
|
1465
1548
|
"data-variant": variant,
|
|
1466
|
-
className: cn12(
|
|
1549
|
+
className: cn12(emptyMediaVariants({ variant, className }))
|
|
1467
1550
|
}, props)
|
|
1468
1551
|
);
|
|
1469
1552
|
}
|
|
1470
|
-
function
|
|
1553
|
+
function EmptyTitle(_a) {
|
|
1471
1554
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1472
1555
|
return /* @__PURE__ */ jsx13(
|
|
1473
|
-
|
|
1556
|
+
"div",
|
|
1474
1557
|
__spreadValues({
|
|
1475
|
-
"data-slot": "
|
|
1558
|
+
"data-slot": "empty-title",
|
|
1476
1559
|
className: cn12(
|
|
1477
|
-
"
|
|
1478
|
-
|
|
1479
|
-
|
|
1480
|
-
|
|
1560
|
+
"font-heading text-sm font-medium tracking-tight",
|
|
1561
|
+
className
|
|
1562
|
+
)
|
|
1563
|
+
}, props)
|
|
1564
|
+
);
|
|
1565
|
+
}
|
|
1566
|
+
function EmptyDescription(_a) {
|
|
1567
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1568
|
+
return /* @__PURE__ */ jsx13(
|
|
1569
|
+
"div",
|
|
1570
|
+
__spreadValues({
|
|
1571
|
+
"data-slot": "empty-description",
|
|
1572
|
+
className: cn12(
|
|
1573
|
+
"text-xs/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
|
|
1574
|
+
className
|
|
1575
|
+
)
|
|
1576
|
+
}, props)
|
|
1577
|
+
);
|
|
1578
|
+
}
|
|
1579
|
+
function EmptyContent(_a) {
|
|
1580
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1581
|
+
return /* @__PURE__ */ jsx13(
|
|
1582
|
+
"div",
|
|
1583
|
+
__spreadValues({
|
|
1584
|
+
"data-slot": "empty-content",
|
|
1585
|
+
className: cn12(
|
|
1586
|
+
"flex w-full max-w-sm min-w-0 flex-col items-center gap-2 text-xs/relaxed text-balance",
|
|
1481
1587
|
className
|
|
1482
1588
|
)
|
|
1483
1589
|
}, props)
|
|
1484
1590
|
);
|
|
1485
1591
|
}
|
|
1486
1592
|
|
|
1487
|
-
// src/components/composed/
|
|
1593
|
+
// src/components/composed/state-empty.tsx
|
|
1488
1594
|
import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1489
|
-
function
|
|
1490
|
-
if (!icon) return null;
|
|
1595
|
+
function renderStateIcon(icon) {
|
|
1491
1596
|
if (typeof icon === "function" || typeof icon === "object" && icon !== null && "render" in icon) {
|
|
1492
1597
|
const IconComp = icon;
|
|
1493
1598
|
return /* @__PURE__ */ jsx14(IconComp, {});
|
|
1494
1599
|
}
|
|
1495
1600
|
return icon;
|
|
1496
1601
|
}
|
|
1497
|
-
var
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1602
|
+
var StateEmpty = memo2(function StateEmpty2({
|
|
1603
|
+
icon,
|
|
1604
|
+
title,
|
|
1605
|
+
description,
|
|
1606
|
+
buttonText,
|
|
1607
|
+
onClick,
|
|
1608
|
+
render
|
|
1502
1609
|
}) {
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1610
|
+
const hasAction = Boolean(buttonText || render || onClick);
|
|
1611
|
+
return /* @__PURE__ */ jsxs8(Empty, { className: "w-full border border-dashed", children: [
|
|
1612
|
+
/* @__PURE__ */ jsxs8(EmptyHeader, { children: [
|
|
1613
|
+
/* @__PURE__ */ jsx14(EmptyMedia, { variant: "icon", children: renderStateIcon(icon) }),
|
|
1614
|
+
/* @__PURE__ */ jsx14(EmptyTitle, { children: title }),
|
|
1615
|
+
/* @__PURE__ */ jsx14(EmptyDescription, { children: description })
|
|
1616
|
+
] }),
|
|
1617
|
+
hasAction && /* @__PURE__ */ jsx14(EmptyContent, { children: /* @__PURE__ */ jsx14(
|
|
1618
|
+
Button,
|
|
1512
1619
|
{
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1620
|
+
variant: "outline",
|
|
1621
|
+
size: "sm",
|
|
1622
|
+
nativeButton: !render,
|
|
1623
|
+
onClick,
|
|
1624
|
+
render,
|
|
1625
|
+
children: buttonText
|
|
1626
|
+
}
|
|
1627
|
+
) })
|
|
1628
|
+
] });
|
|
1629
|
+
});
|
|
1630
|
+
|
|
1631
|
+
// src/components/ui/table.tsx
|
|
1632
|
+
import { cn as cn13 } from "cn";
|
|
1633
|
+
import { jsx as jsx15 } from "react/jsx-runtime";
|
|
1634
|
+
function Table(_a) {
|
|
1635
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1636
|
+
return /* @__PURE__ */ jsx15(
|
|
1637
|
+
"div",
|
|
1638
|
+
{
|
|
1639
|
+
"data-slot": "table-container",
|
|
1640
|
+
className: "relative w-full overflow-x-auto",
|
|
1641
|
+
children: /* @__PURE__ */ jsx15(
|
|
1642
|
+
"table",
|
|
1643
|
+
__spreadValues({
|
|
1644
|
+
"data-slot": "table",
|
|
1645
|
+
className: cn13("w-full caption-bottom text-xs", className)
|
|
1646
|
+
}, props)
|
|
1647
|
+
)
|
|
1648
|
+
}
|
|
1649
|
+
);
|
|
1650
|
+
}
|
|
1651
|
+
function TableHeader(_a) {
|
|
1652
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1653
|
+
return /* @__PURE__ */ jsx15(
|
|
1654
|
+
"thead",
|
|
1655
|
+
__spreadValues({
|
|
1656
|
+
"data-slot": "table-header",
|
|
1657
|
+
className: cn13("[&_tr]:border-b", className)
|
|
1658
|
+
}, props)
|
|
1659
|
+
);
|
|
1660
|
+
}
|
|
1661
|
+
function TableBody(_a) {
|
|
1662
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1663
|
+
return /* @__PURE__ */ jsx15(
|
|
1664
|
+
"tbody",
|
|
1665
|
+
__spreadValues({
|
|
1666
|
+
"data-slot": "table-body",
|
|
1667
|
+
className: cn13("[&_tr:last-child]:border-0", className)
|
|
1668
|
+
}, props)
|
|
1669
|
+
);
|
|
1670
|
+
}
|
|
1671
|
+
function TableRow(_a) {
|
|
1672
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1673
|
+
return /* @__PURE__ */ jsx15(
|
|
1674
|
+
"tr",
|
|
1675
|
+
__spreadValues({
|
|
1676
|
+
"data-slot": "table-row",
|
|
1677
|
+
className: cn13(
|
|
1678
|
+
"border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted",
|
|
1679
|
+
className
|
|
1680
|
+
)
|
|
1681
|
+
}, props)
|
|
1682
|
+
);
|
|
1683
|
+
}
|
|
1684
|
+
function TableHead(_a) {
|
|
1685
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1686
|
+
return /* @__PURE__ */ jsx15(
|
|
1687
|
+
"th",
|
|
1688
|
+
__spreadValues({
|
|
1689
|
+
"data-slot": "table-head",
|
|
1690
|
+
className: cn13(
|
|
1691
|
+
"h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
|
|
1692
|
+
className
|
|
1693
|
+
)
|
|
1694
|
+
}, props)
|
|
1695
|
+
);
|
|
1696
|
+
}
|
|
1697
|
+
function TableCell(_a) {
|
|
1698
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1699
|
+
return /* @__PURE__ */ jsx15(
|
|
1700
|
+
"td",
|
|
1701
|
+
__spreadValues({
|
|
1702
|
+
"data-slot": "table-cell",
|
|
1703
|
+
className: cn13(
|
|
1704
|
+
"p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
|
|
1705
|
+
className
|
|
1706
|
+
)
|
|
1707
|
+
}, props)
|
|
1708
|
+
);
|
|
1709
|
+
}
|
|
1710
|
+
|
|
1711
|
+
// src/components/composed/data-table/data-table-features.ts
|
|
1712
|
+
import {
|
|
1713
|
+
columnFilteringFeature,
|
|
1714
|
+
columnVisibilityFeature,
|
|
1715
|
+
createFilteredRowModel,
|
|
1716
|
+
createPaginatedRowModel,
|
|
1717
|
+
createSortedRowModel,
|
|
1718
|
+
filterFn_includesString,
|
|
1719
|
+
globalFilteringFeature,
|
|
1720
|
+
rowPaginationFeature,
|
|
1721
|
+
rowSelectionFeature,
|
|
1722
|
+
rowSortingFeature,
|
|
1723
|
+
sortFn_alphanumeric,
|
|
1724
|
+
sortFn_text,
|
|
1725
|
+
tableFeatures
|
|
1726
|
+
} from "@tanstack/react-table";
|
|
1727
|
+
var features = tableFeatures({
|
|
1728
|
+
// Filter features
|
|
1729
|
+
columnFilteringFeature,
|
|
1730
|
+
globalFilteringFeature,
|
|
1731
|
+
// Visibility & selection features
|
|
1732
|
+
columnVisibilityFeature,
|
|
1733
|
+
rowSelectionFeature,
|
|
1734
|
+
// Pagination & sorting features
|
|
1735
|
+
rowPaginationFeature,
|
|
1736
|
+
rowSortingFeature,
|
|
1737
|
+
// Row models
|
|
1738
|
+
filteredRowModel: createFilteredRowModel(),
|
|
1739
|
+
paginatedRowModel: createPaginatedRowModel(),
|
|
1740
|
+
sortedRowModel: createSortedRowModel(),
|
|
1741
|
+
// Custom/standard functions
|
|
1742
|
+
filterFns: {
|
|
1743
|
+
includesString: filterFn_includesString
|
|
1744
|
+
},
|
|
1745
|
+
sortFns: {
|
|
1746
|
+
alphanumeric: sortFn_alphanumeric,
|
|
1747
|
+
text: sortFn_text
|
|
1748
|
+
}
|
|
1749
|
+
});
|
|
1750
|
+
|
|
1751
|
+
// src/components/composed/data-table/table-content-body.tsx
|
|
1752
|
+
import {
|
|
1753
|
+
flexRender
|
|
1754
|
+
} from "@tanstack/react-table";
|
|
1755
|
+
import { SearchXIcon } from "lucide-react";
|
|
1756
|
+
import { jsx as jsx16, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1757
|
+
var SKELETON_ROWS = ["sk-1", "sk-2", "sk-3", "sk-4", "sk-5"];
|
|
1758
|
+
function DataTableContentBody({
|
|
1759
|
+
table,
|
|
1760
|
+
columns,
|
|
1761
|
+
isLoading
|
|
1762
|
+
}) {
|
|
1763
|
+
if (isLoading) {
|
|
1764
|
+
return /* @__PURE__ */ jsx16(TableBody, { children: SKELETON_ROWS.map((rowKey) => /* @__PURE__ */ jsx16(TableRow, { children: columns.map((col, idx) => {
|
|
1765
|
+
var _a;
|
|
1766
|
+
const colKey = (_a = col.id) != null ? _a : typeof col.accessorKey === "string" ? col.accessorKey : `col-${idx}`;
|
|
1767
|
+
return /* @__PURE__ */ jsx16(TableCell, { className: "py-3", children: /* @__PURE__ */ jsx16(Skeleton, { className: "h-4 w-full" }) }, `${rowKey}-${colKey}`);
|
|
1768
|
+
}) }, rowKey)) });
|
|
1769
|
+
}
|
|
1770
|
+
const rows = table.getRowModel().rows;
|
|
1771
|
+
if (rows == null ? void 0 : rows.length) {
|
|
1772
|
+
return /* @__PURE__ */ jsx16(TableBody, { children: rows.map((row) => /* @__PURE__ */ jsx16(TableRow, { children: row.getVisibleCells().map((cell) => /* @__PURE__ */ jsx16(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id)) }, row.id)) });
|
|
1773
|
+
}
|
|
1774
|
+
return /* @__PURE__ */ jsx16(TableBody, { children: /* @__PURE__ */ jsx16(TableRow, { children: /* @__PURE__ */ jsx16(TableCell, { colSpan: columns.length, className: "h-36 text-center", children: /* @__PURE__ */ jsxs9("div", { className: "flex flex-col items-center justify-center gap-1.5 py-4 text-muted-foreground", children: [
|
|
1775
|
+
/* @__PURE__ */ jsx16(SearchXIcon, { className: "size-6 text-muted-foreground/60" }),
|
|
1776
|
+
/* @__PURE__ */ jsx16("p", { className: "text-xs font-medium text-foreground", children: "No matching results" }),
|
|
1777
|
+
/* @__PURE__ */ jsx16("p", { className: "text-xs text-muted-foreground max-w-xs", children: "No records matched your search query or filter criteria." }),
|
|
1778
|
+
/* @__PURE__ */ jsx16(
|
|
1779
|
+
Button,
|
|
1780
|
+
{
|
|
1781
|
+
variant: "outline",
|
|
1782
|
+
size: "xs",
|
|
1783
|
+
className: "mt-1",
|
|
1784
|
+
onClick: () => {
|
|
1785
|
+
table.resetGlobalFilter();
|
|
1786
|
+
table.resetColumnFilters();
|
|
1787
|
+
},
|
|
1788
|
+
children: "Clear search & filters"
|
|
1789
|
+
}
|
|
1790
|
+
)
|
|
1791
|
+
] }) }) }) });
|
|
1792
|
+
}
|
|
1793
|
+
|
|
1794
|
+
// src/components/composed/data-table/table-content-header.tsx
|
|
1795
|
+
import { flexRender as flexRender2 } from "@tanstack/react-table";
|
|
1796
|
+
import { ArrowDownIcon, ArrowUpDownIcon, ArrowUpIcon } from "lucide-react";
|
|
1797
|
+
|
|
1798
|
+
// src/lib/utils.ts
|
|
1799
|
+
import { cn as cn14 } from "cn";
|
|
1800
|
+
|
|
1801
|
+
// src/components/composed/data-table/table-content-header.tsx
|
|
1802
|
+
import { jsx as jsx17, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
1803
|
+
function DataTableContentHeader({
|
|
1804
|
+
table
|
|
1805
|
+
}) {
|
|
1806
|
+
return /* @__PURE__ */ jsx17(TableHeader, { children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ jsx17(TableRow, { children: headerGroup.headers.map((header) => {
|
|
1807
|
+
if (header.isPlaceholder) {
|
|
1808
|
+
return /* @__PURE__ */ jsx17(TableHead, {}, header.id);
|
|
1809
|
+
}
|
|
1810
|
+
const canSort = header.column.getCanSort();
|
|
1811
|
+
const isSorted = header.column.getIsSorted();
|
|
1812
|
+
if (!canSort) {
|
|
1813
|
+
return /* @__PURE__ */ jsx17(TableHead, { children: flexRender2(
|
|
1814
|
+
header.column.columnDef.header,
|
|
1815
|
+
header.getContext()
|
|
1816
|
+
) }, header.id);
|
|
1817
|
+
}
|
|
1818
|
+
return /* @__PURE__ */ jsx17(TableHead, { className: "select-none", children: /* @__PURE__ */ jsxs10(
|
|
1819
|
+
"button",
|
|
1820
|
+
{
|
|
1821
|
+
type: "button",
|
|
1822
|
+
className: cn14(
|
|
1823
|
+
"flex items-center gap-1.5 -ml-1 px-1 py-1 rounded hover:bg-muted/50 cursor-pointer font-medium text-xs transition-colors",
|
|
1824
|
+
isSorted && "text-foreground font-semibold"
|
|
1825
|
+
),
|
|
1826
|
+
onClick: header.column.getToggleSortingHandler(),
|
|
1827
|
+
"aria-label": `Sort by ${typeof header.column.columnDef.header === "string" ? header.column.columnDef.header : header.id}`,
|
|
1516
1828
|
children: [
|
|
1517
|
-
|
|
1518
|
-
|
|
1829
|
+
/* @__PURE__ */ jsx17("span", { children: flexRender2(
|
|
1830
|
+
header.column.columnDef.header,
|
|
1831
|
+
header.getContext()
|
|
1832
|
+
) }),
|
|
1833
|
+
isSorted === "asc" ? /* @__PURE__ */ jsx17(ArrowUpIcon, { className: "size-3 text-foreground shrink-0" }) : isSorted === "desc" ? /* @__PURE__ */ jsx17(ArrowDownIcon, { className: "size-3 text-foreground shrink-0" }) : /* @__PURE__ */ jsx17(ArrowUpDownIcon, { className: "size-3 text-muted-foreground/40 hover:text-muted-foreground shrink-0" })
|
|
1519
1834
|
]
|
|
1520
|
-
}
|
|
1521
|
-
|
|
1522
|
-
|
|
1523
|
-
|
|
1835
|
+
}
|
|
1836
|
+
) }, header.id);
|
|
1837
|
+
}) }, headerGroup.id)) });
|
|
1838
|
+
}
|
|
1839
|
+
|
|
1840
|
+
// src/components/composed/data-table/table-footer-entries.tsx
|
|
1841
|
+
import { jsx as jsx18, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
1842
|
+
function DataTableFooterEntries({
|
|
1843
|
+
table
|
|
1844
|
+
}) {
|
|
1845
|
+
var _a, _b, _c;
|
|
1846
|
+
const pagination = (_a = table.options.state) == null ? void 0 : _a.pagination;
|
|
1847
|
+
const pageIndex = (_b = pagination == null ? void 0 : pagination.pageIndex) != null ? _b : 0;
|
|
1848
|
+
const pageSize = (_c = pagination == null ? void 0 : pagination.pageSize) != null ? _c : 10;
|
|
1849
|
+
const totalRows = table.getFilteredRowModel().rows.length;
|
|
1850
|
+
const startRow = totalRows === 0 ? 0 : pageIndex * pageSize + 1;
|
|
1851
|
+
const endRow = Math.min((pageIndex + 1) * pageSize, totalRows);
|
|
1852
|
+
return /* @__PURE__ */ jsxs11("div", { className: "flex-1 text-xs text-muted-foreground", children: [
|
|
1853
|
+
"Showing",
|
|
1854
|
+
" ",
|
|
1855
|
+
/* @__PURE__ */ jsxs11("span", { className: "font-medium text-foreground", children: [
|
|
1856
|
+
startRow,
|
|
1857
|
+
"-",
|
|
1858
|
+
endRow
|
|
1859
|
+
] }),
|
|
1860
|
+
" ",
|
|
1861
|
+
"of ",
|
|
1862
|
+
/* @__PURE__ */ jsx18("span", { className: "font-medium text-foreground", children: totalRows }),
|
|
1863
|
+
" ",
|
|
1864
|
+
"entries."
|
|
1524
1865
|
] });
|
|
1525
|
-
}
|
|
1866
|
+
}
|
|
1526
1867
|
|
|
1527
|
-
// src/components/composed/
|
|
1528
|
-
import {
|
|
1529
|
-
|
|
1530
|
-
|
|
1868
|
+
// src/components/composed/data-table/table-footer-pagination.tsx
|
|
1869
|
+
import {
|
|
1870
|
+
ChevronLeftIcon,
|
|
1871
|
+
ChevronRightIcon as ChevronRightIcon3,
|
|
1872
|
+
ChevronsLeftIcon,
|
|
1873
|
+
ChevronsRightIcon
|
|
1874
|
+
} from "lucide-react";
|
|
1875
|
+
import { jsx as jsx19, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
1876
|
+
function DataTableFooterPagination({
|
|
1877
|
+
table
|
|
1878
|
+
}) {
|
|
1879
|
+
return /* @__PURE__ */ jsxs12("div", { className: "flex items-center gap-1", children: [
|
|
1880
|
+
/* @__PURE__ */ jsxs12(Tooltip, { children: [
|
|
1881
|
+
/* @__PURE__ */ jsx19(
|
|
1882
|
+
TooltipTrigger,
|
|
1883
|
+
{
|
|
1884
|
+
render: /* @__PURE__ */ jsx19(
|
|
1885
|
+
Button,
|
|
1886
|
+
{
|
|
1887
|
+
variant: "outline",
|
|
1888
|
+
size: "icon-xs",
|
|
1889
|
+
onClick: () => table.firstPage(),
|
|
1890
|
+
disabled: !table.getCanPreviousPage(),
|
|
1891
|
+
children: /* @__PURE__ */ jsx19(ChevronsLeftIcon, {})
|
|
1892
|
+
}
|
|
1893
|
+
)
|
|
1894
|
+
}
|
|
1895
|
+
),
|
|
1896
|
+
/* @__PURE__ */ jsx19(TooltipContent, { children: "Go to first page" })
|
|
1897
|
+
] }),
|
|
1898
|
+
/* @__PURE__ */ jsxs12(Tooltip, { children: [
|
|
1899
|
+
/* @__PURE__ */ jsx19(
|
|
1900
|
+
TooltipTrigger,
|
|
1901
|
+
{
|
|
1902
|
+
render: /* @__PURE__ */ jsx19(
|
|
1903
|
+
Button,
|
|
1904
|
+
{
|
|
1905
|
+
variant: "outline",
|
|
1906
|
+
size: "icon-xs",
|
|
1907
|
+
onClick: () => table.previousPage(),
|
|
1908
|
+
disabled: !table.getCanPreviousPage(),
|
|
1909
|
+
children: /* @__PURE__ */ jsx19(ChevronLeftIcon, {})
|
|
1910
|
+
}
|
|
1911
|
+
)
|
|
1912
|
+
}
|
|
1913
|
+
),
|
|
1914
|
+
/* @__PURE__ */ jsx19(TooltipContent, { children: "Go to previous page" })
|
|
1915
|
+
] }),
|
|
1916
|
+
/* @__PURE__ */ jsxs12(Tooltip, { children: [
|
|
1917
|
+
/* @__PURE__ */ jsx19(
|
|
1918
|
+
TooltipTrigger,
|
|
1919
|
+
{
|
|
1920
|
+
render: /* @__PURE__ */ jsx19(
|
|
1921
|
+
Button,
|
|
1922
|
+
{
|
|
1923
|
+
variant: "outline",
|
|
1924
|
+
size: "icon-xs",
|
|
1925
|
+
onClick: () => table.nextPage(),
|
|
1926
|
+
disabled: !table.getCanNextPage(),
|
|
1927
|
+
children: /* @__PURE__ */ jsx19(ChevronRightIcon3, {})
|
|
1928
|
+
}
|
|
1929
|
+
)
|
|
1930
|
+
}
|
|
1931
|
+
),
|
|
1932
|
+
/* @__PURE__ */ jsx19(TooltipContent, { children: "Go to next page" })
|
|
1933
|
+
] }),
|
|
1934
|
+
/* @__PURE__ */ jsxs12(Tooltip, { children: [
|
|
1935
|
+
/* @__PURE__ */ jsx19(
|
|
1936
|
+
TooltipTrigger,
|
|
1937
|
+
{
|
|
1938
|
+
render: /* @__PURE__ */ jsx19(
|
|
1939
|
+
Button,
|
|
1940
|
+
{
|
|
1941
|
+
variant: "outline",
|
|
1942
|
+
size: "icon-xs",
|
|
1943
|
+
onClick: () => table.lastPage(),
|
|
1944
|
+
disabled: !table.getCanNextPage(),
|
|
1945
|
+
children: /* @__PURE__ */ jsx19(ChevronsRightIcon, {})
|
|
1946
|
+
}
|
|
1947
|
+
)
|
|
1948
|
+
}
|
|
1949
|
+
),
|
|
1950
|
+
/* @__PURE__ */ jsx19(TooltipContent, { children: "Go to last page" })
|
|
1951
|
+
] })
|
|
1952
|
+
] });
|
|
1953
|
+
}
|
|
1954
|
+
|
|
1955
|
+
// src/components/composed/data-table/table-header-add.tsx
|
|
1956
|
+
import { PlusIcon } from "lucide-react";
|
|
1957
|
+
import { Fragment, jsx as jsx20, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1958
|
+
function DataTableHeaderAdd({
|
|
1959
|
+
onAdd,
|
|
1960
|
+
addLabel
|
|
1961
|
+
}) {
|
|
1962
|
+
return /* @__PURE__ */ jsxs13(Fragment, { children: [
|
|
1963
|
+
/* @__PURE__ */ jsxs13(Tooltip, { children: [
|
|
1964
|
+
/* @__PURE__ */ jsx20(
|
|
1965
|
+
TooltipTrigger,
|
|
1966
|
+
{
|
|
1967
|
+
className: "flex sm:hidden",
|
|
1968
|
+
render: /* @__PURE__ */ jsx20(Button, { variant: "default", size: "icon", onClick: onAdd, children: /* @__PURE__ */ jsx20(PlusIcon, {}) })
|
|
1969
|
+
}
|
|
1970
|
+
),
|
|
1971
|
+
/* @__PURE__ */ jsx20(TooltipContent, { children: addLabel != null ? addLabel : "Add" })
|
|
1972
|
+
] }),
|
|
1973
|
+
/* @__PURE__ */ jsxs13(Button, { variant: "default", onClick: onAdd, className: "hidden sm:flex", children: [
|
|
1974
|
+
/* @__PURE__ */ jsx20(PlusIcon, {}),
|
|
1975
|
+
addLabel != null ? addLabel : "Add"
|
|
1976
|
+
] })
|
|
1977
|
+
] });
|
|
1978
|
+
}
|
|
1979
|
+
|
|
1980
|
+
// src/components/composed/data-table/table-header-download.tsx
|
|
1981
|
+
import {
|
|
1982
|
+
DownloadIcon,
|
|
1983
|
+
FileCodeIcon,
|
|
1984
|
+
FileSpreadsheetIcon,
|
|
1985
|
+
FileTextIcon,
|
|
1986
|
+
PrinterIcon
|
|
1987
|
+
} from "lucide-react";
|
|
1988
|
+
|
|
1989
|
+
// src/components/composed/data-table/export.ts
|
|
1990
|
+
import * as XLSX from "xlsx";
|
|
1991
|
+
function normalizeRows(rows) {
|
|
1992
|
+
return rows.map((row) => {
|
|
1993
|
+
var _a, _b, _c;
|
|
1994
|
+
const flat = {};
|
|
1995
|
+
for (const [key, value] of Object.entries(row)) {
|
|
1996
|
+
if (value === null || value === void 0) {
|
|
1997
|
+
flat[key] = "";
|
|
1998
|
+
} else if (Array.isArray(value)) {
|
|
1999
|
+
flat[key] = value.map((item) => {
|
|
2000
|
+
var _a2, _b2, _c2;
|
|
2001
|
+
if (item === null || item === void 0) return "";
|
|
2002
|
+
if (typeof item === "object") {
|
|
2003
|
+
const record = item;
|
|
2004
|
+
return (_c2 = (_b2 = (_a2 = record.name) != null ? _a2 : record.label) != null ? _b2 : record.email) != null ? _c2 : JSON.stringify(item);
|
|
2005
|
+
}
|
|
2006
|
+
return String(item);
|
|
2007
|
+
}).filter(Boolean).join(", ");
|
|
2008
|
+
} else if (typeof value === "object") {
|
|
2009
|
+
const record = value;
|
|
2010
|
+
flat[key] = (_c = (_b = (_a = record.name) != null ? _a : record.label) != null ? _b : record.email) != null ? _c : JSON.stringify(value);
|
|
2011
|
+
} else {
|
|
2012
|
+
flat[key] = String(value);
|
|
2013
|
+
}
|
|
2014
|
+
}
|
|
2015
|
+
return flat;
|
|
2016
|
+
});
|
|
2017
|
+
}
|
|
2018
|
+
function escapeHtml(str) {
|
|
2019
|
+
return str.replace(/&/g, "&").replace(/</g, "<").replace(/>/g, ">").replace(/"/g, """).replace(/'/g, "'");
|
|
2020
|
+
}
|
|
2021
|
+
function exportToXLSX(rows, filename = "data-export") {
|
|
2022
|
+
const normalized = normalizeRows(rows);
|
|
2023
|
+
const worksheet = XLSX.utils.json_to_sheet(normalized);
|
|
2024
|
+
const workbook = XLSX.utils.book_new();
|
|
2025
|
+
XLSX.utils.book_append_sheet(workbook, worksheet, "Sheet1");
|
|
2026
|
+
const finalFilename = filename.endsWith(".xlsx") ? filename : `${filename}.xlsx`;
|
|
2027
|
+
XLSX.writeFile(workbook, finalFilename);
|
|
2028
|
+
}
|
|
2029
|
+
function exportToCSV(rows, filename = "data-export") {
|
|
2030
|
+
const normalized = normalizeRows(rows);
|
|
2031
|
+
const worksheet = XLSX.utils.json_to_sheet(normalized);
|
|
2032
|
+
const csvString = XLSX.utils.sheet_to_csv(worksheet);
|
|
2033
|
+
const blob = new Blob([`\uFEFF${csvString}`], {
|
|
2034
|
+
type: "text/csv;charset=utf-8;"
|
|
2035
|
+
});
|
|
2036
|
+
const url = URL.createObjectURL(blob);
|
|
2037
|
+
const link = document.createElement("a");
|
|
2038
|
+
link.href = url;
|
|
2039
|
+
const finalFilename = filename.endsWith(".csv") ? filename : `${filename}.csv`;
|
|
2040
|
+
link.setAttribute("download", finalFilename);
|
|
2041
|
+
document.body.appendChild(link);
|
|
2042
|
+
link.click();
|
|
2043
|
+
document.body.removeChild(link);
|
|
2044
|
+
setTimeout(() => {
|
|
2045
|
+
URL.revokeObjectURL(url);
|
|
2046
|
+
}, 1e3);
|
|
2047
|
+
}
|
|
2048
|
+
function printTable(headers, rows, title = "Data Export") {
|
|
2049
|
+
let tableHtml = `<table style="width:100%; border-collapse:collapse; font-family:sans-serif; font-size:12px;"><thead><tr>`;
|
|
2050
|
+
for (const header of headers) {
|
|
2051
|
+
tableHtml += `<th style="border:1px solid #ddd; padding:8px; background-color:#f8f9fa; text-align:left;">${escapeHtml(header)}</th>`;
|
|
2052
|
+
}
|
|
2053
|
+
tableHtml += `</tr></thead><tbody>`;
|
|
2054
|
+
for (const row of rows) {
|
|
2055
|
+
tableHtml += `<tr>`;
|
|
2056
|
+
for (const cell of row) {
|
|
2057
|
+
tableHtml += `<td style="border:1px solid #ddd; padding:8px;">${escapeHtml(cell != null ? cell : "")}</td>`;
|
|
2058
|
+
}
|
|
2059
|
+
tableHtml += `</tr>`;
|
|
2060
|
+
}
|
|
2061
|
+
tableHtml += `</tbody></table>`;
|
|
2062
|
+
const printWindow = window.open("", "_blank");
|
|
2063
|
+
if (!printWindow) return;
|
|
2064
|
+
printWindow.document.write(`
|
|
2065
|
+
<!DOCTYPE html>
|
|
2066
|
+
<html>
|
|
2067
|
+
<head>
|
|
2068
|
+
<title>${escapeHtml(title)}</title>
|
|
2069
|
+
<style>
|
|
2070
|
+
body { font-family: sans-serif; padding: 20px; color: #333; }
|
|
2071
|
+
h2 { margin-bottom: 6px; font-size: 18px; }
|
|
2072
|
+
.meta { font-size: 11px; color: #666; margin-bottom: 16px; }
|
|
2073
|
+
@page { size: auto; margin: 15mm; }
|
|
2074
|
+
</style>
|
|
2075
|
+
</head>
|
|
2076
|
+
<body>
|
|
2077
|
+
<h2>${escapeHtml(title)}</h2>
|
|
2078
|
+
<div class="meta">Generated on ${(/* @__PURE__ */ new Date()).toLocaleString()}</div>
|
|
2079
|
+
${tableHtml}
|
|
2080
|
+
</body>
|
|
2081
|
+
</html>
|
|
2082
|
+
`);
|
|
2083
|
+
printWindow.document.close();
|
|
2084
|
+
printWindow.focus();
|
|
2085
|
+
setTimeout(() => {
|
|
2086
|
+
printWindow.print();
|
|
2087
|
+
printWindow.close();
|
|
2088
|
+
}, 250);
|
|
2089
|
+
}
|
|
2090
|
+
|
|
2091
|
+
// src/components/composed/data-table/table-header-download.tsx
|
|
2092
|
+
import { jsx as jsx21, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
2093
|
+
function getTableExportData(table) {
|
|
2094
|
+
const columns = table.getAllColumns().filter(
|
|
2095
|
+
(col) => typeof col.accessorFn !== "undefined" && col.getIsVisible()
|
|
2096
|
+
);
|
|
2097
|
+
const headers = columns.map(
|
|
2098
|
+
(col) => typeof col.columnDef.header === "string" ? col.columnDef.header : col.id
|
|
2099
|
+
);
|
|
2100
|
+
const filteredRows = table.getFilteredRowModel().rows;
|
|
2101
|
+
const rows = filteredRows.map(
|
|
2102
|
+
(row) => headers.map((_, i) => {
|
|
2103
|
+
var _a, _b;
|
|
2104
|
+
const col = columns[i];
|
|
2105
|
+
const value = row.getValue(col.id);
|
|
2106
|
+
if (value === null || value === void 0) return "";
|
|
2107
|
+
if (Array.isArray(value)) {
|
|
2108
|
+
return value.map(
|
|
2109
|
+
(item) => {
|
|
2110
|
+
var _a2, _b2;
|
|
2111
|
+
return typeof item === "object" && item !== null ? (_b2 = (_a2 = item.name) != null ? _a2 : item.email) != null ? _b2 : JSON.stringify(item) : String(item);
|
|
2112
|
+
}
|
|
2113
|
+
).join(", ");
|
|
2114
|
+
}
|
|
2115
|
+
if (typeof value === "object") {
|
|
2116
|
+
return (_b = (_a = value.name) != null ? _a : value.email) != null ? _b : JSON.stringify(value);
|
|
2117
|
+
}
|
|
2118
|
+
return String(value);
|
|
2119
|
+
})
|
|
2120
|
+
);
|
|
2121
|
+
const rowObjects = filteredRows.map((_, rowIndex) => {
|
|
2122
|
+
const obj = {};
|
|
2123
|
+
for (let i = 0; i < columns.length; i++) {
|
|
2124
|
+
obj[headers[i]] = rows[rowIndex][i];
|
|
2125
|
+
}
|
|
2126
|
+
return obj;
|
|
2127
|
+
});
|
|
2128
|
+
return { headers, rows, rowObjects };
|
|
2129
|
+
}
|
|
2130
|
+
function DataTableHeaderDownload({
|
|
2131
|
+
table,
|
|
2132
|
+
exportFilename,
|
|
2133
|
+
onDownload
|
|
2134
|
+
}) {
|
|
2135
|
+
return /* @__PURE__ */ jsxs14(DropdownMenu, { children: [
|
|
2136
|
+
/* @__PURE__ */ jsxs14(Tooltip, { children: [
|
|
2137
|
+
/* @__PURE__ */ jsx21(
|
|
2138
|
+
DropdownMenuTrigger,
|
|
2139
|
+
{
|
|
2140
|
+
render: /* @__PURE__ */ jsx21(
|
|
2141
|
+
TooltipTrigger,
|
|
2142
|
+
{
|
|
2143
|
+
render: /* @__PURE__ */ jsx21(Button, { variant: "outline", size: "icon", children: /* @__PURE__ */ jsx21(DownloadIcon, {}) })
|
|
2144
|
+
}
|
|
2145
|
+
)
|
|
2146
|
+
}
|
|
2147
|
+
),
|
|
2148
|
+
/* @__PURE__ */ jsx21(TooltipContent, { children: "Download options" })
|
|
2149
|
+
] }),
|
|
2150
|
+
/* @__PURE__ */ jsx21(DropdownMenuContent, { align: "end", className: "w-48", children: /* @__PURE__ */ jsxs14(DropdownMenuGroup, { children: [
|
|
2151
|
+
/* @__PURE__ */ jsx21(DropdownMenuLabel, { children: "Download data" }),
|
|
2152
|
+
/* @__PURE__ */ jsx21(DropdownMenuSeparator, {}),
|
|
2153
|
+
/* @__PURE__ */ jsxs14(
|
|
2154
|
+
DropdownMenuItem,
|
|
2155
|
+
{
|
|
2156
|
+
className: "hover:cursor-pointer",
|
|
2157
|
+
onClick: () => {
|
|
2158
|
+
const { headers, rows } = getTableExportData(table);
|
|
2159
|
+
printTable(headers, rows, exportFilename);
|
|
2160
|
+
onDownload == null ? void 0 : onDownload();
|
|
2161
|
+
},
|
|
2162
|
+
children: [
|
|
2163
|
+
/* @__PURE__ */ jsx21(FileTextIcon, {}),
|
|
2164
|
+
"Download PDF"
|
|
2165
|
+
]
|
|
2166
|
+
}
|
|
2167
|
+
),
|
|
2168
|
+
/* @__PURE__ */ jsxs14(
|
|
2169
|
+
DropdownMenuItem,
|
|
2170
|
+
{
|
|
2171
|
+
className: "hover:cursor-pointer",
|
|
2172
|
+
onClick: () => {
|
|
2173
|
+
const { rowObjects } = getTableExportData(table);
|
|
2174
|
+
exportToXLSX(rowObjects, exportFilename);
|
|
2175
|
+
onDownload == null ? void 0 : onDownload();
|
|
2176
|
+
},
|
|
2177
|
+
children: [
|
|
2178
|
+
/* @__PURE__ */ jsx21(FileSpreadsheetIcon, {}),
|
|
2179
|
+
"Download Excel"
|
|
2180
|
+
]
|
|
2181
|
+
}
|
|
2182
|
+
),
|
|
2183
|
+
/* @__PURE__ */ jsxs14(
|
|
2184
|
+
DropdownMenuItem,
|
|
2185
|
+
{
|
|
2186
|
+
className: "hover:cursor-pointer",
|
|
2187
|
+
onClick: () => {
|
|
2188
|
+
const { rowObjects } = getTableExportData(table);
|
|
2189
|
+
exportToCSV(rowObjects, exportFilename);
|
|
2190
|
+
onDownload == null ? void 0 : onDownload();
|
|
2191
|
+
},
|
|
2192
|
+
children: [
|
|
2193
|
+
/* @__PURE__ */ jsx21(FileCodeIcon, {}),
|
|
2194
|
+
"Download CSV"
|
|
2195
|
+
]
|
|
2196
|
+
}
|
|
2197
|
+
),
|
|
2198
|
+
/* @__PURE__ */ jsx21(DropdownMenuSeparator, {}),
|
|
2199
|
+
/* @__PURE__ */ jsxs14(
|
|
2200
|
+
DropdownMenuItem,
|
|
2201
|
+
{
|
|
2202
|
+
className: "hover:cursor-pointer",
|
|
2203
|
+
onClick: () => {
|
|
2204
|
+
const { headers, rows } = getTableExportData(table);
|
|
2205
|
+
printTable(headers, rows, exportFilename);
|
|
2206
|
+
},
|
|
2207
|
+
children: [
|
|
2208
|
+
/* @__PURE__ */ jsx21(PrinterIcon, {}),
|
|
2209
|
+
"Print Table"
|
|
2210
|
+
]
|
|
2211
|
+
}
|
|
2212
|
+
)
|
|
2213
|
+
] }) })
|
|
2214
|
+
] });
|
|
2215
|
+
}
|
|
2216
|
+
|
|
2217
|
+
// src/components/composed/data-table/table-header-filter.tsx
|
|
2218
|
+
import { format } from "date-fns";
|
|
2219
|
+
import { CalendarIcon, ListFilterIcon } from "lucide-react";
|
|
2220
|
+
import { useMemo as useMemo2, useState as useState3 } from "react";
|
|
2221
|
+
|
|
2222
|
+
// src/components/ui/calendar.tsx
|
|
2223
|
+
import { cn as cn15 } from "cn";
|
|
2224
|
+
import {
|
|
2225
|
+
ChevronDownIcon,
|
|
2226
|
+
ChevronLeftIcon as ChevronLeftIcon2,
|
|
2227
|
+
ChevronRightIcon as ChevronRightIcon4
|
|
2228
|
+
} from "lucide-react";
|
|
2229
|
+
import * as React3 from "react";
|
|
2230
|
+
import {
|
|
2231
|
+
DayPicker,
|
|
2232
|
+
getDefaultClassNames
|
|
2233
|
+
} from "react-day-picker";
|
|
2234
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
2235
|
+
function Calendar(_a) {
|
|
2236
|
+
var _b = _a, {
|
|
2237
|
+
className,
|
|
2238
|
+
classNames,
|
|
2239
|
+
showOutsideDays = true,
|
|
2240
|
+
captionLayout = "label",
|
|
2241
|
+
buttonVariant = "ghost",
|
|
2242
|
+
locale,
|
|
2243
|
+
formatters,
|
|
2244
|
+
components
|
|
2245
|
+
} = _b, props = __objRest(_b, [
|
|
2246
|
+
"className",
|
|
2247
|
+
"classNames",
|
|
2248
|
+
"showOutsideDays",
|
|
2249
|
+
"captionLayout",
|
|
2250
|
+
"buttonVariant",
|
|
2251
|
+
"locale",
|
|
2252
|
+
"formatters",
|
|
2253
|
+
"components"
|
|
2254
|
+
]);
|
|
2255
|
+
const defaultClassNames = getDefaultClassNames();
|
|
2256
|
+
return /* @__PURE__ */ jsx22(
|
|
2257
|
+
DayPicker,
|
|
2258
|
+
__spreadValues({
|
|
2259
|
+
showOutsideDays,
|
|
2260
|
+
className: cn15(
|
|
2261
|
+
"group/calendar bg-background p-3 [--cell-radius:var(--radius-md)] [--cell-size:--spacing(6)] in-data-[slot=card-content]:bg-transparent in-data-[slot=popover-content]:bg-transparent",
|
|
2262
|
+
String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
|
|
2263
|
+
String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
|
|
2264
|
+
className
|
|
2265
|
+
),
|
|
2266
|
+
captionLayout,
|
|
2267
|
+
locale,
|
|
2268
|
+
formatters: __spreadValues({
|
|
2269
|
+
formatMonthDropdown: (date) => date.toLocaleString(locale == null ? void 0 : locale.code, { month: "short" })
|
|
2270
|
+
}, formatters),
|
|
2271
|
+
classNames: __spreadValues({
|
|
2272
|
+
root: cn15("w-fit", defaultClassNames.root),
|
|
2273
|
+
months: cn15(
|
|
2274
|
+
"relative flex flex-col gap-4 md:flex-row",
|
|
2275
|
+
defaultClassNames.months
|
|
2276
|
+
),
|
|
2277
|
+
month: cn15("flex w-full flex-col gap-4", defaultClassNames.month),
|
|
2278
|
+
nav: cn15(
|
|
2279
|
+
"absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1",
|
|
2280
|
+
defaultClassNames.nav
|
|
2281
|
+
),
|
|
2282
|
+
button_previous: cn15(
|
|
2283
|
+
buttonVariants({ variant: buttonVariant }),
|
|
2284
|
+
"size-(--cell-size) p-0 select-none aria-disabled:opacity-50",
|
|
2285
|
+
defaultClassNames.button_previous
|
|
2286
|
+
),
|
|
2287
|
+
button_next: cn15(
|
|
2288
|
+
buttonVariants({ variant: buttonVariant }),
|
|
2289
|
+
"size-(--cell-size) p-0 select-none aria-disabled:opacity-50",
|
|
2290
|
+
defaultClassNames.button_next
|
|
2291
|
+
),
|
|
2292
|
+
month_caption: cn15(
|
|
2293
|
+
"flex h-(--cell-size) w-full items-center justify-center px-(--cell-size)",
|
|
2294
|
+
defaultClassNames.month_caption
|
|
2295
|
+
),
|
|
2296
|
+
dropdowns: cn15(
|
|
2297
|
+
"flex h-(--cell-size) w-full items-center justify-center gap-1.5 text-sm font-medium",
|
|
2298
|
+
defaultClassNames.dropdowns
|
|
2299
|
+
),
|
|
2300
|
+
dropdown_root: cn15(
|
|
2301
|
+
"relative rounded-(--cell-radius)",
|
|
2302
|
+
defaultClassNames.dropdown_root
|
|
2303
|
+
),
|
|
2304
|
+
dropdown: cn15(
|
|
2305
|
+
"absolute inset-0 bg-popover opacity-0",
|
|
2306
|
+
defaultClassNames.dropdown
|
|
2307
|
+
),
|
|
2308
|
+
caption_label: cn15(
|
|
2309
|
+
"font-medium select-none",
|
|
2310
|
+
captionLayout === "label" ? "text-sm" : "flex items-center gap-1 rounded-(--cell-radius) text-sm [&>svg]:size-3.5 [&>svg]:text-muted-foreground",
|
|
2311
|
+
defaultClassNames.caption_label
|
|
2312
|
+
),
|
|
2313
|
+
month_grid: cn15("w-full border-collapse", defaultClassNames.month_grid),
|
|
2314
|
+
weekdays: cn15("flex", defaultClassNames.weekdays),
|
|
2315
|
+
weekday: cn15(
|
|
2316
|
+
"flex-1 rounded-(--cell-radius) text-[0.8rem] font-normal text-muted-foreground select-none",
|
|
2317
|
+
defaultClassNames.weekday
|
|
2318
|
+
),
|
|
2319
|
+
week: cn15("mt-2 flex w-full", defaultClassNames.week),
|
|
2320
|
+
week_number_header: cn15(
|
|
2321
|
+
"w-(--cell-size) select-none",
|
|
2322
|
+
defaultClassNames.week_number_header
|
|
2323
|
+
),
|
|
2324
|
+
week_number: cn15(
|
|
2325
|
+
"text-[0.8rem] text-muted-foreground select-none",
|
|
2326
|
+
defaultClassNames.week_number
|
|
2327
|
+
),
|
|
2328
|
+
day: cn15(
|
|
2329
|
+
"group/day relative aspect-square h-full w-full rounded-(--cell-radius) p-0 text-center select-none [&:last-child[data-selected=true]_button]:rounded-r-(--cell-radius)",
|
|
2330
|
+
props.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-(--cell-radius)" : "[&:first-child[data-selected=true]_button]:rounded-l-(--cell-radius)",
|
|
2331
|
+
defaultClassNames.day
|
|
2332
|
+
),
|
|
2333
|
+
range_start: cn15(
|
|
2334
|
+
"relative isolate z-0 rounded-l-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:right-0 after:w-4 after:bg-muted",
|
|
2335
|
+
defaultClassNames.range_start
|
|
2336
|
+
),
|
|
2337
|
+
range_middle: cn15("rounded-none", defaultClassNames.range_middle),
|
|
2338
|
+
range_end: cn15(
|
|
2339
|
+
"relative isolate z-0 rounded-r-(--cell-radius) bg-muted after:absolute after:inset-y-0 after:left-0 after:w-4 after:bg-muted",
|
|
2340
|
+
defaultClassNames.range_end
|
|
2341
|
+
),
|
|
2342
|
+
today: cn15(
|
|
2343
|
+
"rounded-(--cell-radius) bg-muted text-foreground data-[selected=true]:rounded-none",
|
|
2344
|
+
defaultClassNames.today
|
|
2345
|
+
),
|
|
2346
|
+
outside: cn15(
|
|
2347
|
+
"text-muted-foreground aria-selected:text-muted-foreground",
|
|
2348
|
+
defaultClassNames.outside
|
|
2349
|
+
),
|
|
2350
|
+
disabled: cn15(
|
|
2351
|
+
"text-muted-foreground opacity-50",
|
|
2352
|
+
defaultClassNames.disabled
|
|
2353
|
+
),
|
|
2354
|
+
hidden: cn15("invisible", defaultClassNames.hidden)
|
|
2355
|
+
}, classNames),
|
|
2356
|
+
components: __spreadValues({
|
|
2357
|
+
Root: (_a2) => {
|
|
2358
|
+
var _b2 = _a2, { className: className2, rootRef } = _b2, props2 = __objRest(_b2, ["className", "rootRef"]);
|
|
2359
|
+
return /* @__PURE__ */ jsx22(
|
|
2360
|
+
"div",
|
|
2361
|
+
__spreadValues({
|
|
2362
|
+
"data-slot": "calendar",
|
|
2363
|
+
ref: rootRef,
|
|
2364
|
+
className: cn15(className2)
|
|
2365
|
+
}, props2)
|
|
2366
|
+
);
|
|
2367
|
+
},
|
|
2368
|
+
Chevron: (_c) => {
|
|
2369
|
+
var _d = _c, { className: className2, orientation } = _d, props2 = __objRest(_d, ["className", "orientation"]);
|
|
2370
|
+
if (orientation === "left") {
|
|
2371
|
+
return /* @__PURE__ */ jsx22(ChevronLeftIcon2, __spreadValues({ className: cn15("size-4", className2) }, props2));
|
|
2372
|
+
}
|
|
2373
|
+
if (orientation === "right") {
|
|
2374
|
+
return /* @__PURE__ */ jsx22(
|
|
2375
|
+
ChevronRightIcon4,
|
|
2376
|
+
__spreadValues({
|
|
2377
|
+
className: cn15("size-4", className2)
|
|
2378
|
+
}, props2)
|
|
2379
|
+
);
|
|
2380
|
+
}
|
|
2381
|
+
return /* @__PURE__ */ jsx22(ChevronDownIcon, __spreadValues({ className: cn15("size-4", className2) }, props2));
|
|
2382
|
+
},
|
|
2383
|
+
DayButton: (_e) => {
|
|
2384
|
+
var props2 = __objRest(_e, []);
|
|
2385
|
+
return /* @__PURE__ */ jsx22(CalendarDayButton, __spreadValues({ locale }, props2));
|
|
2386
|
+
},
|
|
2387
|
+
WeekNumber: (_f) => {
|
|
2388
|
+
var _g = _f, { children } = _g, props2 = __objRest(_g, ["children"]);
|
|
2389
|
+
return /* @__PURE__ */ jsx22("td", __spreadProps(__spreadValues({}, props2), { children: /* @__PURE__ */ jsx22("div", { className: "flex size-(--cell-size) items-center justify-center text-center", children }) }));
|
|
2390
|
+
}
|
|
2391
|
+
}, components)
|
|
2392
|
+
}, props)
|
|
2393
|
+
);
|
|
2394
|
+
}
|
|
2395
|
+
function CalendarDayButton(_a) {
|
|
2396
|
+
var _b = _a, {
|
|
2397
|
+
className,
|
|
2398
|
+
day,
|
|
2399
|
+
modifiers,
|
|
2400
|
+
locale
|
|
2401
|
+
} = _b, props = __objRest(_b, [
|
|
2402
|
+
"className",
|
|
2403
|
+
"day",
|
|
2404
|
+
"modifiers",
|
|
2405
|
+
"locale"
|
|
2406
|
+
]);
|
|
2407
|
+
const defaultClassNames = getDefaultClassNames();
|
|
2408
|
+
const ref = React3.useRef(null);
|
|
2409
|
+
React3.useEffect(() => {
|
|
2410
|
+
var _a2;
|
|
2411
|
+
if (modifiers.focused) (_a2 = ref.current) == null ? void 0 : _a2.focus();
|
|
2412
|
+
}, [modifiers.focused]);
|
|
2413
|
+
return /* @__PURE__ */ jsx22(
|
|
2414
|
+
Button,
|
|
2415
|
+
__spreadValues({
|
|
2416
|
+
variant: "ghost",
|
|
2417
|
+
size: "icon",
|
|
2418
|
+
"data-day": day.date.toLocaleDateString(locale == null ? void 0 : locale.code),
|
|
2419
|
+
"data-selected-single": modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle,
|
|
2420
|
+
"data-range-start": modifiers.range_start,
|
|
2421
|
+
"data-range-end": modifiers.range_end,
|
|
2422
|
+
"data-range-middle": modifiers.range_middle,
|
|
2423
|
+
className: cn15(
|
|
2424
|
+
"relative isolate z-10 flex aspect-square size-auto w-full min-w-(--cell-size) flex-col gap-1 border-0 leading-none font-normal group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-[3px] group-data-[focused=true]/day:ring-ring/50 data-[range-end=true]:rounded-(--cell-radius) data-[range-end=true]:rounded-r-(--cell-radius) data-[range-end=true]:bg-primary data-[range-end=true]:text-primary-foreground data-[range-middle=true]:rounded-none data-[range-middle=true]:bg-muted data-[range-middle=true]:text-foreground data-[range-start=true]:rounded-(--cell-radius) data-[range-start=true]:rounded-l-(--cell-radius) data-[range-start=true]:bg-primary data-[range-start=true]:text-primary-foreground data-[selected-single=true]:bg-primary data-[selected-single=true]:text-primary-foreground dark:hover:text-foreground [&>span]:text-xs [&>span]:opacity-70",
|
|
2425
|
+
defaultClassNames.day,
|
|
2426
|
+
className
|
|
2427
|
+
)
|
|
2428
|
+
}, props)
|
|
2429
|
+
);
|
|
2430
|
+
}
|
|
2431
|
+
|
|
2432
|
+
// src/components/ui/popover.tsx
|
|
2433
|
+
import { Popover as PopoverPrimitive } from "@base-ui/react/popover";
|
|
2434
|
+
import { cn as cn16 } from "cn";
|
|
2435
|
+
import { jsx as jsx23 } from "react/jsx-runtime";
|
|
2436
|
+
function Popover(_a) {
|
|
2437
|
+
var props = __objRest(_a, []);
|
|
2438
|
+
return /* @__PURE__ */ jsx23(PopoverPrimitive.Root, __spreadValues({ "data-slot": "popover" }, props));
|
|
2439
|
+
}
|
|
2440
|
+
function PopoverTrigger(_a) {
|
|
2441
|
+
var props = __objRest(_a, []);
|
|
2442
|
+
return /* @__PURE__ */ jsx23(PopoverPrimitive.Trigger, __spreadValues({ "data-slot": "popover-trigger" }, props));
|
|
2443
|
+
}
|
|
2444
|
+
function PopoverContent(_a) {
|
|
2445
|
+
var _b = _a, {
|
|
2446
|
+
className,
|
|
2447
|
+
align = "center",
|
|
2448
|
+
alignOffset = 0,
|
|
2449
|
+
side = "bottom",
|
|
2450
|
+
sideOffset = 4
|
|
2451
|
+
} = _b, props = __objRest(_b, [
|
|
2452
|
+
"className",
|
|
2453
|
+
"align",
|
|
2454
|
+
"alignOffset",
|
|
2455
|
+
"side",
|
|
2456
|
+
"sideOffset"
|
|
2457
|
+
]);
|
|
2458
|
+
return /* @__PURE__ */ jsx23(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx23(
|
|
2459
|
+
PopoverPrimitive.Positioner,
|
|
2460
|
+
{
|
|
2461
|
+
align,
|
|
2462
|
+
alignOffset,
|
|
2463
|
+
side,
|
|
2464
|
+
sideOffset,
|
|
2465
|
+
className: "isolate z-50",
|
|
2466
|
+
children: /* @__PURE__ */ jsx23(
|
|
2467
|
+
PopoverPrimitive.Popup,
|
|
2468
|
+
__spreadValues({
|
|
2469
|
+
"data-slot": "popover-content",
|
|
2470
|
+
className: cn16(
|
|
2471
|
+
"z-50 flex w-72 origin-(--transform-origin) flex-col gap-4 rounded-lg bg-popover p-2.5 text-xs text-popover-foreground shadow-md ring-1 ring-foreground/10 outline-hidden duration-100 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
|
|
2472
|
+
className
|
|
2473
|
+
)
|
|
2474
|
+
}, props)
|
|
2475
|
+
)
|
|
2476
|
+
}
|
|
2477
|
+
) });
|
|
2478
|
+
}
|
|
2479
|
+
|
|
2480
|
+
// src/components/ui/select.tsx
|
|
2481
|
+
import { Select as SelectPrimitive } from "@base-ui/react/select";
|
|
2482
|
+
import { cn as cn17 } from "cn";
|
|
2483
|
+
import { CheckIcon as CheckIcon2, ChevronDownIcon as ChevronDownIcon2, ChevronUpIcon } from "lucide-react";
|
|
2484
|
+
import { jsx as jsx24, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
2485
|
+
var Select = SelectPrimitive.Root;
|
|
2486
|
+
function SelectValue(_a) {
|
|
2487
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
2488
|
+
return /* @__PURE__ */ jsx24(
|
|
2489
|
+
SelectPrimitive.Value,
|
|
2490
|
+
__spreadValues({
|
|
2491
|
+
"data-slot": "select-value",
|
|
2492
|
+
className: cn17("flex flex-1 text-left", className)
|
|
2493
|
+
}, props)
|
|
2494
|
+
);
|
|
2495
|
+
}
|
|
2496
|
+
function SelectTrigger(_a) {
|
|
2497
|
+
var _b = _a, {
|
|
2498
|
+
className,
|
|
2499
|
+
size = "default",
|
|
2500
|
+
children
|
|
2501
|
+
} = _b, props = __objRest(_b, [
|
|
2502
|
+
"className",
|
|
2503
|
+
"size",
|
|
2504
|
+
"children"
|
|
2505
|
+
]);
|
|
2506
|
+
return /* @__PURE__ */ jsxs15(
|
|
2507
|
+
SelectPrimitive.Trigger,
|
|
2508
|
+
__spreadProps(__spreadValues({
|
|
2509
|
+
"data-slot": "select-trigger",
|
|
2510
|
+
"data-size": size,
|
|
2511
|
+
className: cn17(
|
|
2512
|
+
"flex w-fit items-center justify-between gap-1.5 rounded-md border border-input bg-input/20 px-2 py-1.5 text-xs/relaxed whitespace-nowrap transition-colors outline-none focus-visible:border-ring focus-visible:ring-2 focus-visible:ring-ring/30 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-2 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground data-[size=default]:h-7 data-[size=sm]:h-6 *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
|
|
2513
|
+
className
|
|
2514
|
+
)
|
|
2515
|
+
}, props), {
|
|
2516
|
+
children: [
|
|
2517
|
+
children,
|
|
2518
|
+
/* @__PURE__ */ jsx24(
|
|
2519
|
+
SelectPrimitive.Icon,
|
|
2520
|
+
{
|
|
2521
|
+
render: /* @__PURE__ */ jsx24(ChevronDownIcon2, { className: "pointer-events-none size-3.5 text-muted-foreground" })
|
|
2522
|
+
}
|
|
2523
|
+
)
|
|
2524
|
+
]
|
|
2525
|
+
})
|
|
2526
|
+
);
|
|
2527
|
+
}
|
|
2528
|
+
function SelectContent(_a) {
|
|
2529
|
+
var _b = _a, {
|
|
2530
|
+
className,
|
|
2531
|
+
children,
|
|
2532
|
+
side = "bottom",
|
|
2533
|
+
sideOffset = 4,
|
|
2534
|
+
align = "center",
|
|
2535
|
+
alignOffset = 0,
|
|
2536
|
+
alignItemWithTrigger = true
|
|
2537
|
+
} = _b, props = __objRest(_b, [
|
|
2538
|
+
"className",
|
|
2539
|
+
"children",
|
|
2540
|
+
"side",
|
|
2541
|
+
"sideOffset",
|
|
2542
|
+
"align",
|
|
2543
|
+
"alignOffset",
|
|
2544
|
+
"alignItemWithTrigger"
|
|
2545
|
+
]);
|
|
2546
|
+
return /* @__PURE__ */ jsx24(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx24(
|
|
2547
|
+
SelectPrimitive.Positioner,
|
|
2548
|
+
{
|
|
2549
|
+
side,
|
|
2550
|
+
sideOffset,
|
|
2551
|
+
align,
|
|
2552
|
+
alignOffset,
|
|
2553
|
+
alignItemWithTrigger,
|
|
2554
|
+
className: "isolate z-50",
|
|
2555
|
+
children: /* @__PURE__ */ jsxs15(
|
|
2556
|
+
SelectPrimitive.Popup,
|
|
2557
|
+
__spreadProps(__spreadValues({
|
|
2558
|
+
"data-slot": "select-content",
|
|
2559
|
+
"data-align-trigger": alignItemWithTrigger,
|
|
2560
|
+
className: cn17(
|
|
2561
|
+
"relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-32 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95",
|
|
2562
|
+
className
|
|
2563
|
+
)
|
|
2564
|
+
}, props), {
|
|
2565
|
+
children: [
|
|
2566
|
+
/* @__PURE__ */ jsx24(SelectScrollUpButton, {}),
|
|
2567
|
+
/* @__PURE__ */ jsx24(SelectPrimitive.List, { children }),
|
|
2568
|
+
/* @__PURE__ */ jsx24(SelectScrollDownButton, {})
|
|
2569
|
+
]
|
|
2570
|
+
})
|
|
2571
|
+
)
|
|
2572
|
+
}
|
|
2573
|
+
) });
|
|
2574
|
+
}
|
|
2575
|
+
function SelectItem(_a) {
|
|
2576
|
+
var _b = _a, {
|
|
2577
|
+
className,
|
|
2578
|
+
children
|
|
2579
|
+
} = _b, props = __objRest(_b, [
|
|
2580
|
+
"className",
|
|
2581
|
+
"children"
|
|
2582
|
+
]);
|
|
2583
|
+
return /* @__PURE__ */ jsxs15(
|
|
2584
|
+
SelectPrimitive.Item,
|
|
2585
|
+
__spreadProps(__spreadValues({
|
|
2586
|
+
"data-slot": "select-item",
|
|
2587
|
+
className: cn17(
|
|
2588
|
+
"relative flex min-h-7 w-full cursor-default items-center gap-2 rounded-md px-2 py-1 text-xs/relaxed outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
2589
|
+
className
|
|
2590
|
+
)
|
|
2591
|
+
}, props), {
|
|
2592
|
+
children: [
|
|
2593
|
+
/* @__PURE__ */ jsx24(SelectPrimitive.ItemText, { className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap", children }),
|
|
2594
|
+
/* @__PURE__ */ jsx24(
|
|
2595
|
+
SelectPrimitive.ItemIndicator,
|
|
2596
|
+
{
|
|
2597
|
+
render: /* @__PURE__ */ jsx24("span", { className: "pointer-events-none absolute right-2 flex items-center justify-center" }),
|
|
2598
|
+
children: /* @__PURE__ */ jsx24(CheckIcon2, { className: "pointer-events-none" })
|
|
2599
|
+
}
|
|
2600
|
+
)
|
|
2601
|
+
]
|
|
2602
|
+
})
|
|
2603
|
+
);
|
|
2604
|
+
}
|
|
2605
|
+
function SelectScrollUpButton(_a) {
|
|
2606
|
+
var _b = _a, {
|
|
2607
|
+
className
|
|
2608
|
+
} = _b, props = __objRest(_b, [
|
|
2609
|
+
"className"
|
|
2610
|
+
]);
|
|
2611
|
+
return /* @__PURE__ */ jsx24(
|
|
2612
|
+
SelectPrimitive.ScrollUpArrow,
|
|
2613
|
+
__spreadProps(__spreadValues({
|
|
2614
|
+
"data-slot": "select-scroll-up-button",
|
|
2615
|
+
className: cn17(
|
|
2616
|
+
"top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-3.5",
|
|
2617
|
+
className
|
|
2618
|
+
)
|
|
2619
|
+
}, props), {
|
|
2620
|
+
children: /* @__PURE__ */ jsx24(ChevronUpIcon, {})
|
|
2621
|
+
})
|
|
2622
|
+
);
|
|
2623
|
+
}
|
|
2624
|
+
function SelectScrollDownButton(_a) {
|
|
2625
|
+
var _b = _a, {
|
|
2626
|
+
className
|
|
2627
|
+
} = _b, props = __objRest(_b, [
|
|
2628
|
+
"className"
|
|
2629
|
+
]);
|
|
2630
|
+
return /* @__PURE__ */ jsx24(
|
|
2631
|
+
SelectPrimitive.ScrollDownArrow,
|
|
2632
|
+
__spreadProps(__spreadValues({
|
|
2633
|
+
"data-slot": "select-scroll-down-button",
|
|
2634
|
+
className: cn17(
|
|
2635
|
+
"bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-3.5",
|
|
2636
|
+
className
|
|
2637
|
+
)
|
|
2638
|
+
}, props), {
|
|
2639
|
+
children: /* @__PURE__ */ jsx24(ChevronDownIcon2, {})
|
|
2640
|
+
})
|
|
2641
|
+
);
|
|
2642
|
+
}
|
|
2643
|
+
|
|
2644
|
+
// src/components/composed/data-table/table-header-filter.tsx
|
|
2645
|
+
import { Fragment as Fragment2, jsx as jsx25, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
2646
|
+
function smartFilterFn(row, columnId, filterValue) {
|
|
2647
|
+
var _a, _b, _c;
|
|
2648
|
+
if (filterValue === void 0 || filterValue === null || filterValue === "" || filterValue === "all") {
|
|
2649
|
+
return true;
|
|
2650
|
+
}
|
|
2651
|
+
const rowValue = row.getValue(columnId);
|
|
2652
|
+
if (rowValue === void 0 || rowValue === null) {
|
|
2653
|
+
return false;
|
|
2654
|
+
}
|
|
2655
|
+
if (typeof rowValue === "boolean" || filterValue === "true" || filterValue === "false") {
|
|
2656
|
+
const rowBool = typeof rowValue === "boolean" ? rowValue : String(rowValue).toLowerCase() === "true" || rowValue === 1 || rowValue === "1";
|
|
2657
|
+
const targetBool = String(filterValue).toLowerCase() === "true";
|
|
2658
|
+
return rowBool === targetBool;
|
|
2659
|
+
}
|
|
2660
|
+
const isFilterDateString = typeof filterValue === "string" && /^\d{4}-\d{2}-\d{2}/.test(filterValue);
|
|
2661
|
+
const isFilterDateObj = filterValue instanceof Date;
|
|
2662
|
+
if (isFilterDateString || isFilterDateObj) {
|
|
2663
|
+
const targetDateStr = isFilterDateObj ? format(filterValue, "yyyy-MM-dd") : filterValue.slice(0, 10);
|
|
2664
|
+
let rowDateStr = "";
|
|
2665
|
+
if (rowValue instanceof Date) {
|
|
2666
|
+
rowDateStr = format(rowValue, "yyyy-MM-dd");
|
|
2667
|
+
} else if (typeof rowValue === "string" || typeof rowValue === "number") {
|
|
2668
|
+
const parsed = new Date(rowValue);
|
|
2669
|
+
if (!Number.isNaN(parsed.getTime())) {
|
|
2670
|
+
rowDateStr = format(parsed, "yyyy-MM-dd");
|
|
2671
|
+
}
|
|
2672
|
+
}
|
|
2673
|
+
if (rowDateStr) {
|
|
2674
|
+
return rowDateStr === targetDateStr;
|
|
2675
|
+
}
|
|
2676
|
+
}
|
|
2677
|
+
if (Array.isArray(rowValue)) {
|
|
2678
|
+
const targetStr2 = String(filterValue).toLowerCase();
|
|
2679
|
+
return rowValue.some((item) => {
|
|
2680
|
+
var _a2, _b2, _c2;
|
|
2681
|
+
if (item === null || item === void 0) return false;
|
|
2682
|
+
const itemStr = typeof item === "object" ? String(
|
|
2683
|
+
(_c2 = (_b2 = (_a2 = item.name) != null ? _a2 : item.label) != null ? _b2 : item.email) != null ? _c2 : JSON.stringify(item)
|
|
2684
|
+
) : String(item);
|
|
2685
|
+
return itemStr.toLowerCase().includes(targetStr2);
|
|
2686
|
+
});
|
|
2687
|
+
}
|
|
2688
|
+
if (typeof rowValue === "object" && !(rowValue instanceof Date)) {
|
|
2689
|
+
const objStr = String(
|
|
2690
|
+
(_c = (_b = (_a = rowValue.name) != null ? _a : rowValue.label) != null ? _b : rowValue.email) != null ? _c : JSON.stringify(rowValue)
|
|
2691
|
+
);
|
|
2692
|
+
return objStr.toLowerCase().includes(String(filterValue).toLowerCase());
|
|
2693
|
+
}
|
|
2694
|
+
const rowStr = String(rowValue).toLowerCase();
|
|
2695
|
+
const targetStr = String(filterValue).toLowerCase();
|
|
2696
|
+
return rowStr.includes(targetStr);
|
|
2697
|
+
}
|
|
2698
|
+
function getColumnUniqueOptions(column, table) {
|
|
2699
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
2700
|
+
const meta = column.columnDef.meta;
|
|
2701
|
+
if ((meta == null ? void 0 : meta.selectOptions) && meta.selectOptions.length > 0) {
|
|
2702
|
+
return meta.selectOptions;
|
|
2703
|
+
}
|
|
2704
|
+
const rows = (_d = (_c = (_a = table.getCoreRowModel) == null ? void 0 : _a.call(table).rows) != null ? _c : (_b = table.getPreFilteredRowModel) == null ? void 0 : _b.call(table).rows) != null ? _d : [];
|
|
2705
|
+
const uniqueSet = /* @__PURE__ */ new Set();
|
|
2706
|
+
const labelMap = /* @__PURE__ */ new Map();
|
|
2707
|
+
for (const row of rows) {
|
|
2708
|
+
const value = row.getValue(column.id);
|
|
2709
|
+
if (value === null || value === void 0 || value === "") continue;
|
|
2710
|
+
if (typeof value === "boolean") {
|
|
2711
|
+
const str = String(value);
|
|
2712
|
+
if (!uniqueSet.has(str)) {
|
|
2713
|
+
uniqueSet.add(str);
|
|
2714
|
+
labelMap.set(str, value ? "True / Yes" : "False / No");
|
|
2715
|
+
}
|
|
2716
|
+
} else if (Array.isArray(value)) {
|
|
2717
|
+
for (const item of value) {
|
|
2718
|
+
if (item === null || item === void 0 || item === "") continue;
|
|
2719
|
+
const itemStr = typeof item === "object" ? String(
|
|
2720
|
+
(_g = (_f = (_e = item.name) != null ? _e : item.label) != null ? _f : item.email) != null ? _g : JSON.stringify(item)
|
|
2721
|
+
) : String(item);
|
|
2722
|
+
if (!uniqueSet.has(itemStr)) {
|
|
2723
|
+
uniqueSet.add(itemStr);
|
|
2724
|
+
labelMap.set(itemStr, itemStr);
|
|
2725
|
+
}
|
|
2726
|
+
}
|
|
2727
|
+
} else if (typeof value === "object") {
|
|
2728
|
+
const objStr = String(
|
|
2729
|
+
(_j = (_i = (_h = value.name) != null ? _h : value.label) != null ? _i : value.email) != null ? _j : JSON.stringify(value)
|
|
2730
|
+
);
|
|
2731
|
+
if (!uniqueSet.has(objStr)) {
|
|
2732
|
+
uniqueSet.add(objStr);
|
|
2733
|
+
labelMap.set(objStr, objStr);
|
|
2734
|
+
}
|
|
2735
|
+
} else {
|
|
2736
|
+
const str = String(value);
|
|
2737
|
+
if (!uniqueSet.has(str)) {
|
|
2738
|
+
uniqueSet.add(str);
|
|
2739
|
+
labelMap.set(str, str);
|
|
2740
|
+
}
|
|
2741
|
+
}
|
|
2742
|
+
if (uniqueSet.size >= 100) break;
|
|
2743
|
+
}
|
|
2744
|
+
return Array.from(uniqueSet).map((val) => {
|
|
2745
|
+
var _a2;
|
|
2746
|
+
return {
|
|
2747
|
+
value: String(val),
|
|
2748
|
+
label: String((_a2 = labelMap.get(val)) != null ? _a2 : val)
|
|
2749
|
+
};
|
|
2750
|
+
});
|
|
2751
|
+
}
|
|
2752
|
+
function getFilterVariant(column, table) {
|
|
2753
|
+
var _a, _b, _c, _d;
|
|
2754
|
+
const meta = column.columnDef.meta;
|
|
2755
|
+
if (meta == null ? void 0 : meta.filterVariant) return meta.filterVariant;
|
|
2756
|
+
const rows = (_d = (_c = (_a = table.getCoreRowModel) == null ? void 0 : _a.call(table).rows) != null ? _c : (_b = table.getPreFilteredRowModel) == null ? void 0 : _b.call(table).rows) != null ? _d : [];
|
|
2757
|
+
const sampleValues = [];
|
|
2758
|
+
for (const row of rows) {
|
|
2759
|
+
const val = row.getValue(column.id);
|
|
2760
|
+
if (val !== null && val !== void 0 && val !== "") {
|
|
2761
|
+
sampleValues.push(val);
|
|
2762
|
+
}
|
|
2763
|
+
if (sampleValues.length >= 100) break;
|
|
2764
|
+
}
|
|
2765
|
+
if (sampleValues.length === 0) return "text";
|
|
2766
|
+
const first = sampleValues[0];
|
|
2767
|
+
if (typeof first === "boolean" || sampleValues.every(
|
|
2768
|
+
(v) => typeof v === "boolean" || v === "true" || v === "false"
|
|
2769
|
+
)) {
|
|
2770
|
+
return "boolean";
|
|
2771
|
+
}
|
|
2772
|
+
if (first instanceof Date || typeof first === "string" && (first.match(/^\d{4}-\d{2}-\d{2}/) || !Number.isNaN(Date.parse(first)) && first.length >= 10 && (first.includes("-") || first.includes("/")))) {
|
|
2773
|
+
return "date";
|
|
2774
|
+
}
|
|
2775
|
+
const uniqueCount = new Set(sampleValues.map((v) => String(v))).size;
|
|
2776
|
+
if (uniqueCount > 0 && uniqueCount <= 20 && uniqueCount < sampleValues.length) {
|
|
2777
|
+
return "select";
|
|
2778
|
+
}
|
|
2779
|
+
return "text";
|
|
2780
|
+
}
|
|
2781
|
+
function ColumnFilterInput({
|
|
2782
|
+
column,
|
|
2783
|
+
table,
|
|
2784
|
+
headerText
|
|
2785
|
+
}) {
|
|
2786
|
+
const [calendarOpen, setCalendarOpen] = useState3(false);
|
|
2787
|
+
const filterValue = column.getFilterValue();
|
|
2788
|
+
const variant = useMemo2(
|
|
2789
|
+
() => getFilterVariant(column, table),
|
|
2790
|
+
[column, table]
|
|
2791
|
+
);
|
|
2792
|
+
const options = useMemo2(() => {
|
|
2793
|
+
if (variant === "boolean") {
|
|
2794
|
+
return [
|
|
2795
|
+
{ label: "True / Yes", value: "true" },
|
|
2796
|
+
{ label: "False / No", value: "false" }
|
|
2797
|
+
];
|
|
2798
|
+
}
|
|
2799
|
+
if (variant === "select") {
|
|
2800
|
+
return getColumnUniqueOptions(column, table);
|
|
2801
|
+
}
|
|
2802
|
+
return [];
|
|
2803
|
+
}, [column, table, variant]);
|
|
2804
|
+
if (variant === "boolean" || variant === "select") {
|
|
2805
|
+
const currentValue = filterValue === void 0 || filterValue === null || filterValue === "" ? "all" : String(filterValue);
|
|
2806
|
+
return /* @__PURE__ */ jsx25("div", { className: "relative flex items-center w-full", children: /* @__PURE__ */ jsxs16(
|
|
2807
|
+
Select,
|
|
2808
|
+
{
|
|
2809
|
+
value: currentValue,
|
|
2810
|
+
onValueChange: (val) => {
|
|
2811
|
+
if (val === "all") {
|
|
2812
|
+
column.setFilterValue(void 0);
|
|
2813
|
+
} else {
|
|
2814
|
+
column.setFilterValue(val);
|
|
2815
|
+
}
|
|
2816
|
+
},
|
|
2817
|
+
children: [
|
|
2818
|
+
/* @__PURE__ */ jsx25(
|
|
2819
|
+
SelectTrigger,
|
|
2820
|
+
{
|
|
2821
|
+
className: "w-full",
|
|
2822
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
2823
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
2824
|
+
children: /* @__PURE__ */ jsx25(
|
|
2825
|
+
SelectValue,
|
|
2826
|
+
{
|
|
2827
|
+
placeholder: `Select ${headerText.toLowerCase()}...`,
|
|
2828
|
+
className: "capitalize"
|
|
2829
|
+
}
|
|
2830
|
+
)
|
|
2831
|
+
}
|
|
2832
|
+
),
|
|
2833
|
+
/* @__PURE__ */ jsxs16(SelectContent, { align: "start", children: [
|
|
2834
|
+
/* @__PURE__ */ jsx25(SelectItem, { value: "all", children: "All" }),
|
|
2835
|
+
options.map((opt) => /* @__PURE__ */ jsx25(
|
|
2836
|
+
SelectItem,
|
|
2837
|
+
{
|
|
2838
|
+
value: opt.value,
|
|
2839
|
+
className: "capitalize",
|
|
2840
|
+
children: opt.label
|
|
2841
|
+
},
|
|
2842
|
+
opt.value
|
|
2843
|
+
))
|
|
2844
|
+
] })
|
|
2845
|
+
]
|
|
2846
|
+
}
|
|
2847
|
+
) });
|
|
2848
|
+
}
|
|
2849
|
+
if (variant === "date") {
|
|
2850
|
+
let dateObj;
|
|
2851
|
+
if (filterValue) {
|
|
2852
|
+
if (filterValue instanceof Date) {
|
|
2853
|
+
dateObj = filterValue;
|
|
2854
|
+
} else if (typeof filterValue === "string") {
|
|
2855
|
+
const parsed = new Date(filterValue);
|
|
2856
|
+
if (!Number.isNaN(parsed.getTime())) {
|
|
2857
|
+
dateObj = parsed;
|
|
2858
|
+
}
|
|
2859
|
+
}
|
|
2860
|
+
}
|
|
2861
|
+
const formattedDateLabel = dateObj ? format(dateObj, "yyyy-MM-dd") : "";
|
|
2862
|
+
return /* @__PURE__ */ jsx25("div", { className: "relative flex items-center w-full", children: /* @__PURE__ */ jsxs16(Popover, { open: calendarOpen, onOpenChange: setCalendarOpen, children: [
|
|
2863
|
+
/* @__PURE__ */ jsx25(
|
|
2864
|
+
PopoverTrigger,
|
|
2865
|
+
{
|
|
2866
|
+
render: /* @__PURE__ */ jsxs16(
|
|
2867
|
+
Button,
|
|
2868
|
+
{
|
|
2869
|
+
variant: "outline",
|
|
2870
|
+
className: cn14(
|
|
2871
|
+
"w-full justify-start",
|
|
2872
|
+
!formattedDateLabel && "text-muted-foreground"
|
|
2873
|
+
),
|
|
2874
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
2875
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
2876
|
+
children: [
|
|
2877
|
+
/* @__PURE__ */ jsx25(CalendarIcon, { className: "mr-1 size-3 shrink-0" }),
|
|
2878
|
+
/* @__PURE__ */ jsx25("span", { className: "truncate", children: formattedDateLabel || `Pick ${headerText.toLowerCase()}...` })
|
|
2879
|
+
]
|
|
2880
|
+
}
|
|
2881
|
+
)
|
|
2882
|
+
}
|
|
2883
|
+
),
|
|
2884
|
+
/* @__PURE__ */ jsx25(
|
|
2885
|
+
PopoverContent,
|
|
2886
|
+
{
|
|
2887
|
+
className: "w-auto p-0",
|
|
2888
|
+
align: "start",
|
|
2889
|
+
onPointerDown: (e) => e.stopPropagation(),
|
|
2890
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
2891
|
+
children: /* @__PURE__ */ jsx25(
|
|
2892
|
+
Calendar,
|
|
2893
|
+
{
|
|
2894
|
+
mode: "single",
|
|
2895
|
+
selected: dateObj,
|
|
2896
|
+
onSelect: (date) => {
|
|
2897
|
+
if (date) {
|
|
2898
|
+
column.setFilterValue(format(date, "yyyy-MM-dd"));
|
|
2899
|
+
} else {
|
|
2900
|
+
column.setFilterValue(void 0);
|
|
2901
|
+
}
|
|
2902
|
+
setCalendarOpen(false);
|
|
2903
|
+
}
|
|
2904
|
+
}
|
|
2905
|
+
)
|
|
2906
|
+
}
|
|
2907
|
+
)
|
|
2908
|
+
] }) });
|
|
2909
|
+
}
|
|
2910
|
+
return /* @__PURE__ */ jsx25("div", { className: "relative flex items-center w-full", children: /* @__PURE__ */ jsx25(
|
|
2911
|
+
Input,
|
|
2912
|
+
{
|
|
2913
|
+
id: `filter-${column.id}`,
|
|
2914
|
+
placeholder: `Filter ${headerText.toLowerCase()}...`,
|
|
2915
|
+
value: filterValue != null ? filterValue : "",
|
|
2916
|
+
onChange: (e) => column.setFilterValue(e.target.value || void 0),
|
|
2917
|
+
onKeyDown: (e) => e.stopPropagation(),
|
|
2918
|
+
onKeyUp: (e) => e.stopPropagation(),
|
|
2919
|
+
onPointerDown: (e) => e.stopPropagation()
|
|
2920
|
+
}
|
|
2921
|
+
) });
|
|
2922
|
+
}
|
|
2923
|
+
function DataTableHeaderFilter({
|
|
2924
|
+
table,
|
|
2925
|
+
columnFilters
|
|
2926
|
+
}) {
|
|
2927
|
+
const filterableColumns = useMemo2(
|
|
2928
|
+
() => table.getAllColumns().filter(
|
|
2929
|
+
(column) => typeof column.accessorFn !== "undefined" && column.getCanFilter()
|
|
2930
|
+
),
|
|
2931
|
+
[table]
|
|
2932
|
+
);
|
|
2933
|
+
if (filterableColumns.length === 0) return null;
|
|
2934
|
+
return /* @__PURE__ */ jsxs16(DropdownMenu, { children: [
|
|
2935
|
+
/* @__PURE__ */ jsxs16(Tooltip, { children: [
|
|
2936
|
+
/* @__PURE__ */ jsx25(
|
|
2937
|
+
DropdownMenuTrigger,
|
|
2938
|
+
{
|
|
2939
|
+
render: /* @__PURE__ */ jsx25(
|
|
2940
|
+
TooltipTrigger,
|
|
2941
|
+
{
|
|
2942
|
+
render: /* @__PURE__ */ jsx25(
|
|
2943
|
+
Button,
|
|
2944
|
+
{
|
|
2945
|
+
variant: columnFilters.length > 0 ? "secondary" : "outline",
|
|
2946
|
+
size: "icon",
|
|
2947
|
+
children: /* @__PURE__ */ jsx25(ListFilterIcon, {})
|
|
2948
|
+
}
|
|
2949
|
+
)
|
|
2950
|
+
}
|
|
2951
|
+
)
|
|
2952
|
+
}
|
|
2953
|
+
),
|
|
2954
|
+
/* @__PURE__ */ jsx25(TooltipContent, { children: "Filter options" })
|
|
2955
|
+
] }),
|
|
2956
|
+
/* @__PURE__ */ jsx25(DropdownMenuContent, { align: "end", className: "w-80", children: /* @__PURE__ */ jsxs16(DropdownMenuGroup, { children: [
|
|
2957
|
+
/* @__PURE__ */ jsx25(DropdownMenuLabel, { children: "Filter by column" }),
|
|
2958
|
+
/* @__PURE__ */ jsx25(DropdownMenuSeparator, {}),
|
|
2959
|
+
/* @__PURE__ */ jsx25("div", { className: "max-h-64 overflow-y-auto space-y-2.5 p-1", children: filterableColumns.map((column) => {
|
|
2960
|
+
const headerText = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
|
|
2961
|
+
return /* @__PURE__ */ jsxs16(
|
|
2962
|
+
"div",
|
|
2963
|
+
{
|
|
2964
|
+
className: "flex items-center justify-between px-1",
|
|
2965
|
+
children: [
|
|
2966
|
+
/* @__PURE__ */ jsx25(
|
|
2967
|
+
"label",
|
|
2968
|
+
{
|
|
2969
|
+
htmlFor: `filter-${column.id}`,
|
|
2970
|
+
className: "capitalize shrink-0 min-w-20 text-xs font-medium text-muted-foreground",
|
|
2971
|
+
children: headerText
|
|
2972
|
+
}
|
|
2973
|
+
),
|
|
2974
|
+
/* @__PURE__ */ jsx25("div", { className: "flex-1", children: /* @__PURE__ */ jsx25(
|
|
2975
|
+
ColumnFilterInput,
|
|
2976
|
+
{
|
|
2977
|
+
column,
|
|
2978
|
+
table,
|
|
2979
|
+
headerText
|
|
2980
|
+
}
|
|
2981
|
+
) })
|
|
2982
|
+
]
|
|
2983
|
+
},
|
|
2984
|
+
column.id
|
|
2985
|
+
);
|
|
2986
|
+
}) }),
|
|
2987
|
+
columnFilters.length > 0 && /* @__PURE__ */ jsxs16(Fragment2, { children: [
|
|
2988
|
+
/* @__PURE__ */ jsx25(DropdownMenuSeparator, {}),
|
|
2989
|
+
/* @__PURE__ */ jsx25(
|
|
2990
|
+
DropdownMenuItem,
|
|
2991
|
+
{
|
|
2992
|
+
className: "hover:cursor-pointer text-destructive focus:text-destructive",
|
|
2993
|
+
onClick: () => table.resetColumnFilters(),
|
|
2994
|
+
children: "Clear Filters"
|
|
2995
|
+
}
|
|
2996
|
+
)
|
|
2997
|
+
] })
|
|
2998
|
+
] }) })
|
|
2999
|
+
] });
|
|
3000
|
+
}
|
|
3001
|
+
|
|
3002
|
+
// src/components/composed/data-table/table-header-refresh.tsx
|
|
3003
|
+
import { RotateCwIcon } from "lucide-react";
|
|
3004
|
+
import { useRouter } from "next/navigation";
|
|
3005
|
+
import { useState as useState4 } from "react";
|
|
3006
|
+
import { jsx as jsx26, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
3007
|
+
function DataTableHeaderRefresh({
|
|
3008
|
+
onRefresh
|
|
3009
|
+
}) {
|
|
3010
|
+
const router = useRouter();
|
|
3011
|
+
const [isRefreshing, setIsRefreshing] = useState4(false);
|
|
3012
|
+
const handleRefresh = () => {
|
|
3013
|
+
setIsRefreshing(true);
|
|
3014
|
+
if (onRefresh) {
|
|
3015
|
+
onRefresh();
|
|
3016
|
+
} else {
|
|
3017
|
+
router.refresh();
|
|
3018
|
+
}
|
|
3019
|
+
setTimeout(() => {
|
|
3020
|
+
setIsRefreshing(false);
|
|
3021
|
+
}, 750);
|
|
3022
|
+
};
|
|
3023
|
+
return /* @__PURE__ */ jsxs17(Tooltip, { children: [
|
|
3024
|
+
/* @__PURE__ */ jsx26(
|
|
3025
|
+
TooltipTrigger,
|
|
3026
|
+
{
|
|
3027
|
+
render: /* @__PURE__ */ jsx26(
|
|
3028
|
+
Button,
|
|
3029
|
+
{
|
|
3030
|
+
variant: "outline",
|
|
3031
|
+
size: "icon",
|
|
3032
|
+
onClick: handleRefresh,
|
|
3033
|
+
disabled: isRefreshing,
|
|
3034
|
+
children: /* @__PURE__ */ jsx26(
|
|
3035
|
+
RotateCwIcon,
|
|
3036
|
+
{
|
|
3037
|
+
className: cn14(
|
|
3038
|
+
"transition-transform duration-750",
|
|
3039
|
+
isRefreshing && "animate-spin"
|
|
3040
|
+
)
|
|
3041
|
+
}
|
|
3042
|
+
)
|
|
3043
|
+
}
|
|
3044
|
+
)
|
|
3045
|
+
}
|
|
3046
|
+
),
|
|
3047
|
+
/* @__PURE__ */ jsx26(TooltipContent, { children: "Refresh data" })
|
|
3048
|
+
] });
|
|
3049
|
+
}
|
|
3050
|
+
|
|
3051
|
+
// src/components/composed/data-table/table-header-search.tsx
|
|
3052
|
+
import { XIcon as XIcon2 } from "lucide-react";
|
|
3053
|
+
import { jsx as jsx27, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
3054
|
+
function DataTableHeaderSearch({
|
|
3055
|
+
value,
|
|
3056
|
+
onChange,
|
|
3057
|
+
placeholder = "Search..."
|
|
3058
|
+
}) {
|
|
3059
|
+
return /* @__PURE__ */ jsxs18("div", { className: "relative flex items-center max-w-sm w-full", children: [
|
|
3060
|
+
/* @__PURE__ */ jsx27(
|
|
3061
|
+
Input,
|
|
3062
|
+
{
|
|
3063
|
+
placeholder,
|
|
3064
|
+
value,
|
|
3065
|
+
onChange: (event) => onChange(event.target.value),
|
|
3066
|
+
className: "pr-7"
|
|
3067
|
+
}
|
|
3068
|
+
),
|
|
3069
|
+
value && /* @__PURE__ */ jsx27(
|
|
3070
|
+
"button",
|
|
3071
|
+
{
|
|
3072
|
+
type: "button",
|
|
3073
|
+
onClick: () => onChange(""),
|
|
3074
|
+
className: "absolute right-2 text-muted-foreground hover:text-foreground p-0.5 rounded cursor-pointer",
|
|
3075
|
+
"aria-label": "Clear search text",
|
|
3076
|
+
children: /* @__PURE__ */ jsx27(XIcon2, { className: "size-3.5" })
|
|
3077
|
+
}
|
|
3078
|
+
)
|
|
3079
|
+
] });
|
|
3080
|
+
}
|
|
3081
|
+
|
|
3082
|
+
// src/components/composed/data-table/table-header-sort.tsx
|
|
3083
|
+
import { ArrowDownIcon as ArrowDownIcon2, ArrowUpDownIcon as ArrowUpDownIcon2, ArrowUpIcon as ArrowUpIcon2 } from "lucide-react";
|
|
3084
|
+
import { Fragment as Fragment3, jsx as jsx28, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
3085
|
+
function DataTableHeaderSort({
|
|
3086
|
+
table,
|
|
3087
|
+
sorting
|
|
3088
|
+
}) {
|
|
3089
|
+
const sortableColumns = table.getAllColumns().filter((column) => column.getCanSort());
|
|
3090
|
+
return /* @__PURE__ */ jsxs19(DropdownMenu, { children: [
|
|
3091
|
+
/* @__PURE__ */ jsxs19(Tooltip, { children: [
|
|
3092
|
+
/* @__PURE__ */ jsx28(
|
|
3093
|
+
DropdownMenuTrigger,
|
|
3094
|
+
{
|
|
3095
|
+
render: /* @__PURE__ */ jsx28(
|
|
3096
|
+
TooltipTrigger,
|
|
3097
|
+
{
|
|
3098
|
+
render: /* @__PURE__ */ jsx28(
|
|
3099
|
+
Button,
|
|
3100
|
+
{
|
|
3101
|
+
variant: sorting.length > 0 ? "secondary" : "outline",
|
|
3102
|
+
size: "icon",
|
|
3103
|
+
children: /* @__PURE__ */ jsx28(ArrowUpDownIcon2, {})
|
|
3104
|
+
}
|
|
3105
|
+
)
|
|
3106
|
+
}
|
|
3107
|
+
)
|
|
3108
|
+
}
|
|
3109
|
+
),
|
|
3110
|
+
/* @__PURE__ */ jsx28(TooltipContent, { children: "Sort options" })
|
|
3111
|
+
] }),
|
|
3112
|
+
/* @__PURE__ */ jsx28(DropdownMenuContent, { align: "end", className: "w-48", children: /* @__PURE__ */ jsxs19(DropdownMenuGroup, { children: [
|
|
3113
|
+
/* @__PURE__ */ jsx28(DropdownMenuLabel, { children: "Sort by column" }),
|
|
3114
|
+
/* @__PURE__ */ jsx28(DropdownMenuSeparator, {}),
|
|
3115
|
+
sortableColumns.map((column) => {
|
|
3116
|
+
const isSorted = column.getIsSorted();
|
|
3117
|
+
const headerText = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
|
|
3118
|
+
return /* @__PURE__ */ jsxs19(
|
|
3119
|
+
DropdownMenuItem,
|
|
3120
|
+
{
|
|
3121
|
+
className: "flex items-center justify-between hover:cursor-pointer capitalize",
|
|
3122
|
+
onClick: () => {
|
|
3123
|
+
if (isSorted === "asc") {
|
|
3124
|
+
column.toggleSorting(true);
|
|
3125
|
+
} else if (isSorted === "desc") {
|
|
3126
|
+
column.clearSorting();
|
|
3127
|
+
} else {
|
|
3128
|
+
column.toggleSorting(false);
|
|
3129
|
+
}
|
|
3130
|
+
},
|
|
3131
|
+
children: [
|
|
3132
|
+
/* @__PURE__ */ jsx28("span", { children: headerText }),
|
|
3133
|
+
isSorted === "asc" && /* @__PURE__ */ jsx28(ArrowUpIcon2, { className: "size-3.5" }),
|
|
3134
|
+
isSorted === "desc" && /* @__PURE__ */ jsx28(ArrowDownIcon2, { className: "size-3.5" })
|
|
3135
|
+
]
|
|
3136
|
+
},
|
|
3137
|
+
column.id
|
|
3138
|
+
);
|
|
3139
|
+
}),
|
|
3140
|
+
sorting.length > 0 && /* @__PURE__ */ jsxs19(Fragment3, { children: [
|
|
3141
|
+
/* @__PURE__ */ jsx28(DropdownMenuSeparator, {}),
|
|
3142
|
+
/* @__PURE__ */ jsx28(
|
|
3143
|
+
DropdownMenuItem,
|
|
3144
|
+
{
|
|
3145
|
+
className: "hover:cursor-pointer text-destructive focus:text-destructive",
|
|
3146
|
+
onClick: () => table.resetSorting(),
|
|
3147
|
+
children: "Clear Sorting"
|
|
3148
|
+
}
|
|
3149
|
+
)
|
|
3150
|
+
] })
|
|
3151
|
+
] }) })
|
|
3152
|
+
] });
|
|
3153
|
+
}
|
|
3154
|
+
|
|
3155
|
+
// src/components/composed/data-table/table-header-toggle.tsx
|
|
3156
|
+
import { Columns3CogIcon } from "lucide-react";
|
|
3157
|
+
import { jsx as jsx29, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
3158
|
+
function DataTableHeaderToggle({
|
|
3159
|
+
table
|
|
3160
|
+
}) {
|
|
3161
|
+
return /* @__PURE__ */ jsxs20(DropdownMenu, { children: [
|
|
3162
|
+
/* @__PURE__ */ jsxs20(Tooltip, { children: [
|
|
3163
|
+
/* @__PURE__ */ jsx29(
|
|
3164
|
+
DropdownMenuTrigger,
|
|
3165
|
+
{
|
|
3166
|
+
render: /* @__PURE__ */ jsx29(
|
|
3167
|
+
TooltipTrigger,
|
|
3168
|
+
{
|
|
3169
|
+
render: /* @__PURE__ */ jsx29(Button, { variant: "outline", size: "icon", children: /* @__PURE__ */ jsx29(Columns3CogIcon, {}) })
|
|
3170
|
+
}
|
|
3171
|
+
)
|
|
3172
|
+
}
|
|
3173
|
+
),
|
|
3174
|
+
/* @__PURE__ */ jsx29(TooltipContent, { children: "Toggle columns" })
|
|
3175
|
+
] }),
|
|
3176
|
+
/* @__PURE__ */ jsx29(DropdownMenuContent, { align: "end", className: "w-48", children: /* @__PURE__ */ jsxs20(DropdownMenuGroup, { children: [
|
|
3177
|
+
/* @__PURE__ */ jsx29(DropdownMenuLabel, { children: "Toggle columns" }),
|
|
3178
|
+
/* @__PURE__ */ jsx29(DropdownMenuSeparator, {}),
|
|
3179
|
+
table.getAllColumns().filter(
|
|
3180
|
+
(column) => typeof column.accessorFn !== "undefined" && column.getCanHide()
|
|
3181
|
+
).map((column) => {
|
|
3182
|
+
const headerText = typeof column.columnDef.header === "string" ? column.columnDef.header : column.id;
|
|
3183
|
+
return /* @__PURE__ */ jsx29(
|
|
3184
|
+
DropdownMenuCheckboxItem,
|
|
3185
|
+
{
|
|
3186
|
+
className: "capitalize hover:cursor-pointer",
|
|
3187
|
+
checked: column.getIsVisible(),
|
|
3188
|
+
onCheckedChange: (value) => column.toggleVisibility(!!value),
|
|
3189
|
+
children: headerText
|
|
3190
|
+
},
|
|
3191
|
+
column.id
|
|
3192
|
+
);
|
|
3193
|
+
})
|
|
3194
|
+
] }) })
|
|
3195
|
+
] });
|
|
3196
|
+
}
|
|
3197
|
+
|
|
3198
|
+
// src/components/composed/data-table/data-row-actions.tsx
|
|
3199
|
+
import { MoreHorizontal } from "lucide-react";
|
|
3200
|
+
import { Fragment as Fragment4 } from "react";
|
|
3201
|
+
import { Fragment as Fragment5, jsx as jsx30, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
3202
|
+
function RowActions({
|
|
3203
|
+
label = "Actions",
|
|
3204
|
+
items = [],
|
|
3205
|
+
triggerIcon,
|
|
3206
|
+
triggerLabel = "Open action menu",
|
|
3207
|
+
align = "end",
|
|
3208
|
+
containerClassName,
|
|
3209
|
+
contentClassName
|
|
3210
|
+
}) {
|
|
3211
|
+
const visibleItems = items.filter((item) => !item.hidden);
|
|
3212
|
+
if (visibleItems.length === 0) {
|
|
3213
|
+
return null;
|
|
3214
|
+
}
|
|
3215
|
+
return /* @__PURE__ */ jsx30(
|
|
3216
|
+
"div",
|
|
3217
|
+
{
|
|
3218
|
+
className: cn14("flex items-center justify-end w-full", containerClassName),
|
|
3219
|
+
children: /* @__PURE__ */ jsxs21(DropdownMenu, { children: [
|
|
3220
|
+
/* @__PURE__ */ jsx30(
|
|
3221
|
+
DropdownMenuTrigger,
|
|
3222
|
+
{
|
|
3223
|
+
render: /* @__PURE__ */ jsx30(Button, { variant: "ghost", size: "icon-xs", "aria-label": triggerLabel, children: triggerIcon != null ? triggerIcon : /* @__PURE__ */ jsx30(MoreHorizontal, { className: "size-4" }) })
|
|
3224
|
+
}
|
|
3225
|
+
),
|
|
3226
|
+
/* @__PURE__ */ jsx30(
|
|
3227
|
+
DropdownMenuContent,
|
|
3228
|
+
{
|
|
3229
|
+
align,
|
|
3230
|
+
className: cn14("w-40", contentClassName),
|
|
3231
|
+
children: /* @__PURE__ */ jsxs21(DropdownMenuGroup, { children: [
|
|
3232
|
+
label && /* @__PURE__ */ jsxs21(Fragment5, { children: [
|
|
3233
|
+
/* @__PURE__ */ jsx30(DropdownMenuLabel, { children: label }),
|
|
3234
|
+
/* @__PURE__ */ jsx30(DropdownMenuSeparator, {})
|
|
3235
|
+
] }),
|
|
3236
|
+
visibleItems.map((item, index) => {
|
|
3237
|
+
var _a;
|
|
3238
|
+
const itemKey = (_a = item.id) != null ? _a : `${item.label}-${index}`;
|
|
3239
|
+
const isDestructive = item.variant === "destructive";
|
|
3240
|
+
return /* @__PURE__ */ jsxs21(Fragment4, { children: [
|
|
3241
|
+
item.separatorBefore && /* @__PURE__ */ jsx30(DropdownMenuSeparator, {}),
|
|
3242
|
+
/* @__PURE__ */ jsxs21(
|
|
3243
|
+
DropdownMenuItem,
|
|
3244
|
+
{
|
|
3245
|
+
onClick: item.onClick,
|
|
3246
|
+
disabled: item.disabled,
|
|
3247
|
+
className: cn14(
|
|
3248
|
+
"hover:cursor-pointer flex items-center gap-2",
|
|
3249
|
+
isDestructive && "text-destructive focus:text-destructive",
|
|
3250
|
+
item.className
|
|
3251
|
+
),
|
|
3252
|
+
children: [
|
|
3253
|
+
item.icon && /* @__PURE__ */ jsx30("span", { className: "size-4 shrink-0 flex items-center justify-center", children: item.icon }),
|
|
3254
|
+
/* @__PURE__ */ jsx30("span", { children: item.label })
|
|
3255
|
+
]
|
|
3256
|
+
}
|
|
3257
|
+
),
|
|
3258
|
+
item.separatorAfter && /* @__PURE__ */ jsx30(DropdownMenuSeparator, {})
|
|
3259
|
+
] }, itemKey);
|
|
3260
|
+
})
|
|
3261
|
+
] })
|
|
3262
|
+
}
|
|
3263
|
+
)
|
|
3264
|
+
] })
|
|
3265
|
+
}
|
|
3266
|
+
);
|
|
3267
|
+
}
|
|
3268
|
+
|
|
3269
|
+
// src/components/composed/data-table/data-table.tsx
|
|
3270
|
+
import { jsx as jsx31, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
3271
|
+
function DataTable({
|
|
3272
|
+
columns,
|
|
3273
|
+
data,
|
|
3274
|
+
initialColumnVisibility,
|
|
3275
|
+
renderCreateDialog,
|
|
3276
|
+
addLabel,
|
|
3277
|
+
onRefresh,
|
|
3278
|
+
onDownload,
|
|
3279
|
+
exportFilename = "data-export",
|
|
3280
|
+
isLoading = false,
|
|
3281
|
+
searchPlaceholder = "Search...",
|
|
3282
|
+
showSearchInput = true,
|
|
3283
|
+
showRefreshButton = true,
|
|
3284
|
+
showSortButton = true,
|
|
3285
|
+
showFilterButton = true,
|
|
3286
|
+
showDownloadButton = true,
|
|
3287
|
+
showColumnToggleButton = true,
|
|
3288
|
+
showAddButton = true,
|
|
3289
|
+
emptyIcon,
|
|
3290
|
+
emptyTitle,
|
|
3291
|
+
emptyDescription,
|
|
3292
|
+
emptyButtonText,
|
|
3293
|
+
emptyRender,
|
|
3294
|
+
onEmptyAction,
|
|
3295
|
+
renderEmptyState
|
|
3296
|
+
}) {
|
|
3297
|
+
const [createOpen, setCreateOpen] = useState5(false);
|
|
3298
|
+
const [sorting, setSorting] = useState5([]);
|
|
3299
|
+
const [columnFilters, setColumnFilters] = useState5([]);
|
|
3300
|
+
const [columnVisibility, setColumnVisibility] = useState5(initialColumnVisibility != null ? initialColumnVisibility : {});
|
|
3301
|
+
const [globalFilter, setGlobalFilter] = useState5("");
|
|
3302
|
+
const columnsWithSmartFilters = useMemo3(() => {
|
|
3303
|
+
return columns.map((col) => __spreadValues({
|
|
3304
|
+
filterFn: smartFilterFn
|
|
3305
|
+
}, col));
|
|
3306
|
+
}, [columns]);
|
|
3307
|
+
const table = useTable({
|
|
3308
|
+
features,
|
|
3309
|
+
data,
|
|
3310
|
+
columns: columnsWithSmartFilters,
|
|
3311
|
+
onSortingChange: setSorting,
|
|
3312
|
+
onColumnFiltersChange: setColumnFilters,
|
|
3313
|
+
onColumnVisibilityChange: setColumnVisibility,
|
|
3314
|
+
onGlobalFilterChange: setGlobalFilter,
|
|
3315
|
+
state: { sorting, columnFilters, columnVisibility, globalFilter }
|
|
3316
|
+
});
|
|
3317
|
+
if (data.length === 0 && !isLoading) {
|
|
3318
|
+
if (renderEmptyState) {
|
|
3319
|
+
return /* @__PURE__ */ jsxs22("div", { className: "space-y-2", children: [
|
|
3320
|
+
renderEmptyState(),
|
|
3321
|
+
renderCreateDialog == null ? void 0 : renderCreateDialog(createOpen, setCreateOpen)
|
|
3322
|
+
] });
|
|
3323
|
+
}
|
|
3324
|
+
const defaultEmptyAction = renderCreateDialog ? () => setCreateOpen(true) : onRefresh != null ? onRefresh : void 0;
|
|
3325
|
+
return /* @__PURE__ */ jsxs22("div", { className: "space-y-2", children: [
|
|
3326
|
+
/* @__PURE__ */ jsx31(
|
|
3327
|
+
StateEmpty,
|
|
3328
|
+
{
|
|
3329
|
+
icon: emptyIcon != null ? emptyIcon : /* @__PURE__ */ jsx31(FolderOpenIcon, { className: "size-6 text-muted-foreground" }),
|
|
3330
|
+
title: emptyTitle != null ? emptyTitle : "No records found",
|
|
3331
|
+
description: emptyDescription != null ? emptyDescription : "There are currently no records available. Create a new record to get started.",
|
|
3332
|
+
buttonText: emptyButtonText != null ? emptyButtonText : renderCreateDialog ? addLabel != null ? addLabel : "Add Record" : onRefresh ? "Refresh" : void 0,
|
|
3333
|
+
onClick: onEmptyAction != null ? onEmptyAction : defaultEmptyAction,
|
|
3334
|
+
render: emptyRender
|
|
3335
|
+
}
|
|
3336
|
+
),
|
|
3337
|
+
renderCreateDialog == null ? void 0 : renderCreateDialog(createOpen, setCreateOpen)
|
|
3338
|
+
] });
|
|
3339
|
+
}
|
|
3340
|
+
return /* @__PURE__ */ jsxs22("div", { className: "space-y-2", children: [
|
|
3341
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-row items-center justify-between gap-1", children: [
|
|
3342
|
+
showSearchInput ? /* @__PURE__ */ jsx31(
|
|
3343
|
+
DataTableHeaderSearch,
|
|
3344
|
+
{
|
|
3345
|
+
value: globalFilter,
|
|
3346
|
+
onChange: setGlobalFilter,
|
|
3347
|
+
placeholder: searchPlaceholder
|
|
3348
|
+
}
|
|
3349
|
+
) : /* @__PURE__ */ jsx31("div", {}),
|
|
3350
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex flex-row items-center gap-1", children: [
|
|
3351
|
+
showRefreshButton && /* @__PURE__ */ jsx31(DataTableHeaderRefresh, { onRefresh }),
|
|
3352
|
+
showSortButton && /* @__PURE__ */ jsx31(DataTableHeaderSort, { table, sorting }),
|
|
3353
|
+
showFilterButton && /* @__PURE__ */ jsx31(
|
|
3354
|
+
DataTableHeaderFilter,
|
|
3355
|
+
{
|
|
3356
|
+
table,
|
|
3357
|
+
columnFilters
|
|
3358
|
+
}
|
|
3359
|
+
),
|
|
3360
|
+
showDownloadButton && /* @__PURE__ */ jsx31(
|
|
3361
|
+
DataTableHeaderDownload,
|
|
3362
|
+
{
|
|
3363
|
+
table,
|
|
3364
|
+
exportFilename,
|
|
3365
|
+
onDownload
|
|
3366
|
+
}
|
|
3367
|
+
),
|
|
3368
|
+
showColumnToggleButton && /* @__PURE__ */ jsx31(DataTableHeaderToggle, { table }),
|
|
3369
|
+
showAddButton && renderCreateDialog && /* @__PURE__ */ jsx31(
|
|
3370
|
+
DataTableHeaderAdd,
|
|
3371
|
+
{
|
|
3372
|
+
onAdd: () => setCreateOpen(true),
|
|
3373
|
+
addLabel
|
|
3374
|
+
}
|
|
3375
|
+
)
|
|
3376
|
+
] })
|
|
3377
|
+
] }),
|
|
3378
|
+
renderCreateDialog == null ? void 0 : renderCreateDialog(createOpen, setCreateOpen),
|
|
3379
|
+
/* @__PURE__ */ jsx31("div", { className: "overflow-hidden rounded-md border [&_[data-slot=table-container]]:no-scrollbar", children: /* @__PURE__ */ jsxs22(Table, { children: [
|
|
3380
|
+
/* @__PURE__ */ jsx31(DataTableContentHeader, { table }),
|
|
3381
|
+
/* @__PURE__ */ jsx31(
|
|
3382
|
+
DataTableContentBody,
|
|
3383
|
+
{
|
|
3384
|
+
table,
|
|
3385
|
+
columns,
|
|
3386
|
+
isLoading
|
|
3387
|
+
}
|
|
3388
|
+
)
|
|
3389
|
+
] }) }),
|
|
3390
|
+
/* @__PURE__ */ jsxs22("div", { className: "flex items-center justify-between px-2", children: [
|
|
3391
|
+
/* @__PURE__ */ jsx31(DataTableFooterEntries, { table }),
|
|
3392
|
+
/* @__PURE__ */ jsx31(DataTableFooterPagination, { table })
|
|
3393
|
+
] })
|
|
3394
|
+
] });
|
|
3395
|
+
}
|
|
3396
|
+
|
|
3397
|
+
// src/components/composed/header-tabs.tsx
|
|
3398
|
+
import Link2 from "next/link";
|
|
3399
|
+
import { usePathname as usePathname2 } from "next/navigation";
|
|
3400
|
+
import { memo as memo3 } from "react";
|
|
3401
|
+
|
|
3402
|
+
// src/components/ui/tabs.tsx
|
|
3403
|
+
import { Tabs as TabsPrimitive } from "@base-ui/react/tabs";
|
|
3404
|
+
import { cva as cva4 } from "class-variance-authority";
|
|
3405
|
+
import { cn as cn18 } from "cn";
|
|
3406
|
+
import { jsx as jsx32 } from "react/jsx-runtime";
|
|
3407
|
+
function Tabs(_a) {
|
|
3408
|
+
var _b = _a, {
|
|
3409
|
+
className,
|
|
3410
|
+
orientation = "horizontal"
|
|
3411
|
+
} = _b, props = __objRest(_b, [
|
|
3412
|
+
"className",
|
|
3413
|
+
"orientation"
|
|
3414
|
+
]);
|
|
3415
|
+
return /* @__PURE__ */ jsx32(
|
|
3416
|
+
TabsPrimitive.Root,
|
|
3417
|
+
__spreadValues({
|
|
3418
|
+
"data-slot": "tabs",
|
|
3419
|
+
"data-orientation": orientation,
|
|
3420
|
+
className: cn18(
|
|
3421
|
+
"group/tabs flex gap-2 data-horizontal:flex-col",
|
|
3422
|
+
className
|
|
3423
|
+
)
|
|
3424
|
+
}, props)
|
|
3425
|
+
);
|
|
3426
|
+
}
|
|
3427
|
+
var tabsListVariants = cva4(
|
|
3428
|
+
"group/tabs-list inline-flex w-fit items-center justify-center rounded-lg p-[3px] text-muted-foreground group-data-horizontal/tabs:h-8 group-data-vertical/tabs:h-fit group-data-vertical/tabs:flex-col data-[variant=line]:rounded-none",
|
|
3429
|
+
{
|
|
3430
|
+
variants: {
|
|
3431
|
+
variant: {
|
|
3432
|
+
default: "bg-muted",
|
|
3433
|
+
line: "gap-1 bg-transparent"
|
|
3434
|
+
}
|
|
3435
|
+
},
|
|
3436
|
+
defaultVariants: {
|
|
3437
|
+
variant: "default"
|
|
3438
|
+
}
|
|
3439
|
+
}
|
|
3440
|
+
);
|
|
3441
|
+
function TabsList(_a) {
|
|
3442
|
+
var _b = _a, {
|
|
3443
|
+
className,
|
|
3444
|
+
variant = "default"
|
|
3445
|
+
} = _b, props = __objRest(_b, [
|
|
3446
|
+
"className",
|
|
3447
|
+
"variant"
|
|
3448
|
+
]);
|
|
3449
|
+
return /* @__PURE__ */ jsx32(
|
|
3450
|
+
TabsPrimitive.List,
|
|
3451
|
+
__spreadValues({
|
|
3452
|
+
"data-slot": "tabs-list",
|
|
3453
|
+
"data-variant": variant,
|
|
3454
|
+
className: cn18(tabsListVariants({ variant }), className)
|
|
3455
|
+
}, props)
|
|
3456
|
+
);
|
|
3457
|
+
}
|
|
3458
|
+
function TabsTrigger(_a) {
|
|
3459
|
+
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
3460
|
+
return /* @__PURE__ */ jsx32(
|
|
3461
|
+
TabsPrimitive.Tab,
|
|
3462
|
+
__spreadValues({
|
|
3463
|
+
"data-slot": "tabs-trigger",
|
|
3464
|
+
className: cn18(
|
|
3465
|
+
"relative inline-flex h-[calc(100%-1px)] flex-1 items-center justify-center gap-1.5 rounded-md border border-transparent px-1.5 py-0.5 text-xs font-medium whitespace-nowrap text-foreground/60 transition-all group-data-vertical/tabs:w-full group-data-vertical/tabs:justify-start group-data-vertical/tabs:py-[calc(--spacing(1.25))] hover:text-foreground focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 focus-visible:outline-1 focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 has-data-[icon=inline-end]:pr-1 has-data-[icon=inline-start]:pl-1 aria-disabled:pointer-events-none aria-disabled:opacity-50 dark:text-muted-foreground dark:hover:text-foreground [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-3.5",
|
|
3466
|
+
"group-data-[variant=line]/tabs-list:bg-transparent group-data-[variant=line]/tabs-list:data-active:bg-transparent dark:group-data-[variant=line]/tabs-list:data-active:border-transparent dark:group-data-[variant=line]/tabs-list:data-active:bg-transparent",
|
|
3467
|
+
"data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground",
|
|
3468
|
+
"after:absolute after:bg-foreground after:opacity-0 after:transition-opacity group-data-horizontal/tabs:after:inset-x-0 group-data-horizontal/tabs:after:bottom-[-5px] group-data-horizontal/tabs:after:h-0.5 group-data-vertical/tabs:after:inset-y-0 group-data-vertical/tabs:after:-right-1 group-data-vertical/tabs:after:w-0.5 group-data-[variant=line]/tabs-list:data-active:after:opacity-100",
|
|
3469
|
+
className
|
|
3470
|
+
)
|
|
3471
|
+
}, props)
|
|
3472
|
+
);
|
|
3473
|
+
}
|
|
3474
|
+
|
|
3475
|
+
// src/components/composed/header-tabs.tsx
|
|
3476
|
+
import { jsx as jsx33, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
3477
|
+
function renderTabIcon(icon) {
|
|
3478
|
+
if (!icon) return null;
|
|
3479
|
+
if (typeof icon === "function" || typeof icon === "object" && icon !== null && "render" in icon) {
|
|
3480
|
+
const IconComp = icon;
|
|
3481
|
+
return /* @__PURE__ */ jsx33(IconComp, {});
|
|
3482
|
+
}
|
|
3483
|
+
return icon;
|
|
3484
|
+
}
|
|
3485
|
+
var HeaderTabs = memo3(function HeaderTabs2({
|
|
3486
|
+
items,
|
|
3487
|
+
value,
|
|
3488
|
+
onValueChange,
|
|
3489
|
+
children
|
|
3490
|
+
}) {
|
|
3491
|
+
var _a, _b;
|
|
3492
|
+
const pathname = usePathname2();
|
|
3493
|
+
const matchedItem = pathname ? items.find(
|
|
3494
|
+
(item) => item.url === pathname || pathname.endsWith(item.url) || pathname.split("/").includes(item.value)
|
|
3495
|
+
) : void 0;
|
|
3496
|
+
const activeTab = (_b = value != null ? value : matchedItem == null ? void 0 : matchedItem.value) != null ? _b : (_a = items[0]) == null ? void 0 : _a.value;
|
|
3497
|
+
return /* @__PURE__ */ jsxs23(Tabs, { value: activeTab, onValueChange, className: "space-y-4", children: [
|
|
3498
|
+
/* @__PURE__ */ jsx33("div", { className: "w-full overflow-x-auto overflow-y-hidden border-b no-scrollbar", children: /* @__PURE__ */ jsx33(TabsList, { variant: "line", className: "inline-flex w-max justify-start", children: items.map(({ title, value: tabValue, url, icon }) => /* @__PURE__ */ jsxs23(
|
|
3499
|
+
TabsTrigger,
|
|
3500
|
+
{
|
|
3501
|
+
nativeButton: false,
|
|
3502
|
+
render: /* @__PURE__ */ jsx33(Link2, { href: url }),
|
|
3503
|
+
value: tabValue,
|
|
3504
|
+
children: [
|
|
3505
|
+
renderTabIcon(icon),
|
|
3506
|
+
title
|
|
3507
|
+
]
|
|
3508
|
+
},
|
|
3509
|
+
tabValue
|
|
3510
|
+
)) }) }),
|
|
3511
|
+
children
|
|
3512
|
+
] });
|
|
3513
|
+
});
|
|
3514
|
+
|
|
3515
|
+
// src/components/composed/header-title.tsx
|
|
3516
|
+
import { memo as memo4 } from "react";
|
|
3517
|
+
import { jsx as jsx34, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
3518
|
+
var HeaderTitle = memo4(function HeaderTitle2({
|
|
1531
3519
|
title,
|
|
1532
3520
|
subtitle,
|
|
1533
3521
|
children
|
|
1534
3522
|
}) {
|
|
1535
|
-
return /* @__PURE__ */
|
|
1536
|
-
/* @__PURE__ */
|
|
1537
|
-
/* @__PURE__ */
|
|
1538
|
-
/* @__PURE__ */
|
|
3523
|
+
return /* @__PURE__ */ jsxs24("div", { className: "w-full space-y-4", children: [
|
|
3524
|
+
/* @__PURE__ */ jsxs24("div", { children: [
|
|
3525
|
+
/* @__PURE__ */ jsx34("h1", { className: "font-semibold", children: title }),
|
|
3526
|
+
/* @__PURE__ */ jsx34("p", { className: "text-xs text-muted-foreground", children: subtitle })
|
|
1539
3527
|
] }),
|
|
1540
3528
|
children
|
|
1541
3529
|
] });
|
|
1542
3530
|
});
|
|
1543
3531
|
export {
|
|
1544
3532
|
AppSidebar,
|
|
3533
|
+
DataTable,
|
|
3534
|
+
DataTableContentBody,
|
|
3535
|
+
DataTableContentHeader,
|
|
3536
|
+
DataTableFooterEntries,
|
|
3537
|
+
DataTableFooterPagination,
|
|
3538
|
+
DataTableHeaderAdd,
|
|
3539
|
+
DataTableHeaderDownload,
|
|
3540
|
+
DataTableHeaderFilter,
|
|
3541
|
+
DataTableHeaderRefresh,
|
|
3542
|
+
DataTableHeaderSearch,
|
|
3543
|
+
DataTableHeaderSort,
|
|
3544
|
+
DataTableHeaderToggle,
|
|
1545
3545
|
HeaderTabs,
|
|
1546
|
-
HeaderTitle
|
|
3546
|
+
HeaderTitle,
|
|
3547
|
+
RowActions,
|
|
3548
|
+
StateEmpty,
|
|
3549
|
+
exportToCSV,
|
|
3550
|
+
exportToXLSX,
|
|
3551
|
+
features,
|
|
3552
|
+
flexRender3 as flexRender,
|
|
3553
|
+
getTableExportData,
|
|
3554
|
+
printTable,
|
|
3555
|
+
smartFilterFn,
|
|
3556
|
+
useTable
|
|
1547
3557
|
};
|