@salt-ds/data-grid 0.0.0-snapshot-20230920133053 → 0.0.0-snapshot-20240719143459
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/dist-cjs/BaseCell.js +8 -8
- package/dist-cjs/BaseCell.js.map +1 -1
- package/dist-cjs/CellEditor.js.map +1 -1
- package/dist-cjs/{internal/Cell.css.js → CellFrame.css.js} +1 -1
- package/dist-cjs/CellFrame.css.js.map +1 -0
- package/dist-cjs/{internal/Cell.js → CellFrame.js} +9 -9
- package/dist-cjs/CellFrame.js.map +1 -0
- package/dist-cjs/ColumnDataContext.js +1 -1
- package/dist-cjs/ColumnDataContext.js.map +1 -1
- package/dist-cjs/ColumnDragContext.js +1 -1
- package/dist-cjs/ColumnDragContext.js.map +1 -1
- package/dist-cjs/ColumnGroup.js +1 -1
- package/dist-cjs/ColumnGroup.js.map +1 -1
- package/dist-cjs/ColumnSortContext.js +1 -1
- package/dist-cjs/ColumnSortContext.js.map +1 -1
- package/dist-cjs/CornerTag.js +1 -1
- package/dist-cjs/CornerTag.js.map +1 -1
- package/dist-cjs/CursorContext.js +1 -1
- package/dist-cjs/CursorContext.js.map +1 -1
- package/dist-cjs/DropdownCellEditor.js +5 -21
- package/dist-cjs/DropdownCellEditor.js.map +1 -1
- package/dist-cjs/EditorContext.js +1 -1
- package/dist-cjs/EditorContext.js.map +1 -1
- package/dist-cjs/Grid.css.js +1 -1
- package/dist-cjs/Grid.js +36 -42
- package/dist-cjs/Grid.js.map +1 -1
- package/dist-cjs/GridColumn.js.map +1 -1
- package/dist-cjs/GridContext.js +1 -1
- package/dist-cjs/GridContext.js.map +1 -1
- package/dist-cjs/GroupHeaderCell.js +2 -2
- package/dist-cjs/GroupHeaderCell.js.map +1 -1
- package/dist-cjs/GroupHeaderCellValue.js.map +1 -1
- package/dist-cjs/HeaderCell.css.js +1 -1
- package/dist-cjs/HeaderCell.js +10 -10
- package/dist-cjs/HeaderCell.js.map +1 -1
- package/dist-cjs/HeaderCellValue.js.map +1 -1
- package/dist-cjs/LayoutContext.js.map +1 -1
- package/dist-cjs/NumericColumn.js +6 -23
- package/dist-cjs/NumericColumn.js.map +1 -1
- package/dist-cjs/RowSelectionCheckboxCellValue.js +2 -2
- package/dist-cjs/RowSelectionCheckboxCellValue.js.map +1 -1
- package/dist-cjs/RowSelectionCheckboxColumn.js +3 -3
- package/dist-cjs/RowSelectionCheckboxColumn.js.map +1 -1
- package/dist-cjs/RowSelectionCheckboxHeaderCellValue.js +2 -2
- package/dist-cjs/RowSelectionCheckboxHeaderCellValue.js.map +1 -1
- package/dist-cjs/RowSelectionRadioCellValue.js +1 -1
- package/dist-cjs/RowSelectionRadioCellValue.js.map +1 -1
- package/dist-cjs/RowSelectionRadioColumn.js +2 -2
- package/dist-cjs/RowSelectionRadioColumn.js.map +1 -1
- package/dist-cjs/RowSelectionRadioHeaderCell.js +1 -1
- package/dist-cjs/RowSelectionRadioHeaderCell.js.map +1 -1
- package/dist-cjs/RowValidationStatus.js.map +1 -1
- package/dist-cjs/SelectionContext.js +1 -1
- package/dist-cjs/SelectionContext.js.map +1 -1
- package/dist-cjs/SizingContext.js +1 -1
- package/dist-cjs/SizingContext.js.map +1 -1
- package/dist-cjs/TextCellEditor.js +5 -21
- package/dist-cjs/TextCellEditor.js.map +1 -1
- package/dist-cjs/index.js +5 -0
- package/dist-cjs/index.js.map +1 -1
- package/dist-cjs/internal/CellMeasure.js +2 -2
- package/dist-cjs/internal/CellMeasure.js.map +1 -1
- package/dist-cjs/internal/ColumnDropTarget.js +2 -2
- package/dist-cjs/internal/ColumnDropTarget.js.map +1 -1
- package/dist-cjs/internal/ColumnGhost.js +3 -3
- package/dist-cjs/internal/ColumnGhost.js.map +1 -1
- package/dist-cjs/internal/Cursor.js +2 -2
- package/dist-cjs/internal/Cursor.js.map +1 -1
- package/dist-cjs/internal/DefaultCellValue.js +2 -2
- package/dist-cjs/internal/DefaultCellValue.js.map +1 -1
- package/dist-cjs/internal/FakeCell.js +3 -3
- package/dist-cjs/internal/FakeCell.js.map +1 -1
- package/dist-cjs/internal/GroupHeaderRow.js +1 -1
- package/dist-cjs/internal/GroupHeaderRow.js.map +1 -1
- package/dist-cjs/internal/HeaderRow.js +2 -2
- package/dist-cjs/internal/HeaderRow.js.map +1 -1
- package/dist-cjs/internal/LeftPart.js +4 -4
- package/dist-cjs/internal/LeftPart.js.map +1 -1
- package/dist-cjs/internal/MiddlePart.js +3 -3
- package/dist-cjs/internal/MiddlePart.js.map +1 -1
- package/dist-cjs/internal/RightPart.js +3 -3
- package/dist-cjs/internal/RightPart.js.map +1 -1
- package/dist-cjs/internal/Scrollable.js +2 -2
- package/dist-cjs/internal/Scrollable.js.map +1 -1
- package/dist-cjs/internal/TableBody.js +6 -6
- package/dist-cjs/internal/TableBody.js.map +1 -1
- package/dist-cjs/internal/TableColGroup.js.map +1 -1
- package/dist-cjs/internal/TableRow.js +9 -9
- package/dist-cjs/internal/TableRow.js.map +1 -1
- package/dist-cjs/internal/TopLeftPart.js +3 -3
- package/dist-cjs/internal/TopLeftPart.js.map +1 -1
- package/dist-cjs/internal/TopPart.js +3 -3
- package/dist-cjs/internal/TopPart.js.map +1 -1
- package/dist-cjs/internal/TopRightPart.js +3 -3
- package/dist-cjs/internal/TopRightPart.js.map +1 -1
- package/dist-cjs/internal/gridHooks.js +23 -23
- package/dist-cjs/internal/gridHooks.js.map +1 -1
- package/dist-cjs/internal/utils.js +5 -5
- package/dist-cjs/internal/utils.js.map +1 -1
- package/dist-es/BaseCell.js +8 -8
- package/dist-es/BaseCell.js.map +1 -1
- package/dist-es/CellEditor.js.map +1 -1
- package/dist-es/{internal/Cell.css.js → CellFrame.css.js} +1 -1
- package/dist-es/CellFrame.css.js.map +1 -0
- package/dist-es/{internal/Cell.js → CellFrame.js} +8 -8
- package/dist-es/CellFrame.js.map +1 -0
- package/dist-es/ColumnDataContext.js +1 -1
- package/dist-es/ColumnDataContext.js.map +1 -1
- package/dist-es/ColumnDragContext.js +1 -1
- package/dist-es/ColumnDragContext.js.map +1 -1
- package/dist-es/ColumnGroup.js +1 -1
- package/dist-es/ColumnGroup.js.map +1 -1
- package/dist-es/ColumnSortContext.js +1 -1
- package/dist-es/ColumnSortContext.js.map +1 -1
- package/dist-es/CornerTag.js +1 -1
- package/dist-es/CornerTag.js.map +1 -1
- package/dist-es/CursorContext.js +1 -1
- package/dist-es/CursorContext.js.map +1 -1
- package/dist-es/DropdownCellEditor.js +5 -21
- package/dist-es/DropdownCellEditor.js.map +1 -1
- package/dist-es/EditorContext.js +1 -1
- package/dist-es/EditorContext.js.map +1 -1
- package/dist-es/Grid.css.js +1 -1
- package/dist-es/Grid.js +36 -42
- package/dist-es/Grid.js.map +1 -1
- package/dist-es/GridColumn.js.map +1 -1
- package/dist-es/GridContext.js +1 -1
- package/dist-es/GridContext.js.map +1 -1
- package/dist-es/GroupHeaderCell.js +2 -2
- package/dist-es/GroupHeaderCell.js.map +1 -1
- package/dist-es/GroupHeaderCellValue.js.map +1 -1
- package/dist-es/HeaderCell.css.js +1 -1
- package/dist-es/HeaderCell.js +10 -10
- package/dist-es/HeaderCell.js.map +1 -1
- package/dist-es/HeaderCellValue.js.map +1 -1
- package/dist-es/LayoutContext.js.map +1 -1
- package/dist-es/NumericColumn.js +6 -23
- package/dist-es/NumericColumn.js.map +1 -1
- package/dist-es/RowSelectionCheckboxCellValue.js +2 -2
- package/dist-es/RowSelectionCheckboxCellValue.js.map +1 -1
- package/dist-es/RowSelectionCheckboxColumn.js +3 -3
- package/dist-es/RowSelectionCheckboxColumn.js.map +1 -1
- package/dist-es/RowSelectionCheckboxHeaderCellValue.js +2 -2
- package/dist-es/RowSelectionCheckboxHeaderCellValue.js.map +1 -1
- package/dist-es/RowSelectionRadioCellValue.js +1 -1
- package/dist-es/RowSelectionRadioCellValue.js.map +1 -1
- package/dist-es/RowSelectionRadioColumn.js +2 -2
- package/dist-es/RowSelectionRadioColumn.js.map +1 -1
- package/dist-es/RowSelectionRadioHeaderCell.js +1 -1
- package/dist-es/RowSelectionRadioHeaderCell.js.map +1 -1
- package/dist-es/RowValidationStatus.js.map +1 -1
- package/dist-es/SelectionContext.js +1 -1
- package/dist-es/SelectionContext.js.map +1 -1
- package/dist-es/SizingContext.js +1 -1
- package/dist-es/SizingContext.js.map +1 -1
- package/dist-es/TextCellEditor.js +5 -21
- package/dist-es/TextCellEditor.js.map +1 -1
- package/dist-es/index.js +2 -0
- package/dist-es/index.js.map +1 -1
- package/dist-es/internal/CellMeasure.js +2 -2
- package/dist-es/internal/CellMeasure.js.map +1 -1
- package/dist-es/internal/ColumnDropTarget.js +2 -2
- package/dist-es/internal/ColumnDropTarget.js.map +1 -1
- package/dist-es/internal/ColumnGhost.js +3 -3
- package/dist-es/internal/ColumnGhost.js.map +1 -1
- package/dist-es/internal/Cursor.js +2 -2
- package/dist-es/internal/Cursor.js.map +1 -1
- package/dist-es/internal/DefaultCellValue.js +2 -2
- package/dist-es/internal/DefaultCellValue.js.map +1 -1
- package/dist-es/internal/FakeCell.js +3 -3
- package/dist-es/internal/FakeCell.js.map +1 -1
- package/dist-es/internal/GroupHeaderRow.js +1 -1
- package/dist-es/internal/GroupHeaderRow.js.map +1 -1
- package/dist-es/internal/HeaderRow.js +2 -2
- package/dist-es/internal/HeaderRow.js.map +1 -1
- package/dist-es/internal/LeftPart.js +4 -4
- package/dist-es/internal/LeftPart.js.map +1 -1
- package/dist-es/internal/MiddlePart.js +3 -3
- package/dist-es/internal/MiddlePart.js.map +1 -1
- package/dist-es/internal/RightPart.js +3 -3
- package/dist-es/internal/RightPart.js.map +1 -1
- package/dist-es/internal/Scrollable.js +2 -2
- package/dist-es/internal/Scrollable.js.map +1 -1
- package/dist-es/internal/TableBody.js +6 -6
- package/dist-es/internal/TableBody.js.map +1 -1
- package/dist-es/internal/TableColGroup.js.map +1 -1
- package/dist-es/internal/TableRow.js +9 -9
- package/dist-es/internal/TableRow.js.map +1 -1
- package/dist-es/internal/TopLeftPart.js +3 -3
- package/dist-es/internal/TopLeftPart.js.map +1 -1
- package/dist-es/internal/TopPart.js +3 -3
- package/dist-es/internal/TopPart.js.map +1 -1
- package/dist-es/internal/TopRightPart.js +3 -3
- package/dist-es/internal/TopRightPart.js.map +1 -1
- package/dist-es/internal/gridHooks.js +23 -23
- package/dist-es/internal/gridHooks.js.map +1 -1
- package/dist-es/internal/utils.js +5 -5
- package/dist-es/internal/utils.js.map +1 -1
- package/dist-types/BaseCell.d.ts +3 -4
- package/dist-types/CellEditor.d.ts +1 -1
- package/dist-types/CellFrame.d.ts +9 -0
- package/dist-types/ColumnDataContext.d.ts +0 -1
- package/dist-types/ColumnDragContext.d.ts +1 -1
- package/dist-types/ColumnGroup.d.ts +4 -4
- package/dist-types/ColumnSortContext.d.ts +5 -5
- package/dist-types/CornerTag.d.ts +1 -2
- package/dist-types/CursorContext.d.ts +0 -1
- package/dist-types/DropdownCellEditor.d.ts +2 -3
- package/dist-types/EditorContext.d.ts +0 -1
- package/dist-types/Grid.d.ts +4 -4
- package/dist-types/GridColumn.d.ts +3 -3
- package/dist-types/GridContext.d.ts +2 -3
- package/dist-types/GroupHeaderCell.d.ts +3 -3
- package/dist-types/GroupHeaderCellValue.d.ts +2 -3
- package/dist-types/HeaderCell.d.ts +5 -6
- package/dist-types/HeaderCellValue.d.ts +2 -3
- package/dist-types/LayoutContext.d.ts +0 -1
- package/dist-types/NumericColumn.d.ts +6 -6
- package/dist-types/RowSelectionCheckboxCellValue.d.ts +2 -3
- package/dist-types/RowSelectionCheckboxColumn.d.ts +2 -3
- package/dist-types/RowSelectionCheckboxHeaderCellValue.d.ts +2 -3
- package/dist-types/RowSelectionRadioCellValue.d.ts +2 -3
- package/dist-types/RowSelectionRadioColumn.d.ts +2 -3
- package/dist-types/RowSelectionRadioHeaderCell.d.ts +2 -3
- package/dist-types/RowValidationStatus.d.ts +2 -3
- package/dist-types/SelectionContext.d.ts +1 -2
- package/dist-types/SizingContext.d.ts +3 -3
- package/dist-types/TextCellEditor.d.ts +2 -3
- package/dist-types/index.d.ts +2 -0
- package/dist-types/internal/CellMeasure.d.ts +1 -2
- package/dist-types/internal/CellStatusIcons.d.ts +3 -4
- package/dist-types/internal/ColumnDropTarget.d.ts +1 -2
- package/dist-types/internal/ColumnGhost.d.ts +3 -4
- package/dist-types/internal/Cursor.d.ts +1 -4
- package/dist-types/internal/DefaultCellValue.d.ts +2 -3
- package/dist-types/internal/FakeCell.d.ts +2 -3
- package/dist-types/internal/FakeGroupCell.d.ts +1 -2
- package/dist-types/internal/FakeHeaderCell.d.ts +1 -2
- package/dist-types/internal/GroupHeaderRow.d.ts +2 -3
- package/dist-types/internal/HeaderRow.d.ts +2 -3
- package/dist-types/internal/LeftPart.d.ts +4 -4
- package/dist-types/internal/MiddlePart.d.ts +4 -4
- package/dist-types/internal/RightPart.d.ts +4 -4
- package/dist-types/internal/Scrollable.d.ts +2 -2
- package/dist-types/internal/TableBody.d.ts +3 -4
- package/dist-types/internal/TableColGroup.d.ts +3 -4
- package/dist-types/internal/TableRow.d.ts +4 -4
- package/dist-types/internal/TopLeftPart.d.ts +2 -3
- package/dist-types/internal/TopPart.d.ts +3 -3
- package/dist-types/internal/TopRightPart.d.ts +2 -3
- package/dist-types/internal/gridHooks.d.ts +13 -13
- package/dist-types/internal/index.d.ts +0 -1
- package/dist-types/internal/utils.d.ts +1 -1
- package/package.json +5 -6
- package/dist-cjs/internal/Cell.css.js.map +0 -1
- package/dist-cjs/internal/Cell.js.map +0 -1
- package/dist-es/internal/Cell.css.js.map +0 -1
- package/dist-es/internal/Cell.js.map +0 -1
- package/dist-types/internal/Cell.d.ts +0 -8
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
3
|
-
import { useWindow } from '@salt-ds/window';
|
|
4
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { useCursorContext } from '../CursorContext.js';
|
|
5
6
|
import { HeaderCell } from '../HeaderCell.js';
|
|
6
7
|
import { HeaderCellValue } from '../HeaderCellValue.js';
|
|
7
|
-
import { useCursorContext } from '../CursorContext.js';
|
|
8
8
|
import { FakeHeaderCell } from './FakeHeaderCell.js';
|
|
9
9
|
import css_248z from './HeaderRow.css.js';
|
|
10
10
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeaderRow.js","sources":["../src/internal/HeaderRow.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport {
|
|
1
|
+
{"version":3,"file":"HeaderRow.js","sources":["../src/internal/HeaderRow.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { useCursorContext } from \"../CursorContext\";\nimport type { GridColumnModel } from \"../Grid\";\nimport { HeaderCell } from \"../HeaderCell\";\nimport { HeaderCellValue } from \"../HeaderCellValue\";\n\nimport { FakeHeaderCell } from \"./FakeHeaderCell\";\n\nimport headerRowCss from \"./HeaderRow.css\";\n\nconst withBaseName = makePrefixer(\"saltGridHeaderRow\");\n\nexport interface HeaderRowProps<T> {\n columns: GridColumnModel<T>[];\n gap?: number;\n}\n\nexport function HeaderRow<T>(props: HeaderRowProps<T>) {\n const { columns, gap } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-header-row\",\n css: headerRowCss,\n window: targetWindow,\n });\n\n const { cursorColIdx, focusedPart, headerIsFocusable } = useCursorContext();\n\n const ariaRowIndex = headerIsFocusable ? 1 : undefined;\n\n return (\n <tr className={withBaseName()} role=\"row\" aria-rowindex={ariaRowIndex}>\n {columns.map((column) => {\n const Cell = column.info.props.headerComponent || HeaderCell;\n const CellValue =\n column.info.props.headerValueComponent || HeaderCellValue;\n const isFocused =\n focusedPart === \"header\" && cursorColIdx === column.index;\n return (\n <Cell\n key={column.info.props.id}\n column={column}\n isFocused={isFocused}\n >\n <CellValue column={column} isFocused={isFocused} />\n </Cell>\n );\n })}\n {gap !== undefined && gap > 0 ? <FakeHeaderCell /> : null}\n </tr>\n );\n}\n"],"names":["headerRowCss"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA,CAAA;AAO9C,SAAS,UAAa,KAA0B,EAAA;AACrD,EAAM,MAAA,EAAE,OAAS,EAAA,GAAA,EAAQ,GAAA,KAAA,CAAA;AAEzB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,MAAM,EAAE,YAAA,EAAc,WAAa,EAAA,iBAAA,KAAsB,gBAAiB,EAAA,CAAA;AAE1E,EAAM,MAAA,YAAA,GAAe,oBAAoB,CAAI,GAAA,KAAA,CAAA,CAAA;AAE7C,EAAA,uBACG,IAAA,CAAA,IAAA,EAAA;AAAA,IAAG,WAAW,YAAa,EAAA;AAAA,IAAG,IAAK,EAAA,KAAA;AAAA,IAAM,eAAe,EAAA,YAAA;AAAA,IACtD,QAAA,EAAA;AAAA,MAAQ,OAAA,CAAA,GAAA,CAAI,CAAC,MAAW,KAAA;AACvB,QAAA,MAAM,IAAO,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,eAAmB,IAAA,UAAA,CAAA;AAClD,QAAA,MAAM,SACJ,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,oBAAwB,IAAA,eAAA,CAAA;AAC5C,QAAA,MAAM,SACJ,GAAA,WAAA,KAAgB,QAAY,IAAA,YAAA,KAAiB,MAAO,CAAA,KAAA,CAAA;AACtD,QAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,UAEC,MAAA;AAAA,UACA,SAAA;AAAA,UAEA,QAAC,kBAAA,GAAA,CAAA,SAAA,EAAA;AAAA,YAAU,MAAA;AAAA,YAAgB,SAAA;AAAA,WAAsB,CAAA;AAAA,SAJ5C,EAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,EAKzB,CAAA,CAAA;AAAA,OAEH,CAAA;AAAA,MACA,QAAQ,KAAa,CAAA,IAAA,GAAA,GAAM,CAAI,mBAAA,GAAA,CAAC,kBAAe,CAAK,GAAA,IAAA;AAAA,KAAA;AAAA,GACvD,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { clsx } from 'clsx';
|
|
3
|
-
import { useWindow } from '@salt-ds/window';
|
|
4
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
6
|
-
import {
|
|
3
|
+
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { clsx } from 'clsx';
|
|
7
6
|
import { TableBody } from './TableBody.js';
|
|
8
7
|
import { TableColGroup } from './TableColGroup.js';
|
|
8
|
+
import { useActiveOnWheel } from './gridHooks.js';
|
|
9
9
|
import css_248z from './LeftPart.css.js';
|
|
10
10
|
|
|
11
11
|
const withBaseName = makePrefixer("saltGridLeftPart");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LeftPart.js","sources":["../src/internal/LeftPart.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"LeftPart.js","sources":["../src/internal/LeftPart.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport type { RefObject } from \"react\";\n\nimport type { GridColumnModel, GridRowModel } from \"../Grid\";\nimport type { CellValidationState } from \"../GridColumn\";\n\nimport { TableBody } from \"./TableBody\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { useActiveOnWheel } from \"./gridHooks\";\n\nimport leftPartCss from \"./LeftPart.css\";\n\nconst withBaseName = makePrefixer(\"saltGridLeftPart\");\n\nexport interface LeftPartProps<T> {\n leftRef: RefObject<HTMLDivElement>;\n onWheel: EventListener;\n rightShadow?: boolean;\n columns: GridColumnModel<T>[];\n rows: GridRowModel<T>[];\n hoverOverRowKey?: string;\n setHoverOverRowKey: (key: string | undefined) => void;\n zebra?: boolean;\n getRowValidationStatus?: (\n row: GridRowModel<T>,\n ) => CellValidationState | undefined;\n}\n\nexport function LeftPart<T>(props: LeftPartProps<T>) {\n const {\n leftRef,\n onWheel,\n rightShadow,\n columns,\n rows,\n hoverOverRowKey,\n setHoverOverRowKey,\n zebra,\n getRowValidationStatus,\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-left-part\",\n css: leftPartCss,\n window: targetWindow,\n });\n\n const tableRef = useActiveOnWheel(onWheel);\n\n if (columns.length === 0) {\n return null;\n }\n\n return (\n <div\n ref={leftRef}\n className={clsx(withBaseName(), {\n [withBaseName(\"rightShadow\")]: rightShadow,\n })}\n >\n <div className={withBaseName(\"space\")} data-testid=\"grid-left-part\">\n <table ref={tableRef} role=\"presentation\">\n <TableColGroup columns={columns} />\n <TableBody\n columns={columns}\n rows={rows}\n hoverRowKey={hoverOverRowKey}\n setHoverRowKey={setHoverOverRowKey}\n zebra={zebra}\n getRowValidationStatus={getRowValidationStatus}\n />\n </table>\n </div>\n </div>\n );\n}\n"],"names":["leftPartCss"],"mappings":";;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,kBAAkB,CAAA,CAAA;AAgB7C,SAAS,SAAY,KAAyB,EAAA;AACnD,EAAM,MAAA;AAAA,IACJ,OAAA;AAAA,IACA,OAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,KAAA;AAAA,IACA,sBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,gBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,QAAA,GAAW,iBAAiB,OAAO,CAAA,CAAA;AAEzC,EAAI,IAAA,OAAA,CAAQ,WAAW,CAAG,EAAA;AACxB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,OAAA;AAAA,IACL,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,aAAa,CAAI,GAAA,WAAA;AAAA,KAChC,CAAA;AAAA,IAED,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAAG,aAAY,EAAA,gBAAA;AAAA,MACjD,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,OAAA;AAAA,WAAkB,CAAA;AAAA,0BAChC,GAAA,CAAA,SAAA,EAAA;AAAA,YACC,OAAA;AAAA,YACA,IAAA;AAAA,YACA,WAAa,EAAA,eAAA;AAAA,YACb,cAAgB,EAAA,kBAAA;AAAA,YAChB,KAAA;AAAA,YACA,sBAAA;AAAA,WACF,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { useWindow } from '@salt-ds/window';
|
|
3
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
5
|
-
import {
|
|
3
|
+
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
6
5
|
import { TableBody } from './TableBody.js';
|
|
6
|
+
import { TableColGroup } from './TableColGroup.js';
|
|
7
7
|
import { useActiveOnWheel } from './gridHooks.js';
|
|
8
8
|
import css_248z from './MiddlePart.css.js';
|
|
9
9
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MiddlePart.js","sources":["../src/internal/MiddlePart.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"MiddlePart.js","sources":["../src/internal/MiddlePart.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type { RefObject } from \"react\";\n\nimport type { GridColumnModel, GridRowModel } from \"../Grid\";\nimport type { CellValidationState } from \"../GridColumn\";\n\nimport { TableBody } from \"./TableBody\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { useActiveOnWheel } from \"./gridHooks\";\n\nimport middlePartCss from \"./MiddlePart.css\";\n\nconst withBaseName = makePrefixer(\"saltGridMiddlePart\");\n\nexport interface MiddlePartProps<T> {\n middleRef: RefObject<HTMLDivElement>;\n onWheel: EventListener;\n columns: GridColumnModel<T>[];\n rows: GridRowModel<T>[];\n hoverOverRowKey?: string;\n setHoverOverRowKey: (key: string | undefined) => void;\n midGap: number;\n zebra?: boolean;\n getRowValidationStatus?: (\n row: GridRowModel<T>,\n ) => CellValidationState | undefined;\n}\n\nexport function MiddlePart<T>(props: MiddlePartProps<T>) {\n const {\n middleRef,\n onWheel,\n columns,\n rows,\n hoverOverRowKey,\n setHoverOverRowKey,\n midGap,\n zebra,\n getRowValidationStatus,\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-middle-part\",\n css: middlePartCss,\n window: targetWindow,\n });\n\n const tableRef = useActiveOnWheel(onWheel);\n\n return (\n <div\n ref={middleRef}\n className={withBaseName()}\n data-testid=\"grid-middle-part\"\n >\n <div className={withBaseName(\"space\")}>\n <table ref={tableRef} role=\"presentation\">\n <TableColGroup columns={columns} gap={midGap} />\n <TableBody\n columns={columns}\n rows={rows}\n hoverRowKey={hoverOverRowKey}\n setHoverRowKey={setHoverOverRowKey}\n gap={midGap}\n zebra={zebra}\n getRowValidationStatus={getRowValidationStatus}\n />\n </table>\n </div>\n </div>\n );\n}\n"],"names":["middlePartCss"],"mappings":";;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA,CAAA;AAgB/C,SAAS,WAAc,KAA2B,EAAA;AACvD,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,IAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,sBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,kBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,QAAA,GAAW,iBAAiB,OAAO,CAAA,CAAA;AAEzC,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,SAAA;AAAA,IACL,WAAW,YAAa,EAAA;AAAA,IACxB,aAAY,EAAA,kBAAA;AAAA,IAEZ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAClC,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,OAAA;AAAA,YAAkB,GAAK,EAAA,MAAA;AAAA,WAAQ,CAAA;AAAA,0BAC7C,GAAA,CAAA,SAAA,EAAA;AAAA,YACC,OAAA;AAAA,YACA,IAAA;AAAA,YACA,WAAa,EAAA,eAAA;AAAA,YACb,cAAgB,EAAA,kBAAA;AAAA,YAChB,GAAK,EAAA,MAAA;AAAA,YACL,KAAA;AAAA,YACA,sBAAA;AAAA,WACF,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { clsx } from 'clsx';
|
|
3
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
4
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
4
|
import { useWindow } from '@salt-ds/window';
|
|
6
|
-
import {
|
|
7
|
-
import { TableColGroup } from './TableColGroup.js';
|
|
5
|
+
import { clsx } from 'clsx';
|
|
8
6
|
import { TableBody } from './TableBody.js';
|
|
7
|
+
import { TableColGroup } from './TableColGroup.js';
|
|
8
|
+
import { useActiveOnWheel } from './gridHooks.js';
|
|
9
9
|
import css_248z from './RightPart.css.js';
|
|
10
10
|
|
|
11
11
|
const withBaseName = makePrefixer("saltGridRightPart");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPart.js","sources":["../src/internal/RightPart.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"RightPart.js","sources":["../src/internal/RightPart.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport type { RefObject } from \"react\";\n\nimport type { GridColumnModel, GridRowModel } from \"../Grid\";\nimport type { CellValidationState } from \"../GridColumn\";\n\nimport { TableBody } from \"./TableBody\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { useActiveOnWheel } from \"./gridHooks\";\n\nimport rightPartCss from \"./RightPart.css\";\n\nconst withBaseName = makePrefixer(\"saltGridRightPart\");\n\nexport interface RightPartProps<T> {\n rightRef: RefObject<HTMLDivElement>;\n onWheel: EventListener;\n leftShadow?: boolean;\n columns: GridColumnModel<T>[];\n rows: GridRowModel<T>[];\n hoverOverRowKey?: string;\n setHoverOverRowKey: (key: string | undefined) => void;\n zebra?: boolean;\n getRowValidationStatus?: (\n row: GridRowModel<T>,\n ) => CellValidationState | undefined;\n}\n\nexport function RightPart<T>(props: RightPartProps<T>) {\n const {\n rightRef,\n onWheel,\n columns,\n leftShadow,\n rows,\n hoverOverRowKey,\n setHoverOverRowKey,\n zebra,\n getRowValidationStatus,\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-right-part\",\n css: rightPartCss,\n window: targetWindow,\n });\n\n const tableRef = useActiveOnWheel(onWheel);\n\n if (columns.length === 0) {\n return null;\n }\n\n return (\n <div\n ref={rightRef}\n className={clsx(withBaseName(), {\n [withBaseName(\"leftShadow\")]: leftShadow,\n })}\n data-testid=\"grid-right-part\"\n >\n <div className={withBaseName(\"space\")}>\n <table ref={tableRef} role=\"presentation\">\n <TableColGroup columns={columns} />\n <TableBody\n columns={columns}\n rows={rows}\n hoverRowKey={hoverOverRowKey}\n setHoverRowKey={setHoverOverRowKey}\n zebra={zebra}\n getRowValidationStatus={getRowValidationStatus}\n />\n </table>\n </div>\n </div>\n );\n}\n"],"names":["rightPartCss"],"mappings":";;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,mBAAmB,CAAA,CAAA;AAgB9C,SAAS,UAAa,KAA0B,EAAA;AACrD,EAAM,MAAA;AAAA,IACJ,QAAA;AAAA,IACA,OAAA;AAAA,IACA,OAAA;AAAA,IACA,UAAA;AAAA,IACA,IAAA;AAAA,IACA,eAAA;AAAA,IACA,kBAAA;AAAA,IACA,KAAA;AAAA,IACA,sBAAA;AAAA,GACE,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,QAAA,GAAW,iBAAiB,OAAO,CAAA,CAAA;AAEzC,EAAI,IAAA,OAAA,CAAQ,WAAW,CAAG,EAAA;AACxB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,QAAA;AAAA,IACL,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,KAC/B,CAAA;AAAA,IACD,aAAY,EAAA,iBAAA;AAAA,IAEZ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAClC,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,OAAA;AAAA,WAAkB,CAAA;AAAA,0BAChC,GAAA,CAAA,SAAA,EAAA;AAAA,YACC,OAAA;AAAA,YACA,IAAA;AAAA,YACA,WAAa,EAAA,eAAA;AAAA,YACb,cAAgB,EAAA,kBAAA;AAAA,YAChB,KAAA;AAAA,YACA,sBAAA;AAAA,WACF,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useEffect } from 'react';
|
|
3
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { useEffect } from 'react';
|
|
6
6
|
import css_248z from './Scrollable.css.js';
|
|
7
7
|
|
|
8
8
|
const withBaseName = makePrefixer("saltGridScrollable");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Scrollable.js","sources":["../src/internal/Scrollable.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"Scrollable.js","sources":["../src/internal/Scrollable.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { type RefObject, type UIEventHandler, useEffect } from \"react\";\n\nimport scrollableCss from \"./Scrollable.css\";\n\nconst withBaseName = makePrefixer(\"saltGridScrollable\");\n\nexport interface ScrollableProps<T> {\n resizeClient: (params: {\n clientWidth: number;\n clientHeight: number;\n scrollBarWidth: number;\n scrollBarHeight: number;\n }) => void;\n\n scrollLeft: number;\n scrollTop: number;\n scrollSource: \"user\" | \"table\";\n scroll: (left?: number, top?: number, source?: \"user\" | \"table\") => void;\n\n scrollerRef: RefObject<HTMLDivElement>;\n middleRef: RefObject<HTMLDivElement>;\n topRef: RefObject<HTMLDivElement>;\n leftRef: RefObject<HTMLDivElement>;\n rightRef: RefObject<HTMLDivElement>;\n bottomRef: RefObject<HTMLDivElement>;\n}\n\n// Provides scrollbars for the grid. Synchronizes scrolling across all parts\n// (pinned and unpinned).\nexport function Scrollable<T>(props: ScrollableProps<T>) {\n const {\n scrollerRef,\n middleRef,\n topRef,\n leftRef,\n rightRef,\n bottomRef,\n resizeClient,\n scrollLeft,\n scrollTop,\n scrollSource,\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-scrollable\",\n css: scrollableCss,\n window: targetWindow,\n });\n\n const onScroll: UIEventHandler<HTMLDivElement> = (event) => {\n if (!scrollerRef.current) {\n return;\n }\n const { scrollLeft, scrollTop } = scrollerRef.current;\n const top = topRef.current;\n if (top) {\n top.scrollLeft = scrollLeft;\n }\n const bottom = bottomRef.current;\n if (bottom) {\n bottom.scrollLeft = scrollLeft;\n }\n const left = leftRef.current;\n if (left) {\n left.scrollTop = scrollTop;\n }\n const right = rightRef.current;\n if (right) {\n right.scrollTop = scrollTop;\n }\n const middle = middleRef.current;\n if (middle) {\n middle.scrollTop = scrollTop;\n middle.scrollLeft = scrollLeft;\n }\n props.scroll(scrollLeft, scrollTop, \"user\");\n };\n\n useEffect(() => {\n if (!scrollerRef.current) {\n return;\n }\n const resizeObserver = new ResizeObserver(([entry]) => {\n const { offsetWidth, offsetHeight, clientWidth, clientHeight } =\n entry.target as HTMLDivElement;\n const scrollBarWidth = offsetWidth - clientWidth;\n const scrollBarHeight = offsetHeight - clientHeight;\n resizeClient({\n clientWidth,\n clientHeight,\n scrollBarWidth,\n scrollBarHeight,\n });\n });\n\n resizeObserver.observe(scrollerRef.current);\n return () => resizeObserver.disconnect();\n }, [resizeClient, scrollerRef]);\n\n useEffect(() => {\n if (!scrollerRef.current) {\n return;\n }\n if (scrollSource === \"table\") {\n if (scrollLeft !== scrollerRef.current.scrollLeft) {\n scrollerRef.current.scrollLeft = scrollLeft;\n }\n if (scrollTop !== scrollerRef.current.scrollTop) {\n scrollerRef.current.scrollTop = scrollTop;\n }\n }\n }, [scrollLeft, scrollTop, scrollSource, scrollerRef]);\n\n return (\n <div\n ref={scrollerRef}\n className={withBaseName()}\n onScroll={onScroll}\n data-testid=\"grid-scrollable\"\n >\n <div className={withBaseName(\"space\")} />\n </div>\n );\n}\n"],"names":["scrollableCss","scrollLeft","scrollTop"],"mappings":"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"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { useCallback } from 'react';
|
|
3
|
+
import { useCursorContext } from '../CursorContext.js';
|
|
4
|
+
import { useEditorContext } from '../EditorContext.js';
|
|
5
|
+
import { useSelectionContext } from '../SelectionContext.js';
|
|
3
6
|
import { TableRow } from './TableRow.js';
|
|
4
7
|
import { getRowKeyAttribute } from './utils.js';
|
|
5
|
-
import { useSelectionContext } from '../SelectionContext.js';
|
|
6
|
-
import { useEditorContext } from '../EditorContext.js';
|
|
7
|
-
import { useCursorContext } from '../CursorContext.js';
|
|
8
8
|
|
|
9
9
|
function TableBody(props) {
|
|
10
10
|
const {
|
|
@@ -38,10 +38,10 @@ function TableBody(props) {
|
|
|
38
38
|
const rowKey = getRowKeyAttribute(target);
|
|
39
39
|
setHoverRowKey(rowKey);
|
|
40
40
|
};
|
|
41
|
-
const onMouseLeave = (
|
|
41
|
+
const onMouseLeave = () => {
|
|
42
42
|
setHoverRowKey(void 0);
|
|
43
43
|
};
|
|
44
|
-
const onDoubleClick = (
|
|
44
|
+
const onDoubleClick = () => {
|
|
45
45
|
startEditMode();
|
|
46
46
|
};
|
|
47
47
|
return /* @__PURE__ */ jsx("tbody", {
|
|
@@ -59,7 +59,7 @@ function TableBody(props) {
|
|
|
59
59
|
isSelected,
|
|
60
60
|
cursorColIdx: cursorIdx,
|
|
61
61
|
gap,
|
|
62
|
-
zebra: zebra && row.index % 2
|
|
62
|
+
zebra: zebra && row.index % 2 === 0,
|
|
63
63
|
editorColIdx,
|
|
64
64
|
isCellSelected: isCellInSelectedRange,
|
|
65
65
|
headerIsFocusable,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableBody.js","sources":["../src/internal/TableBody.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback
|
|
1
|
+
{"version":3,"file":"TableBody.js","sources":["../src/internal/TableBody.tsx"],"sourcesContent":["import { type MouseEventHandler, useCallback } from \"react\";\nimport { useCursorContext } from \"../CursorContext\";\nimport { useEditorContext } from \"../EditorContext\";\nimport type { GridColumnModel, GridRowModel } from \"../Grid\";\nimport type { CellValidationState } from \"../GridColumn\";\nimport { useSelectionContext } from \"../SelectionContext\";\nimport { TableRow } from \"./TableRow\";\nimport { getRowKeyAttribute } from \"./utils\";\n\nexport interface TableBodyProps<T> {\n columns: GridColumnModel<T>[];\n rows: GridRowModel<T>[];\n hoverRowKey?: string;\n setHoverRowKey: (key: string | undefined) => void;\n gap?: number;\n zebra?: boolean;\n getRowValidationStatus?: (\n row: GridRowModel<T>,\n ) => CellValidationState | undefined;\n}\n\nexport function TableBody<T>(props: TableBodyProps<T>) {\n const {\n columns,\n rows,\n hoverRowKey,\n setHoverRowKey,\n gap,\n zebra,\n getRowValidationStatus,\n } = props;\n const { selRowIdxs, selectedCellRange } = useSelectionContext();\n\n const isCellInSelectedRange = useCallback(\n (rowIdx: number, colIdx: number) => {\n if (!selectedCellRange) {\n return false;\n }\n const { start, end } = selectedCellRange;\n const minRowIdx = Math.min(start.rowIdx, end.rowIdx);\n const maxRowIdx = Math.max(start.rowIdx, end.rowIdx);\n const minColIdx = Math.min(start.colIdx, end.colIdx);\n const maxColIdx = Math.max(start.colIdx, end.colIdx);\n return (\n rowIdx >= minRowIdx &&\n rowIdx <= maxRowIdx &&\n colIdx >= minColIdx &&\n colIdx <= maxColIdx\n );\n },\n [selectedCellRange],\n );\n\n const { cursorRowIdx, cursorColIdx, focusedPart, headerIsFocusable } =\n useCursorContext();\n\n const { editMode, startEditMode } = useEditorContext();\n\n const onRowMouseEnter: MouseEventHandler<HTMLTableRowElement> = (event) => {\n const target = event.currentTarget as HTMLElement;\n const rowKey = getRowKeyAttribute(target);\n setHoverRowKey(rowKey);\n };\n\n const onMouseLeave: MouseEventHandler<HTMLTableSectionElement> = () => {\n setHoverRowKey(undefined);\n };\n\n const onDoubleClick: MouseEventHandler<HTMLTableSectionElement> = () => {\n startEditMode();\n };\n\n return (\n <tbody onMouseLeave={onMouseLeave} onDoubleClick={onDoubleClick}>\n {rows.map((row) => {\n const isSelected = selRowIdxs.has(row.index);\n const cursorIdx =\n focusedPart === \"body\" && cursorRowIdx === row.index\n ? cursorColIdx\n : undefined;\n const editorColIdx = editMode ? cursorIdx : undefined;\n return (\n <TableRow\n key={row.key}\n row={row}\n onMouseEnter={onRowMouseEnter}\n columns={columns}\n isHoverOver={row.key === hoverRowKey}\n isSelected={isSelected}\n cursorColIdx={cursorIdx}\n gap={gap}\n zebra={zebra && row.index % 2 === 0}\n editorColIdx={editorColIdx}\n isCellSelected={isCellInSelectedRange}\n headerIsFocusable={headerIsFocusable}\n validationStatus={\n getRowValidationStatus ? getRowValidationStatus(row) : undefined\n }\n />\n );\n })}\n </tbody>\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableColGroup.js","sources":["../src/internal/TableColGroup.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport { GridColumnModel } from \"../Grid\";\n\nexport interface TableColGroupProps<T> {\n columns: GridColumnModel<T>[];\n gap?: number;\n}\n\nexport interface TableColProps<T> {\n width: number;\n}\n\n// Controls column widths.\nexport function TableColGroup<T>(props: TableColGroupProps<T>) {\n const { columns, gap } = props;\n return (\n <colgroup>\n {columns.map((column) => {\n return (\n <TableCol key={column.info.props.id} width={column.info.width} />\n );\n })}\n {gap !== undefined && gap > 0 ? (\n <TableCol key=\"__gap\" width={gap} />\n ) : null}\n </colgroup>\n );\n}\n\nexport function TableCol<T>(props: TableColProps<T>) {\n const { width } = props;\n const style = useMemo(() => {\n return {\n width: `${width}px`,\n };\n }, [width]);\n return <col style={style} />;\n}\n"],"names":[],"mappings":";;;AAaO,SAAS,cAAiB,KAA8B,EAAA;AAC7D,EAAM,MAAA,EAAE,OAAS,EAAA,GAAA,EAAQ,GAAA,KAAA,CAAA;AACzB,EAAA,uBACG,IAAA,CAAA,UAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,MAAQ,OAAA,CAAA,GAAA,CAAI,CAAC,MAAW,KAAA;AACvB,QAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,UAAoC,KAAA,EAAO,OAAO,IAAK,CAAA,KAAA;AAAA,SAAzC,EAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,EAA8B,CAAA,CAAA;AAAA,OAElE,CAAA;AAAA,MACA,GAAQ,KAAA,KAAA,CAAA,IAAa,GAAM,GAAA,CAAA,mBACzB,GAAA,CAAA,QAAA,EAAA;AAAA,QAAqB,KAAO,EAAA,GAAA;AAAA,OAAA,EAAf,OAAoB,CAChC,GAAA,IAAA;AAAA,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ,CAAA;AAEO,SAAS,SAAY,KAAyB,EAAA;AACnD,EAAM,MAAA,EAAE,OAAU,GAAA,KAAA,CAAA;AAClB,EAAM,MAAA,KAAA,GAAQ,QAAQ,MAAM;AAC1B,IAAO,OAAA;AAAA,MACL,OAAO,CAAG,EAAA,KAAA,CAAA,EAAA,CAAA;AAAA,KACZ,CAAA;AAAA,GACF,EAAG,CAAC,KAAK,CAAC,CAAA,CAAA;AACV,EAAA,uBAAQ,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,KAAA;AAAA,GAAc,CAAA,CAAA;AAC5B;;;;"}
|
|
1
|
+
{"version":3,"file":"TableColGroup.js","sources":["../src/internal/TableColGroup.tsx"],"sourcesContent":["import { useMemo } from \"react\";\nimport type { GridColumnModel } from \"../Grid\";\n\nexport interface TableColGroupProps<T> {\n columns: GridColumnModel<T>[];\n gap?: number;\n}\n\nexport interface TableColProps<T> {\n width: number;\n}\n\n// Controls column widths.\nexport function TableColGroup<T>(props: TableColGroupProps<T>) {\n const { columns, gap } = props;\n return (\n <colgroup>\n {columns.map((column) => {\n return (\n <TableCol key={column.info.props.id} width={column.info.width} />\n );\n })}\n {gap !== undefined && gap > 0 ? (\n <TableCol key=\"__gap\" width={gap} />\n ) : null}\n </colgroup>\n );\n}\n\nexport function TableCol<T>(props: TableColProps<T>) {\n const { width } = props;\n const style = useMemo(() => {\n return {\n width: `${width}px`,\n };\n }, [width]);\n return <col style={style} />;\n}\n"],"names":[],"mappings":";;;AAaO,SAAS,cAAiB,KAA8B,EAAA;AAC7D,EAAM,MAAA,EAAE,OAAS,EAAA,GAAA,EAAQ,GAAA,KAAA,CAAA;AACzB,EAAA,uBACG,IAAA,CAAA,UAAA,EAAA;AAAA,IACE,QAAA,EAAA;AAAA,MAAQ,OAAA,CAAA,GAAA,CAAI,CAAC,MAAW,KAAA;AACvB,QAAA,uBACG,GAAA,CAAA,QAAA,EAAA;AAAA,UAAoC,KAAA,EAAO,OAAO,IAAK,CAAA,KAAA;AAAA,SAAzC,EAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,EAA8B,CAAA,CAAA;AAAA,OAElE,CAAA;AAAA,MACA,GAAQ,KAAA,KAAA,CAAA,IAAa,GAAM,GAAA,CAAA,mBACzB,GAAA,CAAA,QAAA,EAAA;AAAA,QAAqB,KAAO,EAAA,GAAA;AAAA,OAAA,EAAf,OAAoB,CAChC,GAAA,IAAA;AAAA,KAAA;AAAA,GACN,CAAA,CAAA;AAEJ,CAAA;AAEO,SAAS,SAAY,KAAyB,EAAA;AACnD,EAAM,MAAA,EAAE,OAAU,GAAA,KAAA,CAAA;AAClB,EAAM,MAAA,KAAA,GAAQ,QAAQ,MAAM;AAC1B,IAAO,OAAA;AAAA,MACL,OAAO,CAAG,EAAA,KAAA,CAAA,EAAA,CAAA;AAAA,KACZ,CAAA;AAAA,GACF,EAAG,CAAC,KAAK,CAAC,CAAA,CAAA;AACV,EAAA,uBAAQ,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,KAAA;AAAA,GAAc,CAAA,CAAA;AAC5B;;;;"}
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { isValidElement, Children, cloneElement } from 'react';
|
|
3
|
-
import { clsx } from 'clsx';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
3
|
+
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { clsx } from 'clsx';
|
|
6
|
+
import { isValidElement, Children, cloneElement } from 'react';
|
|
7
7
|
import { BaseCell } from '../BaseCell.js';
|
|
8
8
|
import { useGridContext } from '../GridContext.js';
|
|
9
9
|
import { RowValidationStatusContext } from '../RowValidationStatus.js';
|
|
10
|
-
import { FakeCell } from './FakeCell.js';
|
|
11
10
|
import { DefaultCellValue } from './DefaultCellValue.js';
|
|
11
|
+
import { FakeCell } from './FakeCell.js';
|
|
12
12
|
import css_248z from './TableRow.css.js';
|
|
13
13
|
|
|
14
14
|
const withBaseName = makePrefixer("saltGridTableRow");
|
|
@@ -36,7 +36,7 @@ function TableRow(props) {
|
|
|
36
36
|
});
|
|
37
37
|
const grid = useGridContext();
|
|
38
38
|
if (!row.key) {
|
|
39
|
-
throw new Error(
|
|
39
|
+
throw new Error("Invalid row");
|
|
40
40
|
}
|
|
41
41
|
const ariaRowIndex = headerIsFocusable ? row.index + 2 : row.index + 1;
|
|
42
42
|
return /* @__PURE__ */ jsxs("tr", {
|
|
@@ -76,7 +76,7 @@ function TableRow(props) {
|
|
|
76
76
|
const CellValue = column.info.props.cellValueComponent || DefaultCellValue;
|
|
77
77
|
const value = column.info.props.getValue && row.data ? column.info.props.getValue(row.data) : null;
|
|
78
78
|
const isFocused = cursorColIdx === column.index;
|
|
79
|
-
const isSelected2 = isCellSelected
|
|
79
|
+
const isSelected2 = isCellSelected == null ? void 0 : isCellSelected(row.index, column.index);
|
|
80
80
|
const validationFnArg = {
|
|
81
81
|
row,
|
|
82
82
|
column,
|
|
@@ -107,8 +107,8 @@ function TableRow(props) {
|
|
|
107
107
|
validationMessage,
|
|
108
108
|
validationType: column.info.props.validationType
|
|
109
109
|
})
|
|
110
|
-
}
|
|
111
|
-
});
|
|
110
|
+
})
|
|
111
|
+
}, colKey);
|
|
112
112
|
}),
|
|
113
113
|
gap !== void 0 && gap > 0 ? /* @__PURE__ */ jsx(FakeCell, {
|
|
114
114
|
row
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableRow.js","sources":["../src/internal/TableRow.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TableRow.js","sources":["../src/internal/TableRow.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n Children,\n type MouseEventHandler,\n cloneElement,\n isValidElement,\n} from \"react\";\n\nimport { BaseCell } from \"../BaseCell\";\nimport type { GridColumnModel, GridRowModel } from \"../Grid\";\nimport type { CellValidationState } from \"../GridColumn\";\nimport { useGridContext } from \"../GridContext\";\nimport { RowValidationStatusContext } from \"../RowValidationStatus\";\n\nimport { DefaultCellValue } from \"./DefaultCellValue\";\nimport { FakeCell } from \"./FakeCell\";\n\nimport tableRowCss from \"./TableRow.css\";\n\nconst withBaseName = makePrefixer(\"saltGridTableRow\");\n\nexport interface TableRowProps<T> {\n row: GridRowModel<T>;\n isSelected?: boolean;\n isHoverOver?: boolean;\n zebra?: boolean;\n columns: GridColumnModel<T>[];\n cursorColIdx?: number;\n onMouseEnter?: MouseEventHandler<HTMLTableRowElement>;\n onMouseLeave?: MouseEventHandler<HTMLTableRowElement>;\n gap?: number;\n editorColIdx?: number;\n isCellSelected?: (rowIdx: number, colIdx: number) => boolean;\n headerIsFocusable?: boolean;\n validationStatus?: CellValidationState;\n}\n\nexport function TableRow<T>(props: TableRowProps<T>) {\n const {\n row,\n isSelected,\n zebra,\n isHoverOver,\n columns,\n onMouseEnter,\n onMouseLeave,\n cursorColIdx,\n gap,\n editorColIdx,\n isCellSelected,\n headerIsFocusable,\n validationStatus: rowValidationStatus,\n } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-table-row\",\n css: tableRowCss,\n window: targetWindow,\n });\n\n const grid = useGridContext();\n\n if (!row.key) {\n throw new Error(\"Invalid row\");\n }\n\n const ariaRowIndex = headerIsFocusable ? row.index + 2 : row.index + 1;\n\n return (\n <tr\n aria-rowindex={ariaRowIndex}\n aria-selected={isSelected ? true : undefined}\n className={clsx(withBaseName(), {\n [withBaseName(\"zebra\")]: zebra,\n [withBaseName(\"hover\")]: isHoverOver,\n [withBaseName(\"selected\")]: isSelected,\n [withBaseName(\"first\")]: row.index === 0,\n [withBaseName(`validationStatus-${rowValidationStatus}`)]:\n rowValidationStatus,\n })}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n data-row-index={row.index}\n data-row-key={row.key}\n role=\"row\"\n >\n {columns.map((column, i) => {\n const colKey = column.info.props.id;\n const editorInfo = grid.getEditor(column.info.props.id);\n const isEditable = !!editorInfo;\n\n if (editorColIdx === column.index) {\n if (isEditable) {\n if (isValidElement(editorInfo.children)) {\n const editorElement = Children.only(editorInfo.children);\n return cloneElement(editorElement, {\n key: colKey,\n row,\n column,\n } as any);\n }\n }\n }\n\n const Cell = column.info.props.cellComponent || BaseCell;\n const CellValue =\n column.info.props.cellValueComponent || DefaultCellValue;\n const value =\n column.info.props.getValue && row.data\n ? column.info.props.getValue(row.data)\n : null;\n const isFocused = cursorColIdx === column.index;\n const isSelected = isCellSelected?.(row.index, column.index);\n const validationFnArg = {\n row,\n column,\n isFocused,\n value,\n };\n const validationStatus =\n column.info.props.getValidationStatus?.(validationFnArg);\n const validationMessage =\n validationStatus &&\n column.info.props.getValidationMessage?.(validationFnArg);\n\n return (\n <RowValidationStatusContext.Provider\n key={colKey}\n value={{ status: rowValidationStatus }}\n >\n <Cell\n row={row}\n column={column}\n isFocused={isFocused}\n isSelected={isSelected}\n isEditable={isEditable}\n validationStatus={validationStatus}\n validationMessage={validationMessage}\n validationType={column.info.props.validationType}\n value={value}\n align={column.info.props.align}\n >\n <CellValue\n column={column}\n row={row}\n value={value}\n isFocused={isFocused}\n validationStatus={validationStatus}\n validationMessage={validationMessage}\n validationType={column.info.props.validationType}\n />\n </Cell>\n </RowValidationStatusContext.Provider>\n );\n })}\n {gap !== undefined && gap > 0 ? <FakeCell row={row} /> : null}\n </tr>\n );\n}\n"],"names":["tableRowCss","isSelected"],"mappings":"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"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { clsx } from 'clsx';
|
|
3
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { clsx } from 'clsx';
|
|
6
6
|
import { GroupHeaderRow } from './GroupHeaderRow.js';
|
|
7
|
-
import { TableColGroup } from './TableColGroup.js';
|
|
8
7
|
import { HeaderRow } from './HeaderRow.js';
|
|
8
|
+
import { TableColGroup } from './TableColGroup.js';
|
|
9
9
|
import { useActiveOnWheel } from './gridHooks.js';
|
|
10
10
|
import css_248z from './TopLeftPart.css.js';
|
|
11
11
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopLeftPart.js","sources":["../src/internal/TopLeftPart.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TopLeftPart.js","sources":["../src/internal/TopLeftPart.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\n\nimport type { GridColumnGroupModel, GridColumnModel } from \"../Grid\";\n\nimport { GroupHeaderRow } from \"./GroupHeaderRow\";\nimport { HeaderRow } from \"./HeaderRow\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { useActiveOnWheel } from \"./gridHooks\";\n\nimport topLeftPartCss from \"./TopLeftPart.css\";\n\nconst withBaseName = makePrefixer(\"saltGridTopLeftPart\");\n\nexport interface TopLeftPartProps<T> {\n onWheel: EventListener;\n columns: GridColumnModel<T>[];\n columnGroups: GridColumnGroupModel[];\n rightShadow?: boolean;\n bottomShadow?: boolean;\n}\n\nexport function TopLeftPart<T>(props: TopLeftPartProps<T>) {\n const { onWheel, columns, columnGroups, rightShadow, bottomShadow } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-top-left-part\",\n css: topLeftPartCss,\n window: targetWindow,\n });\n\n const tableRef = useActiveOnWheel(onWheel);\n\n if (columns.length === 0) {\n return null;\n }\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"rightShadow\")]: rightShadow,\n [withBaseName(\"bottomShadow\")]: bottomShadow,\n })}\n data-testid=\"grid-top-left-part\"\n >\n <table ref={tableRef} role=\"presentation\">\n <TableColGroup columns={columns} />\n <thead>\n <GroupHeaderRow groups={columnGroups} />\n <HeaderRow columns={columns} />\n </thead>\n </table>\n </div>\n );\n}\n"],"names":["topLeftPartCss"],"mappings":";;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAUhD,SAAS,YAAe,KAA4B,EAAA;AACzD,EAAA,MAAM,EAAE,OAAS,EAAA,OAAA,EAAS,YAAc,EAAA,WAAA,EAAa,cAAiB,GAAA,KAAA,CAAA;AAEtE,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,oBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,QAAA,GAAW,iBAAiB,OAAO,CAAA,CAAA;AAEzC,EAAI,IAAA,OAAA,CAAQ,WAAW,CAAG,EAAA;AACxB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,aAAa,CAAI,GAAA,WAAA;AAAA,MAC/B,CAAC,YAAa,CAAA,cAAc,CAAI,GAAA,YAAA;AAAA,KACjC,CAAA;AAAA,IACD,aAAY,EAAA,oBAAA;AAAA,IAEZ,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,MAAM,GAAK,EAAA,QAAA;AAAA,MAAU,IAAK,EAAA,cAAA;AAAA,MACzB,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,aAAA,EAAA;AAAA,UAAc,OAAA;AAAA,SAAkB,CAAA;AAAA,wBAChC,IAAA,CAAA,OAAA,EAAA;AAAA,UACC,QAAA,EAAA;AAAA,4BAAC,GAAA,CAAA,cAAA,EAAA;AAAA,cAAe,MAAQ,EAAA,YAAA;AAAA,aAAc,CAAA;AAAA,4BACrC,GAAA,CAAA,SAAA,EAAA;AAAA,cAAU,OAAA;AAAA,aAAkB,CAAA;AAAA,WAAA;AAAA,SAC/B,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { clsx } from 'clsx';
|
|
3
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
6
|
-
import {
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { clsx } from 'clsx';
|
|
7
6
|
import { GroupHeaderRow } from './GroupHeaderRow.js';
|
|
7
|
+
import { HeaderRow } from './HeaderRow.js';
|
|
8
8
|
import { TableColGroup } from './TableColGroup.js';
|
|
9
9
|
import { useActiveOnWheel } from './gridHooks.js';
|
|
10
10
|
import css_248z from './TopPart.css.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopPart.js","sources":["../src/internal/TopPart.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TopPart.js","sources":["../src/internal/TopPart.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport type { RefObject } from \"react\";\n\nimport type { GridColumnGroupModel, GridColumnModel } from \"../Grid\";\n\nimport { GroupHeaderRow } from \"./GroupHeaderRow\";\nimport { HeaderRow } from \"./HeaderRow\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { useActiveOnWheel } from \"./gridHooks\";\n\nimport topPartCss from \"./TopPart.css\";\n\nconst withBaseName = makePrefixer(\"saltGridTopPart\");\n\nexport interface TopPartProps<T> {\n topRef: RefObject<HTMLDivElement>;\n onWheel: EventListener;\n columns: GridColumnModel<T>[];\n columnGroups: GridColumnGroupModel[];\n midGap: number;\n bottomShadow?: boolean;\n}\n\nexport function TopPart<T>(props: TopPartProps<T>) {\n const { topRef, onWheel, columns, columnGroups, midGap, bottomShadow } =\n props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-top-part\",\n css: topPartCss,\n window: targetWindow,\n });\n\n const tableRef = useActiveOnWheel(onWheel);\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"bottomShadow\")]: bottomShadow,\n })}\n ref={topRef}\n data-testid=\"grid-top-part\"\n >\n <div className={withBaseName(\"space\")}>\n <table ref={tableRef} role=\"presentation\">\n <TableColGroup columns={columns} gap={midGap} />\n <thead>\n <GroupHeaderRow groups={columnGroups} gap={midGap} />\n <HeaderRow columns={columns} gap={midGap} />\n </thead>\n </table>\n </div>\n </div>\n );\n}\n"],"names":["topPartCss"],"mappings":";;;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,iBAAiB,CAAA,CAAA;AAW5C,SAAS,QAAW,KAAwB,EAAA;AACjD,EAAA,MAAM,EAAE,MAAQ,EAAA,OAAA,EAAS,SAAS,YAAc,EAAA,MAAA,EAAQ,cACtD,GAAA,KAAA,CAAA;AAEF,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,eAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,QAAA,GAAW,iBAAiB,OAAO,CAAA,CAAA;AAEzC,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,cAAc,CAAI,GAAA,YAAA;AAAA,KACjC,CAAA;AAAA,IACD,GAAK,EAAA,MAAA;AAAA,IACL,aAAY,EAAA,eAAA;AAAA,IAEZ,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAClC,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,aAAA,EAAA;AAAA,YAAc,OAAA;AAAA,YAAkB,GAAK,EAAA,MAAA;AAAA,WAAQ,CAAA;AAAA,0BAC7C,IAAA,CAAA,OAAA,EAAA;AAAA,YACC,QAAA,EAAA;AAAA,8BAAC,GAAA,CAAA,cAAA,EAAA;AAAA,gBAAe,MAAQ,EAAA,YAAA;AAAA,gBAAc,GAAK,EAAA,MAAA;AAAA,eAAQ,CAAA;AAAA,8BAClD,GAAA,CAAA,SAAA,EAAA;AAAA,gBAAU,OAAA;AAAA,gBAAkB,GAAK,EAAA,MAAA;AAAA,eAAQ,CAAA;AAAA,aAAA;AAAA,WAC5C,CAAA;AAAA,SAAA;AAAA,OACF,CAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { TableColGroup } from './TableColGroup.js';
|
|
3
|
-
import { HeaderRow } from './HeaderRow.js';
|
|
4
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
5
|
-
import { useWindow } from '@salt-ds/window';
|
|
6
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
7
5
|
import { clsx } from 'clsx';
|
|
6
|
+
import { HeaderRow } from './HeaderRow.js';
|
|
7
|
+
import { TableColGroup } from './TableColGroup.js';
|
|
8
8
|
import { GroupHeaderRow } from './GroupHeaderRow.js';
|
|
9
9
|
import { useActiveOnWheel } from './gridHooks.js';
|
|
10
10
|
import css_248z from './TopRightPart.css.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TopRightPart.js","sources":["../src/internal/TopRightPart.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TopRightPart.js","sources":["../src/internal/TopRightPart.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { HeaderRow } from \"./HeaderRow\";\nimport { TableColGroup } from \"./TableColGroup\";\n\nimport type { GridColumnGroupModel, GridColumnModel } from \"../Grid\";\n\nimport { GroupHeaderRow } from \"./GroupHeaderRow\";\nimport { useActiveOnWheel } from \"./gridHooks\";\n\nimport topRightPartCss from \"./TopRightPart.css\";\n\nconst withBaseName = makePrefixer(\"saltGridTopRightPart\");\n\nexport interface TopRightPartProps<T> {\n onWheel: EventListener;\n columns: GridColumnModel<T>[];\n columnGroups: GridColumnGroupModel[];\n leftShadow?: boolean;\n bottomShadow?: boolean;\n}\n\nexport function TopRightPart<T>(props: TopRightPartProps<T>) {\n const { onWheel, columns, columnGroups, leftShadow, bottomShadow } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-top-right-part\",\n css: topRightPartCss,\n window: targetWindow,\n });\n\n const tableRef = useActiveOnWheel(onWheel);\n\n if (columns.length === 0) {\n return null;\n }\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"leftShadow\")]: leftShadow,\n [withBaseName(\"bottomShadow\")]: bottomShadow,\n })}\n data-testid=\"grid-top-right-part\"\n >\n <table\n className={withBaseName(\"table\")}\n ref={tableRef}\n role=\"presentation\"\n >\n <TableColGroup columns={columns} />\n <thead>\n <GroupHeaderRow groups={columnGroups} />\n <HeaderRow columns={columns} />\n {/*TODO Do we need a toolbar?*/}\n {/*{showToolbar ? <HeaderToolbarRow columns={rightColumns} /> : null}*/}\n </thead>\n </table>\n </div>\n );\n}\n"],"names":["topRightPartCss"],"mappings":";;;;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,sBAAsB,CAAA,CAAA;AAUjD,SAAS,aAAgB,KAA6B,EAAA;AAC3D,EAAA,MAAM,EAAE,OAAS,EAAA,OAAA,EAAS,YAAc,EAAA,UAAA,EAAY,cAAiB,GAAA,KAAA,CAAA;AAErE,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,qBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,QAAA,GAAW,iBAAiB,OAAO,CAAA,CAAA;AAEzC,EAAI,IAAA,OAAA,CAAQ,WAAW,CAAG,EAAA;AACxB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,YAAY,CAAI,GAAA,UAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,cAAc,CAAI,GAAA,YAAA;AAAA,KACjC,CAAA;AAAA,IACD,aAAY,EAAA,qBAAA;AAAA,IAEZ,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,MACC,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAC/B,GAAK,EAAA,QAAA;AAAA,MACL,IAAK,EAAA,cAAA;AAAA,MAEL,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,aAAA,EAAA;AAAA,UAAc,OAAA;AAAA,SAAkB,CAAA;AAAA,wBAChC,IAAA,CAAA,OAAA,EAAA;AAAA,UACC,QAAA,EAAA;AAAA,4BAAC,GAAA,CAAA,cAAA,EAAA;AAAA,cAAe,MAAQ,EAAA,YAAA;AAAA,aAAc,CAAA;AAAA,4BACrC,GAAA,CAAA,SAAA,EAAA;AAAA,cAAU,OAAA;AAAA,aAAkB,CAAA;AAAA,WAAA;AAAA,SAG/B,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
+
import { useControlled } from '@salt-ds/core';
|
|
1
2
|
import { useMemo, useCallback, useRef, useState, useEffect, Children, isValidElement } from 'react';
|
|
2
3
|
import { NumberRange } from '../NumberRange.js';
|
|
3
4
|
import { getAttribute, makeMapAdder, makeMapDeleter, getCellPosition } from './utils.js';
|
|
4
|
-
import { useControlled } from '@salt-ds/core';
|
|
5
5
|
|
|
6
6
|
function useActiveOnWheel(onWheel) {
|
|
7
7
|
const tableRef = useRef(null);
|
|
@@ -276,7 +276,7 @@ function useColumnResize(cols, resizeColumn) {
|
|
|
276
276
|
const x = event.screenX;
|
|
277
277
|
const { startX, columnIndex, initialColumnWidth, minWidth } = columnResizeDataRef.current;
|
|
278
278
|
const shift = x - startX;
|
|
279
|
-
|
|
279
|
+
const width = Math.max(minWidth, initialColumnWidth + shift);
|
|
280
280
|
columnResizeDataRef.current.resizeColumn(columnIndex, Math.round(width));
|
|
281
281
|
}, []);
|
|
282
282
|
return useCallback(
|
|
@@ -286,7 +286,7 @@ function useColumnResize(cols, resizeColumn) {
|
|
|
286
286
|
targetElement,
|
|
287
287
|
"data-column-index"
|
|
288
288
|
);
|
|
289
|
-
const columnIndex = parseInt(columnIndexAttribute, 10);
|
|
289
|
+
const columnIndex = Number.parseInt(columnIndexAttribute, 10);
|
|
290
290
|
document.addEventListener("mouseup", onMouseUp);
|
|
291
291
|
document.addEventListener("mousemove", onMouseMove);
|
|
292
292
|
const initialColumnWidth = thElement.getBoundingClientRect().width;
|
|
@@ -309,7 +309,7 @@ function useColumnResize(cols, resizeColumn) {
|
|
|
309
309
|
}
|
|
310
310
|
function useFlatten(map) {
|
|
311
311
|
return useMemo(() => {
|
|
312
|
-
const entries = [...map.entries()].filter(([
|
|
312
|
+
const entries = [...map.entries()].filter(([, value]) => !!value);
|
|
313
313
|
entries.sort((a, b) => a[0] - b[0]);
|
|
314
314
|
return entries.map((x) => x[1]);
|
|
315
315
|
}, [map]);
|
|
@@ -404,7 +404,7 @@ function useColumnRegistry(children) {
|
|
|
404
404
|
}, []);
|
|
405
405
|
const onColumnRemoved = useCallback(
|
|
406
406
|
(index, columnInfo) => {
|
|
407
|
-
const {
|
|
407
|
+
const { pinned } = columnInfo.props;
|
|
408
408
|
getColMapSet(pinned)(makeMapDeleter(index));
|
|
409
409
|
},
|
|
410
410
|
[]
|
|
@@ -416,7 +416,7 @@ function useColumnRegistry(children) {
|
|
|
416
416
|
}, []);
|
|
417
417
|
const onColumnGroupRemoved = useCallback(
|
|
418
418
|
(index, colGroupProps) => {
|
|
419
|
-
const {
|
|
419
|
+
const { pinned } = colGroupProps;
|
|
420
420
|
getGrpMapSet(pinned)(makeMapDeleter(index));
|
|
421
421
|
},
|
|
422
422
|
[]
|
|
@@ -467,13 +467,13 @@ function useColumnRegistry(children) {
|
|
|
467
467
|
}
|
|
468
468
|
function useRowSelection(rowKeyGetter, rowData, defaultSelectedRowIdxs, selectedRowIdxs, rowSelectionMode, onRowSelected) {
|
|
469
469
|
const selectedRowIdxsProp = useMemo(() => {
|
|
470
|
-
if (selectedRowIdxs
|
|
470
|
+
if (selectedRowIdxs === void 0) {
|
|
471
471
|
return void 0;
|
|
472
472
|
}
|
|
473
473
|
return new Set(selectedRowIdxs);
|
|
474
474
|
}, [selectedRowIdxs]);
|
|
475
475
|
const defaultSelectedRowIdxsProp = useMemo(() => {
|
|
476
|
-
if (defaultSelectedRowIdxs
|
|
476
|
+
if (defaultSelectedRowIdxs === void 0) {
|
|
477
477
|
return /* @__PURE__ */ new Set([]);
|
|
478
478
|
}
|
|
479
479
|
return new Set(defaultSelectedRowIdxs);
|
|
@@ -612,16 +612,13 @@ function useColumnMove(columnMove, rootRef, leftCols, midCols, rightCols, cols,
|
|
|
612
612
|
(columnIndex, x, y) => {
|
|
613
613
|
setDragState({ columnIndex, x, y });
|
|
614
614
|
},
|
|
615
|
-
[
|
|
616
|
-
);
|
|
617
|
-
const columnDrag = useCallback(
|
|
618
|
-
(x, y) => {
|
|
619
|
-
setDragState((old) => {
|
|
620
|
-
return { ...old, x, y };
|
|
621
|
-
});
|
|
622
|
-
},
|
|
623
|
-
[setDragState]
|
|
615
|
+
[]
|
|
624
616
|
);
|
|
617
|
+
const columnDrag = useCallback((x, y) => {
|
|
618
|
+
setDragState((old) => {
|
|
619
|
+
return { ...old, x, y };
|
|
620
|
+
});
|
|
621
|
+
}, []);
|
|
625
622
|
const columnDrop = useCallback(() => {
|
|
626
623
|
var _a, _b, _c, _d;
|
|
627
624
|
const toIndex = (_a = activeTargetRef.current) == null ? void 0 : _a.columnIndex;
|
|
@@ -673,9 +670,12 @@ function useColumnMove(columnMove, rootRef, leftCols, midCols, rightCols, cols,
|
|
|
673
670
|
"data-column-index"
|
|
674
671
|
);
|
|
675
672
|
const rootElement = rootRef.current;
|
|
673
|
+
if (!rootElement) {
|
|
674
|
+
return;
|
|
675
|
+
}
|
|
676
676
|
document.addEventListener("mouseup", onMouseUp);
|
|
677
677
|
document.addEventListener("mousemove", onMouseMove);
|
|
678
|
-
const columnIndex = parseInt(columnIndexAttribute, 10);
|
|
678
|
+
const columnIndex = Number.parseInt(columnIndexAttribute, 10);
|
|
679
679
|
const columnId = cols[columnIndex].info.props.id;
|
|
680
680
|
const thRect = thElement.getBoundingClientRect();
|
|
681
681
|
const rootRect = rootElement.getBoundingClientRect();
|
|
@@ -704,14 +704,14 @@ function useColumnMove(columnMove, rootRef, leftCols, midCols, rightCols, cols,
|
|
|
704
704
|
setDragState(void 0);
|
|
705
705
|
(_a = moveRef.current) == null ? void 0 : _a.unsubscribe();
|
|
706
706
|
moveRef.current = void 0;
|
|
707
|
-
}, [
|
|
707
|
+
}, []);
|
|
708
708
|
const targets = useMemo(() => {
|
|
709
709
|
if (!dragState) {
|
|
710
710
|
return void 0;
|
|
711
711
|
}
|
|
712
|
-
|
|
712
|
+
const ts = [];
|
|
713
713
|
let x = 0;
|
|
714
|
-
leftCols.forEach((c
|
|
714
|
+
leftCols.forEach((c) => {
|
|
715
715
|
ts.push({ columnIndex: c.index, x });
|
|
716
716
|
x += c.info.width;
|
|
717
717
|
});
|
|
@@ -732,7 +732,7 @@ function useColumnMove(columnMove, rootRef, leftCols, midCols, rightCols, cols,
|
|
|
732
732
|
}
|
|
733
733
|
if (rightCols.length > 0) {
|
|
734
734
|
x += w;
|
|
735
|
-
rightCols.forEach((c
|
|
735
|
+
rightCols.forEach((c) => {
|
|
736
736
|
ts.push({ columnIndex: c.index, x });
|
|
737
737
|
x += c.info.width;
|
|
738
738
|
});
|
|
@@ -805,7 +805,7 @@ function useRangeSelection(cellSelectionMode) {
|
|
|
805
805
|
}, []);
|
|
806
806
|
const onMouseUp = useCallback((event) => {
|
|
807
807
|
if (!mouseSelectionRef.current) {
|
|
808
|
-
throw new Error(
|
|
808
|
+
throw new Error("useRangeSelection state is not initialized");
|
|
809
809
|
}
|
|
810
810
|
mouseSelectionRef.current.unsubscribe();
|
|
811
811
|
mouseSelectionRef.current = void 0;
|