@columenlabs/lumen-ui 0.1.43 → 0.1.45

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { type CustomViewConfig, LumenTable, type LumenTableProps, LumenView, type LumenViewProps, type ServerPaging, type ViewCellValue, type ViewChipTone, type ViewDomain, type ViewField, type ViewFieldGroup, type ViewSource, CHIP_TONE, RUN_STATE_TONE, FORMULAS_GROUP, ViewValueCell, rollUp, } from './lumen-view.js';
+export { type CustomViewConfig, LumenTable, type LumenTableProps, LumenView, type LumenViewProps, type ServerGroup, type ServerGroups, type ServerPaging, type ViewCellValue, type ViewChipTone, type ViewDomain, type ViewField, type ViewFieldGroup, type ViewSource, CHIP_TONE, RUN_STATE_TONE, FORMULAS_GROUP, ViewValueCell, rollUp, } from './lumen-view.js';
 export { LumenLayout, type LumenLayoutCard, type LumenLayoutProps, type LumenLayoutViewProps, domainKeys, followRows, } from './lumen-layout.js';
 export { LumenViewCard, type LumenViewCardProps } from './lumen-view-card.js';
 export { LumenSelector, LumenSelectorList, type LumenSelectorListHandle, type LumenSelectorProps, type LumenOption, type LumenOptionGroup, SelectorRowContent, } from './lumen-selector.js';

package/dist/lumen-layout.js

@@ -496,8 +496,9 @@ function ViewLayout({ crumbs, actions, meta, status, intro, cards: extra, lead,
     const viewCard = mainTableOf(cards);
     const viewOn = (k) => !viewCard || controlOn(viewCard, k);
     const showBox = !hideFilter && viewOn('filter');
-    // A server's page cannot be grouped: a group would bucket the one page only.
-    const groupButton = viewOn('group') && !paging ? group.button : null;
+    // A server's page cannot be grouped (a group would bucket the one page only), unless the
+    // server groups it.
+    const groupButton = viewOn('group') && (!paging || paging.groups) ? group.button : null;
     const viewFilter = !showBox && !groupButton ? undefined : (_jsxs(_Fragment, { children: [showBox && (_jsx(LumenTokenizedFilter, { filter: filter, label: `Filter ${config.name}`, className: "min-w-0 flex-1", saved: config.filters.default, link: {
                     color: viewColor,
                     onPick: (color) => links.setColor(viewCardId, color),

package/dist/lumen-view.d.ts

@@ -57,11 +57,39 @@ export interface ServerPaging {
     onPage: (page: number) => void;
     onSize?: (size: number) => void;
     sizes?: readonly number[];
-    /** The columns the server sorts by; the rest take no header sort, and the view groups nothing,
-     *  since either would order or bucket one page only. */
+    /** The columns the server sorts by; the rest take no header sort, and the view groups nothing
+     *  (unless `groups`), since either would order or bucket one page only. */
     sorts?: readonly string[];
     /** Told the sort held (a header click, a revert), to fetch the rows in that order. */
     onSort?: (sort: CustomViewConfig['sort']) => void;
+    /** The server groups the rows: the Group button offers the domain's groupable fields, and a
+     *  group's rows load when it opens. Without it a server's page groups nothing. */
+    groups?: ServerGroups;
+}
+/** One group a server counted: its key (the group field's value as the view shows it), its row
+ *  count (null: not counted), and, once open, the rows loaded so far. */
+export interface ServerGroup {
+    key: string;
+    n: number | null;
+    open: boolean;
+    /** The rows loaded for an open group, in the server's order. */
+    rows: unknown[];
+    /** The group has rows past those loaded: its Show more row loads the next. */
+    more?: () => void;
+    /** Its rows are loading. */
+    loading?: boolean;
+}
+export interface ServerGroups {
+    /** Told the field the person groups by (null: none), to fetch that field's groups. */
+    onGroup: (key: string | null) => void;
+    /** The picked field's groups, in order; null while they load. */
+    list: ServerGroup[] | null;
+    /** Groups past those listed: a More groups row asks for them. */
+    more?: () => void;
+    /** A group header's click: open or close it. */
+    onToggle: (key: string) => void;
+    /** Expand all (true) or Collapse all (false): open or close every group listed. */
+    onToggleAll?: (open: boolean) => void;
 }
 export interface LumenViewProps<T> {
     /** The view's domain, its formula columns included (`withViewFields`). */
@@ -195,4 +223,7 @@ export interface LumenTableProps<T> {
     total?: boolean;
     /** What each row opens under it (`subgroupOf`); null: rows open nothing but their panel. */
     subgroup?: ViewSubgroup<T> | null;
+    /** The groups come from a server (`ServerPaging.groups`): their order, counts and open state,
+     *  and each open group's rows. */
+    serverGroups?: ServerGroups | null;
 }

package/dist/lumen-view.js

@@ -234,8 +234,12 @@ export function LumenView({ domain, config, rows, total = rows.length, paging: s
     // scrolls with the page.
     const inLayout = inScroller && !cell;
     const columns = pick(domain.fields, config.columns);
-    // A server's page groups and pivots nothing: either would cover the one page only.
-    const groupBy = server ? null : pickedGroup;
+    // A server's page groups and pivots nothing (either would cover the one page only), unless the
+    // server groups it.
+    const groupBy = server && !server.groups ? null : pickedGroup;
+    const served = server?.groups && groupBy ? server.groups : null;
+    const onGroup = server?.groups?.onGroup;
+    useEffect(() => onGroup?.(groupBy?.key ?? null), [onGroup, groupBy?.key]);
     const pivot = server ? false : pickedPivot;
     // Live columns on screen keep their source reading while the market trades (#861).
     const load = useLiveLoad(sourceLoad, columns.some((c) => {
@@ -243,7 +247,9 @@ export function LumenView({ domain, config, rows, total = rows.length, paging: s
         return r === 'live' || r === 'calc';
     }));
     const chips = chipsOf(config);
-    const tableRows = useMemo(() => mergeRows(domain, rows, groupBy), [domain, rows, groupBy]);
+    // Server groups: the open groups' rows, each object once (a row in two groups shows in both).
+    const groupRows = useMemo(() => served ? [...new Set((served.list ?? []).flatMap((g) => (g.open ? g.rows : [])))] : null, [served]);
+    const tableRows = useMemo(() => groupRows ?? mergeRows(domain, rows, groupBy), [groupRows, domain, rows, groupBy]);
     const amountsHidden = useAmountsHidden();
     // Flat tables page their rows, 25 a page unless the view says otherwise; the size picker and
     // the page buttons sit in the card's header. Views saved before then
@@ -281,9 +287,10 @@ export function LumenView({ domain, config, rows, total = rows.length, paging: s
         return [...out].slice(0, MAX_COMPARE);
     }, [selection, chartField, rows, domain]);
     const compare = openChart && picked.length > 1 ? (_jsx(IconButton, { icon: ChartSpline, label: `Compare ${picked.join(', ')}`, variant: "outline", onClick: () => openChart(picked) })) : null;
-    // A server's page: the pager counts from the server's total, or the rows seen so far.
-    const pager = server ? (_jsx(LumenPager, { total: server.total ?? server.page * server.size + rows.length, page: server.page, size: server.size, onPage: server.onPage, onSize: server.onSize ?? (() => { }), sizes: server.sizes ?? [server.size], more: server.total === null && server.more })) : paging ? (_jsx(LumenPager, { total: tableRows.length, page: page, size: pageSize, onPage: setPageIndex, onSize: setPageSize, noun: rows.length === total ? 'rows' : `of ${total} rows` })) : (_jsx("span", { className: "num px-2 text-xs text-muted-foreground", children: count }));
-    const table = pivot && config.pivot ? (_jsx(PivotTable, { domain: domain, rows: rows, pivot: config.pivot })) : (_jsx(LumenTable, { domain: domain, columns: columns, rows: tableRows, groupBy: groupBy, subgroup: sub, chips: chips, page: paging ? { index: page, size: pageSize } : null, inView: inLayout, fit: fit, onDetails: onDetails, tapped: tapped, selection: selection, groupActions: groupActions, sort: sort, onSort: onSort, serverSorts: server ? (server.sorts ?? []) : undefined, total: config.total !== false, add: onAddColumn || onColumns
+    // A server's page: the pager counts from the server's total, or the rows seen so far. Server
+    // groups page themselves: the header counts them.
+    const pager = served ? (_jsx("span", { className: "num px-2 text-xs text-muted-foreground", children: served.list ? `${served.list.length.toLocaleString()}${served.more ? '+' : ''} groups` : '' })) : server ? (_jsx(LumenPager, { total: server.total ?? server.page * server.size + rows.length, page: server.page, size: server.size, onPage: server.onPage, onSize: server.onSize ?? (() => { }), sizes: server.sizes ?? [server.size], more: server.total === null && server.more })) : paging ? (_jsx(LumenPager, { total: tableRows.length, page: page, size: pageSize, onPage: setPageIndex, onSize: setPageSize, noun: rows.length === total ? 'rows' : `of ${total} rows` })) : (_jsx("span", { className: "num px-2 text-xs text-muted-foreground", children: count }));
+    const table = pivot && config.pivot ? (_jsx(PivotTable, { domain: domain, rows: rows, pivot: config.pivot })) : (_jsx(LumenTable, { domain: domain, columns: columns, rows: tableRows, groupBy: groupBy, subgroup: sub, chips: chips, page: paging ? { index: page, size: pageSize } : null, inView: inLayout, fit: fit, onDetails: onDetails, tapped: tapped, selection: selection, groupActions: groupActions, sort: sort, onSort: onSort, serverSorts: server ? (server.sorts ?? []) : undefined, serverGroups: served, total: config.total !== false, add: onAddColumn || onColumns
             ? { ...onAddColumn, field: onColumns && { domain, columns, onColumns } }
             : undefined }));
     return (_jsx(LumenWidget, { id: cardId, kind: "table", style: "table", title: title, controls: controls, tools: state ? (tools) : (_jsxs(_Fragment, { children: [tools, compare, pager, onColumns && !onAddColumn && on('columns') && (_jsx(ColumnPicker, { domain: domain, columns: columns, onColumns: onColumns })), !pivot && on('download') && (_jsx(IconButton, { icon: DownloadIcon, label: "Download CSV", onClick: () => downloadCsv({
@@ -359,7 +366,7 @@ function sortingOf(sort, columns, serverSorts) {
         return [];
     return columns.some((f) => f.key === sort.key) ? [{ id: sort.key, desc: sort.desc }] : [];
 }
-function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null, chips = [], page = null, inView = false, fit = false, onDetails, tapped, selection, groupActions, sort, onSort, serverSorts, total = true, subgroup = null, add, }) {
+function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null, chips = [], page = null, inView = false, fit = false, onDetails, tapped, selection, groupActions, sort, onSort, serverSorts, total = true, subgroup = null, add, serverGroups = null, }) {
     const [sorting, setSorting] = useState(() => sortingOf(sort, columns, serverSorts));
     // A saved sort patched while the table is open (the assistant's card move) applies at once.
     const savedSort = JSON.stringify(sort ?? null);
@@ -507,6 +514,10 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
     const groups = useMemo(() => {
         if (!groupBy)
             return null;
+        if (serverGroups) {
+            const byRow = new Map(sorted.map((r) => [r.original, r]));
+            return (serverGroups.list ?? []).map((g) => [g.key, g.rows.flatMap((o) => byRow.get(o) ?? [])]);
+        }
         const m = new Map();
         for (const r of sorted) {
             const k = label(groupBy.value(r.original));
@@ -514,12 +525,15 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
             b ? b.push(r) : m.set(k, [r]);
         }
         return [...m];
-    }, [groupBy, sorted]);
+    }, [groupBy, sorted, serverGroups]);
     const span = shown.length + (selection ? 1 : 0);
+    const served = new Map((serverGroups?.list ?? []).map((g) => [g.key, g]));
     const startsOpen = (i) => rows.length <= OPEN_ALL || i === 0;
-    const isOpen = (key, i) => startsOpen(i) !== flipped.has(key);
+    const isOpen = (key, i) => serverGroups ? !!served.get(key)?.open : startsOpen(i) !== flipped.has(key);
     const anyClosed = !!groups?.some(([k], i) => !isOpen(k, i));
-    const setAll = (open) => setFlipped(new Set((groups ?? []).filter((_, i) => startsOpen(i) !== open).map(([k]) => k)));
+    const setAll = (open) => serverGroups
+        ? serverGroups.onToggleAll?.(open)
+        : setFlipped(new Set((groups ?? []).filter((_, i) => startsOpen(i) !== open).map(([k]) => k)));
     const keyOf = domain.rowKey;
     const toggle = (keys, on) => {
         if (!selection)
@@ -534,7 +548,8 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
     const someOn = allKeys.some((k) => selection?.keys.has(k));
     const selectCell = (key, name) => selection && (_jsx(TableCell, { className: "w-8 pr-0", onClick: (e) => e.stopPropagation(), children: _jsx(Checkbox, { checked: selection.keys.has(key), onCheckedChange: (on) => toggle([key], on === true), "aria-label": `Select ${name}` }) }));
     const [openParts, setOpenParts] = useState(new Set());
-    const hasTotal = total && shown.some(rollsUp);
+    // A server group's roll-ups would add up its loaded rows only, so they and the Total stay off.
+    const hasTotal = total && !serverGroups && shown.some(rollsUp);
     // A group row's label spans the leading columns that roll nothing up.
     const rolls = (f) => !f.noRollup && (!!f.aggregate || !!f.rollFormula || !!f.share);
     const lead = Math.max(1, shown.findIndex((f, i) => i > 0 && rolls(f)) < 0
@@ -608,6 +623,21 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
             _jsx(TableRow, { "data-more": true, children: _jsx(TableCell, { colSpan: span, className: "py-1", children: _jsxs(Button, { variant: "ghost", size: "xs", onClick: () => setMore((m) => new Map(m).set(scope, limit + DRAW_STEP)), children: [_jsx(ChevronsDownIcon, {}), "Show ", Math.min(left, DRAW_STEP).toLocaleString(), " more", _jsxs("span", { className: "num font-normal text-muted-foreground", children: ["of ", left.toLocaleString()] })] }) }) }, `${scope}:more`),
         ];
     };
+    // A server group's rows as loaded, then its Show more (the server's next rows) or loading row.
+    const servedRows = (list, key) => {
+        const g = served.get(key);
+        const out = rowsOf(list, key);
+        if (!g?.more && !g?.loading)
+            return out.length
+                ? out
+                : [
+                    _jsx(TableRow, { children: _jsx(TableCell, { colSpan: span, className: "py-2 text-center text-xs text-muted-foreground", children: "No rows match." }) }, `${key}:none`),
+                ];
+        return [
+            ...out,
+            _jsx(TableRow, { "data-more": true, children: _jsx(TableCell, { colSpan: span, className: "py-1", children: g.loading ? (_jsx("span", { className: "px-2 text-xs text-muted-foreground", children: "Loading\u2026" })) : (_jsxs(Button, { variant: "ghost", size: "xs", onClick: g.more, children: [_jsx(ChevronsDownIcon, {}), "Show more", g.n !== null && (_jsxs("span", { className: "num font-normal text-muted-foreground", children: ["of ", (g.n - list.length).toLocaleString()] }))] })) }) }, `${key}:more`),
+        ];
+    };
     const box = useRef(null);
     useFloatingHead(box, !inView);
     return (_jsx("div", { ref: box, className: cn(inView ? IN_VIEW : 'overflow-x-auto overflow-y-hidden [--pin-top:0px]', fit && FIT), children: _jsxs(Table, { children: [_jsx(TableHeader, { children: table.getHeaderGroups().map((hg) => (_jsxs(TableRow, { children: [selection && (_jsx(TableHead, { className: cn('w-8 pr-0', PINNED_HEAD), children: _jsx(Checkbox, { checked: allOn ? true : someOn ? 'indeterminate' : false, onCheckedChange: (on) => toggle(allKeys, on === true), "aria-label": "Select every row" }) })), hg.headers.map((h, i) => (_jsxs(TableHead, { className: cn(colOf(shown[i]), PINNED_HEAD), style: ruleOf(colorOf(domain, shown[i])), onPointerDown: pressStart, onPointerUp: pressEnd, onPointerLeave: pressEnd, onPointerCancel: pressEnd, onContextMenu: (e) => {
@@ -617,20 +647,25 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
                                     ? 'ascending'
                                     : h.column.getIsSorted() === 'desc'
                                         ? 'descending'
-                                        : undefined, children: [i === 0 && groups && (_jsx(IconButton, { icon: anyClosed ? ChevronsUpDownIcon : ChevronsDownUpIcon, size: "icon-xs", className: "-ml-2 mr-1 align-middle", label: anyClosed ? 'Expand all groups' : 'Collapse all groups', onClick: () => setAll(anyClosed) })), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "xs", className: cn('font-medium', !(i === 0 && groups) && '-mx-2'), style: { color: colorOf(domain, shown[i]) ?? undefined }, onClick: h.column.getCanSort() ? h.column.getToggleSortingHandler() : undefined, children: [shown[i] ? _jsx(FreshnessMark, { domain: domain, field: shown[i] }) : null, flexRender(h.column.columnDef.header, h.getContext()), _jsx(SortIcon, { dir: h.column.getIsSorted() })] }) }), shown[i] && (domain.groups?.length || freshnessOf(domain, shown[i])) ? (_jsxs(TooltipContent, { children: [domain.groups?.length ? _jsx("div", { children: pathOf(domain, shown[i]) }) : null, freshnessLine(domain, shown[i]) ? (_jsx("div", { children: freshnessLine(domain, shown[i]) })) : null] })) : null] })] }, h.id))), add && (_jsx(TableHead, { className: cn('w-8 pl-1', PINNED_HEAD), children: _jsx(AddColumnMenu, { add: add, fieldOpen: fieldOpen, onFieldOpen: setFieldOpen }) }))] }, hg.id))) }), _jsxs(TableBody, { children: [!rows.length && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: span, className: "py-6 text-center text-muted-foreground", children: "No rows match." }) })), groups && groupBy
+                                        : undefined, children: [i === 0 && groups && (!serverGroups || serverGroups.onToggleAll) && (_jsx(IconButton, { icon: anyClosed ? ChevronsUpDownIcon : ChevronsDownUpIcon, size: "icon-xs", className: "-ml-2 mr-1 align-middle", label: anyClosed ? 'Expand all groups' : 'Collapse all groups', onClick: () => setAll(anyClosed) })), _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsxs(Button, { variant: "ghost", size: "xs", className: cn('font-medium', !(i === 0 && groups) && '-mx-2'), style: { color: colorOf(domain, shown[i]) ?? undefined }, onClick: h.column.getCanSort() ? h.column.getToggleSortingHandler() : undefined, children: [shown[i] ? _jsx(FreshnessMark, { domain: domain, field: shown[i] }) : null, flexRender(h.column.columnDef.header, h.getContext()), _jsx(SortIcon, { dir: h.column.getIsSorted() })] }) }), shown[i] && (domain.groups?.length || freshnessOf(domain, shown[i])) ? (_jsxs(TooltipContent, { children: [domain.groups?.length ? _jsx("div", { children: pathOf(domain, shown[i]) }) : null, freshnessLine(domain, shown[i]) ? (_jsx("div", { children: freshnessLine(domain, shown[i]) })) : null] })) : null] })] }, h.id))), add && (_jsx(TableHead, { className: cn('w-8 pl-1', PINNED_HEAD), children: _jsx(AddColumnMenu, { add: add, fieldOpen: fieldOpen, onFieldOpen: setFieldOpen }) }))] }, hg.id))) }), _jsxs(TableBody, { children: [!rows.length && !serverGroups?.list?.length && (_jsx(TableRow, { children: _jsx(TableCell, { colSpan: span, className: "py-6 text-center text-muted-foreground", children: "No rows match." }) })), groups && groupBy
                             ? groups.map(([key, members], gi) => {
                                 const open = isOpen(key, gi);
                                 return (_jsxs(Fragment, { children: [_jsxs(TableRow, { className: ROLLUP, "data-group": key, children: [selection && (_jsx(TableCell, { className: cn('w-8 pr-0', PINNED_GROUP), children: _jsx(Checkbox, { checked: members.every((m) => selection.keys.has(keyOf(m.original)))
                                                             ? true
                                                             : members.some((m) => selection.keys.has(keyOf(m.original)))
                                                                 ? 'indeterminate'
-                                                                : false, onCheckedChange: (on) => toggle(members.map((m) => keyOf(m.original)), on === true), "aria-label": `Select every row of ${key}` }) })), shown.slice(lead - 1).map((f, i) => i === 0 ? (_jsxs(TableCell, { colSpan: lead, className: PINNED_GROUP, children: [_jsxs(Button, { variant: "ghost", size: "xs", className: "-mx-2 hover:bg-transparent aria-expanded:bg-transparent", "aria-expanded": open, "aria-label": `${open ? 'Collapse' : 'Expand'} ${key}`, onClick: () => setFlipped((c) => {
-                                                                const n = new Set(c);
-                                                                n.has(key) ? n.delete(key) : n.add(key);
-                                                                return n;
-                                                            }), children: [_jsx(ChevronRightIcon, { className: cn('transition-transform', open && 'rotate-90') }), _jsx(groupBy.icon, {}), key, _jsx("span", { className: "num font-normal text-muted-foreground", children: members.length })] }), groupActions?.(key, members.map((m) => m.original))] }, f.key)) : (_jsx(TableCell, { className: cn(colOf(f), PINNED_GROUP), children: rollCell(f, members.map((m) => m.original)) }, f.key)))] }), open && drawn(members, key)] }, key));
+                                                                : false, onCheckedChange: (on) => toggle(members.map((m) => keyOf(m.original)), on === true), "aria-label": `Select every row of ${key}` }) })), shown.slice(lead - 1).map((f, i) => i === 0 ? (_jsxs(TableCell, { colSpan: lead, className: PINNED_GROUP, children: [_jsxs(Button, { variant: "ghost", size: "xs", className: "-mx-2 hover:bg-transparent aria-expanded:bg-transparent", "aria-expanded": open, "aria-label": `${open ? 'Collapse' : 'Expand'} ${key}`, onClick: () => serverGroups
+                                                                ? serverGroups.onToggle(key)
+                                                                : setFlipped((c) => {
+                                                                    const n = new Set(c);
+                                                                    n.has(key) ? n.delete(key) : n.add(key);
+                                                                    return n;
+                                                                }), children: [_jsx(ChevronRightIcon, { className: cn('transition-transform', open && 'rotate-90') }), _jsx(groupBy.icon, {}), key, _jsx("span", { className: "num font-normal text-muted-foreground", children: serverGroups
+                                                                        ? (served.get(key)?.n?.toLocaleString() ?? '')
+                                                                        : members.length })] }), groupActions?.(key, members.map((m) => m.original))] }, f.key)) : (_jsx(TableCell, { className: cn(colOf(f), PINNED_GROUP), children: !serverGroups &&
+                                                        rollCell(f, members.map((m) => m.original)) }, f.key)))] }), open && (serverGroups ? servedRows(members, key) : drawn(members, key))] }, key));
                             })
-                            : drawn(sorted, ''), hasTotal && rows.length > 0 && (_jsxs(TableRow, { className: cn(ROLLUP, 'border-t-2'), "data-total": true, children: [selection && _jsx(TableCell, {}), rollCells(rows).map((cell, i) => i === 0 && !(shown[0] && rollsUp(shown[0])) ? (_jsx(TableCell, { children: "Total" }, "total")) : (cell))] }))] })] }) }));
+                            : drawn(sorted, ''), serverGroups?.more && (_jsx(TableRow, { "data-more": true, children: _jsx(TableCell, { colSpan: span, className: "py-1", children: _jsxs(Button, { variant: "ghost", size: "xs", onClick: serverGroups.more, children: [_jsx(ChevronsDownIcon, {}), "More groups"] }) }) })), hasTotal && rows.length > 0 && (_jsxs(TableRow, { className: cn(ROLLUP, 'border-t-2'), "data-total": true, children: [selection && _jsx(TableCell, {}), rollCells(rows).map((cell, i) => i === 0 && !(shown[0] && rollsUp(shown[0])) ? (_jsx(TableCell, { children: "Total" }, "total")) : (cell))] }))] })] }) }));
 }
 /** One value rolled up into a rows × columns grid, with totals where the roll-up adds. */
 function PivotTable({ domain, rows, pivot, }) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@columenlabs/lumen-ui",
-  "version": "0.1.43",
+  "version": "0.1.45",
   "description": "Lumen: shared React components (frame, views, widgets, charts, drawers).",
   "license": "MIT",
   "type": "module",
@@ -41,7 +41,7 @@
     "@codemirror/lang-javascript": "6.2.5",
     "@codemirror/lang-json": "6.0.2",
     "@codemirror/lang-sql": "6.10.0",
-    "@columenlabs/lumen-ui-types": "0.1.43",
+    "@columenlabs/lumen-ui-types": "0.1.45",
     "@dnd-kit/core": "6.3.1",
     "@dnd-kit/sortable": "10.0.0",
     "@dnd-kit/utilities": "3.2.2",