@ai-matrx/design-system 0.49.11 → 0.49.18
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 +39 -0
- package/dist/data-table/copy-helpers.d.cts +1 -1
- package/dist/data-table/copy-helpers.d.ts +1 -1
- package/dist/data-table/facets.cjs +2 -0
- package/dist/data-table/facets.cjs.map +1 -1
- package/dist/data-table/facets.d.cts +3 -1
- package/dist/data-table/facets.d.ts +3 -1
- package/dist/data-table/facets.js +2 -0
- package/dist/data-table/facets.js.map +1 -1
- package/dist/data-table/filter-engine.d.cts +1 -1
- package/dist/data-table/filter-engine.d.ts +1 -1
- package/dist/data-table/host.d.cts +1 -1
- package/dist/data-table/host.d.ts +1 -1
- package/dist/data-table/index.cjs +505 -328
- package/dist/data-table/index.cjs.map +1 -1
- package/dist/data-table/index.d.cts +7 -3
- package/dist/data-table/index.d.ts +7 -3
- package/dist/data-table/index.js +436 -259
- package/dist/data-table/index.js.map +1 -1
- package/dist/data-table/infer-filter.d.cts +1 -1
- package/dist/data-table/infer-filter.d.ts +1 -1
- package/dist/data-table/layered-filters.d.cts +1 -1
- package/dist/data-table/layered-filters.d.ts +1 -1
- package/dist/data-table/menu-targets.cjs.map +1 -1
- package/dist/data-table/menu-targets.d.cts +5 -0
- package/dist/data-table/menu-targets.d.ts +5 -0
- package/dist/data-table/menu-targets.js.map +1 -1
- package/dist/data-table/query-control.d.cts +1 -1
- package/dist/data-table/query-control.d.ts +1 -1
- package/dist/data-table/types.cjs.map +1 -1
- package/dist/data-table/types.d.cts +1 -1
- package/dist/data-table/types.d.ts +1 -1
- package/dist/data-table/url-state.d.cts +1 -1
- package/dist/data-table/url-state.d.ts +1 -1
- package/dist/data-table/xlsx.d.cts +1 -1
- package/dist/data-table/xlsx.d.ts +1 -1
- package/dist/{layered-filters-B-znwvFV.d.cts → layered-filters-BltsILT3.d.cts} +7 -1
- package/dist/{layered-filters-Dhfam7uI.d.ts → layered-filters-DrGJ_nuG.d.ts} +7 -1
- package/package.json +1 -1
|
@@ -34157,7 +34157,7 @@ __export(data_table_exports, {
|
|
|
34157
34157
|
module.exports = __toCommonJS(data_table_exports);
|
|
34158
34158
|
|
|
34159
34159
|
// src/data-table/MatrxDataTable.tsx
|
|
34160
|
-
var
|
|
34160
|
+
var import_react22 = require("react");
|
|
34161
34161
|
var import_react_dom3 = require("react-dom");
|
|
34162
34162
|
var import_core3 = require("@dnd-kit/core");
|
|
34163
34163
|
|
|
@@ -35238,7 +35238,11 @@ function TableTitleRow({
|
|
|
35238
35238
|
"data-matrx-table-toolbar": true,
|
|
35239
35239
|
className: cn(
|
|
35240
35240
|
"relative flex min-w-0 shrink-0 items-center gap-2",
|
|
35241
|
-
|
|
35241
|
+
// `max-w-full`: drawn into a page's row slot (`portalInto`), the row is held to the slot's
|
|
35242
|
+
// width, so IT is the scroller its pinned controls stick to — never a row as wide as its
|
|
35243
|
+
// content inside a narrower slot, where "sticky" had nothing to stick to and "New record"
|
|
35244
|
+
// sat past the slot's edge, cut to "N" (merged-grid leftovers, 2026-09-28).
|
|
35245
|
+
singleRow ? "max-w-full flex-nowrap overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden" : "flex-wrap",
|
|
35242
35246
|
// ONE CONTROL HEIGHT ON A TOOLBAR ROW (lane C, review 2026-09-26: 28/32/44 mixed): a host's
|
|
35243
35247
|
// tap-target toolbar actions draw at 32px like every other control; a finger (coarse
|
|
35244
35248
|
// pointer) keeps the 44px floor.
|
|
@@ -36731,7 +36735,7 @@ function GenericTablePagination({
|
|
|
36731
36735
|
// src/data-table/TableViewTabs.tsx
|
|
36732
36736
|
var import_react7 = require("react");
|
|
36733
36737
|
var import_jsx_runtime24 = require("react/jsx-runtime");
|
|
36734
|
-
function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related, editingId, onEditCancel, onEditDone }) {
|
|
36738
|
+
function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, related, editingId, onEditCancel, onEditDone, closable = true, addHint = "New view from the current one \xB7 double-click a tab to rename", renameable = true }) {
|
|
36735
36739
|
const [renaming, setRenaming] = (0, import_react7.useState)(null);
|
|
36736
36740
|
const [draft, setDraft] = (0, import_react7.useState)("");
|
|
36737
36741
|
const opened = (0, import_react7.useRef)(null);
|
|
@@ -36782,8 +36786,10 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
|
|
|
36782
36786
|
tabIndex: tab.id === activeId ? 0 : -1,
|
|
36783
36787
|
onClick: () => onSelect(tab.id),
|
|
36784
36788
|
onDoubleClick: () => {
|
|
36785
|
-
|
|
36786
|
-
|
|
36789
|
+
if (renameable && tab.id !== "default") {
|
|
36790
|
+
setDraft(tab.label);
|
|
36791
|
+
setRenaming(tab.id);
|
|
36792
|
+
}
|
|
36787
36793
|
},
|
|
36788
36794
|
onKeyDown: (e) => {
|
|
36789
36795
|
const next = e.key === "ArrowRight" ? (index + 1) % tabs.length : e.key === "ArrowLeft" ? (index + tabs.length - 1) % tabs.length : e.key === "Home" ? 0 : e.key === "End" ? tabs.length - 1 : -1;
|
|
@@ -36801,7 +36807,7 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
|
|
|
36801
36807
|
]
|
|
36802
36808
|
}
|
|
36803
36809
|
),
|
|
36804
|
-
tabs.length > 1 && tab.id !== "default" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
|
|
36810
|
+
closable && tabs.length > 1 && tab.id !== "default" && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
|
|
36805
36811
|
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", "aria-label": `Close ${tab.label}`, onClick: () => onClose(tab.id), className: "flex size-7 items-center justify-center rounded hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(X, { className: "size-4" }) }) }),
|
|
36806
36812
|
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(TooltipContent, { children: [
|
|
36807
36813
|
"Close ",
|
|
@@ -36811,7 +36817,7 @@ function TableViewTabs({ tabs, activeId, onSelect, onAdd, onClose, onRename, rel
|
|
|
36811
36817
|
] }, tab.id)),
|
|
36812
36818
|
/* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(Tooltip, { children: [
|
|
36813
36819
|
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("button", { type: "button", "aria-label": "New table tab", onClick: onAdd, className: "flex size-8 shrink-0 items-center justify-center rounded hover:bg-muted focus-visible:ring-2 focus-visible:ring-ring", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Plus, { className: "size-4" }) }) }),
|
|
36814
|
-
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children:
|
|
36820
|
+
/* @__PURE__ */ (0, import_jsx_runtime24.jsx)(TooltipContent, { children: addHint })
|
|
36815
36821
|
] })
|
|
36816
36822
|
] }),
|
|
36817
36823
|
related && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("div", { className: "flex shrink-0 items-center gap-1 border-l px-2", children: related })
|
|
@@ -42172,6 +42178,7 @@ CommandShortcut.displayName = "CommandShortcut";
|
|
|
42172
42178
|
var MAX_LISTABLE_FACET_LENGTH = 300;
|
|
42173
42179
|
var DEFAULT_FACET_LIMIT = 200;
|
|
42174
42180
|
var MAX_FACET_LIMIT = 500;
|
|
42181
|
+
var CORE_SUGGESTION_DISTINCT_EXCLUSIVE_LIMIT = 15;
|
|
42175
42182
|
function facetText(raw) {
|
|
42176
42183
|
if (raw === null || raw === void 0) return "";
|
|
42177
42184
|
if (typeof raw === "object") {
|
|
@@ -42298,6 +42305,7 @@ function HeaderMenuItems({
|
|
|
42298
42305
|
const disabled = Boolean(item.disabledReason);
|
|
42299
42306
|
const hasSubmenu = Boolean(item.submenu && item.submenu.length > 0);
|
|
42300
42307
|
return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex flex-col", children: [
|
|
42308
|
+
item.separatorBefore ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { role: "separator", className: "-mx-1 my-1 h-px bg-border" }) : null,
|
|
42301
42309
|
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(
|
|
42302
42310
|
Button,
|
|
42303
42311
|
{
|
|
@@ -42367,7 +42375,7 @@ function ColumnHeaderCell({
|
|
|
42367
42375
|
compact = false,
|
|
42368
42376
|
marker,
|
|
42369
42377
|
filterApplyLabel,
|
|
42370
|
-
filterShowCancel
|
|
42378
|
+
filterShowCancel,
|
|
42371
42379
|
filterFooterHint,
|
|
42372
42380
|
allowNegation = false,
|
|
42373
42381
|
allowNullModes = false,
|
|
@@ -42405,7 +42413,8 @@ function ColumnHeaderCell({
|
|
|
42405
42413
|
} : void 0;
|
|
42406
42414
|
const reorderClass = reorderEnabled ? "touch-none cursor-grab active:cursor-grabbing" : void 0;
|
|
42407
42415
|
const filterActive = isColumnFilterActive(filterValue);
|
|
42408
|
-
const deferredFilter = filterApplyLabel !== void 0 || filterShowCancel || filterFooterHint !== void 0;
|
|
42416
|
+
const deferredFilter = filterKind === "text" || filterApplyLabel !== void 0 || Boolean(filterShowCancel) || filterFooterHint !== void 0;
|
|
42417
|
+
const showFilterCancel = filterShowCancel ?? filterKind === "text";
|
|
42409
42418
|
const [filterOpen, setFilterOpen] = (0, import_react13.useState)(false);
|
|
42410
42419
|
const [pendingNegation, setPendingNegation] = (0, import_react13.useState)(false);
|
|
42411
42420
|
const [draftFilter, setDraftFilter] = (0, import_react13.useState)(filterValue);
|
|
@@ -42566,7 +42575,7 @@ function ColumnHeaderCell({
|
|
|
42566
42575
|
filterKind && deferredFilter ? /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "mt-2 border-t border-border pt-2", children: [
|
|
42567
42576
|
filterFooterHint ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "mb-2 text-xs text-muted-foreground", children: filterFooterHint }) : null,
|
|
42568
42577
|
/* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "flex justify-end gap-2", children: [
|
|
42569
|
-
|
|
42578
|
+
showFilterCancel ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", variant: "ghost", size: "sm", onClick: cancelFilter, children: "Cancel" }) : null,
|
|
42570
42579
|
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(Button, { type: "button", size: "sm", onClick: applyFilter, children: filterApplyLabel ?? "Apply" })
|
|
42571
42580
|
] })
|
|
42572
42581
|
] }) : null,
|
|
@@ -42719,7 +42728,7 @@ function ColumnHeaderCell({
|
|
|
42719
42728
|
"rounded p-0.5 transition-colors",
|
|
42720
42729
|
filterActive ? "text-primary hover:text-primary/80" : "text-muted-foreground/40 hover:text-muted-foreground"
|
|
42721
42730
|
),
|
|
42722
|
-
children: filterKind ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ListFilter, { className: cn("h-3 w-3", filterActive && "fill-primary/20") }) :
|
|
42731
|
+
children: filterKind || sortable ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ListFilter, { className: cn("h-3 w-3", filterActive && "fill-primary/20") }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(ChevronDown, { className: "h-3 w-3" })
|
|
42723
42732
|
}
|
|
42724
42733
|
) }) }),
|
|
42725
42734
|
/* @__PURE__ */ (0, import_jsx_runtime38.jsx)(TooltipContent, { children: menuLabel })
|
|
@@ -42913,7 +42922,7 @@ function FacetChecklist({
|
|
|
42913
42922
|
onChange
|
|
42914
42923
|
}) {
|
|
42915
42924
|
const [query, setQuery] = (0, import_react13.useState)("");
|
|
42916
|
-
const selected = value?.kind === "select" ? value.values ?? (value.value && value.value !== "__all__" ? [value.value] : []) : [];
|
|
42925
|
+
const selected = value?.kind === "select" ? (value.values ?? (value.value && value.value !== "__all__" ? [value.value] : [])).map((candidate) => candidate === SELECT_EMPTY_VALUE ? "" : candidate) : [];
|
|
42917
42926
|
const selectedSet = new Set(selected);
|
|
42918
42927
|
const rows = (0, import_react13.useMemo)(() => {
|
|
42919
42928
|
if (!facets) return [];
|
|
@@ -42931,7 +42940,7 @@ function FacetChecklist({
|
|
|
42931
42940
|
const next = new Set(selectedSet);
|
|
42932
42941
|
if (next.has(candidate)) next.delete(candidate);
|
|
42933
42942
|
else next.add(candidate);
|
|
42934
|
-
const values = [...next];
|
|
42943
|
+
const values = [...next].map((value2) => value2 === "" ? SELECT_EMPTY_VALUE : value2);
|
|
42935
42944
|
onChange(
|
|
42936
42945
|
values.length === 0 ? void 0 : { kind: "select", value: values[0] ?? "", values }
|
|
42937
42946
|
);
|
|
@@ -45492,6 +45501,62 @@ function ToolbarListedLabel({ label, children }) {
|
|
|
45492
45501
|
] });
|
|
45493
45502
|
}
|
|
45494
45503
|
|
|
45504
|
+
// src/data-table/pinned-fold.ts
|
|
45505
|
+
var import_react17 = require("react");
|
|
45506
|
+
function pinnedMustFold(room, full) {
|
|
45507
|
+
if (room <= 0 || full === null) return false;
|
|
45508
|
+
return full > room + 0.5;
|
|
45509
|
+
}
|
|
45510
|
+
function usePinnedFold(el, active) {
|
|
45511
|
+
const [folded, setFolded] = (0, import_react17.useState)(false);
|
|
45512
|
+
const full = (0, import_react17.useRef)(null);
|
|
45513
|
+
const current = (0, import_react17.useRef)(false);
|
|
45514
|
+
(0, import_react17.useEffect)(() => {
|
|
45515
|
+
if (!active || !el) {
|
|
45516
|
+
if (current.current) {
|
|
45517
|
+
current.current = false;
|
|
45518
|
+
setFolded(false);
|
|
45519
|
+
}
|
|
45520
|
+
return;
|
|
45521
|
+
}
|
|
45522
|
+
const row = el.closest("[data-matrx-table-toolbar]") ?? el.parentElement;
|
|
45523
|
+
if (!row) return;
|
|
45524
|
+
let pending = 0;
|
|
45525
|
+
let stopped = false;
|
|
45526
|
+
const measure = () => {
|
|
45527
|
+
pending = 0;
|
|
45528
|
+
if (stopped) return;
|
|
45529
|
+
if (!current.current) {
|
|
45530
|
+
const width = Math.max(el.getBoundingClientRect().width || 0, el.scrollWidth || 0);
|
|
45531
|
+
if (width > 0) full.current = width;
|
|
45532
|
+
}
|
|
45533
|
+
const next = pinnedMustFold(row.clientWidth, full.current);
|
|
45534
|
+
if (next !== current.current) {
|
|
45535
|
+
current.current = next;
|
|
45536
|
+
setFolded(next);
|
|
45537
|
+
}
|
|
45538
|
+
};
|
|
45539
|
+
const schedule = () => {
|
|
45540
|
+
if (pending) return;
|
|
45541
|
+
pending = typeof requestAnimationFrame === "function" && typeof document !== "undefined" && document.visibilityState !== "hidden" ? requestAnimationFrame(measure) : setTimeout(measure, 0);
|
|
45542
|
+
};
|
|
45543
|
+
const sizes = typeof ResizeObserver === "function" ? new ResizeObserver(schedule) : null;
|
|
45544
|
+
sizes?.observe(row);
|
|
45545
|
+
sizes?.observe(el);
|
|
45546
|
+
const content = typeof MutationObserver === "function" ? new MutationObserver(schedule) : null;
|
|
45547
|
+
content?.observe(el, { childList: true, subtree: true, characterData: true });
|
|
45548
|
+
if (typeof window !== "undefined") window.addEventListener("resize", schedule);
|
|
45549
|
+
measure();
|
|
45550
|
+
return () => {
|
|
45551
|
+
stopped = true;
|
|
45552
|
+
sizes?.disconnect();
|
|
45553
|
+
content?.disconnect();
|
|
45554
|
+
if (typeof window !== "undefined") window.removeEventListener("resize", schedule);
|
|
45555
|
+
};
|
|
45556
|
+
}, [el, active]);
|
|
45557
|
+
return folded;
|
|
45558
|
+
}
|
|
45559
|
+
|
|
45495
45560
|
// src/data-table/coverage.ts
|
|
45496
45561
|
var PARTIAL_BADGE = "Partial";
|
|
45497
45562
|
var UNKNOWN_TOTAL_BADGE = "Unknown total";
|
|
@@ -45640,7 +45705,7 @@ function rankTableSearchRows(rows, columns, query, options = {}, extraText) {
|
|
|
45640
45705
|
}
|
|
45641
45706
|
|
|
45642
45707
|
// src/data-table/ColumnManager.tsx
|
|
45643
|
-
var
|
|
45708
|
+
var import_react18 = require("react");
|
|
45644
45709
|
var import_core2 = require("@dnd-kit/core");
|
|
45645
45710
|
var import_jsx_runtime43 = require("react/jsx-runtime");
|
|
45646
45711
|
function ColumnManager({
|
|
@@ -45651,15 +45716,15 @@ function ColumnManager({
|
|
|
45651
45716
|
hidden,
|
|
45652
45717
|
onApply
|
|
45653
45718
|
}) {
|
|
45654
|
-
const byId = (0,
|
|
45719
|
+
const byId = (0, import_react18.useMemo)(
|
|
45655
45720
|
() => new Map(columns.map((column) => [columnId(column), column])),
|
|
45656
45721
|
[columns]
|
|
45657
45722
|
);
|
|
45658
|
-
const [draftOrder, setDraftOrder] = (0,
|
|
45659
|
-
const [draftHidden, setDraftHidden] = (0,
|
|
45660
|
-
const [draggedColumnId, setDraggedColumnId] = (0,
|
|
45661
|
-
const [dropTarget, setDropTarget] = (0,
|
|
45662
|
-
(0,
|
|
45723
|
+
const [draftOrder, setDraftOrder] = (0, import_react18.useState)(order);
|
|
45724
|
+
const [draftHidden, setDraftHidden] = (0, import_react18.useState)(() => new Set(hidden));
|
|
45725
|
+
const [draggedColumnId, setDraggedColumnId] = (0, import_react18.useState)(null);
|
|
45726
|
+
const [dropTarget, setDropTarget] = (0, import_react18.useState)(null);
|
|
45727
|
+
(0, import_react18.useEffect)(() => {
|
|
45663
45728
|
if (!open) return;
|
|
45664
45729
|
setDraftOrder(order);
|
|
45665
45730
|
setDraftHidden(new Set(hidden));
|
|
@@ -46146,7 +46211,7 @@ var layeredRuleSchema = import_zod2.z.object({ id: import_zod2.z.string().min(1)
|
|
|
46146
46211
|
var snapshotSchema = import_zod2.z.object({
|
|
46147
46212
|
__kind: import_zod2.z.literal("matrx-table-view"),
|
|
46148
46213
|
version: import_zod2.z.literal(1),
|
|
46149
|
-
query: import_zod2.z.object({ pageSize: import_zod2.z.number().int().
|
|
46214
|
+
query: import_zod2.z.object({ pageSize: import_zod2.z.number().int().nonnegative(), search: import_zod2.z.string(), searchMatchMode: import_zod2.z.enum(["contains", "whole_words"]).optional(), searchScope: import_zod2.z.string().min(1).optional(), anyOf: import_zod2.z.string(), layeredFilters: import_zod2.z.array(layeredRuleSchema).optional(), columnFilters: import_zod2.z.record(import_zod2.z.string(), filterSchema.optional()), sort: import_zod2.z.object({ id: import_zod2.z.string().min(1), direction: import_zod2.z.enum(["asc", "desc"]) }).nullable() }),
|
|
46150
46215
|
columns: import_zod2.z.object({
|
|
46151
46216
|
order: import_zod2.z.array(import_zod2.z.string().min(1)).refine((order) => new Set(order).size === order.length, {
|
|
46152
46217
|
message: "Column order must not contain duplicate IDs"
|
|
@@ -46201,7 +46266,7 @@ function parseTableViewSnapshot(raw) {
|
|
|
46201
46266
|
}
|
|
46202
46267
|
|
|
46203
46268
|
// src/data-table/MatrxUuidCell.tsx
|
|
46204
|
-
var
|
|
46269
|
+
var import_react19 = require("react");
|
|
46205
46270
|
var import_jsx_runtime44 = require("react/jsx-runtime");
|
|
46206
46271
|
var SHORT_LEN = 8;
|
|
46207
46272
|
function shortUuid(id, len = SHORT_LEN) {
|
|
@@ -46241,11 +46306,11 @@ function MatrxUuidCell({
|
|
|
46241
46306
|
}) {
|
|
46242
46307
|
const { resolveEntityDoors, ResourcePeek } = useMatrxDataTableHost();
|
|
46243
46308
|
const { notify, notice } = useTableNotice();
|
|
46244
|
-
const [copied, setCopied] = (0,
|
|
46245
|
-
const [opening, setOpening] = (0,
|
|
46246
|
-
const [peekOpen, setPeekOpen] = (0,
|
|
46247
|
-
const timer = (0,
|
|
46248
|
-
(0,
|
|
46309
|
+
const [copied, setCopied] = (0, import_react19.useState)(false);
|
|
46310
|
+
const [opening, setOpening] = (0, import_react19.useState)(false);
|
|
46311
|
+
const [peekOpen, setPeekOpen] = (0, import_react19.useState)(false);
|
|
46312
|
+
const timer = (0, import_react19.useRef)(null);
|
|
46313
|
+
(0, import_react19.useEffect)(
|
|
46249
46314
|
() => () => {
|
|
46250
46315
|
if (timer.current) clearTimeout(timer.current);
|
|
46251
46316
|
},
|
|
@@ -46540,7 +46605,7 @@ function DataRowInspector({
|
|
|
46540
46605
|
}
|
|
46541
46606
|
|
|
46542
46607
|
// src/data-table/DataRowWindow.tsx
|
|
46543
|
-
var
|
|
46608
|
+
var import_react20 = require("react");
|
|
46544
46609
|
var import_jsx_runtime46 = require("react/jsx-runtime");
|
|
46545
46610
|
function DataRowWindow({
|
|
46546
46611
|
isOpen,
|
|
@@ -46561,8 +46626,8 @@ function DataRowWindow({
|
|
|
46561
46626
|
const hasEdit = editContent != null;
|
|
46562
46627
|
const hasTabs = hasEdit && children == null;
|
|
46563
46628
|
const initialTab = defaultTab ?? (hasEdit ? "edit" : "view");
|
|
46564
|
-
const [tab, setTab] = (0,
|
|
46565
|
-
(0,
|
|
46629
|
+
const [tab, setTab] = (0, import_react20.useState)(initialTab);
|
|
46630
|
+
(0, import_react20.useEffect)(() => {
|
|
46566
46631
|
if (!isOpen) return;
|
|
46567
46632
|
setTab(defaultTab ?? (hasEdit ? "edit" : "view"));
|
|
46568
46633
|
}, [isOpen, windowId, hasEdit, defaultTab]);
|
|
@@ -47803,7 +47868,7 @@ function DirtySavePill({
|
|
|
47803
47868
|
}
|
|
47804
47869
|
|
|
47805
47870
|
// src/data-table/EditableTableCell.tsx
|
|
47806
|
-
var
|
|
47871
|
+
var import_react21 = require("react");
|
|
47807
47872
|
var import_jsx_runtime49 = require("react/jsx-runtime");
|
|
47808
47873
|
function CellRefusal({ reason }) {
|
|
47809
47874
|
return /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
@@ -47865,12 +47930,12 @@ function EditableTableCell({
|
|
|
47865
47930
|
editRequest,
|
|
47866
47931
|
editSeed
|
|
47867
47932
|
}) {
|
|
47868
|
-
const [open, setOpen] = (0,
|
|
47869
|
-
const [refusal, setRefusal] = (0,
|
|
47870
|
-
(0,
|
|
47933
|
+
const [open, setOpen] = (0, import_react21.useState)(false);
|
|
47934
|
+
const [refusal, setRefusal] = (0, import_react21.useState)(null);
|
|
47935
|
+
(0, import_react21.useEffect)(() => {
|
|
47871
47936
|
if (editRequest !== void 0) setOpen(true);
|
|
47872
47937
|
}, [editRequest]);
|
|
47873
|
-
(0,
|
|
47938
|
+
(0, import_react21.useEffect)(() => {
|
|
47874
47939
|
if (!open) setRefusal(null);
|
|
47875
47940
|
}, [open]);
|
|
47876
47941
|
const usePencil = Boolean(href) || editTrigger === "pencil";
|
|
@@ -47974,13 +48039,13 @@ function InlineStringEditor({
|
|
|
47974
48039
|
editRequest,
|
|
47975
48040
|
editSeed
|
|
47976
48041
|
}) {
|
|
47977
|
-
const [editing, setEditing] = (0,
|
|
47978
|
-
const [draft, setDraft] = (0,
|
|
47979
|
-
const [refusal, setRefusal] = (0,
|
|
47980
|
-
const handledEditRequest = (0,
|
|
47981
|
-
const seedRef = (0,
|
|
48042
|
+
const [editing, setEditing] = (0, import_react21.useState)(false);
|
|
48043
|
+
const [draft, setDraft] = (0, import_react21.useState)(value);
|
|
48044
|
+
const [refusal, setRefusal] = (0, import_react21.useState)(null);
|
|
48045
|
+
const handledEditRequest = (0, import_react21.useRef)(void 0);
|
|
48046
|
+
const seedRef = (0, import_react21.useRef)(editSeed);
|
|
47982
48047
|
seedRef.current = editSeed;
|
|
47983
|
-
(0,
|
|
48048
|
+
(0, import_react21.useEffect)(() => {
|
|
47984
48049
|
if (editRequest === void 0 || handledEditRequest.current === editRequest) return;
|
|
47985
48050
|
handledEditRequest.current = editRequest;
|
|
47986
48051
|
setDraft(seedRef.current ?? value);
|
|
@@ -48140,8 +48205,8 @@ function DateEditor({
|
|
|
48140
48205
|
onCommit,
|
|
48141
48206
|
onCancel
|
|
48142
48207
|
}) {
|
|
48143
|
-
const [draft, setDraft] = (0,
|
|
48144
|
-
const done = (0,
|
|
48208
|
+
const [draft, setDraft] = (0, import_react21.useState)(value);
|
|
48209
|
+
const done = (0, import_react21.useRef)(false);
|
|
48145
48210
|
const finish = () => {
|
|
48146
48211
|
if (done.current) return;
|
|
48147
48212
|
done.current = true;
|
|
@@ -48176,8 +48241,8 @@ function TagsEditor({
|
|
|
48176
48241
|
onCommit,
|
|
48177
48242
|
onCancel
|
|
48178
48243
|
}) {
|
|
48179
|
-
const [tags, setTags] = (0,
|
|
48180
|
-
const [draft, setDraft] = (0,
|
|
48244
|
+
const [tags, setTags] = (0, import_react21.useState)(value);
|
|
48245
|
+
const [draft, setDraft] = (0, import_react21.useState)("");
|
|
48181
48246
|
const add = (raw) => {
|
|
48182
48247
|
const next = raw.trim();
|
|
48183
48248
|
if (!next || tags.includes(next)) return;
|
|
@@ -48274,7 +48339,7 @@ function NumberEditor({
|
|
|
48274
48339
|
onCommit,
|
|
48275
48340
|
onCancel
|
|
48276
48341
|
}) {
|
|
48277
|
-
const [draft, setDraft] = (0,
|
|
48342
|
+
const [draft, setDraft] = (0, import_react21.useState)(String(value));
|
|
48278
48343
|
return /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "flex flex-col gap-2", children: [
|
|
48279
48344
|
/* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
|
|
48280
48345
|
Input,
|
|
@@ -48678,6 +48743,7 @@ function safeQueryPage(requestedPage, totalItems, pageSize) {
|
|
|
48678
48743
|
|
|
48679
48744
|
// src/data-table/MatrxDataTable.tsx
|
|
48680
48745
|
var import_jsx_runtime51 = require("react/jsx-runtime");
|
|
48746
|
+
var EMPTY_TABLE_ROWS = [];
|
|
48681
48747
|
function TableToolbarAction({
|
|
48682
48748
|
HostAction,
|
|
48683
48749
|
ariaLabel,
|
|
@@ -48702,7 +48768,7 @@ function TableToolbarAction({
|
|
|
48702
48768
|
disabled,
|
|
48703
48769
|
onClick,
|
|
48704
48770
|
children: [
|
|
48705
|
-
(0,
|
|
48771
|
+
(0, import_react22.isValidElement)(children) ? (0, import_react22.cloneElement)(children, { className: cn("h-4 w-4", children.props.className) }) : children,
|
|
48706
48772
|
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { children: ariaLabel })
|
|
48707
48773
|
]
|
|
48708
48774
|
}
|
|
@@ -48724,7 +48790,7 @@ function TableToolbarAction({
|
|
|
48724
48790
|
"aria-busy": busy || void 0,
|
|
48725
48791
|
disabled,
|
|
48726
48792
|
onClick,
|
|
48727
|
-
children: (0,
|
|
48793
|
+
children: (0, import_react22.isValidElement)(children) ? (0, import_react22.cloneElement)(children, { className: cn("h-5 w-5", children.props.className) }) : children
|
|
48728
48794
|
}
|
|
48729
48795
|
) }) }),
|
|
48730
48796
|
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TooltipContent, { children: tooltip ?? ariaLabel })
|
|
@@ -48787,7 +48853,7 @@ function MatrxDataTableWithUrlState({
|
|
|
48787
48853
|
...urlState.history === void 0 ? {} : { history: urlState.history },
|
|
48788
48854
|
...urlState.textHistory === void 0 ? {} : { textHistory: urlState.textHistory }
|
|
48789
48855
|
});
|
|
48790
|
-
(0,
|
|
48856
|
+
(0, import_react22.useEffect)(() => {
|
|
48791
48857
|
if (activeUrlTableIds.has(urlState.id)) {
|
|
48792
48858
|
throw new Error(
|
|
48793
48859
|
`Duplicate MatrxDataTable urlState.id "${urlState.id}" on one page. Give every table a unique stable id.`
|
|
@@ -48896,7 +48962,7 @@ var DND_MEASURING = { droppable: { strategy: import_core3.MeasuringStrategy.Alwa
|
|
|
48896
48962
|
var NO_LAYERED_FILTERS = [];
|
|
48897
48963
|
var NO_GROUPING_VALUE = "__matrx_no_grouping__";
|
|
48898
48964
|
function useRenderEpoch(values) {
|
|
48899
|
-
const held = (0,
|
|
48965
|
+
const held = (0, import_react22.useRef)(null);
|
|
48900
48966
|
const previous = held.current;
|
|
48901
48967
|
if (previous !== null && previous.values.length === values.length && previous.values.every((value, i) => Object.is(value, values[i]))) {
|
|
48902
48968
|
return previous.epoch;
|
|
@@ -48938,10 +49004,10 @@ function versionFacts(version2) {
|
|
|
48938
49004
|
function sameBodyRow(a, b) {
|
|
48939
49005
|
return a.row === b.row && a.index === b.index && a.epoch === b.epoch && a.rowId === b.rowId && a.facts.length === b.facts.length && a.facts.every((fact, i) => Object.is(fact, b.facts[i]));
|
|
48940
49006
|
}
|
|
48941
|
-
var MatrxTableBodyRow = (0,
|
|
49007
|
+
var MatrxTableBodyRow = (0, import_react22.memo)(function MatrxTableBodyRow2({ row, index, render }) {
|
|
48942
49008
|
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: render(row, index) });
|
|
48943
49009
|
}, sameBodyRow);
|
|
48944
|
-
var MatrxTableChrome = (0,
|
|
49010
|
+
var MatrxTableChrome = (0, import_react22.memo)(function MatrxTableChrome2({ render }) {
|
|
48945
49011
|
return /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: render() });
|
|
48946
49012
|
}, (a, b) => a.part === b.part && a.epoch === b.epoch);
|
|
48947
49013
|
function columnsSignature(columns) {
|
|
@@ -49040,9 +49106,9 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49040
49106
|
} = coreProps;
|
|
49041
49107
|
const appendQuery = query?.mode === "controlled-append" ? query : null;
|
|
49042
49108
|
const appendQueryKey = appendQuery?.pagination.queryKey ?? null;
|
|
49043
|
-
const committedAppendQueryKey = (0,
|
|
49109
|
+
const committedAppendQueryKey = (0, import_react22.useRef)(appendQueryKey);
|
|
49044
49110
|
const appendSourceChanged = appendQuery !== null && committedAppendQueryKey.current !== appendQueryKey;
|
|
49045
|
-
const data = (appendQuery ? appendQuery.pagination.rows : suppliedData) ??
|
|
49111
|
+
const data = (appendQuery ? appendQuery.pagination.rows : suppliedData) ?? EMPTY_TABLE_ROWS;
|
|
49046
49112
|
const readView = tableReadView(read, data.length, appendQuery ? appendQuery.pagination.loading : suppliedLoading);
|
|
49047
49113
|
const isLoading = readView.loading;
|
|
49048
49114
|
const isFetching = appendQuery ? appendQuery.pagination.isFetchingNextPage : suppliedFetching;
|
|
@@ -49053,19 +49119,21 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49053
49119
|
const ContextMenuBoundary = host.ContextMenuBoundary ?? TableContextPassthrough;
|
|
49054
49120
|
const resolvedDensity = density ?? host.defaultDensity ?? "normal";
|
|
49055
49121
|
const SavedViews = host.SavedViews;
|
|
49122
|
+
const savedViewsId = tableId ?? urlState?.id;
|
|
49123
|
+
const showViewTabs = viewTabs && Boolean(viewTabsStore || savedViewsId && SavedViews);
|
|
49056
49124
|
const Link = host.Link ?? DefaultTableLink;
|
|
49057
49125
|
const SidePanelSurface = host.SidePanelSurface ?? DefaultTableSidePanel;
|
|
49058
49126
|
const { notify: toast, notice } = useTableNotice();
|
|
49059
|
-
const [savedViewError, setSavedViewError] = (0,
|
|
49060
|
-
const [toolbarActionError, setToolbarActionError] = (0,
|
|
49061
|
-
const [toolbarActionPending, setToolbarActionPending] = (0,
|
|
49062
|
-
const toolbarActionPendingRef = (0,
|
|
49127
|
+
const [savedViewError, setSavedViewError] = (0, import_react22.useState)(null);
|
|
49128
|
+
const [toolbarActionError, setToolbarActionError] = (0, import_react22.useState)(null);
|
|
49129
|
+
const [toolbarActionPending, setToolbarActionPending] = (0, import_react22.useState)({ refresh: false, add: false });
|
|
49130
|
+
const toolbarActionPendingRef = (0, import_react22.useRef)({ refresh: false, add: false });
|
|
49063
49131
|
const CHECKBOX_TAP_AREA = "h-4 w-4 touch-manipulation";
|
|
49064
49132
|
const mobileCardsClass = mobileCardsBreakpoint === "lg" ? "lg:hidden" : "sm:hidden";
|
|
49065
49133
|
const tableWithCardsClass = mobileCardsBreakpoint === "lg" ? "max-lg:hidden" : "max-sm:hidden";
|
|
49066
49134
|
const cardsQuery = mobileCardsBreakpoint === "lg" ? "(max-width: 1023px)" : "(max-width: 639px)";
|
|
49067
|
-
const [cardsActive, setCardsActive] = (0,
|
|
49068
|
-
(0,
|
|
49135
|
+
const [cardsActive, setCardsActive] = (0, import_react22.useState)(null);
|
|
49136
|
+
(0, import_react22.useEffect)(() => {
|
|
49069
49137
|
if (!mobileCards || typeof window === "undefined" || !window.matchMedia) return;
|
|
49070
49138
|
const mql = window.matchMedia(cardsQuery);
|
|
49071
49139
|
const read2 = () => setCardsActive(mql.matches);
|
|
@@ -49081,12 +49149,12 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49081
49149
|
const appendDefaultsToSourceProcessing = appendQuery !== null && sourceProcessing === void 0;
|
|
49082
49150
|
const sourceColumnFilterOwnership = sourceProcessing?.columnFilters;
|
|
49083
49151
|
const sourceOwnsColumnFilters = appendDefaultsToSourceProcessing ? true : sourceColumnFilterOwnership === "source" || typeof sourceColumnFilterOwnership === "object" && sourceColumnFilterOwnership.source.length > 0;
|
|
49084
|
-
const
|
|
49152
|
+
const remoteQueryUsesLocalProcessing = remoteQuery !== null && (sourceColumnFilterOwnership === "local" || remoteQuery.mode === "controlled" && (sourceProcessing?.search === "local" || sourceProcessing?.sort === "local"));
|
|
49085
49153
|
const sourceOwnsSort = appendQuery !== null && sourceProcessing === void 0 ? true : sourceProcessing?.sort === "source";
|
|
49086
49154
|
const sourceOwnsIntelligentSearch = sourceProcessing?.intelligentSearch === "source";
|
|
49087
|
-
const sourceOwnsSearch = remoteQuery?.mode === "controlled" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
|
|
49155
|
+
const sourceOwnsSearch = remoteQuery?.mode === "controlled" && sourceProcessing?.search !== "local" || appendQuery !== null && sourceProcessing === void 0 || sourceProcessing?.search === "source" || sourceOwnsIntelligentSearch;
|
|
49088
49156
|
const intelligentSearchEnabled = toolbar?.intelligentSearch !== void 0 && (sourceOwnsIntelligentSearch || remoteQuery === null && !sourceOwnsSearch);
|
|
49089
|
-
const emitControlledQueryChange = (0,
|
|
49157
|
+
const emitControlledQueryChange = (0, import_react22.useCallback)(
|
|
49090
49158
|
(patch, options) => {
|
|
49091
49159
|
if (!controlledQuery) return;
|
|
49092
49160
|
controlledQuery.onStateChange(
|
|
@@ -49095,8 +49163,8 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49095
49163
|
},
|
|
49096
49164
|
[controlledQuery]
|
|
49097
49165
|
);
|
|
49098
|
-
const [internalSearch, setInternalSearch] = (0,
|
|
49099
|
-
const [draggedRowId, setDraggedRowId] = (0,
|
|
49166
|
+
const [internalSearch, setInternalSearch] = (0, import_react22.useState)("");
|
|
49167
|
+
const [draggedRowId, setDraggedRowId] = (0, import_react22.useState)(null);
|
|
49100
49168
|
const hierarchySensors = (0, import_core3.useSensors)((0, import_core3.useSensor)(import_core3.PointerSensor, POINTER_SENSOR_OPTIONS));
|
|
49101
49169
|
const toolbarSearchControlled = toolbar?.searchValue !== void 0;
|
|
49102
49170
|
const searchValue = controlledQuery ? controlledQuery.state.search : toolbarSearchControlled ? toolbar?.searchValue ?? "" : internalSearch;
|
|
@@ -49108,7 +49176,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49108
49176
|
}
|
|
49109
49177
|
toolbar?.onSearchChange?.(v);
|
|
49110
49178
|
};
|
|
49111
|
-
const [internalSearchMatchMode, setInternalSearchMatchMode] = (0,
|
|
49179
|
+
const [internalSearchMatchMode, setInternalSearchMatchMode] = (0, import_react22.useState)(
|
|
49112
49180
|
toolbar?.searchMatch?.defaultMode ?? "contains"
|
|
49113
49181
|
);
|
|
49114
49182
|
const searchMatchMode = controlledQuery ? controlledQuery.state.searchMatchMode ?? toolbar?.searchMatch?.defaultMode ?? "contains" : internalSearchMatchMode;
|
|
@@ -49119,7 +49187,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49119
49187
|
}
|
|
49120
49188
|
setInternalSearchMatchMode(mode);
|
|
49121
49189
|
};
|
|
49122
|
-
const [internalSearchScope, setInternalSearchScope] = (0,
|
|
49190
|
+
const [internalSearchScope, setInternalSearchScope] = (0, import_react22.useState)("all");
|
|
49123
49191
|
const searchScope = controlledQuery ? controlledQuery.state.searchScope ?? "all" : internalSearchScope;
|
|
49124
49192
|
const setSearchScope = (scope) => {
|
|
49125
49193
|
if (controlledQuery) {
|
|
@@ -49128,7 +49196,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49128
49196
|
}
|
|
49129
49197
|
setInternalSearchScope(scope);
|
|
49130
49198
|
};
|
|
49131
|
-
const [internalAnyOf, setInternalAnyOf] = (0,
|
|
49199
|
+
const [internalAnyOf, setInternalAnyOf] = (0, import_react22.useState)("");
|
|
49132
49200
|
const toolbarAnyOfControlled = toolbar?.anyOf?.value !== void 0;
|
|
49133
49201
|
const anyOfValue = controlledQuery ? controlledQuery.state.anyOf : toolbarAnyOfControlled ? toolbar?.anyOf?.value ?? "" : internalAnyOf;
|
|
49134
49202
|
const setAnyOfValue = (v) => {
|
|
@@ -49139,7 +49207,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49139
49207
|
}
|
|
49140
49208
|
toolbar?.anyOf?.onChange?.(v);
|
|
49141
49209
|
};
|
|
49142
|
-
const [internalLayeredFilters, setInternalLayeredFilters] = (0,
|
|
49210
|
+
const [internalLayeredFilters, setInternalLayeredFilters] = (0, import_react22.useState)([]);
|
|
49143
49211
|
const layeredFilters = controlledQuery ? controlledQuery.state.layeredFilters ?? NO_LAYERED_FILTERS : internalLayeredFilters;
|
|
49144
49212
|
const setLayeredFilters = (next) => {
|
|
49145
49213
|
if (controlledQuery) {
|
|
@@ -49148,9 +49216,9 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49148
49216
|
}
|
|
49149
49217
|
setInternalLayeredFilters(next);
|
|
49150
49218
|
};
|
|
49151
|
-
const [internalColumnFilters, setInternalColumnFilters] = (0,
|
|
49219
|
+
const [internalColumnFilters, setInternalColumnFilters] = (0, import_react22.useState)({});
|
|
49152
49220
|
const columnFilters = controlledQuery ? controlledQuery.state.columnFilters : internalColumnFilters;
|
|
49153
|
-
const localColumnFilters = (0,
|
|
49221
|
+
const localColumnFilters = (0, import_react22.useMemo)(() => {
|
|
49154
49222
|
if (appendDefaultsToSourceProcessing) return {};
|
|
49155
49223
|
if (sourceColumnFilterOwnership === "source") return {};
|
|
49156
49224
|
if (sourceColumnFilterOwnership === void 0 || sourceColumnFilterOwnership === "local") {
|
|
@@ -49172,7 +49240,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49172
49240
|
}
|
|
49173
49241
|
setInternalColumnFilters(nextFilters);
|
|
49174
49242
|
};
|
|
49175
|
-
const [internalSort, setInternalSort] = (0,
|
|
49243
|
+
const [internalSort, setInternalSort] = (0, import_react22.useState)(defaultSort);
|
|
49176
49244
|
const sort = controlledQuery ? controlledQuery.state.sort : internalSort;
|
|
49177
49245
|
const setSort = (next) => {
|
|
49178
49246
|
if (controlledQuery) {
|
|
@@ -49181,7 +49249,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49181
49249
|
}
|
|
49182
49250
|
setInternalSort(next);
|
|
49183
49251
|
};
|
|
49184
|
-
const [internalPage, setInternalPage] = (0,
|
|
49252
|
+
const [internalPage, setInternalPage] = (0, import_react22.useState)(1);
|
|
49185
49253
|
const page = controlledQuery ? controlledQuery.state.page : internalPage;
|
|
49186
49254
|
const setPage = (next) => {
|
|
49187
49255
|
if (controlledQuery) {
|
|
@@ -49190,7 +49258,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49190
49258
|
}
|
|
49191
49259
|
setInternalPage(next);
|
|
49192
49260
|
};
|
|
49193
|
-
const [internalPageSize, setInternalPageSize] = (0,
|
|
49261
|
+
const [internalPageSize, setInternalPageSize] = (0, import_react22.useState)(
|
|
49194
49262
|
defaultPageSize
|
|
49195
49263
|
);
|
|
49196
49264
|
const pageSize = controlledQuery ? controlledQuery.state.pageSize : internalPageSize;
|
|
@@ -49201,28 +49269,28 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49201
49269
|
}
|
|
49202
49270
|
setInternalPageSize(next);
|
|
49203
49271
|
};
|
|
49204
|
-
const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0,
|
|
49272
|
+
const [uncontrolledSelectedId, setUncontrolledSelectedId] = (0, import_react22.useState)(null);
|
|
49205
49273
|
const rawSelectedId = controlledSelectedId !== void 0 ? controlledSelectedId : uncontrolledSelectedId;
|
|
49206
49274
|
const selectedId = appendSourceChanged ? null : rawSelectedId;
|
|
49207
49275
|
const setSelectedId = (id) => {
|
|
49208
49276
|
if (controlledSelectedId === void 0) setUncontrolledSelectedId(id);
|
|
49209
49277
|
onSelectedIdChange?.(id);
|
|
49210
49278
|
};
|
|
49211
|
-
const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0,
|
|
49279
|
+
const [uncontrolledWindowRowId, setUncontrolledWindowRowId] = (0, import_react22.useState)(null);
|
|
49212
49280
|
const rawWindowRowId = controlledWindowRowId !== void 0 ? controlledWindowRowId : uncontrolledWindowRowId;
|
|
49213
49281
|
const windowRowId = appendSourceChanged ? null : rawWindowRowId;
|
|
49214
49282
|
const setWindowRowId = (id) => {
|
|
49215
49283
|
if (controlledWindowRowId === void 0) setUncontrolledWindowRowId(id);
|
|
49216
49284
|
onWindowRowIdChange?.(id);
|
|
49217
49285
|
};
|
|
49218
|
-
const [windowRowSnapshot, setWindowRowSnapshot] = (0,
|
|
49286
|
+
const [windowRowSnapshot, setWindowRowSnapshot] = (0, import_react22.useState)(null);
|
|
49219
49287
|
const editScopeKey = appendQueryKey === null ? "\0local" : `append:${appendQueryKey}`;
|
|
49220
|
-
const [editsByScope, setEditsByScope] = (0,
|
|
49221
|
-
const editRevisionRef = (0,
|
|
49222
|
-
const [savingByScope, setSavingByScope] = (0,
|
|
49223
|
-
const savingScopesRef = (0,
|
|
49224
|
-
const [editRequest, setEditRequest] = (0,
|
|
49225
|
-
const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0,
|
|
49288
|
+
const [editsByScope, setEditsByScope] = (0, import_react22.useState)({});
|
|
49289
|
+
const editRevisionRef = (0, import_react22.useRef)({});
|
|
49290
|
+
const [savingByScope, setSavingByScope] = (0, import_react22.useState)({});
|
|
49291
|
+
const savingScopesRef = (0, import_react22.useRef)(/* @__PURE__ */ new Set());
|
|
49292
|
+
const [editRequest, setEditRequest] = (0, import_react22.useState)(null);
|
|
49293
|
+
const [confirmForeignDraftDiscard, setConfirmForeignDraftDiscard] = (0, import_react22.useState)(false);
|
|
49226
49294
|
const edits = editsByScope[editScopeKey]?.values ?? {};
|
|
49227
49295
|
const saving = (savingByScope[editScopeKey] ?? 0) > 0;
|
|
49228
49296
|
const setEdits = (next) => {
|
|
@@ -49289,7 +49357,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49289
49357
|
rows: Object.entries(draft.values).map(([rowId, columns2]) => ({ rowId, columns: columns2 }))
|
|
49290
49358
|
}));
|
|
49291
49359
|
const selection = appendSourceChanged && selectionConfig ? { ...selectionConfig, selectedIds: [] } : selectionConfig;
|
|
49292
|
-
(0,
|
|
49360
|
+
(0, import_react22.useEffect)(() => {
|
|
49293
49361
|
const previous = committedAppendQueryKey.current;
|
|
49294
49362
|
committedAppendQueryKey.current = appendQueryKey;
|
|
49295
49363
|
if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
|
|
@@ -49307,14 +49375,14 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49307
49375
|
onWindowRowIdChange,
|
|
49308
49376
|
selectionConfig
|
|
49309
49377
|
]);
|
|
49310
|
-
const scrollRef = (0,
|
|
49311
|
-
const tableRef = (0,
|
|
49312
|
-
const tableHeaderRef = (0,
|
|
49313
|
-
const cardsScrollRef = (0,
|
|
49314
|
-
const [documentStickyHeader, setDocumentStickyHeader] = (0,
|
|
49315
|
-
const documentStickyHeaderRef = (0,
|
|
49316
|
-
const previousAppendKeyForScrollReset = (0,
|
|
49317
|
-
(0,
|
|
49378
|
+
const scrollRef = (0, import_react22.useRef)(null);
|
|
49379
|
+
const tableRef = (0, import_react22.useRef)(null);
|
|
49380
|
+
const tableHeaderRef = (0, import_react22.useRef)(null);
|
|
49381
|
+
const cardsScrollRef = (0, import_react22.useRef)(null);
|
|
49382
|
+
const [documentStickyHeader, setDocumentStickyHeader] = (0, import_react22.useState)(false);
|
|
49383
|
+
const documentStickyHeaderRef = (0, import_react22.useRef)(false);
|
|
49384
|
+
const previousAppendKeyForScrollReset = (0, import_react22.useRef)(appendQueryKey);
|
|
49385
|
+
(0, import_react22.useLayoutEffect)(() => {
|
|
49318
49386
|
const previous = previousAppendKeyForScrollReset.current;
|
|
49319
49387
|
previousAppendKeyForScrollReset.current = appendQueryKey;
|
|
49320
49388
|
if (previous === null || appendQueryKey === null || previous === appendQueryKey) {
|
|
@@ -49339,14 +49407,14 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49339
49407
|
...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.thresholdPx !== void 0 ? { thresholdPx: appendScrollPolicy.thresholdPx } : {},
|
|
49340
49408
|
...appendScrollPolicy?.mode === "scroll" && appendScrollPolicy.intentTimeoutMs !== void 0 ? { intentTimeoutMs: appendScrollPolicy.intentTimeoutMs } : {}
|
|
49341
49409
|
});
|
|
49342
|
-
const rootRef = (0,
|
|
49410
|
+
const rootRef = (0, import_react22.useRef)(null);
|
|
49343
49411
|
useClippedContentGuard(rootRef, {
|
|
49344
49412
|
label: typeof copy === "object" && copy.listLabel ? `Table: ${copy.listLabel}` : "MatrxDataTable"
|
|
49345
49413
|
});
|
|
49346
|
-
const [scrollHintRight, setScrollHintRight] = (0,
|
|
49347
|
-
const [scrollHintLeft, setScrollHintLeft] = (0,
|
|
49348
|
-
const [scrollHintRightInset, setScrollHintRightInset] = (0,
|
|
49349
|
-
const updateScrollHint = (0,
|
|
49414
|
+
const [scrollHintRight, setScrollHintRight] = (0, import_react22.useState)(false);
|
|
49415
|
+
const [scrollHintLeft, setScrollHintLeft] = (0, import_react22.useState)(false);
|
|
49416
|
+
const [scrollHintRightInset, setScrollHintRightInset] = (0, import_react22.useState)(6);
|
|
49417
|
+
const updateScrollHint = (0, import_react22.useCallback)(() => {
|
|
49350
49418
|
const el = scrollRef.current;
|
|
49351
49419
|
if (!el) return;
|
|
49352
49420
|
const hasRows = Boolean(el.querySelector("tbody tr[data-row-id]"));
|
|
@@ -49363,7 +49431,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49363
49431
|
behavior: "smooth"
|
|
49364
49432
|
});
|
|
49365
49433
|
};
|
|
49366
|
-
(0,
|
|
49434
|
+
(0, import_react22.useEffect)(() => {
|
|
49367
49435
|
updateScrollHint();
|
|
49368
49436
|
window.addEventListener("resize", updateScrollHint);
|
|
49369
49437
|
const el = scrollRef.current;
|
|
@@ -49378,7 +49446,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49378
49446
|
observer?.disconnect();
|
|
49379
49447
|
};
|
|
49380
49448
|
}, [updateScrollHint, data, columns]);
|
|
49381
|
-
(0,
|
|
49449
|
+
(0, import_react22.useLayoutEffect)(() => {
|
|
49382
49450
|
const scroll = scrollRef.current;
|
|
49383
49451
|
const table = tableRef.current;
|
|
49384
49452
|
const header = tableHeaderRef.current;
|
|
@@ -49437,30 +49505,30 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49437
49505
|
window.removeEventListener("resize", requestUpdate);
|
|
49438
49506
|
};
|
|
49439
49507
|
}, [stickyHeader, data, columns]);
|
|
49440
|
-
const [columnOrder, setColumnOrder] = (0,
|
|
49441
|
-
const [hiddenColumnIds, setHiddenColumnIds] = (0,
|
|
49508
|
+
const [columnOrder, setColumnOrder] = (0, import_react22.useState)(() => columnState?.order ?? columns.map(columnId));
|
|
49509
|
+
const [hiddenColumnIds, setHiddenColumnIds] = (0, import_react22.useState)(
|
|
49442
49510
|
() => new Set(columnState?.hidden ?? columns.filter((column) => column.hidden).map(columnId))
|
|
49443
49511
|
);
|
|
49444
|
-
const [columnWidths, setColumnWidths] = (0,
|
|
49512
|
+
const [columnWidths, setColumnWidths] = (0, import_react22.useState)(
|
|
49445
49513
|
() => normalizeColumnWidthsForColumns(columnState?.widths, columns)
|
|
49446
49514
|
);
|
|
49447
|
-
const [fixedTableGeometry, setFixedTableGeometry] = (0,
|
|
49448
|
-
const knownColumnIds = (0,
|
|
49449
|
-
const draggedColumnId = (0,
|
|
49450
|
-
const columnDragActive = (0,
|
|
49451
|
-
const columnDragRaf = (0,
|
|
49452
|
-
const columnDragScrollDirection = (0,
|
|
49453
|
-
const [columnDragPreview, setColumnDragPreview] = (0,
|
|
49454
|
-
const stopColumnDragScroll = (0,
|
|
49515
|
+
const [fixedTableGeometry, setFixedTableGeometry] = (0, import_react22.useState)(null);
|
|
49516
|
+
const knownColumnIds = (0, import_react22.useRef)(new Set(columns.map(columnId)));
|
|
49517
|
+
const draggedColumnId = (0, import_react22.useRef)(null);
|
|
49518
|
+
const columnDragActive = (0, import_react22.useRef)(false);
|
|
49519
|
+
const columnDragRaf = (0, import_react22.useRef)(null);
|
|
49520
|
+
const columnDragScrollDirection = (0, import_react22.useRef)(0);
|
|
49521
|
+
const [columnDragPreview, setColumnDragPreview] = (0, import_react22.useState)(null);
|
|
49522
|
+
const stopColumnDragScroll = (0, import_react22.useCallback)(() => {
|
|
49455
49523
|
if (columnDragRaf.current !== null) cancelAnimationFrame(columnDragRaf.current);
|
|
49456
49524
|
columnDragRaf.current = null;
|
|
49457
49525
|
columnDragScrollDirection.current = 0;
|
|
49458
49526
|
}, []);
|
|
49459
|
-
(0,
|
|
49527
|
+
(0, import_react22.useEffect)(() => () => {
|
|
49460
49528
|
columnDragActive.current = false;
|
|
49461
49529
|
stopColumnDragScroll();
|
|
49462
49530
|
}, [stopColumnDragScroll]);
|
|
49463
|
-
const startColumnDragScroll = (0,
|
|
49531
|
+
const startColumnDragScroll = (0, import_react22.useCallback)(() => {
|
|
49464
49532
|
if (!columnDragActive.current || columnDragRaf.current !== null) return;
|
|
49465
49533
|
const scrollStep = () => {
|
|
49466
49534
|
const scroll = scrollRef.current;
|
|
@@ -49487,25 +49555,25 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49487
49555
|
};
|
|
49488
49556
|
columnDragRaf.current = requestAnimationFrame(scrollStep);
|
|
49489
49557
|
}, []);
|
|
49490
|
-
const commitColumnState = (0,
|
|
49558
|
+
const commitColumnState = (0, import_react22.useCallback)((order, hidden) => {
|
|
49491
49559
|
if (columnState) columnState.onChange({ order, hidden: [...hidden] });
|
|
49492
49560
|
else {
|
|
49493
49561
|
setColumnOrder(order);
|
|
49494
49562
|
setHiddenColumnIds(hidden);
|
|
49495
49563
|
}
|
|
49496
49564
|
}, [columnState]);
|
|
49497
|
-
const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0,
|
|
49565
|
+
const [internalColumnManagerOpen, setInternalColumnManagerOpen] = (0, import_react22.useState)(false);
|
|
49498
49566
|
const columnManagerOpen = controlledColumnManager?.open ?? internalColumnManagerOpen;
|
|
49499
49567
|
const setColumnManagerOpen = controlledColumnManager?.onOpenChange ?? setInternalColumnManagerOpen;
|
|
49500
|
-
const columnIds = (0,
|
|
49501
|
-
const effectiveColumnOrder = (0,
|
|
49502
|
-
const effectiveHiddenColumnIds = (0,
|
|
49503
|
-
const effectiveColumnWidths = (0,
|
|
49568
|
+
const columnIds = (0, import_react22.useMemo)(() => columns.map(columnId), [columns]);
|
|
49569
|
+
const effectiveColumnOrder = (0, import_react22.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]);
|
|
49570
|
+
const effectiveHiddenColumnIds = (0, import_react22.useMemo)(() => columnState ? new Set(columnState.hidden.filter((id) => columnIds.includes(id))) : hiddenColumnIds, [columnIds, columnState, hiddenColumnIds]);
|
|
49571
|
+
const effectiveColumnWidths = (0, import_react22.useMemo)(
|
|
49504
49572
|
() => normalizeColumnWidthsForColumns(columnState?.widths ?? columnWidths, columns),
|
|
49505
49573
|
[columns, columnState?.widths, columnWidths]
|
|
49506
49574
|
);
|
|
49507
|
-
const resizeGestureSnapshotRef = (0,
|
|
49508
|
-
const measureVisibleColumnWidths = (0,
|
|
49575
|
+
const resizeGestureSnapshotRef = (0, import_react22.useRef)(null);
|
|
49576
|
+
const measureVisibleColumnWidths = (0, import_react22.useCallback)(() => {
|
|
49509
49577
|
const measured = {};
|
|
49510
49578
|
const headers = tableRef.current ? Array.from(tableRef.current.querySelectorAll(
|
|
49511
49579
|
"thead th[data-matrx-table-column-id]"
|
|
@@ -49519,7 +49587,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49519
49587
|
}
|
|
49520
49588
|
return normalizeColumnWidthsForColumns(measured, columns);
|
|
49521
49589
|
}, [columns]);
|
|
49522
|
-
const measureFixedTableGeometry = (0,
|
|
49590
|
+
const measureFixedTableGeometry = (0, import_react22.useCallback)(() => {
|
|
49523
49591
|
const table = tableRef.current;
|
|
49524
49592
|
const headers = table ? Array.from(table.querySelectorAll("thead th")) : [];
|
|
49525
49593
|
const widthFor = (selector) => {
|
|
@@ -49554,16 +49622,16 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49554
49622
|
...actionsWidth === void 0 ? {} : { actionsWidth }
|
|
49555
49623
|
};
|
|
49556
49624
|
}, [resolvedDensity]);
|
|
49557
|
-
const captureResizeGestureSnapshot = (0,
|
|
49625
|
+
const captureResizeGestureSnapshot = (0, import_react22.useCallback)(() => {
|
|
49558
49626
|
resizeGestureSnapshotRef.current = {
|
|
49559
49627
|
widths: measureVisibleColumnWidths(),
|
|
49560
49628
|
geometry: measureFixedTableGeometry()
|
|
49561
49629
|
};
|
|
49562
49630
|
}, [measureFixedTableGeometry, measureVisibleColumnWidths]);
|
|
49563
|
-
const clearResizeGestureSnapshot = (0,
|
|
49631
|
+
const clearResizeGestureSnapshot = (0, import_react22.useCallback)(() => {
|
|
49564
49632
|
resizeGestureSnapshotRef.current = null;
|
|
49565
49633
|
}, []);
|
|
49566
|
-
const commitColumnWidths = (0,
|
|
49634
|
+
const commitColumnWidths = (0, import_react22.useCallback)((next, captureInitialWidths = false) => {
|
|
49567
49635
|
const gestureSnapshot = captureInitialWidths ? resizeGestureSnapshotRef.current : null;
|
|
49568
49636
|
resizeGestureSnapshotRef.current = null;
|
|
49569
49637
|
const normalized = normalizeColumnWidthsForColumns(
|
|
@@ -49582,7 +49650,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49582
49650
|
}
|
|
49583
49651
|
setColumnWidths(normalized);
|
|
49584
49652
|
}, [columnIds, columnState, columns, measureFixedTableGeometry, measureVisibleColumnWidths]);
|
|
49585
|
-
(0,
|
|
49653
|
+
(0, import_react22.useEffect)(() => {
|
|
49586
49654
|
const ids = columns.map(columnId);
|
|
49587
49655
|
if (columnState) return;
|
|
49588
49656
|
const previousIds = knownColumnIds.current;
|
|
@@ -49601,31 +49669,31 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49601
49669
|
setColumnWidths((current) => normalizeColumnWidthsForColumns(current, columns));
|
|
49602
49670
|
knownColumnIds.current = new Set(ids);
|
|
49603
49671
|
}, [columns, columnState]);
|
|
49604
|
-
(0,
|
|
49672
|
+
(0, import_react22.useLayoutEffect)(() => {
|
|
49605
49673
|
for (const id of columnIds) {
|
|
49606
49674
|
tableRef.current?.style.removeProperty(columnResizeCssVar(id));
|
|
49607
49675
|
}
|
|
49608
49676
|
});
|
|
49609
|
-
const previewColumnOrder = (0,
|
|
49677
|
+
const previewColumnOrder = (0, import_react22.useMemo)(
|
|
49610
49678
|
() => projectColumnDragOrder(effectiveColumnOrder, columnDragPreview),
|
|
49611
49679
|
[columnDragPreview, effectiveColumnOrder]
|
|
49612
49680
|
);
|
|
49613
49681
|
useColumnReorderAnimation(tableRef, previewColumnOrder.join("\0"), columnDragPreview !== null);
|
|
49614
|
-
const visibleColumns = (0,
|
|
49682
|
+
const visibleColumns = (0, import_react22.useMemo)(() => {
|
|
49615
49683
|
const byId = new Map(columns.map((column) => [columnId(column), column]));
|
|
49616
49684
|
return previewColumnOrder.map((id) => byId.get(id)).filter(
|
|
49617
49685
|
(column) => column !== void 0 && !effectiveHiddenColumnIds.has(columnId(column))
|
|
49618
49686
|
);
|
|
49619
49687
|
}, [columns, effectiveHiddenColumnIds, previewColumnOrder]);
|
|
49620
49688
|
const usesMeasuredFixedLayout = visibleColumns.length > 0 && visibleColumns.every((column) => effectiveColumnWidths[columnId(column)] !== void 0);
|
|
49621
|
-
(0,
|
|
49689
|
+
(0, import_react22.useLayoutEffect)(() => {
|
|
49622
49690
|
if (!usesMeasuredFixedLayout) {
|
|
49623
49691
|
if (fixedTableGeometry !== null) setFixedTableGeometry(null);
|
|
49624
49692
|
return;
|
|
49625
49693
|
}
|
|
49626
49694
|
if (fixedTableGeometry === null) setFixedTableGeometry(measureFixedTableGeometry());
|
|
49627
49695
|
}, [fixedTableGeometry, measureFixedTableGeometry, usesMeasuredFixedLayout]);
|
|
49628
|
-
(0,
|
|
49696
|
+
(0, import_react22.useLayoutEffect)(() => {
|
|
49629
49697
|
if (!usesMeasuredFixedLayout) return;
|
|
49630
49698
|
const table = tableRef.current;
|
|
49631
49699
|
if (!table) return;
|
|
@@ -49649,8 +49717,8 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49649
49717
|
const fixedLayoutActive = usesMeasuredFixedLayout && fixedTableGeometry !== null;
|
|
49650
49718
|
const freezeWanted = visibleColumns.some((column) => column.frozen);
|
|
49651
49719
|
const selectionColumnWidth = fixedTableGeometry?.selectionWidth ?? (selection && (freezeWanted || fitToWidth) ? SELECTION_COLUMN_PX : void 0);
|
|
49652
|
-
const [fitSpace, setFitSpace] = (0,
|
|
49653
|
-
(0,
|
|
49720
|
+
const [fitSpace, setFitSpace] = (0, import_react22.useState)(null);
|
|
49721
|
+
(0, import_react22.useLayoutEffect)(() => {
|
|
49654
49722
|
if (!fitToWidth) {
|
|
49655
49723
|
setFitSpace(null);
|
|
49656
49724
|
return;
|
|
@@ -49665,19 +49733,28 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49665
49733
|
...strips.map((strip) => Math.ceil(strip.scrollWidth) + 16),
|
|
49666
49734
|
actionsHeader ? Math.ceil(actionsHeader.scrollWidth) : 0
|
|
49667
49735
|
);
|
|
49668
|
-
const
|
|
49669
|
-
|
|
49736
|
+
const table2 = el.querySelector(":scope > table");
|
|
49737
|
+
const spill = table2 && table2.hasAttribute("data-matrx-table-fit") ? Math.max(0, el.scrollWidth - el.clientWidth) : 0;
|
|
49738
|
+
setFitSpace((now) => {
|
|
49739
|
+
const sameWidth = now !== null && now.width === el.clientWidth;
|
|
49740
|
+
const slack = sameWidth ? now.slack + spill : spill;
|
|
49741
|
+
const next = { width: el.clientWidth, actions, slack };
|
|
49742
|
+
return now && now.width === next.width && now.actions === next.actions && now.slack === next.slack ? now : next;
|
|
49743
|
+
});
|
|
49670
49744
|
};
|
|
49671
49745
|
read2();
|
|
49672
49746
|
if (typeof ResizeObserver === "undefined") return;
|
|
49673
49747
|
const observer = new ResizeObserver(read2);
|
|
49674
49748
|
observer.observe(el);
|
|
49749
|
+
const table = el.querySelector(":scope > table");
|
|
49750
|
+
if (table) observer.observe(table);
|
|
49675
49751
|
return () => observer.disconnect();
|
|
49676
49752
|
}, [fitToWidth, data.length]);
|
|
49677
|
-
const fittedWidths = (0,
|
|
49753
|
+
const fittedWidths = (0, import_react22.useMemo)(() => {
|
|
49678
49754
|
if (!fitToWidth || !fitSpace) return null;
|
|
49679
|
-
const
|
|
49680
|
-
const
|
|
49755
|
+
const keepsItsWidth = (col) => resolveColumnMarker(col) !== void 0 || col.resizable === false && pixelWidth(col.width) !== void 0;
|
|
49756
|
+
const scaling = visibleColumns.filter((col) => !keepsItsWidth(col));
|
|
49757
|
+
const fixed = visibleColumns.filter(keepsItsWidth).reduce((sum, col) => sum + (pixelWidth(col.width) ?? 40), 0);
|
|
49681
49758
|
const utilities = (selection ? selectionColumnWidth ?? SELECTION_COLUMN_PX : 0) + fitSpace.actions;
|
|
49682
49759
|
return fitColumnWidths(
|
|
49683
49760
|
scaling.map(columnId),
|
|
@@ -49685,12 +49762,12 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49685
49762
|
const col = scaling.find((c) => columnId(c) === id);
|
|
49686
49763
|
return effectiveColumnWidths[id] ?? pixelWidth(col?.width) ?? FIT_DEFAULT_COLUMN_PX;
|
|
49687
49764
|
},
|
|
49688
|
-
fitSpace.width - utilities - fixed
|
|
49765
|
+
fitSpace.width - utilities - fixed - fitSpace.slack
|
|
49689
49766
|
);
|
|
49690
49767
|
}, [fitToWidth, fitSpace, visibleColumns, selection, selectionColumnWidth, effectiveColumnWidths]);
|
|
49691
49768
|
const fitActive = fittedWidths !== null;
|
|
49692
49769
|
const actionsColumnWidth = fitActive && fitSpace ? fitSpace.actions : fixedTableGeometry?.actionsWidth;
|
|
49693
|
-
const frozenColumns = (0,
|
|
49770
|
+
const frozenColumns = (0, import_react22.useMemo)(() => {
|
|
49694
49771
|
if (!freezeWanted) return NO_FROZEN_COLUMNS;
|
|
49695
49772
|
const ids = visibleColumns.map(columnId);
|
|
49696
49773
|
const byId = new Map(visibleColumns.map((column) => [columnId(column), column]));
|
|
@@ -49738,15 +49815,15 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49738
49815
|
const color = cellTintColor(row, id, colId);
|
|
49739
49816
|
return color ? CELL_TINT_CLASS[color] : void 0;
|
|
49740
49817
|
};
|
|
49741
|
-
const declaredVisibleCopyColumns = (0,
|
|
49818
|
+
const declaredVisibleCopyColumns = (0, import_react22.useMemo)(
|
|
49742
49819
|
() => visibleColumns.filter((column) => column.accessorFn !== void 0 || column.accessorKey !== void 0),
|
|
49743
49820
|
[visibleColumns]
|
|
49744
49821
|
);
|
|
49745
|
-
const tableCopySourceNamespace = (0,
|
|
49746
|
-
const tableContextMenuInstanceId = (0,
|
|
49747
|
-
const tableDndContextId = (0,
|
|
49822
|
+
const tableCopySourceNamespace = (0, import_react22.useId)();
|
|
49823
|
+
const tableContextMenuInstanceId = (0, import_react22.useId)();
|
|
49824
|
+
const tableDndContextId = (0, import_react22.useId)();
|
|
49748
49825
|
const defaultCopyTitle = toolbar?.title || "Table";
|
|
49749
|
-
const defaultCopy = (0,
|
|
49826
|
+
const defaultCopy = (0, import_react22.useMemo)(() => ({
|
|
49750
49827
|
label: defaultCopyTitle,
|
|
49751
49828
|
listLabel: defaultCopyTitle,
|
|
49752
49829
|
location: defaultCopyTitle,
|
|
@@ -49763,14 +49840,14 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49763
49840
|
const effectiveCopy = copy === false ? void 0 : copy ?? defaultCopy;
|
|
49764
49841
|
const effectiveCopyColumns = copy === void 0 ? declaredVisibleCopyColumns : visibleColumns;
|
|
49765
49842
|
const copySubsetVariant2 = useCopySubsetVariant();
|
|
49766
|
-
const chromeLatest = (0,
|
|
49843
|
+
const chromeLatest = (0, import_react22.useRef)({
|
|
49767
49844
|
processed: [],
|
|
49768
49845
|
data: [],
|
|
49769
49846
|
toggleAllOnPage: () => void 0,
|
|
49770
49847
|
showMore: async () => void 0,
|
|
49771
49848
|
applySavedView: () => void 0
|
|
49772
49849
|
});
|
|
49773
|
-
const applyLatestSavedView = (0,
|
|
49850
|
+
const applyLatestSavedView = (0, import_react22.useCallback)((snapshot) => chromeLatest.current.applySavedView(snapshot), []);
|
|
49774
49851
|
const copySubsetColumns = () => effectiveCopyColumns.filter((c) => c.filter !== false || c.accessorKey || c.accessorFn).map((c) => ({
|
|
49775
49852
|
id: columnId(c),
|
|
49776
49853
|
header: typeof c.header === "string" ? c.header : columnId(c),
|
|
@@ -49791,7 +49868,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49791
49868
|
serializer: (shaped) => buildViewAgentInput(effectiveCopy, shaped, chromeLatest.current.data, { scope: "custom" })
|
|
49792
49869
|
}), copySubsetSize(rows().length, copySubsetColumns().length))
|
|
49793
49870
|
] : [];
|
|
49794
|
-
const filterMeta = (0,
|
|
49871
|
+
const filterMeta = (0, import_react22.useMemo)(() => {
|
|
49795
49872
|
const meta = /* @__PURE__ */ new Map();
|
|
49796
49873
|
for (const col of visibleColumns) {
|
|
49797
49874
|
const id = columnId(col);
|
|
@@ -49799,15 +49876,15 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49799
49876
|
}
|
|
49800
49877
|
return meta;
|
|
49801
49878
|
}, [visibleColumns, data, remoteQuery]);
|
|
49802
|
-
const intelligentSearchScopes = (0,
|
|
49879
|
+
const intelligentSearchScopes = (0, import_react22.useMemo)(
|
|
49803
49880
|
() => resolveTableSearchScopes(data, columns, {
|
|
49804
49881
|
...toolbar?.intelligentSearch?.roles === void 0 ? {} : { roles: toolbar.intelligentSearch.roles },
|
|
49805
49882
|
...toolbar?.intelligentSearch?.scopes === void 0 ? {} : { scopes: toolbar.intelligentSearch.scopes }
|
|
49806
49883
|
}),
|
|
49807
49884
|
[columns, data, toolbar?.intelligentSearch?.roles, toolbar?.intelligentSearch?.scopes]
|
|
49808
49885
|
);
|
|
49809
|
-
const processed = (0,
|
|
49810
|
-
if (remoteQuery && !appendUsesLocalProcessing && !
|
|
49886
|
+
const processed = (0, import_react22.useMemo)(() => {
|
|
49887
|
+
if (remoteQuery && !appendUsesLocalProcessing && !remoteQueryUsesLocalProcessing) return data;
|
|
49811
49888
|
if (processLocalRows) {
|
|
49812
49889
|
return processLocalRows(data, {
|
|
49813
49890
|
page,
|
|
@@ -49863,15 +49940,15 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49863
49940
|
pageSize,
|
|
49864
49941
|
remoteQuery,
|
|
49865
49942
|
appendUsesLocalProcessing,
|
|
49866
|
-
|
|
49943
|
+
remoteQueryUsesLocalProcessing,
|
|
49867
49944
|
sourceOwnsColumnFilters,
|
|
49868
49945
|
sourceOwnsSort,
|
|
49869
49946
|
sourceOwnsSearch,
|
|
49870
49947
|
intelligentSearchEnabled,
|
|
49871
49948
|
searchScope
|
|
49872
49949
|
]);
|
|
49873
|
-
const lastNotifiedViewRows = (0,
|
|
49874
|
-
(0,
|
|
49950
|
+
const lastNotifiedViewRows = (0, import_react22.useRef)(null);
|
|
49951
|
+
(0, import_react22.useEffect)(() => {
|
|
49875
49952
|
if (!onViewChange) {
|
|
49876
49953
|
lastNotifiedViewRows.current = null;
|
|
49877
49954
|
return;
|
|
@@ -49880,7 +49957,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49880
49957
|
lastNotifiedViewRows.current = processed;
|
|
49881
49958
|
if (changed) onViewChange(processed);
|
|
49882
49959
|
}, [processed, onViewChange]);
|
|
49883
|
-
(0,
|
|
49960
|
+
(0, import_react22.useEffect)(() => {
|
|
49884
49961
|
if (controlledQuery) return;
|
|
49885
49962
|
setInternalPage(1);
|
|
49886
49963
|
}, [
|
|
@@ -49924,7 +50001,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49924
50001
|
numberedPageHasMore: !hidePagination && !isLoading && !isFetching && processed.length > 0 && safePage < pageCount && (remoteQuery?.mode === "controlled" || !remoteQuery),
|
|
49925
50002
|
onPageAdvance: setPage
|
|
49926
50003
|
});
|
|
49927
|
-
const paginated = (0,
|
|
50004
|
+
const paginated = (0, import_react22.useMemo)(() => {
|
|
49928
50005
|
if (remoteQuery) return processed;
|
|
49929
50006
|
if (hidePagination) return processed;
|
|
49930
50007
|
if (localProgressiveEnabled) return [...progressiveRows.rows];
|
|
@@ -49933,16 +50010,16 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49933
50010
|
return processed.slice(start, start + effectivePageSize);
|
|
49934
50011
|
}, [processed, safePage, effectivePageSize, pageSize, remoteQuery, hidePagination, localProgressiveEnabled, progressiveRows.rows]);
|
|
49935
50012
|
const groupingColumnId = grouping?.columnId ?? null;
|
|
49936
|
-
const [uncontrolledCollapsed, setUncontrolledCollapsed] = (0,
|
|
50013
|
+
const [uncontrolledCollapsed, setUncontrolledCollapsed] = (0, import_react22.useState)([]);
|
|
49937
50014
|
const collapsedGroups = grouping?.collapsed ?? uncontrolledCollapsed;
|
|
49938
|
-
const setCollapsedGroups = (0,
|
|
50015
|
+
const setCollapsedGroups = (0, import_react22.useCallback)(
|
|
49939
50016
|
(next) => {
|
|
49940
50017
|
if (grouping?.onCollapsedChange) grouping.onCollapsedChange(next);
|
|
49941
50018
|
else setUncontrolledCollapsed(next);
|
|
49942
50019
|
},
|
|
49943
50020
|
[grouping]
|
|
49944
50021
|
);
|
|
49945
|
-
const groups = (0,
|
|
50022
|
+
const groups = (0, import_react22.useMemo)(() => {
|
|
49946
50023
|
if (!grouping || !groupingColumnId) return null;
|
|
49947
50024
|
const groupColumn = columns.find((col) => columnId(col) === groupingColumnId);
|
|
49948
50025
|
if (!groupColumn) return null;
|
|
@@ -49961,7 +50038,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49961
50038
|
...grouping.emptyLabel ? { emptyLabel: grouping.emptyLabel } : {}
|
|
49962
50039
|
});
|
|
49963
50040
|
}, [grouping, groupingColumnId, columns, paginated]);
|
|
49964
|
-
const groupableColumns = (0,
|
|
50041
|
+
const groupableColumns = (0, import_react22.useMemo)(() => {
|
|
49965
50042
|
const allowed = grouping?.groupableColumnIds;
|
|
49966
50043
|
return visibleColumns.filter((col) => {
|
|
49967
50044
|
const id = columnId(col);
|
|
@@ -49969,7 +50046,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49969
50046
|
return col.accessorKey !== void 0 || col.accessorFn !== void 0;
|
|
49970
50047
|
});
|
|
49971
50048
|
}, [visibleColumns, grouping?.groupableColumnIds]);
|
|
49972
|
-
const groupedRenderRows = (0,
|
|
50049
|
+
const groupedRenderRows = (0, import_react22.useMemo)(
|
|
49973
50050
|
() => groups ? flattenGroups(groups, collapsedGroups) : null,
|
|
49974
50051
|
[groups, collapsedGroups]
|
|
49975
50052
|
);
|
|
@@ -49981,7 +50058,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49981
50058
|
const bodyEntryCount = groupedRenderRows ? groupedRenderRows.length : paginated.length;
|
|
49982
50059
|
const virtualizeActive = virtualizeConfig !== null && virtualizeConfig.enabled !== false && bodyEntryCount > virtualThreshold && !hierarchy && expandedDetail === void 0;
|
|
49983
50060
|
const columnWindowWidth = virtualizeConfig?.columnWidth ?? 160;
|
|
49984
|
-
const frozenRunLength = (0,
|
|
50061
|
+
const frozenRunLength = (0, import_react22.useMemo)(() => {
|
|
49985
50062
|
let run = 0;
|
|
49986
50063
|
for (const col of visibleColumns) {
|
|
49987
50064
|
if (frozenColumns.offsets[columnId(col)] === void 0) break;
|
|
@@ -49990,9 +50067,9 @@ function MatrxDataTableCore(coreProps) {
|
|
|
49990
50067
|
return run;
|
|
49991
50068
|
}, [visibleColumns, frozenColumns]);
|
|
49992
50069
|
const columnVirtualizeActive = virtualizeConfig !== null && virtualizeConfig.enabled !== false && virtualizeConfig.columns === true && visibleColumns.length - frozenRunLength > 30 && !hierarchy && mobileCards === void 0;
|
|
49993
|
-
const [rowWindow, setRowWindow] = (0,
|
|
49994
|
-
const [columnWindow, setColumnWindow] = (0,
|
|
49995
|
-
const windowInputs = (0,
|
|
50070
|
+
const [rowWindow, setRowWindow] = (0, import_react22.useState)(null);
|
|
50071
|
+
const [columnWindow, setColumnWindow] = (0, import_react22.useState)(null);
|
|
50072
|
+
const windowInputs = (0, import_react22.useRef)({
|
|
49996
50073
|
virtualizeActive: false,
|
|
49997
50074
|
bodyEntryCount: 0,
|
|
49998
50075
|
virtualRowHeight: 40,
|
|
@@ -50012,7 +50089,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50012
50089
|
columnWindowWidth,
|
|
50013
50090
|
frozenRunLength
|
|
50014
50091
|
};
|
|
50015
|
-
const recomputeWindows = (0,
|
|
50092
|
+
const recomputeWindows = (0, import_react22.useCallback)(() => {
|
|
50016
50093
|
const el = scrollRef.current;
|
|
50017
50094
|
const input = windowInputs.current;
|
|
50018
50095
|
const nextRow = input.virtualizeActive ? computeWindow({
|
|
@@ -50033,7 +50110,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50033
50110
|
setRowWindow((prev) => sameWindow(prev, nextRow) ? prev : nextRow);
|
|
50034
50111
|
setColumnWindow((prev) => sameWindow(prev, nextColumn) ? prev : nextColumn);
|
|
50035
50112
|
}, []);
|
|
50036
|
-
const effectiveRowWindow = (0,
|
|
50113
|
+
const effectiveRowWindow = (0, import_react22.useMemo)(() => {
|
|
50037
50114
|
if (!virtualizeActive) return null;
|
|
50038
50115
|
if (rowWindow && rowWindow.end <= bodyEntryCount) return rowWindow;
|
|
50039
50116
|
return computeWindow({
|
|
@@ -50044,7 +50121,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50044
50121
|
overscan: virtualizeConfig?.overscan ?? 8
|
|
50045
50122
|
});
|
|
50046
50123
|
}, [virtualizeActive, rowWindow, bodyEntryCount, virtualRowHeight, virtualizeConfig?.overscan]);
|
|
50047
|
-
const effectiveColumnWindow = (0,
|
|
50124
|
+
const effectiveColumnWindow = (0, import_react22.useMemo)(() => {
|
|
50048
50125
|
if (!columnVirtualizeActive) return null;
|
|
50049
50126
|
if (columnWindow && columnWindow.end <= visibleColumns.length) return columnWindow;
|
|
50050
50127
|
return computeWindow({
|
|
@@ -50064,7 +50141,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50064
50141
|
frozenRunLength
|
|
50065
50142
|
]);
|
|
50066
50143
|
const metricsWanted = virtualizeActive || columnVirtualizeActive;
|
|
50067
|
-
(0,
|
|
50144
|
+
(0, import_react22.useEffect)(() => {
|
|
50068
50145
|
recomputeWindows();
|
|
50069
50146
|
}, [
|
|
50070
50147
|
recomputeWindows,
|
|
@@ -50076,7 +50153,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50076
50153
|
columnWindowWidth,
|
|
50077
50154
|
frozenRunLength
|
|
50078
50155
|
]);
|
|
50079
|
-
(0,
|
|
50156
|
+
(0, import_react22.useEffect)(() => {
|
|
50080
50157
|
if (!metricsWanted) return;
|
|
50081
50158
|
const el = scrollRef.current;
|
|
50082
50159
|
if (!el) return;
|
|
@@ -50097,7 +50174,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50097
50174
|
observer?.disconnect();
|
|
50098
50175
|
};
|
|
50099
50176
|
}, [metricsWanted, recomputeWindows]);
|
|
50100
|
-
const renderedColumns = (0,
|
|
50177
|
+
const renderedColumns = (0, import_react22.useMemo)(
|
|
50101
50178
|
() => effectiveColumnWindow ? [
|
|
50102
50179
|
...visibleColumns.slice(0, frozenRunLength),
|
|
50103
50180
|
...visibleColumns.slice(effectiveColumnWindow.start, effectiveColumnWindow.end)
|
|
@@ -50105,7 +50182,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50105
50182
|
[effectiveColumnWindow, visibleColumns, frozenRunLength]
|
|
50106
50183
|
);
|
|
50107
50184
|
const columnSpacers = effectiveColumnWindow ? { start: effectiveColumnWindow.padStart, end: effectiveColumnWindow.padEnd } : null;
|
|
50108
|
-
const windowedWidthFor = (0,
|
|
50185
|
+
const windowedWidthFor = (0, import_react22.useCallback)(
|
|
50109
50186
|
(id, declared) => {
|
|
50110
50187
|
const fitted = fittedWidths?.[id];
|
|
50111
50188
|
if (fitted !== void 0) return fitted;
|
|
@@ -50117,7 +50194,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50117
50194
|
[effectiveColumnWindow, effectiveColumnWidths, frozenColumns, columnWindowWidth, fittedWidths]
|
|
50118
50195
|
);
|
|
50119
50196
|
const coverageUnanswered = readView.failure || read?.status === "loading" && data.length === 0;
|
|
50120
|
-
const coverageResult = (0,
|
|
50197
|
+
const coverageResult = (0, import_react22.useMemo)(() => {
|
|
50121
50198
|
if (!coverage || coverageUnanswered) return null;
|
|
50122
50199
|
return describeCoverage({
|
|
50123
50200
|
loaded: coverage.loaded ?? data.length,
|
|
@@ -50128,7 +50205,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50128
50205
|
...coverage.noun === void 0 ? {} : { noun: coverage.noun }
|
|
50129
50206
|
});
|
|
50130
50207
|
}, [coverage, coverageUnanswered, data.length]);
|
|
50131
|
-
const bodyEntries = (0,
|
|
50208
|
+
const bodyEntries = (0, import_react22.useMemo)(() => {
|
|
50132
50209
|
const from = effectiveRowWindow ? effectiveRowWindow.start : 0;
|
|
50133
50210
|
const to = effectiveRowWindow ? effectiveRowWindow.end : void 0;
|
|
50134
50211
|
const windowed = groupedRenderRows ? groupedRenderRows.slice(from, to).map(
|
|
@@ -50145,28 +50222,28 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50145
50222
|
windowed.push({ kind: "spacer", height: effectiveRowWindow.padEnd, place: "end" });
|
|
50146
50223
|
return windowed;
|
|
50147
50224
|
}, [groupedRenderRows, collapsedGroups, paginated, effectiveRowWindow]);
|
|
50148
|
-
const getRowIdRef = (0,
|
|
50225
|
+
const getRowIdRef = (0, import_react22.useRef)(getRowId);
|
|
50149
50226
|
getRowIdRef.current = getRowId;
|
|
50150
|
-
const spreadsheetRowIds = (0,
|
|
50227
|
+
const spreadsheetRowIds = (0, import_react22.useMemo)(
|
|
50151
50228
|
() => paginated.map((row) => getRowIdRef.current(row)),
|
|
50152
50229
|
[paginated]
|
|
50153
50230
|
);
|
|
50154
|
-
const spreadsheetColumnIds = (0,
|
|
50231
|
+
const spreadsheetColumnIds = (0, import_react22.useMemo)(
|
|
50155
50232
|
() => visibleColumns.map((col) => columnId(col)),
|
|
50156
50233
|
[visibleColumns]
|
|
50157
50234
|
);
|
|
50158
|
-
const spreadsheetRowById = (0,
|
|
50235
|
+
const spreadsheetRowById = (0, import_react22.useMemo)(() => {
|
|
50159
50236
|
const map = /* @__PURE__ */ new Map();
|
|
50160
50237
|
for (const row of paginated) map.set(getRowIdRef.current(row), row);
|
|
50161
50238
|
return map;
|
|
50162
50239
|
}, [paginated]);
|
|
50163
|
-
const spreadsheetColumnById = (0,
|
|
50240
|
+
const spreadsheetColumnById = (0, import_react22.useMemo)(() => {
|
|
50164
50241
|
const map = /* @__PURE__ */ new Map();
|
|
50165
50242
|
for (const col of visibleColumns) map.set(columnId(col), col);
|
|
50166
50243
|
return map;
|
|
50167
50244
|
}, [visibleColumns]);
|
|
50168
50245
|
const spreadsheetEnabled = Boolean(spreadsheet && spreadsheet.enabled !== false);
|
|
50169
|
-
const openRowRef = (0,
|
|
50246
|
+
const openRowRef = (0, import_react22.useRef)(() => void 0);
|
|
50170
50247
|
const sheet = useSpreadsheetGrid(
|
|
50171
50248
|
spreadsheetEnabled && spreadsheet ? {
|
|
50172
50249
|
rowIds: spreadsheetRowIds,
|
|
@@ -50208,12 +50285,12 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50208
50285
|
} : null
|
|
50209
50286
|
);
|
|
50210
50287
|
if (spreadsheet?.controllerRef) spreadsheet.controllerRef.current = spreadsheetEnabled ? sheet.controller : null;
|
|
50211
|
-
const sheetRef = (0,
|
|
50288
|
+
const sheetRef = (0, import_react22.useRef)(sheet);
|
|
50212
50289
|
sheetRef.current = sheet;
|
|
50213
|
-
const onSheetSelectionRef = (0,
|
|
50290
|
+
const onSheetSelectionRef = (0, import_react22.useRef)(spreadsheet?.onSelectionChange);
|
|
50214
50291
|
onSheetSelectionRef.current = spreadsheet?.onSelectionChange;
|
|
50215
50292
|
const sheetSelectionKey = sheet.range ? `${sheet.range.anchor.rowId}\0${sheet.range.anchor.fieldName}\0${sheet.range.focus.rowId}\0${sheet.range.focus.fieldName}\0${sheet.bounds ? `${sheet.bounds.r0}:${sheet.bounds.r1}:${sheet.bounds.c0}:${sheet.bounds.c1}` : ""}` : "";
|
|
50216
|
-
(0,
|
|
50293
|
+
(0, import_react22.useEffect)(() => {
|
|
50217
50294
|
const tell = onSheetSelectionRef.current;
|
|
50218
50295
|
if (!tell) return;
|
|
50219
50296
|
const current = sheetRef.current;
|
|
@@ -50230,11 +50307,12 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50230
50307
|
tsv: current.selectionTsv()
|
|
50231
50308
|
});
|
|
50232
50309
|
}, [sheetSelectionKey]);
|
|
50233
|
-
const searchValueRef = (0,
|
|
50310
|
+
const searchValueRef = (0, import_react22.useRef)(searchValue);
|
|
50234
50311
|
searchValueRef.current = searchValue;
|
|
50235
50312
|
const facetsEnabled = Boolean(facets && facets.enabled !== false);
|
|
50236
|
-
const
|
|
50237
|
-
const
|
|
50313
|
+
const coreSuggestionsEnabled = facets?.enabled !== false;
|
|
50314
|
+
const [facetState, setFacetState] = (0, import_react22.useState)({});
|
|
50315
|
+
const facetReadCell = (0, import_react22.useCallback)(
|
|
50238
50316
|
(row, colId) => {
|
|
50239
50317
|
if (facets?.readCell) return facets.readCell(row, colId);
|
|
50240
50318
|
const col = visibleColumns.find((candidate) => columnId(candidate) === colId);
|
|
@@ -50242,12 +50320,37 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50242
50320
|
},
|
|
50243
50321
|
[facets, visibleColumns]
|
|
50244
50322
|
);
|
|
50245
|
-
const
|
|
50246
|
-
|
|
50247
|
-
const
|
|
50248
|
-
|
|
50249
|
-
|
|
50250
|
-
|
|
50323
|
+
const coreFacetTotal = remoteQuery?.mode === "controlled" ? remoteQuery.totalItems : appendQuery?.pagination.sourceRecords?.total ?? coverage?.matched ?? coverage?.total;
|
|
50324
|
+
const coreFacetLoaded = appendQuery?.pagination.sourceRecords?.loaded;
|
|
50325
|
+
const facetInputsRef = (0, import_react22.useRef)({ data, facets, facetReadCell, coreFacetTotal, coreFacetLoaded });
|
|
50326
|
+
facetInputsRef.current = { data, facets, facetReadCell, coreFacetTotal, coreFacetLoaded };
|
|
50327
|
+
const facetRequestRef = (0, import_react22.useRef)(/* @__PURE__ */ new Map());
|
|
50328
|
+
const requestFacets = (0, import_react22.useCallback)((colId) => {
|
|
50329
|
+
const { data: rows, facets: config, facetReadCell: readCell, coreFacetTotal: total, coreFacetLoaded: loaded } = facetInputsRef.current;
|
|
50330
|
+
if (!config || config.enabled === false) {
|
|
50331
|
+
const complete2 = localFacetsAreComplete(loaded ?? rows.length, total ?? rows.length);
|
|
50332
|
+
const hasArrayValue = rows.some((row) => {
|
|
50333
|
+
try {
|
|
50334
|
+
return Array.isArray(readCell(row, colId));
|
|
50335
|
+
} catch {
|
|
50336
|
+
return false;
|
|
50337
|
+
}
|
|
50338
|
+
});
|
|
50339
|
+
const suggestions = computeColumnFacets({
|
|
50340
|
+
columnId: colId,
|
|
50341
|
+
rows,
|
|
50342
|
+
readValue: readCell,
|
|
50343
|
+
complete: complete2
|
|
50344
|
+
});
|
|
50345
|
+
setFacetState((current) => ({
|
|
50346
|
+
...current,
|
|
50347
|
+
[colId]: {
|
|
50348
|
+
loading: false,
|
|
50349
|
+
data: !hasArrayValue && suggestions.distinctCount + (suggestions.blank > 0 ? 1 : 0) < CORE_SUGGESTION_DISTINCT_EXCLUSIVE_LIMIT ? suggestions : null
|
|
50350
|
+
}
|
|
50351
|
+
}));
|
|
50352
|
+
return;
|
|
50353
|
+
}
|
|
50251
50354
|
const complete = localFacetsAreComplete(rows.length, config.totalRows);
|
|
50252
50355
|
const limit = config.limit;
|
|
50253
50356
|
if (complete || !config.source) {
|
|
@@ -50304,20 +50407,20 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50304
50407
|
}));
|
|
50305
50408
|
});
|
|
50306
50409
|
}, []);
|
|
50307
|
-
(0,
|
|
50308
|
-
if (!facetsEnabled) return;
|
|
50410
|
+
(0, import_react22.useEffect)(() => {
|
|
50309
50411
|
setFacetState({});
|
|
50310
50412
|
facetRequestRef.current = /* @__PURE__ */ new Map();
|
|
50311
|
-
}, [facetsEnabled, data, searchValue]);
|
|
50312
|
-
|
|
50313
|
-
|
|
50413
|
+
}, [facetsEnabled, data, searchValue, coreFacetTotal, coreFacetLoaded]);
|
|
50414
|
+
const totalIsKnown = !isLoading && !readView.failure;
|
|
50415
|
+
(0, import_react22.useEffect)(() => {
|
|
50416
|
+
if (!controlledQuery || !totalIsKnown || controlledQuery.state.page === safePage) return;
|
|
50314
50417
|
emitControlledQueryChange({ page: safePage });
|
|
50315
|
-
}, [controlledQuery, emitControlledQueryChange, safePage]);
|
|
50316
|
-
const selectedRow = (0,
|
|
50418
|
+
}, [controlledQuery, emitControlledQueryChange, safePage, totalIsKnown]);
|
|
50419
|
+
const selectedRow = (0, import_react22.useMemo)(() => {
|
|
50317
50420
|
if (!selectedId) return null;
|
|
50318
50421
|
return data.find((r) => getRowId(r) === selectedId) ?? null;
|
|
50319
50422
|
}, [data, selectedId, getRowId]);
|
|
50320
|
-
const windowRow = (0,
|
|
50423
|
+
const windowRow = (0, import_react22.useMemo)(() => {
|
|
50321
50424
|
if (!windowRowId) return null;
|
|
50322
50425
|
return data.find((r) => getRowId(r) === windowRowId) ?? (windowRowSnapshot && windowRowSnapshot.queryKey === appendQueryKey && getRowId(windowRowSnapshot.row) === windowRowId ? windowRowSnapshot.row : null);
|
|
50323
50426
|
}, [data, windowRowId, windowRowSnapshot, getRowId, appendQueryKey]);
|
|
@@ -50336,39 +50439,60 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50336
50439
|
const target = toolbar.portalInto;
|
|
50337
50440
|
return target ? (0, import_react_dom3.createPortal)(node, target) : null;
|
|
50338
50441
|
};
|
|
50442
|
+
const [pinnedEl, setPinnedEl] = (0, import_react22.useState)(null);
|
|
50443
|
+
const pinnedRowActive = Boolean(
|
|
50444
|
+
toolbar?.singleRow && toolbar.overflow && toolbar.overflow.mode !== "sheet" && (toolbar.overflow.pinned || toolbar.overflow.mode === "menu")
|
|
50445
|
+
);
|
|
50446
|
+
const pinnedFolded = usePinnedFold(pinnedEl, pinnedRowActive);
|
|
50447
|
+
const toolbarEnd = { node: null };
|
|
50339
50448
|
const renderToolbarControls = (controls) => {
|
|
50449
|
+
toolbarEnd.node = null;
|
|
50340
50450
|
const overflow = toolbar?.overflow;
|
|
50341
50451
|
const mode = overflow?.mode ?? "inline";
|
|
50342
|
-
|
|
50343
|
-
|
|
50344
|
-
|
|
50345
|
-
|
|
50346
|
-
|
|
50347
|
-
|
|
50348
|
-
|
|
50349
|
-
)
|
|
50350
|
-
|
|
50351
|
-
|
|
50352
|
-
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
|
|
50452
|
+
if (mode === "sheet") {
|
|
50453
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowSheet, { ...overflow?.label ? { label: overflow.label } : {}, top: overflow?.sheetTop, children: [
|
|
50454
|
+
controls,
|
|
50455
|
+
overflow?.pinned,
|
|
50456
|
+
overflow?.sheetExtras
|
|
50457
|
+
] });
|
|
50458
|
+
}
|
|
50459
|
+
if (!pinnedRowActive) {
|
|
50460
|
+
if (mode === "menu") {
|
|
50461
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
|
|
50353
50462
|
overflow?.pinned,
|
|
50354
50463
|
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
|
|
50355
50464
|
controls,
|
|
50356
50465
|
overflow?.sheetExtras
|
|
50357
50466
|
] })
|
|
50358
|
-
] })
|
|
50359
|
-
|
|
50360
|
-
|
|
50361
|
-
if (mode === "sheet") {
|
|
50362
|
-
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowSheet, { ...overflow?.label ? { label: overflow.label } : {}, top: overflow?.sheetTop, children: [
|
|
50467
|
+
] });
|
|
50468
|
+
}
|
|
50469
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
|
|
50363
50470
|
controls,
|
|
50364
|
-
overflow?.pinned
|
|
50365
|
-
overflow?.sheetExtras
|
|
50471
|
+
overflow?.pinned
|
|
50366
50472
|
] });
|
|
50367
50473
|
}
|
|
50368
|
-
|
|
50369
|
-
|
|
50370
|
-
|
|
50371
|
-
|
|
50474
|
+
const folded = pinnedFolded;
|
|
50475
|
+
toolbarEnd.node = /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
50476
|
+
"span",
|
|
50477
|
+
{
|
|
50478
|
+
ref: setPinnedEl,
|
|
50479
|
+
"data-matrx-table-toolbar-pinned": "",
|
|
50480
|
+
...folded ? { "data-matrx-table-toolbar-pinned-folded": "" } : {},
|
|
50481
|
+
className: "sticky right-0 z-[1] -ml-1 flex shrink-0 items-center gap-1 bg-background pl-1 before:pointer-events-none before:absolute before:inset-y-0 before:-left-6 before:w-6 before:bg-gradient-to-l before:from-background before:to-transparent",
|
|
50482
|
+
children: folded ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
|
|
50483
|
+
controls,
|
|
50484
|
+
overflow?.pinned,
|
|
50485
|
+
overflow?.sheetExtras
|
|
50486
|
+
] }) : mode === "menu" ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_jsx_runtime51.Fragment, { children: [
|
|
50487
|
+
overflow?.pinned,
|
|
50488
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(ToolbarOverflowMenu, { children: [
|
|
50489
|
+
controls,
|
|
50490
|
+
overflow?.sheetExtras
|
|
50491
|
+
] })
|
|
50492
|
+
] }) : overflow?.pinned
|
|
50493
|
+
}
|
|
50494
|
+
);
|
|
50495
|
+
return folded || mode === "menu" ? null : controls;
|
|
50372
50496
|
};
|
|
50373
50497
|
const renderRowActions = (row, controls) => {
|
|
50374
50498
|
const actions = rowActions?.(row, controls);
|
|
@@ -50433,7 +50557,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50433
50557
|
...resolveSummaryValue(summary?.source?.totals?.[id], value)
|
|
50434
50558
|
}));
|
|
50435
50559
|
const hasSummaryTotals = summaryTotals.length > 0;
|
|
50436
|
-
const changeCount = (0,
|
|
50560
|
+
const changeCount = (0, import_react22.useMemo)(() => {
|
|
50437
50561
|
let n2 = 0;
|
|
50438
50562
|
for (const fields of Object.values(edits)) {
|
|
50439
50563
|
n2 += Object.keys(fields).length;
|
|
@@ -50524,7 +50648,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50524
50648
|
}
|
|
50525
50649
|
resetToolbarFacets(toolbar?.facets);
|
|
50526
50650
|
};
|
|
50527
|
-
const renderedEmptyState = (remoteQuery === null ||
|
|
50651
|
+
const renderedEmptyState = (remoteQuery === null || remoteQueryUsesLocalProcessing) && data.length > 0 && hasActiveFilters ? {
|
|
50528
50652
|
title: "No matching rows",
|
|
50529
50653
|
description: "No rows match the current search or filters.",
|
|
50530
50654
|
action: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(Button, { type: "button", variant: "outline", size: "sm", onClick: clearAllFilters, children: "Clear filters" }),
|
|
@@ -50617,7 +50741,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50617
50741
|
}));
|
|
50618
50742
|
return true;
|
|
50619
50743
|
};
|
|
50620
|
-
const requestCellEditRef = (0,
|
|
50744
|
+
const requestCellEditRef = (0, import_react22.useRef)(requestCellEdit);
|
|
50621
50745
|
requestCellEditRef.current = requestCellEdit;
|
|
50622
50746
|
const buildRecordControls = (row) => {
|
|
50623
50747
|
const rowId = getRowId(row);
|
|
@@ -50644,7 +50768,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50644
50768
|
};
|
|
50645
50769
|
const hierarchyRows = hierarchy?.rows ?? data;
|
|
50646
50770
|
const hierarchyGetParentId = hierarchy?.getParentId;
|
|
50647
|
-
const hierarchyIndex = (0,
|
|
50771
|
+
const hierarchyIndex = (0, import_react22.useMemo)(() => {
|
|
50648
50772
|
if (!hierarchyGetParentId) return null;
|
|
50649
50773
|
const byId = /* @__PURE__ */ new Map();
|
|
50650
50774
|
const parentById = /* @__PURE__ */ new Map();
|
|
@@ -50676,7 +50800,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50676
50800
|
return { byId, parentById, depthById };
|
|
50677
50801
|
}, [hierarchyGetParentId, hierarchyRows, getRowId]);
|
|
50678
50802
|
const draggedRow = draggedRowId && hierarchyIndex ? hierarchyIndex.byId.get(draggedRowId) : void 0;
|
|
50679
|
-
const hierarchyBlockedIds = (0,
|
|
50803
|
+
const hierarchyBlockedIds = (0, import_react22.useMemo)(() => {
|
|
50680
50804
|
if (!draggedRowId || !hierarchyIndex) return null;
|
|
50681
50805
|
const childrenById = /* @__PURE__ */ new Map();
|
|
50682
50806
|
for (const [id, parentId] of hierarchyIndex.parentById) {
|
|
@@ -50963,16 +51087,16 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50963
51087
|
return [];
|
|
50964
51088
|
}
|
|
50965
51089
|
};
|
|
50966
|
-
const menuSectionsForRef = (0,
|
|
51090
|
+
const menuSectionsForRef = (0, import_react22.useRef)(menuSectionsFor);
|
|
50967
51091
|
menuSectionsForRef.current = menuSectionsFor;
|
|
50968
51092
|
const hasMenuSections = Boolean(contextMenu?.sections);
|
|
50969
|
-
const boundarySections = (0,
|
|
51093
|
+
const boundarySections = (0, import_react22.useCallback)(
|
|
50970
51094
|
(target) => menuSectionsForRef.current(target),
|
|
50971
51095
|
[]
|
|
50972
51096
|
);
|
|
50973
|
-
const resolveMenuLevelRef = (0,
|
|
51097
|
+
const resolveMenuLevelRef = (0, import_react22.useRef)(resolveMenuLevel);
|
|
50974
51098
|
resolveMenuLevelRef.current = resolveMenuLevel;
|
|
50975
|
-
(0,
|
|
51099
|
+
(0, import_react22.useEffect)(() => {
|
|
50976
51100
|
if (!host.rowContextRegistry) return;
|
|
50977
51101
|
return host.rowContextRegistry.register(
|
|
50978
51102
|
tableContextMenuInstanceId,
|
|
@@ -50981,7 +51105,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50981
51105
|
}, [host.rowContextRegistry, tableContextMenuInstanceId]);
|
|
50982
51106
|
const showActionsCol = windowEnabled || Boolean(rowActions) || showInlineRowCopy;
|
|
50983
51107
|
const getSelectionId = selection?.getSelectionId ?? getRowId;
|
|
50984
|
-
const selectedIdSet = (0,
|
|
51108
|
+
const selectedIdSet = (0, import_react22.useMemo)(
|
|
50985
51109
|
() => new Set(selection?.selectedIds ?? []),
|
|
50986
51110
|
[selection?.selectedIds]
|
|
50987
51111
|
);
|
|
@@ -50993,7 +51117,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
50993
51117
|
);
|
|
50994
51118
|
const allOnPageSelected = selectableRows.length > 0 && selectedOnPage.length === selectableRows.length;
|
|
50995
51119
|
const someOnPageSelected = selectedOnPage.length > 0 && !allOnPageSelected;
|
|
50996
|
-
const selectedRows = (0,
|
|
51120
|
+
const selectedRows = (0, import_react22.useMemo)(() => {
|
|
50997
51121
|
const resolved = /* @__PURE__ */ new Set();
|
|
50998
51122
|
return data.filter((row) => {
|
|
50999
51123
|
const id = getSelectionId(row);
|
|
@@ -51002,7 +51126,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51002
51126
|
return true;
|
|
51003
51127
|
});
|
|
51004
51128
|
}, [data, getSelectionId, selectedIdSet]);
|
|
51005
|
-
const lastToggledIndex = (0,
|
|
51129
|
+
const lastToggledIndex = (0, import_react22.useRef)(null);
|
|
51006
51130
|
const setSelectedIds = (next) => selection?.onSelectedIdsChange([...next]);
|
|
51007
51131
|
const toggleRowSelected = (index, shiftKey) => {
|
|
51008
51132
|
if (!selection) return;
|
|
@@ -51043,7 +51167,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51043
51167
|
}
|
|
51044
51168
|
} : facet
|
|
51045
51169
|
) : toolbar?.facets;
|
|
51046
|
-
const rowLatest = (0,
|
|
51170
|
+
const rowLatest = (0, import_react22.useRef)(null);
|
|
51047
51171
|
const renderRecordCell = (row, col, index) => {
|
|
51048
51172
|
const id = getRowId(row);
|
|
51049
51173
|
const field = col.accessorKey ? String(col.accessorKey) : columnId(col);
|
|
@@ -51079,7 +51203,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51079
51203
|
}
|
|
51080
51204
|
return href ? /* @__PURE__ */ (0, import_jsx_runtime51.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;
|
|
51081
51205
|
};
|
|
51082
|
-
const currentViewSnapshot = (0,
|
|
51206
|
+
const currentViewSnapshot = (0, import_react22.useMemo)(
|
|
51083
51207
|
() => ({
|
|
51084
51208
|
__kind: "matrx-table-view",
|
|
51085
51209
|
version: 1,
|
|
@@ -51114,7 +51238,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51114
51238
|
sort
|
|
51115
51239
|
]
|
|
51116
51240
|
);
|
|
51117
|
-
const declaredDefaultViewSnapshot = (0,
|
|
51241
|
+
const declaredDefaultViewSnapshot = (0, import_react22.useMemo)(
|
|
51118
51242
|
() => defaultViewSnapshot ?? {
|
|
51119
51243
|
__kind: "matrx-table-view",
|
|
51120
51244
|
version: 1,
|
|
@@ -51122,7 +51246,6 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51122
51246
|
pageSize: defaultPageSize,
|
|
51123
51247
|
search: "",
|
|
51124
51248
|
anyOf: "",
|
|
51125
|
-
layeredFilters: [],
|
|
51126
51249
|
columnFilters: {},
|
|
51127
51250
|
sort: defaultSort
|
|
51128
51251
|
},
|
|
@@ -51133,7 +51256,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51133
51256
|
},
|
|
51134
51257
|
[columns, defaultPageSize, defaultSort, defaultViewSnapshot]
|
|
51135
51258
|
);
|
|
51136
|
-
const applySavedView = (0,
|
|
51259
|
+
const applySavedView = (0, import_react22.useCallback)(
|
|
51137
51260
|
(rawSnapshot) => {
|
|
51138
51261
|
const snapshot = parseTableViewSnapshot(rawSnapshot);
|
|
51139
51262
|
if (!snapshot) {
|
|
@@ -51358,6 +51481,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51358
51481
|
allRowsAreLoaded,
|
|
51359
51482
|
effectivePageSize,
|
|
51360
51483
|
safePage,
|
|
51484
|
+
isFetching,
|
|
51361
51485
|
controlledQuery,
|
|
51362
51486
|
emitControlledQueryChange,
|
|
51363
51487
|
...pageSizeOptions
|
|
@@ -51365,6 +51489,8 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51365
51489
|
const toolbarReadsRows = showToolbarCopy && copyDrawsFromRows(effectiveCopy);
|
|
51366
51490
|
const toolbarEpoch = useRenderEpoch([
|
|
51367
51491
|
hideToolbar,
|
|
51492
|
+
pinnedFolded,
|
|
51493
|
+
pinnedRowActive,
|
|
51368
51494
|
viewTabs,
|
|
51369
51495
|
toolbar,
|
|
51370
51496
|
showSearch,
|
|
@@ -51757,7 +51883,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51757
51883
|
},
|
|
51758
51884
|
`${id}:expanded-detail`
|
|
51759
51885
|
) : null;
|
|
51760
|
-
return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
51886
|
+
return hierarchy ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react22.Fragment, { children: [
|
|
51761
51887
|
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
51762
51888
|
HierarchyDroppableRow,
|
|
51763
51889
|
{
|
|
@@ -51767,7 +51893,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51767
51893
|
}
|
|
51768
51894
|
),
|
|
51769
51895
|
inlineDetail
|
|
51770
|
-
] }, id) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
51896
|
+
] }, id) : /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(import_react22.Fragment, { children: [
|
|
51771
51897
|
wrappedRow,
|
|
51772
51898
|
inlineDetail
|
|
51773
51899
|
] }, id);
|
|
@@ -51876,43 +52002,40 @@ function MatrxDataTableCore(coreProps) {
|
|
|
51876
52002
|
"data-matrx-table-density": resolvedDensity,
|
|
51877
52003
|
"data-url-state-table": urlState?.id,
|
|
51878
52004
|
className: cn(
|
|
51879
|
-
"flex h-full min-h-0 flex-col gap-2 px-0
|
|
52005
|
+
"flex h-full min-h-0 flex-col gap-2 px-0 pt-2 pb-0",
|
|
51880
52006
|
className
|
|
51881
52007
|
),
|
|
51882
52008
|
children: [
|
|
51883
52009
|
notice,
|
|
51884
52010
|
savedViewError ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { className: "shrink-0 text-xs text-destructive", message: savedViewError, operation: "Save or apply a saved view", origin: "design-system/MatrxDataTable" }) : null,
|
|
51885
52011
|
toolbarActionError ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { className: "shrink-0 text-xs text-destructive", message: toolbarActionError, operation: "Run a table toolbar action", origin: "design-system/MatrxDataTable" }) : null,
|
|
51886
|
-
summaryMetrics.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.
|
|
52012
|
+
summaryMetrics.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
51887
52013
|
"section",
|
|
51888
52014
|
{
|
|
51889
52015
|
"data-matrx-table-summary": true,
|
|
51890
52016
|
"data-matrx-table-summary-scope": summaryUsesSource ? "source" : summaryCoverage,
|
|
51891
52017
|
"aria-label": `Table summary: ${summaryCaption}`,
|
|
51892
|
-
className: "flex shrink-0 flex-
|
|
51893
|
-
children: [
|
|
51894
|
-
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("
|
|
51895
|
-
|
|
51896
|
-
|
|
51897
|
-
/* @__PURE__ */ (0, import_jsx_runtime51.
|
|
51898
|
-
|
|
51899
|
-
|
|
51900
|
-
] })
|
|
51901
|
-
] }, metric.id))
|
|
51902
|
-
]
|
|
52018
|
+
className: "flex w-full min-w-0 shrink-0 flex-nowrap items-stretch gap-2 overflow-x-auto overscroll-x-contain",
|
|
52019
|
+
children: summaryMetrics.map((metric) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "min-w-24 shrink-0 whitespace-nowrap rounded-md border border-border bg-card px-3 py-2 shadow-xs", children: [
|
|
52020
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "text-xs text-muted-foreground", children: metric.label }),
|
|
52021
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("div", { className: "mt-0.5 text-sm font-semibold tabular-nums text-foreground", children: [
|
|
52022
|
+
metric.value,
|
|
52023
|
+
metric.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${metric.label} is unavailable`, operation: "Summarize this table", origin: "design-system/MatrxDataTable" }) : null
|
|
52024
|
+
] })
|
|
52025
|
+
] }, metric.id))
|
|
51903
52026
|
}
|
|
51904
52027
|
) : null,
|
|
51905
|
-
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(MatrxTableChrome, { part: "toolbar", epoch: toolbarEpoch, render: () => placeToolbar(!hideToolbar && (
|
|
52028
|
+
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)(MatrxTableChrome, { part: "toolbar", epoch: toolbarEpoch, render: () => placeToolbar(!hideToolbar && (showViewTabs || toolbar?.title || toolbar?.titleCount || showSearch || toolbar?.customSearch || toolbar?.anyOf || toolbar?.layeredFilters || toolbar?.facets && toolbar.facets.length > 0 || toolbar?.leading || toolbar?.actions || toolbar?.refresh || toolbar?.add || savedViewsId && SavedViews || hasActiveFilters || showToolbarCopy || columns.length > 0) && /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
51906
52029
|
TableTitleRow,
|
|
51907
52030
|
{
|
|
51908
52031
|
...toolbar?.singleRow ? { singleRow: true } : {},
|
|
51909
|
-
tabs: viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions, ...viewTabsStore ? { store: viewTabsStore } : {} },
|
|
52032
|
+
tabs: viewTabs && viewTabsStore ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(TableViewWorkspace, { snapshot: currentViewSnapshot, onApply: applyLatestSavedView, related: relatedTableActions, ...viewTabsStore ? { store: viewTabsStore } : {} }, savedViewsId ?? "table") : viewTabs && savedViewsId && SavedViews ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(SavedViews, { tableId: savedViewsId, snapshot: currentViewSnapshot, defaultSnapshot: declaredDefaultViewSnapshot, onApply: applyLatestSavedView, presentation: "tabs", related: relatedTableActions }) : void 0,
|
|
51910
52033
|
...toolbar?.title === void 0 ? {} : { title: toolbar.title },
|
|
51911
52034
|
...toolbar?.titleCount === void 0 ? {} : { count: toolbar.titleCount },
|
|
51912
|
-
context:
|
|
52035
|
+
context: savedViewsId && SavedViews && !viewTabs ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { "data-matrx-table-view-control": true, children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
51913
52036
|
SavedViews,
|
|
51914
52037
|
{
|
|
51915
|
-
tableId,
|
|
52038
|
+
tableId: savedViewsId,
|
|
51916
52039
|
snapshot: currentViewSnapshot,
|
|
51917
52040
|
defaultSnapshot: declaredDefaultViewSnapshot,
|
|
51918
52041
|
onApply: applyLatestSavedView
|
|
@@ -52214,7 +52337,8 @@ function MatrxDataTableCore(coreProps) {
|
|
|
52214
52337
|
] }))
|
|
52215
52338
|
]
|
|
52216
52339
|
}
|
|
52217
|
-
)
|
|
52340
|
+
),
|
|
52341
|
+
toolbarEnd.node
|
|
52218
52342
|
]
|
|
52219
52343
|
}
|
|
52220
52344
|
)) }),
|
|
@@ -52528,7 +52652,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
52528
52652
|
{
|
|
52529
52653
|
label: col.header,
|
|
52530
52654
|
labelText: headerLabel,
|
|
52531
|
-
...facetsEnabled ? {
|
|
52655
|
+
...facetsEnabled || meta?.kind !== void 0 && meta.kind !== null && coreSuggestionsEnabled ? {
|
|
52532
52656
|
facets: facetState[id]?.data ?? null,
|
|
52533
52657
|
facetsLoading: facetState[id]?.loading ?? false,
|
|
52534
52658
|
...facetState[id]?.error === void 0 ? {} : { facetsError: facetState[id]?.error },
|
|
@@ -52653,12 +52777,12 @@ function MatrxDataTableCore(coreProps) {
|
|
|
52653
52777
|
},
|
|
52654
52778
|
"matrx-column-spacer-end"
|
|
52655
52779
|
) : null
|
|
52656
|
-
] }, `sk-${i}`)) : readFailure ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { colSpan: renderedColSpan, "data-matrx-table-message-cell": true, className: "px-0 py-12 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "sticky left-0 flex flex-col items-center gap-2 whitespace-normal px-4", style: { width: "100cqw", maxWidth: "100%" }, children: readFailure }) }) }) : paginated.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
52780
|
+
] }, `sk-${i}`)) : readFailure ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { colSpan: renderedColSpan, "data-matrx-table-message-cell": true, className: "overflow-visible! px-0 py-12 text-center", children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("div", { className: "sticky left-0 flex flex-col items-center gap-2 whitespace-normal px-4", style: { width: "100cqw", maxWidth: "100%" }, children: readFailure }) }) }) : paginated.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("tr", { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
52657
52781
|
"td",
|
|
52658
52782
|
{
|
|
52659
52783
|
colSpan: renderedColSpan,
|
|
52660
52784
|
"data-matrx-table-message-cell": true,
|
|
52661
|
-
className: "px-0 py-12 text-center",
|
|
52785
|
+
className: "overflow-visible! px-0 py-12 text-center",
|
|
52662
52786
|
children: /* @__PURE__ */ (0, import_jsx_runtime51.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: [
|
|
52663
52787
|
renderedEmptyState?.icon,
|
|
52664
52788
|
/* @__PURE__ */ (0, import_jsx_runtime51.jsx)("p", { className: "text-sm font-medium text-foreground", children: renderedEmptyState?.title ?? "No rows" }),
|
|
@@ -52748,62 +52872,61 @@ function MatrxDataTableCore(coreProps) {
|
|
|
52748
52872
|
"border-t-2 border-border bg-muted/50 font-semibold",
|
|
52749
52873
|
hasSummaryTotals && "sticky bottom-0 z-10 bg-muted/95 backdrop-blur-sm"
|
|
52750
52874
|
), children: [
|
|
52751
|
-
hasSummaryTotals ? /* @__PURE__ */ (0, import_jsx_runtime51.
|
|
52752
|
-
|
|
52753
|
-
|
|
52754
|
-
|
|
52755
|
-
|
|
52756
|
-
|
|
52757
|
-
|
|
52758
|
-
|
|
52759
|
-
|
|
52760
|
-
|
|
52761
|
-
|
|
52762
|
-
|
|
52763
|
-
|
|
52764
|
-
|
|
52765
|
-
|
|
52766
|
-
"matrx-summary-column-spacer-start"
|
|
52767
|
-
) : null,
|
|
52768
|
-
renderedColumns.map((column) => {
|
|
52769
|
-
const total = summaryTotals.find((candidate) => candidate.id === columnId(column));
|
|
52770
|
-
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
52771
|
-
"td",
|
|
52772
|
-
{
|
|
52773
|
-
className: cn(
|
|
52774
|
-
"px-2 py-2 align-middle",
|
|
52775
|
-
(column.compact || resolveColumnMarker(column) !== void 0) && "px-1",
|
|
52776
|
-
column.className,
|
|
52777
|
-
column.align === "center" && "text-center",
|
|
52778
|
-
column.align === "right" && "text-right"
|
|
52779
|
-
),
|
|
52780
|
-
style: columnWidthVar(
|
|
52781
|
-
resolveColumnMarker(column) && column.width === void 0 ? 40 : column.width,
|
|
52782
|
-
windowedWidthFor(columnId(column), column.width),
|
|
52783
|
-
columnId(column),
|
|
52784
|
-
resizableColumns && column.resizable !== false
|
|
52785
|
-
),
|
|
52786
|
-
children: [
|
|
52787
|
-
total?.value,
|
|
52788
|
-
total?.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${columnId(column)} total is unavailable`, operation: "Total this column", origin: "design-system/MatrxDataTable" }) : null
|
|
52789
|
-
]
|
|
52790
|
-
},
|
|
52791
|
-
columnId(column)
|
|
52792
|
-
);
|
|
52793
|
-
}),
|
|
52794
|
-
columnSpacers && columnSpacers.end > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
52875
|
+
hasSummaryTotals ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_jsx_runtime51.Fragment, { children: /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { "data-matrx-table-summary-totals": true, children: [
|
|
52876
|
+
selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
|
|
52877
|
+
columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
52878
|
+
"td",
|
|
52879
|
+
{
|
|
52880
|
+
"aria-hidden": "true",
|
|
52881
|
+
"data-matrx-table-column-spacer": "start",
|
|
52882
|
+
className: "border-0 p-0",
|
|
52883
|
+
style: { width: `${columnSpacers.start}px`, minWidth: `${columnSpacers.start}px` }
|
|
52884
|
+
},
|
|
52885
|
+
"matrx-summary-column-spacer-start"
|
|
52886
|
+
) : null,
|
|
52887
|
+
renderedColumns.map((column, columnIndex) => {
|
|
52888
|
+
const total = summaryTotals.find((candidate) => candidate.id === columnId(column));
|
|
52889
|
+
return /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)(
|
|
52795
52890
|
"td",
|
|
52796
52891
|
{
|
|
52797
|
-
|
|
52798
|
-
|
|
52799
|
-
|
|
52800
|
-
|
|
52892
|
+
className: cn(
|
|
52893
|
+
"px-2 py-2 align-middle font-semibold",
|
|
52894
|
+
(column.compact || resolveColumnMarker(column) !== void 0) && "px-1",
|
|
52895
|
+
column.className,
|
|
52896
|
+
column.align === "center" && "text-center",
|
|
52897
|
+
column.align === "right" && "text-right"
|
|
52898
|
+
),
|
|
52899
|
+
style: columnWidthVar(
|
|
52900
|
+
resolveColumnMarker(column) && column.width === void 0 ? 40 : column.width,
|
|
52901
|
+
windowedWidthFor(columnId(column), column.width),
|
|
52902
|
+
columnId(column),
|
|
52903
|
+
resizableColumns && column.resizable !== false
|
|
52904
|
+
),
|
|
52905
|
+
children: [
|
|
52906
|
+
columnIndex === 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("span", { "data-matrx-table-summary-total-label": true, className: "text-sm font-semibold text-foreground", children: [
|
|
52907
|
+
summaryCaption,
|
|
52908
|
+
readView.stale ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "ml-1 text-xs text-amber-700 dark:text-amber-300", children: "Retained rows may be out of date." }) : null
|
|
52909
|
+
] }) : null,
|
|
52910
|
+
columnIndex === 0 && total?.value != null ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("span", { className: "ml-2", children: total.value }) : null,
|
|
52911
|
+
columnIndex !== 0 ? total?.value : null,
|
|
52912
|
+
total?.unavailable ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(ErrorBox, { as: "span", className: "sr-only", message: `${columnId(column)} total is unavailable`, operation: "Total this column", origin: "design-system/MatrxDataTable" }) : null
|
|
52913
|
+
]
|
|
52801
52914
|
},
|
|
52802
|
-
|
|
52803
|
-
)
|
|
52804
|
-
|
|
52805
|
-
|
|
52806
|
-
|
|
52915
|
+
columnId(column)
|
|
52916
|
+
);
|
|
52917
|
+
}),
|
|
52918
|
+
columnSpacers && columnSpacers.end > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
52919
|
+
"td",
|
|
52920
|
+
{
|
|
52921
|
+
"aria-hidden": "true",
|
|
52922
|
+
"data-matrx-table-column-spacer": "end",
|
|
52923
|
+
className: "border-0 p-0",
|
|
52924
|
+
style: { width: `${columnSpacers.end}px`, minWidth: `${columnSpacers.end}px` }
|
|
52925
|
+
},
|
|
52926
|
+
"matrx-summary-column-spacer-end"
|
|
52927
|
+
) : null,
|
|
52928
|
+
showActionsCol ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", {}) : null
|
|
52929
|
+
] }) }) : null,
|
|
52807
52930
|
footerRows.map((row, index) => /* @__PURE__ */ (0, import_jsx_runtime51.jsxs)("tr", { children: [
|
|
52808
52931
|
selection ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)("td", { className: "px-2 py-2" }) : null,
|
|
52809
52932
|
columnSpacers && columnSpacers.start > 0 ? /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
|
|
@@ -53033,6 +53156,7 @@ function MatrxDataTableCore(coreProps) {
|
|
|
53033
53156
|
showAllOption: allRowsAreLoaded,
|
|
53034
53157
|
allValue: 0,
|
|
53035
53158
|
allOptionLabel: "All loaded",
|
|
53159
|
+
isFetching,
|
|
53036
53160
|
compact: true,
|
|
53037
53161
|
hideEntriesInfo: false
|
|
53038
53162
|
}
|
|
@@ -53387,7 +53511,7 @@ function HierarchyDragIndicatorLayer({
|
|
|
53387
53511
|
scrollRef,
|
|
53388
53512
|
resolve: resolve2
|
|
53389
53513
|
}) {
|
|
53390
|
-
const [indicator, setIndicator] = (0,
|
|
53514
|
+
const [indicator, setIndicator] = (0, import_react22.useState)(
|
|
53391
53515
|
null
|
|
53392
53516
|
);
|
|
53393
53517
|
(0, import_core3.useDndMonitor)({
|
|
@@ -53491,9 +53615,9 @@ function HierarchyDroppableRow({
|
|
|
53491
53615
|
children
|
|
53492
53616
|
}) {
|
|
53493
53617
|
const { setNodeRef } = (0, import_core3.useDroppable)({ id, disabled });
|
|
53494
|
-
if (!(0,
|
|
53618
|
+
if (!(0, import_react22.isValidElement)(children) || children.type !== "tr") return children;
|
|
53495
53619
|
const row = children;
|
|
53496
|
-
return (0,
|
|
53620
|
+
return (0, import_react22.cloneElement)(row, {
|
|
53497
53621
|
ref: setNodeRef,
|
|
53498
53622
|
className: row.props.className
|
|
53499
53623
|
});
|
|
@@ -53603,7 +53727,7 @@ function columnWidthVar(width, resizedWidth, id, resizable) {
|
|
|
53603
53727
|
};
|
|
53604
53728
|
}
|
|
53605
53729
|
function DefaultJsonCell({ value }) {
|
|
53606
|
-
const [open, setOpen] = (0,
|
|
53730
|
+
const [open, setOpen] = (0, import_react22.useState)(false);
|
|
53607
53731
|
const host = useMatrxDataTableHost();
|
|
53608
53732
|
const Viewer = host.JsonViewer;
|
|
53609
53733
|
const text = JSON.stringify(value, null, 2);
|
|
@@ -53686,7 +53810,7 @@ function resolveStringTitle(title, fallback) {
|
|
|
53686
53810
|
}
|
|
53687
53811
|
|
|
53688
53812
|
// src/data-table/SavedViewsControl.tsx
|
|
53689
|
-
var
|
|
53813
|
+
var import_react23 = require("react");
|
|
53690
53814
|
|
|
53691
53815
|
// src/dropdown-menu.tsx
|
|
53692
53816
|
var DropdownMenuPrimitive = __toESM(require("@radix-ui/react-dropdown-menu"), 1);
|
|
@@ -53833,14 +53957,26 @@ function SavedViewsControl({
|
|
|
53833
53957
|
onSelect,
|
|
53834
53958
|
onSaveNew,
|
|
53835
53959
|
onUpdate,
|
|
53836
|
-
onReload
|
|
53960
|
+
onReload,
|
|
53961
|
+
presentation = "menu",
|
|
53962
|
+
onRename,
|
|
53963
|
+
related
|
|
53837
53964
|
}) {
|
|
53838
|
-
const unsavedChangesId = (0,
|
|
53839
|
-
const [saveOpen, setSaveOpen] = (0,
|
|
53840
|
-
const [name, setName] = (0,
|
|
53841
|
-
const [saving, setSaving] = (0,
|
|
53842
|
-
const [actionError, setActionError] = (0,
|
|
53965
|
+
const unsavedChangesId = (0, import_react23.useId)();
|
|
53966
|
+
const [saveOpen, setSaveOpen] = (0, import_react23.useState)(false);
|
|
53967
|
+
const [name, setName] = (0, import_react23.useState)("");
|
|
53968
|
+
const [saving, setSaving] = (0, import_react23.useState)(false);
|
|
53969
|
+
const [actionError, setActionError] = (0, import_react23.useState)(null);
|
|
53970
|
+
const [pendingSelect, setPendingSelect] = (0, import_react23.useState)(void 0);
|
|
53843
53971
|
const visibleError = actionError ?? error;
|
|
53972
|
+
const select = (id) => {
|
|
53973
|
+
if (id === activeId) return;
|
|
53974
|
+
if (dirty) {
|
|
53975
|
+
setPendingSelect(id);
|
|
53976
|
+
return;
|
|
53977
|
+
}
|
|
53978
|
+
onSelect(id);
|
|
53979
|
+
};
|
|
53844
53980
|
const save = async () => {
|
|
53845
53981
|
const next = name.trim();
|
|
53846
53982
|
if (!next) return;
|
|
@@ -53882,7 +54018,31 @@ function SavedViewsControl({
|
|
|
53882
54018
|
};
|
|
53883
54019
|
const activeName = activeId ? views.find((view) => view.id === activeId)?.name : void 0;
|
|
53884
54020
|
return /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex min-w-0 flex-wrap items-center gap-1", "data-matrx-table-saved-views": true, children: [
|
|
53885
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
54021
|
+
presentation === "tabs" ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(import_jsx_runtime53.Fragment, { children: [
|
|
54022
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
|
|
54023
|
+
TableViewTabs,
|
|
54024
|
+
{
|
|
54025
|
+
tabs: [{ id: "default", label: "Default view" }, ...views.map((view) => ({ id: view.id, label: view.name }))],
|
|
54026
|
+
activeId: activeId ?? "default",
|
|
54027
|
+
onSelect: (id) => select(id === "default" ? null : id),
|
|
54028
|
+
onAdd: () => {
|
|
54029
|
+
setActionError(null);
|
|
54030
|
+
setSaveOpen(true);
|
|
54031
|
+
},
|
|
54032
|
+
onClose: () => {
|
|
54033
|
+
},
|
|
54034
|
+
onRename: (id, label) => {
|
|
54035
|
+
if (onRename) void Promise.resolve(onRename(id, label)).catch((cause) => setActionError(cause instanceof Error ? cause.message : String(cause)));
|
|
54036
|
+
},
|
|
54037
|
+
closable: false,
|
|
54038
|
+
renameable: Boolean(onRename),
|
|
54039
|
+
addHint: "Save a named view to your account",
|
|
54040
|
+
related
|
|
54041
|
+
}
|
|
54042
|
+
),
|
|
54043
|
+
dirty ? onUpdate ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "ghost", size: "sm", disabled: saving, onClick: () => void update(), className: "h-8 shrink-0 text-xs", children: "Save changes" }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "ghost", size: "sm", disabled: saving, onClick: () => setSaveOpen(true), className: "h-8 shrink-0 text-xs", children: "Save as view" }) : null,
|
|
54044
|
+
loading ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { role: "status", className: "text-xs text-muted-foreground", children: "Loading views\u2026" }) : null
|
|
54045
|
+
] }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenu, { children: [
|
|
53886
54046
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(Tooltip, { children: [
|
|
53887
54047
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuTrigger, { asChild: true, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(
|
|
53888
54048
|
Button,
|
|
@@ -53905,7 +54065,7 @@ function SavedViewsControl({
|
|
|
53905
54065
|
] }),
|
|
53906
54066
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuContent, { align: "end", children: [
|
|
53907
54067
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuLabel, { children: "Views" }),
|
|
53908
|
-
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) =>
|
|
54068
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DropdownMenuRadioGroup, { value: activeId ?? "__default__", onValueChange: (value) => select(value === "__default__" ? null : value), children: [
|
|
53909
54069
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuRadioItem, { value: "__default__", children: "Default view" }),
|
|
53910
54070
|
views.map((view) => /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuRadioItem, { value: view.id, children: view.name }, view.id))
|
|
53911
54071
|
] }),
|
|
@@ -53918,7 +54078,10 @@ function SavedViewsControl({
|
|
|
53918
54078
|
onReload ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DropdownMenuItem, { disabled: saving || loading, onSelect: () => void reload(), children: "Reload views" }) : null
|
|
53919
54079
|
] })
|
|
53920
54080
|
] }),
|
|
53921
|
-
dirty ? /* @__PURE__ */ (0, import_jsx_runtime53.
|
|
54081
|
+
dirty ? /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("span", { id: presentation === "menu" ? unsavedChangesId : void 0, role: presentation === "tabs" ? "status" : void 0, className: "sr-only", children: [
|
|
54082
|
+
"This table view has unsaved changes. ",
|
|
54083
|
+
presentation === "tabs" ? onUpdate ? "Use Save changes to update it." : "Use Save as view to keep it." : "Open the view menu to save or update it."
|
|
54084
|
+
] }) : null,
|
|
53922
54085
|
visibleError && !saveOpen ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(ErrorBox, { className: "basis-full break-words text-xs text-destructive", message: visibleError, operation: "Load or save a saved view", origin: "design-system/SavedViewsControl" }) : null,
|
|
53923
54086
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Dialog, { open: saveOpen, onOpenChange: setSaveOpen, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogContent, { children: [
|
|
53924
54087
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogTitle, { children: "Save current view" }) }),
|
|
@@ -53928,6 +54091,20 @@ function SavedViewsControl({
|
|
|
53928
54091
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "outline", onClick: () => setSaveOpen(false), children: "Cancel" }),
|
|
53929
54092
|
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", disabled: !name.trim() || saving, onClick: () => void save(), children: saving ? "Saving\u2026" : "Save view" })
|
|
53930
54093
|
] })
|
|
54094
|
+
] }) }),
|
|
54095
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Dialog, { open: pendingSelect !== void 0, onOpenChange: (open) => {
|
|
54096
|
+
if (!open) setPendingSelect(void 0);
|
|
54097
|
+
}, children: /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogContent, { children: [
|
|
54098
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(DialogTitle, { children: "Unsaved view changes" }) }),
|
|
54099
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { className: "text-sm text-muted-foreground", children: "Switching views will discard the changes you have not saved." }),
|
|
54100
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsxs)(DialogFooter, { children: [
|
|
54101
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", variant: "outline", onClick: () => setPendingSelect(void 0), children: "Stay on this view" }),
|
|
54102
|
+
/* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { type: "button", onClick: () => {
|
|
54103
|
+
const next = pendingSelect;
|
|
54104
|
+
setPendingSelect(void 0);
|
|
54105
|
+
if (next !== void 0) onSelect(next);
|
|
54106
|
+
}, children: "Discard changes and switch" })
|
|
54107
|
+
] })
|
|
53931
54108
|
] }) })
|
|
53932
54109
|
] });
|
|
53933
54110
|
}
|