@rentnerkev/table 0.0.1 → 0.0.2
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/README.md +4 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js.map +1 -1
- package/dist/lib/Messages/tableMessages.d.ts.map +1 -1
- package/dist/lib/Messages/tableMessages.js +20 -0
- package/dist/lib/Messages/tableMessages.js.map +1 -1
- package/dist/lib/Table/events.d.ts +2 -0
- package/dist/lib/Table/events.d.ts.map +1 -0
- package/dist/lib/Table/events.js +5 -0
- package/dist/lib/Table/events.js.map +1 -0
- package/dist/lib/Table/rowOrder.d.ts +7 -0
- package/dist/lib/Table/rowOrder.d.ts.map +1 -0
- package/dist/lib/Table/rowOrder.js +26 -0
- package/dist/lib/Table/rowOrder.js.map +1 -0
- package/dist/lib/Table/table.d.ts +2 -0
- package/dist/lib/Table/table.d.ts.map +1 -1
- package/dist/lib/Table/table.js +2 -1
- package/dist/lib/Table/table.js.map +1 -1
- package/dist/shared/Table/Components/DataTable.d.ts.map +1 -1
- package/dist/shared/Table/Components/DataTable.js +1 -1
- package/dist/shared/Table/Components/DataTable.js.map +1 -1
- package/dist/shared/Table/Components/Table.d.ts +1 -1
- package/dist/shared/Table/Components/Table.d.ts.map +1 -1
- package/dist/shared/Table/Components/Table.js +3 -2
- package/dist/shared/Table/Components/Table.js.map +1 -1
- package/dist/shared/Table/Components/TableBody.d.ts +1 -1
- package/dist/shared/Table/Components/TableBody.d.ts.map +1 -1
- package/dist/shared/Table/Components/TableBody.js +6 -15
- package/dist/shared/Table/Components/TableBody.js.map +1 -1
- package/dist/shared/Table/Components/TableDataRow.d.ts +4 -0
- package/dist/shared/Table/Components/TableDataRow.d.ts.map +1 -0
- package/dist/shared/Table/Components/TableDataRow.js +26 -0
- package/dist/shared/Table/Components/TableDataRow.js.map +1 -0
- package/dist/shared/Table/Components/TableHead.d.ts +1 -1
- package/dist/shared/Table/Components/TableHead.d.ts.map +1 -1
- package/dist/shared/Table/Components/TableHead.js +10 -4
- package/dist/shared/Table/Components/TableHead.js.map +1 -1
- package/dist/shared/Table/Components/TableReorderProvider.d.ts +3 -0
- package/dist/shared/Table/Components/TableReorderProvider.d.ts.map +1 -0
- package/dist/shared/Table/Components/TableReorderProvider.js +43 -0
- package/dist/shared/Table/Components/TableReorderProvider.js.map +1 -0
- package/dist/shared/Table/Components/TableResizeHandle.d.ts +4 -0
- package/dist/shared/Table/Components/TableResizeHandle.d.ts.map +1 -0
- package/dist/shared/Table/Components/TableResizeHandle.js +13 -0
- package/dist/shared/Table/Components/TableResizeHandle.js.map +1 -0
- package/dist/shared/Table/Components/TableSurface.d.ts +1 -1
- package/dist/shared/Table/Components/TableSurface.d.ts.map +1 -1
- package/dist/shared/Table/Components/TableSurface.js +16 -8
- package/dist/shared/Table/Components/TableSurface.js.map +1 -1
- package/dist/shared/Table/Components/TableViewport.d.ts +4 -0
- package/dist/shared/Table/Components/TableViewport.d.ts.map +1 -0
- package/dist/shared/Table/Components/TableViewport.js +20 -0
- package/dist/shared/Table/Components/TableViewport.js.map +1 -0
- package/dist/shared/Table/Hooks/useDataTableLogic.d.ts +1 -1
- package/dist/shared/Table/Hooks/useDataTableLogic.d.ts.map +1 -1
- package/dist/shared/Table/Hooks/useDataTableLogic.js +22 -3
- package/dist/shared/Table/Hooks/useDataTableLogic.js.map +1 -1
- package/dist/shared/Table/Hooks/useTableColumnResizeLogic.d.ts +6 -0
- package/dist/shared/Table/Hooks/useTableColumnResizeLogic.d.ts.map +1 -0
- package/dist/shared/Table/Hooks/useTableColumnResizeLogic.js +40 -0
- package/dist/shared/Table/Hooks/useTableColumnResizeLogic.js.map +1 -0
- package/dist/shared/Table/Hooks/useTableDragLogic.d.ts +21 -0
- package/dist/shared/Table/Hooks/useTableDragLogic.d.ts.map +1 -0
- package/dist/shared/Table/Hooks/useTableDragLogic.js +110 -0
- package/dist/shared/Table/Hooks/useTableDragLogic.js.map +1 -0
- package/dist/shared/Table/Hooks/useTableLogic.d.ts +1 -1
- package/dist/shared/Table/Hooks/useTableLogic.d.ts.map +1 -1
- package/dist/shared/Table/Hooks/useTableLogic.js +6 -1
- package/dist/shared/Table/Hooks/useTableLogic.js.map +1 -1
- package/dist/shared/Table/Hooks/useTableResizeHandleLogic.d.ts +20 -0
- package/dist/shared/Table/Hooks/useTableResizeHandleLogic.d.ts.map +1 -0
- package/dist/shared/Table/Hooks/useTableResizeHandleLogic.js +52 -0
- package/dist/shared/Table/Hooks/useTableResizeHandleLogic.js.map +1 -0
- package/dist/shared/Table/Hooks/useTableRowDragContext.d.ts +5 -0
- package/dist/shared/Table/Hooks/useTableRowDragContext.d.ts.map +1 -0
- package/dist/shared/Table/Hooks/useTableRowDragContext.js +6 -0
- package/dist/shared/Table/Hooks/useTableRowDragContext.js.map +1 -0
- package/dist/shared/Table/Hooks/useTableRowEventsLogic.d.ts +12 -0
- package/dist/shared/Table/Hooks/useTableRowEventsLogic.d.ts.map +1 -0
- package/dist/shared/Table/Hooks/useTableRowEventsLogic.js +25 -0
- package/dist/shared/Table/Hooks/useTableRowEventsLogic.js.map +1 -0
- package/dist/shared/Table/Hooks/useTableRowOrder.d.ts +11 -0
- package/dist/shared/Table/Hooks/useTableRowOrder.d.ts.map +1 -0
- package/dist/shared/Table/Hooks/useTableRowOrder.js +19 -0
- package/dist/shared/Table/Hooks/useTableRowOrder.js.map +1 -0
- package/dist/shared/Table/Types/dataTable.types.d.ts +17 -4
- package/dist/shared/Table/Types/dataTable.types.d.ts.map +1 -1
- package/dist/shared/Table/Types/dataTable.types.js.map +1 -1
- package/dist/shared/Table/Types/interaction.types.d.ts +86 -0
- package/dist/shared/Table/Types/interaction.types.d.ts.map +1 -0
- package/dist/shared/Table/Types/interaction.types.js +2 -0
- package/dist/shared/Table/Types/interaction.types.js.map +1 -0
- package/dist/shared/Table/Types/table.types.d.ts +5 -2
- package/dist/shared/Table/Types/table.types.d.ts.map +1 -1
- package/dist/shared/Table/Types/table.types.js.map +1 -1
- package/dist/types.d.ts +1 -0
- package/dist/types.d.ts.map +1 -1
- package/dist/types.js.map +1 -1
- package/docs/usage.md +54 -0
- package/package.json +5 -1
|
@@ -0,0 +1,110 @@
|
|
|
1
|
+
import { useCallback, useMemo, useState } from 'react';
|
|
2
|
+
import { closestCenter, pointerWithin, MouseSensor, TouchSensor, KeyboardSensor, useSensor, useSensors, } from '@dnd-kit/core';
|
|
3
|
+
import { sortableKeyboardCoordinates } from '@dnd-kit/sortable';
|
|
4
|
+
import { isTableEventElement } from '../../../lib/Table/events.js';
|
|
5
|
+
const defaultMoveLabel = (label) => `Move ${label}`;
|
|
6
|
+
function snapshotRow(target) {
|
|
7
|
+
if (!isTableEventElement(target))
|
|
8
|
+
return null;
|
|
9
|
+
const source = target.closest('tbody[data-sortable-row]');
|
|
10
|
+
const table = source?.closest('table');
|
|
11
|
+
if (!source || !table)
|
|
12
|
+
return null;
|
|
13
|
+
const viewport = table.parentElement;
|
|
14
|
+
if (!viewport)
|
|
15
|
+
return null;
|
|
16
|
+
const bounds = source.getBoundingClientRect();
|
|
17
|
+
const viewportBounds = viewport.getBoundingClientRect();
|
|
18
|
+
const left = Math.max(bounds.left, viewportBounds.left + viewport.clientLeft);
|
|
19
|
+
const right = Math.min(bounds.right, viewportBounds.left + viewport.clientLeft + viewport.clientWidth);
|
|
20
|
+
const preview = table.ownerDocument.createElement('table');
|
|
21
|
+
preview.className = table.className;
|
|
22
|
+
preview.dataset.size = table.dataset.size;
|
|
23
|
+
preview.dataset.striped = table.dataset.striped;
|
|
24
|
+
preview.style.width = `${bounds.width}px`;
|
|
25
|
+
preview.style.marginLeft = `${bounds.left - left}px`;
|
|
26
|
+
preview.style.tableLayout = 'fixed';
|
|
27
|
+
preview.style.background = 'var(--rentner-surface, #181a1f)';
|
|
28
|
+
const columns = table.ownerDocument.createElement('colgroup');
|
|
29
|
+
for (const cell of source.firstElementChild?.children ?? []) {
|
|
30
|
+
const column = table.ownerDocument.createElement('col');
|
|
31
|
+
column.style.width = `${cell.getBoundingClientRect().width}px`;
|
|
32
|
+
columns.appendChild(column);
|
|
33
|
+
}
|
|
34
|
+
const clone = source.ownerDocument.importNode(source, true);
|
|
35
|
+
clone.style.transform = '';
|
|
36
|
+
clone.style.transition = '';
|
|
37
|
+
clone.style.opacity = '1';
|
|
38
|
+
clone.removeAttribute('data-dragging');
|
|
39
|
+
for (const element of [clone, ...clone.querySelectorAll('[id], [name]')]) {
|
|
40
|
+
element.removeAttribute('id');
|
|
41
|
+
element.removeAttribute('name');
|
|
42
|
+
}
|
|
43
|
+
preview.append(columns, clone);
|
|
44
|
+
return { element: preview, left, width: Math.max(0, right - left) };
|
|
45
|
+
}
|
|
46
|
+
const detectRow = (args) => args.pointerCoordinates ? pointerWithin(args) : closestCenter(args);
|
|
47
|
+
export function useTableDragLogic({ rows, disabled, disabledReason, getLabel, onReorder, messages, }) {
|
|
48
|
+
const dragOptions = useMemo(() => ({
|
|
49
|
+
disabled,
|
|
50
|
+
reason: disabledReason,
|
|
51
|
+
moveRow: messages.moveRow ?? defaultMoveLabel,
|
|
52
|
+
}), [disabled, disabledReason, messages.moveRow]);
|
|
53
|
+
const [preview, setPreview] = useState(null);
|
|
54
|
+
const items = useMemo(() => rows.map((row) => row.id), [rows]);
|
|
55
|
+
const sensors = useSensors(useSensor(MouseSensor, { activationConstraint: { distance: 6 } }), useSensor(TouchSensor, {
|
|
56
|
+
activationConstraint: { delay: 180, tolerance: 8 },
|
|
57
|
+
}), useSensor(KeyboardSensor, {
|
|
58
|
+
coordinateGetter: sortableKeyboardCoordinates,
|
|
59
|
+
}));
|
|
60
|
+
const handleStart = (event) => {
|
|
61
|
+
if (!disabled)
|
|
62
|
+
setPreview(snapshotRow(event.activatorEvent.target));
|
|
63
|
+
};
|
|
64
|
+
const handleEnd = ({ active, over }) => {
|
|
65
|
+
setPreview(null);
|
|
66
|
+
if (!disabled &&
|
|
67
|
+
typeof active.id === 'string' &&
|
|
68
|
+
typeof over?.id === 'string' &&
|
|
69
|
+
items.includes(active.id) &&
|
|
70
|
+
items.includes(over.id) &&
|
|
71
|
+
active.id !== over.id)
|
|
72
|
+
onReorder?.(active.id, over.id);
|
|
73
|
+
};
|
|
74
|
+
const previewRef = useCallback((element) => {
|
|
75
|
+
if (element)
|
|
76
|
+
element.replaceChildren(...(preview ? [preview.element] : []));
|
|
77
|
+
}, [preview]);
|
|
78
|
+
const announcements = {
|
|
79
|
+
onDragStart: ({ active }) => messages.dragStart?.(getLabel(String(active.id))) ??
|
|
80
|
+
`Moving ${getLabel(String(active.id))}.`,
|
|
81
|
+
onDragOver: ({ active, over }) => over
|
|
82
|
+
? (messages.dragOver?.(getLabel(String(active.id)), items.indexOf(String(over.id)) + 1, items.length) ??
|
|
83
|
+
`Position ${items.indexOf(String(over.id)) + 1} of ${items.length}.`)
|
|
84
|
+
: undefined,
|
|
85
|
+
onDragEnd: ({ active, over }) => over
|
|
86
|
+
? (messages.dragEnd?.(getLabel(String(active.id)), items.indexOf(String(over.id)) + 1, items.length) ??
|
|
87
|
+
`Moved to position ${items.indexOf(String(over.id)) + 1}.`)
|
|
88
|
+
: (messages.dragCancel?.(getLabel(String(active.id))) ??
|
|
89
|
+
'Move cancelled.'),
|
|
90
|
+
onDragCancel: ({ active }) => messages.dragCancel?.(getLabel(String(active.id))) ??
|
|
91
|
+
'Move cancelled.',
|
|
92
|
+
};
|
|
93
|
+
return {
|
|
94
|
+
state: {
|
|
95
|
+
items,
|
|
96
|
+
sensors,
|
|
97
|
+
preview,
|
|
98
|
+
announcements,
|
|
99
|
+
collisionDetection: detectRow,
|
|
100
|
+
dragOptions,
|
|
101
|
+
},
|
|
102
|
+
handler: {
|
|
103
|
+
handleStart,
|
|
104
|
+
handleEnd,
|
|
105
|
+
handleCancel: () => setPreview(null),
|
|
106
|
+
},
|
|
107
|
+
refs: { preview: previewRef },
|
|
108
|
+
};
|
|
109
|
+
}
|
|
110
|
+
//# sourceMappingURL=useTableDragLogic.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableDragLogic.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableDragLogic.ts"],"names":[],"mappings":"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","sourcesContent":["import { useCallback, useMemo, useState } from 'react'\nimport {\n closestCenter,\n pointerWithin,\n MouseSensor,\n TouchSensor,\n KeyboardSensor,\n useSensor,\n useSensors,\n} from '@dnd-kit/core'\nimport type {\n CollisionDetection,\n DragStartEvent,\n DragEndEvent,\n Announcements,\n} from '@dnd-kit/core'\nimport { sortableKeyboardCoordinates } from '@dnd-kit/sortable'\nimport { isTableEventElement } from '../../../lib/Table/events.ts'\nimport type {\n TableReorderProviderProps,\n TableDragOptions,\n TableRowPreview,\n} from '../Types/interaction.types.ts'\n\nconst defaultMoveLabel = (label: string) => `Move ${label}`\n\nfunction snapshotRow(target: EventTarget | null): TableRowPreview | null {\n if (!isTableEventElement(target)) return null\n const source = target.closest<HTMLTableSectionElement>(\n 'tbody[data-sortable-row]',\n )\n const table = source?.closest('table')\n if (!source || !table) return null\n const viewport = table.parentElement\n if (!viewport) return null\n const bounds = source.getBoundingClientRect()\n const viewportBounds = viewport.getBoundingClientRect()\n const left = Math.max(\n bounds.left,\n viewportBounds.left + viewport.clientLeft,\n )\n const right = Math.min(\n bounds.right,\n viewportBounds.left + viewport.clientLeft + viewport.clientWidth,\n )\n const preview = table.ownerDocument.createElement('table')\n preview.className = table.className\n preview.dataset.size = table.dataset.size\n preview.dataset.striped = table.dataset.striped\n preview.style.width = `${bounds.width}px`\n preview.style.marginLeft = `${bounds.left - left}px`\n preview.style.tableLayout = 'fixed'\n preview.style.background = 'var(--rentner-surface, #181a1f)'\n const columns = table.ownerDocument.createElement('colgroup')\n for (const cell of source.firstElementChild?.children ?? []) {\n const column = table.ownerDocument.createElement('col')\n column.style.width = `${cell.getBoundingClientRect().width}px`\n columns.appendChild(column)\n }\n const clone = source.ownerDocument.importNode(source, true)\n clone.style.transform = ''\n clone.style.transition = ''\n clone.style.opacity = '1'\n clone.removeAttribute('data-dragging')\n for (const element of [clone, ...clone.querySelectorAll('[id], [name]')]) {\n element.removeAttribute('id')\n element.removeAttribute('name')\n }\n preview.append(columns, clone)\n return { element: preview, left, width: Math.max(0, right - left) }\n}\n\nconst detectRow: CollisionDetection = (args) =>\n args.pointerCoordinates ? pointerWithin(args) : closestCenter(args)\n\nexport function useTableDragLogic({\n rows,\n disabled,\n disabledReason,\n getLabel,\n onReorder,\n messages,\n}: TableReorderProviderProps) {\n const dragOptions = useMemo(\n (): TableDragOptions => ({\n disabled,\n reason: disabledReason,\n moveRow: messages.moveRow ?? defaultMoveLabel,\n }),\n [disabled, disabledReason, messages.moveRow],\n )\n const [preview, setPreview] = useState<TableRowPreview | null>(null)\n const items = useMemo(() => rows.map((row) => row.id), [rows])\n const sensors = useSensors(\n useSensor(MouseSensor, { activationConstraint: { distance: 6 } }),\n useSensor(TouchSensor, {\n activationConstraint: { delay: 180, tolerance: 8 },\n }),\n useSensor(KeyboardSensor, {\n coordinateGetter: sortableKeyboardCoordinates,\n }),\n )\n const handleStart = (event: DragStartEvent) => {\n if (!disabled) setPreview(snapshotRow(event.activatorEvent.target))\n }\n const handleEnd = ({ active, over }: DragEndEvent) => {\n setPreview(null)\n if (\n !disabled &&\n typeof active.id === 'string' &&\n typeof over?.id === 'string' &&\n items.includes(active.id) &&\n items.includes(over.id) &&\n active.id !== over.id\n )\n onReorder?.(active.id, over.id)\n }\n const previewRef = useCallback(\n (element: HTMLDivElement | null) => {\n if (element)\n element.replaceChildren(...(preview ? [preview.element] : []))\n },\n [preview],\n )\n const announcements: Announcements = {\n onDragStart: ({ active }) =>\n messages.dragStart?.(getLabel(String(active.id))) ??\n `Moving ${getLabel(String(active.id))}.`,\n onDragOver: ({ active, over }) =>\n over\n ? (messages.dragOver?.(\n getLabel(String(active.id)),\n items.indexOf(String(over.id)) + 1,\n items.length,\n ) ??\n `Position ${items.indexOf(String(over.id)) + 1} of ${items.length}.`)\n : undefined,\n onDragEnd: ({ active, over }) =>\n over\n ? (messages.dragEnd?.(\n getLabel(String(active.id)),\n items.indexOf(String(over.id)) + 1,\n items.length,\n ) ??\n `Moved to position ${items.indexOf(String(over.id)) + 1}.`)\n : (messages.dragCancel?.(getLabel(String(active.id))) ??\n 'Move cancelled.'),\n onDragCancel: ({ active }) =>\n messages.dragCancel?.(getLabel(String(active.id))) ??\n 'Move cancelled.',\n }\n return {\n state: {\n items,\n sensors,\n preview,\n announcements,\n collisionDetection: detectRow,\n dragOptions,\n },\n handler: {\n handleStart,\n handleEnd,\n handleCancel: () => setPreview(null),\n },\n refs: { preview: previewRef },\n }\n}\n"]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { RowData } from '@tanstack/react-table';
|
|
2
2
|
import type { TableLogicOptions, TableLogicResult } from '../Types/table.types.ts';
|
|
3
|
-
export declare function useTableLogic<TData extends RowData>({ data, columns, getRowId, enableSorting, initialSorting, locale, messages, }: TableLogicOptions<TData>): TableLogicResult<TData>;
|
|
3
|
+
export declare function useTableLogic<TData extends RowData>({ data, columns, getRowId, enableSorting, initialSorting, locale, messages, resizableColumns, }: TableLogicOptions<TData>): TableLogicResult<TData>;
|
|
4
4
|
//# sourceMappingURL=useTableLogic.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableLogic.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableLogic.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAIpD,OAAO,KAAK,EACR,iBAAiB,EACjB,gBAAgB,EACnB,MAAM,yBAAyB,CAAA;AAEhC,wBAAgB,aAAa,CAAC,KAAK,SAAS,OAAO,EAAE,EACjD,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAoB,EACpB,cAAc,EACd,MAAa,EACb,QAAQ,
|
|
1
|
+
{"version":3,"file":"useTableLogic.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableLogic.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAIpD,OAAO,KAAK,EACR,iBAAiB,EACjB,gBAAgB,EACnB,MAAM,yBAAyB,CAAA;AAEhC,wBAAgB,aAAa,CAAC,KAAK,SAAS,OAAO,EAAE,EACjD,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAoB,EACpB,cAAc,EACd,MAAa,EACb,QAAQ,EACR,gBAAwB,GAC3B,EAAE,iBAAiB,CAAC,KAAK,CAAC,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAmBpD"}
|
|
@@ -3,13 +3,18 @@ import { useTable } from '@tanstack/react-table';
|
|
|
3
3
|
import { rentnerTableFeatures } from '../../../lib/Table/table.js';
|
|
4
4
|
import { getTableView } from '../../../lib/Table/presentation.js';
|
|
5
5
|
import { resolveTableMessages } from '../../../lib/Messages/tableMessages.js';
|
|
6
|
-
export function useTableLogic({ data, columns, getRowId, enableSorting = true, initialSorting, locale = 'en', messages, }) {
|
|
6
|
+
export function useTableLogic({ data, columns, getRowId, enableSorting = true, initialSorting, locale = 'en', messages, resizableColumns = false, }) {
|
|
7
7
|
const table = useTable({
|
|
8
8
|
features: rentnerTableFeatures,
|
|
9
9
|
data,
|
|
10
10
|
columns,
|
|
11
11
|
getRowId,
|
|
12
12
|
enableSorting,
|
|
13
|
+
enableColumnResizing: resizableColumns,
|
|
14
|
+
columnResizeMode: 'onChange',
|
|
15
|
+
defaultColumn: resizableColumns
|
|
16
|
+
? { minSize: 64, maxSize: 2000 }
|
|
17
|
+
: undefined,
|
|
13
18
|
manualPagination: true,
|
|
14
19
|
initialState: { sorting: initialSorting ?? [] },
|
|
15
20
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useTableLogic.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableLogic.ts"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAEhD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAA;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,wCAAwC,CAAA;AAM7E,MAAM,UAAU,aAAa,CAAwB,EACjD,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,GAAG,IAAI,EACpB,cAAc,EACd,MAAM,GAAG,IAAI,EACb,QAAQ,
|
|
1
|
+
{"version":3,"file":"useTableLogic.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableLogic.ts"],"names":[],"mappings":"AAAA,YAAY,CAAA;AAEZ,OAAO,EAAE,QAAQ,EAAE,MAAM,uBAAuB,CAAA;AAEhD,OAAO,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,oCAAoC,CAAA;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,wCAAwC,CAAA;AAM7E,MAAM,UAAU,aAAa,CAAwB,EACjD,IAAI,EACJ,OAAO,EACP,QAAQ,EACR,aAAa,GAAG,IAAI,EACpB,cAAc,EACd,MAAM,GAAG,IAAI,EACb,QAAQ,EACR,gBAAgB,GAAG,KAAK,GACD;IACvB,MAAM,KAAK,GAAG,QAAQ,CAAC;QACnB,QAAQ,EAAE,oBAAoB;QAC9B,IAAI;QACJ,OAAO;QACP,QAAQ;QACR,aAAa;QACb,oBAAoB,EAAE,gBAAgB;QACtC,gBAAgB,EAAE,UAAU;QAC5B,aAAa,EAAE,gBAAgB;YAC3B,CAAC,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE;YAChC,CAAC,CAAC,SAAS;QACf,gBAAgB,EAAE,IAAI;QACtB,YAAY,EAAE,EAAE,OAAO,EAAE,cAAc,IAAI,EAAE,EAAE;KAClD,CAAC,CAAA;IACF,OAAO;QACH,KAAK;QACL,KAAK,EAAE,YAAY,CAAC,KAAK,EAAE,oBAAoB,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;KACrE,CAAA;AACL,CAAC","sourcesContent":["'use client'\n\nimport { useTable } from '@tanstack/react-table'\nimport type { RowData } from '@tanstack/react-table'\nimport { rentnerTableFeatures } from '../../../lib/Table/table.ts'\nimport { getTableView } from '../../../lib/Table/presentation.ts'\nimport { resolveTableMessages } from '../../../lib/Messages/tableMessages.ts'\nimport type {\n TableLogicOptions,\n TableLogicResult,\n} from '../Types/table.types.ts'\n\nexport function useTableLogic<TData extends RowData>({\n data,\n columns,\n getRowId,\n enableSorting = true,\n initialSorting,\n locale = 'en',\n messages,\n resizableColumns = false,\n}: TableLogicOptions<TData>): TableLogicResult<TData> {\n const table = useTable({\n features: rentnerTableFeatures,\n data,\n columns,\n getRowId,\n enableSorting,\n enableColumnResizing: resizableColumns,\n columnResizeMode: 'onChange',\n defaultColumn: resizableColumns\n ? { minSize: 64, maxSize: 2000 }\n : undefined,\n manualPagination: true,\n initialState: { sorting: initialSorting ?? [] },\n })\n return {\n table,\n state: getTableView(table, resolveTableMessages(locale, messages)),\n }\n}\n"]}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import type { KeyboardEvent, MouseEvent, TouchEvent } from 'react';
|
|
2
|
+
import type { RowData } from '@tanstack/react-table';
|
|
3
|
+
import type { TableColumnResizeHandleProps } from '../Types/interaction.types.ts';
|
|
4
|
+
export declare function useTableResizeHandleLogic<TData extends RowData>({ table, header, messages, disabled, }: TableColumnResizeHandleProps<TData>): {
|
|
5
|
+
state: {
|
|
6
|
+
label: string;
|
|
7
|
+
resetLabel: string;
|
|
8
|
+
min: number;
|
|
9
|
+
max: number;
|
|
10
|
+
size: number;
|
|
11
|
+
isResizing: boolean;
|
|
12
|
+
offset: number;
|
|
13
|
+
};
|
|
14
|
+
handler: {
|
|
15
|
+
handleStart: (event: MouseEvent<HTMLElement> | TouchEvent<HTMLElement>) => void;
|
|
16
|
+
handleReset: () => void;
|
|
17
|
+
handleKeyDown: (event: KeyboardEvent<HTMLElement>) => void;
|
|
18
|
+
};
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=useTableResizeHandleLogic.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableResizeHandleLogic.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableResizeHandleLogic.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAClE,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAEpD,OAAO,KAAK,EAAE,4BAA4B,EAAE,MAAM,+BAA+B,CAAA;AAEjF,wBAAgB,yBAAyB,CAAC,KAAK,SAAS,OAAO,EAAE,EAC7D,KAAK,EACL,MAAM,EACN,QAAQ,EACR,QAAQ,GACX,EAAE,4BAA4B,CAAC,KAAK,CAAC;;;;;;;;;;;6BAQvB,UAAU,CAAC,WAAW,CAAC,GAAG,UAAU,CAAC,WAAW,CAAC;;+BAS9B,aAAa,CAAC,WAAW,CAAC;;EA2C3D"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
import { getColumnLabel } from '../../../lib/Table/presentation.js';
|
|
2
|
+
export function useTableResizeHandleLogic({ table, header, messages, disabled, }) {
|
|
3
|
+
const column = header.column;
|
|
4
|
+
const label = getColumnLabel(column);
|
|
5
|
+
const min = column.columnDef.minSize ?? 20;
|
|
6
|
+
const max = column.columnDef.maxSize ?? 2000;
|
|
7
|
+
const isResizing = column.getIsResizing();
|
|
8
|
+
const direction = table.options.columnResizeDirection === 'rtl' ? -1 : 1;
|
|
9
|
+
const handleStart = (event) => {
|
|
10
|
+
if (disabled || ('button' in event && event.button !== 0))
|
|
11
|
+
return;
|
|
12
|
+
event.stopPropagation();
|
|
13
|
+
header.getResizeHandler(event.currentTarget.ownerDocument)(event);
|
|
14
|
+
};
|
|
15
|
+
const handleReset = () => {
|
|
16
|
+
if (!disabled)
|
|
17
|
+
column.resetSize();
|
|
18
|
+
};
|
|
19
|
+
const handleKeyDown = (event) => {
|
|
20
|
+
if (disabled ||
|
|
21
|
+
!['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key))
|
|
22
|
+
return;
|
|
23
|
+
event.preventDefault();
|
|
24
|
+
event.stopPropagation();
|
|
25
|
+
if (event.key === 'Home') {
|
|
26
|
+
column.resetSize();
|
|
27
|
+
return;
|
|
28
|
+
}
|
|
29
|
+
const size = event.key === 'End'
|
|
30
|
+
? max
|
|
31
|
+
: Math.min(max, Math.max(min, column.getSize() +
|
|
32
|
+
(event.key === 'ArrowLeft' ? -1 : 1) *
|
|
33
|
+
direction *
|
|
34
|
+
(event.shiftKey ? 50 : 10)));
|
|
35
|
+
table.setColumnSizing((current) => ({ ...current, [column.id]: size }));
|
|
36
|
+
};
|
|
37
|
+
return {
|
|
38
|
+
state: {
|
|
39
|
+
label: messages.resizeColumn?.(label) ?? `Resize ${label}`,
|
|
40
|
+
resetLabel: messages.resetColumnSize?.(label) ?? `Reset width of ${label}`,
|
|
41
|
+
min,
|
|
42
|
+
max,
|
|
43
|
+
size: column.getSize(),
|
|
44
|
+
isResizing,
|
|
45
|
+
offset: isResizing && table.options.columnResizeMode === 'onEnd'
|
|
46
|
+
? (table.state.columnResizing.deltaOffset ?? 0)
|
|
47
|
+
: 0,
|
|
48
|
+
},
|
|
49
|
+
handler: { handleStart, handleReset, handleKeyDown },
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
//# sourceMappingURL=useTableResizeHandleLogic.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableResizeHandleLogic.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableResizeHandleLogic.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,cAAc,EAAE,MAAM,oCAAoC,CAAA;AAGnE,MAAM,UAAU,yBAAyB,CAAwB,EAC7D,KAAK,EACL,MAAM,EACN,QAAQ,EACR,QAAQ,GAC0B;IAClC,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAA;IAC5B,MAAM,KAAK,GAAG,cAAc,CAAC,MAAM,CAAC,CAAA;IACpC,MAAM,GAAG,GAAG,MAAM,CAAC,SAAS,CAAC,OAAO,IAAI,EAAE,CAAA;IAC1C,MAAM,GAAG,GAAG,MAAM,CAAC,SAAS,CAAC,OAAO,IAAI,IAAI,CAAA;IAC5C,MAAM,UAAU,GAAG,MAAM,CAAC,aAAa,EAAE,CAAA;IACzC,MAAM,SAAS,GAAG,KAAK,CAAC,OAAO,CAAC,qBAAqB,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;IACxE,MAAM,WAAW,GAAG,CAChB,KAAwD,EAC1D,EAAE;QACA,IAAI,QAAQ,IAAI,CAAC,QAAQ,IAAI,KAAK,IAAI,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC;YAAE,OAAM;QACjE,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,MAAM,CAAC,gBAAgB,CAAC,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,KAAK,CAAC,CAAA;IACrE,CAAC,CAAA;IACD,MAAM,WAAW,GAAG,GAAG,EAAE;QACrB,IAAI,CAAC,QAAQ;YAAE,MAAM,CAAC,SAAS,EAAE,CAAA;IACrC,CAAC,CAAA;IACD,MAAM,aAAa,GAAG,CAAC,KAAiC,EAAE,EAAE;QACxD,IACI,QAAQ;YACR,CAAC,CAAC,WAAW,EAAE,YAAY,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC,QAAQ,CAAC,KAAK,CAAC,GAAG,CAAC;YAE/D,OAAM;QACV,KAAK,CAAC,cAAc,EAAE,CAAA;QACtB,KAAK,CAAC,eAAe,EAAE,CAAA;QACvB,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,EAAE,CAAC;YACvB,MAAM,CAAC,SAAS,EAAE,CAAA;YAClB,OAAM;QACV,CAAC;QACD,MAAM,IAAI,GACN,KAAK,CAAC,GAAG,KAAK,KAAK;YACf,CAAC,CAAC,GAAG;YACL,CAAC,CAAC,IAAI,CAAC,GAAG,CACJ,GAAG,EACH,IAAI,CAAC,GAAG,CACJ,GAAG,EACH,MAAM,CAAC,OAAO,EAAE;gBACZ,CAAC,KAAK,CAAC,GAAG,KAAK,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;oBAChC,SAAS;oBACT,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CACrC,CACJ,CAAA;QACX,KAAK,CAAC,eAAe,CAAC,CAAC,OAAO,EAAE,EAAE,CAAC,CAAC,EAAE,GAAG,OAAO,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAC3E,CAAC,CAAA;IACD,OAAO;QACH,KAAK,EAAE;YACH,KAAK,EAAE,QAAQ,CAAC,YAAY,EAAE,CAAC,KAAK,CAAC,IAAI,UAAU,KAAK,EAAE;YAC1D,UAAU,EACN,QAAQ,CAAC,eAAe,EAAE,CAAC,KAAK,CAAC,IAAI,kBAAkB,KAAK,EAAE;YAClE,GAAG;YACH,GAAG;YACH,IAAI,EAAE,MAAM,CAAC,OAAO,EAAE;YACtB,UAAU;YACV,MAAM,EACF,UAAU,IAAI,KAAK,CAAC,OAAO,CAAC,gBAAgB,KAAK,OAAO;gBACpD,CAAC,CAAC,CAAC,KAAK,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,IAAI,CAAC,CAAC;gBAC/C,CAAC,CAAC,CAAC;SACd;QACD,OAAO,EAAE,EAAE,WAAW,EAAE,WAAW,EAAE,aAAa,EAAE;KACvD,CAAA;AACL,CAAC","sourcesContent":["import type { KeyboardEvent, MouseEvent, TouchEvent } from 'react'\nimport type { RowData } from '@tanstack/react-table'\nimport { getColumnLabel } from '../../../lib/Table/presentation.ts'\nimport type { TableColumnResizeHandleProps } from '../Types/interaction.types.ts'\n\nexport function useTableResizeHandleLogic<TData extends RowData>({\n table,\n header,\n messages,\n disabled,\n}: TableColumnResizeHandleProps<TData>) {\n const column = header.column\n const label = getColumnLabel(column)\n const min = column.columnDef.minSize ?? 20\n const max = column.columnDef.maxSize ?? 2000\n const isResizing = column.getIsResizing()\n const direction = table.options.columnResizeDirection === 'rtl' ? -1 : 1\n const handleStart = (\n event: MouseEvent<HTMLElement> | TouchEvent<HTMLElement>,\n ) => {\n if (disabled || ('button' in event && event.button !== 0)) return\n event.stopPropagation()\n header.getResizeHandler(event.currentTarget.ownerDocument)(event)\n }\n const handleReset = () => {\n if (!disabled) column.resetSize()\n }\n const handleKeyDown = (event: KeyboardEvent<HTMLElement>) => {\n if (\n disabled ||\n !['ArrowLeft', 'ArrowRight', 'Home', 'End'].includes(event.key)\n )\n return\n event.preventDefault()\n event.stopPropagation()\n if (event.key === 'Home') {\n column.resetSize()\n return\n }\n const size =\n event.key === 'End'\n ? max\n : Math.min(\n max,\n Math.max(\n min,\n column.getSize() +\n (event.key === 'ArrowLeft' ? -1 : 1) *\n direction *\n (event.shiftKey ? 50 : 10),\n ),\n )\n table.setColumnSizing((current) => ({ ...current, [column.id]: size }))\n }\n return {\n state: {\n label: messages.resizeColumn?.(label) ?? `Resize ${label}`,\n resetLabel:\n messages.resetColumnSize?.(label) ?? `Reset width of ${label}`,\n min,\n max,\n size: column.getSize(),\n isResizing,\n offset:\n isResizing && table.options.columnResizeMode === 'onEnd'\n ? (table.state.columnResizing.deltaOffset ?? 0)\n : 0,\n },\n handler: { handleStart, handleReset, handleKeyDown },\n }\n}\n"]}
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import type { ComponentType } from 'react';
|
|
2
|
+
import type { TableDragGroupProps } from '../Types/interaction.types.ts';
|
|
3
|
+
export declare const TableRowDragContext: import("react").Context<ComponentType<TableDragGroupProps> | null>;
|
|
4
|
+
export declare function useTableRowDragContext(): ComponentType<TableDragGroupProps> | null;
|
|
5
|
+
//# sourceMappingURL=useTableRowDragContext.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableRowDragContext.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableRowDragContext.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,OAAO,CAAA;AAC1C,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,+BAA+B,CAAA;AAExE,eAAO,MAAM,mBAAmB,oEACkC,CAAA;AAElE,wBAAgB,sBAAsB,8CAErC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableRowDragContext.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableRowDragContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAIjD,MAAM,CAAC,MAAM,mBAAmB,GAC5B,aAAa,CAA4C,IAAI,CAAC,CAAA;AAElE,MAAM,UAAU,sBAAsB;IAClC,OAAO,UAAU,CAAC,mBAAmB,CAAC,CAAA;AAC1C,CAAC","sourcesContent":["import { createContext, useContext } from 'react'\nimport type { ComponentType } from 'react'\nimport type { TableDragGroupProps } from '../Types/interaction.types.ts'\n\nexport const TableRowDragContext =\n createContext<ComponentType<TableDragGroupProps> | null>(null)\n\nexport function useTableRowDragContext() {\n return useContext(TableRowDragContext)\n}\n"]}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { MouseEvent } from 'react';
|
|
2
|
+
import type { RowData } from '@tanstack/react-table';
|
|
3
|
+
import type { TableRow } from '../Types/dataTable.types.ts';
|
|
4
|
+
import type { TableRowEvents } from '../Types/interaction.types.ts';
|
|
5
|
+
export declare function useTableRowEventsLogic<TData extends RowData>(row: TableRow<TData>, callbacks: TableRowEvents<TData>): {
|
|
6
|
+
handler: {
|
|
7
|
+
handleClick: (event: MouseEvent<HTMLTableRowElement>) => void;
|
|
8
|
+
handleDoubleClick: (event: MouseEvent<HTMLTableRowElement>) => void;
|
|
9
|
+
handleContextMenu: (event: MouseEvent<HTMLTableRowElement>) => void;
|
|
10
|
+
};
|
|
11
|
+
};
|
|
12
|
+
//# sourceMappingURL=useTableRowEventsLogic.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableRowEventsLogic.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableRowEventsLogic.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AACvC,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AACpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAA;AAC3D,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,+BAA+B,CAAA;AAanE,wBAAgB,sBAAsB,CAAC,KAAK,SAAS,OAAO,EACxD,GAAG,EAAE,QAAQ,CAAC,KAAK,CAAC,EACpB,SAAS,EAAE,cAAc,CAAC,KAAK,CAAC;IAG5B,OAAO;QACH,WAAW,UAAU,UAAU,CAAC,mBAAmB,CAAC;QAIpD,iBAAiB,UAAU,UAAU,CAAC,mBAAmB,CAAC;QAI1D,iBAAiB,UAAU,UAAU,CAAC,mBAAmB,CAAC;;EAMrE"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { isTableEventElement } from '../../../lib/Table/events.js';
|
|
2
|
+
function isControl(event) {
|
|
3
|
+
const target = event.target;
|
|
4
|
+
return (isTableEventElement(target) &&
|
|
5
|
+
target.closest('button, a, input, select, textarea, label, summary, [contenteditable]:not([contenteditable="false"]), [role="button"], [role="link"], [role="combobox"], [role="checkbox"], [role="radio"], [role="switch"], [role="textbox"], [role="slider"], [role="spinbutton"], [role="menuitem"], [role="menuitemcheckbox"], [role="menuitemradio"], [data-no-row-click]') !== null);
|
|
6
|
+
}
|
|
7
|
+
export function useTableRowEventsLogic(row, callbacks) {
|
|
8
|
+
return {
|
|
9
|
+
handler: {
|
|
10
|
+
handleClick: (event) => {
|
|
11
|
+
if (!event.defaultPrevented && !isControl(event))
|
|
12
|
+
callbacks.onRowClick?.(row, event);
|
|
13
|
+
},
|
|
14
|
+
handleDoubleClick: (event) => {
|
|
15
|
+
if (!event.defaultPrevented && !isControl(event))
|
|
16
|
+
callbacks.onRowDoubleClick?.(row, event);
|
|
17
|
+
},
|
|
18
|
+
handleContextMenu: (event) => {
|
|
19
|
+
if (!event.defaultPrevented)
|
|
20
|
+
callbacks.onRowContextMenu?.(row, event);
|
|
21
|
+
},
|
|
22
|
+
},
|
|
23
|
+
};
|
|
24
|
+
}
|
|
25
|
+
//# sourceMappingURL=useTableRowEventsLogic.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableRowEventsLogic.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableRowEventsLogic.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,mBAAmB,EAAE,MAAM,8BAA8B,CAAA;AAElE,SAAS,SAAS,CAAC,KAAsC;IACrD,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAA;IAC3B,OAAO,CACH,mBAAmB,CAAC,MAAM,CAAC;QAC3B,MAAM,CAAC,OAAO,CACV,gWAAgW,CACnW,KAAK,IAAI,CACb,CAAA;AACL,CAAC;AAED,MAAM,UAAU,sBAAsB,CAClC,GAAoB,EACpB,SAAgC;IAEhC,OAAO;QACH,OAAO,EAAE;YACL,WAAW,EAAE,CAAC,KAAsC,EAAE,EAAE;gBACpD,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;oBAC5C,SAAS,CAAC,UAAU,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;YAC1C,CAAC;YACD,iBAAiB,EAAE,CAAC,KAAsC,EAAE,EAAE;gBAC1D,IAAI,CAAC,KAAK,CAAC,gBAAgB,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC;oBAC5C,SAAS,CAAC,gBAAgB,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;YAChD,CAAC;YACD,iBAAiB,EAAE,CAAC,KAAsC,EAAE,EAAE;gBAC1D,IAAI,CAAC,KAAK,CAAC,gBAAgB;oBACvB,SAAS,CAAC,gBAAgB,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;YAChD,CAAC;SACJ;KACJ,CAAA;AACL,CAAC","sourcesContent":["import type { MouseEvent } from 'react'\nimport type { RowData } from '@tanstack/react-table'\nimport type { TableRow } from '../Types/dataTable.types.ts'\nimport type { TableRowEvents } from '../Types/interaction.types.ts'\nimport { isTableEventElement } from '../../../lib/Table/events.ts'\n\nfunction isControl(event: MouseEvent<HTMLTableRowElement>): boolean {\n const target = event.target\n return (\n isTableEventElement(target) &&\n target.closest(\n 'button, a, input, select, textarea, label, summary, [contenteditable]:not([contenteditable=\"false\"]), [role=\"button\"], [role=\"link\"], [role=\"combobox\"], [role=\"checkbox\"], [role=\"radio\"], [role=\"switch\"], [role=\"textbox\"], [role=\"slider\"], [role=\"spinbutton\"], [role=\"menuitem\"], [role=\"menuitemcheckbox\"], [role=\"menuitemradio\"], [data-no-row-click]',\n ) !== null\n )\n}\n\nexport function useTableRowEventsLogic<TData extends RowData>(\n row: TableRow<TData>,\n callbacks: TableRowEvents<TData>,\n) {\n return {\n handler: {\n handleClick: (event: MouseEvent<HTMLTableRowElement>) => {\n if (!event.defaultPrevented && !isControl(event))\n callbacks.onRowClick?.(row, event)\n },\n handleDoubleClick: (event: MouseEvent<HTMLTableRowElement>) => {\n if (!event.defaultPrevented && !isControl(event))\n callbacks.onRowDoubleClick?.(row, event)\n },\n handleContextMenu: (event: MouseEvent<HTMLTableRowElement>) => {\n if (!event.defaultPrevented)\n callbacks.onRowContextMenu?.(row, event)\n },\n },\n }\n}\n"]}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { RowData } from '@tanstack/react-table';
|
|
2
|
+
import type { DataTableLogicOptions } from '../Types/dataTable.types.ts';
|
|
3
|
+
export declare function useTableRowOrder<TData extends RowData>({ data, getRowId, reorderableRows, onRowOrderChange, }: Pick<DataTableLogicOptions<TData>, 'data' | 'getRowId' | 'reorderableRows' | 'onRowOrderChange'>): {
|
|
4
|
+
state: {
|
|
5
|
+
data: readonly TData[];
|
|
6
|
+
};
|
|
7
|
+
handler: {
|
|
8
|
+
handleReorder: (activeId: string, overId: string) => void;
|
|
9
|
+
};
|
|
10
|
+
};
|
|
11
|
+
//# sourceMappingURL=useTableRowOrder.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableRowOrder.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableRowOrder.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AAKpD,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,6BAA6B,CAAA;AAExE,wBAAgB,gBAAgB,CAAC,KAAK,SAAS,OAAO,EAAE,EACpD,IAAI,EACJ,QAAQ,EACR,eAAe,EACf,gBAAgB,GACnB,EAAE,IAAI,CACH,qBAAqB,CAAC,KAAK,CAAC,EAC5B,MAAM,GAAG,UAAU,GAAG,iBAAiB,GAAG,kBAAkB,CAC/D;;QAcqB,IAAI;;;kCAPW,MAAM,UAAU,MAAM;;EAQ1D"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { useMemo, useState } from 'react';
|
|
2
|
+
import { applyTableRowOrder, moveTableRow, } from '../../../lib/Table/rowOrder.js';
|
|
3
|
+
export function useTableRowOrder({ data, getRowId, reorderableRows, onRowOrderChange, }) {
|
|
4
|
+
const [order, setOrder] = useState();
|
|
5
|
+
const rows = useMemo(() => onRowOrderChange ? data : applyTableRowOrder(data, order, getRowId), [data, order, getRowId, onRowOrderChange]);
|
|
6
|
+
const handleReorder = (activeId, overId) => {
|
|
7
|
+
if (!reorderableRows)
|
|
8
|
+
return;
|
|
9
|
+
const result = moveTableRow(rows, getRowId, activeId, overId);
|
|
10
|
+
if (!result)
|
|
11
|
+
return;
|
|
12
|
+
if (onRowOrderChange)
|
|
13
|
+
onRowOrderChange(result.data, result.change);
|
|
14
|
+
else
|
|
15
|
+
setOrder(result.data.map(getRowId));
|
|
16
|
+
};
|
|
17
|
+
return { state: { data: rows }, handler: { handleReorder } };
|
|
18
|
+
}
|
|
19
|
+
//# sourceMappingURL=useTableRowOrder.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useTableRowOrder.js","sourceRoot":"","sources":["../../../../src/shared/Table/Hooks/useTableRowOrder.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEzC,OAAO,EACH,kBAAkB,EAClB,YAAY,GACf,MAAM,gCAAgC,CAAA;AAGvC,MAAM,UAAU,gBAAgB,CAAwB,EACpD,IAAI,EACJ,QAAQ,EACR,eAAe,EACf,gBAAgB,GAInB;IACG,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,EAAY,CAAA;IAC9C,MAAM,IAAI,GAAG,OAAO,CAChB,GAAG,EAAE,CACD,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,kBAAkB,CAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,CAAC,EACvE,CAAC,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,gBAAgB,CAAC,CAC5C,CAAA;IACD,MAAM,aAAa,GAAG,CAAC,QAAgB,EAAE,MAAc,EAAE,EAAE;QACvD,IAAI,CAAC,eAAe;YAAE,OAAM;QAC5B,MAAM,MAAM,GAAG,YAAY,CAAC,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;QAC7D,IAAI,CAAC,MAAM;YAAE,OAAM;QACnB,IAAI,gBAAgB;YAAE,gBAAgB,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,MAAM,CAAC,CAAA;;YAC7D,QAAQ,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAA;IAC5C,CAAC,CAAA;IACD,OAAO,EAAE,KAAK,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,EAAE,aAAa,EAAE,EAAE,CAAA;AAChE,CAAC","sourcesContent":["import { useMemo, useState } from 'react'\nimport type { RowData } from '@tanstack/react-table'\nimport {\n applyTableRowOrder,\n moveTableRow,\n} from '../../../lib/Table/rowOrder.ts'\nimport type { DataTableLogicOptions } from '../Types/dataTable.types.ts'\n\nexport function useTableRowOrder<TData extends RowData>({\n data,\n getRowId,\n reorderableRows,\n onRowOrderChange,\n}: Pick<\n DataTableLogicOptions<TData>,\n 'data' | 'getRowId' | 'reorderableRows' | 'onRowOrderChange'\n>) {\n const [order, setOrder] = useState<string[]>()\n const rows = useMemo(\n () =>\n onRowOrderChange ? data : applyTableRowOrder(data, order, getRowId),\n [data, order, getRowId, onRowOrderChange],\n )\n const handleReorder = (activeId: string, overId: string) => {\n if (!reorderableRows) return\n const result = moveTableRow(rows, getRowId, activeId, overId)\n if (!result) return\n if (onRowOrderChange) onRowOrderChange(result.data, result.change)\n else setOrder(result.data.map(getRowId))\n }\n return { state: { data: rows }, handler: { handleReorder } }\n}\n"]}
|
|
@@ -3,6 +3,7 @@ import type { ComponentPropsWithRef, ReactNode, RefObject } from 'react';
|
|
|
3
3
|
import type { MenuItem } from '@rentnerkev/menu';
|
|
4
4
|
import type { TableDateRange } from './column.types.ts';
|
|
5
5
|
import type { rentnerTableFeatures } from '../../../lib/Table/table.ts';
|
|
6
|
+
import type { TableRowEvents, TableRowOrderChange } from './interaction.types.ts';
|
|
6
7
|
import type { RentnerTableInstance, RentnerTableOptions, TableLogicResult, TableLocale, TableMessages, TableSize } from './table.types.ts';
|
|
7
8
|
export type TableRow<TData extends RowData> = Row<typeof rentnerTableFeatures, TData>;
|
|
8
9
|
export type TableColumnInstance<TData extends RowData> = Column<typeof rentnerTableFeatures, TData, unknown>;
|
|
@@ -22,6 +23,7 @@ export interface DataTableClassNames {
|
|
|
22
23
|
footer?: string;
|
|
23
24
|
}
|
|
24
25
|
export type DataTableLogicOptions<TData extends RowData> = Pick<RentnerTableOptions<TData>, 'data' | 'columns'> & {
|
|
26
|
+
/** Stable record identity, independent of position, for selection and reordering. */
|
|
25
27
|
getRowId: (row: TData, index: number) => string;
|
|
26
28
|
locale?: TableLocale;
|
|
27
29
|
messages?: Partial<TableMessages>;
|
|
@@ -32,10 +34,17 @@ export type DataTableLogicOptions<TData extends RowData> = Pick<RentnerTableOpti
|
|
|
32
34
|
getRowLabel?: (row: TData) => string;
|
|
33
35
|
renderExpandedRow?: (row: TableRow<TData>) => ReactNode;
|
|
34
36
|
initialShowFilters?: boolean;
|
|
37
|
+
/** Enable horizontal drag handles and keyboard column resizing. Defaults to false. */
|
|
38
|
+
resizableColumns?: boolean;
|
|
39
|
+
/** Enable drag handles, row previews and keyboard reordering. Clear sorting to reorder. */
|
|
40
|
+
reorderableRows?: boolean;
|
|
41
|
+
/** Receive the reordered input data. With this callback, the caller owns and updates data. */
|
|
42
|
+
onRowOrderChange?: (data: TData[], change: TableRowOrderChange) => void;
|
|
35
43
|
tableOptions?: Omit<RentnerTableOptions<TData>, 'data' | 'columns' | 'getRowId' | 'enableRowSelection'>;
|
|
36
44
|
portalContainer?: Element | DocumentFragment | null;
|
|
37
45
|
};
|
|
38
|
-
export type DataTableProps<TData extends RowData> = DataTableLogicOptions<TData> & {
|
|
46
|
+
export type DataTableProps<TData extends RowData> = DataTableLogicOptions<TData> & TableRowEvents<TData> & {
|
|
47
|
+
tableProps?: Omit<ComponentPropsWithRef<'table'>, 'children' | 'dangerouslySetInnerHTML'>;
|
|
39
48
|
title?: ReactNode;
|
|
40
49
|
description?: ReactNode;
|
|
41
50
|
icon?: ReactNode;
|
|
@@ -100,6 +109,7 @@ export interface DataTableLogicResult<TData extends RowData> {
|
|
|
100
109
|
handlePreviousPage: () => void;
|
|
101
110
|
handleNextPage: () => void;
|
|
102
111
|
handleLastPage: () => void;
|
|
112
|
+
handleRowReorder: (activeId: string, overId: string) => void;
|
|
103
113
|
};
|
|
104
114
|
refs: {
|
|
105
115
|
root: (element: HTMLElement | null) => void;
|
|
@@ -112,7 +122,7 @@ export type DataTableToolbarProps<TData extends RowData> = {
|
|
|
112
122
|
table: RentnerTableInstance<TData>;
|
|
113
123
|
className?: string;
|
|
114
124
|
};
|
|
115
|
-
export type TableSurfaceProps<TData extends RowData> = Omit<ComponentPropsWithRef<'table'>, 'children'> & {
|
|
125
|
+
export type TableSurfaceProps<TData extends RowData> = Omit<ComponentPropsWithRef<'table'>, 'children'> & TableRowEvents<TData> & {
|
|
116
126
|
table: RentnerTableInstance<TData>;
|
|
117
127
|
view: TableLogicResult<TData>['state'];
|
|
118
128
|
caption?: ReactNode;
|
|
@@ -138,6 +148,9 @@ export type TableSurfaceProps<TData extends RowData> = Omit<ComponentPropsWithRe
|
|
|
138
148
|
detailsId?: string;
|
|
139
149
|
filters?: ReactNode;
|
|
140
150
|
detailedStates?: boolean;
|
|
151
|
+
resizableColumns?: boolean;
|
|
152
|
+
reorderableRows?: boolean;
|
|
153
|
+
onRowReorder?: (activeId: string, overId: string) => void;
|
|
141
154
|
};
|
|
142
155
|
export type TableButtonProps = ComponentPropsWithRef<'button'> & {
|
|
143
156
|
active?: boolean;
|
|
@@ -169,8 +182,8 @@ export interface TableDateRangeFilterProps {
|
|
|
169
182
|
locale: TableLocale;
|
|
170
183
|
disabled?: boolean;
|
|
171
184
|
}
|
|
172
|
-
export type TableHeadProps<TData extends RowData> = Pick<TableSurfaceProps<TData>, 'table' | 'view' | 'selection' | 'onSelectPage' | 'renderExpandedRow' | 'isLoading' | 'filters' | 'classNames' | 'stickyHeader'>;
|
|
173
|
-
export type TableBodyProps<TData extends RowData> = Pick<TableSurfaceProps<TData>, 'table' | 'view' | 'selection' | 'renderExpandedRow' | 'getRowLabel' | 'detailsId' | 'classNames' | 'rowClassName' | 'isLoading'>;
|
|
185
|
+
export type TableHeadProps<TData extends RowData> = Pick<TableSurfaceProps<TData>, 'table' | 'view' | 'selection' | 'onSelectPage' | 'renderExpandedRow' | 'isLoading' | 'filters' | 'classNames' | 'stickyHeader' | 'resizableColumns' | 'reorderableRows'>;
|
|
186
|
+
export type TableBodyProps<TData extends RowData> = Pick<TableSurfaceProps<TData>, 'table' | 'view' | 'selection' | 'renderExpandedRow' | 'getRowLabel' | 'detailsId' | 'classNames' | 'rowClassName' | 'isLoading' | 'striped' | 'reorderableRows' | 'resizableColumns' | 'onRowClick' | 'onRowDoubleClick' | 'onRowContextMenu' | 'onCellClick' | 'onCellDoubleClick' | 'onCellContextMenu'>;
|
|
174
187
|
export type TableStatusProps = Pick<TableSurfaceProps<object>, 'isLoading' | 'loadingState' | 'emptyState' | 'noResultsState' | 'hasFilters' | 'error' | 'onRetry' | 'onResetFilters' | 'detailedStates'> & {
|
|
175
188
|
view: {
|
|
176
189
|
columnCount: number;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dataTable.types.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Types/dataTable.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAA;AACjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AACvD,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,6BAA6B,CAAA;AACvE,OAAO,KAAK,EACR,oBAAoB,EACpB,mBAAmB,EACnB,gBAAgB,EAChB,WAAW,EACX,aAAa,EACb,SAAS,EACZ,MAAM,kBAAkB,CAAA;AAEzB,MAAM,MAAM,QAAQ,CAAC,KAAK,SAAS,OAAO,IAAI,GAAG,CAC7C,OAAO,oBAAoB,EAC3B,KAAK,CACR,CAAA;AACD,MAAM,MAAM,mBAAmB,CAAC,KAAK,SAAS,OAAO,IAAI,MAAM,CAC3D,OAAO,oBAAoB,EAC3B,KAAK,EACL,OAAO,CACV,CAAA;AAED,MAAM,WAAW,gBAAgB,CAAC,KAAK,SAAS,OAAO;IACnD,KAAK,EAAE,oBAAoB,CAAC,KAAK,CAAC,CAAA;IAClC,YAAY,EAAE,SAAS,QAAQ,CAAC,KAAK,CAAC,EAAE,CAAA;CAC3C;AAED,MAAM,WAAW,mBAAmB;IAChC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,MAAM,CAAC,EAAE,MAAM,CAAA;CAClB;AAED,MAAM,MAAM,qBAAqB,CAAC,KAAK,SAAS,OAAO,IAAI,IAAI,CAC3D,mBAAmB,CAAC,KAAK,CAAC,EAC1B,MAAM,GAAG,SAAS,CACrB,GAAG;IACA,QAAQ,EAAE,CAAC,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAA;IAC/C,MAAM,CAAC,EAAE,WAAW,CAAA;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC,aAAa,CAAC,CAAA;IACjC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,eAAe,CAAC,EAAE,SAAS,MAAM,EAAE,CAAA;IACnC,UAAU,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,GAAG,EAAE,QAAQ,CAAC,KAAK,CAAC,KAAK,OAAO,CAAC,CAAA;IAC1D,WAAW,CAAC,EAAE,CAAC,GAAG,EAAE,KAAK,KAAK,MAAM,CAAA;IACpC,iBAAiB,CAAC,EAAE,CAAC,GAAG,EAAE,QAAQ,CAAC,KAAK,CAAC,KAAK,SAAS,CAAA;IACvD,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,YAAY,CAAC,EAAE,IAAI,CACf,mBAAmB,CAAC,KAAK,CAAC,EAC1B,MAAM,GAAG,SAAS,GAAG,UAAU,GAAG,oBAAoB,CACzD,CAAA;IACD,eAAe,CAAC,EAAE,OAAO,GAAG,gBAAgB,GAAG,IAAI,CAAA;CACtD,CAAA;AAED,MAAM,MAAM,cAAc,CAAC,KAAK,SAAS,OAAO,IAC5C,qBAAqB,CAAC,KAAK,CAAC,GAAG;
|
|
1
|
+
{"version":3,"file":"dataTable.types.d.ts","sourceRoot":"","sources":["../../../../src/shared/Table/Types/dataTable.types.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dataTable.types.js","sourceRoot":"","sources":["../../../../src/shared/Table/Types/dataTable.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Column, Row, RowData } from '@tanstack/react-table'\nimport type { ComponentPropsWithRef, ReactNode, RefObject } from 'react'\nimport type { MenuItem } from '@rentnerkev/menu'\nimport type { TableDateRange } from './column.types.ts'\nimport type { rentnerTableFeatures } from '../../../lib/Table/table.ts'\nimport type {\n RentnerTableInstance,\n RentnerTableOptions,\n TableLogicResult,\n TableLocale,\n TableMessages,\n TableSize,\n} from './table.types.ts'\n\nexport type TableRow<TData extends RowData> = Row<\n typeof rentnerTableFeatures,\n TData\n>\nexport type TableColumnInstance<TData extends RowData> = Column<\n typeof rentnerTableFeatures,\n TData,\n unknown\n>\n\nexport interface DataTableContext<TData extends RowData> {\n table: RentnerTableInstance<TData>\n selectedRows: readonly TableRow<TData>[]\n}\n\nexport interface DataTableClassNames {\n root?: string\n toolbar?: string\n viewport?: string\n table?: string\n header?: string\n headerCell?: string\n row?: string\n cell?: string\n footer?: string\n}\n\nexport type DataTableLogicOptions<TData extends RowData> = Pick<\n RentnerTableOptions<TData>,\n 'data' | 'columns'\n> & {\n getRowId: (row: TData, index: number) => string\n locale?: TableLocale\n messages?: Partial<TableMessages>\n pagination?: boolean\n pageSize?: number\n pageSizeOptions?: readonly number[]\n selectable?: boolean | ((row: TableRow<TData>) => boolean)\n getRowLabel?: (row: TData) => string\n renderExpandedRow?: (row: TableRow<TData>) => ReactNode\n initialShowFilters?: boolean\n tableOptions?: Omit<\n RentnerTableOptions<TData>,\n 'data' | 'columns' | 'getRowId' | 'enableRowSelection'\n >\n portalContainer?: Element | DocumentFragment | null\n}\n\nexport type DataTableProps<TData extends RowData> =\n DataTableLogicOptions<TData> & {\n
|
|
1
|
+
{"version":3,"file":"dataTable.types.js","sourceRoot":"","sources":["../../../../src/shared/Table/Types/dataTable.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { Column, Row, RowData } from '@tanstack/react-table'\nimport type { ComponentPropsWithRef, ReactNode, RefObject } from 'react'\nimport type { MenuItem } from '@rentnerkev/menu'\nimport type { TableDateRange } from './column.types.ts'\nimport type { rentnerTableFeatures } from '../../../lib/Table/table.ts'\nimport type {\n TableRowEvents,\n TableRowOrderChange,\n} from './interaction.types.ts'\nimport type {\n RentnerTableInstance,\n RentnerTableOptions,\n TableLogicResult,\n TableLocale,\n TableMessages,\n TableSize,\n} from './table.types.ts'\n\nexport type TableRow<TData extends RowData> = Row<\n typeof rentnerTableFeatures,\n TData\n>\nexport type TableColumnInstance<TData extends RowData> = Column<\n typeof rentnerTableFeatures,\n TData,\n unknown\n>\n\nexport interface DataTableContext<TData extends RowData> {\n table: RentnerTableInstance<TData>\n selectedRows: readonly TableRow<TData>[]\n}\n\nexport interface DataTableClassNames {\n root?: string\n toolbar?: string\n viewport?: string\n table?: string\n header?: string\n headerCell?: string\n row?: string\n cell?: string\n footer?: string\n}\n\nexport type DataTableLogicOptions<TData extends RowData> = Pick<\n RentnerTableOptions<TData>,\n 'data' | 'columns'\n> & {\n /** Stable record identity, independent of position, for selection and reordering. */\n getRowId: (row: TData, index: number) => string\n locale?: TableLocale\n messages?: Partial<TableMessages>\n pagination?: boolean\n pageSize?: number\n pageSizeOptions?: readonly number[]\n selectable?: boolean | ((row: TableRow<TData>) => boolean)\n getRowLabel?: (row: TData) => string\n renderExpandedRow?: (row: TableRow<TData>) => ReactNode\n initialShowFilters?: boolean\n /** Enable horizontal drag handles and keyboard column resizing. Defaults to false. */\n resizableColumns?: boolean\n /** Enable drag handles, row previews and keyboard reordering. Clear sorting to reorder. */\n reorderableRows?: boolean\n /** Receive the reordered input data. With this callback, the caller owns and updates data. */\n onRowOrderChange?: (data: TData[], change: TableRowOrderChange) => void\n tableOptions?: Omit<\n RentnerTableOptions<TData>,\n 'data' | 'columns' | 'getRowId' | 'enableRowSelection'\n >\n portalContainer?: Element | DocumentFragment | null\n}\n\nexport type DataTableProps<TData extends RowData> =\n DataTableLogicOptions<TData> &\n TableRowEvents<TData> & {\n tableProps?: Omit<\n ComponentPropsWithRef<'table'>,\n 'children' | 'dangerouslySetInnerHTML'\n >\n title?: ReactNode\n description?: ReactNode\n icon?: ReactNode\n searchable?: boolean\n searchPlaceholder?: string\n columnFilters?: boolean\n columnVisibility?: boolean\n isLoading?: boolean\n isRefreshing?: boolean\n error?: ReactNode\n onRetry?: () => void\n emptyState?: ReactNode\n loadingState?: ReactNode\n noResultsState?: ReactNode\n size?: TableSize\n striped?: boolean\n stickyHeader?: boolean\n className?: string\n classNames?: DataTableClassNames\n toolbarActions?:\n ReactNode | ((context: DataTableContext<TData>) => ReactNode)\n bulkActions?: (context: DataTableContext<TData>) => ReactNode\n rowClassName?: (row: TableRow<TData>) => string | undefined\n }\n\nexport interface DataTableLogicResult<TData extends RowData> {\n table: RentnerTableInstance<TData>\n state: TableLogicResult<TData>['state'] & {\n id: string\n search: string\n showFilters: boolean\n hasFilters: boolean\n filterCount: number\n filterColumns: TableColumnInstance<TData>[]\n columnItems: MenuItem[]\n selectedRows: TableRow<TData>[]\n selectionCount: number\n selectionEnabled: boolean\n canSelectPage: boolean\n allPageSelected: boolean\n somePageSelected: boolean\n firstRow: number\n lastRow: number\n totalRows: number | null\n totalPages: number | null\n page: number\n pageSize: number\n pageSizes: { value: number; label: string }[]\n canPreviousPage: boolean\n canNextPage: boolean\n portalContainer: Element | DocumentFragment | null\n }\n handler: {\n handleSearch: (value: string) => void\n handleToggleFilters: () => void\n handleResetFilters: () => void\n handleClearSelection: () => void\n handleSelectPage: () => void\n handlePageSize: (value: number) => void\n handleFirstPage: () => void\n handlePreviousPage: () => void\n handleNextPage: () => void\n handleLastPage: () => void\n handleRowReorder: (activeId: string, overId: string) => void\n }\n refs: { root: (element: HTMLElement | null) => void }\n}\n\nexport type DataTableToolbarProps<TData extends RowData> = {\n state: DataTableLogicResult<TData>['state']\n handler: DataTableLogicResult<TData>['handler']\n options: Pick<\n DataTableProps<TData>,\n | 'title'\n | 'description'\n | 'icon'\n | 'searchable'\n | 'searchPlaceholder'\n | 'columnFilters'\n | 'columnVisibility'\n | 'toolbarActions'\n | 'bulkActions'\n | 'isLoading'\n | 'isRefreshing'\n >\n table: RentnerTableInstance<TData>\n className?: string\n}\n\nexport type TableSurfaceProps<TData extends RowData> = Omit<\n ComponentPropsWithRef<'table'>,\n 'children'\n> &\n TableRowEvents<TData> & {\n table: RentnerTableInstance<TData>\n view: TableLogicResult<TData>['state']\n caption?: ReactNode\n size?: TableSize\n striped?: boolean\n isLoading?: boolean\n emptyState?: ReactNode\n loadingState?: ReactNode\n noResultsState?: ReactNode\n hasFilters?: boolean\n error?: ReactNode\n onRetry?: () => void\n onResetFilters?: () => void\n containerClassName?: string\n embedded?: boolean\n stickyHeader?: boolean\n classNames?: DataTableClassNames\n rowClassName?: DataTableProps<TData>['rowClassName']\n selection?: DataTableLogicResult<TData>['state']\n onSelectPage?: () => void\n getRowLabel?: (row: TData) => string\n renderExpandedRow?: (row: TableRow<TData>) => ReactNode\n detailsId?: string\n filters?: ReactNode\n detailedStates?: boolean\n resizableColumns?: boolean\n reorderableRows?: boolean\n onRowReorder?: (activeId: string, overId: string) => void\n }\n\nexport type TableButtonProps = ComponentPropsWithRef<'button'> & {\n active?: boolean\n iconOnly?: boolean\n}\nexport interface TableCheckboxProps {\n checked: boolean\n indeterminate?: boolean\n disabled?: boolean\n label: string\n onChange: () => void\n}\nexport interface TableCheckboxLogicResult {\n refs: { input: RefObject<HTMLInputElement | null> }\n}\n\nexport interface TableColumnFilterProps<TData extends RowData> {\n column: TableColumnInstance<TData>\n locale: TableLocale\n messages: TableMessages\n disabled?: boolean\n}\n\nexport interface TableDateRangeFilterProps {\n value: unknown\n onValueChange: (value: TableDateRange) => void\n label: string\n placeholder?: string\n locale: TableLocale\n disabled?: boolean\n}\n\nexport type TableHeadProps<TData extends RowData> = Pick<\n TableSurfaceProps<TData>,\n | 'table'\n | 'view'\n | 'selection'\n | 'onSelectPage'\n | 'renderExpandedRow'\n | 'isLoading'\n | 'filters'\n | 'classNames'\n | 'stickyHeader'\n | 'resizableColumns'\n | 'reorderableRows'\n>\nexport type TableBodyProps<TData extends RowData> = Pick<\n TableSurfaceProps<TData>,\n | 'table'\n | 'view'\n | 'selection'\n | 'renderExpandedRow'\n | 'getRowLabel'\n | 'detailsId'\n | 'classNames'\n | 'rowClassName'\n | 'isLoading'\n | 'striped'\n | 'reorderableRows'\n | 'resizableColumns'\n | 'onRowClick'\n | 'onRowDoubleClick'\n | 'onRowContextMenu'\n | 'onCellClick'\n | 'onCellDoubleClick'\n | 'onCellContextMenu'\n>\nexport type TableStatusProps = Pick<\n TableSurfaceProps<object>,\n | 'isLoading'\n | 'loadingState'\n | 'emptyState'\n | 'noResultsState'\n | 'hasFilters'\n | 'error'\n | 'onRetry'\n | 'onResetFilters'\n | 'detailedStates'\n> & { view: { columnCount: number; messages: TableMessages } }\nexport type DataTablePaginationProps<TData extends RowData> = {\n state: DataTableLogicResult<TData>['state']\n handler: DataTableLogicResult<TData>['handler']\n locale: TableLocale\n pagination: boolean\n disabled?: boolean\n className?: string\n}\n\nexport interface TableRowActionsProps {\n label: string\n items: readonly MenuItem[]\n disabled?: boolean\n}\n\nexport interface TableProviderProps {\n children: ReactNode\n portalContainer?: Element | DocumentFragment | null\n}\n"]}
|