@wheelhouse/ui 0.2.3 → 0.2.5

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.
Files changed (118) hide show
  1. package/dist/blocks/columns/columns-types.d.ts +25 -1
  2. package/dist/blocks/columns/columns-types.d.ts.map +1 -1
  3. package/dist/blocks/columns/columns-types.js +4 -0
  4. package/dist/blocks/columns/columns-utils.d.ts +31 -1
  5. package/dist/blocks/columns/columns-utils.d.ts.map +1 -1
  6. package/dist/blocks/columns/columns-utils.js +86 -1
  7. package/dist/blocks/columns/columns.d.ts +1 -1
  8. package/dist/blocks/columns/columns.d.ts.map +1 -1
  9. package/dist/blocks/columns/columns.js +81 -20
  10. package/dist/blocks/columns/columns.stories.d.ts +1 -0
  11. package/dist/blocks/columns/columns.stories.d.ts.map +1 -1
  12. package/dist/blocks/columns/columns.stories.js +21 -1
  13. package/dist/blocks/columns/index.d.ts +1 -1
  14. package/dist/blocks/columns/index.d.ts.map +1 -1
  15. package/dist/blocks/floating-menu-widget/floating-menu-widget.d.ts +26 -0
  16. package/dist/blocks/floating-menu-widget/floating-menu-widget.d.ts.map +1 -0
  17. package/dist/blocks/floating-menu-widget/floating-menu-widget.js +200 -0
  18. package/dist/blocks/floating-menu-widget/floating-menu-widget.stories.d.ts +15 -0
  19. package/dist/blocks/floating-menu-widget/floating-menu-widget.stories.d.ts.map +1 -0
  20. package/dist/blocks/floating-menu-widget/floating-menu-widget.stories.js +22 -0
  21. package/dist/blocks/floating-menu-widget/index.d.ts +3 -0
  22. package/dist/blocks/floating-menu-widget/index.d.ts.map +1 -0
  23. package/dist/blocks/floating-menu-widget/index.js +1 -0
  24. package/dist/blocks/index.d.ts +1 -0
  25. package/dist/blocks/index.d.ts.map +1 -1
  26. package/dist/blocks/index.js +1 -0
  27. package/dist/components/button/button.d.ts +18 -11
  28. package/dist/components/button/button.d.ts.map +1 -1
  29. package/dist/components/button/button.js +27 -14
  30. package/dist/components/button/button.stories.d.ts +11 -0
  31. package/dist/components/button/button.stories.d.ts.map +1 -1
  32. package/dist/components/button/button.stories.js +84 -0
  33. package/dist/components/data-grid/data-grid-column-filter.d.ts +15 -0
  34. package/dist/components/data-grid/data-grid-column-filter.d.ts.map +1 -0
  35. package/dist/components/data-grid/data-grid-column-filter.js +36 -0
  36. package/dist/components/data-grid/data-grid-column-header.d.ts +15 -0
  37. package/dist/components/data-grid/data-grid-column-header.d.ts.map +1 -0
  38. package/dist/components/data-grid/data-grid-column-header.js +137 -0
  39. package/dist/components/data-grid/data-grid-column-visibility.d.ts +8 -0
  40. package/dist/components/data-grid/data-grid-column-visibility.d.ts.map +1 -0
  41. package/dist/components/data-grid/data-grid-column-visibility.js +13 -0
  42. package/dist/components/data-grid/data-grid-pagination.d.ts +20 -0
  43. package/dist/components/data-grid/data-grid-pagination.d.ts.map +1 -0
  44. package/dist/components/data-grid/data-grid-pagination.js +76 -0
  45. package/dist/components/data-grid/data-grid-scroll-area.d.ts +11 -0
  46. package/dist/components/data-grid/data-grid-scroll-area.d.ts.map +1 -0
  47. package/dist/components/data-grid/data-grid-scroll-area.js +218 -0
  48. package/dist/components/data-grid/data-grid-table-dnd-rows.d.ts +12 -0
  49. package/dist/components/data-grid/data-grid-table-dnd-rows.d.ts.map +1 -0
  50. package/dist/components/data-grid/data-grid-table-dnd-rows.js +91 -0
  51. package/dist/components/data-grid/data-grid-table-dnd.d.ts +8 -0
  52. package/dist/components/data-grid/data-grid-table-dnd.d.ts.map +1 -0
  53. package/dist/components/data-grid/data-grid-table-dnd.js +95 -0
  54. package/dist/components/data-grid/data-grid-table-virtual.d.ts +28 -0
  55. package/dist/components/data-grid/data-grid-table-virtual.d.ts.map +1 -0
  56. package/dist/components/data-grid/data-grid-table-virtual.js +133 -0
  57. package/dist/components/data-grid/data-grid-table.d.ts +98 -0
  58. package/dist/components/data-grid/data-grid-table.d.ts.map +1 -0
  59. package/dist/components/data-grid/data-grid-table.js +560 -0
  60. package/dist/components/data-grid/data-grid.d.ts +94 -0
  61. package/dist/components/data-grid/data-grid.d.ts.map +1 -0
  62. package/dist/components/data-grid/data-grid.js +123 -0
  63. package/dist/components/data-grid/data-grid.stories.d.ts +14 -0
  64. package/dist/components/data-grid/data-grid.stories.d.ts.map +1 -0
  65. package/dist/components/data-grid/data-grid.stories.js +47 -0
  66. package/dist/components/data-grid/index.d.ts +14 -0
  67. package/dist/components/data-grid/index.d.ts.map +1 -0
  68. package/dist/components/data-grid/index.js +10 -0
  69. package/dist/components/filters/filter-date-metric-value.d.ts.map +1 -1
  70. package/dist/components/filters/filter-date-metric-value.js +83 -8
  71. package/dist/components/filters/filter-fields-listing-demo.d.ts +12 -0
  72. package/dist/components/filters/filter-fields-listing-demo.d.ts.map +1 -0
  73. package/dist/components/filters/filter-fields-listing-demo.js +565 -0
  74. package/dist/components/filters/filters-types.d.ts +7 -0
  75. package/dist/components/filters/filters-types.d.ts.map +1 -1
  76. package/dist/components/filters/filters.stories.d.ts.map +1 -1
  77. package/dist/components/filters/filters.stories.js +8 -149
  78. package/dist/components/filters/index.d.ts +1 -0
  79. package/dist/components/filters/index.d.ts.map +1 -1
  80. package/dist/components/filters/index.js +1 -0
  81. package/dist/components/index.d.ts +3 -0
  82. package/dist/components/index.d.ts.map +1 -1
  83. package/dist/components/index.js +3 -0
  84. package/dist/components/popover/index.d.ts +1 -0
  85. package/dist/components/popover/index.d.ts.map +1 -1
  86. package/dist/components/popover/index.js +1 -0
  87. package/dist/components/popover/popover-handle.d.ts +6 -0
  88. package/dist/components/popover/popover-handle.d.ts.map +1 -0
  89. package/dist/components/popover/popover-handle.js +6 -0
  90. package/dist/components/popover/popover.d.ts +41 -7
  91. package/dist/components/popover/popover.d.ts.map +1 -1
  92. package/dist/components/popover/popover.js +50 -3
  93. package/dist/components/progress/progress.js +1 -1
  94. package/dist/components/progress/progress.stories.d.ts +11 -2
  95. package/dist/components/progress/progress.stories.d.ts.map +1 -1
  96. package/dist/components/progress/progress.stories.js +77 -4
  97. package/dist/components/sidebar/index.d.ts +2 -0
  98. package/dist/components/sidebar/index.d.ts.map +1 -0
  99. package/dist/components/sidebar/index.js +1 -0
  100. package/dist/components/sidebar/sidebar.d.ts +64 -0
  101. package/dist/components/sidebar/sidebar.d.ts.map +1 -0
  102. package/dist/components/sidebar/sidebar.js +255 -0
  103. package/dist/components/sidebar/sidebar.stories.d.ts +20 -0
  104. package/dist/components/sidebar/sidebar.stories.d.ts.map +1 -0
  105. package/dist/components/sidebar/sidebar.stories.js +181 -0
  106. package/dist/components/skeleton/index.d.ts +3 -0
  107. package/dist/components/skeleton/index.d.ts.map +1 -0
  108. package/dist/components/skeleton/index.js +1 -0
  109. package/dist/components/skeleton/skeleton.d.ts +7 -0
  110. package/dist/components/skeleton/skeleton.d.ts.map +1 -0
  111. package/dist/components/skeleton/skeleton.js +8 -0
  112. package/dist/components/sortable/sortable.d.ts +4 -2
  113. package/dist/components/sortable/sortable.d.ts.map +1 -1
  114. package/dist/components/sortable/sortable.js +4 -2
  115. package/dist/tsconfig.tsbuildinfo +1 -1
  116. package/llms.txt +1 -1
  117. package/package.json +7 -4
  118. package/src/styles/globals.css +26 -0
@@ -0,0 +1,95 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
3
+ import { Fragment, useEffect, useId, useRef, useState } from 'react';
4
+ import { useDataGrid } from './data-grid';
5
+ import { DataGridTableBase, DataGridTableBody, DataGridTableBodyRow, DataGridTableBodyRowCell, DataGridTableBodyRowExpandded, DataGridTableBodyRowSkeleton, DataGridTableBodyRowSkeletonCell, DataGridTableEmpty, DataGridTableFoot, DataGridTableHead, DataGridTableHeadRow, DataGridTableHeadRowCell, DataGridTableHeadRowCellResize, DataGridTableRowSpacer, DataGridTableViewport, } from './data-grid-table';
6
+ import { closestCenter, DndContext, KeyboardSensor, MouseSensor, TouchSensor, useSensor, useSensors } from '@dnd-kit/core';
7
+ import { horizontalListSortingStrategy, SortableContext, useSortable } from '@dnd-kit/sortable';
8
+ import { CSS } from '@dnd-kit/utilities';
9
+ import { flexRender } from '@tanstack/react-table';
10
+ import { Button } from '../button';
11
+ import { GripVerticalIcon } from 'lucide-react';
12
+ function DataGridTableDndHeader({ header }) {
13
+ const { props } = useDataGrid();
14
+ const { column } = header;
15
+ // Check if column ordering is enabled for this column
16
+ const canOrder = column.columnDef.enableColumnOrdering !== false;
17
+ const { attributes, isDragging, listeners, setNodeRef, transform, transition } = useSortable({
18
+ id: header.column.id,
19
+ });
20
+ const style = {
21
+ opacity: isDragging ? 0.8 : 1,
22
+ position: 'relative',
23
+ transform: CSS.Translate.toString(transform),
24
+ transition,
25
+ cursor: isDragging ? 'grabbing' : undefined,
26
+ whiteSpace: 'nowrap',
27
+ width: props.tableLayout?.columnsResizable ? `calc(var(--header-${header.id}-size) * 1px)` : header.column.getSize(),
28
+ zIndex: isDragging ? 1 : 0,
29
+ };
30
+ return (_jsx(DataGridTableHeadRowCell, { header: header, dndStyle: style, dndRef: setNodeRef, children: _jsxs("div", { className: "flex items-center justify-start gap-0.5", children: [canOrder && (_jsx(Button, { size: "icon-sm", variant: "ghost", className: `-ms-2 size-6 ${isDragging ? 'cursor-grabbing' : 'cursor-grab active:cursor-grabbing'}`, ...attributes, ...listeners, "aria-label": "Drag to reorder", children: _jsx(GripVerticalIcon, { className: "opacity-60 hover:opacity-100", "aria-hidden": "true" }) })), _jsx("span", { className: "grow truncate", children: header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext()) }), props.tableLayout?.columnsResizable && column.getCanResize() && _jsx(DataGridTableHeadRowCellResize, { header: header })] }) }));
31
+ }
32
+ function DataGridTableDndCell({ cell }) {
33
+ const { props } = useDataGrid();
34
+ const { isDragging, setNodeRef, transform, transition } = useSortable({
35
+ id: cell.column.id,
36
+ });
37
+ const style = {
38
+ opacity: isDragging ? 0.8 : 1,
39
+ position: 'relative',
40
+ transform: CSS.Translate.toString(transform),
41
+ transition,
42
+ cursor: isDragging ? 'grabbing' : undefined,
43
+ width: props.tableLayout?.columnsResizable ? `calc(var(--col-${cell.column.id}-size) * 1px)` : cell.column.getSize(),
44
+ zIndex: isDragging ? 1 : 0,
45
+ };
46
+ return (_jsx(DataGridTableBodyRowCell, { cell: cell, dndStyle: style, dndRef: setNodeRef, children: flexRender(cell.column.columnDef.cell, cell.getContext()) }));
47
+ }
48
+ function DataGridTableDnd({ handleDragEnd, footerContent }) {
49
+ const { table, isLoading, props } = useDataGrid();
50
+ const pagination = table.getState().pagination;
51
+ const containerRef = useRef(null);
52
+ const [isDraggingColumn, setIsDraggingColumn] = useState(false);
53
+ const sensors = useSensors(useSensor(MouseSensor, {}), useSensor(TouchSensor, {}), useSensor(KeyboardSensor, {}));
54
+ useEffect(() => {
55
+ if (!isDraggingColumn)
56
+ return;
57
+ const { body, documentElement } = document;
58
+ const previousBodyCursor = body.style.cursor;
59
+ const previousDocumentCursor = documentElement.style.cursor;
60
+ body.style.cursor = 'grabbing';
61
+ documentElement.style.cursor = 'grabbing';
62
+ return () => {
63
+ body.style.cursor = previousBodyCursor;
64
+ documentElement.style.cursor = previousDocumentCursor;
65
+ };
66
+ }, [isDraggingColumn]);
67
+ // Custom modifier to restrict dragging within table bounds with edge offset
68
+ const restrictToTableBounds = ({ draggingNodeRect, transform }) => {
69
+ if (!draggingNodeRect || !containerRef.current) {
70
+ return { ...transform, y: 0 };
71
+ }
72
+ const containerRect = containerRef.current.getBoundingClientRect();
73
+ const edgeOffset = 0;
74
+ const minX = containerRect.left - draggingNodeRect.left - edgeOffset;
75
+ const maxX = containerRect.right - draggingNodeRect.left - draggingNodeRect.width + edgeOffset;
76
+ return {
77
+ ...transform,
78
+ x: Math.min(Math.max(transform.x, minX), maxX),
79
+ y: 0, // Lock vertical movement
80
+ };
81
+ };
82
+ return (_jsx(DndContext, { collisionDetection: closestCenter, id: useId(), modifiers: [restrictToTableBounds], onDragCancel: () => setIsDraggingColumn(false), onDragEnd: (event) => {
83
+ setIsDraggingColumn(false);
84
+ handleDragEnd(event);
85
+ }, onDragStart: () => setIsDraggingColumn(true), sensors: sensors, children: _jsx(DataGridTableViewport, { viewportRef: containerRef, className: isDraggingColumn ? 'relative cursor-grabbing [&_*]:cursor-grabbing!' : 'relative', children: _jsxs(DataGridTableBase, { children: [_jsx(DataGridTableHead, { children: table.getHeaderGroups().map((headerGroup, index) => {
86
+ return (_jsx(DataGridTableHeadRow, { headerGroup: headerGroup, children: _jsx(SortableContext, { items: table.getState().columnOrder, strategy: horizontalListSortingStrategy, children: headerGroup.headers.map((header) => (_jsx(DataGridTableDndHeader, { header: header }, header.id))) }) }, index));
87
+ }) }), (props.tableLayout?.stripped || !props.tableLayout?.rowBorder) && _jsx(DataGridTableRowSpacer, {}), _jsx(DataGridTableBody, { children: props.loadingMode === 'skeleton' && isLoading && pagination?.pageSize ? (Array.from({ length: pagination.pageSize }).map((_, rowIndex) => (_jsx(DataGridTableBodyRowSkeleton, { children: table.getVisibleFlatColumns().map((column, colIndex) => {
88
+ return (_jsx(DataGridTableBodyRowSkeletonCell, { column: column, children: column.columnDef.meta?.skeleton }, colIndex));
89
+ }) }, rowIndex)))) : table.getRowModel().rows.length ? (table.getRowModel().rows.map((row) => {
90
+ return (_jsxs(Fragment, { children: [_jsx(DataGridTableBodyRow, { row: row, children: row.getVisibleCells().map((cell) => {
91
+ return (_jsx(SortableContext, { items: table.getState().columnOrder, strategy: horizontalListSortingStrategy, children: _jsx(DataGridTableDndCell, { cell: cell }) }, cell.id));
92
+ }) }), row.getIsExpanded() && _jsx(DataGridTableBodyRowExpandded, { row: row })] }, row.id));
93
+ })) : (_jsx(DataGridTableEmpty, {})) }), footerContent && _jsx(DataGridTableFoot, { children: footerContent })] }) }) }));
94
+ }
95
+ export { DataGridTableDnd };
@@ -0,0 +1,28 @@
1
+ import { type ReactNode } from 'react';
2
+ import { type Row } from '@tanstack/react-table';
3
+ import { type VirtualizerOptions } from '@tanstack/react-virtual';
4
+ type DataGridTableVirtualScrollElements = {
5
+ containerElement: HTMLDivElement | null;
6
+ scrollElement: HTMLElement | null;
7
+ };
8
+ type DataGridTableVirtualizerOptions<TData> = Omit<VirtualizerOptions<HTMLElement, HTMLTableRowElement>, 'count' | 'estimateSize' | 'getItemKey' | 'getScrollElement'> & {
9
+ estimateSize?: (index: number, row: Row<TData>) => number;
10
+ getItemKey?: (index: number, row: Row<TData>) => string | number;
11
+ getScrollElement?: (elements: DataGridTableVirtualScrollElements) => HTMLElement | null;
12
+ };
13
+ interface DataGridTableVirtualProps<TData> {
14
+ height?: number | string;
15
+ estimateSize?: number;
16
+ overscan?: number;
17
+ footerContent?: ReactNode;
18
+ renderHeader?: boolean;
19
+ onFetchMore?: () => void;
20
+ isFetchingMore?: boolean;
21
+ hasMore?: boolean;
22
+ fetchMoreOffset?: number;
23
+ virtualizerOptions?: DataGridTableVirtualizerOptions<TData>;
24
+ }
25
+ declare function DataGridTableVirtual<TData>({ height, estimateSize, overscan, footerContent, renderHeader, onFetchMore, isFetchingMore, hasMore, fetchMoreOffset, virtualizerOptions, }: DataGridTableVirtualProps<TData>): import("react/jsx-runtime").JSX.Element;
26
+ export { DataGridTableVirtual };
27
+ export type { DataGridTableVirtualProps, DataGridTableVirtualScrollElements, DataGridTableVirtualizerOptions };
28
+ //# sourceMappingURL=data-grid-table-virtual.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"data-grid-table-virtual.d.ts","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid-table-virtual.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAQ,KAAK,SAAS,EAA6C,MAAM,OAAO,CAAC;AAgBxF,OAAO,EAAgC,KAAK,GAAG,EAAc,MAAM,uBAAuB,CAAC;AAC3F,OAAO,EAAsD,KAAK,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAKtH,KAAK,kCAAkC,GAAG;IACtC,gBAAgB,EAAE,cAAc,GAAG,IAAI,CAAC;IACxC,aAAa,EAAE,WAAW,GAAG,IAAI,CAAC;CACrC,CAAC;AAIF,KAAK,+BAA+B,CAAC,KAAK,IAAI,IAAI,CAC9C,kBAAkB,CAAC,WAAW,EAAE,mBAAmB,CAAC,EACpD,OAAO,GAAG,cAAc,GAAG,YAAY,GAAG,kBAAkB,CAC/D,GAAG;IACA,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,CAAC,KAAK,CAAC,KAAK,MAAM,CAAC;IAC1D,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,CAAC,KAAK,CAAC,KAAK,MAAM,GAAG,MAAM,CAAC;IACjE,gBAAgB,CAAC,EAAE,CAAC,QAAQ,EAAE,kCAAkC,KAAK,WAAW,GAAG,IAAI,CAAC;CAC3F,CAAC;AAEF,UAAU,yBAAyB,CAAC,KAAK;IACrC,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,aAAa,CAAC,EAAE,SAAS,CAAC;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,IAAI,CAAC;IACzB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,+BAA+B,CAAC,KAAK,CAAC,CAAC;CAC/D;AAuID,iBAAS,oBAAoB,CAAC,KAAK,EAAE,EACjC,MAAM,EACN,YAAiB,EACjB,QAAa,EACb,aAAa,EACb,YAAmB,EACnB,WAAW,EACX,cAAsB,EACtB,OAAO,EACP,eAAmB,EACnB,kBAAkB,GACrB,EAAE,yBAAyB,CAAC,KAAK,CAAC,2CA+IlC;AAED,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAChC,YAAY,EAAE,yBAAyB,EAAE,kCAAkC,EAAE,+BAA+B,EAAE,CAAC"}
@@ -0,0 +1,133 @@
1
+ 'use client';
2
+ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
3
+ import { memo, useCallback, useEffect, useMemo, useState } from 'react';
4
+ import { useDataGrid } from './data-grid';
5
+ import { DataGridTableBase, DataGridTableBody, DataGridTableEmpty, DataGridTableFoot, DataGridTableHead, DataGridTableHeadRow, DataGridTableHeadRowCell, DataGridTableHeadRowCellResize, DataGridTableRenderedRow, DataGridTableRowSpacer, DataGridTableViewport, getDataGridTableRowSections, } from './data-grid-table';
6
+ import { flexRender } from '@tanstack/react-table';
7
+ import { useVirtualizer } from '@tanstack/react-virtual';
8
+ import { Spinner } from '../spinner';
9
+ import { cn } from '../../lib/utils';
10
+ function DataGridTableVirtualSpacer({ columnCount, height }) {
11
+ if (height <= 0)
12
+ return null;
13
+ return (_jsx("tr", { "aria-hidden": "true", children: _jsx("td", { colSpan: columnCount, style: { height, padding: 0 } }) }));
14
+ }
15
+ function DataGridTableVirtualStatusRow({ children, className, columnCount }) {
16
+ return (_jsx("tr", { children: _jsx("td", { colSpan: columnCount, className: cn('py-4 text-center text-sm text-muted-foreground', className), children: children }) }));
17
+ }
18
+ function DataGridTableVirtualBody({ table: _table, columnCount, topRows, centerRows, bottomRows, virtualItems, totalSize, isVirtualizationEnabled, isInfiniteMode, isFetchingMore, hasMore, loadingMoreMessage, allRowsLoadedMessage, measureRowRef, }) {
19
+ const totalRows = topRows.length + centerRows.length + bottomRows.length;
20
+ if (!totalRows)
21
+ return _jsx(DataGridTableEmpty, {});
22
+ const hasCenterRows = centerRows.length > 0;
23
+ const showFetchingRow = isInfiniteMode && isFetchingMore;
24
+ const showCompleteRow = isInfiniteMode && hasMore === false && totalRows > 0;
25
+ const hasMiddleSection = hasCenterRows || showFetchingRow || showCompleteRow;
26
+ const leadingSpacerHeight = isVirtualizationEnabled && hasCenterRows && virtualItems.length > 0 ? (virtualItems[0]?.start ?? 0) : 0;
27
+ const trailingSpacerHeight = isVirtualizationEnabled && hasCenterRows && virtualItems.length > 0 ? Math.max(0, totalSize - (virtualItems[virtualItems.length - 1]?.end ?? 0)) : 0;
28
+ const renderedRows = [];
29
+ topRows.forEach((row, index) => {
30
+ renderedRows.push(_jsx(DataGridTableRenderedRow, { row: row, pinnedBoundary: index === topRows.length - 1 && hasMiddleSection ? 'top' : undefined }, row.id));
31
+ });
32
+ if (isVirtualizationEnabled) {
33
+ if (leadingSpacerHeight > 0) {
34
+ renderedRows.push(_jsx(DataGridTableVirtualSpacer, { columnCount: columnCount, height: leadingSpacerHeight }, "virtual-spacer-start"));
35
+ }
36
+ virtualItems.forEach((virtualRow) => {
37
+ const row = centerRows[virtualRow.index];
38
+ if (!row)
39
+ return;
40
+ renderedRows.push(_jsx(DataGridTableRenderedRow, { row: row, rowRef: measureRowRef }, row.id));
41
+ });
42
+ if (trailingSpacerHeight > 0) {
43
+ renderedRows.push(_jsx(DataGridTableVirtualSpacer, { columnCount: columnCount, height: trailingSpacerHeight }, "virtual-spacer-end"));
44
+ }
45
+ }
46
+ else {
47
+ centerRows.forEach((row) => {
48
+ renderedRows.push(_jsx(DataGridTableRenderedRow, { row: row }, row.id));
49
+ });
50
+ }
51
+ if (showFetchingRow) {
52
+ renderedRows.push(_jsx(DataGridTableVirtualStatusRow, { columnCount: columnCount, children: _jsxs("div", { className: "flex items-center justify-center gap-2", children: [_jsx(Spinner, { className: "size-4 opacity-60" }), loadingMoreMessage] }) }, "virtual-status-loading"));
53
+ }
54
+ if (showCompleteRow) {
55
+ renderedRows.push(_jsx(DataGridTableVirtualStatusRow, { columnCount: columnCount, className: "py-3 text-xs", children: allRowsLoadedMessage }, "virtual-status-complete"));
56
+ }
57
+ bottomRows.forEach((row, index) => {
58
+ renderedRows.push(_jsx(DataGridTableRenderedRow, { row: row, pinnedBoundary: index === 0 && (topRows.length > 0 || hasMiddleSection) ? 'bottom' : undefined }, row.id));
59
+ });
60
+ return _jsx(_Fragment, { children: renderedRows });
61
+ }
62
+ /**
63
+ * Memoized virtual body: skip re-renders during active column resize.
64
+ * Column widths update via CSS variables on the <table> element,
65
+ * so the browser handles width changes without React re-renders.
66
+ */
67
+ const MemoizedVirtualBody = memo(DataGridTableVirtualBody, (_prev, next) => !!next.table.getState().columnSizingInfo.isResizingColumn);
68
+ function DataGridTableVirtual({ height, estimateSize = 48, overscan = 10, footerContent, renderHeader = true, onFetchMore, isFetchingMore = false, hasMore, fetchMoreOffset = 0, virtualizerOptions, }) {
69
+ const { table, props } = useDataGrid();
70
+ const { topRows, centerRows, bottomRows } = getDataGridTableRowSections(table, props.tableLayout?.rowsPinnable);
71
+ const columnCount = table.getVisibleFlatColumns().length + (props.tableLayout?.columnsResizable ? 1 : 0);
72
+ const isInfiniteMode = typeof onFetchMore === 'function';
73
+ const [viewportElements, setViewportElements] = useState({
74
+ containerElement: null,
75
+ scrollElement: null,
76
+ });
77
+ const { estimateSize: customEstimateSize, getItemKey: customGetItemKey, getScrollElement: customGetScrollElement, measureElement: customMeasureElement, overscan: customOverscan, ...virtualizerOptionsRest } = virtualizerOptions ?? {};
78
+ const isVirtualizationEnabled = virtualizerOptions?.enabled !== false;
79
+ const loadingMoreMessage = props.fetchingMoreMessage || props.loadingMessage || 'Loading...';
80
+ const allRowsLoadedMessage = props.allRowsLoadedMessage || 'All records loaded';
81
+ const handleViewportRef = useCallback((node) => {
82
+ setViewportElements({
83
+ containerElement: node,
84
+ scrollElement: node?.closest('[data-slot="scroll-area-viewport"]') ?? node,
85
+ });
86
+ }, []);
87
+ const usesExternalScrollArea = viewportElements.scrollElement !== null && viewportElements.scrollElement !== viewportElements.containerElement;
88
+ const resolveScrollElement = useCallback(() => {
89
+ if (customGetScrollElement) {
90
+ return customGetScrollElement(viewportElements);
91
+ }
92
+ return viewportElements.scrollElement;
93
+ }, [customGetScrollElement, viewportElements]);
94
+ const resolveItemKey = useCallback((index) => {
95
+ const row = centerRows[index];
96
+ if (!row)
97
+ return index;
98
+ return customGetItemKey?.(index, row) ?? row.id ?? index;
99
+ }, [centerRows, customGetItemKey]);
100
+ const resolveEstimateSize = useCallback((index) => {
101
+ const row = centerRows[index];
102
+ return row ? (customEstimateSize?.(index, row) ?? estimateSize) : estimateSize;
103
+ }, [centerRows, customEstimateSize, estimateSize]);
104
+ const virtualizer = useVirtualizer({
105
+ count: centerRows.length,
106
+ getScrollElement: resolveScrollElement,
107
+ getItemKey: resolveItemKey,
108
+ estimateSize: resolveEstimateSize,
109
+ overscan: customOverscan ?? overscan,
110
+ measureElement: customMeasureElement,
111
+ ...virtualizerOptionsRest,
112
+ });
113
+ const virtualItems = isVirtualizationEnabled ? virtualizer.getVirtualItems() : [];
114
+ const totalSize = isVirtualizationEnabled ? virtualizer.getTotalSize() : 0;
115
+ const measureRowRef = isVirtualizationEnabled && customMeasureElement ? virtualizer.measureElement : undefined;
116
+ const resolvedFetchMoreOffset = useMemo(() => Math.max(0, fetchMoreOffset), [fetchMoreOffset]);
117
+ useEffect(() => {
118
+ if (!isVirtualizationEnabled || !isInfiniteMode || hasMore === false || isFetchingMore) {
119
+ return;
120
+ }
121
+ const lastItem = virtualItems[virtualItems.length - 1];
122
+ if (!lastItem)
123
+ return;
124
+ if (lastItem.index >= centerRows.length - 1 - resolvedFetchMoreOffset) {
125
+ onFetchMore?.();
126
+ }
127
+ }, [centerRows.length, hasMore, isFetchingMore, isInfiniteMode, isVirtualizationEnabled, onFetchMore, resolvedFetchMoreOffset, virtualItems]);
128
+ return (_jsx(DataGridTableViewport, { viewportRef: handleViewportRef, className: !usesExternalScrollArea ? 'block' : undefined, style: usesExternalScrollArea ? undefined : { height, overflow: 'auto', position: 'relative' }, children: _jsxs(DataGridTableBase, { children: [renderHeader && (_jsx(DataGridTableHead, { children: table.getHeaderGroups().map((headerGroup, index) => (_jsx(DataGridTableHeadRow, { headerGroup: headerGroup, children: headerGroup.headers.map((header, hIndex) => {
129
+ const { column } = header;
130
+ return (_jsxs(DataGridTableHeadRowCell, { header: header, children: [header.isPlaceholder ? null : props.tableLayout?.columnsResizable && column.getCanResize() ? (_jsx("div", { className: "truncate", children: flexRender(header.column.columnDef.header, header.getContext()) })) : (flexRender(header.column.columnDef.header, header.getContext())), props.tableLayout?.columnsResizable && column.getCanResize() && _jsx(DataGridTableHeadRowCellResize, { header: header })] }, hIndex));
131
+ }) }, index))) })), renderHeader && (props.tableLayout?.stripped || !props.tableLayout?.rowBorder) && _jsx(DataGridTableRowSpacer, {}), _jsx(DataGridTableBody, { children: _jsx(MemoizedVirtualBody, { table: table, columnCount: columnCount, topRows: topRows, centerRows: centerRows, bottomRows: bottomRows, virtualItems: virtualItems, totalSize: totalSize, isVirtualizationEnabled: isVirtualizationEnabled, isInfiniteMode: isInfiniteMode, isFetchingMore: isFetchingMore, hasMore: hasMore, loadingMoreMessage: loadingMoreMessage, allRowsLoadedMessage: allRowsLoadedMessage, measureRowRef: measureRowRef }) }), footerContent && _jsx(DataGridTableFoot, { children: footerContent })] }) }));
132
+ }
133
+ export { DataGridTableVirtual };
@@ -0,0 +1,98 @@
1
+ import { type CSSProperties, type ReactNode, type Ref } from 'react';
2
+ import { type Cell, type Column, type Header, type HeaderGroup, type Row, type Table } from '@tanstack/react-table';
3
+ type DataGridTablePinnedBoundary = 'top' | 'bottom';
4
+ declare function getDataGridTableRowSections<TData>(table: Table<TData>, rowsPinnable?: boolean): {
5
+ topRows: Row<TData>[];
6
+ centerRows: Row<TData>[];
7
+ bottomRows: Row<TData>[];
8
+ };
9
+ declare function getDataGridTableResolvedRows<TData>(table: Table<TData>, rowsPinnable?: boolean): {
10
+ row: Row<TData>;
11
+ pinnedBoundary?: DataGridTablePinnedBoundary;
12
+ }[];
13
+ declare function DataGridTableBase({ children }: {
14
+ children: ReactNode;
15
+ }): import("react/jsx-runtime").JSX.Element;
16
+ declare function DataGridTableViewport({ children, className, viewportRef, style, }: {
17
+ children: ReactNode;
18
+ className?: string;
19
+ viewportRef?: Ref<HTMLDivElement>;
20
+ style?: CSSProperties;
21
+ }): import("react/jsx-runtime").JSX.Element;
22
+ declare function DataGridTableHead({ children }: {
23
+ children: ReactNode;
24
+ }): import("react/jsx-runtime").JSX.Element;
25
+ declare function DataGridTableHeadRow<TData>({ children, headerGroup }: {
26
+ children: ReactNode;
27
+ headerGroup: HeaderGroup<TData>;
28
+ }): import("react/jsx-runtime").JSX.Element;
29
+ declare function DataGridTableHeadRowCell<TData>({ children, header, dndRef, dndStyle, }: {
30
+ children: ReactNode;
31
+ header: Header<TData, unknown>;
32
+ dndRef?: React.Ref<HTMLTableCellElement>;
33
+ dndStyle?: CSSProperties;
34
+ }): import("react/jsx-runtime").JSX.Element;
35
+ declare function DataGridTableHeadRowCellResize<TData>({ header }: {
36
+ header: Header<TData, unknown>;
37
+ }): import("react/jsx-runtime").JSX.Element;
38
+ declare function DataGridTableRowSpacer(): import("react/jsx-runtime").JSX.Element;
39
+ declare function DataGridTableBody({ children }: {
40
+ children: ReactNode;
41
+ }): import("react/jsx-runtime").JSX.Element;
42
+ declare function DataGridTableFoot({ children }: {
43
+ children: ReactNode;
44
+ }): import("react/jsx-runtime").JSX.Element;
45
+ declare function DataGridTableFootRow({ children }: {
46
+ children: ReactNode;
47
+ }): import("react/jsx-runtime").JSX.Element;
48
+ declare function DataGridTableFootRowCell({ children, colSpan, className }: {
49
+ children?: ReactNode;
50
+ colSpan?: number;
51
+ className?: string;
52
+ }): import("react/jsx-runtime").JSX.Element;
53
+ declare function DataGridTableBodyRowSkeleton({ children }: {
54
+ children: ReactNode;
55
+ }): import("react/jsx-runtime").JSX.Element;
56
+ declare function DataGridTableBodyRowSkeletonCell<TData>({ children, column }: {
57
+ children: ReactNode;
58
+ column: Column<TData>;
59
+ }): import("react/jsx-runtime").JSX.Element;
60
+ declare function DataGridTableBodyRow<TData>({ children, row, pinnedBoundary, rowRef, dndRef, dndStyle, }: {
61
+ children: ReactNode;
62
+ row: Row<TData>;
63
+ pinnedBoundary?: DataGridTablePinnedBoundary;
64
+ rowRef?: React.Ref<HTMLTableRowElement>;
65
+ dndRef?: React.Ref<HTMLTableRowElement>;
66
+ dndStyle?: CSSProperties;
67
+ }): import("react/jsx-runtime").JSX.Element;
68
+ declare function DataGridTableBodyRowExpandded<TData>({ row }: {
69
+ row: Row<TData>;
70
+ }): import("react/jsx-runtime").JSX.Element;
71
+ declare function DataGridTableBodyRowCell<TData>({ children, cell, dndRef, dndStyle, }: {
72
+ children: ReactNode;
73
+ cell: Cell<TData, unknown>;
74
+ dndRef?: React.Ref<HTMLTableCellElement>;
75
+ dndStyle?: CSSProperties;
76
+ }): import("react/jsx-runtime").JSX.Element;
77
+ declare function DataGridTableRenderedRow<TData>({ row, pinnedBoundary, rowRef, }: {
78
+ row: Row<TData>;
79
+ pinnedBoundary?: DataGridTablePinnedBoundary;
80
+ rowRef?: React.Ref<HTMLTableRowElement>;
81
+ }): import("react/jsx-runtime").JSX.Element;
82
+ declare function DataGridTableEmpty(): import("react/jsx-runtime").JSX.Element;
83
+ declare function DataGridTableLoader(): import("react/jsx-runtime").JSX.Element;
84
+ declare function DataGridTableRowPin<TData>({ row }: {
85
+ row: Row<TData>;
86
+ }): import("react/jsx-runtime").JSX.Element;
87
+ declare function DataGridTableRowSelect<TData>({ row }: {
88
+ row: Row<TData>;
89
+ }): import("react/jsx-runtime").JSX.Element;
90
+ declare function DataGridTableRowSelectAll(): import("react/jsx-runtime").JSX.Element;
91
+ declare function DataGridTableHeader<TData>(): import("react/jsx-runtime").JSX.Element;
92
+ declare function DataGridTable<TData>({ footerContent, renderHeader }: {
93
+ footerContent?: ReactNode;
94
+ renderHeader?: boolean;
95
+ }): import("react/jsx-runtime").JSX.Element;
96
+ export { DataGridTable, DataGridTableBase, DataGridTableBody, DataGridTableBodyRow, DataGridTableBodyRowCell, DataGridTableBodyRowExpandded, DataGridTableRenderedRow, DataGridTableBodyRowSkeleton, DataGridTableBodyRowSkeletonCell, DataGridTableEmpty, DataGridTableFoot, DataGridTableFootRow, DataGridTableFootRowCell, DataGridTableHeader, DataGridTableHead, DataGridTableHeadRow, DataGridTableHeadRowCell, DataGridTableHeadRowCellResize, DataGridTableLoader, DataGridTableRowPin, DataGridTableRowSelect, DataGridTableRowSelectAll, DataGridTableRowSpacer, DataGridTableViewport, getDataGridTableResolvedRows, getDataGridTableRowSections, };
97
+ export type { DataGridTablePinnedBoundary };
98
+ //# sourceMappingURL=data-grid-table.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"data-grid-table.d.ts","sourceRoot":"","sources":["../../../src/components/data-grid/data-grid-table.tsx"],"names":[],"mappings":"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"}