@vuu-ui/vuu-table 2.1.18 → 2.1.19-beta.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/package.json +13 -16
- package/src/CellFocusState.mjs +25 -0
- package/src/Row.mjs +83 -0
- package/src/Table.css.js +441 -0
- package/src/Table.mjs +297 -0
- package/src/VirtualColSpan.mjs +12 -0
- package/src/applyHighlighting.mjs +28 -0
- package/src/bulk-edit/BulkEditPanel.css.js +27 -0
- package/src/bulk-edit/BulkEditPanel.mjs +77 -0
- package/src/bulk-edit/ColumnCascadingUpdateEditor.css.js +86 -0
- package/src/bulk-edit/ColumnCascadingUpdateEditor.mjs +59 -0
- package/src/bulk-edit/InsertNewRowEditor.css.js +86 -0
- package/src/bulk-edit/InsertNewRowEditor.mjs +59 -0
- package/src/bulk-edit/useBulkEditPanel.mjs +61 -0
- package/src/bulk-edit/useColumnCascadingEditor.mjs +124 -0
- package/src/cell-block/CellBlock.css.js +95 -0
- package/src/cell-block/CellBlock.mjs +32 -0
- package/src/cell-block/cellblock-utils.mjs +114 -0
- package/src/cell-block/useCellBlockSelection.mjs +245 -0
- package/src/cell-renderers/checkbox-cell/CheckboxCell.css.js +16 -0
- package/src/cell-renderers/checkbox-cell/CheckboxCell.mjs +56 -0
- package/src/cell-renderers/checkbox-cell/index.mjs +1 -0
- package/src/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +19 -0
- package/src/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.mjs +34 -0
- package/src/cell-renderers/checkbox-row-selector/index.mjs +1 -0
- package/src/cell-renderers/index.mjs +4 -0
- package/src/cell-renderers/input-cell/InputCell.css.js +81 -0
- package/src/cell-renderers/input-cell/InputCell.mjs +73 -0
- package/src/cell-renderers/input-cell/index.mjs +1 -0
- package/src/cell-renderers/input-cell/useInputCell.mjs +199 -0
- package/src/cell-renderers/toggle-cell/ToggleCell.css.js +31 -0
- package/src/cell-renderers/toggle-cell/ToggleCell.mjs +47 -0
- package/src/cell-renderers/toggle-cell/index.mjs +1 -0
- package/src/column-header-pill/ColumnHeaderPill.css.js +34 -0
- package/src/column-header-pill/ColumnHeaderPill.mjs +39 -0
- package/src/column-header-pill/GroupColumnPill.css.js +10 -0
- package/src/column-header-pill/GroupColumnPill.mjs +33 -0
- package/src/column-header-pill/SortIndicator.css.js +15 -0
- package/src/column-header-pill/SortIndicator.mjs +29 -0
- package/src/column-header-pill/index.mjs +3 -0
- package/src/column-resizing/ColumnResizer.css.js +32 -0
- package/src/column-resizing/ColumnResizer.mjs +69 -0
- package/src/column-resizing/index.mjs +2 -0
- package/src/column-resizing/useTableColumnResize.mjs +57 -0
- package/src/data-row/DataRow.mjs +298 -0
- package/src/header-cell/GroupHeaderCell.css.js +91 -0
- package/src/header-cell/GroupHeaderCell.mjs +98 -0
- package/src/header-cell/HeaderCell.css.js +182 -0
- package/src/header-cell/HeaderCell.mjs +126 -0
- package/src/header-cell/index.mjs +2 -0
- package/src/index.mjs +20 -0
- package/src/pagination/PaginationControl.css.js +18 -0
- package/src/pagination/PaginationControl.mjs +34 -0
- package/src/pagination/index.mjs +1 -0
- package/src/pagination/usePagination.mjs +29 -0
- package/src/table-cell/TableCell.css.js +67 -0
- package/src/table-cell/TableCell.mjs +54 -0
- package/src/table-cell/TableGroupCell.css.js +91 -0
- package/src/table-cell/TableGroupCell.mjs +61 -0
- package/src/table-cell/index.mjs +2 -0
- package/src/table-config/useTableConfig.mjs +49 -0
- package/src/table-config.mjs +38 -0
- package/src/table-data-source/DataRowMovingWindow.mjs +66 -0
- package/src/table-data-source/useDataSource.mjs +177 -0
- package/src/table-dom-utils.mjs +162 -0
- package/src/table-header/HeaderProvider.mjs +14 -0
- package/src/table-header/TableHeader.mjs +182 -0
- package/src/table-header/index.mjs +2 -0
- package/src/table-header/useTableHeader.mjs +69 -0
- package/src/useCell.mjs +22 -0
- package/src/useCellEditing.mjs +58 -0
- package/src/useCellFocus.mjs +112 -0
- package/src/useControlledTableNavigation.mjs +34 -0
- package/src/useEditableCell.mjs +18 -0
- package/src/useInitialValue.mjs +6 -0
- package/src/useKeyboardNavigation.mjs +275 -0
- package/src/useMeasuredHeight.mjs +44 -0
- package/src/useResizeObserver.mjs +118 -0
- package/src/useRowClassNameGenerators.mjs +21 -0
- package/src/useSelection.mjs +101 -0
- package/src/useTable.mjs +588 -0
- package/src/useTableContextMenu.mjs +54 -0
- package/src/useTableModel.mjs +344 -0
- package/src/useTableScroll.mjs +382 -0
- package/src/useTableViewport.mjs +120 -0
- package/types/VirtualColSpan.d.ts +2 -2
- package/types/cell-renderers/toggle-cell/ToggleCell.d.ts +1 -1
- package/types/useTable.d.ts +3 -3
- package/cjs/CellFocusState.js +0 -45
- package/cjs/CellFocusState.js.map +0 -1
- package/cjs/Row.js +0 -116
- package/cjs/Row.js.map +0 -1
- package/cjs/Table.css.js +0 -6
- package/cjs/Table.css.js.map +0 -1
- package/cjs/Table.js +0 -455
- package/cjs/Table.js.map +0 -1
- package/cjs/VirtualColSpan.js +0 -19
- package/cjs/VirtualColSpan.js.map +0 -1
- package/cjs/applyHighlighting.js +0 -33
- package/cjs/applyHighlighting.js.map +0 -1
- package/cjs/bulk-edit/BulkEditPanel.css.js +0 -6
- package/cjs/bulk-edit/BulkEditPanel.css.js.map +0 -1
- package/cjs/bulk-edit/BulkEditPanel.js +0 -107
- package/cjs/bulk-edit/BulkEditPanel.js.map +0 -1
- package/cjs/bulk-edit/ColumnCascadingUpdateEditor.css.js +0 -6
- package/cjs/bulk-edit/ColumnCascadingUpdateEditor.css.js.map +0 -1
- package/cjs/bulk-edit/ColumnCascadingUpdateEditor.js +0 -80
- package/cjs/bulk-edit/ColumnCascadingUpdateEditor.js.map +0 -1
- package/cjs/bulk-edit/InsertNewRowEditor.css.js +0 -6
- package/cjs/bulk-edit/InsertNewRowEditor.css.js.map +0 -1
- package/cjs/bulk-edit/InsertNewRowEditor.js +0 -80
- package/cjs/bulk-edit/InsertNewRowEditor.js.map +0 -1
- package/cjs/bulk-edit/useBulkEditPanel.js +0 -70
- package/cjs/bulk-edit/useBulkEditPanel.js.map +0 -1
- package/cjs/bulk-edit/useColumnCascadingEditor.js +0 -143
- package/cjs/bulk-edit/useColumnCascadingEditor.js.map +0 -1
- package/cjs/cell-block/CellBlock.css.js +0 -6
- package/cjs/cell-block/CellBlock.css.js.map +0 -1
- package/cjs/cell-block/CellBlock.js +0 -45
- package/cjs/cell-block/CellBlock.js.map +0 -1
- package/cjs/cell-block/cellblock-utils.js +0 -125
- package/cjs/cell-block/cellblock-utils.js.map +0 -1
- package/cjs/cell-block/useCellBlockSelection.js +0 -257
- package/cjs/cell-block/useCellBlockSelection.js.map +0 -1
- package/cjs/cell-renderers/checkbox-cell/CheckboxCell.css.js +0 -6
- package/cjs/cell-renderers/checkbox-cell/CheckboxCell.css.js.map +0 -1
- package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js +0 -67
- package/cjs/cell-renderers/checkbox-cell/CheckboxCell.js.map +0 -1
- package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +0 -6
- package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js.map +0 -1
- package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +0 -51
- package/cjs/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +0 -1
- package/cjs/cell-renderers/input-cell/InputCell.css.js +0 -6
- package/cjs/cell-renderers/input-cell/InputCell.css.js.map +0 -1
- package/cjs/cell-renderers/input-cell/InputCell.js +0 -63
- package/cjs/cell-renderers/input-cell/InputCell.js.map +0 -1
- package/cjs/cell-renderers/input-cell/useInputCell.js +0 -211
- package/cjs/cell-renderers/input-cell/useInputCell.js.map +0 -1
- package/cjs/cell-renderers/toggle-cell/ToggleCell.css.js +0 -6
- package/cjs/cell-renderers/toggle-cell/ToggleCell.css.js.map +0 -1
- package/cjs/cell-renderers/toggle-cell/ToggleCell.js +0 -66
- package/cjs/cell-renderers/toggle-cell/ToggleCell.js.map +0 -1
- package/cjs/column-header-pill/ColumnHeaderPill.css.js +0 -6
- package/cjs/column-header-pill/ColumnHeaderPill.css.js.map +0 -1
- package/cjs/column-header-pill/ColumnHeaderPill.js +0 -53
- package/cjs/column-header-pill/ColumnHeaderPill.js.map +0 -1
- package/cjs/column-header-pill/GroupColumnPill.css.js +0 -6
- package/cjs/column-header-pill/GroupColumnPill.css.js.map +0 -1
- package/cjs/column-header-pill/GroupColumnPill.js +0 -29
- package/cjs/column-header-pill/GroupColumnPill.js.map +0 -1
- package/cjs/column-header-pill/SortIndicator.css.js +0 -6
- package/cjs/column-header-pill/SortIndicator.css.js.map +0 -1
- package/cjs/column-header-pill/SortIndicator.js +0 -27
- package/cjs/column-header-pill/SortIndicator.js.map +0 -1
- package/cjs/column-resizing/ColumnResizer.css.js +0 -6
- package/cjs/column-resizing/ColumnResizer.css.js.map +0 -1
- package/cjs/column-resizing/ColumnResizer.js +0 -82
- package/cjs/column-resizing/ColumnResizer.js.map +0 -1
- package/cjs/column-resizing/useTableColumnResize.js +0 -55
- package/cjs/column-resizing/useTableColumnResize.js.map +0 -1
- package/cjs/data-row/DataRow.js +0 -262
- package/cjs/data-row/DataRow.js.map +0 -1
- package/cjs/header-cell/GroupHeaderCell.css.js +0 -6
- package/cjs/header-cell/GroupHeaderCell.css.js.map +0 -1
- package/cjs/header-cell/GroupHeaderCell.js +0 -127
- package/cjs/header-cell/GroupHeaderCell.js.map +0 -1
- package/cjs/header-cell/HeaderCell.css.js +0 -6
- package/cjs/header-cell/HeaderCell.css.js.map +0 -1
- package/cjs/header-cell/HeaderCell.js +0 -139
- package/cjs/header-cell/HeaderCell.js.map +0 -1
- package/cjs/index.js +0 -64
- package/cjs/index.js.map +0 -1
- package/cjs/pagination/PaginationControl.css.js +0 -6
- package/cjs/pagination/PaginationControl.css.js.map +0 -1
- package/cjs/pagination/PaginationControl.js +0 -38
- package/cjs/pagination/PaginationControl.js.map +0 -1
- package/cjs/pagination/usePagination.js +0 -36
- package/cjs/pagination/usePagination.js.map +0 -1
- package/cjs/table-cell/TableCell.css.js +0 -6
- package/cjs/table-cell/TableCell.css.js.map +0 -1
- package/cjs/table-cell/TableCell.js +0 -75
- package/cjs/table-cell/TableCell.js.map +0 -1
- package/cjs/table-cell/TableGroupCell.css.js +0 -6
- package/cjs/table-cell/TableGroupCell.css.js.map +0 -1
- package/cjs/table-cell/TableGroupCell.js +0 -65
- package/cjs/table-cell/TableGroupCell.js.map +0 -1
- package/cjs/table-config/useTableConfig.js +0 -67
- package/cjs/table-config/useTableConfig.js.map +0 -1
- package/cjs/table-config.js +0 -35
- package/cjs/table-config.js.map +0 -1
- package/cjs/table-data-source/DataRowMovingWindow.js +0 -99
- package/cjs/table-data-source/DataRowMovingWindow.js.map +0 -1
- package/cjs/table-data-source/useDataSource.js +0 -236
- package/cjs/table-data-source/useDataSource.js.map +0 -1
- package/cjs/table-dom-utils.js +0 -206
- package/cjs/table-dom-utils.js.map +0 -1
- package/cjs/table-header/HeaderProvider.js +0 -18
- package/cjs/table-header/HeaderProvider.js.map +0 -1
- package/cjs/table-header/TableHeader.js +0 -180
- package/cjs/table-header/TableHeader.js.map +0 -1
- package/cjs/table-header/useTableHeader.js +0 -87
- package/cjs/table-header/useTableHeader.js.map +0 -1
- package/cjs/useCell.js +0 -26
- package/cjs/useCell.js.map +0 -1
- package/cjs/useCellEditing.js +0 -77
- package/cjs/useCellEditing.js.map +0 -1
- package/cjs/useCellFocus.js +0 -119
- package/cjs/useCellFocus.js.map +0 -1
- package/cjs/useControlledTableNavigation.js +0 -46
- package/cjs/useControlledTableNavigation.js.map +0 -1
- package/cjs/useEditableCell.js +0 -27
- package/cjs/useEditableCell.js.map +0 -1
- package/cjs/useKeyboardNavigation.js +0 -323
- package/cjs/useKeyboardNavigation.js.map +0 -1
- package/cjs/useMeasuredHeight.js +0 -51
- package/cjs/useMeasuredHeight.js.map +0 -1
- package/cjs/useRowClassNameGenerators.js +0 -34
- package/cjs/useRowClassNameGenerators.js.map +0 -1
- package/cjs/useSelection.js +0 -130
- package/cjs/useSelection.js.map +0 -1
- package/cjs/useTable.js +0 -742
- package/cjs/useTable.js.map +0 -1
- package/cjs/useTableContextMenu.js +0 -76
- package/cjs/useTableContextMenu.js.map +0 -1
- package/cjs/useTableModel.js +0 -421
- package/cjs/useTableModel.js.map +0 -1
- package/cjs/useTableScroll.js +0 -464
- package/cjs/useTableScroll.js.map +0 -1
- package/cjs/useTableViewport.js +0 -137
- package/cjs/useTableViewport.js.map +0 -1
- package/esm/CellFocusState.js +0 -43
- package/esm/CellFocusState.js.map +0 -1
- package/esm/Row.js +0 -114
- package/esm/Row.js.map +0 -1
- package/esm/Table.css.js +0 -4
- package/esm/Table.css.js.map +0 -1
- package/esm/Table.js +0 -453
- package/esm/Table.js.map +0 -1
- package/esm/VirtualColSpan.js +0 -17
- package/esm/VirtualColSpan.js.map +0 -1
- package/esm/applyHighlighting.js +0 -31
- package/esm/applyHighlighting.js.map +0 -1
- package/esm/bulk-edit/BulkEditPanel.css.js +0 -4
- package/esm/bulk-edit/BulkEditPanel.css.js.map +0 -1
- package/esm/bulk-edit/BulkEditPanel.js +0 -105
- package/esm/bulk-edit/BulkEditPanel.js.map +0 -1
- package/esm/bulk-edit/ColumnCascadingUpdateEditor.css.js +0 -4
- package/esm/bulk-edit/ColumnCascadingUpdateEditor.css.js.map +0 -1
- package/esm/bulk-edit/ColumnCascadingUpdateEditor.js +0 -78
- package/esm/bulk-edit/ColumnCascadingUpdateEditor.js.map +0 -1
- package/esm/bulk-edit/InsertNewRowEditor.css.js +0 -4
- package/esm/bulk-edit/InsertNewRowEditor.css.js.map +0 -1
- package/esm/bulk-edit/InsertNewRowEditor.js +0 -78
- package/esm/bulk-edit/InsertNewRowEditor.js.map +0 -1
- package/esm/bulk-edit/useBulkEditPanel.js +0 -68
- package/esm/bulk-edit/useBulkEditPanel.js.map +0 -1
- package/esm/bulk-edit/useColumnCascadingEditor.js +0 -141
- package/esm/bulk-edit/useColumnCascadingEditor.js.map +0 -1
- package/esm/cell-block/CellBlock.css.js +0 -4
- package/esm/cell-block/CellBlock.css.js.map +0 -1
- package/esm/cell-block/CellBlock.js +0 -43
- package/esm/cell-block/CellBlock.js.map +0 -1
- package/esm/cell-block/cellblock-utils.js +0 -116
- package/esm/cell-block/cellblock-utils.js.map +0 -1
- package/esm/cell-block/useCellBlockSelection.js +0 -255
- package/esm/cell-block/useCellBlockSelection.js.map +0 -1
- package/esm/cell-renderers/checkbox-cell/CheckboxCell.css.js +0 -4
- package/esm/cell-renderers/checkbox-cell/CheckboxCell.css.js.map +0 -1
- package/esm/cell-renderers/checkbox-cell/CheckboxCell.js +0 -65
- package/esm/cell-renderers/checkbox-cell/CheckboxCell.js.map +0 -1
- package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js +0 -4
- package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.css.js.map +0 -1
- package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js +0 -49
- package/esm/cell-renderers/checkbox-row-selector/CheckboxRowSelectorCell.js.map +0 -1
- package/esm/cell-renderers/input-cell/InputCell.css.js +0 -4
- package/esm/cell-renderers/input-cell/InputCell.css.js.map +0 -1
- package/esm/cell-renderers/input-cell/InputCell.js +0 -61
- package/esm/cell-renderers/input-cell/InputCell.js.map +0 -1
- package/esm/cell-renderers/input-cell/useInputCell.js +0 -209
- package/esm/cell-renderers/input-cell/useInputCell.js.map +0 -1
- package/esm/cell-renderers/toggle-cell/ToggleCell.css.js +0 -4
- package/esm/cell-renderers/toggle-cell/ToggleCell.css.js.map +0 -1
- package/esm/cell-renderers/toggle-cell/ToggleCell.js +0 -64
- package/esm/cell-renderers/toggle-cell/ToggleCell.js.map +0 -1
- package/esm/column-header-pill/ColumnHeaderPill.css.js +0 -4
- package/esm/column-header-pill/ColumnHeaderPill.css.js.map +0 -1
- package/esm/column-header-pill/ColumnHeaderPill.js +0 -51
- package/esm/column-header-pill/ColumnHeaderPill.js.map +0 -1
- package/esm/column-header-pill/GroupColumnPill.css.js +0 -4
- package/esm/column-header-pill/GroupColumnPill.css.js.map +0 -1
- package/esm/column-header-pill/GroupColumnPill.js +0 -27
- package/esm/column-header-pill/GroupColumnPill.js.map +0 -1
- package/esm/column-header-pill/SortIndicator.css.js +0 -4
- package/esm/column-header-pill/SortIndicator.css.js.map +0 -1
- package/esm/column-header-pill/SortIndicator.js +0 -25
- package/esm/column-header-pill/SortIndicator.js.map +0 -1
- package/esm/column-resizing/ColumnResizer.css.js +0 -4
- package/esm/column-resizing/ColumnResizer.css.js.map +0 -1
- package/esm/column-resizing/ColumnResizer.js +0 -80
- package/esm/column-resizing/ColumnResizer.js.map +0 -1
- package/esm/column-resizing/useTableColumnResize.js +0 -53
- package/esm/column-resizing/useTableColumnResize.js.map +0 -1
- package/esm/data-row/DataRow.js +0 -260
- package/esm/data-row/DataRow.js.map +0 -1
- package/esm/header-cell/GroupHeaderCell.css.js +0 -4
- package/esm/header-cell/GroupHeaderCell.css.js.map +0 -1
- package/esm/header-cell/GroupHeaderCell.js +0 -125
- package/esm/header-cell/GroupHeaderCell.js.map +0 -1
- package/esm/header-cell/HeaderCell.css.js +0 -4
- package/esm/header-cell/HeaderCell.css.js.map +0 -1
- package/esm/header-cell/HeaderCell.js +0 -137
- package/esm/header-cell/HeaderCell.js.map +0 -1
- package/esm/index.js +0 -27
- package/esm/index.js.map +0 -1
- package/esm/pagination/PaginationControl.css.js +0 -4
- package/esm/pagination/PaginationControl.css.js.map +0 -1
- package/esm/pagination/PaginationControl.js +0 -36
- package/esm/pagination/PaginationControl.js.map +0 -1
- package/esm/pagination/usePagination.js +0 -34
- package/esm/pagination/usePagination.js.map +0 -1
- package/esm/table-cell/TableCell.css.js +0 -4
- package/esm/table-cell/TableCell.css.js.map +0 -1
- package/esm/table-cell/TableCell.js +0 -73
- package/esm/table-cell/TableCell.js.map +0 -1
- package/esm/table-cell/TableGroupCell.css.js +0 -4
- package/esm/table-cell/TableGroupCell.css.js.map +0 -1
- package/esm/table-cell/TableGroupCell.js +0 -63
- package/esm/table-cell/TableGroupCell.js.map +0 -1
- package/esm/table-config/useTableConfig.js +0 -65
- package/esm/table-config/useTableConfig.js.map +0 -1
- package/esm/table-config.js +0 -33
- package/esm/table-config.js.map +0 -1
- package/esm/table-data-source/DataRowMovingWindow.js +0 -97
- package/esm/table-data-source/DataRowMovingWindow.js.map +0 -1
- package/esm/table-data-source/useDataSource.js +0 -234
- package/esm/table-data-source/useDataSource.js.map +0 -1
- package/esm/table-dom-utils.js +0 -188
- package/esm/table-dom-utils.js.map +0 -1
- package/esm/table-header/HeaderProvider.js +0 -15
- package/esm/table-header/HeaderProvider.js.map +0 -1
- package/esm/table-header/TableHeader.js +0 -178
- package/esm/table-header/TableHeader.js.map +0 -1
- package/esm/table-header/useTableHeader.js +0 -85
- package/esm/table-header/useTableHeader.js.map +0 -1
- package/esm/useCell.js +0 -24
- package/esm/useCell.js.map +0 -1
- package/esm/useCellEditing.js +0 -75
- package/esm/useCellEditing.js.map +0 -1
- package/esm/useCellFocus.js +0 -117
- package/esm/useCellFocus.js.map +0 -1
- package/esm/useControlledTableNavigation.js +0 -43
- package/esm/useControlledTableNavigation.js.map +0 -1
- package/esm/useEditableCell.js +0 -25
- package/esm/useEditableCell.js.map +0 -1
- package/esm/useKeyboardNavigation.js +0 -319
- package/esm/useKeyboardNavigation.js.map +0 -1
- package/esm/useMeasuredHeight.js +0 -49
- package/esm/useMeasuredHeight.js.map +0 -1
- package/esm/useRowClassNameGenerators.js +0 -32
- package/esm/useRowClassNameGenerators.js.map +0 -1
- package/esm/useSelection.js +0 -128
- package/esm/useSelection.js.map +0 -1
- package/esm/useTable.js +0 -740
- package/esm/useTable.js.map +0 -1
- package/esm/useTableContextMenu.js +0 -73
- package/esm/useTableContextMenu.js.map +0 -1
- package/esm/useTableModel.js +0 -419
- package/esm/useTableModel.js.map +0 -1
- package/esm/useTableScroll.js +0 -461
- package/esm/useTableScroll.js.map +0 -1
- package/esm/useTableViewport.js +0 -135
- package/esm/useTableViewport.js.map +0 -1
package/cjs/useTableViewport.js
DELETED
|
@@ -1,137 +0,0 @@
|
|
|
1
|
-
'use strict';
|
|
2
|
-
|
|
3
|
-
var vuuUtils = require('@vuu-ui/vuu-utils');
|
|
4
|
-
var react = require('react');
|
|
5
|
-
|
|
6
|
-
const MAX_PIXEL_HEIGHT = 1e7;
|
|
7
|
-
const UNMEASURED_VIEWPORT = {
|
|
8
|
-
appliedPageSize: 0,
|
|
9
|
-
contentHeight: 0,
|
|
10
|
-
contentWidth: 0,
|
|
11
|
-
getRowAtPosition: () => -1,
|
|
12
|
-
getRowOffset: () => -1,
|
|
13
|
-
horizontalScrollbarHeight: 0,
|
|
14
|
-
isVirtualScroll: false,
|
|
15
|
-
pinnedWidthLeft: 0,
|
|
16
|
-
pinnedWidthRight: 0,
|
|
17
|
-
rowCount: 0,
|
|
18
|
-
setInSituRowOffset: () => void 0,
|
|
19
|
-
setScrollTop: () => void 0,
|
|
20
|
-
totalHeaderHeight: 0,
|
|
21
|
-
usesMeasuredHeaderHeight: false,
|
|
22
|
-
verticalScrollbarWidth: 0,
|
|
23
|
-
viewportBodyHeight: 0,
|
|
24
|
-
viewportWidth: 0
|
|
25
|
-
};
|
|
26
|
-
const getViewportHeightProps = (rowCount, rowHeight, size, showPaginationControls = false) => {
|
|
27
|
-
if (showPaginationControls) {
|
|
28
|
-
return {
|
|
29
|
-
pixelContentHeight: size.height,
|
|
30
|
-
virtualContentHeight: size.height,
|
|
31
|
-
virtualisedExtent: 0
|
|
32
|
-
};
|
|
33
|
-
} else {
|
|
34
|
-
const virtualContentHeight = rowCount * rowHeight;
|
|
35
|
-
const pixelContentHeight = Math.min(virtualContentHeight, MAX_PIXEL_HEIGHT);
|
|
36
|
-
const virtualisedExtent = virtualContentHeight - pixelContentHeight;
|
|
37
|
-
return {
|
|
38
|
-
pixelContentHeight,
|
|
39
|
-
virtualContentHeight,
|
|
40
|
-
virtualisedExtent
|
|
41
|
-
};
|
|
42
|
-
}
|
|
43
|
-
};
|
|
44
|
-
const useTableViewport = ({
|
|
45
|
-
columns,
|
|
46
|
-
headerHeight,
|
|
47
|
-
rowCount,
|
|
48
|
-
rowHeight,
|
|
49
|
-
selectionEndSize = 4,
|
|
50
|
-
showPaginationControls,
|
|
51
|
-
size
|
|
52
|
-
}) => {
|
|
53
|
-
const inSituRowOffsetRef = react.useRef(0);
|
|
54
|
-
const pctScrollTopRef = react.useRef(0);
|
|
55
|
-
const { virtualContentHeight, pixelContentHeight, virtualisedExtent } = getViewportHeightProps(rowCount, rowHeight, size, showPaginationControls);
|
|
56
|
-
const { pinnedWidthLeft, pinnedWidthRight, unpinnedWidth } = react.useMemo(
|
|
57
|
-
() => vuuUtils.measurePinnedColumns(columns, selectionEndSize),
|
|
58
|
-
[columns, selectionEndSize]
|
|
59
|
-
);
|
|
60
|
-
const [getRowOffset, getRowAtPosition, isVirtualScroll] = react.useMemo(() => {
|
|
61
|
-
if (virtualisedExtent) {
|
|
62
|
-
const [_getRowOffset, getRowAtPosition2, _isVirtual] = vuuUtils.virtualRowPositioning(rowHeight, virtualisedExtent, pctScrollTopRef);
|
|
63
|
-
const getOffset = (dataRow) => {
|
|
64
|
-
return _getRowOffset(dataRow, inSituRowOffsetRef.current);
|
|
65
|
-
};
|
|
66
|
-
return [getOffset, getRowAtPosition2, _isVirtual];
|
|
67
|
-
} else {
|
|
68
|
-
return vuuUtils.actualRowPositioning(rowHeight);
|
|
69
|
-
}
|
|
70
|
-
}, [virtualisedExtent, rowHeight]);
|
|
71
|
-
const setScrollTop = react.useCallback((_, scrollPct) => {
|
|
72
|
-
pctScrollTopRef.current = scrollPct;
|
|
73
|
-
}, []);
|
|
74
|
-
const setInSituRowOffset = react.useCallback((rowIndexOffset) => {
|
|
75
|
-
if (rowIndexOffset === 0) {
|
|
76
|
-
inSituRowOffsetRef.current = 0;
|
|
77
|
-
} else {
|
|
78
|
-
inSituRowOffsetRef.current = Math.max(
|
|
79
|
-
0,
|
|
80
|
-
inSituRowOffsetRef.current + rowIndexOffset
|
|
81
|
-
);
|
|
82
|
-
}
|
|
83
|
-
}, []);
|
|
84
|
-
return react.useMemo(() => {
|
|
85
|
-
if (size) {
|
|
86
|
-
const scrollbarSize = 10;
|
|
87
|
-
const contentWidth = pinnedWidthLeft + unpinnedWidth + pinnedWidthRight;
|
|
88
|
-
const horizontalScrollbarHeight = contentWidth > size.width ? scrollbarSize : 0;
|
|
89
|
-
const measuredHeaderHeight = headerHeight === -1 ? 0 : headerHeight;
|
|
90
|
-
const visibleRows = showPaginationControls ? Math.floor((pixelContentHeight - headerHeight) / rowHeight) : (size.height - headerHeight) / rowHeight;
|
|
91
|
-
const count = Number.isInteger(visibleRows) ? visibleRows : Math.ceil(visibleRows);
|
|
92
|
-
const viewportBodyHeight = size.height - measuredHeaderHeight;
|
|
93
|
-
const verticalScrollbarWidth = showPaginationControls ? 0 : pixelContentHeight > viewportBodyHeight ? scrollbarSize : 0;
|
|
94
|
-
const appliedPageSize = count * rowHeight * (pixelContentHeight / virtualContentHeight);
|
|
95
|
-
const viewportWidth = size.width;
|
|
96
|
-
return {
|
|
97
|
-
usesMeasuredHeaderHeight: headerHeight !== -1,
|
|
98
|
-
appliedPageSize,
|
|
99
|
-
contentHeight: pixelContentHeight,
|
|
100
|
-
contentWidth,
|
|
101
|
-
getRowAtPosition,
|
|
102
|
-
getRowOffset,
|
|
103
|
-
isVirtualScroll,
|
|
104
|
-
horizontalScrollbarHeight,
|
|
105
|
-
pinnedWidthLeft,
|
|
106
|
-
pinnedWidthRight,
|
|
107
|
-
rowCount: count,
|
|
108
|
-
setInSituRowOffset,
|
|
109
|
-
setScrollTop,
|
|
110
|
-
totalHeaderHeight: headerHeight,
|
|
111
|
-
verticalScrollbarWidth,
|
|
112
|
-
viewportBodyHeight,
|
|
113
|
-
viewportWidth
|
|
114
|
-
};
|
|
115
|
-
} else {
|
|
116
|
-
return UNMEASURED_VIEWPORT;
|
|
117
|
-
}
|
|
118
|
-
}, [
|
|
119
|
-
size,
|
|
120
|
-
pinnedWidthLeft,
|
|
121
|
-
unpinnedWidth,
|
|
122
|
-
pinnedWidthRight,
|
|
123
|
-
headerHeight,
|
|
124
|
-
rowHeight,
|
|
125
|
-
showPaginationControls,
|
|
126
|
-
pixelContentHeight,
|
|
127
|
-
virtualContentHeight,
|
|
128
|
-
getRowAtPosition,
|
|
129
|
-
getRowOffset,
|
|
130
|
-
isVirtualScroll,
|
|
131
|
-
setInSituRowOffset,
|
|
132
|
-
setScrollTop
|
|
133
|
-
]);
|
|
134
|
-
};
|
|
135
|
-
|
|
136
|
-
exports.useTableViewport = useTableViewport;
|
|
137
|
-
//# sourceMappingURL=useTableViewport.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"useTableViewport.js","sources":["../../../packages/vuu-table/src/useTableViewport.ts"],"sourcesContent":["/**\n * This hook measures and calculates the values needed to manage layout\n * and virtualisation of the table. This includes measurements required\n * to support pinned columns.\n */\nimport { RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { MeasuredSize } from \"@vuu-ui/vuu-ui-controls\";\nimport {\n actualRowPositioning,\n measurePinnedColumns,\n RowAtPositionFunc,\n RowOffsetFunc,\n RowPositioning,\n virtualRowPositioning,\n} from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo, useRef } from \"react\";\n\nexport interface TableViewportHookProps {\n columns: RuntimeColumnDescriptor[];\n headerHeight: number;\n rowCount: number;\n rowHeight: number;\n /**\n * this is the solid left/right `border` rendered on the selection block\n */\n selectionEndSize?: number;\n showPaginationControls?: boolean;\n size: MeasuredSize;\n}\n\nexport interface ViewportMeasurements {\n appliedPageSize: number;\n contentHeight: number;\n horizontalScrollbarHeight: number;\n isVirtualScroll: boolean;\n pinnedWidthLeft: number;\n pinnedWidthRight: number;\n rowCount: number;\n contentWidth: number;\n totalHeaderHeight: number;\n usesMeasuredHeaderHeight: boolean;\n verticalScrollbarWidth: number;\n viewportBodyHeight: number;\n viewportWidth: number;\n}\n\nexport interface TableViewportHookResult extends ViewportMeasurements {\n getRowAtPosition: RowAtPositionFunc;\n getRowOffset: RowOffsetFunc;\n setInSituRowOffset: (rowIndexOffset: number) => void;\n setScrollTop: (scrollTop: number, scrollPct: number) => void;\n}\n\n// Too simplistic, it depends on rowHeight\nconst MAX_PIXEL_HEIGHT = 10_000_000;\n\nconst UNMEASURED_VIEWPORT: TableViewportHookResult = {\n appliedPageSize: 0,\n contentHeight: 0,\n contentWidth: 0,\n getRowAtPosition: () => -1,\n getRowOffset: () => -1,\n horizontalScrollbarHeight: 0,\n isVirtualScroll: false,\n pinnedWidthLeft: 0,\n pinnedWidthRight: 0,\n rowCount: 0,\n setInSituRowOffset: () => undefined,\n setScrollTop: () => undefined,\n totalHeaderHeight: 0,\n usesMeasuredHeaderHeight: false,\n verticalScrollbarWidth: 0,\n viewportBodyHeight: 0,\n viewportWidth: 0,\n};\n\nconst getViewportHeightProps = (\n rowCount: number,\n rowHeight: number,\n size: MeasuredSize,\n showPaginationControls = false,\n) => {\n if (showPaginationControls) {\n return {\n pixelContentHeight: size.height,\n virtualContentHeight: size.height,\n virtualisedExtent: 0,\n };\n } else {\n const virtualContentHeight = rowCount * rowHeight;\n const pixelContentHeight = Math.min(virtualContentHeight, MAX_PIXEL_HEIGHT);\n const virtualisedExtent = virtualContentHeight - pixelContentHeight;\n return {\n pixelContentHeight,\n virtualContentHeight,\n virtualisedExtent,\n };\n }\n};\n\nexport const useTableViewport = ({\n columns,\n headerHeight,\n rowCount,\n rowHeight,\n selectionEndSize = 4,\n showPaginationControls,\n size,\n}: TableViewportHookProps): TableViewportHookResult => {\n const inSituRowOffsetRef = useRef(0);\n const pctScrollTopRef = useRef(0);\n\n const { virtualContentHeight, pixelContentHeight, virtualisedExtent } =\n getViewportHeightProps(rowCount, rowHeight, size, showPaginationControls);\n\n const { pinnedWidthLeft, pinnedWidthRight, unpinnedWidth } = useMemo(\n () => measurePinnedColumns(columns, selectionEndSize),\n [columns, selectionEndSize],\n );\n\n const [getRowOffset, getRowAtPosition, isVirtualScroll] =\n useMemo<RowPositioning>(() => {\n if (virtualisedExtent) {\n const [_getRowOffset, getRowAtPosition, _isVirtual] =\n virtualRowPositioning(rowHeight, virtualisedExtent, pctScrollTopRef);\n const getOffset: RowOffsetFunc = (dataRow) => {\n return _getRowOffset(dataRow, inSituRowOffsetRef.current);\n };\n return [getOffset, getRowAtPosition, _isVirtual];\n } else {\n return actualRowPositioning(rowHeight);\n }\n }, [virtualisedExtent, rowHeight]);\n\n const setScrollTop = useCallback((_: number, scrollPct: number) => {\n pctScrollTopRef.current = scrollPct;\n }, []);\n\n /**\n * The inSituRowOffset is used to simulate scrolling through a very large dataset\n * without actually moving the scroll position. It is triggered by keyboard\n * navigation. A simulated scroll operation will always be of one or more rows.\n * A value of zero is a request to reset the offset.\n */\n const setInSituRowOffset = useCallback((rowIndexOffset: number) => {\n if (rowIndexOffset === 0) {\n inSituRowOffsetRef.current = 0;\n } else {\n inSituRowOffsetRef.current = Math.max(\n 0,\n inSituRowOffsetRef.current + rowIndexOffset,\n );\n }\n }, []);\n\n return useMemo(() => {\n if (size) {\n // TODO determine this at runtime\n const scrollbarSize = 10;\n const contentWidth = pinnedWidthLeft + unpinnedWidth + pinnedWidthRight;\n const horizontalScrollbarHeight =\n contentWidth > size.width ? scrollbarSize : 0;\n const measuredHeaderHeight = headerHeight === -1 ? 0 : headerHeight;\n const visibleRows = showPaginationControls\n ? Math.floor((pixelContentHeight - headerHeight) / rowHeight)\n : (size.height - headerHeight) / rowHeight;\n const count = Number.isInteger(visibleRows)\n ? visibleRows\n : Math.ceil(visibleRows);\n const viewportBodyHeight = size.height - measuredHeaderHeight;\n const verticalScrollbarWidth = showPaginationControls\n ? 0\n : pixelContentHeight > viewportBodyHeight\n ? scrollbarSize\n : 0;\n\n const appliedPageSize =\n count * rowHeight * (pixelContentHeight / virtualContentHeight);\n\n const viewportWidth = size.width;\n\n return {\n usesMeasuredHeaderHeight: headerHeight !== -1,\n appliedPageSize,\n contentHeight: pixelContentHeight,\n contentWidth,\n getRowAtPosition,\n getRowOffset,\n isVirtualScroll,\n horizontalScrollbarHeight,\n pinnedWidthLeft,\n pinnedWidthRight,\n rowCount: count,\n setInSituRowOffset,\n setScrollTop,\n totalHeaderHeight: headerHeight,\n verticalScrollbarWidth,\n viewportBodyHeight,\n viewportWidth,\n };\n } else {\n return UNMEASURED_VIEWPORT;\n }\n }, [\n size,\n pinnedWidthLeft,\n unpinnedWidth,\n pinnedWidthRight,\n headerHeight,\n rowHeight,\n showPaginationControls,\n pixelContentHeight,\n virtualContentHeight,\n getRowAtPosition,\n getRowOffset,\n isVirtualScroll,\n setInSituRowOffset,\n setScrollTop,\n ]);\n};\n"],"names":["useRef","useMemo","measurePinnedColumns","getRowAtPosition","virtualRowPositioning","actualRowPositioning","useCallback"],"mappings":"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"}
|
package/esm/CellFocusState.js
DELETED
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import { getAriaCellPos } from './table-dom-utils.js';
|
|
2
|
-
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __typeError = (msg) => {
|
|
5
|
-
throw TypeError(msg);
|
|
6
|
-
};
|
|
7
|
-
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
-
var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
|
|
9
|
-
var __accessCheck = (obj, member, msg) => member.has(obj) || __typeError("Cannot " + msg);
|
|
10
|
-
var __privateGet = (obj, member, getter) => (__accessCheck(obj, member, "read from private field"), getter ? getter.call(obj) : member.get(obj));
|
|
11
|
-
var __privateAdd = (obj, member, value) => member.has(obj) ? __typeError("Cannot add the same private member more than once") : member instanceof WeakSet ? member.add(obj) : member.set(obj, value);
|
|
12
|
-
var __privateSet = (obj, member, value, setter) => (__accessCheck(obj, member, "write to private field"), member.set(obj, value), value);
|
|
13
|
-
var _cellPos, _el;
|
|
14
|
-
class CellFocusState {
|
|
15
|
-
constructor() {
|
|
16
|
-
__privateAdd(this, _cellPos);
|
|
17
|
-
__privateAdd(this, _el, null);
|
|
18
|
-
__publicField(this, "outsideViewport", false);
|
|
19
|
-
__publicField(this, "placeholderEl", null);
|
|
20
|
-
__publicField(this, "pos");
|
|
21
|
-
}
|
|
22
|
-
set cell(cell) {
|
|
23
|
-
__privateSet(this, _el, cell);
|
|
24
|
-
__privateSet(this, _cellPos, getAriaCellPos(cell));
|
|
25
|
-
}
|
|
26
|
-
get cellPos() {
|
|
27
|
-
return __privateGet(this, _cellPos);
|
|
28
|
-
}
|
|
29
|
-
set cellPos(cellPos) {
|
|
30
|
-
__privateSet(this, _cellPos, cellPos);
|
|
31
|
-
}
|
|
32
|
-
get el() {
|
|
33
|
-
return __privateGet(this, _el);
|
|
34
|
-
}
|
|
35
|
-
set el(el) {
|
|
36
|
-
__privateSet(this, _el, el);
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
_cellPos = new WeakMap();
|
|
40
|
-
_el = new WeakMap();
|
|
41
|
-
|
|
42
|
-
export { CellFocusState };
|
|
43
|
-
//# sourceMappingURL=CellFocusState.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"CellFocusState.js","sources":["../../../packages/vuu-table/src/CellFocusState.ts"],"sourcesContent":["import { CellPos } from \"@vuu-ui/vuu-table-types\";\nimport { getAriaCellPos } from \"./table-dom-utils\";\n\n/**\n * Used to track the Table cell (if any) with focus.\n */\nexport interface ICellFocusState {\n el: HTMLElement | null;\n outsideViewport: \"above\" | \"below\" | false;\n placeholderEl: HTMLDivElement | null;\n pos: { top: number } | undefined;\n cellPos: CellPos | undefined;\n}\n\nexport class CellFocusState implements ICellFocusState {\n #cellPos: CellPos | undefined = undefined;\n #el: HTMLElement | null = null;\n outsideViewport: \"above\" | \"below\" | false = false;\n placeholderEl: HTMLDivElement | null = null;\n pos: { top: number } | undefined = undefined;\n\n set cell(cell: HTMLDivElement) {\n this.#el = cell;\n this.#cellPos = getAriaCellPos(cell);\n }\n\n get cellPos() {\n return this.#cellPos;\n }\n set cellPos(cellPos) {\n this.#cellPos = cellPos;\n }\n\n get el() {\n return this.#el;\n }\n set el(el) {\n this.#el = el;\n }\n}\n"],"names":[],"mappings":";;;;;;;;;;;;AAAA,IAAA,QAAA,EAAA,GAAA;AAcO,MAAM,cAA0C,CAAA;AAAA,EAAhD,WAAA,GAAA;AACL,IAAA,YAAA,CAAA,IAAA,EAAA,QAAA,CAAA;AACA,IAA0B,YAAA,CAAA,IAAA,EAAA,GAAA,EAAA,IAAA,CAAA;AAC1B,IAA6C,aAAA,CAAA,IAAA,EAAA,iBAAA,EAAA,KAAA,CAAA;AAC7C,IAAuC,aAAA,CAAA,IAAA,EAAA,eAAA,EAAA,IAAA,CAAA;AACvC,IAAA,aAAA,CAAA,IAAA,EAAA,KAAA,CAAA;AAAA;AAAA,EAEA,IAAI,KAAK,IAAsB,EAAA;AAC7B,IAAA,YAAA,CAAA,IAAA,EAAK,GAAM,EAAA,IAAA,CAAA;AACX,IAAK,YAAA,CAAA,IAAA,EAAA,QAAA,EAAW,eAAe,IAAI,CAAA,CAAA;AAAA;AACrC,EAEA,IAAI,OAAU,GAAA;AACZ,IAAA,OAAO,YAAK,CAAA,IAAA,EAAA,QAAA,CAAA;AAAA;AACd,EACA,IAAI,QAAQ,OAAS,EAAA;AACnB,IAAA,YAAA,CAAA,IAAA,EAAK,QAAW,EAAA,OAAA,CAAA;AAAA;AAClB,EAEA,IAAI,EAAK,GAAA;AACP,IAAA,OAAO,YAAK,CAAA,IAAA,EAAA,GAAA,CAAA;AAAA;AACd,EACA,IAAI,GAAG,EAAI,EAAA;AACT,IAAA,YAAA,CAAA,IAAA,EAAK,GAAM,EAAA,EAAA,CAAA;AAAA;AAEf;AAxBE,QAAA,GAAA,IAAA,OAAA,EAAA;AACA,GAAA,GAAA,IAAA,OAAA,EAAA;;;;"}
|
package/esm/Row.js
DELETED
|
@@ -1,114 +0,0 @@
|
|
|
1
|
-
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { isGroupColumn, isJsonGroup, queryClosest, isNotHidden, isJsonColumn } from '@vuu-ui/vuu-utils';
|
|
3
|
-
import cx from 'clsx';
|
|
4
|
-
import { memo, useCallback } from 'react';
|
|
5
|
-
import { TableCell } from './table-cell/TableCell.js';
|
|
6
|
-
import { TableGroupCell } from './table-cell/TableGroupCell.js';
|
|
7
|
-
import { VirtualColSpan } from './VirtualColSpan.js';
|
|
8
|
-
|
|
9
|
-
const classBase = "vuuTableRow";
|
|
10
|
-
const Row = memo(
|
|
11
|
-
({
|
|
12
|
-
className: classNameProp,
|
|
13
|
-
classNameGenerator,
|
|
14
|
-
columns,
|
|
15
|
-
dataRow,
|
|
16
|
-
groupToggleTarget = "group-column",
|
|
17
|
-
highlighted,
|
|
18
|
-
offset,
|
|
19
|
-
onCellEdit,
|
|
20
|
-
onClick,
|
|
21
|
-
onDataEdited,
|
|
22
|
-
onToggleGroup,
|
|
23
|
-
searchPattern,
|
|
24
|
-
showBookends = true,
|
|
25
|
-
virtualColSpan = 0,
|
|
26
|
-
zebraStripes = false,
|
|
27
|
-
...htmlAttributes
|
|
28
|
-
}) => {
|
|
29
|
-
const {
|
|
30
|
-
childCount,
|
|
31
|
-
depth,
|
|
32
|
-
index: rowIndex,
|
|
33
|
-
isExpanded,
|
|
34
|
-
isLeaf,
|
|
35
|
-
isSelected
|
|
36
|
-
} = dataRow;
|
|
37
|
-
const handleRowClick = useCallback(
|
|
38
|
-
(evt) => {
|
|
39
|
-
const rangeSelect = evt.shiftKey;
|
|
40
|
-
const keepExistingSelection = evt.ctrlKey || evt.metaKey;
|
|
41
|
-
onClick?.(evt, dataRow, rangeSelect, keepExistingSelection);
|
|
42
|
-
},
|
|
43
|
-
[dataRow, onClick]
|
|
44
|
-
);
|
|
45
|
-
const className = cx(
|
|
46
|
-
classBase,
|
|
47
|
-
classNameProp,
|
|
48
|
-
classNameGenerator?.(dataRow),
|
|
49
|
-
{
|
|
50
|
-
[`${classBase}-even`]: zebraStripes && rowIndex % 2 === 0,
|
|
51
|
-
[`${classBase}-highlighted`]: highlighted
|
|
52
|
-
}
|
|
53
|
-
);
|
|
54
|
-
const canExpand = isLeaf === false && childCount > 0;
|
|
55
|
-
const ariaExpanded = isExpanded ? true : canExpand ? false : void 0;
|
|
56
|
-
const ariaLevel = isLeaf && depth === 1 ? void 0 : depth;
|
|
57
|
-
const style = { top: offset };
|
|
58
|
-
const handleGroupCellClick = useCallback(
|
|
59
|
-
(evt, column) => {
|
|
60
|
-
if (isGroupColumn(column) || isJsonGroup(column, dataRow)) {
|
|
61
|
-
const toggleIconClicked = queryClosest(evt.target, ".vuuToggleIconButton") !== null;
|
|
62
|
-
if (groupToggleTarget === "toggle-icon") {
|
|
63
|
-
if (!toggleIconClicked) {
|
|
64
|
-
return;
|
|
65
|
-
}
|
|
66
|
-
}
|
|
67
|
-
if (toggleIconClicked) {
|
|
68
|
-
evt.stopPropagation();
|
|
69
|
-
}
|
|
70
|
-
onToggleGroup?.(dataRow, column);
|
|
71
|
-
}
|
|
72
|
-
},
|
|
73
|
-
[dataRow, groupToggleTarget, onToggleGroup]
|
|
74
|
-
);
|
|
75
|
-
return /* @__PURE__ */ jsxs(
|
|
76
|
-
"div",
|
|
77
|
-
{
|
|
78
|
-
...htmlAttributes,
|
|
79
|
-
"aria-expanded": ariaExpanded,
|
|
80
|
-
"aria-selected": isSelected ? "true" : void 0,
|
|
81
|
-
"aria-level": ariaLevel,
|
|
82
|
-
role: "row",
|
|
83
|
-
className,
|
|
84
|
-
onClick: handleRowClick,
|
|
85
|
-
style,
|
|
86
|
-
children: [
|
|
87
|
-
showBookends ? /* @__PURE__ */ jsx("div", { className: "vuuSelectionDecorator vuuStickyLeft", children: /* @__PURE__ */ jsx("div", { className: "vuuTableRowBookend" }) }) : null,
|
|
88
|
-
/* @__PURE__ */ jsx(VirtualColSpan, { width: virtualColSpan }),
|
|
89
|
-
columns.filter(isNotHidden).map((column) => {
|
|
90
|
-
const isGroup = isGroupColumn(column);
|
|
91
|
-
const isJsonCell = isJsonColumn(column);
|
|
92
|
-
const Cell = isGroup && !isJsonCell ? TableGroupCell : TableCell;
|
|
93
|
-
return /* @__PURE__ */ jsx(
|
|
94
|
-
Cell,
|
|
95
|
-
{
|
|
96
|
-
column,
|
|
97
|
-
dataRow,
|
|
98
|
-
onClick: isGroup || isJsonCell ? handleGroupCellClick : void 0,
|
|
99
|
-
onDataEdited,
|
|
100
|
-
searchPattern
|
|
101
|
-
},
|
|
102
|
-
column.name
|
|
103
|
-
);
|
|
104
|
-
}),
|
|
105
|
-
showBookends ? /* @__PURE__ */ jsx("div", { className: "vuuSelectionDecorator vuuStickyRight", children: /* @__PURE__ */ jsx("div", { className: "vuuTableRowBookend" }) }) : null
|
|
106
|
-
]
|
|
107
|
-
}
|
|
108
|
-
);
|
|
109
|
-
}
|
|
110
|
-
);
|
|
111
|
-
Row.displayName = "Row";
|
|
112
|
-
|
|
113
|
-
export { Row };
|
|
114
|
-
//# sourceMappingURL=Row.js.map
|
package/esm/Row.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Row.js","sources":["../../../packages/vuu-table/src/Row.tsx"],"sourcesContent":["import { RowProps, RuntimeColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n isGroupColumn,\n isJsonColumn,\n isJsonGroup,\n isNotHidden,\n queryClosest,\n} from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { MouseEvent, memo, useCallback } from \"react\";\nimport { TableCell, TableGroupCell } from \"./table-cell\";\n\nimport { VirtualColSpan } from \"./VirtualColSpan\";\n\nconst classBase = \"vuuTableRow\";\n\nexport const Row = memo(\n ({\n className: classNameProp,\n classNameGenerator,\n columns,\n dataRow,\n groupToggleTarget = \"group-column\",\n highlighted,\n offset,\n onCellEdit,\n onClick,\n onDataEdited,\n onToggleGroup,\n searchPattern,\n showBookends = true,\n virtualColSpan = 0,\n zebraStripes = false,\n ...htmlAttributes\n }: RowProps) => {\n const {\n childCount,\n depth,\n index: rowIndex,\n isExpanded,\n isLeaf,\n isSelected,\n } = dataRow;\n\n const handleRowClick = useCallback(\n (evt: MouseEvent<HTMLDivElement>) => {\n const rangeSelect = evt.shiftKey;\n const keepExistingSelection = evt.ctrlKey || evt.metaKey; /* mac only */\n onClick?.(evt, dataRow, rangeSelect, keepExistingSelection);\n },\n [dataRow, onClick],\n );\n\n const className = cx(\n classBase,\n classNameProp,\n classNameGenerator?.(dataRow),\n {\n [`${classBase}-even`]: zebraStripes && rowIndex % 2 === 0,\n [`${classBase}-highlighted`]: highlighted,\n },\n );\n\n const canExpand = isLeaf === false && childCount > 0;\n const ariaExpanded = isExpanded ? true : canExpand ? false : undefined;\n const ariaLevel = isLeaf && depth === 1 ? undefined : depth;\n\n // const style = { transform: `translate3d(0px, ${offset}px, 0px)` };\n const style = { top: offset };\n\n const handleGroupCellClick = useCallback(\n (evt: MouseEvent, column: RuntimeColumnDescriptor) => {\n if (isGroupColumn(column) || isJsonGroup(column, dataRow)) {\n const toggleIconClicked =\n queryClosest(evt.target, \".vuuToggleIconButton\") !== null;\n if (groupToggleTarget === \"toggle-icon\") {\n if (!toggleIconClicked) {\n return;\n }\n }\n if (toggleIconClicked) {\n // prevent evt bubbling, will suppress selection hook.\n // Clicking the toggle icon directly never triggers row selection\n evt.stopPropagation();\n }\n onToggleGroup?.(dataRow, column);\n }\n },\n [dataRow, groupToggleTarget, onToggleGroup],\n );\n\n return (\n <div\n {...htmlAttributes}\n aria-expanded={ariaExpanded}\n aria-selected={isSelected ? \"true\" : undefined}\n aria-level={ariaLevel}\n role=\"row\"\n className={className}\n onClick={handleRowClick}\n style={style}\n >\n {showBookends ? (\n <div className=\"vuuSelectionDecorator vuuStickyLeft\">\n <div className=\"vuuTableRowBookend\" />\n </div>\n ) : null}\n <VirtualColSpan width={virtualColSpan} />\n {columns.filter(isNotHidden).map((column) => {\n const isGroup = isGroupColumn(column);\n const isJsonCell = isJsonColumn(column);\n const Cell = isGroup && !isJsonCell ? TableGroupCell : TableCell;\n\n return (\n <Cell\n column={column}\n dataRow={dataRow}\n key={column.name}\n onClick={isGroup || isJsonCell ? handleGroupCellClick : undefined}\n onDataEdited={onDataEdited}\n searchPattern={searchPattern}\n />\n );\n })}\n {showBookends ? (\n <div className=\"vuuSelectionDecorator vuuStickyRight\">\n <div className=\"vuuTableRowBookend\" />\n </div>\n ) : null}\n </div>\n );\n },\n);\nRow.displayName = \"Row\";\n"],"names":[],"mappings":"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"}
|
package/esm/Table.css.js
DELETED
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
var tableCss = ".vuuTable {\n --vuu-table-cell-outlineWidth: 1px;\n --vuu-table-col-header-row-height: var(--salt-size-base, 32px);\n --vuu-table-col-heading-height: 25px;\n --vuu-table-footer-height: 0px;\n --vuu-table-row-background-selected: var(--vuuTableRow-background-selected, var(--salt-selectable-background-selected));\n --vuu-table-row-background-highlighted: var(--vuuTableRow-background-highlighted, var(--salt-selectable-background-hover));\n --vuu-table-row-borderColor-selected: var(--vuuTableRow-borderColor-selected, var(--salt-selectable-borderColor-selected));\n --vuu-table-row-bookend-background-selected: var(--vuuTableRow-bookend-background-selected, var(--salt-selectable-background-selected));\n --vuu-table-row-height: var(--salt-size-base, 32px);\n --vuu-table-row-selection-borderRadius: var(--vuuTable-row-selection-borderRadius, 5px); \n\n --table-background: var(--vuuTable-background, var(--salt-container-primary-background));\n --table-height: var(--measured-px-height);\n --table-width: var(--measured-px-width);\n\n --columnResizer-color: transparent;\n --row-height: var(\n --row-height-prop,\n var(--vuu-table-row-height, var(--salt-size-base))\n );\n --col-header-row-height: var(\n --col-header-row-height-prop,\n var(--vuu-table-col-header-row-height, var(--salt-size-base))\n );\n\n --cell-borderColor: transparent;\n --row-borderColor: var(--row-background);\n --vuu-table-embedded-control-height: calc(var(--row-height) - 3px);\n\n background: var(--table-background);\n font-family: var(\n --vuuTable-fontFamily,\n var(--salt-typography-fontFamily, sans-serif)\n );\n position: relative;\n user-select: none;\n\n &.vuuTable-viewportRowLimit {\n height: fit-content;\n /* With a viewportRowLimit, table is content sized, not container sized. */\n .vuuTable-contentContainer {\n height: calc(var(--measured-px-height) + var(--total-header-height));\n }\n .vuuTable-scrollbarContainer {\n height: calc(\n var(--measured-px-height) + var(--horizontal-scrollbar-height)\n );\n }\n .vuuTable-scrollbarFiller {\n height: var(--horizontal-scrollbar-height);\n }\n }\n\n &.vuuTable-maxViewportRowLimit {\n /* With a maxVviewportRowLimit, table is content sized, not container sized. */\n height: fit-content;\n padding-bottom: var(--horizontal-scrollbar-height);\n\n .vuuTable-contentContainer {\n height: min(\n calc(var(--measured-px-height) + var(--total-header-height)),\n calc(var(--content-height) + var(--total-header-height))\n );\n }\n .vuuTable-scrollbarContainer {\n height: min(\n calc(var(--measured-px-height) + var(--horizontal-scrollbar-height)),\n calc(var(--content-height) + var(--horizontal-scrollbar-height))\n );\n }\n\n .vuuTable-scrollbarFiller {\n height: var(--horizontal-scrollbar-height);\n }\n }\n\n .vuuTable-editing {\n --vuu-table-row-background-highlighted: transparent;\n }\n\n}\n\n.vuuTable-zebra {\n --table-zebraColor: var(--vuuTable-zebraColor, var(--salt-container-secondary-background));\n}\n\n.vuuTable-colLines {\n --cell-borderColor: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-rowLines {\n --row-borderColor: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-scrollbarContainer {\n border-bottom: none !important;\n border-top: none !important;\n height: var(--viewport-body-height);\n left: 0px;\n overflow: auto;\n position: absolute;\n top: var(--total-header-height);\n width: var(--table-width);\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar {\n width: 10px;\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar:horizontal {\n height: 10px;\n}\n\n.vuuTable-scrollbarContainer::-webkit-scrollbar-track {\n background-color: transparent;\n}\n.vuuTable-scrollbarContainer::-webkit-scrollbar-thumb {\n background-clip: padding-box;\n border-radius: 10px;\n border: 2px solid rgba(0, 0, 0, 0);\n background-color: var(--vuu-color-gray-30);\n}\n\n.vuuTable-scrollbarContent {\n height: calc(var(--content-height) + var(--horizontal-scrollbar-height));\n position: absolute;\n width: var(--content-width);\n}\n\n.vuuTable-contentContainer {\n --table-content-container-width: calc(var(--table-width) - var(--vertical-scrollbar-width));\n background: var(--table-background);\n height: calc(\n 100% - var(--horizontal-scrollbar-height) - var(--vuu-table-footer-height)\n );\n position: relative;\n overflow: auto;\n overscroll-behavior: none;\n width: var(--table-content-container-width);\n}\n\n.vuuTable-contentContainer::-webkit-scrollbar {\n display: none;\n}\n\n.vuuTable-table {\n border: none;\n border-collapse: separate;\n border-spacing: 0;\n left: 0;\n margin: 0;\n position: absolute;\n top: 0;\n table-layout: fixed;\n width: var(--content-width);\n}\n\n.vuuTable-body {\n height: var(--content-height);\n position: relative;\n}\n\n.vuuTable-focusCellPlaceholder {\n height: var(--row-height);\n position: absolute;\n width: 50px;\n z-index: -1;\n}\n\n.vuuPinLeft,\n.vuuPinRight {\n background-color: inherit;\n position: sticky;\n z-index: 1;\n}\n\n.vuuPinRight {\n .vuuColumnResizer {\n cursor: default;\n pointer-events: none;\n }\n}\n\n.vuuTableHeaderCell.vuuPinLeft,\n.vuuTableHeaderCell.vuuPinRight {\n z-index: 2;\n}\n\n.vuuTableHeader {\n --row-height: var(--vuu-table-col-header-row-height);\n background-color: var(\n --vuuTableHeader-background,\n var(--table-background)\n );\n border-bottom: solid 1px\n var(\n --vuuTableHeader-borderColor,\n var(--salt-separable-tertiary-borderColor)\n );\n color: var(--salt-content-secondary-foreground);\n font-size: var(--VuuTableHeader-fontSize, vasr(--salt-text-label-fontSize));\n position: sticky;\n top: 0;\n white-space: nowrap;\n\n /* ensure header row sits atop everything else when scrolling down */\n z-index: 1;\n\n .vuuDraggable-spacer {\n border-bottom: solid 1px #ccc;\n display: var(--vuuDraggable-display, inline-block);\n height: var(--vuu-table-col-header-row-height);\n }\n\n .vuuStickyLeft {\n z-index: 1;\n }\n .vuuStickyRight {\n z-index: 0;\n }\n}\n\n.vuuTableHeader:hover {\n --columnResizer-height: var(--vuu-table-col-header-row-height);\n --columnResizer-color: var(--salt-separable-tertiary-borderColor);\n}\n\n.vuuTable-heading {\n height: var(--vuu-table-col-heading-height);\n}\n\n.sizer-cell {\n border: none !important;\n height: 0px;\n}\n\n.vuuDraggable-vuuTable {\n --cell-borderColor: transparent;\n --vuu-table-col-header-row-height: var(--vuuTableHeaderCell-height, 25px);\n --vuuTableHeaderCell-background: var(--salt-container-secondary-background);\n}\n.vuuDraggable-vuuTable {\n --row-height: 25px;\n}\n\n.vuuTable-pagination {\n --vuu-table-footer-height: 32px;\n .vuuTableHeader {\n position: relative;\n }\n\n .vuuTable-body {\n height: calc(var(--content-height) - var(--total-header-height));\n position: relative;\n }\n\n .vuuTableRow {\n position: relative;\n top: auto;\n }\n}\n\n.vuuTable-footer {\n align-items: center;\n display: flex;\n height: var(--vuu-table-footer-height);\n justify-content: flex-end;\n position: absolute;\n left: 0;\n right: 0;\n bottom: 0;\n}\n\n.vuuHighlight {\n color: blue;\n}\n\n.DragColumn {\n box-shadow: var(--salt-overlayable-shadow-drag);\n}\n\n@keyframes fadeIn {\n 0% {\n opacity: 0;\n }\n 90% {\n opacity: 0;\n }\n 100% {\n opacity: 1;\n }\n}\n\n.vuuTable-emptyDisplay {\n animation: fadeIn .8s;\n align-items: center;\n display: flex;\n inset:0;\n justify-content: center;\n position: absolute\n}\n\n.vuuTable-emptyDisplay ~ .vuuTable-contentContainer {\n visibility: hidden;\n}\n\n.vuuRowProxy {\n position: absolute !important;\n visibility: hidden;\n}\n\n.vuuTableColHeaderRow {\n height: var(--col-header-row-height);\n}\n\n.vuuTableRow {\n \n background: var(--row-background, var(--table-background));\n border-bottom: 1px solid var(--row-borderColor, var(--table-background));\n box-sizing: border-box;\n color: var(--salt-content-primary-foreground);\n contain: layout;\n font-size: var(--VuuTableRow-fontSize, vasr(--salt-text-fontSize));\n height: var(--row-height);\n line-height: var(--row-height);\n position: absolute;\n top: 0;\n white-space: nowrap;\n width: 100%;\n}\n\n.vuuTableRow-even {\n --row-background: var(--table-zebraColor);\n}\n\n.vuuTableRow-highlighted {\n background: var(--vuu-table-row-background-highlighted);\n}\n\n.vuuTableRow[aria-selected=\"true\"] {\n background-color: var(--vuu-table-row-background-selected);\n}\n\n.vuuTableRow[aria-expanded=\"true\"] {\n --toggle-icon-transform: rotate(90deg);\n}\n\n.vuuDraggable .vuuTableRow {\n --cell-borderColor: transparent;\n --vuu-selection-decorator-bg: transparent;\n transform: none !important;\n z-index: 1;\n}\n\n.vuuSelectionDecorator {\n background: var(--table-background);\n display: inline-block;\n height: var(--row-height);\n position: relative;\n width: var(--table-selection-bookend-width,4px);\n z-index: 2;\n}\n\n.vuuTableRow:not([aria-selected=\"true\"]){\n .vuuTableRowBookend {\n display: none;\n }\n}\n\n.vuuSelectionDecorator.vuuStickyLeft {\n left: 0;\n position: sticky;\n}\n\n.vuuSelectionDecorator.vuuStickyRight {\n right: 0;\n position: sticky;\n}\n\n .vuuTableRowBookend {\n position: absolute;\n top: -1px;\n right:0;\n bottom:0;\n left:0;\n }\n\n.vuuTable-rowSelection-bordered {\n\n .vuuSelectionDecorator {\n\n .vuuTableRowBookend {\n background-color: var(--vuu-table-row-bookend-background-selected);\n border-color: var(--vuu-table-row-borderColor-selected);\n border-width: 1px;\n width: var(--table-selection-bookend-width,4px);\n\n &:before {\n content: none !important;\n }\n }\n\n &.vuuStickyLeft {\n .vuuTableRowBookend {\n border-left-style: solid;\n }\n }\n &.vuuStickyRight {\n .vuuTableRowBookend {\n border-right-style: solid;\n }\n }\n }\n\n .vuuTableRow[aria-selected=\"true\"]{\n .vuuSelectionDecorator {\n background-color: var(--table-background);\n border: none;\n }\n\n }\n\n /* non-selected row immediately followed by a selected row */\n .vuuTableRow:not([aria-selected=\"true\"]):has( + .vuuTableRow[aria-selected=\"true\"]) {\n border-bottom-color: transparent;\n }\n\n /* first row in a selection block, including a selection block of one row */\n .vuuTableRow:not([aria-selected=\"true\"]) + .vuuTableRow[aria-selected=\"true\"],\n .vuuTableRow[aria-selected=\"true\"][data-first-row=\"true\"]\n {\n border-radius: 0;\n\n &:after {\n background: var(--vuu-table-row-borderColor-selected);\n content: \"\";\n position: absolute;\n top: 0px;\n left: 4px;\n height: 1px;\n width: calc(var(--content-width) - 8px);\n z-index: 1;\n }\n\n .vuuStickyLeft .vuuTableRowBookend {\n border-top-left-radius: var(--vuu-table-row-selection-borderRadius);\n border-top-style: solid;\n margin-top: 1px;\n }\n\n .vuuStickyRight .vuuTableRowBookend {\n border-top-right-radius: var(--vuu-table-row-selection-borderRadius);\n border-top-style: solid;\n margin-top: 1px;\n }\n\n }\n\n /* Last row in a selection block, including a selection block of one row */\n .vuuTableRow[aria-selected=\"true\"]:has( + .vuuTableRow:not([aria-selected=\"true\"])) {\n border-bottom-color: var(--vuu-table-row-borderColor-selected);\n\n .vuuStickyLeft .vuuTableRowBookend {\n border-bottom-left-radius: var(--vuu-table-row-selection-borderRadius);\n border-bottom-style: solid;\n }\n .vuuStickyRight .vuuTableRowBookend {\n border-bottom-right-radius: var(--vuu-table-row-selection-borderRadius);\n border-bottom-style: solid;\n }\n }\n\n}";
|
|
2
|
-
|
|
3
|
-
export { tableCss as default };
|
|
4
|
-
//# sourceMappingURL=Table.css.js.map
|
package/esm/Table.css.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Table.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
|