@prediktif/ui 0.1.18 → 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 +273 -8
- package/dist/index.d.ts +273 -8
- package/dist/index.js +2018 -161
- package/dist/index.mjs +2033 -160
- 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,155 +1481,28 @@ 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 Tabs(_a) {
|
|
1420
|
-
var _b = _a, {
|
|
1421
|
-
className,
|
|
1422
|
-
orientation = "horizontal"
|
|
1423
|
-
} = _b, props = __objRest(_b, [
|
|
1424
|
-
"className",
|
|
1425
|
-
"orientation"
|
|
1426
|
-
]);
|
|
1427
|
-
return /* @__PURE__ */ jsx13(
|
|
1428
|
-
TabsPrimitive.Root,
|
|
1429
|
-
__spreadValues({
|
|
1430
|
-
"data-slot": "tabs",
|
|
1431
|
-
"data-orientation": orientation,
|
|
1432
|
-
className: cn12(
|
|
1433
|
-
"group/tabs flex gap-2 data-horizontal:flex-col",
|
|
1434
|
-
className
|
|
1435
|
-
)
|
|
1436
|
-
}, props)
|
|
1437
|
-
);
|
|
1438
|
-
}
|
|
1439
|
-
var tabsListVariants = cva3(
|
|
1440
|
-
"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",
|
|
1441
|
-
{
|
|
1442
|
-
variants: {
|
|
1443
|
-
variant: {
|
|
1444
|
-
default: "bg-muted",
|
|
1445
|
-
line: "gap-1 bg-transparent"
|
|
1446
|
-
}
|
|
1447
|
-
},
|
|
1448
|
-
defaultVariants: {
|
|
1449
|
-
variant: "default"
|
|
1450
|
-
}
|
|
1451
|
-
}
|
|
1452
|
-
);
|
|
1453
|
-
function TabsList(_a) {
|
|
1454
|
-
var _b = _a, {
|
|
1455
|
-
className,
|
|
1456
|
-
variant = "default"
|
|
1457
|
-
} = _b, props = __objRest(_b, [
|
|
1458
|
-
"className",
|
|
1459
|
-
"variant"
|
|
1460
|
-
]);
|
|
1461
|
-
return /* @__PURE__ */ jsx13(
|
|
1462
|
-
TabsPrimitive.List,
|
|
1463
|
-
__spreadValues({
|
|
1464
|
-
"data-slot": "tabs-list",
|
|
1465
|
-
"data-variant": variant,
|
|
1466
|
-
className: cn12(tabsListVariants({ variant }), className)
|
|
1467
|
-
}, props)
|
|
1468
|
-
);
|
|
1469
|
-
}
|
|
1470
|
-
function TabsTrigger(_a) {
|
|
1471
|
-
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1472
|
-
return /* @__PURE__ */ jsx13(
|
|
1473
|
-
TabsPrimitive.Tab,
|
|
1474
|
-
__spreadValues({
|
|
1475
|
-
"data-slot": "tabs-trigger",
|
|
1476
|
-
className: cn12(
|
|
1477
|
-
"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",
|
|
1478
|
-
"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",
|
|
1479
|
-
"data-active:bg-background data-active:text-foreground dark:data-active:border-input dark:data-active:bg-input/30 dark:data-active:text-foreground",
|
|
1480
|
-
"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",
|
|
1481
|
-
className
|
|
1482
|
-
)
|
|
1483
|
-
}, props)
|
|
1484
|
-
);
|
|
1485
|
-
}
|
|
1486
|
-
|
|
1487
|
-
// src/components/composed/header-tabs.tsx
|
|
1488
|
-
import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1489
|
-
function renderTabIcon(icon) {
|
|
1490
|
-
if (!icon) return null;
|
|
1491
|
-
if (typeof icon === "function" || typeof icon === "object" && icon !== null && "render" in icon) {
|
|
1492
|
-
const IconComp = icon;
|
|
1493
|
-
return /* @__PURE__ */ jsx14(IconComp, {});
|
|
1494
|
-
}
|
|
1495
|
-
return icon;
|
|
1496
|
-
}
|
|
1497
|
-
var HeaderTabs = memo2(function HeaderTabs2({
|
|
1498
|
-
items,
|
|
1499
|
-
value,
|
|
1500
|
-
onValueChange,
|
|
1501
|
-
children
|
|
1502
|
-
}) {
|
|
1503
|
-
var _a, _b;
|
|
1504
|
-
const pathname = usePathname2();
|
|
1505
|
-
const matchedItem = pathname ? items.find(
|
|
1506
|
-
(item) => item.url === pathname || pathname.endsWith(item.url) || pathname.split("/").includes(item.value)
|
|
1507
|
-
) : void 0;
|
|
1508
|
-
const activeTab = (_b = value != null ? value : matchedItem == null ? void 0 : matchedItem.value) != null ? _b : (_a = items[0]) == null ? void 0 : _a.value;
|
|
1509
|
-
return /* @__PURE__ */ jsxs8(Tabs, { value: activeTab, onValueChange, className: "space-y-4", children: [
|
|
1510
|
-
/* @__PURE__ */ jsx14("div", { className: "w-full overflow-x-auto overflow-y-hidden border-b no-scrollbar", children: /* @__PURE__ */ jsx14(TabsList, { variant: "line", className: "inline-flex w-max justify-start", children: items.map(({ title, value: tabValue, url, icon }) => /* @__PURE__ */ jsxs8(
|
|
1511
|
-
TabsTrigger,
|
|
1512
|
-
{
|
|
1513
|
-
nativeButton: false,
|
|
1514
|
-
render: /* @__PURE__ */ jsx14(Link2, { href: url }),
|
|
1515
|
-
value: tabValue,
|
|
1516
|
-
children: [
|
|
1517
|
-
renderTabIcon(icon),
|
|
1518
|
-
title
|
|
1519
|
-
]
|
|
1520
|
-
},
|
|
1521
|
-
tabValue
|
|
1522
|
-
)) }) }),
|
|
1523
|
-
children
|
|
1524
|
-
] });
|
|
1525
|
-
});
|
|
1526
|
-
|
|
1527
|
-
// src/components/composed/header-title.tsx
|
|
1528
|
-
import { memo as memo3 } from "react";
|
|
1529
|
-
import { jsx as jsx15, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
1530
|
-
var HeaderTitle = memo3(function HeaderTitle2({
|
|
1531
|
-
title,
|
|
1532
|
-
subtitle,
|
|
1533
|
-
children
|
|
1534
|
-
}) {
|
|
1535
|
-
return /* @__PURE__ */ jsxs9("div", { className: "w-full space-y-4", children: [
|
|
1536
|
-
/* @__PURE__ */ jsxs9("div", { children: [
|
|
1537
|
-
/* @__PURE__ */ jsx15("h1", { className: "font-semibold", children: title }),
|
|
1538
|
-
/* @__PURE__ */ jsx15("p", { className: "text-xs text-muted-foreground", children: subtitle })
|
|
1539
|
-
] }),
|
|
1540
|
-
children
|
|
1541
|
-
] });
|
|
1542
|
-
});
|
|
1543
|
-
|
|
1544
|
-
// src/components/composed/state-empty.tsx
|
|
1545
|
-
import { memo as memo4 } from "react";
|
|
1546
|
-
|
|
1547
|
-
// src/components/ui/empty.tsx
|
|
1548
|
-
import { cva as cva4 } from "class-variance-authority";
|
|
1549
|
-
import { cn as cn13 } from "cn";
|
|
1550
|
-
import { jsx as jsx16 } from "react/jsx-runtime";
|
|
1551
1499
|
function Empty(_a) {
|
|
1552
1500
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1553
|
-
return /* @__PURE__ */
|
|
1501
|
+
return /* @__PURE__ */ jsx13(
|
|
1554
1502
|
"div",
|
|
1555
1503
|
__spreadValues({
|
|
1556
1504
|
"data-slot": "empty",
|
|
1557
|
-
className:
|
|
1505
|
+
className: cn12(
|
|
1558
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",
|
|
1559
1507
|
className
|
|
1560
1508
|
)
|
|
@@ -1563,15 +1511,15 @@ function Empty(_a) {
|
|
|
1563
1511
|
}
|
|
1564
1512
|
function EmptyHeader(_a) {
|
|
1565
1513
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1566
|
-
return /* @__PURE__ */
|
|
1514
|
+
return /* @__PURE__ */ jsx13(
|
|
1567
1515
|
"div",
|
|
1568
1516
|
__spreadValues({
|
|
1569
1517
|
"data-slot": "empty-header",
|
|
1570
|
-
className:
|
|
1518
|
+
className: cn12("flex max-w-sm flex-col items-center gap-1", className)
|
|
1571
1519
|
}, props)
|
|
1572
1520
|
);
|
|
1573
1521
|
}
|
|
1574
|
-
var emptyMediaVariants =
|
|
1522
|
+
var emptyMediaVariants = cva3(
|
|
1575
1523
|
"mb-2 flex shrink-0 items-center justify-center [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
1576
1524
|
{
|
|
1577
1525
|
variants: {
|
|
@@ -1593,22 +1541,22 @@ function EmptyMedia(_a) {
|
|
|
1593
1541
|
"className",
|
|
1594
1542
|
"variant"
|
|
1595
1543
|
]);
|
|
1596
|
-
return /* @__PURE__ */
|
|
1544
|
+
return /* @__PURE__ */ jsx13(
|
|
1597
1545
|
"div",
|
|
1598
1546
|
__spreadValues({
|
|
1599
1547
|
"data-slot": "empty-icon",
|
|
1600
1548
|
"data-variant": variant,
|
|
1601
|
-
className:
|
|
1549
|
+
className: cn12(emptyMediaVariants({ variant, className }))
|
|
1602
1550
|
}, props)
|
|
1603
1551
|
);
|
|
1604
1552
|
}
|
|
1605
1553
|
function EmptyTitle(_a) {
|
|
1606
1554
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1607
|
-
return /* @__PURE__ */
|
|
1555
|
+
return /* @__PURE__ */ jsx13(
|
|
1608
1556
|
"div",
|
|
1609
1557
|
__spreadValues({
|
|
1610
1558
|
"data-slot": "empty-title",
|
|
1611
|
-
className:
|
|
1559
|
+
className: cn12(
|
|
1612
1560
|
"font-heading text-sm font-medium tracking-tight",
|
|
1613
1561
|
className
|
|
1614
1562
|
)
|
|
@@ -1617,11 +1565,11 @@ function EmptyTitle(_a) {
|
|
|
1617
1565
|
}
|
|
1618
1566
|
function EmptyDescription(_a) {
|
|
1619
1567
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1620
|
-
return /* @__PURE__ */
|
|
1568
|
+
return /* @__PURE__ */ jsx13(
|
|
1621
1569
|
"div",
|
|
1622
1570
|
__spreadValues({
|
|
1623
1571
|
"data-slot": "empty-description",
|
|
1624
|
-
className:
|
|
1572
|
+
className: cn12(
|
|
1625
1573
|
"text-xs/relaxed text-muted-foreground [&>a]:underline [&>a]:underline-offset-4 [&>a:hover]:text-primary",
|
|
1626
1574
|
className
|
|
1627
1575
|
)
|
|
@@ -1630,11 +1578,11 @@ function EmptyDescription(_a) {
|
|
|
1630
1578
|
}
|
|
1631
1579
|
function EmptyContent(_a) {
|
|
1632
1580
|
var _b = _a, { className } = _b, props = __objRest(_b, ["className"]);
|
|
1633
|
-
return /* @__PURE__ */
|
|
1581
|
+
return /* @__PURE__ */ jsx13(
|
|
1634
1582
|
"div",
|
|
1635
1583
|
__spreadValues({
|
|
1636
1584
|
"data-slot": "empty-content",
|
|
1637
|
-
className:
|
|
1585
|
+
className: cn12(
|
|
1638
1586
|
"flex w-full max-w-sm min-w-0 flex-col items-center gap-2 text-xs/relaxed text-balance",
|
|
1639
1587
|
className
|
|
1640
1588
|
)
|
|
@@ -1643,42 +1591,1967 @@ function EmptyContent(_a) {
|
|
|
1643
1591
|
}
|
|
1644
1592
|
|
|
1645
1593
|
// src/components/composed/state-empty.tsx
|
|
1646
|
-
import { jsx as
|
|
1594
|
+
import { jsx as jsx14, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
1647
1595
|
function renderStateIcon(icon) {
|
|
1648
1596
|
if (typeof icon === "function" || typeof icon === "object" && icon !== null && "render" in icon) {
|
|
1649
1597
|
const IconComp = icon;
|
|
1650
|
-
return /* @__PURE__ */
|
|
1598
|
+
return /* @__PURE__ */ jsx14(IconComp, {});
|
|
1651
1599
|
}
|
|
1652
1600
|
return icon;
|
|
1653
1601
|
}
|
|
1654
|
-
var StateEmpty =
|
|
1602
|
+
var StateEmpty = memo2(function StateEmpty2({
|
|
1655
1603
|
icon,
|
|
1656
1604
|
title,
|
|
1657
1605
|
description,
|
|
1658
1606
|
buttonText,
|
|
1607
|
+
onClick,
|
|
1659
1608
|
render
|
|
1660
1609
|
}) {
|
|
1661
|
-
|
|
1662
|
-
|
|
1663
|
-
|
|
1664
|
-
/* @__PURE__ */
|
|
1665
|
-
/* @__PURE__ */
|
|
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 })
|
|
1666
1616
|
] }),
|
|
1667
|
-
/* @__PURE__ */
|
|
1617
|
+
hasAction && /* @__PURE__ */ jsx14(EmptyContent, { children: /* @__PURE__ */ jsx14(
|
|
1668
1618
|
Button,
|
|
1669
1619
|
{
|
|
1670
1620
|
variant: "outline",
|
|
1671
1621
|
size: "sm",
|
|
1672
1622
|
nativeButton: !render,
|
|
1623
|
+
onClick,
|
|
1673
1624
|
render,
|
|
1674
1625
|
children: buttonText
|
|
1675
1626
|
}
|
|
1676
1627
|
) })
|
|
1677
1628
|
] });
|
|
1678
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}`,
|
|
1828
|
+
children: [
|
|
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" })
|
|
1834
|
+
]
|
|
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."
|
|
1865
|
+
] });
|
|
1866
|
+
}
|
|
1867
|
+
|
|
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({
|
|
3519
|
+
title,
|
|
3520
|
+
subtitle,
|
|
3521
|
+
children
|
|
3522
|
+
}) {
|
|
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 })
|
|
3527
|
+
] }),
|
|
3528
|
+
children
|
|
3529
|
+
] });
|
|
3530
|
+
});
|
|
1679
3531
|
export {
|
|
1680
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,
|
|
1681
3545
|
HeaderTabs,
|
|
1682
3546
|
HeaderTitle,
|
|
1683
|
-
|
|
3547
|
+
RowActions,
|
|
3548
|
+
StateEmpty,
|
|
3549
|
+
exportToCSV,
|
|
3550
|
+
exportToXLSX,
|
|
3551
|
+
features,
|
|
3552
|
+
flexRender3 as flexRender,
|
|
3553
|
+
getTableExportData,
|
|
3554
|
+
printTable,
|
|
3555
|
+
smartFilterFn,
|
|
3556
|
+
useTable
|
|
1684
3557
|
};
|