@ai-matrx/design-system 0.21.2 → 0.21.3
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/CHANGELOG.md +6 -0
- package/dist/content-transfer.cjs +20 -6
- package/dist/content-transfer.cjs.map +1 -1
- package/dist/content-transfer.d.cts +38 -4
- package/dist/content-transfer.d.ts +38 -4
- package/dist/content-transfer.js +20 -6
- package/dist/content-transfer.js.map +1 -1
- package/dist/data-table/copy-helpers.d.cts +4 -3
- package/dist/data-table/copy-helpers.d.ts +4 -3
- package/dist/data-table/copy-types.cjs.map +1 -1
- package/dist/data-table/copy-types.d.cts +7 -2
- package/dist/data-table/copy-types.d.ts +7 -2
- package/dist/data-table/data-row-inspector.cjs +23 -6
- package/dist/data-table/data-row-inspector.cjs.map +1 -1
- package/dist/data-table/data-row-inspector.js +23 -6
- package/dist/data-table/data-row-inspector.js.map +1 -1
- package/dist/data-table/data-row-window.cjs +23 -6
- package/dist/data-table/data-row-window.cjs.map +1 -1
- package/dist/data-table/data-row-window.js +23 -6
- package/dist/data-table/data-row-window.js.map +1 -1
- package/dist/data-table/filter-engine.d.cts +4 -3
- package/dist/data-table/filter-engine.d.ts +4 -3
- package/dist/data-table/host.cjs +12 -1
- package/dist/data-table/host.cjs.map +1 -1
- package/dist/data-table/host.d.cts +16 -3
- package/dist/data-table/host.d.ts +16 -3
- package/dist/data-table/host.js +12 -1
- package/dist/data-table/host.js.map +1 -1
- package/dist/data-table/index.cjs +799 -724
- package/dist/data-table/index.cjs.map +1 -1
- package/dist/data-table/index.d.cts +15 -6
- package/dist/data-table/index.d.ts +15 -6
- package/dist/data-table/index.js +755 -680
- package/dist/data-table/index.js.map +1 -1
- package/dist/data-table/infer-filter.d.cts +4 -3
- package/dist/data-table/infer-filter.d.ts +4 -3
- package/dist/data-table/layered-filters.d.cts +4 -3
- package/dist/data-table/layered-filters.d.ts +4 -3
- package/dist/data-table/pagination.cjs +3 -0
- package/dist/data-table/pagination.cjs.map +1 -1
- package/dist/data-table/pagination.js +3 -0
- package/dist/data-table/pagination.js.map +1 -1
- package/dist/data-table/query-control.d.cts +4 -3
- package/dist/data-table/query-control.d.ts +4 -3
- package/dist/data-table/types.cjs.map +1 -1
- package/dist/data-table/types.d.cts +3 -2
- package/dist/data-table/types.d.ts +3 -2
- package/dist/data-table/url-state.d.cts +4 -3
- package/dist/data-table/url-state.d.ts +4 -3
- package/dist/data-table/uuid-cell.cjs +3 -0
- package/dist/data-table/uuid-cell.cjs.map +1 -1
- package/dist/data-table/uuid-cell.js +3 -0
- package/dist/data-table/uuid-cell.js.map +1 -1
- package/dist/data-table/xlsx.d.cts +4 -3
- package/dist/data-table/xlsx.d.ts +4 -3
- package/dist/{types-Bt-0UhEw.d.cts → types-BarjBFyG.d.cts} +3 -1
- package/dist/{types-DnnvjGV4.d.ts → types-JFlsIv-0.d.ts} +3 -1
- package/package.json +1 -1
- package/dist/extensions-DCHtNwG3.d.cts +0 -32
- package/dist/extensions-DCHtNwG3.d.ts +0 -32
|
@@ -36,6 +36,7 @@ __export(data_table_exports, {
|
|
|
36
36
|
GenericTablePagination: () => GenericTablePagination,
|
|
37
37
|
MatrxDataTable: () => MatrxDataTable,
|
|
38
38
|
MatrxDataTableProvider: () => MatrxDataTableProvider,
|
|
39
|
+
MatrxTableRowAlchemyProvider: () => MatrxTableRowAlchemyProvider,
|
|
39
40
|
MatrxUuidCell: () => MatrxUuidCell,
|
|
40
41
|
SavedViewsControl: () => SavedViewsControl,
|
|
41
42
|
TableTitleRow: () => TableTitleRow,
|
|
@@ -54,13 +55,14 @@ __export(data_table_exports, {
|
|
|
54
55
|
shortUuid: () => shortUuid,
|
|
55
56
|
tableUrlParamPrefix: () => tableUrlParamPrefix,
|
|
56
57
|
useMatrxDataTableHost: () => useMatrxDataTableHost,
|
|
58
|
+
useMatrxTableRowAlchemy: () => useMatrxTableRowAlchemy,
|
|
57
59
|
useScrollPagination: () => useScrollPagination,
|
|
58
60
|
useTableUrlState: () => useTableUrlState
|
|
59
61
|
});
|
|
60
62
|
module.exports = __toCommonJS(data_table_exports);
|
|
61
63
|
|
|
62
64
|
// src/data-table/MatrxDataTable.tsx
|
|
63
|
-
var
|
|
65
|
+
var import_react20 = require("react");
|
|
64
66
|
var import_core3 = require("@dnd-kit/core");
|
|
65
67
|
|
|
66
68
|
// src/data-table/icons.tsx
|
|
@@ -1914,6 +1916,15 @@ function MatrxDataTableProvider({ value, children }) {
|
|
|
1914
1916
|
function useMatrxDataTableHost() {
|
|
1915
1917
|
return (0, import_react5.useContext)(HostContext);
|
|
1916
1918
|
}
|
|
1919
|
+
var ROW_ALCHEMY_SLOT = /* @__PURE__ */ Symbol.for("ai-matrx.design-system.table-row-alchemy-context");
|
|
1920
|
+
var rowAlchemyRegistry = globalThis;
|
|
1921
|
+
var RowAlchemyContext = rowAlchemyRegistry[ROW_ALCHEMY_SLOT] ??= (0, import_react5.createContext)(null);
|
|
1922
|
+
function MatrxTableRowAlchemyScope({ value, children }) {
|
|
1923
|
+
return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(RowAlchemyContext.Provider, { value, children });
|
|
1924
|
+
}
|
|
1925
|
+
function useMatrxTableRowAlchemy() {
|
|
1926
|
+
return (0, import_react5.useContext)(RowAlchemyContext);
|
|
1927
|
+
}
|
|
1917
1928
|
|
|
1918
1929
|
// src/data-table/useTableNotice.tsx
|
|
1919
1930
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
@@ -3216,8 +3227,9 @@ function ContentTransferMenu(props) {
|
|
|
3216
3227
|
const identityKey = props.capabilities?.identityKey ?? inherited.identityKey;
|
|
3217
3228
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ContentTransferMenuSession, { ...props }, identityKey ?? "anonymous");
|
|
3218
3229
|
}
|
|
3219
|
-
function ContentTransferMenuSession({ references = [], referenceActions = [], source, surface, label, projection, sections, preferences, table, formatSources, sourceFormats = true, variants = EMPTY_VARIANTS, actions = [], capabilities: local, disabled, enabled = true, className, stopPropagation = true, hide = [], controllerRef, icon = "portal", triggerVariant = "transparent", triggerSize = "default" }) {
|
|
3230
|
+
function ContentTransferMenuSession({ references = [], referenceActions = [], source, surface, label, projection, sections, preferences, table, formatSources, sourceFormats = true, variants = EMPTY_VARIANTS, actions = [], capabilities: local, disabled, enabled = true, className, stopPropagation = true, hide = [], controllerRef, icon = "portal", triggerVariant = "transparent", triggerSize = "default", triggerHidden = false }) {
|
|
3220
3231
|
const triggerRef = React14.useRef(null);
|
|
3232
|
+
const restoreFocusRef = React14.useRef(null);
|
|
3221
3233
|
const inherited = React14.useContext(CapabilityContext);
|
|
3222
3234
|
const nearestSurface = React14.useContext(SurfaceContext);
|
|
3223
3235
|
const fence = useFence();
|
|
@@ -3467,13 +3479,21 @@ function ContentTransferMenuSession({ references = [], referenceActions = [], so
|
|
|
3467
3479
|
);
|
|
3468
3480
|
React14.useImperativeHandle(controllerRef, () => ({
|
|
3469
3481
|
focusTrigger: () => triggerRef.current?.focus(),
|
|
3482
|
+
preparePrimary: async (options) => {
|
|
3483
|
+
if (!enabled) throw new Error("Alchemy is not enabled for this record.");
|
|
3484
|
+
if (disabled) throw new Error("Alchemy is disabled for this record.");
|
|
3485
|
+
if (hide.includes("prepare")) throw new Error("Alchemy preparation is unavailable for this record.");
|
|
3486
|
+
if (!primary) throw new Error("Alchemy has no source to prepare.");
|
|
3487
|
+
restoreFocusRef.current = options?.restoreFocus ?? null;
|
|
3488
|
+
await openWorkspace(primaryWorkspaceKey, { source: primary, label: sourceLabel });
|
|
3489
|
+
},
|
|
3470
3490
|
prepare: async (requestedSource, options) => {
|
|
3471
3491
|
const requestedLabel = options?.label ?? ("label" in requestedSource ? requestedSource.label : "content");
|
|
3472
3492
|
const requestedKey = `controller:${options?.id ?? "source"}:${materialIdentity(requestedSource)}`;
|
|
3473
3493
|
externalWorkspaceKeys.current.add(requestedKey);
|
|
3474
3494
|
await openWorkspace(requestedKey, { source: requestedSource, label: requestedLabel });
|
|
3475
3495
|
}
|
|
3476
|
-
}), [openWorkspace]);
|
|
3496
|
+
}), [disabled, enabled, hide, openWorkspace, primary, primaryWorkspaceKey, sourceLabel]);
|
|
3477
3497
|
const runAction = React14.useCallback(async (action) => {
|
|
3478
3498
|
const { controller, id } = fence.begin();
|
|
3479
3499
|
try {
|
|
@@ -3556,7 +3576,7 @@ function ContentTransferMenuSession({ references = [], referenceActions = [], so
|
|
|
3556
3576
|
] }, id);
|
|
3557
3577
|
};
|
|
3558
3578
|
return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: cn("matrx-alchemy", className), onClick: stopPropagation ? (event) => event.stopPropagation() : void 0, children: [
|
|
3559
|
-
/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Popover, { open: paletteOpen, onOpenChange: (open) => {
|
|
3579
|
+
!triggerHidden ? /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(Popover, { open: paletteOpen, onOpenChange: (open) => {
|
|
3560
3580
|
setPaletteOpen(open);
|
|
3561
3581
|
if (open) {
|
|
3562
3582
|
setMode("copy");
|
|
@@ -3665,13 +3685,13 @@ function ContentTransferMenuSession({ references = [], referenceActions = [], so
|
|
|
3665
3685
|
] }, group) : null;
|
|
3666
3686
|
})
|
|
3667
3687
|
] })
|
|
3668
|
-
] }),
|
|
3688
|
+
] }) : null,
|
|
3669
3689
|
notice && triggerRef.current ? (0, import_react_dom.createPortal)(/* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "matrx-alchemy-feedback", children: [
|
|
3670
3690
|
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { role: "status", children: notice }),
|
|
3671
3691
|
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ReceiptLink, { target: receiptTarget }),
|
|
3672
3692
|
/* @__PURE__ */ (0, import_jsx_runtime25.jsx)("button", { type: "button", "aria-label": "Dismiss Alchemy feedback", onClick: () => setNotice(null), children: "\xD7" })
|
|
3673
3693
|
] }), triggerRef.current.ownerDocument.body) : null,
|
|
3674
|
-
Object.values(workspaces).map((saved) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PreparationWorkspace, { restoreFocus: () => triggerRef.current?.focus(), open: workspaceOpen && workspaceKey === saved.key, state: saved, scopes, scopeLabels: table?.scopeLabels, onClose: () => setWorkspaceOpen(false), onChange: (next) => setWorkspaces((current) => ({ ...current, [saved.key]: next })), transport, adapters, actions: preparedActions, captureScope: workspaceCaptures.current.get(saved.key) ?? capturePrimary, ...ai ? { ai } : {}, onOutcome: report }, saved.key)),
|
|
3694
|
+
Object.values(workspaces).map((saved) => /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(PreparationWorkspace, { restoreFocus: () => restoreFocusRef.current?.() ?? triggerRef.current?.focus(), open: workspaceOpen && workspaceKey === saved.key, state: saved, scopes, scopeLabels: table?.scopeLabels, onClose: () => setWorkspaceOpen(false), onChange: (next) => setWorkspaces((current) => ({ ...current, [saved.key]: next })), transport, adapters, actions: preparedActions, captureScope: workspaceCaptures.current.get(saved.key) ?? capturePrimary, ...ai ? { ai } : {}, onOutcome: report }, saved.key)),
|
|
3675
3695
|
emailReview
|
|
3676
3696
|
] });
|
|
3677
3697
|
}
|
|
@@ -4478,7 +4498,12 @@ function MatrxCopyMenuSession(props) {
|
|
|
4478
4498
|
...props.referenceActions ? { referenceActions: props.referenceActions } : {},
|
|
4479
4499
|
...props.icon !== void 0 ? { icon: props.icon } : {},
|
|
4480
4500
|
...props.triggerVariant !== void 0 ? { triggerVariant: props.triggerVariant } : {},
|
|
4481
|
-
controllerRef:
|
|
4501
|
+
controllerRef: (value) => {
|
|
4502
|
+
controller.current = value;
|
|
4503
|
+
if (typeof props.controllerRef === "function") props.controllerRef(value);
|
|
4504
|
+
else if (props.controllerRef) props.controllerRef.current = value;
|
|
4505
|
+
},
|
|
4506
|
+
...props.triggerHidden ? { triggerHidden: true } : {},
|
|
4482
4507
|
label: props.label,
|
|
4483
4508
|
variants,
|
|
4484
4509
|
actions,
|
|
@@ -5560,16 +5585,51 @@ function useTableUrlState(options) {
|
|
|
5560
5585
|
// src/data-table/MatrxDataTable.tsx
|
|
5561
5586
|
var import_url_state3 = require("@ai-matrx/kit/url-state");
|
|
5562
5587
|
|
|
5563
|
-
// src/data-table/
|
|
5588
|
+
// src/data-table/RowAlchemyLauncher.tsx
|
|
5564
5589
|
var import_react12 = require("react");
|
|
5590
|
+
var import_jsx_runtime29 = require("react/jsx-runtime");
|
|
5591
|
+
function MatrxTableRowAlchemyProvider({ copy, placement, children }) {
|
|
5592
|
+
const controller = (0, import_react12.useRef)(null);
|
|
5593
|
+
const { CopyControls } = useMatrxDataTableHost();
|
|
5594
|
+
const [active, setActive] = (0, import_react12.useState)(false);
|
|
5595
|
+
const [fallback, setFallback] = (0, import_react12.useState)(false);
|
|
5596
|
+
(0, import_react12.useEffect)(() => {
|
|
5597
|
+
if (placement !== "menu" || active) return;
|
|
5598
|
+
const timer = window.setTimeout(() => {
|
|
5599
|
+
if (!active) {
|
|
5600
|
+
console.warn("MatrxDataTable rowCopyPlacement='menu' requires an ItemMenu in rowActions; showing inline Alchemy instead.");
|
|
5601
|
+
setFallback(true);
|
|
5602
|
+
}
|
|
5603
|
+
}, 0);
|
|
5604
|
+
return () => window.clearTimeout(timer);
|
|
5605
|
+
}, [active, placement]);
|
|
5606
|
+
const value = {
|
|
5607
|
+
copy,
|
|
5608
|
+
placement,
|
|
5609
|
+
ready: active,
|
|
5610
|
+
activate: () => setActive(true),
|
|
5611
|
+
prepare: async (restoreFocus) => {
|
|
5612
|
+
if (copy.disabled) throw new Error("Alchemy is disabled for this record.");
|
|
5613
|
+
if (!controller.current) throw new Error("Alchemy is unavailable because its launcher did not mount.");
|
|
5614
|
+
await controller.current.preparePrimary(restoreFocus ? { restoreFocus } : void 0);
|
|
5615
|
+
}
|
|
5616
|
+
};
|
|
5617
|
+
return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(MatrxTableRowAlchemyScope, { value, children: [
|
|
5618
|
+
active || fallback ? CopyControls ? /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(CopyControls, { ...copy, triggerHidden: active, controllerRef: controller }) : /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(MatrxCopyMenu, { ...copy, triggerHidden: active, controllerRef: controller }) : null,
|
|
5619
|
+
children
|
|
5620
|
+
] });
|
|
5621
|
+
}
|
|
5622
|
+
|
|
5623
|
+
// src/data-table/ColumnHeaderCell.tsx
|
|
5624
|
+
var import_react13 = require("react");
|
|
5565
5625
|
var import_core = require("@dnd-kit/core");
|
|
5566
5626
|
|
|
5567
5627
|
// src/command.tsx
|
|
5568
5628
|
var DialogPrimitive2 = __toESM(require("@radix-ui/react-dialog"), 1);
|
|
5569
5629
|
var import_cmdk = require("cmdk");
|
|
5570
5630
|
var React16 = __toESM(require("react"), 1);
|
|
5571
|
-
var
|
|
5572
|
-
var Command = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5631
|
+
var import_jsx_runtime30 = require("react/jsx-runtime");
|
|
5632
|
+
var Command = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5573
5633
|
import_cmdk.Command,
|
|
5574
5634
|
{
|
|
5575
5635
|
ref,
|
|
@@ -5588,8 +5648,8 @@ var CommandDialogContent = React16.forwardRef(({ className, children, container,
|
|
|
5588
5648
|
const isMobile = useIsMobile();
|
|
5589
5649
|
const isModal = useRadixDialogModal();
|
|
5590
5650
|
const portalContainer = usePortalContainer(container);
|
|
5591
|
-
return /* @__PURE__ */ (0,
|
|
5592
|
-
isModal ? /* @__PURE__ */ (0,
|
|
5651
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(DialogPrimitive2.Portal, { container: portalContainer, children: [
|
|
5652
|
+
isModal ? /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5593
5653
|
DialogPrimitive2.Overlay,
|
|
5594
5654
|
{
|
|
5595
5655
|
className: cn(
|
|
@@ -5598,7 +5658,7 @@ var CommandDialogContent = React16.forwardRef(({ className, children, container,
|
|
|
5598
5658
|
)
|
|
5599
5659
|
}
|
|
5600
5660
|
) : null,
|
|
5601
|
-
/* @__PURE__ */ (0,
|
|
5661
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(
|
|
5602
5662
|
DialogPrimitive2.Content,
|
|
5603
5663
|
{
|
|
5604
5664
|
ref,
|
|
@@ -5614,9 +5674,9 @@ var CommandDialogContent = React16.forwardRef(({ className, children, container,
|
|
|
5614
5674
|
...props,
|
|
5615
5675
|
children: [
|
|
5616
5676
|
children,
|
|
5617
|
-
/* @__PURE__ */ (0,
|
|
5618
|
-
/* @__PURE__ */ (0,
|
|
5619
|
-
/* @__PURE__ */ (0,
|
|
5677
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsxs)(DialogPrimitive2.Close, { className: "absolute right-2 top-4 flex h-10 w-10 items-center justify-center rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground sm:right-4", children: [
|
|
5678
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(XIcon, { className: "h-4 w-4" }),
|
|
5679
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: "sr-only", children: "Close" })
|
|
5620
5680
|
] })
|
|
5621
5681
|
]
|
|
5622
5682
|
}
|
|
@@ -5624,9 +5684,9 @@ var CommandDialogContent = React16.forwardRef(({ className, children, container,
|
|
|
5624
5684
|
] });
|
|
5625
5685
|
});
|
|
5626
5686
|
CommandDialogContent.displayName = "CommandDialogContent";
|
|
5627
|
-
var CommandInput = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5628
|
-
/* @__PURE__ */ (0,
|
|
5629
|
-
/* @__PURE__ */ (0,
|
|
5687
|
+
var CommandInput = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "flex items-center border-b px-3", "cmdk-input-wrapper": "", children: [
|
|
5688
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(MagnifyingGlassIcon, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
|
|
5689
|
+
/* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5630
5690
|
import_cmdk.Command.Input,
|
|
5631
5691
|
{
|
|
5632
5692
|
ref,
|
|
@@ -5639,7 +5699,7 @@ var CommandInput = React16.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
5639
5699
|
)
|
|
5640
5700
|
] }));
|
|
5641
5701
|
CommandInput.displayName = import_cmdk.Command.Input.displayName;
|
|
5642
|
-
var CommandList = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5702
|
+
var CommandList = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5643
5703
|
import_cmdk.Command.List,
|
|
5644
5704
|
{
|
|
5645
5705
|
ref,
|
|
@@ -5648,7 +5708,7 @@ var CommandList = React16.forwardRef(({ className, ...props }, ref) => /* @__PUR
|
|
|
5648
5708
|
}
|
|
5649
5709
|
));
|
|
5650
5710
|
CommandList.displayName = import_cmdk.Command.List.displayName;
|
|
5651
|
-
var CommandEmpty = React16.forwardRef((props, ref) => /* @__PURE__ */ (0,
|
|
5711
|
+
var CommandEmpty = React16.forwardRef((props, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5652
5712
|
import_cmdk.Command.Empty,
|
|
5653
5713
|
{
|
|
5654
5714
|
ref,
|
|
@@ -5657,7 +5717,7 @@ var CommandEmpty = React16.forwardRef((props, ref) => /* @__PURE__ */ (0, import
|
|
|
5657
5717
|
}
|
|
5658
5718
|
));
|
|
5659
5719
|
CommandEmpty.displayName = import_cmdk.Command.Empty.displayName;
|
|
5660
|
-
var CommandGroup = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5720
|
+
var CommandGroup = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5661
5721
|
import_cmdk.Command.Group,
|
|
5662
5722
|
{
|
|
5663
5723
|
ref,
|
|
@@ -5669,7 +5729,7 @@ var CommandGroup = React16.forwardRef(({ className, ...props }, ref) => /* @__PU
|
|
|
5669
5729
|
}
|
|
5670
5730
|
));
|
|
5671
5731
|
CommandGroup.displayName = import_cmdk.Command.Group.displayName;
|
|
5672
|
-
var CommandSeparator = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5732
|
+
var CommandSeparator = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5673
5733
|
import_cmdk.Command.Separator,
|
|
5674
5734
|
{
|
|
5675
5735
|
ref,
|
|
@@ -5678,7 +5738,7 @@ var CommandSeparator = React16.forwardRef(({ className, ...props }, ref) => /* @
|
|
|
5678
5738
|
}
|
|
5679
5739
|
));
|
|
5680
5740
|
CommandSeparator.displayName = import_cmdk.Command.Separator.displayName;
|
|
5681
|
-
var CommandItem = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
5741
|
+
var CommandItem = React16.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5682
5742
|
import_cmdk.Command.Item,
|
|
5683
5743
|
{
|
|
5684
5744
|
ref,
|
|
@@ -5694,7 +5754,7 @@ var CommandShortcut = ({
|
|
|
5694
5754
|
className,
|
|
5695
5755
|
...props
|
|
5696
5756
|
}) => {
|
|
5697
|
-
return /* @__PURE__ */ (0,
|
|
5757
|
+
return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)(
|
|
5698
5758
|
"span",
|
|
5699
5759
|
{
|
|
5700
5760
|
className: cn(
|
|
@@ -5708,10 +5768,10 @@ var CommandShortcut = ({
|
|
|
5708
5768
|
CommandShortcut.displayName = "CommandShortcut";
|
|
5709
5769
|
|
|
5710
5770
|
// src/data-table/ColumnHeaderCell.tsx
|
|
5711
|
-
var
|
|
5712
|
-
var HeaderButton = (0,
|
|
5771
|
+
var import_jsx_runtime31 = require("react/jsx-runtime");
|
|
5772
|
+
var HeaderButton = (0, import_react13.forwardRef)(({ dragDescription, "aria-describedby": tooltipDescription, ...props }, ref) => {
|
|
5713
5773
|
const descriptions = [tooltipDescription, dragDescription].filter((value) => Boolean(value)).join(" ");
|
|
5714
|
-
return /* @__PURE__ */ (0,
|
|
5774
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5715
5775
|
"button",
|
|
5716
5776
|
{
|
|
5717
5777
|
ref,
|
|
@@ -5769,9 +5829,9 @@ function ColumnHeaderCell({
|
|
|
5769
5829
|
const reorderClass = reorderEnabled ? "touch-none cursor-grab active:cursor-grabbing" : void 0;
|
|
5770
5830
|
const filterActive = isColumnFilterActive(filterValue);
|
|
5771
5831
|
const deferredFilter = filterApplyLabel !== void 0 || filterShowCancel || filterFooterHint !== void 0;
|
|
5772
|
-
const [filterOpen, setFilterOpen] = (0,
|
|
5773
|
-
const [draftFilter, setDraftFilter] = (0,
|
|
5774
|
-
(0,
|
|
5832
|
+
const [filterOpen, setFilterOpen] = (0, import_react13.useState)(false);
|
|
5833
|
+
const [draftFilter, setDraftFilter] = (0, import_react13.useState)(filterValue);
|
|
5834
|
+
(0, import_react13.useEffect)(() => {
|
|
5775
5835
|
if (!filterOpen) setDraftFilter(filterValue);
|
|
5776
5836
|
}, [filterOpen, filterValue]);
|
|
5777
5837
|
const applyFilter = () => {
|
|
@@ -5791,7 +5851,7 @@ function ColumnHeaderCell({
|
|
|
5791
5851
|
else onFilterChange(next);
|
|
5792
5852
|
};
|
|
5793
5853
|
const menuLabel = labelText ? `Sort or filter ${labelText}` : "Sort or filter column";
|
|
5794
|
-
const menuContent = /* @__PURE__ */ (0,
|
|
5854
|
+
const menuContent = /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5795
5855
|
PopoverContent,
|
|
5796
5856
|
{
|
|
5797
5857
|
align: "start",
|
|
@@ -5808,9 +5868,9 @@ function ColumnHeaderCell({
|
|
|
5808
5868
|
input.focus();
|
|
5809
5869
|
},
|
|
5810
5870
|
children: [
|
|
5811
|
-
sortable ? /* @__PURE__ */ (0,
|
|
5812
|
-
/* @__PURE__ */ (0,
|
|
5813
|
-
/* @__PURE__ */ (0,
|
|
5871
|
+
sortable ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(import_jsx_runtime31.Fragment, { children: [
|
|
5872
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex flex-col gap-0.5 pb-2", children: [
|
|
5873
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5814
5874
|
Button,
|
|
5815
5875
|
{
|
|
5816
5876
|
variant: isSorted && sortDirection === "asc" ? "secondary" : "ghost",
|
|
@@ -5818,12 +5878,12 @@ function ColumnHeaderCell({
|
|
|
5818
5878
|
className: "h-8 justify-start gap-2 px-2 text-xs font-normal",
|
|
5819
5879
|
onClick: onSortAsc,
|
|
5820
5880
|
children: [
|
|
5821
|
-
/* @__PURE__ */ (0,
|
|
5881
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowUp, { className: "h-3.5 w-3.5" }),
|
|
5822
5882
|
"Sort ascending"
|
|
5823
5883
|
]
|
|
5824
5884
|
}
|
|
5825
5885
|
),
|
|
5826
|
-
/* @__PURE__ */ (0,
|
|
5886
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5827
5887
|
Button,
|
|
5828
5888
|
{
|
|
5829
5889
|
variant: isSorted && sortDirection === "desc" ? "secondary" : "ghost",
|
|
@@ -5831,12 +5891,12 @@ function ColumnHeaderCell({
|
|
|
5831
5891
|
className: "h-8 justify-start gap-2 px-2 text-xs font-normal",
|
|
5832
5892
|
onClick: onSortDesc,
|
|
5833
5893
|
children: [
|
|
5834
|
-
/* @__PURE__ */ (0,
|
|
5894
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowDown, { className: "h-3.5 w-3.5" }),
|
|
5835
5895
|
"Sort descending"
|
|
5836
5896
|
]
|
|
5837
5897
|
}
|
|
5838
5898
|
),
|
|
5839
|
-
isSorted ? /* @__PURE__ */ (0,
|
|
5899
|
+
isSorted ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5840
5900
|
Button,
|
|
5841
5901
|
{
|
|
5842
5902
|
variant: "ghost",
|
|
@@ -5844,15 +5904,15 @@ function ColumnHeaderCell({
|
|
|
5844
5904
|
className: "h-8 justify-start gap-2 px-2 text-xs font-normal text-muted-foreground",
|
|
5845
5905
|
onClick: onClearSort,
|
|
5846
5906
|
children: [
|
|
5847
|
-
/* @__PURE__ */ (0,
|
|
5907
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ListX, { className: "h-3.5 w-3.5" }),
|
|
5848
5908
|
"Clear sort"
|
|
5849
5909
|
]
|
|
5850
5910
|
}
|
|
5851
5911
|
) : null
|
|
5852
5912
|
] }),
|
|
5853
|
-
filterKind ? /* @__PURE__ */ (0,
|
|
5913
|
+
filterKind ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "mb-2 h-px bg-border" }) : null
|
|
5854
5914
|
] }) : null,
|
|
5855
|
-
filterKind ? /* @__PURE__ */ (0,
|
|
5915
|
+
filterKind ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5856
5916
|
FilterBody,
|
|
5857
5917
|
{
|
|
5858
5918
|
kind: filterKind,
|
|
@@ -5867,10 +5927,10 @@ function ColumnHeaderCell({
|
|
|
5867
5927
|
allowNullModes
|
|
5868
5928
|
}
|
|
5869
5929
|
) : null,
|
|
5870
|
-
filterKind && visibleFilter && allowNegation ? /* @__PURE__ */ (0,
|
|
5871
|
-
/* @__PURE__ */ (0,
|
|
5872
|
-
/* @__PURE__ */ (0,
|
|
5873
|
-
/* @__PURE__ */ (0,
|
|
5930
|
+
filterKind && visibleFilter && allowNegation ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "mt-2 border-t border-border pt-2", children: [
|
|
5931
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "mb-1 text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: "Match mode" }),
|
|
5932
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "grid grid-cols-2 gap-1 rounded-md border p-0.5", children: [
|
|
5933
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5874
5934
|
"button",
|
|
5875
5935
|
{
|
|
5876
5936
|
type: "button",
|
|
@@ -5883,7 +5943,7 @@ function ColumnHeaderCell({
|
|
|
5883
5943
|
children: "Include"
|
|
5884
5944
|
}
|
|
5885
5945
|
),
|
|
5886
|
-
/* @__PURE__ */ (0,
|
|
5946
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5887
5947
|
"button",
|
|
5888
5948
|
{
|
|
5889
5949
|
type: "button",
|
|
@@ -5898,11 +5958,11 @@ function ColumnHeaderCell({
|
|
|
5898
5958
|
)
|
|
5899
5959
|
] })
|
|
5900
5960
|
] }) : null,
|
|
5901
|
-
filterKind && deferredFilter ? /* @__PURE__ */ (0,
|
|
5902
|
-
filterFooterHint ? /* @__PURE__ */ (0,
|
|
5903
|
-
/* @__PURE__ */ (0,
|
|
5904
|
-
filterShowCancel ? /* @__PURE__ */ (0,
|
|
5905
|
-
/* @__PURE__ */ (0,
|
|
5961
|
+
filterKind && deferredFilter ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "mt-2 border-t border-border pt-2", children: [
|
|
5962
|
+
filterFooterHint ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "mb-2 text-xs text-muted-foreground", children: filterFooterHint }) : null,
|
|
5963
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex justify-end gap-2", children: [
|
|
5964
|
+
filterShowCancel ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: cancelFilter, children: "Cancel" }) : null,
|
|
5965
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Button, { type: "button", size: "sm", onClick: applyFilter, children: filterApplyLabel ?? "Apply" })
|
|
5906
5966
|
] })
|
|
5907
5967
|
] }) : null
|
|
5908
5968
|
]
|
|
@@ -5911,10 +5971,10 @@ function ColumnHeaderCell({
|
|
|
5911
5971
|
if (compact) {
|
|
5912
5972
|
if (!sortable && !filterKind) {
|
|
5913
5973
|
if (!reorderEnabled) {
|
|
5914
|
-
return /* @__PURE__ */ (0,
|
|
5974
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: cn("flex items-center justify-center", className), children: label });
|
|
5915
5975
|
}
|
|
5916
|
-
return /* @__PURE__ */ (0,
|
|
5917
|
-
/* @__PURE__ */ (0,
|
|
5976
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: cn("flex items-center justify-center", className), children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tooltip, { children: [
|
|
5977
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5918
5978
|
HeaderButton,
|
|
5919
5979
|
{
|
|
5920
5980
|
type: "button",
|
|
@@ -5926,14 +5986,14 @@ function ColumnHeaderCell({
|
|
|
5926
5986
|
children: label
|
|
5927
5987
|
}
|
|
5928
5988
|
) }),
|
|
5929
|
-
/* @__PURE__ */ (0,
|
|
5989
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(TooltipContent, { children: [
|
|
5930
5990
|
"Drag to reorder ",
|
|
5931
5991
|
reorderLabel,
|
|
5932
5992
|
"."
|
|
5933
5993
|
] })
|
|
5934
5994
|
] }) });
|
|
5935
5995
|
}
|
|
5936
|
-
return /* @__PURE__ */ (0,
|
|
5996
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5937
5997
|
"div",
|
|
5938
5998
|
{
|
|
5939
5999
|
className: cn(
|
|
@@ -5941,9 +6001,9 @@ function ColumnHeaderCell({
|
|
|
5941
6001
|
align === "right" ? "justify-end" : "justify-center",
|
|
5942
6002
|
className
|
|
5943
6003
|
),
|
|
5944
|
-
children: /* @__PURE__ */ (0,
|
|
5945
|
-
/* @__PURE__ */ (0,
|
|
5946
|
-
/* @__PURE__ */ (0,
|
|
6004
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Popover, { open: filterOpen, onOpenChange: setFilterOpen, children: [
|
|
6005
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tooltip, { children: [
|
|
6006
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5947
6007
|
HeaderButton,
|
|
5948
6008
|
{
|
|
5949
6009
|
type: "button",
|
|
@@ -5961,8 +6021,8 @@ function ColumnHeaderCell({
|
|
|
5961
6021
|
),
|
|
5962
6022
|
children: [
|
|
5963
6023
|
label,
|
|
5964
|
-
isSorted ? sortDirection === "asc" ? /* @__PURE__ */ (0,
|
|
5965
|
-
filterActive ? /* @__PURE__ */ (0,
|
|
6024
|
+
isSorted ? sortDirection === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowUp, { className: "absolute -top-1 right-0 h-2 w-2 text-primary" }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowDown, { className: "absolute -top-1 right-0 h-2 w-2 text-primary" }) : null,
|
|
6025
|
+
filterActive ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
5966
6026
|
"span",
|
|
5967
6027
|
{
|
|
5968
6028
|
"aria-hidden": true,
|
|
@@ -5972,7 +6032,7 @@ function ColumnHeaderCell({
|
|
|
5972
6032
|
]
|
|
5973
6033
|
}
|
|
5974
6034
|
) }) }),
|
|
5975
|
-
/* @__PURE__ */ (0,
|
|
6035
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(TooltipContent, { children: [
|
|
5976
6036
|
"Canonical Matrx table \xB7 ",
|
|
5977
6037
|
menuLabel
|
|
5978
6038
|
] })
|
|
@@ -5982,7 +6042,7 @@ function ColumnHeaderCell({
|
|
|
5982
6042
|
}
|
|
5983
6043
|
);
|
|
5984
6044
|
}
|
|
5985
|
-
return /* @__PURE__ */ (0,
|
|
6045
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5986
6046
|
"div",
|
|
5987
6047
|
{
|
|
5988
6048
|
className: cn(
|
|
@@ -5992,8 +6052,8 @@ function ColumnHeaderCell({
|
|
|
5992
6052
|
className
|
|
5993
6053
|
),
|
|
5994
6054
|
children: [
|
|
5995
|
-
sortable ? /* @__PURE__ */ (0,
|
|
5996
|
-
/* @__PURE__ */ (0,
|
|
6055
|
+
sortable ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tooltip, { children: [
|
|
6056
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
5997
6057
|
HeaderButton,
|
|
5998
6058
|
{
|
|
5999
6059
|
type: "button",
|
|
@@ -6005,14 +6065,14 @@ function ColumnHeaderCell({
|
|
|
6005
6065
|
isSorted ? "text-foreground" : "text-muted-foreground hover:text-foreground"
|
|
6006
6066
|
),
|
|
6007
6067
|
children: [
|
|
6008
|
-
/* @__PURE__ */ (0,
|
|
6009
|
-
isSorted ? sortDirection === "asc" ? /* @__PURE__ */ (0,
|
|
6068
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "truncate", children: label }),
|
|
6069
|
+
isSorted ? sortDirection === "asc" ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowUp, { className: "h-3 w-3 shrink-0 text-primary" }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowDown, { className: "h-3 w-3 shrink-0 text-primary" }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowUpDown, { className: "h-3 w-3 shrink-0 opacity-40" })
|
|
6010
6070
|
]
|
|
6011
6071
|
}
|
|
6012
6072
|
) }),
|
|
6013
|
-
/* @__PURE__ */ (0,
|
|
6014
|
-
] }) : reorderEnabled ? /* @__PURE__ */ (0,
|
|
6015
|
-
/* @__PURE__ */ (0,
|
|
6073
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipContent, { children: reorderEnabled ? `Drag to reorder ${reorderLabel}.` : labelText ?? "Sort column" })
|
|
6074
|
+
] }) : reorderEnabled ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tooltip, { children: [
|
|
6075
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6016
6076
|
HeaderButton,
|
|
6017
6077
|
{
|
|
6018
6078
|
type: "button",
|
|
@@ -6024,16 +6084,16 @@ function ColumnHeaderCell({
|
|
|
6024
6084
|
children: label
|
|
6025
6085
|
}
|
|
6026
6086
|
) }),
|
|
6027
|
-
/* @__PURE__ */ (0,
|
|
6087
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(TooltipContent, { children: [
|
|
6028
6088
|
"Drag to reorder ",
|
|
6029
6089
|
reorderLabel,
|
|
6030
6090
|
"."
|
|
6031
6091
|
] })
|
|
6032
|
-
] }) : /* @__PURE__ */ (0,
|
|
6033
|
-
filterKind || sortable ? /* @__PURE__ */ (0,
|
|
6034
|
-
/* @__PURE__ */ (0,
|
|
6035
|
-
/* @__PURE__ */ (0,
|
|
6036
|
-
/* @__PURE__ */ (0,
|
|
6092
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "truncate text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: label }),
|
|
6093
|
+
filterKind || sortable ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "inline-flex items-center", children: [
|
|
6094
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Popover, { open: filterOpen, onOpenChange: setFilterOpen, children: [
|
|
6095
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tooltip, { children: [
|
|
6096
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6037
6097
|
"button",
|
|
6038
6098
|
{
|
|
6039
6099
|
type: "button",
|
|
@@ -6045,15 +6105,15 @@ function ColumnHeaderCell({
|
|
|
6045
6105
|
"rounded p-0.5 transition-colors",
|
|
6046
6106
|
filterActive ? "text-primary hover:text-primary/80" : "text-muted-foreground/40 hover:text-muted-foreground"
|
|
6047
6107
|
),
|
|
6048
|
-
children: filterKind ? /* @__PURE__ */ (0,
|
|
6108
|
+
children: filterKind ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ListFilter, { className: cn("h-3 w-3", filterActive && "fill-primary/20") }) : /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(ArrowUpDown, { className: "h-3 w-3" })
|
|
6049
6109
|
}
|
|
6050
6110
|
) }) }),
|
|
6051
|
-
/* @__PURE__ */ (0,
|
|
6111
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipContent, { children: menuLabel })
|
|
6052
6112
|
] }),
|
|
6053
6113
|
menuContent
|
|
6054
6114
|
] }),
|
|
6055
|
-
filterActive ? /* @__PURE__ */ (0,
|
|
6056
|
-
/* @__PURE__ */ (0,
|
|
6115
|
+
filterActive ? /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Tooltip, { children: [
|
|
6116
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6057
6117
|
"button",
|
|
6058
6118
|
{
|
|
6059
6119
|
type: "button",
|
|
@@ -6063,10 +6123,10 @@ function ColumnHeaderCell({
|
|
|
6063
6123
|
onFilterChange(void 0);
|
|
6064
6124
|
},
|
|
6065
6125
|
className: "rounded p-0.5 text-primary hover:bg-muted hover:text-foreground",
|
|
6066
|
-
children: /* @__PURE__ */ (0,
|
|
6126
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(X, { className: "h-3 w-3" })
|
|
6067
6127
|
}
|
|
6068
6128
|
) }),
|
|
6069
|
-
/* @__PURE__ */ (0,
|
|
6129
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(TooltipContent, { children: labelText ? `Clear ${labelText} filter` : "Clear this filter" })
|
|
6070
6130
|
] }) : null
|
|
6071
6131
|
] }) : null
|
|
6072
6132
|
]
|
|
@@ -6091,14 +6151,14 @@ function FilterBody({
|
|
|
6091
6151
|
onChange({ kind: "text", value: "", mode: next });
|
|
6092
6152
|
}
|
|
6093
6153
|
};
|
|
6094
|
-
return /* @__PURE__ */ (0,
|
|
6095
|
-
/* @__PURE__ */ (0,
|
|
6096
|
-
/* @__PURE__ */ (0,
|
|
6154
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "space-y-1.5 px-1", children: [
|
|
6155
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: "Filter" }),
|
|
6156
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "flex gap-1", children: [
|
|
6097
6157
|
["contains", "Contains"],
|
|
6098
6158
|
["empty", "(empty)"],
|
|
6099
6159
|
["not_empty", "(not empty)"],
|
|
6100
6160
|
...allowNullModes ? [["null", "(null)"], ["not_null", "(not null)"]] : []
|
|
6101
|
-
].map(([m, label]) => /* @__PURE__ */ (0,
|
|
6161
|
+
].map(([m, label]) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6102
6162
|
"button",
|
|
6103
6163
|
{
|
|
6104
6164
|
type: "button",
|
|
@@ -6112,8 +6172,8 @@ function FilterBody({
|
|
|
6112
6172
|
},
|
|
6113
6173
|
m
|
|
6114
6174
|
)) }),
|
|
6115
|
-
mode === "contains" && /* @__PURE__ */ (0,
|
|
6116
|
-
/* @__PURE__ */ (0,
|
|
6175
|
+
mode === "contains" && /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "relative", children: [
|
|
6176
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6117
6177
|
Input,
|
|
6118
6178
|
{
|
|
6119
6179
|
"data-matrx-filter-autofocus": true,
|
|
@@ -6126,14 +6186,14 @@ function FilterBody({
|
|
|
6126
6186
|
style: { fontSize: "16px" }
|
|
6127
6187
|
}
|
|
6128
6188
|
),
|
|
6129
|
-
text ? /* @__PURE__ */ (0,
|
|
6189
|
+
text ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6130
6190
|
"button",
|
|
6131
6191
|
{
|
|
6132
6192
|
type: "button",
|
|
6133
6193
|
"aria-label": "Clear filter text",
|
|
6134
6194
|
className: "absolute right-1.5 top-1/2 -translate-y-1/2 rounded p-0.5 text-muted-foreground hover:text-foreground",
|
|
6135
6195
|
onClick: () => onChange(void 0),
|
|
6136
|
-
children: /* @__PURE__ */ (0,
|
|
6196
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(X, { className: "h-3.5 w-3.5" })
|
|
6137
6197
|
}
|
|
6138
6198
|
) : null
|
|
6139
6199
|
] })
|
|
@@ -6141,7 +6201,7 @@ function FilterBody({
|
|
|
6141
6201
|
}
|
|
6142
6202
|
if (kind === "select") {
|
|
6143
6203
|
const selected = value?.kind === "select" ? value.values ?? (value.value && value.value !== "__all__" ? [value.value] : []) : [];
|
|
6144
|
-
return /* @__PURE__ */ (0,
|
|
6204
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6145
6205
|
SearchableSelectFilter,
|
|
6146
6206
|
{
|
|
6147
6207
|
selected,
|
|
@@ -6153,9 +6213,9 @@ function FilterBody({
|
|
|
6153
6213
|
}
|
|
6154
6214
|
if (kind === "boolean") {
|
|
6155
6215
|
const current = value?.kind === "boolean" ? value.value : "__all__";
|
|
6156
|
-
return /* @__PURE__ */ (0,
|
|
6157
|
-
/* @__PURE__ */ (0,
|
|
6158
|
-
/* @__PURE__ */ (0,
|
|
6216
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "space-y-1.5 px-1", children: [
|
|
6217
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: "Filter" }),
|
|
6218
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
6159
6219
|
Select,
|
|
6160
6220
|
{
|
|
6161
6221
|
value: current === "__all__" ? "__all__" : current ? "true" : "false",
|
|
@@ -6164,18 +6224,18 @@ function FilterBody({
|
|
|
6164
6224
|
else onChange({ kind: "boolean", value: v === "true" });
|
|
6165
6225
|
},
|
|
6166
6226
|
children: [
|
|
6167
|
-
/* @__PURE__ */ (0,
|
|
6168
|
-
/* @__PURE__ */ (0,
|
|
6169
|
-
/* @__PURE__ */ (0,
|
|
6170
|
-
/* @__PURE__ */ (0,
|
|
6171
|
-
/* @__PURE__ */ (0,
|
|
6227
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectTrigger, { className: "h-8 text-xs", children: /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectValue, {}) }),
|
|
6228
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(SelectContent, { children: [
|
|
6229
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectItem, { value: "__all__", children: "All" }),
|
|
6230
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectItem, { value: "true", children: "Yes" }),
|
|
6231
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(SelectItem, { value: "false", children: "No" })
|
|
6172
6232
|
] })
|
|
6173
6233
|
]
|
|
6174
6234
|
}
|
|
6175
6235
|
)
|
|
6176
6236
|
] });
|
|
6177
6237
|
}
|
|
6178
|
-
return /* @__PURE__ */ (0,
|
|
6238
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(NumberFilterBody, { value, onChange });
|
|
6179
6239
|
}
|
|
6180
6240
|
function SearchableSelectFilter({
|
|
6181
6241
|
selected,
|
|
@@ -6183,8 +6243,8 @@ function SearchableSelectFilter({
|
|
|
6183
6243
|
onChange,
|
|
6184
6244
|
single = false
|
|
6185
6245
|
}) {
|
|
6186
|
-
const [query, setQuery] = (0,
|
|
6187
|
-
const filtered = (0,
|
|
6246
|
+
const [query, setQuery] = (0, import_react13.useState)("");
|
|
6247
|
+
const filtered = (0, import_react13.useMemo)(() => {
|
|
6188
6248
|
const q = query.trim().toLowerCase();
|
|
6189
6249
|
if (!q) return options;
|
|
6190
6250
|
return options.filter(
|
|
@@ -6203,13 +6263,13 @@ function SearchableSelectFilter({
|
|
|
6203
6263
|
next.length === 0 ? void 0 : { kind: "select", value: next[0] ?? "", values: next }
|
|
6204
6264
|
);
|
|
6205
6265
|
};
|
|
6206
|
-
return /* @__PURE__ */ (0,
|
|
6207
|
-
/* @__PURE__ */ (0,
|
|
6208
|
-
/* @__PURE__ */ (0,
|
|
6266
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "space-y-1 px-0", children: [
|
|
6267
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex items-center justify-between px-1 pb-1", children: [
|
|
6268
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("p", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: [
|
|
6209
6269
|
"Filter",
|
|
6210
6270
|
selected.length > 1 ? ` (any of ${selected.length})` : ""
|
|
6211
6271
|
] }),
|
|
6212
|
-
selected.length > 0 ? /* @__PURE__ */ (0,
|
|
6272
|
+
selected.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6213
6273
|
"button",
|
|
6214
6274
|
{
|
|
6215
6275
|
type: "button",
|
|
@@ -6219,8 +6279,8 @@ function SearchableSelectFilter({
|
|
|
6219
6279
|
}
|
|
6220
6280
|
) : null
|
|
6221
6281
|
] }),
|
|
6222
|
-
/* @__PURE__ */ (0,
|
|
6223
|
-
/* @__PURE__ */ (0,
|
|
6282
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(Command, { className: "rounded-md border border-border", shouldFilter: false, children: [
|
|
6283
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6224
6284
|
CommandInput,
|
|
6225
6285
|
{
|
|
6226
6286
|
"data-matrx-filter-autofocus": true,
|
|
@@ -6230,10 +6290,10 @@ function SearchableSelectFilter({
|
|
|
6230
6290
|
className: "h-8 text-sm"
|
|
6231
6291
|
}
|
|
6232
6292
|
),
|
|
6233
|
-
/* @__PURE__ */ (0,
|
|
6234
|
-
/* @__PURE__ */ (0,
|
|
6235
|
-
/* @__PURE__ */ (0,
|
|
6236
|
-
/* @__PURE__ */ (0,
|
|
6293
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(CommandList, { className: "max-h-48", children: [
|
|
6294
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(CommandEmpty, { className: "py-3 text-xs text-muted-foreground", children: "No matches" }),
|
|
6295
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(CommandGroup, { children: [
|
|
6296
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6237
6297
|
CommandItem,
|
|
6238
6298
|
{
|
|
6239
6299
|
value: "__all__",
|
|
@@ -6244,7 +6304,7 @@ function SearchableSelectFilter({
|
|
|
6244
6304
|
),
|
|
6245
6305
|
filtered.map((o) => {
|
|
6246
6306
|
const active = selected.includes(o.value);
|
|
6247
|
-
return /* @__PURE__ */ (0,
|
|
6307
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
|
|
6248
6308
|
CommandItem,
|
|
6249
6309
|
{
|
|
6250
6310
|
value: o.value,
|
|
@@ -6254,7 +6314,7 @@ function SearchableSelectFilter({
|
|
|
6254
6314
|
active && "bg-accent text-accent-foreground"
|
|
6255
6315
|
),
|
|
6256
6316
|
children: [
|
|
6257
|
-
/* @__PURE__ */ (0,
|
|
6317
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6258
6318
|
"span",
|
|
6259
6319
|
{
|
|
6260
6320
|
className: cn(
|
|
@@ -6262,7 +6322,7 @@ function SearchableSelectFilter({
|
|
|
6262
6322
|
single ? "rounded-full" : "rounded-sm",
|
|
6263
6323
|
active ? "border-primary bg-primary text-primary-foreground" : "border-muted-foreground/40"
|
|
6264
6324
|
),
|
|
6265
|
-
children: active && /* @__PURE__ */ (0,
|
|
6325
|
+
children: active && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Check, { className: "h-2.5 w-2.5" })
|
|
6266
6326
|
}
|
|
6267
6327
|
),
|
|
6268
6328
|
o.label
|
|
@@ -6282,8 +6342,8 @@ function NumberFilterBody({
|
|
|
6282
6342
|
}) {
|
|
6283
6343
|
const min = value?.kind === "number" ? value.min : void 0;
|
|
6284
6344
|
const max = value?.kind === "number" ? value.max : void 0;
|
|
6285
|
-
const [minText, setMinText] = (0,
|
|
6286
|
-
const [maxText, setMaxText] = (0,
|
|
6345
|
+
const [minText, setMinText] = (0, import_react13.useState)(min !== void 0 ? String(min) : "");
|
|
6346
|
+
const [maxText, setMaxText] = (0, import_react13.useState)(max !== void 0 ? String(max) : "");
|
|
6287
6347
|
const commit = (raw, which) => {
|
|
6288
6348
|
const nextMin = which === "min" ? parseOptionalNumber(raw) : min;
|
|
6289
6349
|
const nextMax = which === "max" ? parseOptionalNumber(raw) : max;
|
|
@@ -6293,10 +6353,10 @@ function NumberFilterBody({
|
|
|
6293
6353
|
}
|
|
6294
6354
|
onChange({ kind: "number", min: nextMin, max: nextMax });
|
|
6295
6355
|
};
|
|
6296
|
-
return /* @__PURE__ */ (0,
|
|
6297
|
-
/* @__PURE__ */ (0,
|
|
6298
|
-
/* @__PURE__ */ (0,
|
|
6299
|
-
(min !== void 0 || max !== void 0) && /* @__PURE__ */ (0,
|
|
6356
|
+
return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "space-y-1.5 px-1", children: [
|
|
6357
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex items-center justify-between", children: [
|
|
6358
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { className: "text-[11px] font-medium uppercase tracking-wider text-muted-foreground", children: "Range" }),
|
|
6359
|
+
(min !== void 0 || max !== void 0) && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6300
6360
|
"button",
|
|
6301
6361
|
{
|
|
6302
6362
|
type: "button",
|
|
@@ -6310,8 +6370,8 @@ function NumberFilterBody({
|
|
|
6310
6370
|
}
|
|
6311
6371
|
)
|
|
6312
6372
|
] }),
|
|
6313
|
-
/* @__PURE__ */ (0,
|
|
6314
|
-
/* @__PURE__ */ (0,
|
|
6373
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: "flex items-center gap-1.5", children: [
|
|
6374
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6315
6375
|
Input,
|
|
6316
6376
|
{
|
|
6317
6377
|
"data-matrx-filter-autofocus": true,
|
|
@@ -6326,8 +6386,8 @@ function NumberFilterBody({
|
|
|
6326
6386
|
style: { fontSize: "16px" }
|
|
6327
6387
|
}
|
|
6328
6388
|
),
|
|
6329
|
-
/* @__PURE__ */ (0,
|
|
6330
|
-
/* @__PURE__ */ (0,
|
|
6389
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { className: "text-xs text-muted-foreground", children: "\u2013" }),
|
|
6390
|
+
/* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
|
|
6331
6391
|
Input,
|
|
6332
6392
|
{
|
|
6333
6393
|
value: maxText,
|
|
@@ -6351,7 +6411,7 @@ function parseOptionalNumber(raw) {
|
|
|
6351
6411
|
}
|
|
6352
6412
|
|
|
6353
6413
|
// src/data-table/ColumnResizeHandle.tsx
|
|
6354
|
-
var
|
|
6414
|
+
var import_react14 = require("react");
|
|
6355
6415
|
|
|
6356
6416
|
// src/data-table/column-resize.ts
|
|
6357
6417
|
var DEFAULT_COLUMN_MIN_WIDTH = 80;
|
|
@@ -6379,7 +6439,7 @@ function normalizeColumnWidthMap(widths, knownColumnIds) {
|
|
|
6379
6439
|
}
|
|
6380
6440
|
|
|
6381
6441
|
// src/data-table/ColumnResizeHandle.tsx
|
|
6382
|
-
var
|
|
6442
|
+
var import_jsx_runtime32 = require("react/jsx-runtime");
|
|
6383
6443
|
var KEYBOARD_STEP = 8;
|
|
6384
6444
|
var KEYBOARD_LARGE_STEP = 24;
|
|
6385
6445
|
function ColumnResizeHandle({
|
|
@@ -6393,24 +6453,24 @@ function ColumnResizeHandle({
|
|
|
6393
6453
|
onResizeCancel,
|
|
6394
6454
|
onResizeCommit
|
|
6395
6455
|
}) {
|
|
6396
|
-
const handleRef = (0,
|
|
6397
|
-
const activeResizeRef = (0,
|
|
6398
|
-
const previewRafRef = (0,
|
|
6399
|
-
const queuedWidthRef = (0,
|
|
6400
|
-
const keyboardWidthRef = (0,
|
|
6401
|
-
const [announcedWidth, setAnnouncedWidth] = (0,
|
|
6456
|
+
const handleRef = (0, import_react14.useRef)(null);
|
|
6457
|
+
const activeResizeRef = (0, import_react14.useRef)(null);
|
|
6458
|
+
const previewRafRef = (0, import_react14.useRef)(null);
|
|
6459
|
+
const queuedWidthRef = (0, import_react14.useRef)(null);
|
|
6460
|
+
const keyboardWidthRef = (0, import_react14.useRef)(null);
|
|
6461
|
+
const [announcedWidth, setAnnouncedWidth] = (0, import_react14.useState)(null);
|
|
6402
6462
|
const bounds = resolveColumnResizeBounds(minWidth, maxWidth);
|
|
6403
6463
|
const cssVar = columnResizeCssVar(columnId2);
|
|
6404
|
-
const readWidth = (0,
|
|
6464
|
+
const readWidth = (0, import_react14.useCallback)(() => {
|
|
6405
6465
|
const header = handleRef.current?.closest("th");
|
|
6406
6466
|
const measured = header?.getBoundingClientRect().width ?? 0;
|
|
6407
6467
|
const computed = header ? Number.parseFloat(getComputedStyle(header).width) : 0;
|
|
6408
6468
|
return clampColumnWidth(measured || computed || keyboardWidthRef.current || bounds.minWidth, bounds);
|
|
6409
6469
|
}, [bounds]);
|
|
6410
|
-
const writePreview = (0,
|
|
6470
|
+
const writePreview = (0, import_react14.useCallback)((width) => {
|
|
6411
6471
|
tableRef.current?.style.setProperty(cssVar, `${width}px`);
|
|
6412
6472
|
}, [cssVar, tableRef]);
|
|
6413
|
-
const queuePreview = (0,
|
|
6473
|
+
const queuePreview = (0, import_react14.useCallback)((width) => {
|
|
6414
6474
|
queuedWidthRef.current = width;
|
|
6415
6475
|
if (previewRafRef.current !== null) return;
|
|
6416
6476
|
previewRafRef.current = requestAnimationFrame(() => {
|
|
@@ -6420,12 +6480,12 @@ function ColumnResizeHandle({
|
|
|
6420
6480
|
if (nextWidth !== null) writePreview(nextWidth);
|
|
6421
6481
|
});
|
|
6422
6482
|
}, [writePreview]);
|
|
6423
|
-
const clearQueuedPreview = (0,
|
|
6483
|
+
const clearQueuedPreview = (0, import_react14.useCallback)(() => {
|
|
6424
6484
|
if (previewRafRef.current !== null) cancelAnimationFrame(previewRafRef.current);
|
|
6425
6485
|
previewRafRef.current = null;
|
|
6426
6486
|
queuedWidthRef.current = null;
|
|
6427
6487
|
}, []);
|
|
6428
|
-
const finishPointerResize = (0,
|
|
6488
|
+
const finishPointerResize = (0, import_react14.useCallback)((commit) => {
|
|
6429
6489
|
const active = activeResizeRef.current;
|
|
6430
6490
|
if (!active) return;
|
|
6431
6491
|
activeResizeRef.current = null;
|
|
@@ -6445,7 +6505,7 @@ function ColumnResizeHandle({
|
|
|
6445
6505
|
handleRef.current.releasePointerCapture(active.pointerId);
|
|
6446
6506
|
}
|
|
6447
6507
|
}, [clearQueuedPreview, columnId2, cssVar, onResizeCancel, onResizeCommit, tableRef, writePreview]);
|
|
6448
|
-
(0,
|
|
6508
|
+
(0, import_react14.useEffect)(() => () => clearQueuedPreview(), [clearQueuedPreview]);
|
|
6449
6509
|
const onPointerDown = (event) => {
|
|
6450
6510
|
if (disabled || event.button !== 0 || !event.isPrimary) return;
|
|
6451
6511
|
event.preventDefault();
|
|
@@ -6498,7 +6558,7 @@ function ColumnResizeHandle({
|
|
|
6498
6558
|
onResizeCommit(columnId2, nextWidth);
|
|
6499
6559
|
};
|
|
6500
6560
|
const currentWidth = announcedWidth ?? keyboardWidthRef.current ?? bounds.minWidth;
|
|
6501
|
-
return /* @__PURE__ */ (0,
|
|
6561
|
+
return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
|
|
6502
6562
|
"button",
|
|
6503
6563
|
{
|
|
6504
6564
|
ref: handleRef,
|
|
@@ -6600,9 +6660,9 @@ function rankTableSearchRows(rows, columns, query, options = {}, extraText) {
|
|
|
6600
6660
|
}
|
|
6601
6661
|
|
|
6602
6662
|
// src/data-table/ColumnManager.tsx
|
|
6603
|
-
var
|
|
6663
|
+
var import_react15 = require("react");
|
|
6604
6664
|
var import_core2 = require("@dnd-kit/core");
|
|
6605
|
-
var
|
|
6665
|
+
var import_jsx_runtime33 = require("react/jsx-runtime");
|
|
6606
6666
|
function ColumnManager({
|
|
6607
6667
|
open,
|
|
6608
6668
|
onOpenChange,
|
|
@@ -6611,15 +6671,15 @@ function ColumnManager({
|
|
|
6611
6671
|
hidden,
|
|
6612
6672
|
onApply
|
|
6613
6673
|
}) {
|
|
6614
|
-
const byId = (0,
|
|
6674
|
+
const byId = (0, import_react15.useMemo)(
|
|
6615
6675
|
() => new Map(columns.map((column) => [columnId(column), column])),
|
|
6616
6676
|
[columns]
|
|
6617
6677
|
);
|
|
6618
|
-
const [draftOrder, setDraftOrder] = (0,
|
|
6619
|
-
const [draftHidden, setDraftHidden] = (0,
|
|
6620
|
-
const [draggedColumnId, setDraggedColumnId] = (0,
|
|
6621
|
-
const [dropTarget, setDropTarget] = (0,
|
|
6622
|
-
(0,
|
|
6678
|
+
const [draftOrder, setDraftOrder] = (0, import_react15.useState)(order);
|
|
6679
|
+
const [draftHidden, setDraftHidden] = (0, import_react15.useState)(() => new Set(hidden));
|
|
6680
|
+
const [draggedColumnId, setDraggedColumnId] = (0, import_react15.useState)(null);
|
|
6681
|
+
const [dropTarget, setDropTarget] = (0, import_react15.useState)(null);
|
|
6682
|
+
(0, import_react15.useEffect)(() => {
|
|
6623
6683
|
if (!open) return;
|
|
6624
6684
|
setDraftOrder(order);
|
|
6625
6685
|
setDraftHidden(new Set(hidden));
|
|
@@ -6676,18 +6736,18 @@ function ColumnManager({
|
|
|
6676
6736
|
if (target) moveTo(dragged, String(target));
|
|
6677
6737
|
}
|
|
6678
6738
|
});
|
|
6679
|
-
return /* @__PURE__ */ (0,
|
|
6680
|
-
/* @__PURE__ */ (0,
|
|
6681
|
-
/* @__PURE__ */ (0,
|
|
6682
|
-
/* @__PURE__ */ (0,
|
|
6739
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Dialog, { open, onOpenChange, children: /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(DialogContent, { className: "max-w-md", children: [
|
|
6740
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(DialogHeader, { children: [
|
|
6741
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DialogTitle, { children: "Columns" }),
|
|
6742
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(DialogDescription, { children: "Choose the columns to show and set their order." })
|
|
6683
6743
|
] }),
|
|
6684
|
-
/* @__PURE__ */ (0,
|
|
6744
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { className: "max-h-[55dvh] divide-y overflow-y-auto rounded-md border", children: draftOrder.map((id, index) => {
|
|
6685
6745
|
const column = byId.get(id);
|
|
6686
6746
|
if (!column) return null;
|
|
6687
6747
|
const label = typeof column.header === "string" ? column.header : id;
|
|
6688
6748
|
const hideable = column.hideable !== false;
|
|
6689
6749
|
const visible = !draftHidden.has(id);
|
|
6690
|
-
return /* @__PURE__ */ (0,
|
|
6750
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(
|
|
6691
6751
|
ColumnManagerDropTarget,
|
|
6692
6752
|
{
|
|
6693
6753
|
id,
|
|
@@ -6697,8 +6757,8 @@ function ColumnManager({
|
|
|
6697
6757
|
dropTarget === id && draggedColumnId !== id && "border-t-2 border-primary"
|
|
6698
6758
|
),
|
|
6699
6759
|
children: [
|
|
6700
|
-
/* @__PURE__ */ (0,
|
|
6701
|
-
/* @__PURE__ */ (0,
|
|
6760
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ColumnManagerDragHandle, { id, label }),
|
|
6761
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6702
6762
|
Checkbox,
|
|
6703
6763
|
{
|
|
6704
6764
|
checked: visible,
|
|
@@ -6715,8 +6775,8 @@ function ColumnManager({
|
|
|
6715
6775
|
}
|
|
6716
6776
|
}
|
|
6717
6777
|
),
|
|
6718
|
-
/* @__PURE__ */ (0,
|
|
6719
|
-
/* @__PURE__ */ (0,
|
|
6778
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "min-w-0 flex-1 truncate text-sm", children: label }),
|
|
6779
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6720
6780
|
Button,
|
|
6721
6781
|
{
|
|
6722
6782
|
type: "button",
|
|
@@ -6726,10 +6786,10 @@ function ColumnManager({
|
|
|
6726
6786
|
"aria-label": `Move ${label} earlier`,
|
|
6727
6787
|
disabled: index === 0,
|
|
6728
6788
|
onClick: () => move(id, -1),
|
|
6729
|
-
children: /* @__PURE__ */ (0,
|
|
6789
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ArrowUp, { className: "h-4 w-4" })
|
|
6730
6790
|
}
|
|
6731
6791
|
),
|
|
6732
|
-
/* @__PURE__ */ (0,
|
|
6792
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6733
6793
|
Button,
|
|
6734
6794
|
{
|
|
6735
6795
|
type: "button",
|
|
@@ -6739,7 +6799,7 @@ function ColumnManager({
|
|
|
6739
6799
|
"aria-label": `Move ${label} later`,
|
|
6740
6800
|
disabled: index === draftOrder.length - 1,
|
|
6741
6801
|
onClick: () => move(id, 1),
|
|
6742
|
-
children: /* @__PURE__ */ (0,
|
|
6802
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(ArrowDown, { className: "h-4 w-4" })
|
|
6743
6803
|
}
|
|
6744
6804
|
)
|
|
6745
6805
|
]
|
|
@@ -6747,9 +6807,9 @@ function ColumnManager({
|
|
|
6747
6807
|
id
|
|
6748
6808
|
);
|
|
6749
6809
|
}) }),
|
|
6750
|
-
/* @__PURE__ */ (0,
|
|
6751
|
-
/* @__PURE__ */ (0,
|
|
6752
|
-
/* @__PURE__ */ (0,
|
|
6810
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(DialogFooter, { children: [
|
|
6811
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Button, { type: "button", variant: "outline", onClick: () => onOpenChange(false), children: "Cancel" }),
|
|
6812
|
+
/* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6753
6813
|
Button,
|
|
6754
6814
|
{
|
|
6755
6815
|
type: "button",
|
|
@@ -6772,14 +6832,14 @@ function ColumnManagerDropTarget({
|
|
|
6772
6832
|
id: `matrx-column-manager:${id}`,
|
|
6773
6833
|
data: { matrxDragKind: "column-manager", columnId: id }
|
|
6774
6834
|
});
|
|
6775
|
-
return /* @__PURE__ */ (0,
|
|
6835
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("div", { ref: setNodeRef, "data-matrx-column-manager-drop-target": id, className, children });
|
|
6776
6836
|
}
|
|
6777
6837
|
function ColumnManagerDragHandle({ id, label }) {
|
|
6778
6838
|
const { attributes, listeners, setNodeRef } = (0, import_core2.useDraggable)({
|
|
6779
6839
|
id: `matrx-column-manager:${id}`,
|
|
6780
6840
|
data: { matrxDragKind: "column-manager", columnId: id }
|
|
6781
6841
|
});
|
|
6782
|
-
return /* @__PURE__ */ (0,
|
|
6842
|
+
return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
|
|
6783
6843
|
"button",
|
|
6784
6844
|
{
|
|
6785
6845
|
ref: setNodeRef,
|
|
@@ -6789,7 +6849,7 @@ function ColumnManagerDragHandle({ id, label }) {
|
|
|
6789
6849
|
title: `Drag to reorder ${label}`,
|
|
6790
6850
|
...attributes,
|
|
6791
6851
|
...listeners,
|
|
6792
|
-
children: /* @__PURE__ */ (0,
|
|
6852
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(GripVertical, { className: "h-4 w-4" })
|
|
6793
6853
|
}
|
|
6794
6854
|
);
|
|
6795
6855
|
}
|
|
@@ -6852,8 +6912,8 @@ function parseTableViewSnapshot(raw) {
|
|
|
6852
6912
|
}
|
|
6853
6913
|
|
|
6854
6914
|
// src/data-table/MatrxUuidCell.tsx
|
|
6855
|
-
var
|
|
6856
|
-
var
|
|
6915
|
+
var import_react16 = require("react");
|
|
6916
|
+
var import_jsx_runtime34 = require("react/jsx-runtime");
|
|
6857
6917
|
var SHORT_LEN = 8;
|
|
6858
6918
|
function shortUuid(id, len = SHORT_LEN) {
|
|
6859
6919
|
return id.slice(0, len);
|
|
@@ -6892,18 +6952,18 @@ function MatrxUuidCell({
|
|
|
6892
6952
|
}) {
|
|
6893
6953
|
const { resolveEntityDoors, ResourcePeek } = useMatrxDataTableHost();
|
|
6894
6954
|
const { notify, notice } = useTableNotice();
|
|
6895
|
-
const [copied, setCopied] = (0,
|
|
6896
|
-
const [opening, setOpening] = (0,
|
|
6897
|
-
const [peekOpen, setPeekOpen] = (0,
|
|
6898
|
-
const timer = (0,
|
|
6899
|
-
(0,
|
|
6955
|
+
const [copied, setCopied] = (0, import_react16.useState)(false);
|
|
6956
|
+
const [opening, setOpening] = (0, import_react16.useState)(false);
|
|
6957
|
+
const [peekOpen, setPeekOpen] = (0, import_react16.useState)(false);
|
|
6958
|
+
const timer = (0, import_react16.useRef)(null);
|
|
6959
|
+
(0, import_react16.useEffect)(
|
|
6900
6960
|
() => () => {
|
|
6901
6961
|
if (timer.current) clearTimeout(timer.current);
|
|
6902
6962
|
},
|
|
6903
6963
|
[]
|
|
6904
6964
|
);
|
|
6905
6965
|
if (!value) {
|
|
6906
|
-
return /* @__PURE__ */ (0,
|
|
6966
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-muted-foreground/40", children: "\u2014" });
|
|
6907
6967
|
}
|
|
6908
6968
|
const doors = token ? resolveEntityDoors?.(token, value, href) ?? null : null;
|
|
6909
6969
|
const resolvedHref = doors?.href ?? href ?? null;
|
|
@@ -6946,13 +7006,13 @@ function MatrxUuidCell({
|
|
|
6946
7006
|
};
|
|
6947
7007
|
const idNode = (() => {
|
|
6948
7008
|
if (forbidden) {
|
|
6949
|
-
return /* @__PURE__ */ (0,
|
|
6950
|
-
/* @__PURE__ */ (0,
|
|
6951
|
-
/* @__PURE__ */ (0,
|
|
7009
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: "inline-flex min-w-0 items-center gap-1 font-mono text-xs text-muted-foreground/70 tabular-nums", children: [
|
|
7010
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "min-w-0 truncate", children: display }),
|
|
7011
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ShieldOff, { className: "h-3 w-3 shrink-0 opacity-60", "aria-hidden": true })
|
|
6952
7012
|
] });
|
|
6953
7013
|
}
|
|
6954
7014
|
if (onOpen) {
|
|
6955
|
-
return /* @__PURE__ */ (0,
|
|
7015
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6956
7016
|
"button",
|
|
6957
7017
|
{
|
|
6958
7018
|
type: "button",
|
|
@@ -6961,14 +7021,14 @@ function MatrxUuidCell({
|
|
|
6961
7021
|
disabled: opening,
|
|
6962
7022
|
className: "inline-flex min-w-0 items-center gap-1 font-mono text-xs text-sky-600 hover:underline dark:text-sky-400 disabled:opacity-60",
|
|
6963
7023
|
children: [
|
|
6964
|
-
/* @__PURE__ */ (0,
|
|
6965
|
-
/* @__PURE__ */ (0,
|
|
7024
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "min-w-0 truncate tabular-nums", children: display }),
|
|
7025
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(PanelRight, { className: "h-3 w-3 shrink-0 opacity-50" })
|
|
6966
7026
|
]
|
|
6967
7027
|
}
|
|
6968
7028
|
);
|
|
6969
7029
|
}
|
|
6970
7030
|
if (resolvedHref) {
|
|
6971
|
-
return /* @__PURE__ */ (0,
|
|
7031
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6972
7032
|
"a",
|
|
6973
7033
|
{
|
|
6974
7034
|
href: resolvedHref,
|
|
@@ -6978,15 +7038,15 @@ function MatrxUuidCell({
|
|
|
6978
7038
|
onClick: stop,
|
|
6979
7039
|
className: "inline-flex min-w-0 items-center gap-1 font-mono text-xs text-sky-600 hover:underline dark:text-sky-400",
|
|
6980
7040
|
children: [
|
|
6981
|
-
/* @__PURE__ */ (0,
|
|
6982
|
-
/* @__PURE__ */ (0,
|
|
7041
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "min-w-0 truncate tabular-nums", children: display }),
|
|
7042
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ExternalLink, { className: "h-3 w-3 shrink-0 opacity-50" })
|
|
6983
7043
|
]
|
|
6984
7044
|
}
|
|
6985
7045
|
);
|
|
6986
7046
|
}
|
|
6987
|
-
return /* @__PURE__ */ (0,
|
|
7047
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "min-w-0 truncate font-mono text-xs text-muted-foreground tabular-nums select-all", children: display });
|
|
6988
7048
|
})();
|
|
6989
|
-
return /* @__PURE__ */ (0,
|
|
7049
|
+
return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(
|
|
6990
7050
|
"span",
|
|
6991
7051
|
{
|
|
6992
7052
|
"data-matrx-cell-control": true,
|
|
@@ -6996,12 +7056,12 @@ function MatrxUuidCell({
|
|
|
6996
7056
|
),
|
|
6997
7057
|
onClick: stop,
|
|
6998
7058
|
children: [
|
|
6999
|
-
/* @__PURE__ */ (0,
|
|
7000
|
-
/* @__PURE__ */ (0,
|
|
7001
|
-
/* @__PURE__ */ (0,
|
|
7059
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(Tooltip, { children: [
|
|
7060
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "inline-flex min-w-0 max-w-full items-center", children: idNode }) }),
|
|
7061
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipContent, { side: "top", className: "max-w-sm break-all font-mono", children: forbidden ? `No access \xB7 ${tip}` : tip })
|
|
7002
7062
|
] }),
|
|
7003
|
-
/* @__PURE__ */ (0,
|
|
7004
|
-
/* @__PURE__ */ (0,
|
|
7063
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(Tooltip, { children: [
|
|
7064
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
7005
7065
|
"button",
|
|
7006
7066
|
{
|
|
7007
7067
|
type: "button",
|
|
@@ -7011,13 +7071,13 @@ function MatrxUuidCell({
|
|
|
7011
7071
|
"inline-flex h-4 w-4 shrink-0 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground focus:outline-none",
|
|
7012
7072
|
copied && "text-primary"
|
|
7013
7073
|
),
|
|
7014
|
-
children: copied ? /* @__PURE__ */ (0,
|
|
7074
|
+
children: copied ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Check, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Copy, { className: "h-3 w-3" })
|
|
7015
7075
|
}
|
|
7016
7076
|
) }),
|
|
7017
|
-
/* @__PURE__ */ (0,
|
|
7077
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipContent, { side: "top", children: copied ? "Copied" : `Copy ${label ?? "id"}: ${value}` })
|
|
7018
7078
|
] }),
|
|
7019
|
-
canPeek ? /* @__PURE__ */ (0,
|
|
7020
|
-
/* @__PURE__ */ (0,
|
|
7079
|
+
canPeek ? /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(Tooltip, { children: [
|
|
7080
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
7021
7081
|
"button",
|
|
7022
7082
|
{
|
|
7023
7083
|
type: "button",
|
|
@@ -7027,16 +7087,16 @@ function MatrxUuidCell({
|
|
|
7027
7087
|
},
|
|
7028
7088
|
"aria-label": `Quick look at ${label ?? "record"}`,
|
|
7029
7089
|
className: "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground focus:outline-none",
|
|
7030
|
-
children: /* @__PURE__ */ (0,
|
|
7090
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Lightbulb, { className: "h-3 w-3" })
|
|
7031
7091
|
}
|
|
7032
7092
|
) }),
|
|
7033
|
-
/* @__PURE__ */ (0,
|
|
7093
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(TooltipContent, { side: "top", children: [
|
|
7034
7094
|
"Quick look at ",
|
|
7035
7095
|
label ?? "record"
|
|
7036
7096
|
] })
|
|
7037
7097
|
] }) : null,
|
|
7038
|
-
onOpen && resolvedHref && !forbidden ? /* @__PURE__ */ (0,
|
|
7039
|
-
/* @__PURE__ */ (0,
|
|
7098
|
+
onOpen && resolvedHref && !forbidden ? /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(Tooltip, { children: [
|
|
7099
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
7040
7100
|
"a",
|
|
7041
7101
|
{
|
|
7042
7102
|
href: resolvedHref,
|
|
@@ -7045,10 +7105,10 @@ function MatrxUuidCell({
|
|
|
7045
7105
|
onClick: stop,
|
|
7046
7106
|
"aria-label": `Open ${label ?? "record"} in a new tab`,
|
|
7047
7107
|
className: "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded text-muted-foreground transition-colors hover:text-foreground focus:outline-none",
|
|
7048
|
-
children: /* @__PURE__ */ (0,
|
|
7108
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(ExternalLink, { className: "h-3 w-3" })
|
|
7049
7109
|
}
|
|
7050
7110
|
) }),
|
|
7051
|
-
/* @__PURE__ */ (0,
|
|
7111
|
+
/* @__PURE__ */ (0, import_jsx_runtime34.jsxs)(TooltipContent, { side: "top", children: [
|
|
7052
7112
|
"Open ",
|
|
7053
7113
|
label ?? "record",
|
|
7054
7114
|
" in a new tab"
|
|
@@ -7056,7 +7116,7 @@ function MatrxUuidCell({
|
|
|
7056
7116
|
] }) : null,
|
|
7057
7117
|
trailing,
|
|
7058
7118
|
notice,
|
|
7059
|
-
canPeek && peekOpen && ResourcePeek ? /* @__PURE__ */ (0,
|
|
7119
|
+
canPeek && peekOpen && ResourcePeek ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
|
|
7060
7120
|
ResourcePeek,
|
|
7061
7121
|
{
|
|
7062
7122
|
kind: doors?.peekKind ?? token ?? "record",
|
|
@@ -7090,7 +7150,7 @@ function formatTableDisplayValue(value) {
|
|
|
7090
7150
|
}
|
|
7091
7151
|
|
|
7092
7152
|
// src/data-table/DataRowInspector.tsx
|
|
7093
|
-
var
|
|
7153
|
+
var import_jsx_runtime35 = require("react/jsx-runtime");
|
|
7094
7154
|
var noFieldToken = () => null;
|
|
7095
7155
|
function formatValue(value) {
|
|
7096
7156
|
if (value == null) return "\u2014";
|
|
@@ -7119,7 +7179,7 @@ function DataRowInspector({
|
|
|
7119
7179
|
tokenForField = noFieldToken
|
|
7120
7180
|
}) {
|
|
7121
7181
|
const entries = isPlainObject(row) ? Object.entries(row) : [["value", row]];
|
|
7122
|
-
const fieldButtons = (key, value) => fieldCopy ? /* @__PURE__ */ (0,
|
|
7182
|
+
const fieldButtons = (key, value) => fieldCopy ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "absolute right-1 top-1 opacity-0 transition-opacity focus-within:opacity-100 group-hover/field:opacity-100", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7123
7183
|
CopyButtons,
|
|
7124
7184
|
{
|
|
7125
7185
|
size: "xs",
|
|
@@ -7134,21 +7194,21 @@ function DataRowInspector({
|
|
|
7134
7194
|
})
|
|
7135
7195
|
}
|
|
7136
7196
|
) }) : null;
|
|
7137
|
-
return /* @__PURE__ */ (0,
|
|
7197
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
7138
7198
|
"div",
|
|
7139
7199
|
{
|
|
7140
7200
|
className: cn("flex h-full min-h-0 flex-col overflow-hidden", className),
|
|
7141
7201
|
children: [
|
|
7142
|
-
title ? /* @__PURE__ */ (0,
|
|
7143
|
-
/* @__PURE__ */ (0,
|
|
7202
|
+
title ? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "shrink-0 border-b border-border px-3 py-2 text-sm font-medium", children: title }) : null,
|
|
7203
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "min-h-0 flex-1 overflow-auto p-3", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dl", { className: "space-y-2", children: entries.map(([key, value]) => {
|
|
7144
7204
|
if (isUuidValue(value)) {
|
|
7145
|
-
return /* @__PURE__ */ (0,
|
|
7205
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
7146
7206
|
"div",
|
|
7147
7207
|
{
|
|
7148
7208
|
className: "group/field relative grid grid-cols-[minmax(7rem,9rem)_1fr] gap-2 rounded-md border border-border/60 bg-muted/20 px-2.5 py-2",
|
|
7149
7209
|
children: [
|
|
7150
|
-
/* @__PURE__ */ (0,
|
|
7151
|
-
/* @__PURE__ */ (0,
|
|
7210
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dt", { className: "truncate text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: key }),
|
|
7211
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dd", { className: "min-w-0", children: /* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7152
7212
|
MatrxUuidCell,
|
|
7153
7213
|
{
|
|
7154
7214
|
value,
|
|
@@ -7163,13 +7223,13 @@ function DataRowInspector({
|
|
|
7163
7223
|
}
|
|
7164
7224
|
const formatted = value !== null && typeof value === "object" && !(value instanceof Date) ? formatValue(value) : formatTableDisplayValue(value);
|
|
7165
7225
|
const multiline = formatted.includes("\n") || formatted.length > 80;
|
|
7166
|
-
return /* @__PURE__ */ (0,
|
|
7226
|
+
return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)(
|
|
7167
7227
|
"div",
|
|
7168
7228
|
{
|
|
7169
7229
|
className: "group/field relative grid grid-cols-[minmax(7rem,9rem)_1fr] gap-2 rounded-md border border-border/60 bg-muted/20 py-2 pl-2.5 pr-12",
|
|
7170
7230
|
children: [
|
|
7171
|
-
/* @__PURE__ */ (0,
|
|
7172
|
-
/* @__PURE__ */ (0,
|
|
7231
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)("dt", { className: "truncate text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: key }),
|
|
7232
|
+
/* @__PURE__ */ (0, import_jsx_runtime35.jsx)(
|
|
7173
7233
|
"dd",
|
|
7174
7234
|
{
|
|
7175
7235
|
className: cn(
|
|
@@ -7191,8 +7251,8 @@ function DataRowInspector({
|
|
|
7191
7251
|
}
|
|
7192
7252
|
|
|
7193
7253
|
// src/data-table/DataRowWindow.tsx
|
|
7194
|
-
var
|
|
7195
|
-
var
|
|
7254
|
+
var import_react17 = require("react");
|
|
7255
|
+
var import_jsx_runtime36 = require("react/jsx-runtime");
|
|
7196
7256
|
function DataRowWindow({
|
|
7197
7257
|
isOpen,
|
|
7198
7258
|
onClose,
|
|
@@ -7212,15 +7272,15 @@ function DataRowWindow({
|
|
|
7212
7272
|
const hasEdit = editContent != null;
|
|
7213
7273
|
const hasTabs = hasEdit && children == null;
|
|
7214
7274
|
const initialTab = defaultTab ?? (hasEdit ? "edit" : "view");
|
|
7215
|
-
const [tab, setTab] = (0,
|
|
7216
|
-
(0,
|
|
7275
|
+
const [tab, setTab] = (0, import_react17.useState)(initialTab);
|
|
7276
|
+
(0, import_react17.useEffect)(() => {
|
|
7217
7277
|
if (!isOpen) return;
|
|
7218
7278
|
setTab(defaultTab ?? (hasEdit ? "edit" : "view"));
|
|
7219
7279
|
}, [isOpen, windowId, hasEdit, defaultTab]);
|
|
7220
7280
|
if (!isOpen) return null;
|
|
7221
|
-
const viewBody = viewContent ?? /* @__PURE__ */ (0,
|
|
7222
|
-
const body = children ?? /* @__PURE__ */ (0,
|
|
7223
|
-
return /* @__PURE__ */ (0,
|
|
7281
|
+
const viewBody = viewContent ?? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(DataRowInspector, { row });
|
|
7282
|
+
const body = children ?? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "flex h-full min-h-0 flex-1 flex-col overflow-hidden", children: hasTabs ? tab === "edit" ? /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children: editContent }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children: viewBody }) : /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "min-h-0 flex-1 overflow-y-auto", children: viewBody }) });
|
|
7283
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7224
7284
|
WindowPanel,
|
|
7225
7285
|
{
|
|
7226
7286
|
id: windowId,
|
|
@@ -7234,26 +7294,26 @@ function DataRowWindow({
|
|
|
7234
7294
|
bodyClassName: "flex min-h-0 flex-1 flex-col overflow-hidden p-0",
|
|
7235
7295
|
sidebarDefaultSize: 140,
|
|
7236
7296
|
sidebarMinSize: 110,
|
|
7237
|
-
sidebar: hasTabs ? /* @__PURE__ */ (0,
|
|
7297
|
+
sidebar: hasTabs ? /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
7238
7298
|
"nav",
|
|
7239
7299
|
{
|
|
7240
7300
|
"aria-label": "Row window tabs",
|
|
7241
7301
|
className: "flex h-full flex-col gap-0.5 overflow-y-auto p-1.5",
|
|
7242
7302
|
children: [
|
|
7243
|
-
/* @__PURE__ */ (0,
|
|
7303
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7244
7304
|
TabButton,
|
|
7245
7305
|
{
|
|
7246
7306
|
active: tab === "view",
|
|
7247
|
-
icon: /* @__PURE__ */ (0,
|
|
7307
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Eye, { className: "h-4 w-4 shrink-0" }),
|
|
7248
7308
|
label: "View",
|
|
7249
7309
|
onClick: () => setTab("view")
|
|
7250
7310
|
}
|
|
7251
7311
|
),
|
|
7252
|
-
/* @__PURE__ */ (0,
|
|
7312
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
|
|
7253
7313
|
TabButton,
|
|
7254
7314
|
{
|
|
7255
7315
|
active: tab === "edit",
|
|
7256
|
-
icon: /* @__PURE__ */ (0,
|
|
7316
|
+
icon: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Pencil, { className: "h-4 w-4 shrink-0" }),
|
|
7257
7317
|
label: "Edit",
|
|
7258
7318
|
onClick: () => setTab("edit")
|
|
7259
7319
|
}
|
|
@@ -7271,7 +7331,7 @@ function TabButton({
|
|
|
7271
7331
|
label,
|
|
7272
7332
|
onClick
|
|
7273
7333
|
}) {
|
|
7274
|
-
return /* @__PURE__ */ (0,
|
|
7334
|
+
return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)(
|
|
7275
7335
|
"button",
|
|
7276
7336
|
{
|
|
7277
7337
|
type: "button",
|
|
@@ -7284,7 +7344,7 @@ function TabButton({
|
|
|
7284
7344
|
),
|
|
7285
7345
|
children: [
|
|
7286
7346
|
icon,
|
|
7287
|
-
/* @__PURE__ */ (0,
|
|
7347
|
+
/* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "min-w-0 flex-1 truncate", children: label })
|
|
7288
7348
|
]
|
|
7289
7349
|
}
|
|
7290
7350
|
);
|
|
@@ -7307,7 +7367,7 @@ function defaultRowTitle(row, columns) {
|
|
|
7307
7367
|
}
|
|
7308
7368
|
|
|
7309
7369
|
// src/data-table/DirtySavePill.tsx
|
|
7310
|
-
var
|
|
7370
|
+
var import_jsx_runtime37 = require("react/jsx-runtime");
|
|
7311
7371
|
function DirtySavePill({
|
|
7312
7372
|
changeCount,
|
|
7313
7373
|
saving,
|
|
@@ -7316,20 +7376,20 @@ function DirtySavePill({
|
|
|
7316
7376
|
className
|
|
7317
7377
|
}) {
|
|
7318
7378
|
if (changeCount <= 0) return null;
|
|
7319
|
-
return /* @__PURE__ */ (0,
|
|
7379
|
+
return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
|
|
7320
7380
|
"div",
|
|
7321
7381
|
{
|
|
7322
7382
|
className: cn(
|
|
7323
7383
|
"pointer-events-none fixed inset-x-0 bottom-6 z-50 flex justify-center pb-safe",
|
|
7324
7384
|
className
|
|
7325
7385
|
),
|
|
7326
|
-
children: /* @__PURE__ */ (0,
|
|
7327
|
-
/* @__PURE__ */ (0,
|
|
7386
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("div", { className: "pointer-events-auto flex items-center gap-2 rounded-full border border-border bg-card px-3 py-1.5 shadow-lg elevation-2", children: [
|
|
7387
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)("span", { className: "px-1 text-xs font-medium text-muted-foreground", children: [
|
|
7328
7388
|
changeCount,
|
|
7329
7389
|
" unsaved change",
|
|
7330
7390
|
changeCount === 1 ? "" : "s"
|
|
7331
7391
|
] }),
|
|
7332
|
-
/* @__PURE__ */ (0,
|
|
7392
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
7333
7393
|
Button,
|
|
7334
7394
|
{
|
|
7335
7395
|
type: "button",
|
|
@@ -7339,12 +7399,12 @@ function DirtySavePill({
|
|
|
7339
7399
|
disabled: saving,
|
|
7340
7400
|
onClick: onCancel,
|
|
7341
7401
|
children: [
|
|
7342
|
-
/* @__PURE__ */ (0,
|
|
7402
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsx)(X, { className: "h-3.5 w-3.5" }),
|
|
7343
7403
|
"Cancel"
|
|
7344
7404
|
]
|
|
7345
7405
|
}
|
|
7346
7406
|
),
|
|
7347
|
-
/* @__PURE__ */ (0,
|
|
7407
|
+
/* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(
|
|
7348
7408
|
Button,
|
|
7349
7409
|
{
|
|
7350
7410
|
type: "button",
|
|
@@ -7353,7 +7413,7 @@ function DirtySavePill({
|
|
|
7353
7413
|
disabled: saving,
|
|
7354
7414
|
onClick: onSave,
|
|
7355
7415
|
children: [
|
|
7356
|
-
saving ? /* @__PURE__ */ (0,
|
|
7416
|
+
saving ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Loader2, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(Save, { className: "h-3.5 w-3.5" }),
|
|
7357
7417
|
"Save"
|
|
7358
7418
|
]
|
|
7359
7419
|
}
|
|
@@ -7364,8 +7424,8 @@ function DirtySavePill({
|
|
|
7364
7424
|
}
|
|
7365
7425
|
|
|
7366
7426
|
// src/data-table/EditableTableCell.tsx
|
|
7367
|
-
var
|
|
7368
|
-
var
|
|
7427
|
+
var import_react18 = require("react");
|
|
7428
|
+
var import_jsx_runtime38 = require("react/jsx-runtime");
|
|
7369
7429
|
function CellEditShell({
|
|
7370
7430
|
href,
|
|
7371
7431
|
display,
|
|
@@ -7374,8 +7434,8 @@ function CellEditShell({
|
|
|
7374
7434
|
editButton
|
|
7375
7435
|
}) {
|
|
7376
7436
|
const { Link: HostLink } = useMatrxDataTableHost();
|
|
7377
|
-
const Link = HostLink ?? ((props) => /* @__PURE__ */ (0,
|
|
7378
|
-
return /* @__PURE__ */ (0,
|
|
7437
|
+
const Link = HostLink ?? ((props) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("a", { ...props }));
|
|
7438
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
7379
7439
|
"span",
|
|
7380
7440
|
{
|
|
7381
7441
|
className: cn(
|
|
@@ -7387,7 +7447,7 @@ function CellEditShell({
|
|
|
7387
7447
|
className
|
|
7388
7448
|
),
|
|
7389
7449
|
children: [
|
|
7390
|
-
href ? /* @__PURE__ */ (0,
|
|
7450
|
+
href ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7391
7451
|
Link,
|
|
7392
7452
|
{
|
|
7393
7453
|
href,
|
|
@@ -7395,7 +7455,7 @@ function CellEditShell({
|
|
|
7395
7455
|
className: "min-w-0 flex-1 overflow-hidden truncate rounded outline-none focus-visible:ring-2 focus-visible:ring-ring",
|
|
7396
7456
|
children: display
|
|
7397
7457
|
}
|
|
7398
|
-
) : /* @__PURE__ */ (0,
|
|
7458
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "block min-w-0 flex-1 overflow-hidden", children: display }),
|
|
7399
7459
|
editButton
|
|
7400
7460
|
]
|
|
7401
7461
|
}
|
|
@@ -7413,10 +7473,10 @@ function EditableTableCell({
|
|
|
7413
7473
|
href,
|
|
7414
7474
|
editTrigger = "click"
|
|
7415
7475
|
}) {
|
|
7416
|
-
const [open, setOpen] = (0,
|
|
7476
|
+
const [open, setOpen] = (0, import_react18.useState)(false);
|
|
7417
7477
|
const usePencil = Boolean(href) || editTrigger === "pencil";
|
|
7418
7478
|
if (editType === "string") {
|
|
7419
|
-
return /* @__PURE__ */ (0,
|
|
7479
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7420
7480
|
InlineStringEditor,
|
|
7421
7481
|
{
|
|
7422
7482
|
value: stringifyCellValue(value),
|
|
@@ -7429,30 +7489,30 @@ function EditableTableCell({
|
|
|
7429
7489
|
}
|
|
7430
7490
|
);
|
|
7431
7491
|
}
|
|
7432
|
-
return /* @__PURE__ */ (0,
|
|
7433
|
-
usePencil ? /* @__PURE__ */ (0,
|
|
7492
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Popover, { open, onOpenChange: setOpen, children: [
|
|
7493
|
+
usePencil ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7434
7494
|
CellEditShell,
|
|
7435
7495
|
{
|
|
7436
7496
|
...href === void 0 ? {} : { href },
|
|
7437
7497
|
display,
|
|
7438
7498
|
...dirty === void 0 ? {} : { dirty },
|
|
7439
7499
|
...className === void 0 ? {} : { className },
|
|
7440
|
-
editButton: /* @__PURE__ */ (0,
|
|
7441
|
-
/* @__PURE__ */ (0,
|
|
7500
|
+
editButton: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Tooltip, { children: [
|
|
7501
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7442
7502
|
"button",
|
|
7443
7503
|
{
|
|
7444
7504
|
type: "button",
|
|
7445
7505
|
"aria-label": "Edit",
|
|
7446
7506
|
onClick: (e) => e.stopPropagation(),
|
|
7447
7507
|
className: CELL_PENCIL_CLASS,
|
|
7448
|
-
children: /* @__PURE__ */ (0,
|
|
7508
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Pencil, { className: "h-3 w-3" })
|
|
7449
7509
|
}
|
|
7450
7510
|
) }) }),
|
|
7451
|
-
/* @__PURE__ */ (0,
|
|
7511
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipContent, { children: "Edit" })
|
|
7452
7512
|
] })
|
|
7453
7513
|
}
|
|
7454
|
-
) : /* @__PURE__ */ (0,
|
|
7455
|
-
/* @__PURE__ */ (0,
|
|
7514
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Tooltip, { children: [
|
|
7515
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
7456
7516
|
"button",
|
|
7457
7517
|
{
|
|
7458
7518
|
type: "button",
|
|
@@ -7463,20 +7523,20 @@ function EditableTableCell({
|
|
|
7463
7523
|
className
|
|
7464
7524
|
),
|
|
7465
7525
|
children: [
|
|
7466
|
-
/* @__PURE__ */ (0,
|
|
7467
|
-
editType === "select" ? /* @__PURE__ */ (0,
|
|
7526
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "min-w-0 flex-1 overflow-hidden", children: display }),
|
|
7527
|
+
editType === "select" ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ChevronDown, { className: "h-3 w-3 shrink-0 text-muted-foreground/70 transition-colors group-hover/cell-select:text-foreground" }) : null
|
|
7468
7528
|
]
|
|
7469
7529
|
}
|
|
7470
7530
|
) }) }),
|
|
7471
|
-
/* @__PURE__ */ (0,
|
|
7531
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipContent, { children: "Edit value" })
|
|
7472
7532
|
] }),
|
|
7473
|
-
/* @__PURE__ */ (0,
|
|
7533
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7474
7534
|
PopoverContent,
|
|
7475
7535
|
{
|
|
7476
7536
|
align: "start",
|
|
7477
7537
|
className: "w-56 p-2",
|
|
7478
7538
|
onClick: (e) => e.stopPropagation(),
|
|
7479
|
-
children: /* @__PURE__ */ (0,
|
|
7539
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7480
7540
|
TypedEditor,
|
|
7481
7541
|
{
|
|
7482
7542
|
editType,
|
|
@@ -7502,19 +7562,19 @@ function InlineStringEditor({
|
|
|
7502
7562
|
href,
|
|
7503
7563
|
usePencil
|
|
7504
7564
|
}) {
|
|
7505
|
-
const [editing, setEditing] = (0,
|
|
7506
|
-
const [draft, setDraft] = (0,
|
|
7565
|
+
const [editing, setEditing] = (0, import_react18.useState)(false);
|
|
7566
|
+
const [draft, setDraft] = (0, import_react18.useState)(value);
|
|
7507
7567
|
if (!editing) {
|
|
7508
7568
|
if (usePencil) {
|
|
7509
|
-
return /* @__PURE__ */ (0,
|
|
7569
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7510
7570
|
CellEditShell,
|
|
7511
7571
|
{
|
|
7512
7572
|
...href === void 0 ? {} : { href },
|
|
7513
7573
|
display,
|
|
7514
7574
|
...dirty === void 0 ? {} : { dirty },
|
|
7515
7575
|
...className === void 0 ? {} : { className },
|
|
7516
|
-
editButton: /* @__PURE__ */ (0,
|
|
7517
|
-
/* @__PURE__ */ (0,
|
|
7576
|
+
editButton: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Tooltip, { children: [
|
|
7577
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7518
7578
|
"button",
|
|
7519
7579
|
{
|
|
7520
7580
|
type: "button",
|
|
@@ -7525,16 +7585,16 @@ function InlineStringEditor({
|
|
|
7525
7585
|
setEditing(true);
|
|
7526
7586
|
},
|
|
7527
7587
|
className: CELL_PENCIL_CLASS,
|
|
7528
|
-
children: /* @__PURE__ */ (0,
|
|
7588
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Pencil, { className: "h-3 w-3" })
|
|
7529
7589
|
}
|
|
7530
7590
|
) }),
|
|
7531
|
-
/* @__PURE__ */ (0,
|
|
7591
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipContent, { children: "Edit" })
|
|
7532
7592
|
] })
|
|
7533
7593
|
}
|
|
7534
7594
|
);
|
|
7535
7595
|
}
|
|
7536
|
-
return /* @__PURE__ */ (0,
|
|
7537
|
-
/* @__PURE__ */ (0,
|
|
7596
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Tooltip, { children: [
|
|
7597
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7538
7598
|
"button",
|
|
7539
7599
|
{
|
|
7540
7600
|
type: "button",
|
|
@@ -7551,10 +7611,10 @@ function InlineStringEditor({
|
|
|
7551
7611
|
children: display
|
|
7552
7612
|
}
|
|
7553
7613
|
) }),
|
|
7554
|
-
/* @__PURE__ */ (0,
|
|
7614
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipContent, { children: "Click to edit" })
|
|
7555
7615
|
] });
|
|
7556
7616
|
}
|
|
7557
|
-
return /* @__PURE__ */ (0,
|
|
7617
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7558
7618
|
Input,
|
|
7559
7619
|
{
|
|
7560
7620
|
autoFocus: true,
|
|
@@ -7590,9 +7650,9 @@ function TypedEditor({
|
|
|
7590
7650
|
}) {
|
|
7591
7651
|
if (editType === "boolean") {
|
|
7592
7652
|
const checked = Boolean(value);
|
|
7593
|
-
return /* @__PURE__ */ (0,
|
|
7594
|
-
/* @__PURE__ */ (0,
|
|
7595
|
-
/* @__PURE__ */ (0,
|
|
7653
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex items-center justify-between gap-2", children: [
|
|
7654
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "text-xs font-medium", children: "Value" }),
|
|
7655
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7596
7656
|
Checkbox,
|
|
7597
7657
|
{
|
|
7598
7658
|
checked,
|
|
@@ -7602,7 +7662,7 @@ function TypedEditor({
|
|
|
7602
7662
|
] });
|
|
7603
7663
|
}
|
|
7604
7664
|
if (editType === "number") {
|
|
7605
|
-
return /* @__PURE__ */ (0,
|
|
7665
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7606
7666
|
NumberEditor,
|
|
7607
7667
|
{
|
|
7608
7668
|
value: typeof value === "number" ? value : Number(value) || 0,
|
|
@@ -7612,7 +7672,7 @@ function TypedEditor({
|
|
|
7612
7672
|
);
|
|
7613
7673
|
}
|
|
7614
7674
|
if (editType === "tags") {
|
|
7615
|
-
return /* @__PURE__ */ (0,
|
|
7675
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7616
7676
|
TagsEditor,
|
|
7617
7677
|
{
|
|
7618
7678
|
value: Array.isArray(value) ? value.map(String) : [],
|
|
@@ -7623,19 +7683,19 @@ function TypedEditor({
|
|
|
7623
7683
|
);
|
|
7624
7684
|
}
|
|
7625
7685
|
if (editType === "select") {
|
|
7626
|
-
return /* @__PURE__ */ (0,
|
|
7686
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
7627
7687
|
Select,
|
|
7628
7688
|
{
|
|
7629
7689
|
value: stringifyCellValue(value),
|
|
7630
7690
|
onValueChange: (v) => onCommit(v),
|
|
7631
7691
|
children: [
|
|
7632
|
-
/* @__PURE__ */ (0,
|
|
7633
|
-
/* @__PURE__ */ (0,
|
|
7692
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SelectTrigger, { className: "h-8 text-xs", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SelectValue, {}) }),
|
|
7693
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SelectContent, { children: editOptions.map((o) => /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(SelectItem, { value: o.value, children: o.label }, o.value)) })
|
|
7634
7694
|
]
|
|
7635
7695
|
}
|
|
7636
7696
|
);
|
|
7637
7697
|
}
|
|
7638
|
-
return /* @__PURE__ */ (0,
|
|
7698
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7639
7699
|
Input,
|
|
7640
7700
|
{
|
|
7641
7701
|
type: "date",
|
|
@@ -7654,8 +7714,8 @@ function TagsEditor({
|
|
|
7654
7714
|
onCommit,
|
|
7655
7715
|
onCancel
|
|
7656
7716
|
}) {
|
|
7657
|
-
const [tags, setTags] = (0,
|
|
7658
|
-
const [draft, setDraft] = (0,
|
|
7717
|
+
const [tags, setTags] = (0, import_react18.useState)(value);
|
|
7718
|
+
const [draft, setDraft] = (0, import_react18.useState)("");
|
|
7659
7719
|
const add = (raw) => {
|
|
7660
7720
|
const next = raw.trim();
|
|
7661
7721
|
if (!next || tags.includes(next)) return;
|
|
@@ -7665,11 +7725,11 @@ function TagsEditor({
|
|
|
7665
7725
|
const matches = suggestions.filter(
|
|
7666
7726
|
(s) => !tags.includes(s.value) && s.value !== "__none__" && (!draft || s.label.toLowerCase().includes(draft.trim().toLowerCase()))
|
|
7667
7727
|
).slice(0, 6);
|
|
7668
|
-
return /* @__PURE__ */ (0,
|
|
7669
|
-
/* @__PURE__ */ (0,
|
|
7670
|
-
tags.length === 0 && /* @__PURE__ */ (0,
|
|
7671
|
-
tags.map((tag) => /* @__PURE__ */ (0,
|
|
7672
|
-
/* @__PURE__ */ (0,
|
|
7728
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "space-y-2", onClick: (e) => e.stopPropagation(), children: [
|
|
7729
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-wrap gap-1", children: [
|
|
7730
|
+
tags.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "text-xs text-muted-foreground", children: "No tags" }),
|
|
7731
|
+
tags.map((tag) => /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Tooltip, { children: [
|
|
7732
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
7673
7733
|
"button",
|
|
7674
7734
|
{
|
|
7675
7735
|
type: "button",
|
|
@@ -7678,17 +7738,17 @@ function TagsEditor({
|
|
|
7678
7738
|
className: "inline-flex items-center gap-1 rounded-full border border-border px-2 py-0.5 text-[11px] hover:border-destructive hover:text-destructive",
|
|
7679
7739
|
children: [
|
|
7680
7740
|
tag,
|
|
7681
|
-
/* @__PURE__ */ (0,
|
|
7741
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(X, { className: "h-2.5 w-2.5" })
|
|
7682
7742
|
]
|
|
7683
7743
|
}
|
|
7684
7744
|
) }),
|
|
7685
|
-
/* @__PURE__ */ (0,
|
|
7745
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(TooltipContent, { children: [
|
|
7686
7746
|
"Remove ",
|
|
7687
7747
|
tag
|
|
7688
7748
|
] })
|
|
7689
7749
|
] }, tag))
|
|
7690
7750
|
] }),
|
|
7691
|
-
/* @__PURE__ */ (0,
|
|
7751
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7692
7752
|
Input,
|
|
7693
7753
|
{
|
|
7694
7754
|
autoFocus: true,
|
|
@@ -7709,7 +7769,7 @@ function TagsEditor({
|
|
|
7709
7769
|
className: "h-8 text-xs"
|
|
7710
7770
|
}
|
|
7711
7771
|
),
|
|
7712
|
-
matches.length > 0 && /* @__PURE__ */ (0,
|
|
7772
|
+
matches.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "flex flex-wrap gap-1", children: matches.map((s) => /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
7713
7773
|
"button",
|
|
7714
7774
|
{
|
|
7715
7775
|
type: "button",
|
|
@@ -7722,8 +7782,8 @@ function TagsEditor({
|
|
|
7722
7782
|
},
|
|
7723
7783
|
s.value
|
|
7724
7784
|
)) }),
|
|
7725
|
-
/* @__PURE__ */ (0,
|
|
7726
|
-
/* @__PURE__ */ (0,
|
|
7785
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-end gap-1 pt-1", children: [
|
|
7786
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7727
7787
|
Button,
|
|
7728
7788
|
{
|
|
7729
7789
|
size: "sm",
|
|
@@ -7731,17 +7791,17 @@ function TagsEditor({
|
|
|
7731
7791
|
className: "h-7 px-2",
|
|
7732
7792
|
"aria-label": "Cancel edit",
|
|
7733
7793
|
onClick: onCancel,
|
|
7734
|
-
children: /* @__PURE__ */ (0,
|
|
7794
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(X, { className: "h-3.5 w-3.5" })
|
|
7735
7795
|
}
|
|
7736
7796
|
),
|
|
7737
|
-
/* @__PURE__ */ (0,
|
|
7797
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7738
7798
|
Button,
|
|
7739
7799
|
{
|
|
7740
7800
|
size: "sm",
|
|
7741
7801
|
className: "h-7 px-2",
|
|
7742
7802
|
"aria-label": "Apply tags",
|
|
7743
7803
|
onClick: () => onCommit(tags),
|
|
7744
|
-
children: /* @__PURE__ */ (0,
|
|
7804
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Check, { className: "h-3.5 w-3.5" })
|
|
7745
7805
|
}
|
|
7746
7806
|
)
|
|
7747
7807
|
] })
|
|
@@ -7752,9 +7812,9 @@ function NumberEditor({
|
|
|
7752
7812
|
onCommit,
|
|
7753
7813
|
onCancel
|
|
7754
7814
|
}) {
|
|
7755
|
-
const [draft, setDraft] = (0,
|
|
7756
|
-
return /* @__PURE__ */ (0,
|
|
7757
|
-
/* @__PURE__ */ (0,
|
|
7815
|
+
const [draft, setDraft] = (0, import_react18.useState)(String(value));
|
|
7816
|
+
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col gap-2", children: [
|
|
7817
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7758
7818
|
Input,
|
|
7759
7819
|
{
|
|
7760
7820
|
autoFocus: true,
|
|
@@ -7771,8 +7831,8 @@ function NumberEditor({
|
|
|
7771
7831
|
}
|
|
7772
7832
|
}
|
|
7773
7833
|
),
|
|
7774
|
-
/* @__PURE__ */ (0,
|
|
7775
|
-
/* @__PURE__ */ (0,
|
|
7834
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-end gap-1", children: [
|
|
7835
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7776
7836
|
Button,
|
|
7777
7837
|
{
|
|
7778
7838
|
type: "button",
|
|
@@ -7781,10 +7841,10 @@ function NumberEditor({
|
|
|
7781
7841
|
className: "h-7",
|
|
7782
7842
|
"aria-label": "Cancel edit",
|
|
7783
7843
|
onClick: onCancel,
|
|
7784
|
-
children: /* @__PURE__ */ (0,
|
|
7844
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(X, { className: "h-3.5 w-3.5" })
|
|
7785
7845
|
}
|
|
7786
7846
|
),
|
|
7787
|
-
/* @__PURE__ */ (0,
|
|
7847
|
+
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
|
|
7788
7848
|
Button,
|
|
7789
7849
|
{
|
|
7790
7850
|
type: "button",
|
|
@@ -7795,7 +7855,7 @@ function NumberEditor({
|
|
|
7795
7855
|
const n = Number(draft);
|
|
7796
7856
|
if (Number.isFinite(n)) onCommit(n);
|
|
7797
7857
|
},
|
|
7798
|
-
children: /* @__PURE__ */ (0,
|
|
7858
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Check, { className: "h-3.5 w-3.5" })
|
|
7799
7859
|
}
|
|
7800
7860
|
)
|
|
7801
7861
|
] })
|
|
@@ -7803,24 +7863,24 @@ function NumberEditor({
|
|
|
7803
7863
|
}
|
|
7804
7864
|
|
|
7805
7865
|
// src/data-table/ToolbarFacets.tsx
|
|
7806
|
-
var
|
|
7866
|
+
var import_jsx_runtime39 = require("react/jsx-runtime");
|
|
7807
7867
|
function ToolbarFacets({ facets }) {
|
|
7808
7868
|
if (facets.length === 0) return null;
|
|
7809
|
-
return /* @__PURE__ */ (0,
|
|
7869
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "flex flex-wrap items-center gap-2", children: facets.map((facet) => {
|
|
7810
7870
|
if (facet.type === "custom") {
|
|
7811
|
-
return /* @__PURE__ */ (0,
|
|
7871
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { children: facet.render() }, facet.id);
|
|
7812
7872
|
}
|
|
7813
7873
|
const defaultValue = facet.defaultValue ?? facet.options[0]?.value ?? "";
|
|
7814
7874
|
const isNonDefault = facet.value !== defaultValue;
|
|
7815
|
-
return /* @__PURE__ */ (0,
|
|
7875
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
7816
7876
|
"div",
|
|
7817
7877
|
{
|
|
7818
7878
|
className: "flex flex-wrap items-center gap-1.5 max-sm:grid max-sm:w-full max-sm:grid-cols-3",
|
|
7819
7879
|
children: [
|
|
7820
|
-
facet.label ? /* @__PURE__ */ (0,
|
|
7880
|
+
facet.label ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "mr-0.5 text-[11px] font-medium uppercase tracking-wide text-muted-foreground", children: facet.label }) : null,
|
|
7821
7881
|
facet.options.map((opt) => {
|
|
7822
7882
|
const active = facet.value === opt.value;
|
|
7823
|
-
return /* @__PURE__ */ (0,
|
|
7883
|
+
return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
|
|
7824
7884
|
Button,
|
|
7825
7885
|
{
|
|
7826
7886
|
type: "button",
|
|
@@ -7834,8 +7894,8 @@ function ToolbarFacets({ facets }) {
|
|
|
7834
7894
|
children: [
|
|
7835
7895
|
opt.icon,
|
|
7836
7896
|
opt.label,
|
|
7837
|
-
active && isNonDefault ? /* @__PURE__ */ (0,
|
|
7838
|
-
/* @__PURE__ */ (0,
|
|
7897
|
+
active && isNonDefault ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(TooltipProvider, { delayDuration: 200, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(Tooltip, { children: [
|
|
7898
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(
|
|
7839
7899
|
"span",
|
|
7840
7900
|
{
|
|
7841
7901
|
role: "button",
|
|
@@ -7853,10 +7913,10 @@ function ToolbarFacets({ facets }) {
|
|
|
7853
7913
|
facet.onChange(defaultValue);
|
|
7854
7914
|
}
|
|
7855
7915
|
},
|
|
7856
|
-
children: /* @__PURE__ */ (0,
|
|
7916
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(X, { className: "h-3 w-3" })
|
|
7857
7917
|
}
|
|
7858
7918
|
) }),
|
|
7859
|
-
/* @__PURE__ */ (0,
|
|
7919
|
+
/* @__PURE__ */ (0, import_jsx_runtime39.jsx)(TooltipContent, { side: "top", children: "Clear this filter" })
|
|
7860
7920
|
] }) }) : null
|
|
7861
7921
|
]
|
|
7862
7922
|
},
|
|
@@ -7882,8 +7942,8 @@ function resetToolbarFacets(facets) {
|
|
|
7882
7942
|
}
|
|
7883
7943
|
|
|
7884
7944
|
// src/data-table/LayeredFilterBuilder.tsx
|
|
7885
|
-
var
|
|
7886
|
-
var
|
|
7945
|
+
var import_react19 = require("react");
|
|
7946
|
+
var import_jsx_runtime40 = require("react/jsx-runtime");
|
|
7887
7947
|
function moveRule(rules, from, to) {
|
|
7888
7948
|
if (from === to || to < 0 || to >= rules.length) return [...rules];
|
|
7889
7949
|
const next = [...rules];
|
|
@@ -7899,8 +7959,8 @@ function LayeredFilterBuilder({
|
|
|
7899
7959
|
maxRules = 20,
|
|
7900
7960
|
label = "Advanced filters"
|
|
7901
7961
|
}) {
|
|
7902
|
-
const [open, setOpen] = (0,
|
|
7903
|
-
const [draggedIndex, setDraggedIndex] = (0,
|
|
7962
|
+
const [open, setOpen] = (0, import_react19.useState)(false);
|
|
7963
|
+
const [draggedIndex, setDraggedIndex] = (0, import_react19.useState)(null);
|
|
7904
7964
|
if (fields.length === 0) return null;
|
|
7905
7965
|
const updateRule = (index, patch) => {
|
|
7906
7966
|
onChange(
|
|
@@ -7929,8 +7989,8 @@ function LayeredFilterBuilder({
|
|
|
7929
7989
|
const reorder = (from, to) => {
|
|
7930
7990
|
onChange(moveRule(rules, from, to));
|
|
7931
7991
|
};
|
|
7932
|
-
return /* @__PURE__ */ (0,
|
|
7933
|
-
/* @__PURE__ */ (0,
|
|
7992
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-1", children: [
|
|
7993
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
7934
7994
|
Popover,
|
|
7935
7995
|
{
|
|
7936
7996
|
open,
|
|
@@ -7942,7 +8002,7 @@ function LayeredFilterBuilder({
|
|
|
7942
8002
|
}
|
|
7943
8003
|
},
|
|
7944
8004
|
children: [
|
|
7945
|
-
/* @__PURE__ */ (0,
|
|
8005
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
7946
8006
|
Button,
|
|
7947
8007
|
{
|
|
7948
8008
|
type: "button",
|
|
@@ -7951,25 +8011,25 @@ function LayeredFilterBuilder({
|
|
|
7951
8011
|
className: "h-8 gap-1.5 px-2 text-xs",
|
|
7952
8012
|
"aria-label": label,
|
|
7953
8013
|
children: [
|
|
7954
|
-
/* @__PURE__ */ (0,
|
|
7955
|
-
/* @__PURE__ */ (0,
|
|
7956
|
-
rules.length > 0 ? /* @__PURE__ */ (0,
|
|
8014
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SlidersHorizontal, { className: "h-3.5 w-3.5" }),
|
|
8015
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "hidden sm:inline", children: rules.length > 0 ? `${rules.length} layers` : "Advanced" }),
|
|
8016
|
+
rules.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "sm:hidden", children: rules.length }) : null
|
|
7957
8017
|
]
|
|
7958
8018
|
}
|
|
7959
8019
|
) }),
|
|
7960
|
-
/* @__PURE__ */ (0,
|
|
8020
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
7961
8021
|
PopoverContent,
|
|
7962
8022
|
{
|
|
7963
8023
|
align: "start",
|
|
7964
8024
|
sideOffset: 6,
|
|
7965
8025
|
className: "w-[min(46rem,calc(100vw-1rem))] p-0",
|
|
7966
8026
|
children: [
|
|
7967
|
-
/* @__PURE__ */ (0,
|
|
7968
|
-
/* @__PURE__ */ (0,
|
|
7969
|
-
/* @__PURE__ */ (0,
|
|
7970
|
-
/* @__PURE__ */ (0,
|
|
8027
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-start justify-between gap-3 border-b border-border px-3 py-2.5", children: [
|
|
8028
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { children: [
|
|
8029
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-sm font-semibold text-foreground", children: "Narrow these results" }),
|
|
8030
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-xs text-muted-foreground", children: "Every layer must match. Drag layers to put them in the order that makes sense to you." })
|
|
7971
8031
|
] }),
|
|
7972
|
-
rules.length > 0 ? /* @__PURE__ */ (0,
|
|
8032
|
+
rules.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7973
8033
|
Button,
|
|
7974
8034
|
{
|
|
7975
8035
|
type: "button",
|
|
@@ -7981,10 +8041,10 @@ function LayeredFilterBuilder({
|
|
|
7981
8041
|
}
|
|
7982
8042
|
) : null
|
|
7983
8043
|
] }),
|
|
7984
|
-
/* @__PURE__ */ (0,
|
|
7985
|
-
/* @__PURE__ */ (0,
|
|
7986
|
-
/* @__PURE__ */ (0,
|
|
7987
|
-
] }) : rules.map((rule, index) => /* @__PURE__ */ (0,
|
|
8044
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "max-h-[min(28rem,65dvh)] space-y-1.5 overflow-y-auto p-2.5 scrollbar-thin", children: rules.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "rounded-md border border-dashed border-border px-3 py-5 text-center", children: [
|
|
8045
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-sm font-medium text-foreground", children: "Start with one simple layer" }),
|
|
8046
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "mt-1 text-xs text-muted-foreground", children: "For example: Keyword contains ITAD, then Keyword doesn't have the word \u201Cwhat\u201D." })
|
|
8047
|
+
] }) : rules.map((rule, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
7988
8048
|
LayeredRuleRow,
|
|
7989
8049
|
{
|
|
7990
8050
|
index,
|
|
@@ -8004,9 +8064,9 @@ function LayeredFilterBuilder({
|
|
|
8004
8064
|
},
|
|
8005
8065
|
rule.id
|
|
8006
8066
|
)) }),
|
|
8007
|
-
/* @__PURE__ */ (0,
|
|
8008
|
-
/* @__PURE__ */ (0,
|
|
8009
|
-
/* @__PURE__ */ (0,
|
|
8067
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center justify-between gap-2 border-t border-border px-3 py-2", children: [
|
|
8068
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("p", { className: "text-[11px] text-muted-foreground", children: "The regular search still works and is applied before these layers." }),
|
|
8069
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8010
8070
|
Button,
|
|
8011
8071
|
{
|
|
8012
8072
|
type: "button",
|
|
@@ -8016,7 +8076,7 @@ function LayeredFilterBuilder({
|
|
|
8016
8076
|
disabled: rules.length >= maxRules,
|
|
8017
8077
|
onClick: addRule,
|
|
8018
8078
|
children: [
|
|
8019
|
-
/* @__PURE__ */ (0,
|
|
8079
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Plus, { className: "h-3.5 w-3.5" }),
|
|
8020
8080
|
" Add layer"
|
|
8021
8081
|
]
|
|
8022
8082
|
}
|
|
@@ -8028,7 +8088,7 @@ function LayeredFilterBuilder({
|
|
|
8028
8088
|
]
|
|
8029
8089
|
}
|
|
8030
8090
|
),
|
|
8031
|
-
rules.map((rule, index) => /* @__PURE__ */ (0,
|
|
8091
|
+
rules.map((rule, index) => /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8032
8092
|
"span",
|
|
8033
8093
|
{
|
|
8034
8094
|
className: cn(
|
|
@@ -8036,7 +8096,7 @@ function LayeredFilterBuilder({
|
|
|
8036
8096
|
isCompleteLayeredFilterRule(rule) ? "border-border bg-muted/50 text-foreground" : "border-dashed border-warning/50 bg-warning/10 text-warning"
|
|
8037
8097
|
),
|
|
8038
8098
|
children: [
|
|
8039
|
-
/* @__PURE__ */ (0,
|
|
8099
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8040
8100
|
"button",
|
|
8041
8101
|
{
|
|
8042
8102
|
type: "button",
|
|
@@ -8044,19 +8104,19 @@ function LayeredFilterBuilder({
|
|
|
8044
8104
|
onClick: () => setOpen(true),
|
|
8045
8105
|
title: isCompleteLayeredFilterRule(rule) ? layeredFilterRuleSummary(rule, fields) : `Layer ${index + 1} needs a value`,
|
|
8046
8106
|
children: [
|
|
8047
|
-
/* @__PURE__ */ (0,
|
|
8107
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "mr-1 text-muted-foreground", children: index + 1 }),
|
|
8048
8108
|
isCompleteLayeredFilterRule(rule) ? layeredFilterRuleSummary(rule, fields) : "Choose a value"
|
|
8049
8109
|
]
|
|
8050
8110
|
}
|
|
8051
8111
|
),
|
|
8052
|
-
/* @__PURE__ */ (0,
|
|
8112
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8053
8113
|
"button",
|
|
8054
8114
|
{
|
|
8055
8115
|
type: "button",
|
|
8056
8116
|
className: "shrink-0 rounded-full p-0.5 text-muted-foreground hover:bg-muted hover:text-foreground",
|
|
8057
8117
|
"aria-label": `Remove filter layer ${index + 1}`,
|
|
8058
8118
|
onClick: () => removeRule(index),
|
|
8059
|
-
children: /* @__PURE__ */ (0,
|
|
8119
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(X, { className: "h-3 w-3" })
|
|
8060
8120
|
}
|
|
8061
8121
|
)
|
|
8062
8122
|
]
|
|
@@ -8086,7 +8146,7 @@ function LayeredRuleRow({
|
|
|
8086
8146
|
event.preventDefault();
|
|
8087
8147
|
onKeyboardMove(event.key === "ArrowUp" ? -1 : 1);
|
|
8088
8148
|
};
|
|
8089
|
-
return /* @__PURE__ */ (0,
|
|
8149
|
+
return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8090
8150
|
"div",
|
|
8091
8151
|
{
|
|
8092
8152
|
className: cn(
|
|
@@ -8099,7 +8159,7 @@ function LayeredRuleRow({
|
|
|
8099
8159
|
onDrop(index);
|
|
8100
8160
|
},
|
|
8101
8161
|
children: [
|
|
8102
|
-
/* @__PURE__ */ (0,
|
|
8162
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8103
8163
|
"button",
|
|
8104
8164
|
{
|
|
8105
8165
|
type: "button",
|
|
@@ -8113,10 +8173,10 @@ function LayeredRuleRow({
|
|
|
8113
8173
|
},
|
|
8114
8174
|
onDragEnd,
|
|
8115
8175
|
onKeyDown: handleMoveKey,
|
|
8116
|
-
children: /* @__PURE__ */ (0,
|
|
8176
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(GripVertical, { className: "h-3.5 w-3.5" })
|
|
8117
8177
|
}
|
|
8118
8178
|
),
|
|
8119
|
-
/* @__PURE__ */ (0,
|
|
8179
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8120
8180
|
Select,
|
|
8121
8181
|
{
|
|
8122
8182
|
value: field.id,
|
|
@@ -8134,16 +8194,16 @@ function LayeredRuleRow({
|
|
|
8134
8194
|
});
|
|
8135
8195
|
},
|
|
8136
8196
|
children: [
|
|
8137
|
-
/* @__PURE__ */ (0,
|
|
8197
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8138
8198
|
SelectTrigger,
|
|
8139
8199
|
{
|
|
8140
8200
|
size: "sm",
|
|
8141
8201
|
className: "h-7 w-full text-xs max-sm:col-span-1",
|
|
8142
8202
|
"aria-label": `Filter layer ${index + 1} field`,
|
|
8143
|
-
children: /* @__PURE__ */ (0,
|
|
8203
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, {})
|
|
8144
8204
|
}
|
|
8145
8205
|
),
|
|
8146
|
-
/* @__PURE__ */ (0,
|
|
8206
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectContent, { children: fields.map((candidate) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8147
8207
|
SelectItem,
|
|
8148
8208
|
{
|
|
8149
8209
|
value: candidate.id,
|
|
@@ -8155,7 +8215,7 @@ function LayeredRuleRow({
|
|
|
8155
8215
|
]
|
|
8156
8216
|
}
|
|
8157
8217
|
),
|
|
8158
|
-
/* @__PURE__ */ (0,
|
|
8218
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8159
8219
|
Select,
|
|
8160
8220
|
{
|
|
8161
8221
|
value: rule.operator,
|
|
@@ -8167,35 +8227,35 @@ function LayeredRuleRow({
|
|
|
8167
8227
|
});
|
|
8168
8228
|
},
|
|
8169
8229
|
children: [
|
|
8170
|
-
/* @__PURE__ */ (0,
|
|
8230
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8171
8231
|
SelectTrigger,
|
|
8172
8232
|
{
|
|
8173
8233
|
size: "sm",
|
|
8174
8234
|
className: "h-7 w-full text-xs max-sm:col-start-2",
|
|
8175
8235
|
"aria-label": `Filter layer ${index + 1} operator`,
|
|
8176
|
-
children: /* @__PURE__ */ (0,
|
|
8236
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, {})
|
|
8177
8237
|
}
|
|
8178
8238
|
),
|
|
8179
|
-
/* @__PURE__ */ (0,
|
|
8239
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectContent, { children: operators.map((operator) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectItem, { value: operator, className: "text-xs", children: LAYERED_FILTER_OPERATOR_LABELS[operator] }, operator)) })
|
|
8180
8240
|
]
|
|
8181
8241
|
}
|
|
8182
8242
|
),
|
|
8183
|
-
/* @__PURE__ */ (0,
|
|
8243
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: "min-w-0 max-sm:col-span-3 max-sm:col-start-1", children: !needsValue ? /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "flex h-7 items-center px-2 text-xs text-muted-foreground", children: "No value needed" }) : field.kind === "select" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
|
|
8184
8244
|
Select,
|
|
8185
8245
|
{
|
|
8186
8246
|
value: rule.value,
|
|
8187
8247
|
onValueChange: (value) => onChange({ value }),
|
|
8188
8248
|
children: [
|
|
8189
|
-
/* @__PURE__ */ (0,
|
|
8249
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8190
8250
|
SelectTrigger,
|
|
8191
8251
|
{
|
|
8192
8252
|
size: "sm",
|
|
8193
8253
|
className: "h-7 w-full text-xs",
|
|
8194
8254
|
"aria-label": `Filter layer ${index + 1} value`,
|
|
8195
|
-
children: /* @__PURE__ */ (0,
|
|
8255
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectValue, {})
|
|
8196
8256
|
}
|
|
8197
8257
|
),
|
|
8198
|
-
/* @__PURE__ */ (0,
|
|
8258
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(SelectContent, { children: field.options.map((option) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8199
8259
|
SelectItem,
|
|
8200
8260
|
{
|
|
8201
8261
|
value: option.value,
|
|
@@ -8206,8 +8266,8 @@ function LayeredRuleRow({
|
|
|
8206
8266
|
)) })
|
|
8207
8267
|
]
|
|
8208
8268
|
}
|
|
8209
|
-
) : /* @__PURE__ */ (0,
|
|
8210
|
-
/* @__PURE__ */ (0,
|
|
8269
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
8270
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8211
8271
|
Input,
|
|
8212
8272
|
{
|
|
8213
8273
|
value: rule.value,
|
|
@@ -8218,9 +8278,9 @@ function LayeredRuleRow({
|
|
|
8218
8278
|
"aria-label": `Filter layer ${index + 1} value`
|
|
8219
8279
|
}
|
|
8220
8280
|
),
|
|
8221
|
-
rule.operator === "between" ? /* @__PURE__ */ (0,
|
|
8222
|
-
/* @__PURE__ */ (0,
|
|
8223
|
-
/* @__PURE__ */ (0,
|
|
8281
|
+
rule.operator === "between" ? /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(import_jsx_runtime40.Fragment, { children: [
|
|
8282
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "text-[11px] text-muted-foreground", children: "and" }),
|
|
8283
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8224
8284
|
Input,
|
|
8225
8285
|
{
|
|
8226
8286
|
value: rule.valueTo ?? "",
|
|
@@ -8233,7 +8293,7 @@ function LayeredRuleRow({
|
|
|
8233
8293
|
)
|
|
8234
8294
|
] }) : null
|
|
8235
8295
|
] }) }),
|
|
8236
|
-
/* @__PURE__ */ (0,
|
|
8296
|
+
/* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
|
|
8237
8297
|
Button,
|
|
8238
8298
|
{
|
|
8239
8299
|
type: "button",
|
|
@@ -8242,7 +8302,7 @@ function LayeredRuleRow({
|
|
|
8242
8302
|
className: "h-7 w-7 p-0 text-muted-foreground hover:text-destructive max-sm:col-start-3 max-sm:row-start-1",
|
|
8243
8303
|
"aria-label": `Remove filter layer ${index + 1}`,
|
|
8244
8304
|
onClick: onRemove,
|
|
8245
|
-
children: /* @__PURE__ */ (0,
|
|
8305
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(Trash2, { className: "h-3.5 w-3.5" })
|
|
8246
8306
|
}
|
|
8247
8307
|
)
|
|
8248
8308
|
]
|
|
@@ -8342,7 +8402,7 @@ function safeQueryPage(requestedPage, totalItems, pageSize) {
|
|
|
8342
8402
|
}
|
|
8343
8403
|
|
|
8344
8404
|
// src/data-table/MatrxDataTable.tsx
|
|
8345
|
-
var
|
|
8405
|
+
var import_jsx_runtime41 = require("react/jsx-runtime");
|
|
8346
8406
|
function TableToolbarAction({
|
|
8347
8407
|
HostAction,
|
|
8348
8408
|
ariaLabel,
|
|
@@ -8353,10 +8413,10 @@ function TableToolbarAction({
|
|
|
8353
8413
|
children
|
|
8354
8414
|
}) {
|
|
8355
8415
|
if (HostAction) {
|
|
8356
|
-
return /* @__PURE__ */ (0,
|
|
8416
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { "data-matrx-table-toolbar-action": true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HostAction, { ariaLabel, tooltip, disabled, busy, onClick, children }) });
|
|
8357
8417
|
}
|
|
8358
|
-
return /* @__PURE__ */ (0,
|
|
8359
|
-
/* @__PURE__ */ (0,
|
|
8418
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
8419
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { "data-matrx-table-toolbar-action": true, className: "inline-flex", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
8360
8420
|
Button,
|
|
8361
8421
|
{
|
|
8362
8422
|
type: "button",
|
|
@@ -8368,10 +8428,10 @@ function TableToolbarAction({
|
|
|
8368
8428
|
"aria-busy": busy || void 0,
|
|
8369
8429
|
disabled,
|
|
8370
8430
|
onClick,
|
|
8371
|
-
children: (0,
|
|
8431
|
+
children: (0, import_react20.isValidElement)(children) ? (0, import_react20.cloneElement)(children, { className: cn("h-5 w-5", children.props.className) }) : children
|
|
8372
8432
|
}
|
|
8373
8433
|
) }) }),
|
|
8374
|
-
/* @__PURE__ */ (0,
|
|
8434
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: tooltip ?? ariaLabel })
|
|
8375
8435
|
] });
|
|
8376
8436
|
}
|
|
8377
8437
|
function hasSameRowReferences(previous, next) {
|
|
@@ -8384,20 +8444,20 @@ function TableRowCopyControl({
|
|
|
8384
8444
|
sourceId,
|
|
8385
8445
|
defaultColumns
|
|
8386
8446
|
}) {
|
|
8387
|
-
return /* @__PURE__ */ (0,
|
|
8388
|
-
|
|
8389
|
-
|
|
8390
|
-
|
|
8391
|
-
|
|
8392
|
-
|
|
8393
|
-
|
|
8394
|
-
|
|
8395
|
-
|
|
8396
|
-
|
|
8397
|
-
|
|
8398
|
-
|
|
8399
|
-
}
|
|
8400
|
-
|
|
8447
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(CopyButtons, { size, ...tableRowCopyProps(copy, row, sourceId, defaultColumns) });
|
|
8448
|
+
}
|
|
8449
|
+
function tableRowCopyProps(copy, row, sourceId, defaultColumns) {
|
|
8450
|
+
const aiVariants = copy.rowAiVariants?.(row);
|
|
8451
|
+
return {
|
|
8452
|
+
sourceId,
|
|
8453
|
+
label: copy.label,
|
|
8454
|
+
...copy.rowReferences ? { references: copy.rowReferences(row) } : {},
|
|
8455
|
+
...copy.triggerVariant ? { triggerVariant: copy.triggerVariant } : {},
|
|
8456
|
+
human: () => copy.humanRow(row),
|
|
8457
|
+
json: () => copy.agentRow ? copy.agentRow(row) : row,
|
|
8458
|
+
agent: () => defaultColumns ? buildDefaultTableRowAgentInput(copy, row, defaultColumns) : buildRowAgentInput(copy, row),
|
|
8459
|
+
...aiVariants === void 0 ? {} : { aiVariants }
|
|
8460
|
+
};
|
|
8401
8461
|
}
|
|
8402
8462
|
function dragPointerY(event) {
|
|
8403
8463
|
const activator = event.activatorEvent;
|
|
@@ -8408,8 +8468,8 @@ function isStringArray(value) {
|
|
|
8408
8468
|
}
|
|
8409
8469
|
var activeUrlTableIds = /* @__PURE__ */ new Set();
|
|
8410
8470
|
function MatrxDataTable(props) {
|
|
8411
|
-
if (!props.urlState) return /* @__PURE__ */ (0,
|
|
8412
|
-
return /* @__PURE__ */ (0,
|
|
8471
|
+
if (!props.urlState) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(MatrxDataTableCore, { ...props });
|
|
8472
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(MatrxDataTableWithUrlState, { ...props, urlState: props.urlState });
|
|
8413
8473
|
}
|
|
8414
8474
|
function MatrxDataTableWithUrlState({
|
|
8415
8475
|
urlState,
|
|
@@ -8427,7 +8487,7 @@ function MatrxDataTableWithUrlState({
|
|
|
8427
8487
|
...urlState.history === void 0 ? {} : { history: urlState.history },
|
|
8428
8488
|
...urlState.textHistory === void 0 ? {} : { textHistory: urlState.textHistory }
|
|
8429
8489
|
});
|
|
8430
|
-
(0,
|
|
8490
|
+
(0, import_react20.useEffect)(() => {
|
|
8431
8491
|
if (activeUrlTableIds.has(urlState.id)) {
|
|
8432
8492
|
throw new Error(
|
|
8433
8493
|
`Duplicate MatrxDataTable urlState.id "${urlState.id}" on one page. Give every table a unique stable id.`
|
|
@@ -8464,7 +8524,7 @@ function MatrxDataTableWithUrlState({
|
|
|
8464
8524
|
props.selection?.onSelectedIdsChange(ids);
|
|
8465
8525
|
}
|
|
8466
8526
|
} : props.selection;
|
|
8467
|
-
return /* @__PURE__ */ (0,
|
|
8527
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
8468
8528
|
MatrxDataTableCore,
|
|
8469
8529
|
{
|
|
8470
8530
|
...props,
|
|
@@ -8523,6 +8583,7 @@ function MatrxDataTableCore({
|
|
|
8523
8583
|
detail,
|
|
8524
8584
|
window: windowConfig,
|
|
8525
8585
|
copy,
|
|
8586
|
+
rowCopyPlacement = "inline",
|
|
8526
8587
|
edit,
|
|
8527
8588
|
hierarchy,
|
|
8528
8589
|
selectedId: controlledSelectedId,
|
|
@@ -8551,7 +8612,7 @@ function MatrxDataTableCore({
|
|
|
8551
8612
|
}) {
|
|
8552
8613
|
const appendQuery = query?.mode === "controlled-append" ? query : null;
|
|
8553
8614
|
const appendQueryKey = appendQuery?.pagination.queryKey ?? null;
|
|
8554
|
-
const committedAppendQueryKey = (0,
|
|
8615
|
+
const committedAppendQueryKey = (0, import_react20.useRef)(appendQueryKey);
|
|
8555
8616
|
const appendSourceChanged = appendQuery !== null && committedAppendQueryKey.current !== appendQueryKey;
|
|
8556
8617
|
const data = appendQuery ? appendQuery.pagination.rows : suppliedData;
|
|
8557
8618
|
const isLoading = appendQuery ? appendQuery.pagination.loading : suppliedLoading;
|
|
@@ -8562,10 +8623,10 @@ function MatrxDataTableCore({
|
|
|
8562
8623
|
const Link = host.Link ?? DefaultTableLink;
|
|
8563
8624
|
const SidePanelSurface = host.SidePanelSurface ?? DefaultTableSidePanel;
|
|
8564
8625
|
const { notify: toast, notice } = useTableNotice();
|
|
8565
|
-
const [savedViewError, setSavedViewError] = (0,
|
|
8566
|
-
const [toolbarActionError, setToolbarActionError] = (0,
|
|
8567
|
-
const [toolbarActionPending, setToolbarActionPending] = (0,
|
|
8568
|
-
const toolbarActionPendingRef = (0,
|
|
8626
|
+
const [savedViewError, setSavedViewError] = (0, import_react20.useState)(null);
|
|
8627
|
+
const [toolbarActionError, setToolbarActionError] = (0, import_react20.useState)(null);
|
|
8628
|
+
const [toolbarActionPending, setToolbarActionPending] = (0, import_react20.useState)({ refresh: false, add: false });
|
|
8629
|
+
const toolbarActionPendingRef = (0, import_react20.useRef)({ refresh: false, add: false });
|
|
8569
8630
|
const CHECKBOX_TAP_AREA = "h-4 w-4 touch-manipulation";
|
|
8570
8631
|
const mobileCardsClass = mobileCardsBreakpoint === "lg" ? "lg:hidden" : "sm:hidden";
|
|
8571
8632
|
const tableWithCardsClass = mobileCardsBreakpoint === "lg" ? "max-lg:hidden" : "max-sm:hidden";
|
|
@@ -8578,7 +8639,7 @@ function MatrxDataTableCore({
|
|
|
8578
8639
|
const sourceOwnsIntelligentSearch = sourceProcessing?.intelligentSearch === "source";
|
|
8579
8640
|
const sourceOwnsSearch = remoteQuery?.mode === "controlled" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
|
|
8580
8641
|
const intelligentSearchEnabled = toolbar?.intelligentSearch !== void 0 && (sourceOwnsIntelligentSearch || remoteQuery === null && !sourceOwnsSearch);
|
|
8581
|
-
const emitControlledQueryChange = (0,
|
|
8642
|
+
const emitControlledQueryChange = (0, import_react20.useCallback)(
|
|
8582
8643
|
(patch, options) => {
|
|
8583
8644
|
if (!controlledQuery) return;
|
|
8584
8645
|
controlledQuery.onStateChange(
|
|
@@ -8587,8 +8648,8 @@ function MatrxDataTableCore({
|
|
|
8587
8648
|
},
|
|
8588
8649
|
[controlledQuery]
|
|
8589
8650
|
);
|
|
8590
|
-
const [internalSearch, setInternalSearch] = (0,
|
|
8591
|
-
const [draggedRowId, setDraggedRowId] = (0,
|
|
8651
|
+
const [internalSearch, setInternalSearch] = (0, import_react20.useState)("");
|
|
8652
|
+
const [draggedRowId, setDraggedRowId] = (0, import_react20.useState)(null);
|
|
8592
8653
|
const hierarchySensors = (0, import_core3.useSensors)(
|
|
8593
8654
|
(0, import_core3.useSensor)(import_core3.PointerSensor, {
|
|
8594
8655
|
activationConstraint: { distance: COLUMN_REORDER_ACTIVATION_DISTANCE }
|
|
@@ -8604,7 +8665,7 @@ function MatrxDataTableCore({
|
|
|
8604
8665
|
}
|
|
8605
8666
|
toolbar?.onSearchChange?.(v);
|
|
8606
8667
|
};
|
|
8607
|
-
const [internalSearchMatchMode, setInternalSearchMatchMode] = (0,
|
|
8668
|
+
const [internalSearchMatchMode, setInternalSearchMatchMode] = (0, import_react20.useState)(
|
|
8608
8669
|
toolbar?.searchMatch?.defaultMode ?? "contains"
|
|
8609
8670
|
);
|
|
8610
8671
|
const searchMatchMode = controlledQuery ? controlledQuery.state.searchMatchMode ?? toolbar?.searchMatch?.defaultMode ?? "contains" : internalSearchMatchMode;
|
|
@@ -8615,7 +8676,7 @@ function MatrxDataTableCore({
|
|
|
8615
8676
|
}
|
|
8616
8677
|
setInternalSearchMatchMode(mode);
|
|
8617
8678
|
};
|
|
8618
|
-
const [internalSearchScope, setInternalSearchScope] = (0,
|
|
8679
|
+
const [internalSearchScope, setInternalSearchScope] = (0, import_react20.useState)("all");
|
|
8619
8680
|
const searchScope = controlledQuery ? controlledQuery.state.searchScope ?? "all" : internalSearchScope;
|
|
8620
8681
|
const setSearchScope = (scope) => {
|
|
8621
8682
|
if (controlledQuery) {
|
|
@@ -8624,7 +8685,7 @@ function MatrxDataTableCore({
|
|
|
8624
8685
|
}
|
|
8625
8686
|
setInternalSearchScope(scope);
|
|
8626
8687
|
};
|
|
8627
|
-
const [internalAnyOf, setInternalAnyOf] = (0,
|
|
8688
|
+
const [internalAnyOf, setInternalAnyOf] = (0, import_react20.useState)("");
|
|
8628
8689
|
const toolbarAnyOfControlled = toolbar?.anyOf?.value !== void 0;
|
|
8629
8690
|
const anyOfValue = controlledQuery ? controlledQuery.state.anyOf : toolbarAnyOfControlled ? toolbar?.anyOf?.value ?? "" : internalAnyOf;
|
|
8630
8691
|
const setAnyOfValue = (v) => {
|
|
@@ -8635,7 +8696,7 @@ function MatrxDataTableCore({
|
|
|
8635
8696
|
}
|
|
8636
8697
|
toolbar?.anyOf?.onChange?.(v);
|
|
8637
8698
|
};
|
|
8638
|
-
const [internalLayeredFilters, setInternalLayeredFilters] = (0,
|
|
8699
|
+
const [internalLayeredFilters, setInternalLayeredFilters] = (0, import_react20.useState)([]);
|
|
8639
8700
|
const layeredFilters = controlledQuery ? controlledQuery.state.layeredFilters ?? [] : internalLayeredFilters;
|
|
8640
8701
|
const setLayeredFilters = (next) => {
|
|
8641
8702
|
if (controlledQuery) {
|
|
@@ -8644,7 +8705,7 @@ function MatrxDataTableCore({
|
|
|
8644
8705
|
}
|
|
8645
8706
|
setInternalLayeredFilters(next);
|
|
8646
8707
|
};
|
|
8647
|
-
const [internalColumnFilters, setInternalColumnFilters] = (0,
|
|
8708
|
+
const [internalColumnFilters, setInternalColumnFilters] = (0, import_react20.useState)({});
|
|
8648
8709
|
const columnFilters = controlledQuery ? controlledQuery.state.columnFilters : internalColumnFilters;
|
|
8649
8710
|
const setColumnFilter = (id, next) => {
|
|
8650
8711
|
const nextFilters = { ...columnFilters, [id]: next };
|
|
@@ -8657,7 +8718,7 @@ function MatrxDataTableCore({
|
|
|
8657
8718
|
}
|
|
8658
8719
|
setInternalColumnFilters(nextFilters);
|
|
8659
8720
|
};
|
|
8660
|
-
const [internalSort, setInternalSort] = (0,
|
|
8721
|
+
const [internalSort, setInternalSort] = (0, import_react20.useState)(defaultSort);
|
|
8661
8722
|
const sort = controlledQuery ? controlledQuery.state.sort : internalSort;
|
|
8662
8723
|
const setSort = (next) => {
|
|
8663
8724
|
if (controlledQuery) {
|
|
@@ -8666,7 +8727,7 @@ function MatrxDataTableCore({
|
|
|
8666
8727
|
}
|
|
8667
8728
|
setInternalSort(next);
|
|
8668
8729
|
};
|
|
8669
|
-
const [internalPage, setInternalPage] = (0,
|
|
8730
|
+
const [internalPage, setInternalPage] = (0, import_react20.useState)(1);
|
|
8670
8731
|
const page = controlledQuery ? controlledQuery.state.page : internalPage;
|
|
8671
8732
|
const setPage = (next) => {
|
|
8672
8733
|
if (controlledQuery) {
|
|
@@ -8675,7 +8736,7 @@ function MatrxDataTableCore({
|
|
|
8675
8736
|
}
|
|
8676
8737
|
setInternalPage(next);
|
|
8677
8738
|
};
|
|
8678
|
-
const [internalPageSize, setInternalPageSize] = (0,
|
|
8739
|
+
const [internalPageSize, setInternalPageSize] = (0, import_react20.useState)(
|
|
8679
8740
|
defaultPageSize === 0 ? Math.max(data.length, 1) : defaultPageSize
|
|
8680
8741
|
);
|
|
8681
8742
|
const pageSize = controlledQuery ? controlledQuery.state.pageSize : internalPageSize;
|
|
@@ -8686,26 +8747,26 @@ function MatrxDataTableCore({
|
|
|
8686
8747
|
}
|
|
8687
8748
|
setInternalPageSize(next);
|
|
8688
8749
|
};
|
|
8689
|
-
const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0,
|
|
8750
|
+
const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0, import_react20.useState)(null);
|
|
8690
8751
|
const rawSelectedId = controlledSelectedId !== void 0 ? controlledSelectedId : uncontrolledSelectedId;
|
|
8691
8752
|
const selectedId = appendSourceChanged ? null : rawSelectedId;
|
|
8692
8753
|
const setSelectedId = (id) => {
|
|
8693
8754
|
if (controlledSelectedId === void 0) setUncontrolledSelectedId(id);
|
|
8694
8755
|
onSelectedIdChange?.(id);
|
|
8695
8756
|
};
|
|
8696
|
-
const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0,
|
|
8757
|
+
const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0, import_react20.useState)(null);
|
|
8697
8758
|
const rawWindowRowId = controlledWindowRowId !== void 0 ? controlledWindowRowId : uncontrolledWindowRowId;
|
|
8698
8759
|
const windowRowId = appendSourceChanged ? null : rawWindowRowId;
|
|
8699
8760
|
const setWindowRowId = (id) => {
|
|
8700
8761
|
if (controlledWindowRowId === void 0) setUncontrolledWindowRowId(id);
|
|
8701
8762
|
onWindowRowIdChange?.(id);
|
|
8702
8763
|
};
|
|
8703
|
-
const [windowRowSnapshot, setWindowRowSnapshot] = (0,
|
|
8764
|
+
const [windowRowSnapshot, setWindowRowSnapshot] = (0, import_react20.useState)(null);
|
|
8704
8765
|
const editScopeKey = appendQueryKey === null ? "\0local" : `append:${appendQueryKey}`;
|
|
8705
|
-
const [editsByScope, setEditsByScope] = (0,
|
|
8706
|
-
const editRevisionRef = (0,
|
|
8707
|
-
const [savingByScope, setSavingByScope] = (0,
|
|
8708
|
-
const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0,
|
|
8766
|
+
const [editsByScope, setEditsByScope] = (0, import_react20.useState)({});
|
|
8767
|
+
const editRevisionRef = (0, import_react20.useRef)({});
|
|
8768
|
+
const [savingByScope, setSavingByScope] = (0, import_react20.useState)({});
|
|
8769
|
+
const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0, import_react20.useState)(false);
|
|
8709
8770
|
const edits = editsByScope[editScopeKey]?.values ?? {};
|
|
8710
8771
|
const saving = (savingByScope[editScopeKey] ?? 0) > 0;
|
|
8711
8772
|
const setEdits = (next) => {
|
|
@@ -8772,7 +8833,7 @@ function MatrxDataTableCore({
|
|
|
8772
8833
|
rows: Object.entries(draft.values).map(([rowId, columns2]) => ({ rowId, columns: columns2 }))
|
|
8773
8834
|
}));
|
|
8774
8835
|
const selection = appendSourceChanged && selectionConfig ? { ...selectionConfig, selectedIds: [] } : selectionConfig;
|
|
8775
|
-
(0,
|
|
8836
|
+
(0, import_react20.useEffect)(() => {
|
|
8776
8837
|
const previous = committedAppendQueryKey.current;
|
|
8777
8838
|
committedAppendQueryKey.current = appendQueryKey;
|
|
8778
8839
|
if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
|
|
@@ -8790,14 +8851,14 @@ function MatrxDataTableCore({
|
|
|
8790
8851
|
onWindowRowIdChange,
|
|
8791
8852
|
selectionConfig
|
|
8792
8853
|
]);
|
|
8793
|
-
const scrollRef = (0,
|
|
8794
|
-
const tableRef = (0,
|
|
8795
|
-
const tableHeaderRef = (0,
|
|
8796
|
-
const cardsScrollRef = (0,
|
|
8797
|
-
const [documentStickyHeader, setDocumentStickyHeader] = (0,
|
|
8798
|
-
const documentStickyHeaderRef = (0,
|
|
8799
|
-
const previousAppendKeyForScrollReset = (0,
|
|
8800
|
-
(0,
|
|
8854
|
+
const scrollRef = (0, import_react20.useRef)(null);
|
|
8855
|
+
const tableRef = (0, import_react20.useRef)(null);
|
|
8856
|
+
const tableHeaderRef = (0, import_react20.useRef)(null);
|
|
8857
|
+
const cardsScrollRef = (0, import_react20.useRef)(null);
|
|
8858
|
+
const [documentStickyHeader, setDocumentStickyHeader] = (0, import_react20.useState)(false);
|
|
8859
|
+
const documentStickyHeaderRef = (0, import_react20.useRef)(false);
|
|
8860
|
+
const previousAppendKeyForScrollReset = (0, import_react20.useRef)(appendQueryKey);
|
|
8861
|
+
(0, import_react20.useLayoutEffect)(() => {
|
|
8801
8862
|
const previous = previousAppendKeyForScrollReset.current;
|
|
8802
8863
|
previousAppendKeyForScrollReset.current = appendQueryKey;
|
|
8803
8864
|
if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
|
|
@@ -8822,13 +8883,13 @@ function MatrxDataTableCore({
|
|
|
8822
8883
|
...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.thresholdPx !== void 0 ? { thresholdPx: appendScrollPolicy.thresholdPx } : {},
|
|
8823
8884
|
...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.intentTimeoutMs !== void 0 ? { intentTimeoutMs: appendScrollPolicy.intentTimeoutMs } : {}
|
|
8824
8885
|
});
|
|
8825
|
-
const rootRef = (0,
|
|
8886
|
+
const rootRef = (0, import_react20.useRef)(null);
|
|
8826
8887
|
useClippedContentGuard(rootRef, {
|
|
8827
8888
|
label: typeof copy === "object" && copy.listLabel ? `Table: ${copy.listLabel}` : "MatrxDataTable"
|
|
8828
8889
|
});
|
|
8829
|
-
const [scrollHintRight, setScrollHintRight] = (0,
|
|
8830
|
-
const [scrollHintLeft, setScrollHintLeft] = (0,
|
|
8831
|
-
const updateScrollHint = (0,
|
|
8890
|
+
const [scrollHintRight, setScrollHintRight] = (0, import_react20.useState)(false);
|
|
8891
|
+
const [scrollHintLeft, setScrollHintLeft] = (0, import_react20.useState)(false);
|
|
8892
|
+
const updateScrollHint = (0, import_react20.useCallback)(() => {
|
|
8832
8893
|
const el = scrollRef.current;
|
|
8833
8894
|
if (!el) return;
|
|
8834
8895
|
setScrollHintRight(el.scrollLeft + el.clientWidth < el.scrollWidth - 2);
|
|
@@ -8842,7 +8903,7 @@ function MatrxDataTableCore({
|
|
|
8842
8903
|
behavior: "smooth"
|
|
8843
8904
|
});
|
|
8844
8905
|
};
|
|
8845
|
-
(0,
|
|
8906
|
+
(0, import_react20.useEffect)(() => {
|
|
8846
8907
|
updateScrollHint();
|
|
8847
8908
|
window.addEventListener("resize", updateScrollHint);
|
|
8848
8909
|
const el = scrollRef.current;
|
|
@@ -8857,7 +8918,7 @@ function MatrxDataTableCore({
|
|
|
8857
8918
|
observer?.disconnect();
|
|
8858
8919
|
};
|
|
8859
8920
|
}, [updateScrollHint, data, columns]);
|
|
8860
|
-
(0,
|
|
8921
|
+
(0, import_react20.useLayoutEffect)(() => {
|
|
8861
8922
|
const scroll = scrollRef.current;
|
|
8862
8923
|
const table = tableRef.current;
|
|
8863
8924
|
const header = tableHeaderRef.current;
|
|
@@ -8916,30 +8977,30 @@ function MatrxDataTableCore({
|
|
|
8916
8977
|
window.removeEventListener("resize", requestUpdate);
|
|
8917
8978
|
};
|
|
8918
8979
|
}, [stickyHeader, data, columns]);
|
|
8919
|
-
const [columnOrder, setColumnOrder] = (0,
|
|
8920
|
-
const [hiddenColumnIds, setHiddenColumnIds] = (0,
|
|
8980
|
+
const [columnOrder, setColumnOrder] = (0, import_react20.useState)(() => columnState?.order ?? columns.map(columnId));
|
|
8981
|
+
const [hiddenColumnIds, setHiddenColumnIds] = (0, import_react20.useState)(
|
|
8921
8982
|
() => new Set(columnState?.hidden ?? columns.filter((column) => column.hidden).map(columnId))
|
|
8922
8983
|
);
|
|
8923
|
-
const [columnWidths, setColumnWidths] = (0,
|
|
8984
|
+
const [columnWidths, setColumnWidths] = (0, import_react20.useState)(
|
|
8924
8985
|
() => normalizeColumnWidthsForColumns(columnState?.widths, columns)
|
|
8925
8986
|
);
|
|
8926
|
-
const [fixedTableGeometry, setFixedTableGeometry] = (0,
|
|
8927
|
-
const knownColumnIds = (0,
|
|
8928
|
-
const draggedColumnId = (0,
|
|
8929
|
-
const columnDragActive = (0,
|
|
8930
|
-
const columnDragRaf = (0,
|
|
8931
|
-
const columnDragScrollDirection = (0,
|
|
8932
|
-
const [columnDragPreview, setColumnDragPreview] = (0,
|
|
8933
|
-
const stopColumnDragScroll = (0,
|
|
8987
|
+
const [fixedTableGeometry, setFixedTableGeometry] = (0, import_react20.useState)(null);
|
|
8988
|
+
const knownColumnIds = (0, import_react20.useRef)(new Set(columns.map(columnId)));
|
|
8989
|
+
const draggedColumnId = (0, import_react20.useRef)(null);
|
|
8990
|
+
const columnDragActive = (0, import_react20.useRef)(false);
|
|
8991
|
+
const columnDragRaf = (0, import_react20.useRef)(null);
|
|
8992
|
+
const columnDragScrollDirection = (0, import_react20.useRef)(0);
|
|
8993
|
+
const [columnDragPreview, setColumnDragPreview] = (0, import_react20.useState)(null);
|
|
8994
|
+
const stopColumnDragScroll = (0, import_react20.useCallback)(() => {
|
|
8934
8995
|
if (columnDragRaf.current !== null) cancelAnimationFrame(columnDragRaf.current);
|
|
8935
8996
|
columnDragRaf.current = null;
|
|
8936
8997
|
columnDragScrollDirection.current = 0;
|
|
8937
8998
|
}, []);
|
|
8938
|
-
(0,
|
|
8999
|
+
(0, import_react20.useEffect)(() => () => {
|
|
8939
9000
|
columnDragActive.current = false;
|
|
8940
9001
|
stopColumnDragScroll();
|
|
8941
9002
|
}, [stopColumnDragScroll]);
|
|
8942
|
-
const startColumnDragScroll = (0,
|
|
9003
|
+
const startColumnDragScroll = (0, import_react20.useCallback)(() => {
|
|
8943
9004
|
if (!columnDragActive.current || columnDragRaf.current !== null) return;
|
|
8944
9005
|
const scrollStep = () => {
|
|
8945
9006
|
const scroll = scrollRef.current;
|
|
@@ -8966,25 +9027,25 @@ function MatrxDataTableCore({
|
|
|
8966
9027
|
};
|
|
8967
9028
|
columnDragRaf.current = requestAnimationFrame(scrollStep);
|
|
8968
9029
|
}, []);
|
|
8969
|
-
const commitColumnState = (0,
|
|
9030
|
+
const commitColumnState = (0, import_react20.useCallback)((order, hidden) => {
|
|
8970
9031
|
if (columnState) columnState.onChange({ order, hidden: [...hidden] });
|
|
8971
9032
|
else {
|
|
8972
9033
|
setColumnOrder(order);
|
|
8973
9034
|
setHiddenColumnIds(hidden);
|
|
8974
9035
|
}
|
|
8975
9036
|
}, [columnState]);
|
|
8976
|
-
const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0,
|
|
9037
|
+
const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0, import_react20.useState)(false);
|
|
8977
9038
|
const columnManagerOpen = controlledColumnManager?.open ?? internalColumnManagerOpen;
|
|
8978
9039
|
const setColumnManagerOpen = controlledColumnManager?.onOpenChange ?? setInternalColumnManagerOpen;
|
|
8979
|
-
const columnIds = (0,
|
|
8980
|
-
const effectiveColumnOrder = (0,
|
|
8981
|
-
const effectiveHiddenColumnIds = (0,
|
|
8982
|
-
const effectiveColumnWidths = (0,
|
|
9040
|
+
const columnIds = (0, import_react20.useMemo)(() => columns.map(columnId), [columns]);
|
|
9041
|
+
const effectiveColumnOrder = (0, import_react20.useMemo)(() => columnState ? [...columnState.order.filter((id, index, values) => columnIds.includes(id) && values.indexOf(id) === index), ...columnIds.filter((id) => !columnState.order.includes(id))] : columnOrder, [columnIds, columnOrder, columnState]);
|
|
9042
|
+
const effectiveHiddenColumnIds = (0, import_react20.useMemo)(() => columnState ? new Set(columnState.hidden.filter((id) => columnIds.includes(id))) : hiddenColumnIds, [columnIds, columnState, hiddenColumnIds]);
|
|
9043
|
+
const effectiveColumnWidths = (0, import_react20.useMemo)(
|
|
8983
9044
|
() => normalizeColumnWidthsForColumns(columnState?.widths ?? columnWidths, columns),
|
|
8984
9045
|
[columns, columnState?.widths, columnWidths]
|
|
8985
9046
|
);
|
|
8986
|
-
const resizeGestureSnapshotRef = (0,
|
|
8987
|
-
const measureVisibleColumnWidths = (0,
|
|
9047
|
+
const resizeGestureSnapshotRef = (0, import_react20.useRef)(null);
|
|
9048
|
+
const measureVisibleColumnWidths = (0, import_react20.useCallback)(() => {
|
|
8988
9049
|
const measured = {};
|
|
8989
9050
|
const headers = tableRef.current ? Array.from(tableRef.current.querySelectorAll(
|
|
8990
9051
|
"thead th[data-matrx-table-column-id]"
|
|
@@ -8998,7 +9059,7 @@ function MatrxDataTableCore({
|
|
|
8998
9059
|
}
|
|
8999
9060
|
return normalizeColumnWidthsForColumns(measured, columns);
|
|
9000
9061
|
}, [columns]);
|
|
9001
|
-
const measureFixedTableGeometry = (0,
|
|
9062
|
+
const measureFixedTableGeometry = (0, import_react20.useCallback)(() => {
|
|
9002
9063
|
const table = tableRef.current;
|
|
9003
9064
|
const headers = table ? Array.from(table.querySelectorAll("thead th")) : [];
|
|
9004
9065
|
const widthFor = (selector) => {
|
|
@@ -9028,16 +9089,16 @@ function MatrxDataTableCore({
|
|
|
9028
9089
|
...actionsWidth === void 0 ? {} : { actionsWidth }
|
|
9029
9090
|
};
|
|
9030
9091
|
}, [resolvedDensity]);
|
|
9031
|
-
const captureResizeGestureSnapshot = (0,
|
|
9092
|
+
const captureResizeGestureSnapshot = (0, import_react20.useCallback)(() => {
|
|
9032
9093
|
resizeGestureSnapshotRef.current = {
|
|
9033
9094
|
widths: measureVisibleColumnWidths(),
|
|
9034
9095
|
geometry: measureFixedTableGeometry()
|
|
9035
9096
|
};
|
|
9036
9097
|
}, [measureFixedTableGeometry, measureVisibleColumnWidths]);
|
|
9037
|
-
const clearResizeGestureSnapshot = (0,
|
|
9098
|
+
const clearResizeGestureSnapshot = (0, import_react20.useCallback)(() => {
|
|
9038
9099
|
resizeGestureSnapshotRef.current = null;
|
|
9039
9100
|
}, []);
|
|
9040
|
-
const commitColumnWidths = (0,
|
|
9101
|
+
const commitColumnWidths = (0, import_react20.useCallback)((next, captureInitialWidths = false) => {
|
|
9041
9102
|
const gestureSnapshot = captureInitialWidths ? resizeGestureSnapshotRef.current : null;
|
|
9042
9103
|
resizeGestureSnapshotRef.current = null;
|
|
9043
9104
|
const normalized = normalizeColumnWidthsForColumns(
|
|
@@ -9056,7 +9117,7 @@ function MatrxDataTableCore({
|
|
|
9056
9117
|
}
|
|
9057
9118
|
setColumnWidths(normalized);
|
|
9058
9119
|
}, [columnIds, columnState, columns, measureFixedTableGeometry, measureVisibleColumnWidths]);
|
|
9059
|
-
(0,
|
|
9120
|
+
(0, import_react20.useEffect)(() => {
|
|
9060
9121
|
const ids = columns.map(columnId);
|
|
9061
9122
|
if (columnState) return;
|
|
9062
9123
|
const previousIds = knownColumnIds.current;
|
|
@@ -9075,31 +9136,31 @@ function MatrxDataTableCore({
|
|
|
9075
9136
|
setColumnWidths((current) => normalizeColumnWidthsForColumns(current, columns));
|
|
9076
9137
|
knownColumnIds.current = new Set(ids);
|
|
9077
9138
|
}, [columns, columnState]);
|
|
9078
|
-
(0,
|
|
9139
|
+
(0, import_react20.useLayoutEffect)(() => {
|
|
9079
9140
|
for (const id of columnIds) {
|
|
9080
9141
|
tableRef.current?.style.removeProperty(columnResizeCssVar(id));
|
|
9081
9142
|
}
|
|
9082
9143
|
});
|
|
9083
|
-
const previewColumnOrder = (0,
|
|
9144
|
+
const previewColumnOrder = (0, import_react20.useMemo)(
|
|
9084
9145
|
() => projectColumnDragOrder(effectiveColumnOrder, columnDragPreview),
|
|
9085
9146
|
[columnDragPreview, effectiveColumnOrder]
|
|
9086
9147
|
);
|
|
9087
9148
|
useColumnReorderAnimation(tableRef, previewColumnOrder.join("\0"), columnDragPreview !== null);
|
|
9088
|
-
const visibleColumns = (0,
|
|
9149
|
+
const visibleColumns = (0, import_react20.useMemo)(() => {
|
|
9089
9150
|
const byId = new Map(columns.map((column) => [columnId(column), column]));
|
|
9090
9151
|
return previewColumnOrder.map((id) => byId.get(id)).filter(
|
|
9091
9152
|
(column) => column !== void 0 && !effectiveHiddenColumnIds.has(columnId(column))
|
|
9092
9153
|
);
|
|
9093
9154
|
}, [columns, effectiveHiddenColumnIds, previewColumnOrder]);
|
|
9094
9155
|
const usesMeasuredFixedLayout = visibleColumns.length > 0 && visibleColumns.every((column) => effectiveColumnWidths[columnId(column)] !== void 0);
|
|
9095
|
-
(0,
|
|
9156
|
+
(0, import_react20.useLayoutEffect)(() => {
|
|
9096
9157
|
if (!usesMeasuredFixedLayout) {
|
|
9097
9158
|
if (fixedTableGeometry !== null) setFixedTableGeometry(null);
|
|
9098
9159
|
return;
|
|
9099
9160
|
}
|
|
9100
9161
|
if (fixedTableGeometry === null) setFixedTableGeometry(measureFixedTableGeometry());
|
|
9101
9162
|
}, [fixedTableGeometry, measureFixedTableGeometry, usesMeasuredFixedLayout]);
|
|
9102
|
-
(0,
|
|
9163
|
+
(0, import_react20.useLayoutEffect)(() => {
|
|
9103
9164
|
if (!usesMeasuredFixedLayout) return;
|
|
9104
9165
|
const table = tableRef.current;
|
|
9105
9166
|
if (!table) return;
|
|
@@ -9121,14 +9182,14 @@ function MatrxDataTableCore({
|
|
|
9121
9182
|
setFixedTableGeometry(geometry);
|
|
9122
9183
|
}, [resolvedDensity, measureFixedTableGeometry, usesMeasuredFixedLayout]);
|
|
9123
9184
|
const fixedLayoutActive = usesMeasuredFixedLayout && fixedTableGeometry !== null;
|
|
9124
|
-
const declaredVisibleCopyColumns = (0,
|
|
9185
|
+
const declaredVisibleCopyColumns = (0, import_react20.useMemo)(
|
|
9125
9186
|
() => visibleColumns.filter((column) => column.accessorFn !== void 0 || column.accessorKey !== void 0),
|
|
9126
9187
|
[visibleColumns]
|
|
9127
9188
|
);
|
|
9128
|
-
const tableCopySourceNamespace = (0,
|
|
9129
|
-
const tableDndContextId = (0,
|
|
9189
|
+
const tableCopySourceNamespace = (0, import_react20.useId)();
|
|
9190
|
+
const tableDndContextId = (0, import_react20.useId)();
|
|
9130
9191
|
const defaultCopyTitle = toolbar?.title || "Table";
|
|
9131
|
-
const defaultCopy = (0,
|
|
9192
|
+
const defaultCopy = (0, import_react20.useMemo)(() => ({
|
|
9132
9193
|
label: defaultCopyTitle,
|
|
9133
9194
|
listLabel: defaultCopyTitle,
|
|
9134
9195
|
location: defaultCopyTitle,
|
|
@@ -9163,7 +9224,7 @@ function MatrxDataTableCore({
|
|
|
9163
9224
|
serializer: (shaped) => buildViewAgentInput(effectiveCopy, shaped, data, { scope: "custom" })
|
|
9164
9225
|
}))
|
|
9165
9226
|
] : [];
|
|
9166
|
-
const filterMeta = (0,
|
|
9227
|
+
const filterMeta = (0, import_react20.useMemo)(() => {
|
|
9167
9228
|
const meta = /* @__PURE__ */ new Map();
|
|
9168
9229
|
for (const col of visibleColumns) {
|
|
9169
9230
|
const id = columnId(col);
|
|
@@ -9171,14 +9232,14 @@ function MatrxDataTableCore({
|
|
|
9171
9232
|
}
|
|
9172
9233
|
return meta;
|
|
9173
9234
|
}, [visibleColumns, data, remoteQuery]);
|
|
9174
|
-
const intelligentSearchScopes = (0,
|
|
9235
|
+
const intelligentSearchScopes = (0, import_react20.useMemo)(
|
|
9175
9236
|
() => resolveTableSearchScopes(data, columns, {
|
|
9176
9237
|
...toolbar?.intelligentSearch?.roles === void 0 ? {} : { roles: toolbar.intelligentSearch.roles },
|
|
9177
9238
|
...toolbar?.intelligentSearch?.scopes === void 0 ? {} : { scopes: toolbar.intelligentSearch.scopes }
|
|
9178
9239
|
}),
|
|
9179
9240
|
[columns, data, toolbar?.intelligentSearch?.roles, toolbar?.intelligentSearch?.scopes]
|
|
9180
9241
|
);
|
|
9181
|
-
const processed = (0,
|
|
9242
|
+
const processed = (0, import_react20.useMemo)(() => {
|
|
9182
9243
|
if (remoteQuery && !appendUsesLocalProcessing) return data;
|
|
9183
9244
|
if (processLocalRows) {
|
|
9184
9245
|
return processLocalRows(data, {
|
|
@@ -9241,8 +9302,8 @@ function MatrxDataTableCore({
|
|
|
9241
9302
|
intelligentSearchEnabled,
|
|
9242
9303
|
searchScope
|
|
9243
9304
|
]);
|
|
9244
|
-
const lastNotifiedViewRows = (0,
|
|
9245
|
-
(0,
|
|
9305
|
+
const lastNotifiedViewRows = (0, import_react20.useRef)(null);
|
|
9306
|
+
(0, import_react20.useEffect)(() => {
|
|
9246
9307
|
if (!onViewChange) {
|
|
9247
9308
|
lastNotifiedViewRows.current = null;
|
|
9248
9309
|
return;
|
|
@@ -9251,7 +9312,7 @@ function MatrxDataTableCore({
|
|
|
9251
9312
|
lastNotifiedViewRows.current = processed;
|
|
9252
9313
|
if (changed) onViewChange(processed);
|
|
9253
9314
|
}, [processed, onViewChange]);
|
|
9254
|
-
(0,
|
|
9315
|
+
(0, import_react20.useEffect)(() => {
|
|
9255
9316
|
if (controlledQuery) return;
|
|
9256
9317
|
setInternalPage(1);
|
|
9257
9318
|
}, [
|
|
@@ -9295,7 +9356,7 @@ function MatrxDataTableCore({
|
|
|
9295
9356
|
numberedPageHasMore: !hidePagination && !isLoading && !isFetching && processed.length > 0 && safePage < pageCount && (remoteQuery?.mode === "controlled" || !remoteQuery && localPagination?.mode === "numbered"),
|
|
9296
9357
|
onPageAdvance: setPage
|
|
9297
9358
|
});
|
|
9298
|
-
const paginated = (0,
|
|
9359
|
+
const paginated = (0, import_react20.useMemo)(() => {
|
|
9299
9360
|
if (remoteQuery) return processed;
|
|
9300
9361
|
if (hidePagination) return processed;
|
|
9301
9362
|
if (localProgressiveEnabled) return [...progressiveRows.rows];
|
|
@@ -9303,15 +9364,15 @@ function MatrxDataTableCore({
|
|
|
9303
9364
|
const start = (safePage - 1) * effectivePageSize;
|
|
9304
9365
|
return processed.slice(start, start + effectivePageSize);
|
|
9305
9366
|
}, [processed, safePage, effectivePageSize, pageSize, remoteQuery, hidePagination, localProgressiveEnabled, progressiveRows.rows]);
|
|
9306
|
-
(0,
|
|
9367
|
+
(0, import_react20.useEffect)(() => {
|
|
9307
9368
|
if (!controlledQuery || controlledQuery.state.page === safePage) return;
|
|
9308
9369
|
emitControlledQueryChange({ page: safePage });
|
|
9309
9370
|
}, [controlledQuery, emitControlledQueryChange, safePage]);
|
|
9310
|
-
const selectedRow = (0,
|
|
9371
|
+
const selectedRow = (0, import_react20.useMemo)(() => {
|
|
9311
9372
|
if (!selectedId) return null;
|
|
9312
9373
|
return data.find((r) => getRowId(r) === selectedId) ?? null;
|
|
9313
9374
|
}, [data, selectedId, getRowId]);
|
|
9314
|
-
const windowRow = (0,
|
|
9375
|
+
const windowRow = (0, import_react20.useMemo)(() => {
|
|
9315
9376
|
if (!windowRowId) return null;
|
|
9316
9377
|
return data.find((r) => getRowId(r) === windowRowId) ?? (windowRowSnapshot && windowRowSnapshot.queryKey === appendQueryKey && getRowId(windowRowSnapshot.row) === windowRowId ? windowRowSnapshot.row : null);
|
|
9317
9378
|
}, [data, windowRowId, windowRowSnapshot, getRowId, appendQueryKey]);
|
|
@@ -9322,7 +9383,21 @@ function MatrxDataTableCore({
|
|
|
9322
9383
|
);
|
|
9323
9384
|
const editEnabled = Boolean(edit?.enabled && edit.onSave);
|
|
9324
9385
|
const showRowCopy = effectiveCopy !== void 0 && effectiveCopy.showRow !== false;
|
|
9386
|
+
const rowCopyInMenu = rowCopyPlacement === "menu" && Boolean(rowActions);
|
|
9387
|
+
const showInlineRowCopy = showRowCopy && !rowCopyInMenu;
|
|
9325
9388
|
const showToolbarCopy = effectiveCopy !== void 0 && effectiveCopy.showToolbar !== false;
|
|
9389
|
+
const renderRowActions = (row, controls) => {
|
|
9390
|
+
const actions = rowActions?.(row, controls);
|
|
9391
|
+
if (!effectiveCopy || !showRowCopy) return actions;
|
|
9392
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9393
|
+
MatrxTableRowAlchemyProvider,
|
|
9394
|
+
{
|
|
9395
|
+
copy: tableRowCopyProps(effectiveCopy, row, `${tableCopySourceNamespace}:row:${getRowId(row)}`, copy === void 0 ? declaredVisibleCopyColumns : void 0),
|
|
9396
|
+
placement: rowCopyInMenu ? "menu" : "inline",
|
|
9397
|
+
children: actions
|
|
9398
|
+
}
|
|
9399
|
+
);
|
|
9400
|
+
};
|
|
9326
9401
|
const activeFilterCount = countActiveColumnFilters(columnFilters);
|
|
9327
9402
|
const facetActive = (toolbar?.facets ?? []).some((f) => {
|
|
9328
9403
|
if (f.type === "custom") return f.filter?.active ?? false;
|
|
@@ -9330,7 +9405,7 @@ function MatrxDataTableCore({
|
|
|
9330
9405
|
return def !== void 0 && f.value !== def;
|
|
9331
9406
|
});
|
|
9332
9407
|
const hasActiveFilters = activeFilterCount > 0 || Boolean(searchValue.trim()) || intelligentSearchEnabled && searchScope !== "all" || Boolean(anyOfValue.trim()) || completeLayeredFilterRules(layeredFilters).length > 0 || facetActive;
|
|
9333
|
-
const changeCount = (0,
|
|
9408
|
+
const changeCount = (0, import_react20.useMemo)(() => {
|
|
9334
9409
|
let n = 0;
|
|
9335
9410
|
for (const fields of Object.values(edits)) {
|
|
9336
9411
|
n += Object.keys(fields).length;
|
|
@@ -9397,7 +9472,7 @@ function MatrxDataTableCore({
|
|
|
9397
9472
|
const renderedEmptyState = remoteQuery === null && data.length > 0 && hasActiveFilters ? {
|
|
9398
9473
|
title: "No matching rows",
|
|
9399
9474
|
description: "No rows match the current search or filters.",
|
|
9400
|
-
action: /* @__PURE__ */ (0,
|
|
9475
|
+
action: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { type: "button", variant: "outline", size: "sm", onClick: clearAllFilters, children: "Clear filters" }),
|
|
9401
9476
|
icon: void 0
|
|
9402
9477
|
} : emptyState;
|
|
9403
9478
|
const commitCell = (rowId, field, next) => {
|
|
@@ -9438,7 +9513,7 @@ function MatrxDataTableCore({
|
|
|
9438
9513
|
};
|
|
9439
9514
|
const hierarchyRows = hierarchy?.rows ?? data;
|
|
9440
9515
|
const hierarchyGetParentId = hierarchy?.getParentId;
|
|
9441
|
-
const hierarchyIndex = (0,
|
|
9516
|
+
const hierarchyIndex = (0, import_react20.useMemo)(() => {
|
|
9442
9517
|
if (!hierarchyGetParentId) return null;
|
|
9443
9518
|
const byId = /* @__PURE__ */ new Map();
|
|
9444
9519
|
const parentById = /* @__PURE__ */ new Map();
|
|
@@ -9470,7 +9545,7 @@ function MatrxDataTableCore({
|
|
|
9470
9545
|
return { byId, parentById, depthById };
|
|
9471
9546
|
}, [hierarchyGetParentId, hierarchyRows, getRowId]);
|
|
9472
9547
|
const draggedRow = draggedRowId && hierarchyIndex ? hierarchyIndex.byId.get(draggedRowId) : void 0;
|
|
9473
|
-
const hierarchyBlockedIds = (0,
|
|
9548
|
+
const hierarchyBlockedIds = (0, import_react20.useMemo)(() => {
|
|
9474
9549
|
if (!draggedRowId || !hierarchyIndex) return null;
|
|
9475
9550
|
const childrenById = /* @__PURE__ */ new Map();
|
|
9476
9551
|
for (const [id, parentId] of hierarchyIndex.parentById) {
|
|
@@ -9649,8 +9724,8 @@ function MatrxDataTableCore({
|
|
|
9649
9724
|
setEdits({});
|
|
9650
9725
|
edit?.onCancel?.();
|
|
9651
9726
|
};
|
|
9652
|
-
const showActionsCol = windowEnabled || Boolean(rowActions) ||
|
|
9653
|
-
const selectedIdSet = (0,
|
|
9727
|
+
const showActionsCol = windowEnabled || Boolean(rowActions) || showInlineRowCopy;
|
|
9728
|
+
const selectedIdSet = (0, import_react20.useMemo)(
|
|
9654
9729
|
() => new Set(selection?.selectedIds ?? []),
|
|
9655
9730
|
[selection?.selectedIds]
|
|
9656
9731
|
);
|
|
@@ -9662,11 +9737,11 @@ function MatrxDataTableCore({
|
|
|
9662
9737
|
);
|
|
9663
9738
|
const allOnPageSelected = selectableRows.length > 0 && selectedOnPage.length === selectableRows.length;
|
|
9664
9739
|
const someOnPageSelected = selectedOnPage.length > 0 && !allOnPageSelected;
|
|
9665
|
-
const selectedRows = (0,
|
|
9740
|
+
const selectedRows = (0, import_react20.useMemo)(
|
|
9666
9741
|
() => data.filter((row) => selectedIdSet.has(getRowId(row))),
|
|
9667
9742
|
[data, selectedIdSet, getRowId]
|
|
9668
9743
|
);
|
|
9669
|
-
const lastToggledIndex = (0,
|
|
9744
|
+
const lastToggledIndex = (0, import_react20.useRef)(null);
|
|
9670
9745
|
const setSelectedIds = (next) => selection?.onSelectedIdsChange([...next]);
|
|
9671
9746
|
const toggleRowSelected = (index, shiftKey) => {
|
|
9672
9747
|
if (!selection) return;
|
|
@@ -9719,7 +9794,7 @@ function MatrxDataTableCore({
|
|
|
9719
9794
|
const display = renderCell(applyRowEdits(row, rowEdits), col, index);
|
|
9720
9795
|
const href = col.href?.(row) ?? void 0;
|
|
9721
9796
|
if (editEnabled && col.editable && (col.editableIf?.(row) ?? true)) {
|
|
9722
|
-
return /* @__PURE__ */ (0,
|
|
9797
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9723
9798
|
EditableTableCell,
|
|
9724
9799
|
{
|
|
9725
9800
|
value: rowEdits && field in rowEdits ? rowEdits[field] : getCellValue(row, col),
|
|
@@ -9733,9 +9808,9 @@ function MatrxDataTableCore({
|
|
|
9733
9808
|
}
|
|
9734
9809
|
);
|
|
9735
9810
|
}
|
|
9736
|
-
return href ? /* @__PURE__ */ (0,
|
|
9811
|
+
return href ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Link, { href, onClick: (event) => event.stopPropagation(), className: "block w-full min-w-0 rounded outline-none focus-visible:ring-2 focus-visible:ring-ring", children: display }) : display;
|
|
9737
9812
|
};
|
|
9738
|
-
const currentViewSnapshot = (0,
|
|
9813
|
+
const currentViewSnapshot = (0, import_react20.useMemo)(
|
|
9739
9814
|
() => ({
|
|
9740
9815
|
__kind: "matrx-table-view",
|
|
9741
9816
|
version: 1,
|
|
@@ -9770,7 +9845,7 @@ function MatrxDataTableCore({
|
|
|
9770
9845
|
sort
|
|
9771
9846
|
]
|
|
9772
9847
|
);
|
|
9773
|
-
const declaredDefaultViewSnapshot = (0,
|
|
9848
|
+
const declaredDefaultViewSnapshot = (0, import_react20.useMemo)(
|
|
9774
9849
|
() => defaultViewSnapshot ?? {
|
|
9775
9850
|
__kind: "matrx-table-view",
|
|
9776
9851
|
version: 1,
|
|
@@ -9789,7 +9864,7 @@ function MatrxDataTableCore({
|
|
|
9789
9864
|
},
|
|
9790
9865
|
[columns, defaultPageSize, defaultSort, defaultViewSnapshot]
|
|
9791
9866
|
);
|
|
9792
|
-
const applySavedView = (0,
|
|
9867
|
+
const applySavedView = (0, import_react20.useCallback)(
|
|
9793
9868
|
(rawSnapshot) => {
|
|
9794
9869
|
const snapshot = parseTableViewSnapshot(rawSnapshot);
|
|
9795
9870
|
if (!snapshot) {
|
|
@@ -9839,7 +9914,7 @@ function MatrxDataTableCore({
|
|
|
9839
9914
|
},
|
|
9840
9915
|
[columns, commitColumnState, commitColumnWidths, controlledQuery, intelligentSearchEnabled, intelligentSearchScopes, toolbar]
|
|
9841
9916
|
);
|
|
9842
|
-
return /* @__PURE__ */ (0,
|
|
9917
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipProvider, { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
9843
9918
|
import_core3.DndContext,
|
|
9844
9919
|
{
|
|
9845
9920
|
id: tableDndContextId,
|
|
@@ -9932,7 +10007,7 @@ function MatrxDataTableCore({
|
|
|
9932
10007
|
commitColumnState(order, effectiveHiddenColumnIds);
|
|
9933
10008
|
},
|
|
9934
10009
|
children: [
|
|
9935
|
-
/* @__PURE__ */ (0,
|
|
10010
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
9936
10011
|
"div",
|
|
9937
10012
|
{
|
|
9938
10013
|
ref: rootRef,
|
|
@@ -9946,14 +10021,14 @@ function MatrxDataTableCore({
|
|
|
9946
10021
|
),
|
|
9947
10022
|
children: [
|
|
9948
10023
|
notice,
|
|
9949
|
-
savedViewError ? /* @__PURE__ */ (0,
|
|
9950
|
-
toolbarActionError ? /* @__PURE__ */ (0,
|
|
9951
|
-
!hideToolbar && (viewTabs || toolbar?.title || showSearch || toolbar?.anyOf || toolbar?.layeredFilters || toolbar?.facets && toolbar.facets.length > 0 || toolbar?.leading || toolbar?.actions || toolbar?.refresh || toolbar?.add || tableId && SavedViews || hasActiveFilters || showToolbarCopy || columns.length > 0) && /* @__PURE__ */ (0,
|
|
10024
|
+
savedViewError ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "alert", className: "shrink-0 text-xs text-destructive", children: savedViewError }) : null,
|
|
10025
|
+
toolbarActionError ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "alert", className: "shrink-0 text-xs text-destructive", children: toolbarActionError }) : null,
|
|
10026
|
+
!hideToolbar && (viewTabs || toolbar?.title || showSearch || toolbar?.anyOf || toolbar?.layeredFilters || toolbar?.facets && toolbar.facets.length > 0 || toolbar?.leading || toolbar?.actions || toolbar?.refresh || toolbar?.add || tableId && SavedViews || hasActiveFilters || showToolbarCopy || columns.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
9952
10027
|
TableTitleRow,
|
|
9953
10028
|
{
|
|
9954
|
-
tabs: viewTabs ? /* @__PURE__ */ (0,
|
|
10029
|
+
tabs: viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applySavedView, related: relatedTableActions }, tableId ?? "table") : void 0,
|
|
9955
10030
|
...toolbar?.title === void 0 ? {} : { title: toolbar.title },
|
|
9956
|
-
context: tableId && SavedViews ? /* @__PURE__ */ (0,
|
|
10031
|
+
context: tableId && SavedViews ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9957
10032
|
SavedViews,
|
|
9958
10033
|
{
|
|
9959
10034
|
tableId,
|
|
@@ -9962,7 +10037,7 @@ function MatrxDataTableCore({
|
|
|
9962
10037
|
onApply: applySavedView
|
|
9963
10038
|
}
|
|
9964
10039
|
) }) : void 0,
|
|
9965
|
-
search: showSearch ? intelligentSearchEnabled ? /* @__PURE__ */ (0,
|
|
10040
|
+
search: showSearch ? intelligentSearchEnabled ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9966
10041
|
TableSearch,
|
|
9967
10042
|
{
|
|
9968
10043
|
value: searchValue,
|
|
@@ -9972,7 +10047,7 @@ function MatrxDataTableCore({
|
|
|
9972
10047
|
scopes: intelligentSearchScopes,
|
|
9973
10048
|
...toolbar?.searchPlaceholder === void 0 ? {} : { placeholder: toolbar.searchPlaceholder }
|
|
9974
10049
|
}
|
|
9975
|
-
) : /* @__PURE__ */ (0,
|
|
10050
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
9976
10051
|
"div",
|
|
9977
10052
|
{
|
|
9978
10053
|
"data-matrx-table-search": true,
|
|
@@ -9981,9 +10056,9 @@ function MatrxDataTableCore({
|
|
|
9981
10056
|
toolbar?.searchMatch ? "sm:max-w-md" : "sm:max-w-xs"
|
|
9982
10057
|
),
|
|
9983
10058
|
children: [
|
|
9984
|
-
/* @__PURE__ */ (0,
|
|
9985
|
-
/* @__PURE__ */ (0,
|
|
9986
|
-
/* @__PURE__ */ (0,
|
|
10059
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "relative min-w-0 flex-1", children: [
|
|
10060
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Search, { className: "absolute left-2 top-1/2 h-5 w-5 -translate-y-1/2 text-muted-foreground" }),
|
|
10061
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
9987
10062
|
Input,
|
|
9988
10063
|
{
|
|
9989
10064
|
value: searchValue,
|
|
@@ -9996,22 +10071,22 @@ function MatrxDataTableCore({
|
|
|
9996
10071
|
style: { fontSize: "16px" }
|
|
9997
10072
|
}
|
|
9998
10073
|
),
|
|
9999
|
-
searchValue ? /* @__PURE__ */ (0,
|
|
10000
|
-
/* @__PURE__ */ (0,
|
|
10074
|
+
searchValue ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
10075
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10001
10076
|
"button",
|
|
10002
10077
|
{
|
|
10003
10078
|
type: "button",
|
|
10004
10079
|
"aria-label": "Clear search",
|
|
10005
10080
|
className: "absolute right-1.5 top-1/2 -translate-y-1/2 rounded p-0.5 text-muted-foreground hover:text-foreground",
|
|
10006
10081
|
onClick: () => setSearchValue(""),
|
|
10007
|
-
children: /* @__PURE__ */ (0,
|
|
10082
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(X, { className: "h-5 w-5" })
|
|
10008
10083
|
}
|
|
10009
10084
|
) }),
|
|
10010
|
-
/* @__PURE__ */ (0,
|
|
10085
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: "Clear search" })
|
|
10011
10086
|
] }) : null
|
|
10012
10087
|
] }),
|
|
10013
|
-
toolbar?.searchMatch ? /* @__PURE__ */ (0,
|
|
10014
|
-
/* @__PURE__ */ (0,
|
|
10088
|
+
toolbar?.searchMatch ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
10089
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10015
10090
|
Button,
|
|
10016
10091
|
{
|
|
10017
10092
|
type: "button",
|
|
@@ -10024,18 +10099,18 @@ function MatrxDataTableCore({
|
|
|
10024
10099
|
searchMatchMode === "whole_words" ? "contains" : "whole_words"
|
|
10025
10100
|
),
|
|
10026
10101
|
children: [
|
|
10027
|
-
/* @__PURE__ */ (0,
|
|
10102
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(WholeWord, { className: "h-5 w-5" }),
|
|
10028
10103
|
searchMatchMode === "whole_words" ? "Whole words" : "Contains"
|
|
10029
10104
|
]
|
|
10030
10105
|
}
|
|
10031
10106
|
) }),
|
|
10032
|
-
/* @__PURE__ */ (0,
|
|
10107
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: searchMatchMode === "whole_words" ? "Whole words \u2014 click to match text anywhere" : "Contains text \u2014 click to require whole words" })
|
|
10033
10108
|
] }) : null
|
|
10034
10109
|
]
|
|
10035
10110
|
}
|
|
10036
10111
|
) : null,
|
|
10037
10112
|
children: [
|
|
10038
|
-
toolbar?.layeredFilters ? /* @__PURE__ */ (0,
|
|
10113
|
+
toolbar?.layeredFilters ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10039
10114
|
LayeredFilterBuilder,
|
|
10040
10115
|
{
|
|
10041
10116
|
fields: toolbar.layeredFilters.fields,
|
|
@@ -10045,9 +10120,9 @@ function MatrxDataTableCore({
|
|
|
10045
10120
|
label: toolbar.layeredFilters.label
|
|
10046
10121
|
}
|
|
10047
10122
|
) : null,
|
|
10048
|
-
toolbar?.anyOf ? /* @__PURE__ */ (0,
|
|
10049
|
-
/* @__PURE__ */ (0,
|
|
10050
|
-
/* @__PURE__ */ (0,
|
|
10123
|
+
toolbar?.anyOf ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "relative w-full max-w-xs", children: [
|
|
10124
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Search, { className: "absolute left-2 top-1/2 h-5 w-5 -translate-y-1/2 text-muted-foreground" }),
|
|
10125
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10051
10126
|
Input,
|
|
10052
10127
|
{
|
|
10053
10128
|
value: anyOfValue,
|
|
@@ -10057,22 +10132,22 @@ function MatrxDataTableCore({
|
|
|
10057
10132
|
style: { fontSize: "16px" }
|
|
10058
10133
|
}
|
|
10059
10134
|
),
|
|
10060
|
-
anyOfValue ? /* @__PURE__ */ (0,
|
|
10061
|
-
/* @__PURE__ */ (0,
|
|
10135
|
+
anyOfValue ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
10136
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10062
10137
|
"button",
|
|
10063
10138
|
{
|
|
10064
10139
|
type: "button",
|
|
10065
10140
|
"aria-label": "Clear match-any search",
|
|
10066
10141
|
className: "absolute right-1.5 top-1/2 -translate-y-1/2 rounded p-0.5 text-muted-foreground hover:text-foreground",
|
|
10067
10142
|
onClick: () => setAnyOfValue(""),
|
|
10068
|
-
children: /* @__PURE__ */ (0,
|
|
10143
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(X, { className: "h-5 w-5" })
|
|
10069
10144
|
}
|
|
10070
10145
|
) }),
|
|
10071
|
-
/* @__PURE__ */ (0,
|
|
10146
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: "Clear match-any search" })
|
|
10072
10147
|
] }) : null
|
|
10073
10148
|
] }) : null,
|
|
10074
|
-
renderedFacets ? /* @__PURE__ */ (0,
|
|
10075
|
-
toolbar?.leading ? /* @__PURE__ */ (0,
|
|
10149
|
+
renderedFacets ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ToolbarFacets, { facets: renderedFacets }) : null,
|
|
10150
|
+
toolbar?.leading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10076
10151
|
"div",
|
|
10077
10152
|
{
|
|
10078
10153
|
"data-matrx-table-toolbar-extras": true,
|
|
@@ -10080,13 +10155,13 @@ function MatrxDataTableCore({
|
|
|
10080
10155
|
children: toolbar.leading
|
|
10081
10156
|
}
|
|
10082
10157
|
) : null,
|
|
10083
|
-
/* @__PURE__ */ (0,
|
|
10158
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10084
10159
|
"div",
|
|
10085
10160
|
{
|
|
10086
10161
|
"data-matrx-table-actions": true,
|
|
10087
10162
|
className: "ml-auto flex min-w-0 flex-wrap items-center gap-0",
|
|
10088
10163
|
children: [
|
|
10089
|
-
sourceTotal !== void 0 ? /* @__PURE__ */ (0,
|
|
10164
|
+
sourceTotal !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10090
10165
|
"span",
|
|
10091
10166
|
{
|
|
10092
10167
|
"data-matrx-table-source-total": true,
|
|
@@ -10103,7 +10178,7 @@ function MatrxDataTableCore({
|
|
|
10103
10178
|
]
|
|
10104
10179
|
}
|
|
10105
10180
|
) : null,
|
|
10106
|
-
/* @__PURE__ */ (0,
|
|
10181
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10107
10182
|
TableToolbarAction,
|
|
10108
10183
|
{
|
|
10109
10184
|
HostAction: host.ToolbarAction,
|
|
@@ -10111,10 +10186,10 @@ function MatrxDataTableCore({
|
|
|
10111
10186
|
tooltip: hasActiveFilters ? "Clear search and filters; keep columns and sort" : "No search or filters to clear",
|
|
10112
10187
|
disabled: !hasActiveFilters,
|
|
10113
10188
|
onClick: clearAllFilters,
|
|
10114
|
-
children: /* @__PURE__ */ (0,
|
|
10189
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Eraser, {})
|
|
10115
10190
|
}
|
|
10116
10191
|
),
|
|
10117
|
-
showToolbarCopy && effectiveCopy ? /* @__PURE__ */ (0,
|
|
10192
|
+
showToolbarCopy && effectiveCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10118
10193
|
CopyButtons,
|
|
10119
10194
|
{
|
|
10120
10195
|
size: "toolbar",
|
|
@@ -10157,17 +10232,17 @@ function MatrxDataTableCore({
|
|
|
10157
10232
|
}
|
|
10158
10233
|
}
|
|
10159
10234
|
) : null,
|
|
10160
|
-
columns.length > 0 ? /* @__PURE__ */ (0,
|
|
10235
|
+
columns.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10161
10236
|
TableToolbarAction,
|
|
10162
10237
|
{
|
|
10163
10238
|
HostAction: host.ToolbarAction,
|
|
10164
10239
|
ariaLabel: "Columns",
|
|
10165
10240
|
tooltip: "Show, hide, or reorder columns",
|
|
10166
10241
|
onClick: () => setColumnManagerOpen(true),
|
|
10167
|
-
children: /* @__PURE__ */ (0,
|
|
10242
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SlidersHorizontal, {})
|
|
10168
10243
|
}
|
|
10169
10244
|
) : null,
|
|
10170
|
-
toolbar?.refresh ? /* @__PURE__ */ (0,
|
|
10245
|
+
toolbar?.refresh ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10171
10246
|
TableToolbarAction,
|
|
10172
10247
|
{
|
|
10173
10248
|
HostAction: host.ToolbarAction,
|
|
@@ -10189,10 +10264,10 @@ function MatrxDataTableCore({
|
|
|
10189
10264
|
setToolbarActionPending((current) => ({ ...current, refresh: false }));
|
|
10190
10265
|
});
|
|
10191
10266
|
},
|
|
10192
|
-
children: /* @__PURE__ */ (0,
|
|
10267
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(RefreshControlIcon, { spinning: isFetching || toolbarActionPending.refresh })
|
|
10193
10268
|
}
|
|
10194
10269
|
) : null,
|
|
10195
|
-
toolbar?.add ? /* @__PURE__ */ (0,
|
|
10270
|
+
toolbar?.add ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10196
10271
|
TableToolbarAction,
|
|
10197
10272
|
{
|
|
10198
10273
|
HostAction: host.ToolbarAction,
|
|
@@ -10214,7 +10289,7 @@ function MatrxDataTableCore({
|
|
|
10214
10289
|
setToolbarActionPending((current) => ({ ...current, add: false }));
|
|
10215
10290
|
});
|
|
10216
10291
|
},
|
|
10217
|
-
children: /* @__PURE__ */ (0,
|
|
10292
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Plus, {})
|
|
10218
10293
|
}
|
|
10219
10294
|
) : null,
|
|
10220
10295
|
toolbar?.actions
|
|
@@ -10224,15 +10299,15 @@ function MatrxDataTableCore({
|
|
|
10224
10299
|
]
|
|
10225
10300
|
}
|
|
10226
10301
|
),
|
|
10227
|
-
selection && selectionCount > 0 ? /* @__PURE__ */ (0,
|
|
10228
|
-
/* @__PURE__ */ (0,
|
|
10302
|
+
selection && selectionCount > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex shrink-0 flex-wrap items-center gap-2 rounded-md border border-primary/30 bg-primary/5 px-2 py-1.5", children: [
|
|
10303
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("span", { className: "text-xs font-medium text-foreground", children: [
|
|
10229
10304
|
(0, import_format3.formatCount)(selectionCount),
|
|
10230
10305
|
" ",
|
|
10231
10306
|
selectionNoun,
|
|
10232
10307
|
selectionCount === 1 ? "" : "s",
|
|
10233
10308
|
" selected"
|
|
10234
10309
|
] }),
|
|
10235
|
-
/* @__PURE__ */ (0,
|
|
10310
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10236
10311
|
Button,
|
|
10237
10312
|
{
|
|
10238
10313
|
type: "button",
|
|
@@ -10244,13 +10319,13 @@ function MatrxDataTableCore({
|
|
|
10244
10319
|
selection.onSelectedIdsChange([]);
|
|
10245
10320
|
},
|
|
10246
10321
|
children: [
|
|
10247
|
-
/* @__PURE__ */ (0,
|
|
10322
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(X, { className: "h-3.5 w-3.5" }),
|
|
10248
10323
|
"Clear"
|
|
10249
10324
|
]
|
|
10250
10325
|
}
|
|
10251
10326
|
),
|
|
10252
|
-
/* @__PURE__ */ (0,
|
|
10253
|
-
effectiveCopy && selectedRows.length > 0 ? /* @__PURE__ */ (0,
|
|
10327
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "ml-auto flex flex-wrap items-center gap-1.5", children: [
|
|
10328
|
+
effectiveCopy && selectedRows.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10254
10329
|
CopyButtons,
|
|
10255
10330
|
{
|
|
10256
10331
|
size: "icon",
|
|
@@ -10283,9 +10358,9 @@ function MatrxDataTableCore({
|
|
|
10283
10358
|
selection.actions?.(selectedRows, selection.selectedIds)
|
|
10284
10359
|
] })
|
|
10285
10360
|
] }) : null,
|
|
10286
|
-
/* @__PURE__ */ (0,
|
|
10287
|
-
/* @__PURE__ */ (0,
|
|
10288
|
-
mobileCards ? /* @__PURE__ */ (0,
|
|
10361
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { "data-matrx-table-body-region": true, className: "flex min-h-0 flex-1 flex-col gap-2", children: [
|
|
10362
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "relative min-h-0 flex-1", children: [
|
|
10363
|
+
mobileCards ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10289
10364
|
"div",
|
|
10290
10365
|
{
|
|
10291
10366
|
ref: cardsScrollRef,
|
|
@@ -10297,33 +10372,33 @@ function MatrxDataTableCore({
|
|
|
10297
10372
|
mobileCardsClass
|
|
10298
10373
|
),
|
|
10299
10374
|
children: [
|
|
10300
|
-
isFetching && !isLoading && appendQuery === null ? /* @__PURE__ */ (0,
|
|
10375
|
+
isFetching && !isLoading && appendQuery === null ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10301
10376
|
"div",
|
|
10302
10377
|
{
|
|
10303
10378
|
role: "status",
|
|
10304
10379
|
className: "pointer-events-none absolute inset-x-0 top-0 z-20 h-0.5 overflow-hidden bg-primary/15",
|
|
10305
10380
|
children: [
|
|
10306
|
-
/* @__PURE__ */ (0,
|
|
10307
|
-
/* @__PURE__ */ (0,
|
|
10381
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "h-full w-full animate-pulse bg-primary" }),
|
|
10382
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "sr-only", children: "Refreshing table data" })
|
|
10308
10383
|
]
|
|
10309
10384
|
}
|
|
10310
10385
|
) : null,
|
|
10311
|
-
isLoading ? Array.from({ length: 4 }).map((_, index) => /* @__PURE__ */ (0,
|
|
10386
|
+
isLoading ? Array.from({ length: 4 }).map((_, index) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10312
10387
|
Skeleton,
|
|
10313
10388
|
{
|
|
10314
10389
|
className: "h-52 w-full shrink-0 rounded-lg"
|
|
10315
10390
|
},
|
|
10316
10391
|
`mobile-card-sk-${index}`
|
|
10317
|
-
)) : paginated.length === 0 ? /* @__PURE__ */ (0,
|
|
10392
|
+
)) : paginated.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "flex min-h-48 flex-1 items-center justify-center px-4 py-12 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex max-w-sm flex-col items-center gap-2", children: [
|
|
10318
10393
|
renderedEmptyState?.icon,
|
|
10319
|
-
/* @__PURE__ */ (0,
|
|
10320
|
-
renderedEmptyState?.description ? /* @__PURE__ */ (0,
|
|
10394
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "text-sm font-medium text-foreground", children: renderedEmptyState?.title ?? "No rows" }),
|
|
10395
|
+
renderedEmptyState?.description ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "text-xs text-muted-foreground", children: renderedEmptyState.description }) : null,
|
|
10321
10396
|
renderedEmptyState?.action
|
|
10322
10397
|
] }) }) : paginated.map((row, index) => {
|
|
10323
10398
|
const id = getRowId(row);
|
|
10324
10399
|
const displayRow = applyRowEdits(row, edits[id]);
|
|
10325
10400
|
const selectable = selection?.isRowSelectable?.(row) ?? Boolean(selection);
|
|
10326
|
-
return /* @__PURE__ */ (0,
|
|
10401
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react20.Fragment, { children: mobileCards(displayRow, index, {
|
|
10327
10402
|
renderCell: (columnKey) => {
|
|
10328
10403
|
const column = columns.find((candidate) => columnId(candidate) === columnKey);
|
|
10329
10404
|
return column ? renderRecordCell(row, column, index) : null;
|
|
@@ -10339,14 +10414,14 @@ function MatrxDataTableCore({
|
|
|
10339
10414
|
else next.delete(id);
|
|
10340
10415
|
setSelectedIds(next);
|
|
10341
10416
|
},
|
|
10342
|
-
actions:
|
|
10417
|
+
actions: showInlineRowCopy || rowActions ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10343
10418
|
"div",
|
|
10344
10419
|
{
|
|
10345
10420
|
"data-matrx-table-row-actions": true,
|
|
10346
10421
|
className: "inline-flex items-center justify-end gap-0",
|
|
10347
10422
|
onClick: (event) => event.stopPropagation(),
|
|
10348
10423
|
children: [
|
|
10349
|
-
|
|
10424
|
+
showInlineRowCopy && effectiveCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10350
10425
|
TableRowCopyControl,
|
|
10351
10426
|
{
|
|
10352
10427
|
size: "toolbar",
|
|
@@ -10356,7 +10431,7 @@ function MatrxDataTableCore({
|
|
|
10356
10431
|
...copy === void 0 ? { defaultColumns: declaredVisibleCopyColumns } : {}
|
|
10357
10432
|
}
|
|
10358
10433
|
) : null,
|
|
10359
|
-
|
|
10434
|
+
renderRowActions(displayRow, {
|
|
10360
10435
|
closeDetail: () => setSelectedId(null),
|
|
10361
10436
|
openDetail: () => openDetail(displayRow),
|
|
10362
10437
|
openWindow: () => openWindow(displayRow),
|
|
@@ -10369,7 +10444,7 @@ function MatrxDataTableCore({
|
|
|
10369
10444
|
) : null
|
|
10370
10445
|
}) }, id);
|
|
10371
10446
|
}),
|
|
10372
|
-
appendQuery !== null && isFetching && !isLoading ? /* @__PURE__ */ (0,
|
|
10447
|
+
appendQuery !== null && isFetching && !isLoading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10373
10448
|
"div",
|
|
10374
10449
|
{
|
|
10375
10450
|
"data-matrx-table-append-loading-card": true,
|
|
@@ -10377,7 +10452,7 @@ function MatrxDataTableCore({
|
|
|
10377
10452
|
"aria-live": "polite",
|
|
10378
10453
|
className: "sticky bottom-0 z-20 flex h-16 w-full max-w-[100cqw] shrink-0 items-center justify-center gap-2 rounded-md border border-border bg-card/95 px-3 text-sm font-medium text-foreground shadow-sm backdrop-blur-sm",
|
|
10379
10454
|
children: [
|
|
10380
|
-
/* @__PURE__ */ (0,
|
|
10455
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10381
10456
|
Loader2,
|
|
10382
10457
|
{
|
|
10383
10458
|
"aria-hidden": "true",
|
|
@@ -10391,7 +10466,7 @@ function MatrxDataTableCore({
|
|
|
10391
10466
|
]
|
|
10392
10467
|
}
|
|
10393
10468
|
) : null,
|
|
10394
|
-
/* @__PURE__ */ (0,
|
|
10469
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10395
10470
|
"div",
|
|
10396
10471
|
{
|
|
10397
10472
|
ref: scrollRef,
|
|
@@ -10405,32 +10480,32 @@ function MatrxDataTableCore({
|
|
|
10405
10480
|
tableClassName
|
|
10406
10481
|
),
|
|
10407
10482
|
children: [
|
|
10408
|
-
hierarchy && draggedRow ? /* @__PURE__ */ (0,
|
|
10483
|
+
hierarchy && draggedRow ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10409
10484
|
HierarchyRootDropTarget,
|
|
10410
10485
|
{
|
|
10411
10486
|
label: hierarchy.rootDropLabel ?? "Drop here to move to the top level",
|
|
10412
10487
|
draggedLabel: hierarchy.itemLabel?.(draggedRow) ?? "Moving row"
|
|
10413
10488
|
}
|
|
10414
10489
|
) : null,
|
|
10415
|
-
hierarchy && draggedRowId ? /* @__PURE__ */ (0,
|
|
10490
|
+
hierarchy && draggedRowId ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10416
10491
|
HierarchyDragIndicatorLayer,
|
|
10417
10492
|
{
|
|
10418
10493
|
scrollRef,
|
|
10419
10494
|
resolve: resolveHierarchyMove
|
|
10420
10495
|
}
|
|
10421
10496
|
) : null,
|
|
10422
|
-
isFetching && !isLoading && appendQuery === null ? /* @__PURE__ */ (0,
|
|
10497
|
+
isFetching && !isLoading && appendQuery === null ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10423
10498
|
"div",
|
|
10424
10499
|
{
|
|
10425
10500
|
role: "status",
|
|
10426
10501
|
className: "pointer-events-none absolute inset-x-0 top-0 z-20 h-0.5 overflow-hidden bg-primary/15",
|
|
10427
10502
|
children: [
|
|
10428
|
-
/* @__PURE__ */ (0,
|
|
10429
|
-
/* @__PURE__ */ (0,
|
|
10503
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "h-full w-full animate-pulse bg-primary" }),
|
|
10504
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "sr-only", children: "Refreshing table data" })
|
|
10430
10505
|
]
|
|
10431
10506
|
}
|
|
10432
10507
|
) : null,
|
|
10433
|
-
/* @__PURE__ */ (0,
|
|
10508
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10434
10509
|
"table",
|
|
10435
10510
|
{
|
|
10436
10511
|
ref: tableRef,
|
|
@@ -10448,7 +10523,7 @@ function MatrxDataTableCore({
|
|
|
10448
10523
|
fixedLayoutActive && "sm:table-fixed sm:max-w-none sm:w-[var(--matrx-resized-table-width)]"
|
|
10449
10524
|
),
|
|
10450
10525
|
children: [
|
|
10451
|
-
/* @__PURE__ */ (0,
|
|
10526
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10452
10527
|
"thead",
|
|
10453
10528
|
{
|
|
10454
10529
|
ref: tableHeaderRef,
|
|
@@ -10457,14 +10532,14 @@ function MatrxDataTableCore({
|
|
|
10457
10532
|
"z-10 border-b border-border bg-muted/90 shadow-[0_1px_0_0_var(--border)] backdrop-blur-sm",
|
|
10458
10533
|
stickyHeader && (documentStickyHeader ? "relative translate-y-[var(--matrx-document-sticky-offset)]" : "sticky top-0")
|
|
10459
10534
|
),
|
|
10460
|
-
children: /* @__PURE__ */ (0,
|
|
10461
|
-
selection ? /* @__PURE__ */ (0,
|
|
10535
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("tr", { children: [
|
|
10536
|
+
selection ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10462
10537
|
"th",
|
|
10463
10538
|
{
|
|
10464
10539
|
"data-matrx-table-selection-column": true,
|
|
10465
10540
|
className: "h-9 w-9 px-2 text-left align-middle",
|
|
10466
10541
|
style: fixedUtilityWidth(fixedTableGeometry?.selectionWidth),
|
|
10467
|
-
children: /* @__PURE__ */ (0,
|
|
10542
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10468
10543
|
"div",
|
|
10469
10544
|
{
|
|
10470
10545
|
"data-matrx-table-selection-target": true,
|
|
@@ -10473,7 +10548,7 @@ function MatrxDataTableCore({
|
|
|
10473
10548
|
event.currentTarget.querySelector('[role="checkbox"]')?.click();
|
|
10474
10549
|
}
|
|
10475
10550
|
},
|
|
10476
|
-
children: /* @__PURE__ */ (0,
|
|
10551
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10477
10552
|
Checkbox,
|
|
10478
10553
|
{
|
|
10479
10554
|
className: CHECKBOX_TAP_AREA,
|
|
@@ -10495,7 +10570,7 @@ function MatrxDataTableCore({
|
|
|
10495
10570
|
const defaultSortDirection = col.defaultSortDirection ?? "asc";
|
|
10496
10571
|
const isColumnDragShadow = columnDragPreview?.draggedId === id && columnDragPreview.targetId !== null;
|
|
10497
10572
|
const columnResizable = resizableColumns && col.resizable !== false;
|
|
10498
|
-
return /* @__PURE__ */ (0,
|
|
10573
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10499
10574
|
"th",
|
|
10500
10575
|
{
|
|
10501
10576
|
"data-matrx-table-column-id": id,
|
|
@@ -10525,7 +10600,7 @@ function MatrxDataTableCore({
|
|
|
10525
10600
|
),
|
|
10526
10601
|
style: columnWidthVar(col.width, effectiveColumnWidths[id], id, columnResizable),
|
|
10527
10602
|
children: [
|
|
10528
|
-
/* @__PURE__ */ (0,
|
|
10603
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ColumnHeaderDropZone, { id, enabled: reorderableColumns, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10529
10604
|
ColumnHeaderCell,
|
|
10530
10605
|
{
|
|
10531
10606
|
label: col.header,
|
|
@@ -10562,7 +10637,7 @@ function MatrxDataTableCore({
|
|
|
10562
10637
|
reorderColumn: reorderableColumns ? { id, label: headerLabel } : void 0
|
|
10563
10638
|
}
|
|
10564
10639
|
) }),
|
|
10565
|
-
columnResizable ? /* @__PURE__ */ (0,
|
|
10640
|
+
columnResizable ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10566
10641
|
ColumnResizeHandle,
|
|
10567
10642
|
{
|
|
10568
10643
|
columnId: id,
|
|
@@ -10583,7 +10658,7 @@ function MatrxDataTableCore({
|
|
|
10583
10658
|
id
|
|
10584
10659
|
);
|
|
10585
10660
|
}),
|
|
10586
|
-
showActionsCol && /* @__PURE__ */ (0,
|
|
10661
|
+
showActionsCol && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10587
10662
|
"th",
|
|
10588
10663
|
{
|
|
10589
10664
|
"data-matrx-table-actions-column": true,
|
|
@@ -10595,10 +10670,10 @@ function MatrxDataTableCore({
|
|
|
10595
10670
|
] })
|
|
10596
10671
|
}
|
|
10597
10672
|
),
|
|
10598
|
-
/* @__PURE__ */ (0,
|
|
10599
|
-
isLoading ? Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0,
|
|
10600
|
-
selection ? /* @__PURE__ */ (0,
|
|
10601
|
-
visibleColumns.map((col) => /* @__PURE__ */ (0,
|
|
10673
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("tbody", { children: [
|
|
10674
|
+
isLoading ? Array.from({ length: 6 }).map((_, i) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("tr", { className: "border-b border-border/60", children: [
|
|
10675
|
+
selection ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("td", { className: "px-2 py-2", style: fixedUtilityWidth(fixedTableGeometry?.selectionWidth), children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Skeleton, { className: "h-3.5 w-3.5" }) }) : null,
|
|
10676
|
+
visibleColumns.map((col) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10602
10677
|
"td",
|
|
10603
10678
|
{
|
|
10604
10679
|
className: cn(
|
|
@@ -10606,20 +10681,20 @@ function MatrxDataTableCore({
|
|
|
10606
10681
|
col.compact ? "px-1" : "px-2",
|
|
10607
10682
|
col.mobileHidden && "max-sm:hidden"
|
|
10608
10683
|
),
|
|
10609
|
-
children: /* @__PURE__ */ (0,
|
|
10684
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Skeleton, { className: "h-5 w-full" })
|
|
10610
10685
|
},
|
|
10611
10686
|
columnId(col)
|
|
10612
10687
|
)),
|
|
10613
|
-
showActionsCol && /* @__PURE__ */ (0,
|
|
10614
|
-
] }, `sk-${i}`)) : paginated.length === 0 ? /* @__PURE__ */ (0,
|
|
10688
|
+
showActionsCol && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("td", { className: "text-right align-middle", style: fixedUtilityWidth(fixedTableGeometry?.actionsWidth), children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Skeleton, { className: "ml-auto h-5 w-10" }) })
|
|
10689
|
+
] }, `sk-${i}`)) : paginated.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10615
10690
|
"td",
|
|
10616
10691
|
{
|
|
10617
10692
|
colSpan: visibleColumns.length + leadingCols + (showActionsCol ? 1 : 0),
|
|
10618
10693
|
className: "px-0 py-12 text-center",
|
|
10619
|
-
children: /* @__PURE__ */ (0,
|
|
10694
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { "data-matrx-table-empty-state": true, className: "sticky left-0 flex flex-col items-center gap-2 whitespace-normal px-4", style: { width: "100cqw", maxWidth: "100%" }, children: [
|
|
10620
10695
|
renderedEmptyState?.icon,
|
|
10621
|
-
/* @__PURE__ */ (0,
|
|
10622
|
-
renderedEmptyState?.description ? /* @__PURE__ */ (0,
|
|
10696
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "text-sm font-medium text-foreground", children: renderedEmptyState?.title ?? "No rows" }),
|
|
10697
|
+
renderedEmptyState?.description ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "text-xs text-muted-foreground", children: renderedEmptyState.description }) : null,
|
|
10623
10698
|
renderedEmptyState?.action
|
|
10624
10699
|
] })
|
|
10625
10700
|
}
|
|
@@ -10629,7 +10704,7 @@ function MatrxDataTableCore({
|
|
|
10629
10704
|
const rowEdits = edits[id];
|
|
10630
10705
|
const displayRow = applyRowEdits(row, rowEdits);
|
|
10631
10706
|
const isChecked = selectedIdSet.has(id);
|
|
10632
|
-
const rowNode = /* @__PURE__ */ (0,
|
|
10707
|
+
const rowNode = /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10633
10708
|
"tr",
|
|
10634
10709
|
{
|
|
10635
10710
|
"data-row-id": id,
|
|
@@ -10652,13 +10727,13 @@ function MatrxDataTableCore({
|
|
|
10652
10727
|
zebra && index % 2 === 1 && !isSelected && !isChecked && "sm:bg-muted/20"
|
|
10653
10728
|
),
|
|
10654
10729
|
children: [
|
|
10655
|
-
selection ? /* @__PURE__ */ (0,
|
|
10730
|
+
selection ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10656
10731
|
"td",
|
|
10657
10732
|
{
|
|
10658
10733
|
className: "px-2 py-1.5 align-middle lg:py-0.5",
|
|
10659
10734
|
style: fixedUtilityWidth(fixedTableGeometry?.selectionWidth),
|
|
10660
10735
|
onClick: (e) => e.stopPropagation(),
|
|
10661
|
-
children: selection.isRowSelectable?.(row) ?? true ? /* @__PURE__ */ (0,
|
|
10736
|
+
children: selection.isRowSelectable?.(row) ?? true ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10662
10737
|
"div",
|
|
10663
10738
|
{
|
|
10664
10739
|
"data-matrx-table-selection-target": true,
|
|
@@ -10667,7 +10742,7 @@ function MatrxDataTableCore({
|
|
|
10667
10742
|
event.currentTarget.querySelector('[role="checkbox"]')?.click();
|
|
10668
10743
|
}
|
|
10669
10744
|
},
|
|
10670
|
-
children: /* @__PURE__ */ (0,
|
|
10745
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10671
10746
|
Checkbox,
|
|
10672
10747
|
{
|
|
10673
10748
|
className: CHECKBOX_TAP_AREA,
|
|
@@ -10682,7 +10757,7 @@ function MatrxDataTableCore({
|
|
|
10682
10757
|
) : null,
|
|
10683
10758
|
visibleColumns.map((col, colIdx) => {
|
|
10684
10759
|
const isColumnDragShadow = columnDragPreview?.draggedId === columnId(col) && columnDragPreview.targetId !== null;
|
|
10685
|
-
return /* @__PURE__ */ (0,
|
|
10760
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10686
10761
|
"td",
|
|
10687
10762
|
{
|
|
10688
10763
|
"data-matrx-table-column-id": columnId(col),
|
|
@@ -10706,14 +10781,14 @@ function MatrxDataTableCore({
|
|
|
10706
10781
|
columnId(col),
|
|
10707
10782
|
resizableColumns && col.resizable !== false
|
|
10708
10783
|
),
|
|
10709
|
-
children: /* @__PURE__ */ (0,
|
|
10784
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10710
10785
|
"div",
|
|
10711
10786
|
{
|
|
10712
10787
|
className: cn(
|
|
10713
10788
|
colIdx === 0 && hierarchy && "flex min-w-0 items-center"
|
|
10714
10789
|
),
|
|
10715
10790
|
children: [
|
|
10716
|
-
colIdx === 0 && hierarchy ? /* @__PURE__ */ (0,
|
|
10791
|
+
colIdx === 0 && hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10717
10792
|
HierarchyDragHandle,
|
|
10718
10793
|
{
|
|
10719
10794
|
id,
|
|
@@ -10721,7 +10796,7 @@ function MatrxDataTableCore({
|
|
|
10721
10796
|
disabled: !(hierarchy.canReparent?.(row) ?? true)
|
|
10722
10797
|
}
|
|
10723
10798
|
) : null,
|
|
10724
|
-
/* @__PURE__ */ (0,
|
|
10799
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10725
10800
|
"div",
|
|
10726
10801
|
{
|
|
10727
10802
|
"data-matrx-cell-content": true,
|
|
@@ -10736,20 +10811,20 @@ function MatrxDataTableCore({
|
|
|
10736
10811
|
columnId(col)
|
|
10737
10812
|
);
|
|
10738
10813
|
}),
|
|
10739
|
-
showActionsCol && /* @__PURE__ */ (0,
|
|
10814
|
+
showActionsCol && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10740
10815
|
"td",
|
|
10741
10816
|
{
|
|
10742
10817
|
"data-matrx-table-row-action-cell": true,
|
|
10743
10818
|
className: "text-right align-middle",
|
|
10744
10819
|
style: fixedUtilityWidth(fixedTableGeometry?.actionsWidth),
|
|
10745
|
-
children: /* @__PURE__ */ (0,
|
|
10820
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10746
10821
|
"div",
|
|
10747
10822
|
{
|
|
10748
10823
|
"data-matrx-table-row-actions": true,
|
|
10749
10824
|
className: "inline-flex items-center justify-end gap-0",
|
|
10750
10825
|
onClick: (e) => e.stopPropagation(),
|
|
10751
10826
|
children: [
|
|
10752
|
-
|
|
10827
|
+
showInlineRowCopy && effectiveCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10753
10828
|
TableRowCopyControl,
|
|
10754
10829
|
{
|
|
10755
10830
|
size: "toolbar",
|
|
@@ -10759,7 +10834,7 @@ function MatrxDataTableCore({
|
|
|
10759
10834
|
...copy === void 0 ? { defaultColumns: declaredVisibleCopyColumns } : {}
|
|
10760
10835
|
}
|
|
10761
10836
|
) : null,
|
|
10762
|
-
|
|
10837
|
+
renderRowActions(displayRow, {
|
|
10763
10838
|
closeDetail: () => setSelectedId(null),
|
|
10764
10839
|
openDetail: () => openDetail(displayRow),
|
|
10765
10840
|
openWindow: () => openWindow(displayRow),
|
|
@@ -10767,8 +10842,8 @@ function MatrxDataTableCore({
|
|
|
10767
10842
|
hasPendingEdits: Boolean(rowEdits),
|
|
10768
10843
|
discardPendingEdits: () => discardRowEdits(id)
|
|
10769
10844
|
}),
|
|
10770
|
-
windowEnabled ? /* @__PURE__ */ (0,
|
|
10771
|
-
/* @__PURE__ */ (0,
|
|
10845
|
+
windowEnabled ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
10846
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10772
10847
|
Button,
|
|
10773
10848
|
{
|
|
10774
10849
|
type: "button",
|
|
@@ -10782,10 +10857,10 @@ function MatrxDataTableCore({
|
|
|
10782
10857
|
if (windowConfig?.openOnRowClick === true) openDetail(row);
|
|
10783
10858
|
else openWindow(row);
|
|
10784
10859
|
},
|
|
10785
|
-
children: opensWindowOnRowClick ? /* @__PURE__ */ (0,
|
|
10860
|
+
children: opensWindowOnRowClick ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(PanelRightOpen, { className: "h-5 w-5" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(PanelRight, { className: "h-5 w-5" })
|
|
10786
10861
|
}
|
|
10787
10862
|
) }),
|
|
10788
|
-
/* @__PURE__ */ (0,
|
|
10863
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: windowConfig?.openOnRowClick === true ? "Open in side panel" : "Open in window" })
|
|
10789
10864
|
] }) : null
|
|
10790
10865
|
]
|
|
10791
10866
|
}
|
|
@@ -10797,7 +10872,7 @@ function MatrxDataTableCore({
|
|
|
10797
10872
|
id
|
|
10798
10873
|
);
|
|
10799
10874
|
const wrappedRow = rowWrapper ? rowWrapper(row, rowNode) : rowNode;
|
|
10800
|
-
return hierarchy ? /* @__PURE__ */ (0,
|
|
10875
|
+
return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10801
10876
|
HierarchyDroppableRow,
|
|
10802
10877
|
{
|
|
10803
10878
|
id,
|
|
@@ -10805,21 +10880,21 @@ function MatrxDataTableCore({
|
|
|
10805
10880
|
children: wrappedRow
|
|
10806
10881
|
},
|
|
10807
10882
|
id
|
|
10808
|
-
) : /* @__PURE__ */ (0,
|
|
10883
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_react20.Fragment, { children: wrappedRow }, id);
|
|
10809
10884
|
}),
|
|
10810
|
-
appendQuery !== null && isFetching && !isLoading ? /* @__PURE__ */ (0,
|
|
10885
|
+
appendQuery !== null && isFetching && !isLoading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("tr", { "data-matrx-table-append-loading-row": true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10811
10886
|
"td",
|
|
10812
10887
|
{
|
|
10813
10888
|
colSpan: visibleColumns.length + leadingCols + (showActionsCol ? 1 : 0),
|
|
10814
10889
|
className: "sticky bottom-0 z-20 h-16 border-y border-border bg-card/95 px-0 py-0 text-left shadow-sm backdrop-blur-sm",
|
|
10815
|
-
children: /* @__PURE__ */ (0,
|
|
10890
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10816
10891
|
"div",
|
|
10817
10892
|
{
|
|
10818
10893
|
role: "status",
|
|
10819
10894
|
"aria-live": "polite",
|
|
10820
10895
|
className: "sticky left-0 flex h-16 w-fit max-w-[100cqw] items-center justify-center gap-2 px-3 text-sm font-medium text-foreground",
|
|
10821
10896
|
children: [
|
|
10822
|
-
/* @__PURE__ */ (0,
|
|
10897
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10823
10898
|
Loader2,
|
|
10824
10899
|
{
|
|
10825
10900
|
"aria-hidden": "true",
|
|
@@ -10833,9 +10908,9 @@ function MatrxDataTableCore({
|
|
|
10833
10908
|
}
|
|
10834
10909
|
) }) : null
|
|
10835
10910
|
] }),
|
|
10836
|
-
footerRows.length > 0 ? /* @__PURE__ */ (0,
|
|
10837
|
-
selection ? /* @__PURE__ */ (0,
|
|
10838
|
-
visibleColumns.map((column) => /* @__PURE__ */ (0,
|
|
10911
|
+
footerRows.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("tfoot", { className: "border-t-2 border-border bg-muted/50 font-semibold", children: footerRows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("tr", { children: [
|
|
10912
|
+
selection ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("td", { className: "px-2 py-2" }) : null,
|
|
10913
|
+
visibleColumns.map((column) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10839
10914
|
"td",
|
|
10840
10915
|
{
|
|
10841
10916
|
className: cn(
|
|
@@ -10855,7 +10930,7 @@ function MatrxDataTableCore({
|
|
|
10855
10930
|
},
|
|
10856
10931
|
columnId(column)
|
|
10857
10932
|
)),
|
|
10858
|
-
showActionsCol ? /* @__PURE__ */ (0,
|
|
10933
|
+
showActionsCol ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("td", {}) : null
|
|
10859
10934
|
] }, `footer-${index}`)) }) : null
|
|
10860
10935
|
]
|
|
10861
10936
|
}
|
|
@@ -10863,8 +10938,8 @@ function MatrxDataTableCore({
|
|
|
10863
10938
|
]
|
|
10864
10939
|
}
|
|
10865
10940
|
),
|
|
10866
|
-
scrollHintLeft ? /* @__PURE__ */ (0,
|
|
10867
|
-
/* @__PURE__ */ (0,
|
|
10941
|
+
scrollHintLeft ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
10942
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10868
10943
|
Button,
|
|
10869
10944
|
{
|
|
10870
10945
|
type: "button",
|
|
@@ -10875,13 +10950,13 @@ function MatrxDataTableCore({
|
|
|
10875
10950
|
"data-matrx-table-scroll-control": "left",
|
|
10876
10951
|
className: "absolute left-1.5 top-1/2 z-30 hidden h-11 w-11 -translate-y-1/2 rounded-full border border-glass-edge bg-glass p-0 text-foreground shadow-glass backdrop-blur-glass backdrop-saturate-glass hover:bg-glass-hover active:bg-glass-active sm:inline-flex",
|
|
10877
10952
|
onClick: () => scrollTableHorizontally("left"),
|
|
10878
|
-
children: /* @__PURE__ */ (0,
|
|
10953
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ChevronLeft, { className: "h-5 w-5" })
|
|
10879
10954
|
}
|
|
10880
10955
|
) }),
|
|
10881
|
-
/* @__PURE__ */ (0,
|
|
10956
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: "More columns to the left" })
|
|
10882
10957
|
] }) : null,
|
|
10883
|
-
scrollHintRight ? /* @__PURE__ */ (0,
|
|
10884
|
-
/* @__PURE__ */ (0,
|
|
10958
|
+
scrollHintRight ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
10959
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10885
10960
|
Button,
|
|
10886
10961
|
{
|
|
10887
10962
|
type: "button",
|
|
@@ -10892,26 +10967,26 @@ function MatrxDataTableCore({
|
|
|
10892
10967
|
"data-matrx-table-scroll-control": "right",
|
|
10893
10968
|
className: "absolute right-1.5 top-1/2 z-30 hidden h-11 w-11 -translate-y-1/2 rounded-full border border-glass-edge bg-glass p-0 text-foreground shadow-glass backdrop-blur-glass backdrop-saturate-glass hover:bg-glass-hover active:bg-glass-active sm:inline-flex",
|
|
10894
10969
|
onClick: () => scrollTableHorizontally("right"),
|
|
10895
|
-
children: /* @__PURE__ */ (0,
|
|
10970
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(ChevronRight, { className: "h-5 w-5" })
|
|
10896
10971
|
}
|
|
10897
10972
|
) }),
|
|
10898
|
-
/* @__PURE__ */ (0,
|
|
10973
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: "More columns to the right" })
|
|
10899
10974
|
] }) : null
|
|
10900
10975
|
] }),
|
|
10901
|
-
appendQuery ? /* @__PURE__ */ (0,
|
|
10976
|
+
appendQuery ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10902
10977
|
"div",
|
|
10903
10978
|
{
|
|
10904
10979
|
"data-matrx-table-footer": true,
|
|
10905
10980
|
className: "flex min-h-11 shrink-0 flex-wrap items-center gap-0 border-t border-border",
|
|
10906
10981
|
"aria-busy": isLoading || isFetching,
|
|
10907
10982
|
children: [
|
|
10908
|
-
/* @__PURE__ */ (0,
|
|
10983
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10909
10984
|
"div",
|
|
10910
10985
|
{
|
|
10911
10986
|
...isFetching && !isLoading ? {} : { role: "status", "aria-live": "polite" },
|
|
10912
10987
|
className: "flex w-full min-w-0 items-center gap-2 text-xs text-muted-foreground sm:w-auto sm:flex-1 sm:text-sm",
|
|
10913
10988
|
children: [
|
|
10914
|
-
isLoading ? /* @__PURE__ */ (0,
|
|
10989
|
+
isLoading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10915
10990
|
Loader2,
|
|
10916
10991
|
{
|
|
10917
10992
|
"data-matrx-table-append-loader": true,
|
|
@@ -10919,17 +10994,17 @@ function MatrxDataTableCore({
|
|
|
10919
10994
|
className: "h-5 w-5 shrink-0 animate-spin text-primary motion-reduce:animate-none"
|
|
10920
10995
|
}
|
|
10921
10996
|
) : null,
|
|
10922
|
-
/* @__PURE__ */ (0,
|
|
10923
|
-
/* @__PURE__ */ (0,
|
|
10924
|
-
appendQuery.pagination.sourceUntil ? /* @__PURE__ */ (0,
|
|
10997
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "min-w-0 flex-1", children: [
|
|
10998
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { className: "font-medium text-foreground", children: isLoading ? "Loading rows\u2026" : `${(0, import_format3.formatCount)(data.length)} loaded${appendQuery.pagination.totalItems === void 0 ? "" : ` of ${(0, import_format3.formatCount)(appendQuery.pagination.totalItems)}`}` }),
|
|
10999
|
+
appendQuery.pagination.sourceUntil ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("p", { children: [
|
|
10925
11000
|
"Source fixed through",
|
|
10926
11001
|
" ",
|
|
10927
11002
|
new Date(appendQuery.pagination.sourceUntil).toLocaleString(),
|
|
10928
11003
|
"."
|
|
10929
11004
|
] }) : null,
|
|
10930
|
-
!isLoading && !isFetching && !appendQuery.pagination.loadAll?.isLoading && !scrollPagination.error && !appendQuery.pagination.hasNextPage && appendQuery.pagination.totalItems !== void 0 && data.length === appendQuery.pagination.totalItems ? /* @__PURE__ */ (0,
|
|
10931
|
-
scrollPagination.error ? /* @__PURE__ */ (0,
|
|
10932
|
-
appendScrollPolicy?.mode === "suspended" ? /* @__PURE__ */ (0,
|
|
11005
|
+
!isLoading && !isFetching && !appendQuery.pagination.loadAll?.isLoading && !scrollPagination.error && !appendQuery.pagination.hasNextPage && appendQuery.pagination.totalItems !== void 0 && data.length === appendQuery.pagination.totalItems ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { children: "All source rows are loaded." }) : appendUsesLocalProcessing ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { children: "Local search and filters cover loaded rows." }) : null,
|
|
11006
|
+
scrollPagination.error ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("p", { role: "alert", className: "text-destructive", children: scrollPagination.error.message }) : null,
|
|
11007
|
+
appendScrollPolicy?.mode === "suspended" ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("p", { role: "status", children: [
|
|
10933
11008
|
appendScrollPolicy.reason,
|
|
10934
11009
|
" Load more remains available."
|
|
10935
11010
|
] }) : null
|
|
@@ -10937,26 +11012,26 @@ function MatrxDataTableCore({
|
|
|
10937
11012
|
]
|
|
10938
11013
|
}
|
|
10939
11014
|
),
|
|
10940
|
-
appendQuery.pagination.sourcePageSize ? /* @__PURE__ */ (0,
|
|
11015
|
+
appendQuery.pagination.sourcePageSize ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
10941
11016
|
Select,
|
|
10942
11017
|
{
|
|
10943
11018
|
value: String(appendQuery.pagination.sourcePageSize.value),
|
|
10944
11019
|
onValueChange: (value) => appendQuery.pagination.sourcePageSize?.onChange(Number(value)),
|
|
10945
11020
|
children: [
|
|
10946
|
-
/* @__PURE__ */ (0,
|
|
11021
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10947
11022
|
SelectTrigger,
|
|
10948
11023
|
{
|
|
10949
11024
|
"aria-label": "Rows per load",
|
|
10950
11025
|
className: "h-11 min-w-20 shrink-0 rounded-md border border-border bg-card px-3 text-sm [&_svg]:size-5",
|
|
10951
11026
|
disabled: isLoading || isFetching || appendQuery.pagination.loadAll?.isLoading,
|
|
10952
|
-
children: /* @__PURE__ */ (0,
|
|
11027
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SelectValue, {})
|
|
10953
11028
|
}
|
|
10954
11029
|
),
|
|
10955
|
-
/* @__PURE__ */ (0,
|
|
11030
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SelectContent, { children: appendQuery.pagination.sourcePageSize.options.map((size) => /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(SelectItem, { value: String(size), children: size }, size)) })
|
|
10956
11031
|
]
|
|
10957
11032
|
}
|
|
10958
11033
|
) : null,
|
|
10959
|
-
appendQuery.pagination.loadAll?.isLoading ? /* @__PURE__ */ (0,
|
|
11034
|
+
appendQuery.pagination.loadAll?.isLoading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10960
11035
|
Button,
|
|
10961
11036
|
{
|
|
10962
11037
|
type: "button",
|
|
@@ -10965,7 +11040,7 @@ function MatrxDataTableCore({
|
|
|
10965
11040
|
onClick: appendQuery.pagination.loadAll.stop,
|
|
10966
11041
|
children: "Stop loading"
|
|
10967
11042
|
}
|
|
10968
|
-
) : scrollPagination.error ? /* @__PURE__ */ (0,
|
|
11043
|
+
) : scrollPagination.error ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10969
11044
|
Button,
|
|
10970
11045
|
{
|
|
10971
11046
|
type: "button",
|
|
@@ -10974,8 +11049,8 @@ function MatrxDataTableCore({
|
|
|
10974
11049
|
onClick: appendQuery.pagination.retrySource ?? (appendQuery.pagination.hasNextPage ? appendQuery.pagination.loadNextPage : appendQuery.pagination.refresh),
|
|
10975
11050
|
children: appendQuery.pagination.retrySource ? "Retry source" : appendQuery.pagination.hasNextPage ? "Retry" : "Reload rows"
|
|
10976
11051
|
}
|
|
10977
|
-
) : appendQuery.pagination.hasNextPage || scrollPagination.error ? /* @__PURE__ */ (0,
|
|
10978
|
-
/* @__PURE__ */ (0,
|
|
11052
|
+
) : appendQuery.pagination.hasNextPage || scrollPagination.error ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex min-w-0 max-w-full flex-wrap gap-0", children: [
|
|
11053
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10979
11054
|
Button,
|
|
10980
11055
|
{
|
|
10981
11056
|
type: "button",
|
|
@@ -10986,7 +11061,7 @@ function MatrxDataTableCore({
|
|
|
10986
11061
|
children: "Load more"
|
|
10987
11062
|
}
|
|
10988
11063
|
),
|
|
10989
|
-
appendQuery.pagination.loadAll ? /* @__PURE__ */ (0,
|
|
11064
|
+
appendQuery.pagination.loadAll ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
10990
11065
|
Button,
|
|
10991
11066
|
{
|
|
10992
11067
|
type: "button",
|
|
@@ -10997,10 +11072,10 @@ function MatrxDataTableCore({
|
|
|
10997
11072
|
children: "Load all"
|
|
10998
11073
|
}
|
|
10999
11074
|
) : null
|
|
11000
|
-
] }) : !isLoading && appendQuery.pagination.totalItems !== void 0 && data.length === appendQuery.pagination.totalItems ? /* @__PURE__ */ (0,
|
|
11075
|
+
] }) : !isLoading && appendQuery.pagination.totalItems !== void 0 && data.length === appendQuery.pagination.totalItems ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "min-w-0 max-w-full break-words whitespace-normal px-3 text-xs text-muted-foreground sm:text-sm", children: "All rows loaded" }) : null
|
|
11001
11076
|
]
|
|
11002
11077
|
}
|
|
11003
|
-
) : !hidePagination && totalItems > 0 ? /* @__PURE__ */ (0,
|
|
11078
|
+
) : !hidePagination && totalItems > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "shrink-0", children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11004
11079
|
GenericTablePagination,
|
|
11005
11080
|
{
|
|
11006
11081
|
totalItems,
|
|
@@ -11026,7 +11101,7 @@ function MatrxDataTableCore({
|
|
|
11026
11101
|
}
|
|
11027
11102
|
) }) : null
|
|
11028
11103
|
] }),
|
|
11029
|
-
/* @__PURE__ */ (0,
|
|
11104
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11030
11105
|
ColumnManager,
|
|
11031
11106
|
{
|
|
11032
11107
|
open: columnManagerOpen,
|
|
@@ -11037,7 +11112,7 @@ function MatrxDataTableCore({
|
|
|
11037
11112
|
onApply: commitColumnState
|
|
11038
11113
|
}
|
|
11039
11114
|
),
|
|
11040
|
-
detailEnabled && selectedRow ? /* @__PURE__ */ (0,
|
|
11115
|
+
detailEnabled && selectedRow ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11041
11116
|
SidePanelSurface,
|
|
11042
11117
|
{
|
|
11043
11118
|
title: resolveStringTitle(
|
|
@@ -11048,8 +11123,8 @@ function MatrxDataTableCore({
|
|
|
11048
11123
|
description: detail?.description?.(selectedRow),
|
|
11049
11124
|
onClose: () => setSelectedId(null),
|
|
11050
11125
|
defaultWidth: detail?.defaultWidth ?? 480,
|
|
11051
|
-
headerActions: /* @__PURE__ */ (0,
|
|
11052
|
-
effectiveCopy && showRowCopy ? /* @__PURE__ */ (0,
|
|
11126
|
+
headerActions: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
11127
|
+
effectiveCopy && showRowCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11053
11128
|
TableRowCopyControl,
|
|
11054
11129
|
{
|
|
11055
11130
|
size: "icon",
|
|
@@ -11061,8 +11136,8 @@ function MatrxDataTableCore({
|
|
|
11061
11136
|
}
|
|
11062
11137
|
) : null,
|
|
11063
11138
|
detail?.headerActions?.(selectedRow),
|
|
11064
|
-
windowEnabled ? /* @__PURE__ */ (0,
|
|
11065
|
-
/* @__PURE__ */ (0,
|
|
11139
|
+
windowEnabled ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
11140
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11066
11141
|
Button,
|
|
11067
11142
|
{
|
|
11068
11143
|
type: "button",
|
|
@@ -11072,10 +11147,10 @@ function MatrxDataTableCore({
|
|
|
11072
11147
|
className: "h-7 w-7",
|
|
11073
11148
|
"aria-label": "Open in window",
|
|
11074
11149
|
onClick: () => openWindow(selectedRow),
|
|
11075
|
-
children: /* @__PURE__ */ (0,
|
|
11150
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(PanelRight, { className: "h-5 w-5" })
|
|
11076
11151
|
}
|
|
11077
11152
|
) }),
|
|
11078
|
-
/* @__PURE__ */ (0,
|
|
11153
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: "Open in window" })
|
|
11079
11154
|
] }) : null
|
|
11080
11155
|
] }),
|
|
11081
11156
|
children: detail?.render ? (
|
|
@@ -11086,7 +11161,7 @@ function MatrxDataTableCore({
|
|
|
11086
11161
|
// fixes the whole class at once — a custom body that already
|
|
11087
11162
|
// scrolls (`h-full` + `overflow-y-auto` root) still resolves to
|
|
11088
11163
|
// this container's height, so no second scrollbar appears.
|
|
11089
|
-
/* @__PURE__ */ (0,
|
|
11164
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "h-full min-h-0 overflow-y-auto", children: detail.render(selectedRow, {
|
|
11090
11165
|
closeDetail: () => setSelectedId(null),
|
|
11091
11166
|
openDetail: () => openDetail(selectedRow),
|
|
11092
11167
|
openWindow: () => openWindow(selectedRow),
|
|
@@ -11094,7 +11169,7 @@ function MatrxDataTableCore({
|
|
|
11094
11169
|
hasPendingEdits: Boolean(edits[getRowId(selectedRow)]),
|
|
11095
11170
|
discardPendingEdits: () => discardRowEdits(getRowId(selectedRow))
|
|
11096
11171
|
}) })
|
|
11097
|
-
) : /* @__PURE__ */ (0,
|
|
11172
|
+
) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11098
11173
|
DataRowInspector,
|
|
11099
11174
|
{
|
|
11100
11175
|
row: selectedRow,
|
|
@@ -11106,7 +11181,7 @@ function MatrxDataTableCore({
|
|
|
11106
11181
|
)
|
|
11107
11182
|
}
|
|
11108
11183
|
) : null,
|
|
11109
|
-
windowRow ? /* @__PURE__ */ (0,
|
|
11184
|
+
windowRow ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11110
11185
|
DataRowWindow,
|
|
11111
11186
|
{
|
|
11112
11187
|
isOpen: true,
|
|
@@ -11117,9 +11192,9 @@ function MatrxDataTableCore({
|
|
|
11117
11192
|
height: windowConfig?.height,
|
|
11118
11193
|
windowId: `matrx-data-row-${urlState?.id ?? "local"}-${getRowId(windowRow)}`,
|
|
11119
11194
|
defaultTab: windowConfig?.defaultTab,
|
|
11120
|
-
headerActions: /* @__PURE__ */ (0,
|
|
11121
|
-
windowConfig?.openOnRowClick === true && detail?.enabled === true ? /* @__PURE__ */ (0,
|
|
11122
|
-
/* @__PURE__ */ (0,
|
|
11195
|
+
headerActions: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "flex items-center gap-1", children: [
|
|
11196
|
+
windowConfig?.openOnRowClick === true && detail?.enabled === true ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
11197
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11123
11198
|
Button,
|
|
11124
11199
|
{
|
|
11125
11200
|
type: "button",
|
|
@@ -11132,12 +11207,12 @@ function MatrxDataTableCore({
|
|
|
11132
11207
|
closeWindow();
|
|
11133
11208
|
openDetail(windowRow);
|
|
11134
11209
|
},
|
|
11135
|
-
children: /* @__PURE__ */ (0,
|
|
11210
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(PanelRightOpen, { className: "h-5 w-5" })
|
|
11136
11211
|
}
|
|
11137
11212
|
) }),
|
|
11138
|
-
/* @__PURE__ */ (0,
|
|
11213
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { children: "Open in side panel" })
|
|
11139
11214
|
] }) : null,
|
|
11140
|
-
effectiveCopy && showRowCopy ? /* @__PURE__ */ (0,
|
|
11215
|
+
effectiveCopy && showRowCopy ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11141
11216
|
TableRowCopyControl,
|
|
11142
11217
|
{
|
|
11143
11218
|
size: "icon",
|
|
@@ -11156,7 +11231,7 @@ function MatrxDataTableCore({
|
|
|
11156
11231
|
closeWindow,
|
|
11157
11232
|
hasPendingEdits: Boolean(edits[getRowId(windowRow)]),
|
|
11158
11233
|
discardPendingEdits: () => discardRowEdits(getRowId(windowRow))
|
|
11159
|
-
}) ?? /* @__PURE__ */ (0,
|
|
11234
|
+
}) ?? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11160
11235
|
DataRowInspector,
|
|
11161
11236
|
{
|
|
11162
11237
|
row: windowRow,
|
|
@@ -11192,15 +11267,15 @@ function MatrxDataTableCore({
|
|
|
11192
11267
|
})
|
|
11193
11268
|
}
|
|
11194
11269
|
) : null,
|
|
11195
|
-
editEnabled ? /* @__PURE__ */ (0,
|
|
11196
|
-
foreignDrafts.length > 0 ? /* @__PURE__ */ (0,
|
|
11270
|
+
editEnabled ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
|
|
11271
|
+
foreignDrafts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
11197
11272
|
"div",
|
|
11198
11273
|
{
|
|
11199
11274
|
"data-matrx-foreign-drafts": true,
|
|
11200
11275
|
className: "fixed inset-x-3 bottom-20 z-50 flex flex-wrap items-center justify-center gap-2 rounded-lg border border-amber-500/40 bg-card px-3 py-2 text-xs shadow-lg sm:inset-x-auto sm:left-1/2 sm:-translate-x-1/2 sm:flex-nowrap",
|
|
11201
11276
|
children: [
|
|
11202
|
-
/* @__PURE__ */ (0,
|
|
11203
|
-
/* @__PURE__ */ (0,
|
|
11277
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: "Unsaved edits from previous results" }),
|
|
11278
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11204
11279
|
CopyButtons,
|
|
11205
11280
|
{
|
|
11206
11281
|
size: "xs",
|
|
@@ -11209,11 +11284,11 @@ function MatrxDataTableCore({
|
|
|
11209
11284
|
json: () => foreignDraftPayload
|
|
11210
11285
|
}
|
|
11211
11286
|
),
|
|
11212
|
-
/* @__PURE__ */ (0,
|
|
11287
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { type: "button", size: "sm", variant: "ghost", className: "h-7 text-xs text-destructive", onClick: () => setConfirmForeignDraftDiscard(true), children: "Discard drafts" })
|
|
11213
11288
|
]
|
|
11214
11289
|
}
|
|
11215
11290
|
) : null,
|
|
11216
|
-
/* @__PURE__ */ (0,
|
|
11291
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11217
11292
|
ConfirmDialog,
|
|
11218
11293
|
{
|
|
11219
11294
|
open: confirmForeignDraftDiscard,
|
|
@@ -11233,7 +11308,7 @@ function MatrxDataTableCore({
|
|
|
11233
11308
|
}
|
|
11234
11309
|
}
|
|
11235
11310
|
),
|
|
11236
|
-
/* @__PURE__ */ (0,
|
|
11311
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11237
11312
|
DirtySavePill,
|
|
11238
11313
|
{
|
|
11239
11314
|
changeCount,
|
|
@@ -11246,11 +11321,11 @@ function MatrxDataTableCore({
|
|
|
11246
11321
|
]
|
|
11247
11322
|
}
|
|
11248
11323
|
),
|
|
11249
|
-
/* @__PURE__ */ (0,
|
|
11324
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_core3.DragOverlay, { children: draggedRow ? (
|
|
11250
11325
|
// w-max: the overlay inherits the ACTIVE node's size, and the active
|
|
11251
11326
|
// node is the 16px grip handle — without it the label wraps to one
|
|
11252
11327
|
// character per line.
|
|
11253
|
-
/* @__PURE__ */ (0,
|
|
11328
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "w-max max-w-xs truncate rounded border border-border bg-card px-2.5 py-1.5 text-sm font-medium text-foreground shadow-md", children: hierarchy?.itemLabel?.(draggedRow) ?? "Moving row" })
|
|
11254
11329
|
) : null })
|
|
11255
11330
|
]
|
|
11256
11331
|
}
|
|
@@ -11265,7 +11340,7 @@ function HierarchyDragHandle({
|
|
|
11265
11340
|
id,
|
|
11266
11341
|
disabled
|
|
11267
11342
|
});
|
|
11268
|
-
return /* @__PURE__ */ (0,
|
|
11343
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11269
11344
|
"button",
|
|
11270
11345
|
{
|
|
11271
11346
|
ref: setNodeRef,
|
|
@@ -11277,7 +11352,7 @@ function HierarchyDragHandle({
|
|
|
11277
11352
|
onClick: (event) => event.stopPropagation(),
|
|
11278
11353
|
...attributes,
|
|
11279
11354
|
...listeners,
|
|
11280
|
-
children: /* @__PURE__ */ (0,
|
|
11355
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(GripVertical, { className: "h-3.5 w-3.5" })
|
|
11281
11356
|
}
|
|
11282
11357
|
);
|
|
11283
11358
|
}
|
|
@@ -11286,7 +11361,7 @@ function HierarchyRootDropTarget({
|
|
|
11286
11361
|
draggedLabel
|
|
11287
11362
|
}) {
|
|
11288
11363
|
const { isOver, setNodeRef } = (0, import_core3.useDroppable)({ id: "__root__" });
|
|
11289
|
-
return /* @__PURE__ */ (0,
|
|
11364
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
11290
11365
|
"div",
|
|
11291
11366
|
{
|
|
11292
11367
|
ref: setNodeRef,
|
|
@@ -11296,8 +11371,8 @@ function HierarchyRootDropTarget({
|
|
|
11296
11371
|
isOver && "border-solid bg-primary/20 shadow-md shadow-primary/25"
|
|
11297
11372
|
),
|
|
11298
11373
|
children: [
|
|
11299
|
-
/* @__PURE__ */ (0,
|
|
11300
|
-
/* @__PURE__ */ (0,
|
|
11374
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "truncate", children: draggedLabel }),
|
|
11375
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-primary/75", children: label })
|
|
11301
11376
|
]
|
|
11302
11377
|
}
|
|
11303
11378
|
);
|
|
@@ -11306,7 +11381,7 @@ function HierarchyDragIndicatorLayer({
|
|
|
11306
11381
|
scrollRef,
|
|
11307
11382
|
resolve: resolve2
|
|
11308
11383
|
}) {
|
|
11309
|
-
const [indicator, setIndicator] = (0,
|
|
11384
|
+
const [indicator, setIndicator] = (0, import_react20.useState)(
|
|
11310
11385
|
null
|
|
11311
11386
|
);
|
|
11312
11387
|
(0, import_core3.useDndMonitor)({
|
|
@@ -11346,7 +11421,7 @@ function HierarchyDragIndicatorLayer({
|
|
|
11346
11421
|
const { preview: preview2 } = indicator;
|
|
11347
11422
|
const indent = indicator.left + 10 + preview2.depth * 12;
|
|
11348
11423
|
if (preview2.position === "inside") {
|
|
11349
|
-
return /* @__PURE__ */ (0,
|
|
11424
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11350
11425
|
"div",
|
|
11351
11426
|
{
|
|
11352
11427
|
"aria-hidden": "true",
|
|
@@ -11358,7 +11433,7 @@ function HierarchyDragIndicatorLayer({
|
|
|
11358
11433
|
width: Math.max(0, indicator.width - 4),
|
|
11359
11434
|
height: indicator.height
|
|
11360
11435
|
},
|
|
11361
|
-
children: /* @__PURE__ */ (0,
|
|
11436
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
11362
11437
|
"span",
|
|
11363
11438
|
{
|
|
11364
11439
|
className: "absolute top-1/2 -translate-y-1/2 whitespace-nowrap rounded bg-card/95 px-1.5 py-0.5 text-[10px] font-medium text-primary",
|
|
@@ -11373,7 +11448,7 @@ function HierarchyDragIndicatorLayer({
|
|
|
11373
11448
|
);
|
|
11374
11449
|
}
|
|
11375
11450
|
const lineTop = preview2.position === "before" ? indicator.top - 1 : indicator.top + indicator.height - 1;
|
|
11376
|
-
return /* @__PURE__ */ (0,
|
|
11451
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11377
11452
|
"div",
|
|
11378
11453
|
{
|
|
11379
11454
|
"aria-hidden": "true",
|
|
@@ -11384,9 +11459,9 @@ function HierarchyDragIndicatorLayer({
|
|
|
11384
11459
|
left: indent,
|
|
11385
11460
|
width: Math.max(0, indicator.left + indicator.width - indent - 8)
|
|
11386
11461
|
},
|
|
11387
|
-
children: /* @__PURE__ */ (0,
|
|
11388
|
-
/* @__PURE__ */ (0,
|
|
11389
|
-
/* @__PURE__ */ (0,
|
|
11462
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: "relative h-0.5 rounded-full bg-primary", children: [
|
|
11463
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "absolute -left-1 top-1/2 h-2 w-2 -translate-y-1/2 rounded-full border-2 border-primary bg-card" }),
|
|
11464
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
|
|
11390
11465
|
"span",
|
|
11391
11466
|
{
|
|
11392
11467
|
className: cn(
|
|
@@ -11410,9 +11485,9 @@ function HierarchyDroppableRow({
|
|
|
11410
11485
|
children
|
|
11411
11486
|
}) {
|
|
11412
11487
|
const { setNodeRef } = (0, import_core3.useDroppable)({ id, disabled });
|
|
11413
|
-
if (!(0,
|
|
11488
|
+
if (!(0, import_react20.isValidElement)(children) || children.type !== "tr") return children;
|
|
11414
11489
|
const row = children;
|
|
11415
|
-
return (0,
|
|
11490
|
+
return (0, import_react20.cloneElement)(row, {
|
|
11416
11491
|
ref: setNodeRef,
|
|
11417
11492
|
className: row.props.className
|
|
11418
11493
|
});
|
|
@@ -11427,7 +11502,7 @@ function ColumnHeaderDropZone({
|
|
|
11427
11502
|
disabled: !enabled,
|
|
11428
11503
|
data: { matrxDragKind: "column-header", columnId: id }
|
|
11429
11504
|
});
|
|
11430
|
-
return /* @__PURE__ */ (0,
|
|
11505
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { ref: setNodeRef, className: "flex min-w-0 items-center", children });
|
|
11431
11506
|
}
|
|
11432
11507
|
function fixedUtilityWidth(width) {
|
|
11433
11508
|
return width === void 0 ? void 0 : { width: `${width}px`, minWidth: `${width}px`, maxWidth: `${width}px` };
|
|
@@ -11452,14 +11527,14 @@ function columnWidthVar(width, resizedWidth, id, resizable) {
|
|
|
11452
11527
|
};
|
|
11453
11528
|
}
|
|
11454
11529
|
function DefaultJsonCell({ value }) {
|
|
11455
|
-
const [open, setOpen] = (0,
|
|
11530
|
+
const [open, setOpen] = (0, import_react20.useState)(false);
|
|
11456
11531
|
const host = useMatrxDataTableHost();
|
|
11457
11532
|
const Viewer = host.JsonViewer;
|
|
11458
11533
|
const text = JSON.stringify(value, null, 2);
|
|
11459
11534
|
const summary = Array.isArray(value) ? `${value.length} items` : Object.keys(value).slice(0, 3).join(", ") || "Empty object";
|
|
11460
|
-
return /* @__PURE__ */ (0,
|
|
11461
|
-
/* @__PURE__ */ (0,
|
|
11462
|
-
/* @__PURE__ */ (0,
|
|
11535
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
|
|
11536
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
11537
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("button", { type: "button", className: "block max-w-full truncate text-left text-sm text-foreground", onClick: (event) => {
|
|
11463
11538
|
event.stopPropagation();
|
|
11464
11539
|
setOpen(true);
|
|
11465
11540
|
}, style: { display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical", overflow: "hidden", whiteSpace: "normal", overflowWrap: "anywhere" }, "aria-label": "Open JSON value", children: [
|
|
@@ -11467,9 +11542,9 @@ function DefaultJsonCell({ value }) {
|
|
|
11467
11542
|
" ",
|
|
11468
11543
|
summary
|
|
11469
11544
|
] }) }),
|
|
11470
|
-
/* @__PURE__ */ (0,
|
|
11545
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { className: "max-w-md max-h-80 overflow-auto whitespace-pre-wrap break-words", children: text })
|
|
11471
11546
|
] }),
|
|
11472
|
-
/* @__PURE__ */ (0,
|
|
11547
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DataRowWindow, { isOpen: open, onClose: () => setOpen(false), title: "JSON value", row: value, viewContent: Viewer ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Viewer, { data: value }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("pre", { className: "overflow-auto whitespace-pre-wrap p-3 text-xs", children: text }) })
|
|
11473
11548
|
] });
|
|
11474
11549
|
}
|
|
11475
11550
|
function renderCell(row, col, index) {
|
|
@@ -11480,7 +11555,7 @@ function renderCell(row, col, index) {
|
|
|
11480
11555
|
if (asUuid && typeof raw === "string") {
|
|
11481
11556
|
const forbidden = typeof col.fk?.forbidden === "function" ? col.fk.forbidden(raw, row) : Boolean(col.fk?.forbidden);
|
|
11482
11557
|
const declaredToken = typeof col.fk?.token === "function" ? col.fk.token(row) : col.fk?.token;
|
|
11483
|
-
return /* @__PURE__ */ (0,
|
|
11558
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
|
|
11484
11559
|
MatrxUuidCell,
|
|
11485
11560
|
{
|
|
11486
11561
|
value: raw,
|
|
@@ -11492,14 +11567,14 @@ function renderCell(row, col, index) {
|
|
|
11492
11567
|
}
|
|
11493
11568
|
);
|
|
11494
11569
|
}
|
|
11495
|
-
if (raw !== null && typeof raw === "object" && !(raw instanceof Date)) return /* @__PURE__ */ (0,
|
|
11570
|
+
if (raw !== null && typeof raw === "object" && !(raw instanceof Date)) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(DefaultJsonCell, { value: raw });
|
|
11496
11571
|
if (typeof raw === "boolean") {
|
|
11497
|
-
return /* @__PURE__ */ (0,
|
|
11572
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: raw ? "rounded bg-emerald-500/10 px-1.5 py-0.5 text-xs text-emerald-600" : "rounded bg-slate-500/10 px-1.5 py-0.5 text-xs text-muted-foreground", children: raw ? "Yes" : "No" });
|
|
11498
11573
|
}
|
|
11499
11574
|
const formatted = formatTableDisplayValue(raw);
|
|
11500
|
-
return /* @__PURE__ */ (0,
|
|
11501
|
-
/* @__PURE__ */ (0,
|
|
11502
|
-
/* @__PURE__ */ (0,
|
|
11575
|
+
return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(Tooltip, { children: [
|
|
11576
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "block text-sm text-foreground", style: { display: "-webkit-box", WebkitLineClamp: 2, WebkitBoxOrient: "vertical", overflow: "hidden", overflowWrap: "anywhere" }, children: formatted }) }),
|
|
11577
|
+
/* @__PURE__ */ (0, import_jsx_runtime41.jsx)(TooltipContent, { className: "max-w-md whitespace-pre-wrap break-words max-h-80 overflow-auto", children: typeof raw === "object" && raw !== null ? JSON.stringify(raw, null, 2) : formatted })
|
|
11503
11578
|
] });
|
|
11504
11579
|
}
|
|
11505
11580
|
function resolveStringTitle(title, fallback) {
|
|
@@ -11509,19 +11584,19 @@ function resolveStringTitle(title, fallback) {
|
|
|
11509
11584
|
}
|
|
11510
11585
|
|
|
11511
11586
|
// src/data-table/SavedViewsControl.tsx
|
|
11512
|
-
var
|
|
11587
|
+
var import_react21 = require("react");
|
|
11513
11588
|
|
|
11514
11589
|
// src/dropdown-menu.tsx
|
|
11515
11590
|
var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
11516
11591
|
var React17 = __toESM(require("react"), 1);
|
|
11517
|
-
var
|
|
11592
|
+
var import_jsx_runtime42 = require("react/jsx-runtime");
|
|
11518
11593
|
var DropdownMenu = DropdownMenuPrimitive.Root;
|
|
11519
11594
|
var DropdownMenuTrigger = DropdownMenuPrimitive.Trigger;
|
|
11520
11595
|
var DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup;
|
|
11521
11596
|
var MENU_SURFACE_CLASS = "z-[10001] min-w-[8rem] max-h-[var(--radix-dropdown-menu-content-available-height)] overflow-y-auto overflow-x-hidden overscroll-contain rounded-md border bg-popover p-1 text-popover-foreground";
|
|
11522
11597
|
var MENU_ITEM_CLASS = "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
|
|
11523
11598
|
var MENU_INDICATOR_ITEM_CLASS = "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50";
|
|
11524
|
-
var DropdownMenuSubTrigger = React17.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11599
|
+
var DropdownMenuSubTrigger = React17.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
11525
11600
|
DropdownMenuPrimitive.SubTrigger,
|
|
11526
11601
|
{
|
|
11527
11602
|
ref,
|
|
@@ -11534,12 +11609,12 @@ var DropdownMenuSubTrigger = React17.forwardRef(({ className, inset, children, .
|
|
|
11534
11609
|
...props,
|
|
11535
11610
|
children: [
|
|
11536
11611
|
children,
|
|
11537
|
-
/* @__PURE__ */ (0,
|
|
11612
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)(RadixChevronRightIcon, { className: "ml-auto h-4 w-4" })
|
|
11538
11613
|
]
|
|
11539
11614
|
}
|
|
11540
11615
|
));
|
|
11541
11616
|
DropdownMenuSubTrigger.displayName = DropdownMenuPrimitive.SubTrigger.displayName;
|
|
11542
|
-
var DropdownMenuSubContent = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11617
|
+
var DropdownMenuSubContent = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
11543
11618
|
DropdownMenuPrimitive.SubContent,
|
|
11544
11619
|
{
|
|
11545
11620
|
ref,
|
|
@@ -11551,7 +11626,7 @@ var DropdownMenuSubContent = React17.forwardRef(({ className, ...props }, ref) =
|
|
|
11551
11626
|
DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
|
|
11552
11627
|
var DropdownMenuContent = React17.forwardRef(({ className, sideOffset = 4, container, ...props }, ref) => {
|
|
11553
11628
|
const portalContainer = usePortalContainer(container);
|
|
11554
|
-
return /* @__PURE__ */ (0,
|
|
11629
|
+
return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DropdownMenuPrimitive.Portal, { container: portalContainer, children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
11555
11630
|
DropdownMenuPrimitive.Content,
|
|
11556
11631
|
{
|
|
11557
11632
|
ref,
|
|
@@ -11568,7 +11643,7 @@ var DropdownMenuContent = React17.forwardRef(({ className, sideOffset = 4, conta
|
|
|
11568
11643
|
) });
|
|
11569
11644
|
});
|
|
11570
11645
|
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
|
|
11571
|
-
var DropdownMenuItem = React17.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11646
|
+
var DropdownMenuItem = React17.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
11572
11647
|
DropdownMenuPrimitive.Item,
|
|
11573
11648
|
{
|
|
11574
11649
|
ref,
|
|
@@ -11578,7 +11653,7 @@ var DropdownMenuItem = React17.forwardRef(({ className, inset, ...props }, ref)
|
|
|
11578
11653
|
}
|
|
11579
11654
|
));
|
|
11580
11655
|
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
|
|
11581
|
-
var DropdownMenuCheckboxItem = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11656
|
+
var DropdownMenuCheckboxItem = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
11582
11657
|
DropdownMenuPrimitive.CheckboxItem,
|
|
11583
11658
|
{
|
|
11584
11659
|
ref,
|
|
@@ -11586,13 +11661,13 @@ var DropdownMenuCheckboxItem = React17.forwardRef(({ className, children, ...pro
|
|
|
11586
11661
|
className: cn(MENU_INDICATOR_ITEM_CLASS, className),
|
|
11587
11662
|
...props,
|
|
11588
11663
|
children: [
|
|
11589
|
-
/* @__PURE__ */ (0,
|
|
11664
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(CheckIcon, { className: "h-4 w-4" }) }) }),
|
|
11590
11665
|
children
|
|
11591
11666
|
]
|
|
11592
11667
|
}
|
|
11593
11668
|
));
|
|
11594
11669
|
DropdownMenuCheckboxItem.displayName = DropdownMenuPrimitive.CheckboxItem.displayName;
|
|
11595
|
-
var DropdownMenuRadioItem = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11670
|
+
var DropdownMenuRadioItem = React17.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
|
|
11596
11671
|
DropdownMenuPrimitive.RadioItem,
|
|
11597
11672
|
{
|
|
11598
11673
|
ref,
|
|
@@ -11600,13 +11675,13 @@ var DropdownMenuRadioItem = React17.forwardRef(({ className, children, ...props
|
|
|
11600
11675
|
className: cn(MENU_INDICATOR_ITEM_CLASS, className),
|
|
11601
11676
|
...props,
|
|
11602
11677
|
children: [
|
|
11603
|
-
/* @__PURE__ */ (0,
|
|
11678
|
+
/* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "absolute left-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DropdownMenuPrimitive.ItemIndicator, { children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(DotFilledIcon, { className: "h-4 w-4 fill-current" }) }) }),
|
|
11604
11679
|
children
|
|
11605
11680
|
]
|
|
11606
11681
|
}
|
|
11607
11682
|
));
|
|
11608
11683
|
DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName;
|
|
11609
|
-
var DropdownMenuLabel = React17.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11684
|
+
var DropdownMenuLabel = React17.forwardRef(({ className, inset, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
11610
11685
|
DropdownMenuPrimitive.Label,
|
|
11611
11686
|
{
|
|
11612
11687
|
ref,
|
|
@@ -11616,7 +11691,7 @@ var DropdownMenuLabel = React17.forwardRef(({ className, inset, ...props }, ref)
|
|
|
11616
11691
|
}
|
|
11617
11692
|
));
|
|
11618
11693
|
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
|
|
11619
|
-
var DropdownMenuSeparator = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0,
|
|
11694
|
+
var DropdownMenuSeparator = React17.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
11620
11695
|
DropdownMenuPrimitive.Separator,
|
|
11621
11696
|
{
|
|
11622
11697
|
ref,
|
|
@@ -11629,7 +11704,7 @@ DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName;
|
|
|
11629
11704
|
var DropdownMenuShortcut = ({
|
|
11630
11705
|
className,
|
|
11631
11706
|
...props
|
|
11632
|
-
}) => /* @__PURE__ */ (0,
|
|
11707
|
+
}) => /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
|
|
11633
11708
|
"span",
|
|
11634
11709
|
{
|
|
11635
11710
|
"data-slot": "dropdown-menu-shortcut",
|
|
@@ -11640,7 +11715,7 @@ var DropdownMenuShortcut = ({
|
|
|
11640
11715
|
DropdownMenuShortcut.displayName = "DropdownMenuShortcut";
|
|
11641
11716
|
|
|
11642
11717
|
// src/data-table/SavedViewsControl.tsx
|
|
11643
|
-
var
|
|
11718
|
+
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
11644
11719
|
function SavedViewsControl({
|
|
11645
11720
|
views,
|
|
11646
11721
|
activeId = null,
|
|
@@ -11652,11 +11727,11 @@ function SavedViewsControl({
|
|
|
11652
11727
|
onUpdate,
|
|
11653
11728
|
onReload
|
|
11654
11729
|
}) {
|
|
11655
|
-
const unsavedChangesId = (0,
|
|
11656
|
-
const [saveOpen, setSaveOpen] = (0,
|
|
11657
|
-
const [name, setName] = (0,
|
|
11658
|
-
const [saving, setSaving] = (0,
|
|
11659
|
-
const [actionError, setActionError] = (0,
|
|
11730
|
+
const unsavedChangesId = (0, import_react21.useId)();
|
|
11731
|
+
const [saveOpen, setSaveOpen] = (0, import_react21.useState)(false);
|
|
11732
|
+
const [name, setName] = (0, import_react21.useState)("");
|
|
11733
|
+
const [saving, setSaving] = (0, import_react21.useState)(false);
|
|
11734
|
+
const [actionError, setActionError] = (0, import_react21.useState)(null);
|
|
11660
11735
|
const visibleError = actionError ?? error;
|
|
11661
11736
|
const save = async () => {
|
|
11662
11737
|
const next = name.trim();
|
|
@@ -11698,10 +11773,10 @@ function SavedViewsControl({
|
|
|
11698
11773
|
}
|
|
11699
11774
|
};
|
|
11700
11775
|
const activeName = activeId ? views.find((view) => view.id === activeId)?.name : void 0;
|
|
11701
|
-
return /* @__PURE__ */ (0,
|
|
11702
|
-
/* @__PURE__ */ (0,
|
|
11703
|
-
/* @__PURE__ */ (0,
|
|
11704
|
-
/* @__PURE__ */ (0,
|
|
11776
|
+
return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-1", "data-matrx-table-saved-views": true, children: [
|
|
11777
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(DropdownMenu, { children: [
|
|
11778
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Tooltip, { children: [
|
|
11779
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(
|
|
11705
11780
|
Button,
|
|
11706
11781
|
{
|
|
11707
11782
|
type: "button",
|
|
@@ -11712,38 +11787,38 @@ function SavedViewsControl({
|
|
|
11712
11787
|
"aria-describedby": dirty ? unsavedChangesId : void 0,
|
|
11713
11788
|
disabled: saving,
|
|
11714
11789
|
children: [
|
|
11715
|
-
/* @__PURE__ */ (0,
|
|
11716
|
-
dirty ? /* @__PURE__ */ (0,
|
|
11717
|
-
/* @__PURE__ */ (0,
|
|
11790
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "min-w-0 flex-1 truncate", children: loading ? "Loading views\u2026" : activeName ?? "Default view" }),
|
|
11791
|
+
dirty ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { "aria-hidden": "true", className: "size-1.5 shrink-0 rounded-full bg-amber-500" }) : null,
|
|
11792
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(ChevronDown, { className: "size-3.5 shrink-0" })
|
|
11718
11793
|
]
|
|
11719
11794
|
}
|
|
11720
11795
|
) }) }),
|
|
11721
|
-
/* @__PURE__ */ (0,
|
|
11796
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(TooltipContent, { children: "Choose or save a table view" })
|
|
11722
11797
|
] }),
|
|
11723
|
-
/* @__PURE__ */ (0,
|
|
11724
|
-
/* @__PURE__ */ (0,
|
|
11725
|
-
/* @__PURE__ */ (0,
|
|
11726
|
-
/* @__PURE__ */ (0,
|
|
11727
|
-
views.map((view) => /* @__PURE__ */ (0,
|
|
11798
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(DropdownMenuContent, { align: "end", children: [
|
|
11799
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuLabel, { children: "Views" }),
|
|
11800
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) => onSelect(value === "__default__" ? null : value), children: [
|
|
11801
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuRadioItem, { value: "__default__", children: "Default view" }),
|
|
11802
|
+
views.map((view) => /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuRadioItem, { value: view.id, children: view.name }, view.id))
|
|
11728
11803
|
] }),
|
|
11729
|
-
/* @__PURE__ */ (0,
|
|
11730
|
-
/* @__PURE__ */ (0,
|
|
11804
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuSeparator, {}),
|
|
11805
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuItem, { disabled: saving, onSelect: () => {
|
|
11731
11806
|
setActionError(null);
|
|
11732
11807
|
setSaveOpen(true);
|
|
11733
11808
|
}, children: "Save current view\u2026" }),
|
|
11734
|
-
activeId && onUpdate ? /* @__PURE__ */ (0,
|
|
11735
|
-
onReload ? /* @__PURE__ */ (0,
|
|
11809
|
+
activeId && onUpdate ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuItem, { disabled: saving, onSelect: () => void update(), children: "Update current view" }) : null,
|
|
11810
|
+
onReload ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DropdownMenuItem, { disabled: saving || loading, onSelect: () => void reload(), children: "Reload views" }) : null
|
|
11736
11811
|
] })
|
|
11737
11812
|
] }),
|
|
11738
|
-
dirty ? /* @__PURE__ */ (0,
|
|
11739
|
-
visibleError ? /* @__PURE__ */ (0,
|
|
11740
|
-
/* @__PURE__ */ (0,
|
|
11741
|
-
/* @__PURE__ */ (0,
|
|
11742
|
-
visibleError ? /* @__PURE__ */ (0,
|
|
11743
|
-
/* @__PURE__ */ (0,
|
|
11744
|
-
/* @__PURE__ */ (0,
|
|
11745
|
-
/* @__PURE__ */ (0,
|
|
11746
|
-
/* @__PURE__ */ (0,
|
|
11813
|
+
dirty ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { id: unsavedChangesId, className: "sr-only", children: "This table view has unsaved changes. Open the view menu to save or update it." }) : null,
|
|
11814
|
+
visibleError ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { role: "alert", className: "basis-full break-words text-xs text-destructive", children: visibleError }) : null,
|
|
11815
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Dialog, { open: saveOpen, onOpenChange: setSaveOpen, children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(DialogContent, { children: [
|
|
11816
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(DialogTitle, { children: "Save current view" }) }),
|
|
11817
|
+
visibleError ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("p", { role: "alert", className: "text-sm text-destructive", children: visibleError }) : null,
|
|
11818
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Input, { "aria-label": "View name", value: name, onChange: (event) => setName(event.target.value), placeholder: "View name", autoFocus: true }),
|
|
11819
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(DialogFooter, { children: [
|
|
11820
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Button, { type: "button", variant: "outline", onClick: () => setSaveOpen(false), children: "Cancel" }),
|
|
11821
|
+
/* @__PURE__ */ (0, import_jsx_runtime43.jsx)(Button, { type: "button", disabled: !name.trim() || saving, onClick: () => void save(), children: saving ? "Saving\u2026" : "Save view" })
|
|
11747
11822
|
] })
|
|
11748
11823
|
] }) })
|
|
11749
11824
|
] });
|