@campminder/ds 0.1.0 → 0.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,6 +1,6 @@
1
1
  "use client";
2
2
  import { Accordion as Accordion$1 } from '@base-ui/react/accordion';
3
- import { ChevronDown, CheckIcon, ChevronRightIcon, MoreHorizontalIcon, Loader2, ChevronDownIcon, ChevronUpIcon, XIcon, PlusIcon, SearchIcon, Check, Circle, ChevronRight, PencilIcon, TrashIcon, ArrowLeftIcon, ArrowRightIcon, ChevronLeftIcon, ChevronsUpDown, CameraIcon, PanelLeftIcon, Loader2Icon, OctagonXIcon, TriangleAlertIcon, InfoIcon, CircleCheckIcon, BadgeCheck, AlertTriangleIcon } from 'lucide-react';
3
+ import { ChevronDown, CheckIcon, ChevronRightIcon, MoreHorizontalIcon, Loader2, ChevronDownIcon, ChevronUpIcon, XIcon, PlusIcon, Columns3, Search, GripVertical, X, SearchIcon, ChevronLeft, ChevronRight, Check, Circle, ListFilter, PencilIcon, TrashIcon, ArrowLeftIcon, ArrowRightIcon, ChevronLeftIcon, ChevronsUpDown, CameraIcon, PanelLeftIcon, Loader2Icon, OctagonXIcon, TriangleAlertIcon, InfoIcon, CircleCheckIcon, BadgeCheck, ChevronUp, AlertTriangleIcon } from 'lucide-react';
4
4
  import { clsx } from 'clsx';
5
5
  import { twMerge } from 'tailwind-merge';
6
6
  import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
@@ -10,13 +10,14 @@ import { useRender } from '@base-ui/react/use-render';
10
10
  import { cva } from 'class-variance-authority';
11
11
  import { Button as Button$1 } from '@base-ui/react/button';
12
12
  import * as React3 from 'react';
13
- import { useEffect, useMemo, useState, useRef, useLayoutEffect } from 'react';
13
+ import { useEffect, useState, useMemo, useRef, useLayoutEffect } from 'react';
14
14
  import { useForm, Controller } from 'react-hook-form';
15
15
  import { zodResolver } from '@hookform/resolvers/zod';
16
16
  import { z } from 'zod';
17
17
  import { Input as Input$1 } from '@base-ui/react/input';
18
18
  import { Select as Select$1 } from '@base-ui/react/select';
19
19
  import { Checkbox as Checkbox$1 } from '@base-ui/react/checkbox';
20
+ import { Popover as Popover$1 } from '@base-ui/react/popover';
20
21
  import { Command as Command$1 } from 'cmdk';
21
22
  import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
22
23
  import { Menu } from '@base-ui/react/menu';
@@ -25,9 +26,10 @@ import RPNInput, { getCountryCallingCode } from 'react-phone-number-input';
25
26
  export { getCountries, isValidPhoneNumber } from 'react-phone-number-input';
26
27
  import flags from 'react-phone-number-input/flags';
27
28
  import en from 'react-phone-number-input/locale/en.json';
28
- import { Popover as Popover$1 } from '@base-ui/react/popover';
29
29
  import { ScrollArea as ScrollArea$1 } from '@base-ui/react/scroll-area';
30
30
  import { Progress as Progress$1 } from '@base-ui/react/progress';
31
+ import { RadioGroup as RadioGroup$1 } from '@base-ui/react/radio-group';
32
+ import { Radio } from '@base-ui/react/radio';
31
33
  import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
32
34
  import { Toaster as Toaster$1 } from 'sonner';
33
35
  import { Switch as Switch$1 } from '@base-ui/react/switch';
@@ -1175,6 +1177,397 @@ function Checkbox({ className, ...props }) {
1175
1177
  }
1176
1178
  );
1177
1179
  }
1180
+ function Popover({ ...props }) {
1181
+ return /* @__PURE__ */ jsx(Popover$1.Root, { "data-slot": "popover", ...props });
1182
+ }
1183
+ function PopoverTrigger({ ...props }) {
1184
+ return /* @__PURE__ */ jsx(Popover$1.Trigger, { "data-slot": "popover-trigger", ...props });
1185
+ }
1186
+ function PopoverContent({
1187
+ className,
1188
+ align = "center",
1189
+ alignOffset = 0,
1190
+ side = "bottom",
1191
+ sideOffset = 4,
1192
+ ...props
1193
+ }) {
1194
+ return /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(
1195
+ Popover$1.Positioner,
1196
+ {
1197
+ align,
1198
+ alignOffset,
1199
+ side,
1200
+ sideOffset,
1201
+ className: "isolate z-50",
1202
+ children: /* @__PURE__ */ jsx(
1203
+ Popover$1.Popup,
1204
+ {
1205
+ "data-slot": "popover-content",
1206
+ className: cn(
1207
+ "z-50 flex w-72 origin-(--transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm 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",
1208
+ className
1209
+ ),
1210
+ ...props
1211
+ }
1212
+ )
1213
+ }
1214
+ ) });
1215
+ }
1216
+ function PopoverHeader({ className, ...props }) {
1217
+ return /* @__PURE__ */ jsx(
1218
+ "div",
1219
+ {
1220
+ "data-slot": "popover-header",
1221
+ className: cn("flex flex-col gap-0.5 text-sm", className),
1222
+ ...props
1223
+ }
1224
+ );
1225
+ }
1226
+ function PopoverTitle({ className, ...props }) {
1227
+ return /* @__PURE__ */ jsx(
1228
+ Popover$1.Title,
1229
+ {
1230
+ "data-slot": "popover-title",
1231
+ className: cn("font-medium", className),
1232
+ ...props
1233
+ }
1234
+ );
1235
+ }
1236
+ function PopoverDescription({
1237
+ className,
1238
+ ...props
1239
+ }) {
1240
+ return /* @__PURE__ */ jsx(
1241
+ Popover$1.Description,
1242
+ {
1243
+ "data-slot": "popover-description",
1244
+ className: cn("text-muted-foreground", className),
1245
+ ...props
1246
+ }
1247
+ );
1248
+ }
1249
+ var ALL_GROUPS = "__all__";
1250
+ function ColumnCustomizer({
1251
+ columns,
1252
+ value,
1253
+ onApply,
1254
+ groupOrder,
1255
+ title = "Customize columns",
1256
+ searchPlaceholder = "Search for a column",
1257
+ allGroupsLabel = "All columns",
1258
+ align = "end",
1259
+ trigger
1260
+ }) {
1261
+ const [open, setOpen] = useState(false);
1262
+ const [draft, setDraft] = useState(value);
1263
+ const [query, setQuery] = useState("");
1264
+ const [group, setGroup] = useState(ALL_GROUPS);
1265
+ const [dragIndex, setDragIndex] = useState(null);
1266
+ const q = query.trim().toLowerCase();
1267
+ const searching = q !== "";
1268
+ const labelFor = useMemo(() => {
1269
+ const m = /* @__PURE__ */ new Map();
1270
+ for (const c of columns) m.set(c.key, c.label);
1271
+ return m;
1272
+ }, [columns]);
1273
+ const groupKeys = useMemo(() => {
1274
+ if (groupOrder?.length) return groupOrder;
1275
+ const seen = [];
1276
+ for (const c of columns) if (!seen.includes(c.group)) seen.push(c.group);
1277
+ return seen;
1278
+ }, [columns, groupOrder]);
1279
+ const groups = useMemo(
1280
+ () => [
1281
+ { key: ALL_GROUPS, label: allGroupsLabel, count: columns.length },
1282
+ ...groupKeys.map((g) => ({
1283
+ key: g,
1284
+ label: g,
1285
+ count: columns.filter((c) => c.group === g).length
1286
+ }))
1287
+ ],
1288
+ [columns, groupKeys, allGroupsLabel]
1289
+ );
1290
+ const handleOpenChange = (next) => {
1291
+ if (next) {
1292
+ setDraft(value);
1293
+ setQuery("");
1294
+ setGroup(ALL_GROUPS);
1295
+ }
1296
+ setOpen(next);
1297
+ };
1298
+ const toggle = (k) => setDraft(
1299
+ (cur) => cur.includes(k) ? cur.filter((c) => c !== k) : [...cur, k]
1300
+ );
1301
+ const remove = (k) => setDraft((cur) => cur.filter((c) => c !== k));
1302
+ const reorder = (from, to) => setDraft((cur) => {
1303
+ const next = [...cur];
1304
+ const [moved] = next.splice(from, 1);
1305
+ next.splice(to, 0, moved);
1306
+ return next;
1307
+ });
1308
+ const visibleCols = useMemo(() => {
1309
+ const base = searching || group === ALL_GROUPS ? columns : columns.filter((c) => c.group === group);
1310
+ return searching ? base.filter((c) => c.label.toLowerCase().includes(q)) : base;
1311
+ }, [columns, q, group, searching]);
1312
+ const showSource = searching || group === ALL_GROUPS;
1313
+ const allChecked = visibleCols.length > 0 && visibleCols.every((c) => draft.includes(c.key));
1314
+ const toggleAll = () => setDraft(
1315
+ (cur) => allChecked ? cur.filter((k) => !visibleCols.some((c) => c.key === k)) : [
1316
+ ...cur,
1317
+ ...visibleCols.map((c) => c.key).filter((k) => !cur.includes(k))
1318
+ ]
1319
+ );
1320
+ const activeGroupLabel = groups.find((g) => g.key === group)?.label;
1321
+ return /* @__PURE__ */ jsxs(Popover, { open, onOpenChange: handleOpenChange, children: [
1322
+ trigger ? /* @__PURE__ */ jsx(PopoverTrigger, { render: trigger }) : /* @__PURE__ */ jsxs(
1323
+ PopoverTrigger,
1324
+ {
1325
+ type: "button",
1326
+ className: cn(
1327
+ buttonVariants({ variant: "outline" }),
1328
+ "h-9 gap-1.5 text-muted-foreground"
1329
+ ),
1330
+ children: [
1331
+ /* @__PURE__ */ jsx(Columns3, { className: "size-4" }),
1332
+ "Columns"
1333
+ ]
1334
+ }
1335
+ ),
1336
+ /* @__PURE__ */ jsxs(
1337
+ PopoverContent,
1338
+ {
1339
+ align,
1340
+ className: "w-[720px] max-w-[calc(100vw-2rem)] gap-0 p-0",
1341
+ children: [
1342
+ /* @__PURE__ */ jsx(PopoverTitle, { className: "px-4 pt-4 pb-3 text-sm font-semibold", children: title }),
1343
+ /* @__PURE__ */ jsx("div", { className: "px-4 pb-3", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
1344
+ /* @__PURE__ */ jsx(Search, { className: "absolute top-1/2 left-3 size-4 -translate-y-1/2 text-muted-foreground" }),
1345
+ /* @__PURE__ */ jsx(
1346
+ Input,
1347
+ {
1348
+ value: query,
1349
+ onChange: (e) => setQuery(e.target.value),
1350
+ placeholder: searchPlaceholder,
1351
+ "aria-label": searchPlaceholder,
1352
+ className: "h-10 pl-9"
1353
+ }
1354
+ )
1355
+ ] }) }),
1356
+ /* @__PURE__ */ jsxs("div", { className: "grid h-[380px] grid-cols-[12rem_1fr_16rem] border-y", children: [
1357
+ /* @__PURE__ */ jsx("div", { className: "overflow-y-auto border-r p-2", children: groups.map((gr) => /* @__PURE__ */ jsxs(
1358
+ "button",
1359
+ {
1360
+ type: "button",
1361
+ disabled: searching,
1362
+ onClick: () => setGroup(gr.key),
1363
+ className: cn(
1364
+ "flex w-full items-center justify-between gap-2 rounded-md px-3 py-2 text-left text-sm hover:bg-muted/60",
1365
+ !searching && group === gr.key && "bg-muted font-medium",
1366
+ searching && "opacity-40"
1367
+ ),
1368
+ children: [
1369
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: gr.label }),
1370
+ /* @__PURE__ */ jsx("span", { className: "shrink-0 rounded-md bg-muted px-1.5 text-xs tabular-nums text-muted-foreground", children: gr.count })
1371
+ ]
1372
+ },
1373
+ gr.key
1374
+ )) }),
1375
+ /* @__PURE__ */ jsxs("div", { className: "min-w-0 overflow-y-auto p-3", children: [
1376
+ /* @__PURE__ */ jsx("div", { className: "px-1 pb-1 text-sm font-semibold", children: searching ? "Search results" : activeGroupLabel }),
1377
+ !searching && visibleCols.length > 0 && /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-center gap-2.5 border-b px-1 py-2 text-sm", children: [
1378
+ /* @__PURE__ */ jsx(
1379
+ Checkbox,
1380
+ {
1381
+ checked: allChecked,
1382
+ onCheckedChange: () => toggleAll()
1383
+ }
1384
+ ),
1385
+ /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Select all" })
1386
+ ] }),
1387
+ /* @__PURE__ */ jsx("div", { className: "pt-1", children: visibleCols.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "px-1 py-6 text-center text-sm text-muted-foreground", children: [
1388
+ "No columns match \u201C",
1389
+ query,
1390
+ "\u201D."
1391
+ ] }) : visibleCols.map((c) => /* @__PURE__ */ jsxs(
1392
+ "label",
1393
+ {
1394
+ className: "flex cursor-pointer items-center gap-2.5 rounded-md px-1 py-2 text-sm hover:bg-muted/60",
1395
+ children: [
1396
+ /* @__PURE__ */ jsx(
1397
+ Checkbox,
1398
+ {
1399
+ checked: draft.includes(c.key),
1400
+ onCheckedChange: () => toggle(c.key)
1401
+ }
1402
+ ),
1403
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: c.label }),
1404
+ showSource && /* @__PURE__ */ jsx("span", { className: "shrink-0 text-[11px] text-muted-foreground", children: c.group })
1405
+ ]
1406
+ },
1407
+ c.key
1408
+ )) })
1409
+ ] }),
1410
+ /* @__PURE__ */ jsxs("div", { className: "flex min-w-0 flex-col border-l", children: [
1411
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between px-3 py-2.5", children: [
1412
+ /* @__PURE__ */ jsxs("span", { className: "text-sm font-semibold", children: [
1413
+ draft.length,
1414
+ " selected"
1415
+ ] }),
1416
+ draft.length > 0 && /* @__PURE__ */ jsx(
1417
+ "button",
1418
+ {
1419
+ type: "button",
1420
+ onClick: () => setDraft([]),
1421
+ className: "text-xs font-medium text-primary hover:underline",
1422
+ children: "Clear all"
1423
+ }
1424
+ )
1425
+ ] }),
1426
+ /* @__PURE__ */ jsx("div", { className: "flex-1 space-y-1.5 overflow-y-auto px-3 pb-3", children: draft.length === 0 ? /* @__PURE__ */ jsx("div", { className: "px-1 py-6 text-center text-sm text-muted-foreground", children: "No columns selected." }) : draft.map((k, i) => /* @__PURE__ */ jsxs(
1427
+ "div",
1428
+ {
1429
+ draggable: true,
1430
+ onDragStart: () => setDragIndex(i),
1431
+ onDragOver: (e) => e.preventDefault(),
1432
+ onDrop: () => {
1433
+ if (dragIndex !== null && dragIndex !== i)
1434
+ reorder(dragIndex, i);
1435
+ setDragIndex(null);
1436
+ },
1437
+ onDragEnd: () => setDragIndex(null),
1438
+ className: cn(
1439
+ "flex items-center gap-2 rounded-md border bg-background px-2.5 py-2 text-sm",
1440
+ dragIndex === i && "opacity-50"
1441
+ ),
1442
+ children: [
1443
+ /* @__PURE__ */ jsx(GripVertical, { className: "size-3.5 shrink-0 cursor-grab text-muted-foreground" }),
1444
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: labelFor.get(k) ?? k }),
1445
+ /* @__PURE__ */ jsx(
1446
+ "button",
1447
+ {
1448
+ type: "button",
1449
+ onClick: () => remove(k),
1450
+ "aria-label": `Remove ${labelFor.get(k) ?? k}`,
1451
+ className: "shrink-0 rounded-sm p-0.5 text-muted-foreground hover:text-foreground",
1452
+ children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
1453
+ }
1454
+ )
1455
+ ]
1456
+ },
1457
+ k
1458
+ )) })
1459
+ ] })
1460
+ ] }),
1461
+ /* @__PURE__ */ jsxs("div", { className: "flex justify-end gap-2 px-4 py-3", children: [
1462
+ /* @__PURE__ */ jsx(Button, { variant: "outline", onClick: () => setOpen(false), children: "Cancel" }),
1463
+ /* @__PURE__ */ jsx(
1464
+ Button,
1465
+ {
1466
+ onClick: () => {
1467
+ onApply(draft);
1468
+ setOpen(false);
1469
+ },
1470
+ children: "Apply"
1471
+ }
1472
+ )
1473
+ ] })
1474
+ ]
1475
+ }
1476
+ )
1477
+ ] });
1478
+ }
1479
+ function ColumnPicker({
1480
+ columns,
1481
+ value,
1482
+ onChange,
1483
+ title = "Columns",
1484
+ searchPlaceholder = "Search columns",
1485
+ align = "end",
1486
+ trigger
1487
+ }) {
1488
+ const [query, setQuery] = useState("");
1489
+ const q = query.trim().toLowerCase();
1490
+ const visible = useMemo(() => new Set(value), [value]);
1491
+ const filtered = useMemo(
1492
+ () => q ? columns.filter((c) => c.label.toLowerCase().includes(q)) : columns,
1493
+ [columns, q]
1494
+ );
1495
+ const emit = (next) => onChange(columns.filter((c) => next.has(c.key)).map((c) => c.key));
1496
+ const toggle = (key) => {
1497
+ const next = new Set(visible);
1498
+ if (next.has(key)) next.delete(key);
1499
+ else next.add(key);
1500
+ emit(next);
1501
+ };
1502
+ const allChecked = filtered.length > 0 && filtered.every((c) => visible.has(c.key));
1503
+ const toggleAll = () => {
1504
+ const next = new Set(visible);
1505
+ for (const c of filtered) {
1506
+ if (allChecked) next.delete(c.key);
1507
+ else next.add(c.key);
1508
+ }
1509
+ emit(next);
1510
+ };
1511
+ return /* @__PURE__ */ jsxs(Popover, { children: [
1512
+ trigger ? /* @__PURE__ */ jsx(PopoverTrigger, { render: trigger }) : /* @__PURE__ */ jsxs(
1513
+ PopoverTrigger,
1514
+ {
1515
+ type: "button",
1516
+ className: cn(
1517
+ buttonVariants({ variant: "outline" }),
1518
+ "h-9 gap-1.5 text-muted-foreground"
1519
+ ),
1520
+ children: [
1521
+ /* @__PURE__ */ jsx(Columns3, { className: "size-4" }),
1522
+ "Columns"
1523
+ ]
1524
+ }
1525
+ ),
1526
+ /* @__PURE__ */ jsxs(PopoverContent, { align, className: "w-72 gap-0 p-0", children: [
1527
+ /* @__PURE__ */ jsx(PopoverTitle, { className: "px-3 pt-3 pb-2 text-sm font-semibold", children: title }),
1528
+ /* @__PURE__ */ jsx("div", { className: "px-3 pb-2", children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
1529
+ /* @__PURE__ */ jsx(Search, { className: "absolute top-1/2 left-3 size-4 -translate-y-1/2 text-muted-foreground" }),
1530
+ /* @__PURE__ */ jsx(
1531
+ Input,
1532
+ {
1533
+ value: query,
1534
+ onChange: (e) => setQuery(e.target.value),
1535
+ placeholder: searchPlaceholder,
1536
+ "aria-label": searchPlaceholder,
1537
+ className: "h-9 pl-9"
1538
+ }
1539
+ )
1540
+ ] }) }),
1541
+ /* @__PURE__ */ jsx("div", { className: "max-h-[320px] overflow-y-auto border-t px-1.5 py-1.5", children: filtered.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "px-2 py-6 text-center text-sm text-muted-foreground", children: [
1542
+ "No columns match \u201C",
1543
+ query,
1544
+ "\u201D."
1545
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
1546
+ /* @__PURE__ */ jsxs("label", { className: "flex cursor-pointer items-center gap-2.5 rounded-md px-2 py-2 text-sm hover:bg-muted/60", children: [
1547
+ /* @__PURE__ */ jsx(Checkbox, { checked: allChecked, onCheckedChange: () => toggleAll() }),
1548
+ /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: "Select all" })
1549
+ ] }),
1550
+ filtered.map((c) => /* @__PURE__ */ jsxs(
1551
+ "label",
1552
+ {
1553
+ className: "flex cursor-pointer items-center gap-2.5 rounded-md px-2 py-2 text-sm hover:bg-muted/60",
1554
+ children: [
1555
+ /* @__PURE__ */ jsx(
1556
+ Checkbox,
1557
+ {
1558
+ checked: visible.has(c.key),
1559
+ onCheckedChange: () => toggle(c.key)
1560
+ }
1561
+ ),
1562
+ /* @__PURE__ */ jsx("span", { className: "min-w-0 flex-1 truncate", children: c.label })
1563
+ ]
1564
+ },
1565
+ c.key
1566
+ ))
1567
+ ] }) })
1568
+ ] })
1569
+ ] });
1570
+ }
1178
1571
  function Dialog({ ...props }) {
1179
1572
  return /* @__PURE__ */ jsx(Dialog$1.Root, { "data-slot": "dialog", ...props });
1180
1573
  }
@@ -1269,7 +1662,7 @@ function DialogFooter({
1269
1662
  {
1270
1663
  "data-slot": "dialog-footer",
1271
1664
  className: cn(
1272
- "-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t bg-muted/50 p-4 sm:flex-row sm:justify-end",
1665
+ "-mx-4 -mb-4 flex flex-col-reverse gap-2 rounded-b-xl border-t border-border bg-muted/50 p-4 sm:flex-row sm:justify-end",
1273
1666
  className
1274
1667
  ),
1275
1668
  ...props,
@@ -1608,85 +2001,528 @@ function CommandShortcut({
1608
2001
  }
1609
2002
  );
1610
2003
  }
1611
- function DropdownMenu(props) {
1612
- return /* @__PURE__ */ jsx(Menu.Root, { "data-slot": "dropdown-menu", ...props });
1613
- }
1614
- function DropdownMenuTrigger({ ...props }) {
1615
- return /* @__PURE__ */ jsx(Menu.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
1616
- }
1617
- function DropdownMenuGroup(props) {
1618
- return /* @__PURE__ */ jsx(Menu.Group, { "data-slot": "dropdown-menu-group", ...props });
1619
- }
1620
- function DropdownMenuContent({
1621
- className,
1622
- sideOffset = 4,
1623
- align = "start",
1624
- ...props
1625
- }) {
1626
- return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(
1627
- Menu.Positioner,
2004
+ function Table({ className, ...props }) {
2005
+ return /* @__PURE__ */ jsx(
2006
+ "div",
1628
2007
  {
1629
- sideOffset,
1630
- align,
1631
- className: "z-50",
2008
+ "data-slot": "table-container",
2009
+ className: "relative w-full overflow-x-auto",
1632
2010
  children: /* @__PURE__ */ jsx(
1633
- Menu.Popup,
2011
+ "table",
1634
2012
  {
1635
- "data-slot": "dropdown-menu-content",
1636
- className: cn(
1637
- "bg-popover text-popover-foreground border-border z-50 min-w-[8rem] overflow-hidden rounded-lg border p-1 shadow-md outline-none",
1638
- className
1639
- ),
2013
+ "data-slot": "table",
2014
+ className: cn("w-full caption-bottom text-sm", className),
1640
2015
  ...props
1641
2016
  }
1642
2017
  )
1643
2018
  }
1644
- ) });
2019
+ );
1645
2020
  }
1646
- var itemClasses = "relative flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-none select-none transition-colors data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-muted-foreground";
1647
- function DropdownMenuItem({ className, ...props }) {
2021
+ function TableHeader({ className, ...props }) {
1648
2022
  return /* @__PURE__ */ jsx(
1649
- Menu.Item,
2023
+ "thead",
1650
2024
  {
1651
- "data-slot": "dropdown-menu-item",
1652
- className: cn(itemClasses, className),
2025
+ "data-slot": "table-header",
2026
+ className: cn("[&_tr]:border-b", className),
1653
2027
  ...props
1654
2028
  }
1655
2029
  );
1656
2030
  }
1657
- function DropdownMenuCheckboxItem({
1658
- className,
1659
- children,
1660
- ...props
1661
- }) {
1662
- return /* @__PURE__ */ jsxs(
1663
- Menu.CheckboxItem,
2031
+ function TableBody({ className, ...props }) {
2032
+ return /* @__PURE__ */ jsx(
2033
+ "tbody",
1664
2034
  {
1665
- "data-slot": "dropdown-menu-checkbox-item",
1666
- className: cn(itemClasses, "pl-8", className),
1667
- ...props,
1668
- children: [
1669
- /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "size-4" }) }) }),
1670
- children
1671
- ]
2035
+ "data-slot": "table-body",
2036
+ className: cn("[&_tr:last-child]:border-0", className),
2037
+ ...props
1672
2038
  }
1673
2039
  );
1674
2040
  }
1675
- function DropdownMenuRadioGroup(props) {
1676
- return /* @__PURE__ */ jsx(Menu.RadioGroup, { "data-slot": "dropdown-menu-radio-group", ...props });
1677
- }
1678
- function DropdownMenuRadioItem({
1679
- className,
1680
- children,
1681
- ...props
1682
- }) {
1683
- return /* @__PURE__ */ jsxs(
1684
- Menu.RadioItem,
2041
+ function TableFooter({ className, ...props }) {
2042
+ return /* @__PURE__ */ jsx(
2043
+ "tfoot",
1685
2044
  {
1686
- "data-slot": "dropdown-menu-radio-item",
1687
- className: cn(itemClasses, "pl-8", className),
1688
- ...props,
1689
- children: [
2045
+ "data-slot": "table-footer",
2046
+ className: cn(
2047
+ "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
2048
+ className
2049
+ ),
2050
+ ...props
2051
+ }
2052
+ );
2053
+ }
2054
+ function TableRow({ className, ...props }) {
2055
+ return /* @__PURE__ */ jsx(
2056
+ "tr",
2057
+ {
2058
+ "data-slot": "table-row",
2059
+ className: cn(
2060
+ "border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted",
2061
+ className
2062
+ ),
2063
+ ...props
2064
+ }
2065
+ );
2066
+ }
2067
+ function TableHead({ className, ...props }) {
2068
+ return /* @__PURE__ */ jsx(
2069
+ "th",
2070
+ {
2071
+ "data-slot": "table-head",
2072
+ className: cn(
2073
+ "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
2074
+ className
2075
+ ),
2076
+ ...props
2077
+ }
2078
+ );
2079
+ }
2080
+ function TableCell({ className, ...props }) {
2081
+ return /* @__PURE__ */ jsx(
2082
+ "td",
2083
+ {
2084
+ "data-slot": "table-cell",
2085
+ className: cn(
2086
+ "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
2087
+ className
2088
+ ),
2089
+ ...props
2090
+ }
2091
+ );
2092
+ }
2093
+ function TableCaption({
2094
+ className,
2095
+ ...props
2096
+ }) {
2097
+ return /* @__PURE__ */ jsx(
2098
+ "caption",
2099
+ {
2100
+ "data-slot": "table-caption",
2101
+ className: cn("mt-4 text-sm text-muted-foreground", className),
2102
+ ...props
2103
+ }
2104
+ );
2105
+ }
2106
+ var SELECT_COL_PX = 48;
2107
+ var STICKY_UNDERLAP_PX = 8;
2108
+ var selectColStyle = {
2109
+ width: SELECT_COL_PX,
2110
+ minWidth: SELECT_COL_PX,
2111
+ maxWidth: SELECT_COL_PX
2112
+ };
2113
+ var DEFAULT_STICKY_PX = 180;
2114
+ var HEADER_CELL_BG = "bg-[color-mix(in_oklab,var(--color-muted)_40%,var(--color-background))]";
2115
+ function alignClass(align) {
2116
+ return align === "right" ? "text-right" : align === "center" ? "text-center" : "text-left";
2117
+ }
2118
+ function DataTable({
2119
+ data,
2120
+ columns,
2121
+ rowKey,
2122
+ selectable = false,
2123
+ selected: selectedProp,
2124
+ onSelectedChange,
2125
+ bulkActions,
2126
+ sort: sortProp,
2127
+ defaultSort = null,
2128
+ onSortChange,
2129
+ paginated = false,
2130
+ pageSize: pageSizeProp,
2131
+ pageSizeOptions = [25, 50, 100],
2132
+ page: pageProp,
2133
+ onPageChange,
2134
+ toolbar,
2135
+ onRowClick,
2136
+ emptyMessage = "No rows to show.",
2137
+ rowClassName,
2138
+ className
2139
+ }) {
2140
+ const [selInner, setSelInner] = useState(/* @__PURE__ */ new Set());
2141
+ const selected = selectedProp ?? selInner;
2142
+ const setSelected = (next) => {
2143
+ onSelectedChange?.(next);
2144
+ if (selectedProp === void 0) setSelInner(next);
2145
+ };
2146
+ const toggleRow = (id) => {
2147
+ const next = new Set(selected);
2148
+ if (next.has(id)) next.delete(id);
2149
+ else next.add(id);
2150
+ setSelected(next);
2151
+ };
2152
+ const clearSelection = () => setSelected(/* @__PURE__ */ new Set());
2153
+ const [sortInner, setSortInner] = useState(defaultSort);
2154
+ const sort = sortProp !== void 0 ? sortProp : sortInner;
2155
+ const colByKey = useMemo(() => {
2156
+ const m = /* @__PURE__ */ new Map();
2157
+ for (const c of columns) m.set(c.key, c);
2158
+ return m;
2159
+ }, [columns]);
2160
+ const toggleSort = (key) => {
2161
+ const next = sort?.key !== key ? { key, dir: "asc" } : sort.dir === "asc" ? { key, dir: "desc" } : null;
2162
+ onSortChange?.(next);
2163
+ if (sortProp === void 0) setSortInner(next);
2164
+ };
2165
+ const sorted = useMemo(() => {
2166
+ if (!sort) return data;
2167
+ const col = colByKey.get(sort.key);
2168
+ if (!col?.sortValue) return data;
2169
+ const { sortValue } = col;
2170
+ const arr = [...data];
2171
+ arr.sort((a, b) => {
2172
+ const av = sortValue(a);
2173
+ const bv = sortValue(b);
2174
+ const cmp = typeof av === "number" && typeof bv === "number" ? av - bv : String(av).localeCompare(String(bv));
2175
+ return sort.dir === "asc" ? cmp : -cmp;
2176
+ });
2177
+ return arr;
2178
+ }, [data, sort, colByKey]);
2179
+ const [pageSizeInner, setPageSizeInner] = useState(pageSizeProp ?? 25);
2180
+ const pageSize = paginated ? pageSizeInner : sorted.length || 1;
2181
+ const [pageInner, setPageInner] = useState(0);
2182
+ const page = pageProp !== void 0 ? pageProp : pageInner;
2183
+ const setPage = (p) => {
2184
+ onPageChange?.(p);
2185
+ if (pageProp === void 0) setPageInner(p);
2186
+ };
2187
+ const total = sorted.length;
2188
+ const pageCount = Math.max(1, Math.ceil(total / pageSize));
2189
+ const safePage = Math.min(page, pageCount - 1);
2190
+ const pageStart = paginated ? safePage * pageSize : 0;
2191
+ const rows = paginated ? sorted.slice(pageStart, pageStart + pageSize) : sorted;
2192
+ const pageIds = rows.map(rowKey);
2193
+ const allChecked = pageIds.length > 0 && pageIds.every((id) => selected.has(id));
2194
+ const toggleAll = () => {
2195
+ const next = new Set(selected);
2196
+ for (const id of pageIds) {
2197
+ if (allChecked) next.delete(id);
2198
+ else next.add(id);
2199
+ }
2200
+ setSelected(next);
2201
+ };
2202
+ const selectedCount = selected.size;
2203
+ const stickyLeft = useMemo(() => {
2204
+ const offsets = /* @__PURE__ */ new Map();
2205
+ let left = selectable ? SELECT_COL_PX - STICKY_UNDERLAP_PX : 0;
2206
+ for (const col of columns) {
2207
+ if (!col.sticky) continue;
2208
+ offsets.set(col.key, left);
2209
+ left += typeof col.width === "number" ? col.width : DEFAULT_STICKY_PX;
2210
+ }
2211
+ return offsets;
2212
+ }, [columns, selectable]);
2213
+ const colCount = (selectable ? 1 : 0) + columns.length + 1;
2214
+ const sortIcon = (key) => {
2215
+ if (sort?.key !== key)
2216
+ return /* @__PURE__ */ jsx(ChevronsUpDown, { className: "size-3.5 text-muted-foreground/50 opacity-0 transition-opacity group-hover/sort:opacity-100" });
2217
+ return sort.dir === "asc" ? /* @__PURE__ */ jsx(ChevronUp, { className: "size-3.5" }) : /* @__PURE__ */ jsx(ChevronDown, { className: "size-3.5" });
2218
+ };
2219
+ return /* @__PURE__ */ jsxs("div", { className: cn("space-y-2", className), children: [
2220
+ toolbar,
2221
+ bulkActions?.length && selectedCount > 0 ? /* @__PURE__ */ jsxs("div", { className: "flex w-fit flex-wrap items-center gap-2 rounded-lg border border-primary/40 bg-primary/5 px-3 py-1.5", children: [
2222
+ /* @__PURE__ */ jsxs("span", { className: "text-sm font-medium", children: [
2223
+ selectedCount,
2224
+ " selected"
2225
+ ] }),
2226
+ /* @__PURE__ */ jsx("span", { className: "text-sm text-muted-foreground", children: "\xB7" }),
2227
+ bulkActions.map(
2228
+ (action, i) => action.options ? /* @__PURE__ */ jsxs(
2229
+ Select,
2230
+ {
2231
+ value: "",
2232
+ onValueChange: (v) => v && action.onPick?.(v),
2233
+ children: [
2234
+ /* @__PURE__ */ jsx(
2235
+ SelectTrigger,
2236
+ {
2237
+ "aria-label": action.label,
2238
+ className: "h-8 min-w-[130px] bg-background text-sm",
2239
+ children: /* @__PURE__ */ jsx(SelectValue, { placeholder: action.label })
2240
+ }
2241
+ ),
2242
+ /* @__PURE__ */ jsx(SelectContent, { className: "w-auto min-w-(--anchor-width) max-w-[20rem]", children: action.options.map((o) => /* @__PURE__ */ jsx(SelectItem, { value: o.value, children: o.label }, o.value)) })
2243
+ ]
2244
+ },
2245
+ i
2246
+ ) : /* @__PURE__ */ jsx(
2247
+ "button",
2248
+ {
2249
+ type: "button",
2250
+ onClick: action.onClick,
2251
+ className: "inline-flex h-8 items-center rounded-md border bg-background px-2.5 text-sm hover:bg-muted",
2252
+ children: action.label
2253
+ },
2254
+ i
2255
+ )
2256
+ ),
2257
+ /* @__PURE__ */ jsxs(
2258
+ "button",
2259
+ {
2260
+ type: "button",
2261
+ onClick: clearSelection,
2262
+ className: "inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground",
2263
+ children: [
2264
+ /* @__PURE__ */ jsx(X, { className: "size-3.5" }),
2265
+ "Clear"
2266
+ ]
2267
+ }
2268
+ )
2269
+ ] }) : null,
2270
+ /* @__PURE__ */ jsx("div", { className: "rounded-xl border bg-background overflow-hidden", children: /* @__PURE__ */ jsxs(Table, { className: "border-separate border-spacing-0", children: [
2271
+ /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsxs(TableRow, { className: "text-xs uppercase tracking-wide text-muted-foreground", children: [
2272
+ selectable && /* @__PURE__ */ jsx(
2273
+ TableHead,
2274
+ {
2275
+ style: selectColStyle,
2276
+ className: cn(
2277
+ "sticky left-0 z-30 px-0 py-2.5 border-b rounded-tl-xl",
2278
+ HEADER_CELL_BG
2279
+ ),
2280
+ children: /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
2281
+ Checkbox,
2282
+ {
2283
+ checked: allChecked,
2284
+ onCheckedChange: toggleAll,
2285
+ "aria-label": "Select all"
2286
+ }
2287
+ ) })
2288
+ }
2289
+ ),
2290
+ columns.map((col, colIndex) => {
2291
+ const sortable = col.sortable && col.sortValue;
2292
+ const left = stickyLeft.get(col.key);
2293
+ const isFirstCol = !selectable && colIndex === 0;
2294
+ return /* @__PURE__ */ jsx(
2295
+ TableHead,
2296
+ {
2297
+ style: col.sticky ? { left, minWidth: col.width } : { minWidth: col.width },
2298
+ className: cn(
2299
+ "px-4 py-2.5 border-b font-medium text-muted-foreground",
2300
+ HEADER_CELL_BG,
2301
+ alignClass(col.align),
2302
+ col.sticky && "sticky z-20",
2303
+ isFirstCol && "rounded-tl-xl",
2304
+ col.headerClassName
2305
+ ),
2306
+ children: sortable ? /* @__PURE__ */ jsxs(
2307
+ "button",
2308
+ {
2309
+ type: "button",
2310
+ onClick: () => toggleSort(col.key),
2311
+ className: "group/sort inline-flex items-center gap-1 hover:text-foreground",
2312
+ children: [
2313
+ col.header,
2314
+ sortIcon(col.key)
2315
+ ]
2316
+ }
2317
+ ) : col.header
2318
+ },
2319
+ col.key
2320
+ );
2321
+ }),
2322
+ /* @__PURE__ */ jsx(TableHead, { "aria-hidden": true, className: cn("w-full border-b", HEADER_CELL_BG) })
2323
+ ] }) }),
2324
+ /* @__PURE__ */ jsx(TableBody, { children: data.length === 0 ? /* @__PURE__ */ jsx(TableRow, { className: "hover:bg-transparent", children: /* @__PURE__ */ jsx(
2325
+ TableCell,
2326
+ {
2327
+ colSpan: colCount,
2328
+ className: "py-12 text-center text-sm text-muted-foreground rounded-bl-xl",
2329
+ children: emptyMessage
2330
+ }
2331
+ ) }) : rows.map((row, rowIndex) => {
2332
+ const id = rowKey(row);
2333
+ const isSel = selected.has(id);
2334
+ const rowBg = isSel ? "bg-muted" : "bg-background";
2335
+ const isLastRow = rowIndex === rows.length - 1;
2336
+ return /* @__PURE__ */ jsxs(
2337
+ TableRow,
2338
+ {
2339
+ className: cn(
2340
+ "group",
2341
+ rowBg,
2342
+ "hover:bg-muted",
2343
+ rowClassName?.(row)
2344
+ ),
2345
+ children: [
2346
+ selectable && /* @__PURE__ */ jsx(
2347
+ TableCell,
2348
+ {
2349
+ style: selectColStyle,
2350
+ className: cn(
2351
+ "sticky left-0 z-20 px-0 py-2.5 border-b group-hover:bg-muted",
2352
+ rowBg,
2353
+ isLastRow && "rounded-bl-xl"
2354
+ ),
2355
+ children: /* @__PURE__ */ jsx("div", { className: "flex justify-center", children: /* @__PURE__ */ jsx(
2356
+ Checkbox,
2357
+ {
2358
+ checked: isSel,
2359
+ onCheckedChange: () => toggleRow(id),
2360
+ "aria-label": "Select row"
2361
+ }
2362
+ ) })
2363
+ }
2364
+ ),
2365
+ columns.map((col, colIndex) => {
2366
+ const left = stickyLeft.get(col.key);
2367
+ const isFirstCol = !selectable && colIndex === 0;
2368
+ return /* @__PURE__ */ jsx(
2369
+ TableCell,
2370
+ {
2371
+ style: col.sticky ? { left } : void 0,
2372
+ className: cn(
2373
+ "px-4 py-2.5 border-b align-middle",
2374
+ alignClass(col.align),
2375
+ col.sticky && cn("sticky z-10 group-hover:bg-muted", rowBg),
2376
+ isFirstCol && isLastRow && "rounded-bl-xl",
2377
+ col.className
2378
+ ),
2379
+ onClick: col.sticky && onRowClick ? () => onRowClick(row) : void 0,
2380
+ children: col.render(row)
2381
+ },
2382
+ col.key
2383
+ );
2384
+ }),
2385
+ /* @__PURE__ */ jsx(TableCell, { "aria-hidden": true, className: "border-b" })
2386
+ ]
2387
+ },
2388
+ id
2389
+ );
2390
+ }) })
2391
+ ] }) }),
2392
+ paginated && total > 0 && /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between gap-4 px-1 text-sm text-muted-foreground", children: [
2393
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
2394
+ /* @__PURE__ */ jsx("span", { className: "hidden sm:inline", children: "Rows per page" }),
2395
+ /* @__PURE__ */ jsxs(
2396
+ Select,
2397
+ {
2398
+ value: String(pageSize),
2399
+ onValueChange: (v) => {
2400
+ if (!v) return;
2401
+ setPageSizeInner(Number(v));
2402
+ setPage(0);
2403
+ },
2404
+ children: [
2405
+ /* @__PURE__ */ jsx(SelectTrigger, { "aria-label": "Rows per page", className: "h-8 w-[70px]", children: /* @__PURE__ */ jsx(SelectValue, {}) }),
2406
+ /* @__PURE__ */ jsx(SelectContent, { children: pageSizeOptions.map((n) => /* @__PURE__ */ jsx(SelectItem, { value: String(n), children: n }, n)) })
2407
+ ]
2408
+ }
2409
+ )
2410
+ ] }),
2411
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
2412
+ /* @__PURE__ */ jsxs("span", { className: "tabular-nums whitespace-nowrap", children: [
2413
+ pageStart + 1,
2414
+ "\u2013",
2415
+ Math.min(pageStart + pageSize, total),
2416
+ " of ",
2417
+ total
2418
+ ] }),
2419
+ /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
2420
+ /* @__PURE__ */ jsx(
2421
+ "button",
2422
+ {
2423
+ type: "button",
2424
+ onClick: () => setPage(safePage - 1),
2425
+ disabled: safePage === 0,
2426
+ "aria-label": "Previous page",
2427
+ className: "inline-flex size-8 items-center justify-center rounded-md border bg-background hover:bg-muted disabled:pointer-events-none disabled:opacity-40",
2428
+ children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-4" })
2429
+ }
2430
+ ),
2431
+ /* @__PURE__ */ jsx(
2432
+ "button",
2433
+ {
2434
+ type: "button",
2435
+ onClick: () => setPage(safePage + 1),
2436
+ disabled: safePage >= pageCount - 1,
2437
+ "aria-label": "Next page",
2438
+ className: "inline-flex size-8 items-center justify-center rounded-md border bg-background hover:bg-muted disabled:pointer-events-none disabled:opacity-40",
2439
+ children: /* @__PURE__ */ jsx(ChevronRight, { className: "size-4" })
2440
+ }
2441
+ )
2442
+ ] })
2443
+ ] })
2444
+ ] })
2445
+ ] });
2446
+ }
2447
+ function DropdownMenu(props) {
2448
+ return /* @__PURE__ */ jsx(Menu.Root, { "data-slot": "dropdown-menu", ...props });
2449
+ }
2450
+ function DropdownMenuTrigger({ ...props }) {
2451
+ return /* @__PURE__ */ jsx(Menu.Trigger, { "data-slot": "dropdown-menu-trigger", ...props });
2452
+ }
2453
+ function DropdownMenuGroup(props) {
2454
+ return /* @__PURE__ */ jsx(Menu.Group, { "data-slot": "dropdown-menu-group", ...props });
2455
+ }
2456
+ function DropdownMenuContent({
2457
+ className,
2458
+ sideOffset = 4,
2459
+ align = "start",
2460
+ ...props
2461
+ }) {
2462
+ return /* @__PURE__ */ jsx(Menu.Portal, { children: /* @__PURE__ */ jsx(
2463
+ Menu.Positioner,
2464
+ {
2465
+ sideOffset,
2466
+ align,
2467
+ className: "z-50",
2468
+ children: /* @__PURE__ */ jsx(
2469
+ Menu.Popup,
2470
+ {
2471
+ "data-slot": "dropdown-menu-content",
2472
+ className: cn(
2473
+ "bg-popover text-popover-foreground border-border z-50 min-w-[8rem] overflow-hidden rounded-lg border p-1 shadow-md outline-none",
2474
+ className
2475
+ ),
2476
+ ...props
2477
+ }
2478
+ )
2479
+ }
2480
+ ) });
2481
+ }
2482
+ var itemClasses = "relative flex cursor-default items-center gap-2 rounded-md px-2 py-1.5 text-sm outline-none select-none transition-colors data-highlighted:bg-accent data-highlighted:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:size-4 [&_svg]:shrink-0 [&_svg]:text-muted-foreground";
2483
+ function DropdownMenuItem({ className, ...props }) {
2484
+ return /* @__PURE__ */ jsx(
2485
+ Menu.Item,
2486
+ {
2487
+ "data-slot": "dropdown-menu-item",
2488
+ className: cn(itemClasses, className),
2489
+ ...props
2490
+ }
2491
+ );
2492
+ }
2493
+ function DropdownMenuCheckboxItem({
2494
+ className,
2495
+ children,
2496
+ ...props
2497
+ }) {
2498
+ return /* @__PURE__ */ jsxs(
2499
+ Menu.CheckboxItem,
2500
+ {
2501
+ "data-slot": "dropdown-menu-checkbox-item",
2502
+ className: cn(itemClasses, "pl-8", className),
2503
+ ...props,
2504
+ children: [
2505
+ /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ jsx(Menu.CheckboxItemIndicator, { children: /* @__PURE__ */ jsx(Check, { className: "size-4" }) }) }),
2506
+ children
2507
+ ]
2508
+ }
2509
+ );
2510
+ }
2511
+ function DropdownMenuRadioGroup(props) {
2512
+ return /* @__PURE__ */ jsx(Menu.RadioGroup, { "data-slot": "dropdown-menu-radio-group", ...props });
2513
+ }
2514
+ function DropdownMenuRadioItem({
2515
+ className,
2516
+ children,
2517
+ ...props
2518
+ }) {
2519
+ return /* @__PURE__ */ jsxs(
2520
+ Menu.RadioItem,
2521
+ {
2522
+ "data-slot": "dropdown-menu-radio-item",
2523
+ className: cn(itemClasses, "pl-8", className),
2524
+ ...props,
2525
+ children: [
1690
2526
  /* @__PURE__ */ jsx("span", { className: "absolute left-2 flex size-4 items-center justify-center", children: /* @__PURE__ */ jsx(Menu.RadioItemIndicator, { children: /* @__PURE__ */ jsx(Circle, { className: "size-2 fill-current" }) }) }),
1691
2527
  children
1692
2528
  ]
@@ -1933,42 +2769,401 @@ function FieldSeparator({
1933
2769
  }
1934
2770
  );
1935
2771
  }
1936
- function FieldError({
1937
- className,
1938
- children,
1939
- errors,
1940
- ...props
2772
+ function FieldError({
2773
+ className,
2774
+ children,
2775
+ errors,
2776
+ ...props
2777
+ }) {
2778
+ const content = useMemo(() => {
2779
+ if (children) {
2780
+ return children;
2781
+ }
2782
+ if (!errors?.length) {
2783
+ return null;
2784
+ }
2785
+ const uniqueErrors = [
2786
+ ...new Map(errors.map((error) => [error?.message, error])).values()
2787
+ ];
2788
+ if (uniqueErrors?.length == 1) {
2789
+ return uniqueErrors[0]?.message;
2790
+ }
2791
+ return /* @__PURE__ */ jsx("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
2792
+ (error, index) => error?.message && /* @__PURE__ */ jsx("li", { children: error.message }, index)
2793
+ ) });
2794
+ }, [children, errors]);
2795
+ if (!content) {
2796
+ return null;
2797
+ }
2798
+ return /* @__PURE__ */ jsx(
2799
+ "div",
2800
+ {
2801
+ role: "alert",
2802
+ "data-slot": "field-error",
2803
+ className: cn("text-sm font-normal text-destructive", className),
2804
+ ...props,
2805
+ children: content
2806
+ }
2807
+ );
2808
+ }
2809
+ function CheckIndicator({ checked }) {
2810
+ return /* @__PURE__ */ jsx(
2811
+ "span",
2812
+ {
2813
+ "aria-hidden": true,
2814
+ className: cn(
2815
+ "flex size-4 shrink-0 items-center justify-center rounded-[4px] border transition-colors",
2816
+ checked ? "border-primary bg-primary text-primary-foreground" : "border-input"
2817
+ ),
2818
+ children: checked && /* @__PURE__ */ jsx(Check, { className: "size-3.5" })
2819
+ }
2820
+ );
2821
+ }
2822
+ function FilterBar({
2823
+ search,
2824
+ onSearchChange,
2825
+ searchPlaceholder = "Search by name\u2026",
2826
+ showSearch = true,
2827
+ facets = [],
2828
+ values = {},
2829
+ onValuesChange,
2830
+ resultCount,
2831
+ resultNoun = "result",
2832
+ maxVisibleFacets = 3,
2833
+ right,
2834
+ left,
2835
+ filterVariant = "inline",
2836
+ className
2837
+ }) {
2838
+ const visibleFacets = facets.slice(0, maxVisibleFacets);
2839
+ const overflowFacets = facets.slice(maxVisibleFacets);
2840
+ const toggle = (key, value) => {
2841
+ const cur = values[key] ?? [];
2842
+ const next = cur.includes(value) ? cur.filter((v) => v !== value) : [...cur, value];
2843
+ onValuesChange?.({ ...values, [key]: next });
2844
+ };
2845
+ const clearAll = () => onValuesChange?.({});
2846
+ const activeCount = Object.values(values).reduce((n, a) => n + a.length, 0);
2847
+ const searchBox = /* @__PURE__ */ jsxs("div", { className: "relative w-56", children: [
2848
+ /* @__PURE__ */ jsx(Search, { className: "pointer-events-none absolute left-2.5 top-1/2 size-4 -translate-y-1/2 text-muted-foreground" }),
2849
+ /* @__PURE__ */ jsx(
2850
+ Input,
2851
+ {
2852
+ value: search,
2853
+ onChange: (e) => onSearchChange(e.target.value),
2854
+ placeholder: searchPlaceholder,
2855
+ "aria-label": searchPlaceholder,
2856
+ className: "rounded-full bg-background pl-8 pr-8"
2857
+ }
2858
+ ),
2859
+ search && /* @__PURE__ */ jsx(
2860
+ "button",
2861
+ {
2862
+ type: "button",
2863
+ onClick: () => onSearchChange(""),
2864
+ "aria-label": "Clear search",
2865
+ className: "absolute right-2 top-1/2 inline-flex size-5 -translate-y-1/2 items-center justify-center rounded-full text-muted-foreground hover:bg-muted hover:text-foreground",
2866
+ children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
2867
+ }
2868
+ )
2869
+ ] });
2870
+ return /* @__PURE__ */ jsx("div", { className: cn("space-y-2", className), children: /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [
2871
+ left,
2872
+ filterVariant === "inline" && /* @__PURE__ */ jsxs(Fragment, { children: [
2873
+ showSearch && searchBox,
2874
+ visibleFacets.map((facet) => /* @__PURE__ */ jsx(
2875
+ FacetDropdown,
2876
+ {
2877
+ facet,
2878
+ selected: values[facet.key] ?? [],
2879
+ onToggle: (value) => toggle(facet.key, value),
2880
+ onClear: () => onValuesChange?.({ ...values, [facet.key]: [] })
2881
+ },
2882
+ facet.key
2883
+ )),
2884
+ overflowFacets.length > 0 && /* @__PURE__ */ jsx(
2885
+ MoreFilters,
2886
+ {
2887
+ facets: overflowFacets,
2888
+ values,
2889
+ onToggle: toggle
2890
+ }
2891
+ ),
2892
+ activeCount > 0 && /* @__PURE__ */ jsxs(
2893
+ "button",
2894
+ {
2895
+ type: "button",
2896
+ onClick: clearAll,
2897
+ "aria-label": "Clear all filters",
2898
+ className: "inline-flex h-7 items-center gap-1 px-2 text-xs text-muted-foreground hover:text-foreground",
2899
+ children: [
2900
+ /* @__PURE__ */ jsx(X, { className: "size-3.5" }),
2901
+ activeCount
2902
+ ]
2903
+ }
2904
+ )
2905
+ ] }),
2906
+ filterVariant === "funnel" && /* @__PURE__ */ jsxs(Fragment, { children: [
2907
+ showSearch && searchBox,
2908
+ /* @__PURE__ */ jsx(
2909
+ FunnelFilter,
2910
+ {
2911
+ facets,
2912
+ values,
2913
+ onToggle: toggle,
2914
+ onClearAll: clearAll
2915
+ }
2916
+ )
2917
+ ] }),
2918
+ /* @__PURE__ */ jsxs("div", { className: "ml-auto flex items-center gap-2", children: [
2919
+ typeof resultCount === "number" && /* @__PURE__ */ jsxs("span", { className: "whitespace-nowrap text-sm text-muted-foreground", children: [
2920
+ resultCount,
2921
+ " ",
2922
+ resultNoun,
2923
+ resultCount === 1 ? "" : "s"
2924
+ ] }),
2925
+ right
2926
+ ] })
2927
+ ] }) });
2928
+ }
2929
+ function FacetDropdown({
2930
+ facet,
2931
+ selected,
2932
+ onToggle,
2933
+ onClear
2934
+ }) {
2935
+ const count = selected.length;
2936
+ const firstLabel = facet.options.find((o) => o.value === selected[0])?.label ?? selected[0];
2937
+ const summary = count === 0 ? facet.label : `${facet.label}: ${firstLabel}${count > 1 ? ` (+${count - 1})` : ""}`;
2938
+ return /* @__PURE__ */ jsxs(Popover, { children: [
2939
+ /* @__PURE__ */ jsx(
2940
+ PopoverTrigger,
2941
+ {
2942
+ render: /* @__PURE__ */ jsxs(
2943
+ "button",
2944
+ {
2945
+ type: "button",
2946
+ className: cn(
2947
+ "inline-flex h-7 max-w-[14rem] items-center gap-1 rounded-full border bg-background px-2.5 text-xs transition-colors",
2948
+ count > 0 ? "border-primary/40 bg-primary/5 text-foreground" : "text-muted-foreground hover:text-foreground"
2949
+ ),
2950
+ children: [
2951
+ /* @__PURE__ */ jsx("span", { className: "truncate", children: summary }),
2952
+ /* @__PURE__ */ jsx(ChevronDown, { className: "size-3 shrink-0 opacity-60" })
2953
+ ]
2954
+ }
2955
+ )
2956
+ }
2957
+ ),
2958
+ /* @__PURE__ */ jsx(
2959
+ PopoverContent,
2960
+ {
2961
+ className: "w-60 p-0",
2962
+ align: "start",
2963
+ "aria-label": `${facet.label} options`,
2964
+ children: /* @__PURE__ */ jsxs(Command, { children: [
2965
+ facet.options.length > 6 && /* @__PURE__ */ jsx(CommandInput, { placeholder: `Search ${facet.label.toLowerCase()}\u2026` }),
2966
+ /* @__PURE__ */ jsxs(CommandList, { children: [
2967
+ /* @__PURE__ */ jsx(CommandEmpty, { children: "No options." }),
2968
+ /* @__PURE__ */ jsx(CommandGroup, { children: facet.options.map((opt) => {
2969
+ const checked = selected.includes(opt.value);
2970
+ return /* @__PURE__ */ jsxs(
2971
+ CommandItem,
2972
+ {
2973
+ value: opt.label,
2974
+ onSelect: () => onToggle(opt.value),
2975
+ className: "gap-2.5",
2976
+ children: [
2977
+ /* @__PURE__ */ jsx(CheckIndicator, { checked }),
2978
+ /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: opt.label }),
2979
+ checked && /* @__PURE__ */ jsx("span", { className: "sr-only", children: "selected" })
2980
+ ]
2981
+ },
2982
+ opt.value
2983
+ );
2984
+ }) })
2985
+ ] }),
2986
+ count > 0 && /* @__PURE__ */ jsx("div", { className: "border-t p-1", children: /* @__PURE__ */ jsx(
2987
+ Button,
2988
+ {
2989
+ variant: "ghost",
2990
+ onClick: onClear,
2991
+ className: "w-full justify-center text-primary",
2992
+ children: "Clear"
2993
+ }
2994
+ ) })
2995
+ ] })
2996
+ }
2997
+ )
2998
+ ] });
2999
+ }
3000
+ function FunnelFilter({
3001
+ facets,
3002
+ values,
3003
+ onToggle,
3004
+ onClearAll
3005
+ }) {
3006
+ const [open, setOpen] = useState(false);
3007
+ const [drill, setDrill] = useState(null);
3008
+ const activeCount = Object.values(values).reduce((n, a) => n + a.length, 0);
3009
+ const facet = facets.find((f) => f.key === drill);
3010
+ return /* @__PURE__ */ jsxs(
3011
+ Popover,
3012
+ {
3013
+ open,
3014
+ onOpenChange: (o) => {
3015
+ setOpen(o);
3016
+ if (!o) setDrill(null);
3017
+ },
3018
+ children: [
3019
+ /* @__PURE__ */ jsx(
3020
+ PopoverTrigger,
3021
+ {
3022
+ render: /* @__PURE__ */ jsxs(
3023
+ "button",
3024
+ {
3025
+ type: "button",
3026
+ className: cn(
3027
+ "inline-flex h-9 items-center gap-1.5 rounded-md border bg-background px-3 text-sm transition-colors",
3028
+ activeCount > 0 ? "text-foreground" : "text-muted-foreground hover:text-foreground"
3029
+ ),
3030
+ children: [
3031
+ /* @__PURE__ */ jsx(ListFilter, { className: "size-4" }),
3032
+ "Filter",
3033
+ activeCount > 0 && /* @__PURE__ */ jsx(Badge, { className: "ml-0.5 h-5 bg-primary px-1.5 text-primary-foreground", children: activeCount })
3034
+ ]
3035
+ }
3036
+ )
3037
+ }
3038
+ ),
3039
+ /* @__PURE__ */ jsx(PopoverContent, { className: "w-64 p-1", align: "end", "aria-label": "Filters", children: !facet ? /* @__PURE__ */ jsxs(Fragment, { children: [
3040
+ /* @__PURE__ */ jsx("div", { className: "px-2 py-1.5 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground", children: "Add filter" }),
3041
+ facets.map((f) => {
3042
+ const count = values[f.key]?.length ?? 0;
3043
+ return /* @__PURE__ */ jsxs(
3044
+ "button",
3045
+ {
3046
+ type: "button",
3047
+ onClick: () => setDrill(f.key),
3048
+ className: "flex w-full items-center gap-2 rounded-md px-2 py-1.5 text-left text-sm hover:bg-muted/60",
3049
+ children: [
3050
+ /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: f.label }),
3051
+ count > 0 && /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-primary", children: count }),
3052
+ /* @__PURE__ */ jsx(ChevronRight, { className: "size-3.5 opacity-50" })
3053
+ ]
3054
+ },
3055
+ f.key
3056
+ );
3057
+ }),
3058
+ activeCount > 0 && /* @__PURE__ */ jsxs(Fragment, { children: [
3059
+ /* @__PURE__ */ jsx("div", { className: "my-1 border-t" }),
3060
+ /* @__PURE__ */ jsx(
3061
+ "button",
3062
+ {
3063
+ type: "button",
3064
+ onClick: onClearAll,
3065
+ className: "w-full rounded-md px-2 py-1.5 text-left text-sm text-muted-foreground hover:bg-muted/60",
3066
+ children: "Clear all filters"
3067
+ }
3068
+ )
3069
+ ] })
3070
+ ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
3071
+ /* @__PURE__ */ jsxs(
3072
+ "button",
3073
+ {
3074
+ type: "button",
3075
+ onClick: () => setDrill(null),
3076
+ className: "flex w-full items-center gap-1 rounded-md px-2 py-1.5 text-[11px] font-semibold uppercase tracking-wide text-muted-foreground hover:bg-muted/60",
3077
+ children: [
3078
+ /* @__PURE__ */ jsx(ChevronLeft, { className: "size-3.5" }),
3079
+ facet.label
3080
+ ]
3081
+ }
3082
+ ),
3083
+ /* @__PURE__ */ jsx("div", { className: "max-h-64 overflow-y-auto", children: facet.options.map((opt) => {
3084
+ const checked = (values[facet.key] ?? []).includes(opt.value);
3085
+ return /* @__PURE__ */ jsxs(
3086
+ "button",
3087
+ {
3088
+ type: "button",
3089
+ onClick: () => onToggle(facet.key, opt.value),
3090
+ className: "flex w-full items-center gap-2.5 rounded-md px-2 py-1.5 text-left text-sm hover:bg-muted/60",
3091
+ children: [
3092
+ /* @__PURE__ */ jsx(
3093
+ "span",
3094
+ {
3095
+ className: cn(
3096
+ "flex size-4 shrink-0 items-center justify-center rounded border",
3097
+ checked ? "border-primary bg-primary text-primary-foreground" : "border-input"
3098
+ ),
3099
+ children: checked && /* @__PURE__ */ jsx(Check, { className: "size-3" })
3100
+ }
3101
+ ),
3102
+ /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: opt.label })
3103
+ ]
3104
+ },
3105
+ opt.value
3106
+ );
3107
+ }) })
3108
+ ] }) })
3109
+ ]
3110
+ }
3111
+ );
3112
+ }
3113
+ function MoreFilters({
3114
+ facets,
3115
+ values,
3116
+ onToggle
1941
3117
  }) {
1942
- const content = useMemo(() => {
1943
- if (children) {
1944
- return children;
1945
- }
1946
- if (!errors?.length) {
1947
- return null;
1948
- }
1949
- const uniqueErrors = [
1950
- ...new Map(errors.map((error) => [error?.message, error])).values()
1951
- ];
1952
- if (uniqueErrors?.length == 1) {
1953
- return uniqueErrors[0]?.message;
1954
- }
1955
- return /* @__PURE__ */ jsx("ul", { className: "ml-4 flex list-disc flex-col gap-1", children: uniqueErrors.map(
1956
- (error, index) => error?.message && /* @__PURE__ */ jsx("li", { children: error.message }, index)
1957
- ) });
1958
- }, [children, errors]);
1959
- if (!content) {
1960
- return null;
1961
- }
1962
- return /* @__PURE__ */ jsx(
1963
- "div",
1964
- {
1965
- role: "alert",
1966
- "data-slot": "field-error",
1967
- className: cn("text-sm font-normal text-destructive", className),
1968
- ...props,
1969
- children: content
1970
- }
3118
+ const activeCount = facets.reduce(
3119
+ (n, f) => n + (values[f.key]?.length ?? 0),
3120
+ 0
1971
3121
  );
3122
+ return /* @__PURE__ */ jsxs(Popover, { children: [
3123
+ /* @__PURE__ */ jsx(
3124
+ PopoverTrigger,
3125
+ {
3126
+ render: /* @__PURE__ */ jsxs(
3127
+ "button",
3128
+ {
3129
+ type: "button",
3130
+ className: cn(
3131
+ "inline-flex h-7 items-center gap-1 rounded-full border bg-background px-2.5 text-xs transition-colors",
3132
+ activeCount > 0 ? "border-primary/40 bg-primary/5 text-foreground" : "text-muted-foreground hover:text-foreground"
3133
+ ),
3134
+ children: [
3135
+ /* @__PURE__ */ jsx(ListFilter, { className: "size-3.5" }),
3136
+ "More",
3137
+ activeCount > 0 && /* @__PURE__ */ jsx(Badge, { className: "ml-0.5 h-4 bg-primary px-1.5 text-primary-foreground", children: activeCount })
3138
+ ]
3139
+ }
3140
+ )
3141
+ }
3142
+ ),
3143
+ /* @__PURE__ */ jsx(PopoverContent, { className: "w-64 p-0", align: "start", "aria-label": "Filters", children: /* @__PURE__ */ jsxs(Command, { children: [
3144
+ facets.reduce((n, f) => n + f.options.length, 0) > 8 && /* @__PURE__ */ jsx(CommandInput, { placeholder: "Search filters\u2026" }),
3145
+ /* @__PURE__ */ jsxs(CommandList, { className: "max-h-[60vh]", children: [
3146
+ /* @__PURE__ */ jsx(CommandEmpty, { children: "No filters." }),
3147
+ facets.map((facet) => /* @__PURE__ */ jsx(CommandGroup, { heading: facet.label, children: facet.options.map((opt) => {
3148
+ const checked = (values[facet.key] ?? []).includes(opt.value);
3149
+ return /* @__PURE__ */ jsxs(
3150
+ CommandItem,
3151
+ {
3152
+ value: `${facet.label} ${opt.label}`,
3153
+ onSelect: () => onToggle(facet.key, opt.value),
3154
+ className: "gap-2.5",
3155
+ children: [
3156
+ /* @__PURE__ */ jsx(CheckIndicator, { checked }),
3157
+ /* @__PURE__ */ jsx("span", { className: "flex-1 truncate", children: opt.label }),
3158
+ checked && /* @__PURE__ */ jsx("span", { className: "sr-only", children: "selected" })
3159
+ ]
3160
+ },
3161
+ opt.value
3162
+ );
3163
+ }) }, facet.key))
3164
+ ] })
3165
+ ] }) })
3166
+ ] });
1972
3167
  }
1973
3168
  function PackagePicker({
1974
3169
  packages,
@@ -2936,75 +4131,6 @@ function PersonDropdown({
2936
4131
  }
2937
4132
  );
2938
4133
  }
2939
- function Popover({ ...props }) {
2940
- return /* @__PURE__ */ jsx(Popover$1.Root, { "data-slot": "popover", ...props });
2941
- }
2942
- function PopoverTrigger({ ...props }) {
2943
- return /* @__PURE__ */ jsx(Popover$1.Trigger, { "data-slot": "popover-trigger", ...props });
2944
- }
2945
- function PopoverContent({
2946
- className,
2947
- align = "center",
2948
- alignOffset = 0,
2949
- side = "bottom",
2950
- sideOffset = 4,
2951
- ...props
2952
- }) {
2953
- return /* @__PURE__ */ jsx(Popover$1.Portal, { children: /* @__PURE__ */ jsx(
2954
- Popover$1.Positioner,
2955
- {
2956
- align,
2957
- alignOffset,
2958
- side,
2959
- sideOffset,
2960
- className: "isolate z-50",
2961
- children: /* @__PURE__ */ jsx(
2962
- Popover$1.Popup,
2963
- {
2964
- "data-slot": "popover-content",
2965
- className: cn(
2966
- "z-50 flex w-72 origin-(--transform-origin) flex-col gap-2.5 rounded-lg bg-popover p-2.5 text-sm 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",
2967
- className
2968
- ),
2969
- ...props
2970
- }
2971
- )
2972
- }
2973
- ) });
2974
- }
2975
- function PopoverHeader({ className, ...props }) {
2976
- return /* @__PURE__ */ jsx(
2977
- "div",
2978
- {
2979
- "data-slot": "popover-header",
2980
- className: cn("flex flex-col gap-0.5 text-sm", className),
2981
- ...props
2982
- }
2983
- );
2984
- }
2985
- function PopoverTitle({ className, ...props }) {
2986
- return /* @__PURE__ */ jsx(
2987
- Popover$1.Title,
2988
- {
2989
- "data-slot": "popover-title",
2990
- className: cn("font-medium", className),
2991
- ...props
2992
- }
2993
- );
2994
- }
2995
- function PopoverDescription({
2996
- className,
2997
- ...props
2998
- }) {
2999
- return /* @__PURE__ */ jsx(
3000
- Popover$1.Description,
3001
- {
3002
- "data-slot": "popover-description",
3003
- className: cn("text-muted-foreground", className),
3004
- ...props
3005
- }
3006
- );
3007
- }
3008
4134
  function ScrollArea({
3009
4135
  className,
3010
4136
  children,
@@ -3469,6 +4595,37 @@ function Progress({ className, value, ...props }) {
3469
4595
  }
3470
4596
  );
3471
4597
  }
4598
+ function RadioGroup({ className, ...props }) {
4599
+ return /* @__PURE__ */ jsx(
4600
+ RadioGroup$1,
4601
+ {
4602
+ "data-slot": "radio-group",
4603
+ className: cn("grid gap-3", className),
4604
+ ...props
4605
+ }
4606
+ );
4607
+ }
4608
+ function RadioGroupItem({ className, ...props }) {
4609
+ return /* @__PURE__ */ jsx(
4610
+ Radio.Root,
4611
+ {
4612
+ "data-slot": "radio-group-item",
4613
+ className: cn(
4614
+ "peer relative flex size-4 shrink-0 items-center justify-center rounded-full border border-input transition-colors outline-none group-has-disabled/field:opacity-50 after:absolute after:-inset-x-3 after:-inset-y-2 focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 data-checked:border-primary data-checked:bg-primary data-checked:text-primary-foreground dark:data-checked:bg-primary",
4615
+ className
4616
+ ),
4617
+ ...props,
4618
+ children: /* @__PURE__ */ jsx(
4619
+ Radio.Indicator,
4620
+ {
4621
+ "data-slot": "radio-group-indicator",
4622
+ className: "grid place-content-center text-current transition-none",
4623
+ children: /* @__PURE__ */ jsx("span", { className: "size-1.5 rounded-full bg-current" })
4624
+ }
4625
+ )
4626
+ }
4627
+ );
4628
+ }
3472
4629
  function mandatoryTotal(session) {
3473
4630
  return (session.mandatoryFees ?? []).reduce((s, f) => s + f.amount, 0);
3474
4631
  }
@@ -4157,7 +5314,7 @@ function SheetContent({
4157
5314
  "data-slot": "sheet-content",
4158
5315
  "data-side": side,
4159
5316
  className: cn(
4160
- "fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
5317
+ "fixed z-50 flex flex-col gap-4 border-border bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm",
4161
5318
  className
4162
5319
  ),
4163
5320
  ...props,
@@ -5200,108 +6357,6 @@ function Switch({
5200
6357
  }
5201
6358
  );
5202
6359
  }
5203
- function Table({ className, ...props }) {
5204
- return /* @__PURE__ */ jsx(
5205
- "div",
5206
- {
5207
- "data-slot": "table-container",
5208
- className: "relative w-full overflow-x-auto",
5209
- children: /* @__PURE__ */ jsx(
5210
- "table",
5211
- {
5212
- "data-slot": "table",
5213
- className: cn("w-full caption-bottom text-sm", className),
5214
- ...props
5215
- }
5216
- )
5217
- }
5218
- );
5219
- }
5220
- function TableHeader({ className, ...props }) {
5221
- return /* @__PURE__ */ jsx(
5222
- "thead",
5223
- {
5224
- "data-slot": "table-header",
5225
- className: cn("[&_tr]:border-b", className),
5226
- ...props
5227
- }
5228
- );
5229
- }
5230
- function TableBody({ className, ...props }) {
5231
- return /* @__PURE__ */ jsx(
5232
- "tbody",
5233
- {
5234
- "data-slot": "table-body",
5235
- className: cn("[&_tr:last-child]:border-0", className),
5236
- ...props
5237
- }
5238
- );
5239
- }
5240
- function TableFooter({ className, ...props }) {
5241
- return /* @__PURE__ */ jsx(
5242
- "tfoot",
5243
- {
5244
- "data-slot": "table-footer",
5245
- className: cn(
5246
- "border-t bg-muted/50 font-medium [&>tr]:last:border-b-0",
5247
- className
5248
- ),
5249
- ...props
5250
- }
5251
- );
5252
- }
5253
- function TableRow({ className, ...props }) {
5254
- return /* @__PURE__ */ jsx(
5255
- "tr",
5256
- {
5257
- "data-slot": "table-row",
5258
- className: cn(
5259
- "border-b transition-colors hover:bg-muted/50 has-aria-expanded:bg-muted/50 data-[state=selected]:bg-muted",
5260
- className
5261
- ),
5262
- ...props
5263
- }
5264
- );
5265
- }
5266
- function TableHead({ className, ...props }) {
5267
- return /* @__PURE__ */ jsx(
5268
- "th",
5269
- {
5270
- "data-slot": "table-head",
5271
- className: cn(
5272
- "h-10 px-2 text-left align-middle font-medium whitespace-nowrap text-foreground [&:has([role=checkbox])]:pr-0",
5273
- className
5274
- ),
5275
- ...props
5276
- }
5277
- );
5278
- }
5279
- function TableCell({ className, ...props }) {
5280
- return /* @__PURE__ */ jsx(
5281
- "td",
5282
- {
5283
- "data-slot": "table-cell",
5284
- className: cn(
5285
- "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0",
5286
- className
5287
- ),
5288
- ...props
5289
- }
5290
- );
5291
- }
5292
- function TableCaption({
5293
- className,
5294
- ...props
5295
- }) {
5296
- return /* @__PURE__ */ jsx(
5297
- "caption",
5298
- {
5299
- "data-slot": "table-caption",
5300
- className: cn("mt-4 text-sm text-muted-foreground", className),
5301
- ...props
5302
- }
5303
- );
5304
- }
5305
6360
  function Tabs({
5306
6361
  className,
5307
6362
  orientation = "horizontal",
@@ -5376,4 +6431,4 @@ function TabsContent({ className, ...props }) {
5376
6431
  );
5377
6432
  }
5378
6433
 
5379
- export { Accordion, AccordionItem, AccordionPanel, AccordionTrigger, AddonCard, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, CamperForm, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSubmenu, DropdownMenuSubmenuTrigger, DropdownMenuTrigger, ExpandDesc, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, InlineAddonPicker, InlineSessionPicker, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, NextStepPeek, PackagePicker, PersonList, PersonSelect, PersonTabs, PhoneInput, PhotoUpload, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, STATUS_LABEL, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SessionCard, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, StatusPill, StepBadge, StepCard, StepNotices, Switch, TSHIRT_SIZES, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, __internal, badgeVariants, buttonVariants, calcAge, cn, computeSessionDeposit, computeSessionPrice, effectivePrice, eligibilityReason, fakeSpotsLeft, formatDOB, makeCamperFormSchema, mandatoryTotal, parseDOB, statusPillVariants, tabsListVariants, useIsMobile, useLocale, useSidebar };
6434
+ export { Accordion, AccordionItem, AccordionPanel, AccordionTrigger, AddonCard, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, CamperForm, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Checkbox, ColumnCustomizer, ColumnPicker, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, DataTable, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuGroupLabel, DropdownMenuItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSubmenu, DropdownMenuSubmenuTrigger, DropdownMenuTrigger, ExpandDesc, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, FilterBar, InlineAddonPicker, InlineSessionPicker, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, Label, NextStepPeek, PackagePicker, PersonList, PersonSelect, PersonTabs, PhoneInput, PhotoUpload, Popover, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, STATUS_LABEL, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, SessionCard, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, StatusPill, StepBadge, StepCard, StepNotices, Switch, TSHIRT_SIZES, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, __internal, badgeVariants, buttonVariants, calcAge, cn, computeSessionDeposit, computeSessionPrice, effectivePrice, eligibilityReason, fakeSpotsLeft, formatDOB, makeCamperFormSchema, mandatoryTotal, parseDOB, statusPillVariants, tabsListVariants, useIsMobile, useLocale, useSidebar };