@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
package/dist-es/NumericColumn.js
CHANGED
|
@@ -1,28 +1,11 @@
|
|
|
1
1
|
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
-
import { useRef, useState, useEffect } from 'react';
|
|
3
|
-
import { useWindow } from '@salt-ds/window';
|
|
4
2
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
3
|
+
import { useWindow } from '@salt-ds/window';
|
|
4
|
+
import { useRef, useState, useEffect } from 'react';
|
|
5
|
+
import { CellFrame } from './CellFrame.js';
|
|
7
6
|
import { CornerTag } from './CornerTag.js';
|
|
8
|
-
import {
|
|
9
|
-
import './
|
|
10
|
-
import './internal/Cursor.js';
|
|
11
|
-
import './internal/GroupHeaderRow.js';
|
|
12
|
-
import './internal/HeaderRow.js';
|
|
13
|
-
import './internal/LeftPart.js';
|
|
14
|
-
import './internal/MiddlePart.js';
|
|
15
|
-
import './internal/RightPart.js';
|
|
16
|
-
import './internal/Scrollable.js';
|
|
17
|
-
import './internal/TableRow.js';
|
|
18
|
-
import './SelectionContext.js';
|
|
19
|
-
import './CursorContext.js';
|
|
20
|
-
import './NumberRange.js';
|
|
21
|
-
import '@salt-ds/core';
|
|
22
|
-
import './internal/TopLeftPart.js';
|
|
23
|
-
import './internal/TopPart.js';
|
|
24
|
-
import './internal/TopRightPart.js';
|
|
25
|
-
import './internal/DefaultCellValue.js';
|
|
7
|
+
import { useEditorContext } from './EditorContext.js';
|
|
8
|
+
import { GridColumn } from './GridColumn.js';
|
|
26
9
|
import css_248z from './NumericColumn.css.js';
|
|
27
10
|
|
|
28
11
|
function isNumber(value) {
|
|
@@ -89,7 +72,7 @@ function NumericCellEditor(props) {
|
|
|
89
72
|
document == null ? void 0 : document.removeEventListener("mousedown", focusOut, true);
|
|
90
73
|
};
|
|
91
74
|
}, [endEditMode, editorText]);
|
|
92
|
-
return /* @__PURE__ */ jsxs(
|
|
75
|
+
return /* @__PURE__ */ jsxs(CellFrame, {
|
|
93
76
|
separator: column == null ? void 0 : column.separator,
|
|
94
77
|
className: "saltGridNumericCellEditor",
|
|
95
78
|
children: [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NumericColumn.js","sources":["../src/NumericColumn.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"NumericColumn.js","sources":["../src/NumericColumn.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n type ChangeEventHandler,\n type KeyboardEventHandler,\n type ReactNode,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { CellFrame } from \"./CellFrame\";\nimport { CornerTag } from \"./CornerTag\";\nimport { useEditorContext } from \"./EditorContext\";\nimport type { GridColumnModel, GridRowModel } from \"./Grid\";\nimport {\n type GridCellValueProps,\n GridColumn,\n type GridColumnProps,\n} from \"./GridColumn\";\n\nimport numericColumnCss from \"./NumericColumn.css\";\n\nexport interface NumericColumnProps<T> extends GridColumnProps<T> {\n precision: number;\n}\n\nfunction isNumber(value: unknown): value is number {\n return typeof value === \"number\" && Number.isFinite(value);\n}\n\nexport function NumericCellValue<T>(props: GridCellValueProps<T>) {\n const { column, value } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-numeric-column\",\n css: numericColumnCss,\n window: targetWindow,\n });\n\n const columnProps = column.info.props as NumericColumnProps<T>;\n const { precision } = columnProps;\n const text = isNumber(value) ? value.toFixed(precision) : \"\";\n return <div className=\"saltGridNumericCellValue\">{text}</div>;\n}\n\nexport interface NumericEditorProps<T> {\n row?: GridRowModel<T>;\n column?: GridColumnModel<T>;\n children?: ReactNode;\n}\n\nexport function NumericCellEditor<T>(props: NumericEditorProps<T>) {\n const { column, row } = props;\n const inputRef = useRef<HTMLInputElement>(null);\n\n const { endEditMode, cancelEditMode, initialText } = useEditorContext();\n\n const [editorText, setEditorText] = useState<string>(\n initialText != null ? initialText : column!.info.props.getValue!(row!.data),\n );\n\n const initialSelectionRef = useRef(!!initialText);\n\n const onChange: ChangeEventHandler<HTMLInputElement> = (e) => {\n setEditorText(e.target.value);\n };\n\n const onKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n endEditMode(editorText);\n return;\n }\n if (event.key === \"Escape\") {\n cancelEditMode();\n return;\n }\n if (event.key === \"Tab\") {\n endEditMode(editorText);\n event.preventDefault();\n return;\n }\n event.stopPropagation();\n };\n\n useEffect(() => {\n if (inputRef.current && !initialSelectionRef.current) {\n inputRef.current.select();\n initialSelectionRef.current = true;\n }\n }, [inputRef.current]);\n\n useEffect(() => {\n const input = inputRef.current;\n const focusOut = (event: FocusEvent) => {\n if (!input?.contains(event.target as Node)) {\n endEditMode(editorText);\n }\n };\n\n // This uses the capture phase to detect clicks outside the input to avoid a race condition where the component gets unmounted when edit mode ends.\n document?.addEventListener(\"mousedown\", focusOut, true);\n\n return () => {\n document?.removeEventListener(\"mousedown\", focusOut, true);\n };\n }, [endEditMode, editorText]);\n\n return (\n <CellFrame\n separator={column?.separator}\n className=\"saltGridNumericCellEditor\"\n >\n <div className=\"saltGridNumericCellEditor-inputContainer\">\n <input\n ref={inputRef}\n data-testid=\"grid-cell-editor-input\"\n autoFocus={true}\n value={editorText}\n onChange={onChange}\n onKeyDown={onKeyDown}\n />\n </div>\n <CornerTag />\n </CellFrame>\n );\n}\n\nexport function NumericColumn<T>(props: NumericColumnProps<T>) {\n return (\n <GridColumn\n {...props}\n align={\"right\"}\n cellValueComponent={NumericCellValue}\n >\n {props.children}\n </GridColumn>\n );\n}\n"],"names":["numericColumnCss"],"mappings":"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"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { Checkbox } from '@salt-ds/core';
|
|
3
|
-
import { useWindow } from '@salt-ds/window';
|
|
4
3
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
|
-
import {
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
6
5
|
import { useCursorContext } from './CursorContext.js';
|
|
6
|
+
import { useSelectionContext } from './SelectionContext.js';
|
|
7
7
|
import css_248z from './CheckboxCell.css.js';
|
|
8
8
|
|
|
9
9
|
function RowSelectionCheckboxCellValue(props) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionCheckboxCellValue.js","sources":["../src/RowSelectionCheckboxCellValue.tsx"],"sourcesContent":["import { Checkbox } from \"@salt-ds/core\";\nimport {
|
|
1
|
+
{"version":3,"file":"RowSelectionCheckboxCellValue.js","sources":["../src/RowSelectionCheckboxCellValue.tsx"],"sourcesContent":["import { Checkbox } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport type { MouseEventHandler } from \"react\";\nimport { useCursorContext } from \"./CursorContext\";\nimport type { GridCellValueProps } from \"./GridColumn\";\nimport { useSelectionContext } from \"./SelectionContext\";\n\nimport checkboxCellCss from \"./CheckboxCell.css\";\n\nexport function RowSelectionCheckboxCellValue<T>(props: GridCellValueProps<T>) {\n const { row, column, isFocused } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-checkbox-cell\",\n css: checkboxCellCss,\n window: targetWindow,\n });\n\n const { selRowIdxs, selectRows } = useSelectionContext();\n const { moveCursor } = useCursorContext();\n\n const isSelected = selRowIdxs.has(row.index);\n\n const onMouseDown: MouseEventHandler<HTMLDivElement> = (event) => {\n selectRows({ rowIndex: row.index, incremental: true });\n moveCursor(\"body\", row.index, column.index);\n event.preventDefault();\n event.stopPropagation();\n };\n\n return (\n <div className=\"saltGridCheckboxContainer\" onMouseDown={onMouseDown}>\n <Checkbox\n data-testid=\"grid-row-selection-checkbox\"\n inputProps={{\n \"aria-label\": \"Select Row\",\n tabIndex: isFocused ? 0 : -1,\n }}\n checked={isSelected}\n />\n </div>\n );\n}\n"],"names":["checkboxCellCss"],"mappings":";;;;;;;;AAWO,SAAS,8BAAiC,KAA8B,EAAA;AAC7E,EAAA,MAAM,EAAE,GAAA,EAAK,MAAQ,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAEnC,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,EAAA,MAAM,EAAE,UAAA,EAAY,UAAW,EAAA,GAAI,mBAAoB,EAAA,CAAA;AACvD,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,gBAAiB,EAAA,CAAA;AAExC,EAAA,MAAM,UAAa,GAAA,UAAA,CAAW,GAAI,CAAA,GAAA,CAAI,KAAK,CAAA,CAAA;AAE3C,EAAM,MAAA,WAAA,GAAiD,CAAC,KAAU,KAAA;AAChE,IAAA,UAAA,CAAW,EAAE,QAAU,EAAA,GAAA,CAAI,KAAO,EAAA,WAAA,EAAa,MAAM,CAAA,CAAA;AACrD,IAAA,UAAA,CAAW,MAAQ,EAAA,GAAA,CAAI,KAAO,EAAA,MAAA,CAAO,KAAK,CAAA,CAAA;AAC1C,IAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,IAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,2BAAA;AAAA,IAA4B,WAAA;AAAA,IACzC,QAAC,kBAAA,GAAA,CAAA,QAAA,EAAA;AAAA,MACC,aAAY,EAAA,6BAAA;AAAA,MACZ,UAAY,EAAA;AAAA,QACV,YAAc,EAAA,YAAA;AAAA,QACd,QAAA,EAAU,YAAY,CAAI,GAAA,CAAA,CAAA;AAAA,OAC5B;AAAA,MACA,OAAS,EAAA,UAAA;AAAA,KACX,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { useCallback } from 'react';
|
|
3
|
-
import { RowSelectionCheckboxHeaderCellValue } from './RowSelectionCheckboxHeaderCellValue.js';
|
|
4
|
-
import { RowSelectionCheckboxCellValue } from './RowSelectionCheckboxCellValue.js';
|
|
5
3
|
import { GridColumn } from './GridColumn.js';
|
|
6
|
-
import { useSelectionContext } from './SelectionContext.js';
|
|
7
4
|
import { AutoSizeHeaderCell } from './HeaderCell.js';
|
|
5
|
+
import { RowSelectionCheckboxCellValue } from './RowSelectionCheckboxCellValue.js';
|
|
6
|
+
import { RowSelectionCheckboxHeaderCellValue } from './RowSelectionCheckboxHeaderCellValue.js';
|
|
7
|
+
import { useSelectionContext } from './SelectionContext.js';
|
|
8
8
|
|
|
9
9
|
function RowSelectionCheckboxColumn(props) {
|
|
10
10
|
const { selectRows } = useSelectionContext();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionCheckboxColumn.js","sources":["../src/RowSelectionCheckboxColumn.tsx"],"sourcesContent":["import { KeyboardEvent, useCallback } from \"react\";\nimport {
|
|
1
|
+
{"version":3,"file":"RowSelectionCheckboxColumn.js","sources":["../src/RowSelectionCheckboxColumn.tsx"],"sourcesContent":["import { type KeyboardEvent, useCallback } from \"react\";\nimport { GridColumn, type GridColumnProps } from \"./GridColumn\";\nimport { AutoSizeHeaderCell } from \"./HeaderCell\";\nimport { RowSelectionCheckboxCellValue } from \"./RowSelectionCheckboxCellValue\";\nimport { RowSelectionCheckboxHeaderCellValue } from \"./RowSelectionCheckboxHeaderCellValue\";\nimport { useSelectionContext } from \"./SelectionContext\";\n\nexport type RowSelectionCheckboxColumnProps<T> = Omit<\n GridColumnProps<T>,\n \"width\" | \"name\"\n>;\n\nexport function RowSelectionCheckboxColumn<T>(\n props: RowSelectionCheckboxColumnProps<T>,\n) {\n const { selectRows } = useSelectionContext();\n\n const onKeyDown = useCallback(\n (event: KeyboardEvent<HTMLDivElement>, rowIndex: number) => {\n if (event.key === \" \") {\n selectRows({\n rowIndex,\n incremental: true,\n });\n event.preventDefault();\n event.stopPropagation();\n }\n },\n [selectRows],\n );\n\n return (\n <GridColumn\n {...props}\n defaultWidth={100}\n headerComponent={AutoSizeHeaderCell}\n headerValueComponent={RowSelectionCheckboxHeaderCellValue}\n cellValueComponent={RowSelectionCheckboxCellValue}\n onKeyDown={onKeyDown}\n />\n );\n}\n"],"names":[],"mappings":";;;;;;;;AAYO,SAAS,2BACd,KACA,EAAA;AACA,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,mBAAoB,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,OAAsC,QAAqB,KAAA;AAC1D,MAAI,IAAA,KAAA,CAAM,QAAQ,GAAK,EAAA;AACrB,QAAW,UAAA,CAAA;AAAA,UACT,QAAA;AAAA,UACA,WAAa,EAAA,IAAA;AAAA,SACd,CAAA,CAAA;AACD,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,OACxB;AAAA,KACF;AAAA,IACA,CAAC,UAAU,CAAA;AAAA,GACb,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,IACE,GAAG,KAAA;AAAA,IACJ,YAAc,EAAA,GAAA;AAAA,IACd,eAAiB,EAAA,kBAAA;AAAA,IACjB,oBAAsB,EAAA,mCAAA;AAAA,IACtB,kBAAoB,EAAA,6BAAA;AAAA,IACpB,SAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useWindow } from '@salt-ds/window';
|
|
3
|
-
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
2
|
import { Checkbox } from '@salt-ds/core';
|
|
3
|
+
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
5
|
import { useSelectionContext } from './SelectionContext.js';
|
|
6
6
|
import css_248z from './CheckboxCell.css.js';
|
|
7
7
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionCheckboxHeaderCellValue.js","sources":["../src/RowSelectionCheckboxHeaderCellValue.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"RowSelectionCheckboxHeaderCellValue.js","sources":["../src/RowSelectionCheckboxHeaderCellValue.tsx"],"sourcesContent":["import { Checkbox } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type { KeyboardEventHandler, MouseEventHandler } from \"react\";\n\nimport type { GridHeaderValueProps } from \"./GridColumn\";\nimport { useSelectionContext } from \"./SelectionContext\";\n\nimport checkboxCellCss from \"./CheckboxCell.css\";\n\nexport function RowSelectionCheckboxHeaderCellValue<T>(\n props: GridHeaderValueProps<T>,\n) {\n const { isFocused } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-checkbox-cell\",\n css: checkboxCellCss,\n window: targetWindow,\n });\n\n const { selectAll, unselectAll, isAllSelected, isAnySelected } =\n useSelectionContext();\n\n const onMousedown: MouseEventHandler<HTMLDivElement> = (event) => {\n if (isAllSelected) {\n unselectAll();\n } else {\n selectAll();\n }\n };\n\n const onKeyDown: KeyboardEventHandler<HTMLDivElement> = (event) => {\n if (event.key === \" \") {\n if (isAllSelected) {\n unselectAll();\n } else {\n selectAll();\n }\n event.preventDefault();\n event.stopPropagation();\n }\n };\n\n return (\n <div\n onMouseDown={onMousedown}\n className=\"saltGridCheckboxContainer\"\n onKeyDown={onKeyDown}\n >\n <Checkbox\n data-testid=\"grid-row-select-all-checkbox\"\n inputProps={{\n \"aria-label\": \"Select All\",\n tabIndex: isFocused ? 0 : -1,\n }}\n checked={isAllSelected}\n indeterminate={!isAllSelected && isAnySelected}\n />\n </div>\n );\n}\n"],"names":["checkboxCellCss"],"mappings":";;;;;;;AAUO,SAAS,oCACd,KACA,EAAA;AACA,EAAM,MAAA,EAAE,WAAc,GAAA,KAAA,CAAA;AAEtB,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,EAAA,MAAM,EAAE,SAAW,EAAA,WAAA,EAAa,aAAe,EAAA,aAAA,KAC7C,mBAAoB,EAAA,CAAA;AAEtB,EAAM,MAAA,WAAA,GAAiD,CAAC,KAAU,KAAA;AAChE,IAAA,IAAI,aAAe,EAAA;AACjB,MAAY,WAAA,EAAA,CAAA;AAAA,KACP,MAAA;AACL,MAAU,SAAA,EAAA,CAAA;AAAA,KACZ;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,SAAA,GAAkD,CAAC,KAAU,KAAA;AACjE,IAAI,IAAA,KAAA,CAAM,QAAQ,GAAK,EAAA;AACrB,MAAA,IAAI,aAAe,EAAA;AACjB,QAAY,WAAA,EAAA,CAAA;AAAA,OACP,MAAA;AACL,QAAU,SAAA,EAAA,CAAA;AAAA,OACZ;AACA,MAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,MAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,KACxB;AAAA,GACF,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,WAAa,EAAA,WAAA;AAAA,IACb,SAAU,EAAA,2BAAA;AAAA,IACV,SAAA;AAAA,IAEA,QAAC,kBAAA,GAAA,CAAA,QAAA,EAAA;AAAA,MACC,aAAY,EAAA,8BAAA;AAAA,MACZ,UAAY,EAAA;AAAA,QACV,YAAc,EAAA,YAAA;AAAA,QACd,QAAA,EAAU,YAAY,CAAI,GAAA,CAAA,CAAA;AAAA,OAC5B;AAAA,MACA,OAAS,EAAA,aAAA;AAAA,MACT,aAAA,EAAe,CAAC,aAAiB,IAAA,aAAA;AAAA,KACnC,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { RadioButton } 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
5
|
import { useSelectionContext } from './SelectionContext.js';
|
|
6
6
|
import css_248z from './CheckboxCell.css.js';
|
|
7
7
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionRadioCellValue.js","sources":["../src/RowSelectionRadioCellValue.tsx"],"sourcesContent":["import { RadioButton } from \"@salt-ds/core\";\nimport {
|
|
1
|
+
{"version":3,"file":"RowSelectionRadioCellValue.js","sources":["../src/RowSelectionRadioCellValue.tsx"],"sourcesContent":["import { RadioButton } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport type { GridCellValueProps } from \"./GridColumn\";\nimport { useSelectionContext } from \"./SelectionContext\";\n\nimport checkboxCellCss from \"./CheckboxCell.css\";\n\nexport function RowSelectionRadioCellValue<T>(props: GridCellValueProps<T>) {\n const { row, isFocused } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-checkbox-cell\",\n css: checkboxCellCss,\n window: targetWindow,\n });\n\n const { selRowIdxs } = useSelectionContext();\n\n const isSelected = selRowIdxs.has(row.index);\n\n return (\n <div className=\"saltGridCheckboxContainer\">\n <RadioButton\n checked={isSelected}\n data-testid=\"grid-row-selection-radiobox\"\n tabIndex={isFocused ? 0 : -1}\n />\n </div>\n );\n}\n"],"names":["checkboxCellCss"],"mappings":";;;;;;;AASO,SAAS,2BAA8B,KAA8B,EAAA;AAC1E,EAAM,MAAA,EAAE,GAAK,EAAA,SAAA,EAAc,GAAA,KAAA,CAAA;AAE3B,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,EAAE,UAAW,EAAA,GAAI,mBAAoB,EAAA,CAAA;AAE3C,EAAA,MAAM,UAAa,GAAA,UAAA,CAAW,GAAI,CAAA,GAAA,CAAI,KAAK,CAAA,CAAA;AAE3C,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,SAAU,EAAA,2BAAA;AAAA,IACb,QAAC,kBAAA,GAAA,CAAA,WAAA,EAAA;AAAA,MACC,OAAS,EAAA,UAAA;AAAA,MACT,aAAY,EAAA,6BAAA;AAAA,MACZ,QAAA,EAAU,YAAY,CAAI,GAAA,CAAA,CAAA;AAAA,KAC5B,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import {
|
|
2
|
+
import { useCallback } from 'react';
|
|
3
3
|
import { GridColumn } from './GridColumn.js';
|
|
4
|
+
import { RowSelectionRadioCellValue } from './RowSelectionRadioCellValue.js';
|
|
4
5
|
import { RowSelectionRadioHeaderCell } from './RowSelectionRadioHeaderCell.js';
|
|
5
6
|
import { useSelectionContext } from './SelectionContext.js';
|
|
6
|
-
import { useCallback } from 'react';
|
|
7
7
|
|
|
8
8
|
function RowSelectionRadioColumn(props) {
|
|
9
9
|
const { selectRows } = useSelectionContext();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionRadioColumn.js","sources":["../src/RowSelectionRadioColumn.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"RowSelectionRadioColumn.js","sources":["../src/RowSelectionRadioColumn.tsx"],"sourcesContent":["import { type KeyboardEvent, useCallback } from \"react\";\nimport { GridColumn, type GridColumnProps } from \"./GridColumn\";\nimport { RowSelectionRadioCellValue } from \"./RowSelectionRadioCellValue\";\nimport { RowSelectionRadioHeaderCell } from \"./RowSelectionRadioHeaderCell\";\nimport { useSelectionContext } from \"./SelectionContext\";\n\nexport type RowSelectionRadioColumnProps<T> = Omit<\n GridColumnProps<T>,\n \"width\" | \"name\"\n>;\n\nexport function RowSelectionRadioColumn<T>(\n props: RowSelectionRadioColumnProps<T>,\n) {\n const { selectRows } = useSelectionContext();\n\n const onKeyDown = useCallback(\n (event: KeyboardEvent<HTMLDivElement>, rowIndex: number) => {\n if (event.key === \" \") {\n selectRows({ rowIndex });\n event.preventDefault();\n event.stopPropagation();\n }\n },\n [selectRows],\n );\n\n return (\n <GridColumn\n {...props}\n defaultWidth={100}\n headerComponent={RowSelectionRadioHeaderCell}\n cellValueComponent={RowSelectionRadioCellValue}\n onKeyDown={onKeyDown}\n />\n );\n}\n"],"names":[],"mappings":";;;;;;;AAWO,SAAS,wBACd,KACA,EAAA;AACA,EAAM,MAAA,EAAE,UAAW,EAAA,GAAI,mBAAoB,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAA,WAAA;AAAA,IAChB,CAAC,OAAsC,QAAqB,KAAA;AAC1D,MAAI,IAAA,KAAA,CAAM,QAAQ,GAAK,EAAA;AACrB,QAAW,UAAA,CAAA,EAAE,UAAU,CAAA,CAAA;AACvB,QAAA,KAAA,CAAM,cAAe,EAAA,CAAA;AACrB,QAAA,KAAA,CAAM,eAAgB,EAAA,CAAA;AAAA,OACxB;AAAA,KACF;AAAA,IACA,CAAC,UAAU,CAAA;AAAA,GACb,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,UAAA,EAAA;AAAA,IACE,GAAG,KAAA;AAAA,IACJ,YAAc,EAAA,GAAA;AAAA,IACd,eAAiB,EAAA,2BAAA;AAAA,IACjB,kBAAoB,EAAA,0BAAA;AAAA,IACpB,SAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { clsx } from 'clsx';
|
|
3
3
|
import { RadioButtonIcon } from '@salt-ds/core';
|
|
4
|
-
import { useWindow } from '@salt-ds/window';
|
|
5
4
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
5
|
+
import { useWindow } from '@salt-ds/window';
|
|
6
6
|
import { AutoSizeHeaderCell } from './HeaderCell.js';
|
|
7
7
|
import css_248z from './CheckboxCell.css.js';
|
|
8
8
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionRadioHeaderCell.js","sources":["../src/RowSelectionRadioHeaderCell.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\n\nimport { RadioButtonIcon } from \"@salt-ds/core\";\nimport {
|
|
1
|
+
{"version":3,"file":"RowSelectionRadioHeaderCell.js","sources":["../src/RowSelectionRadioHeaderCell.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\n\nimport { RadioButtonIcon } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport type { HeaderCellProps } from \"./GridColumn\";\nimport { AutoSizeHeaderCell } from \"./HeaderCell\";\n\nimport checkboxCellCss from \"./CheckboxCell.css\";\n\nexport function RowSelectionRadioHeaderCell<T>(props: HeaderCellProps<T>) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-checkbox-cell\",\n css: checkboxCellCss,\n window: targetWindow,\n });\n\n return (\n <AutoSizeHeaderCell {...props}>\n <div className={clsx(\"saltGridCheckboxContainer\", \"saltGrid-hidden\")}>\n <RadioButtonIcon />\n </div>\n </AutoSizeHeaderCell>\n );\n}\n"],"names":["checkboxCellCss"],"mappings":";;;;;;;;AAWO,SAAS,4BAA+B,KAA2B,EAAA;AACxE,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,EAAA,uBACG,GAAA,CAAA,kBAAA,EAAA;AAAA,IAAoB,GAAG,KAAA;AAAA,IACtB,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,IAAK,CAAA,2BAAA,EAA6B,iBAAiB,CAAA;AAAA,MACjE,8BAAC,eAAgB,EAAA,EAAA,CAAA;AAAA,KACnB,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowValidationStatus.js","sources":["../src/RowValidationStatus.tsx"],"sourcesContent":["import { StatusIndicator } from \"@salt-ds/core\";\nimport { createContext, useContext } from \"react\";\nimport { CellValidationState
|
|
1
|
+
{"version":3,"file":"RowValidationStatus.js","sources":["../src/RowValidationStatus.tsx"],"sourcesContent":["import { StatusIndicator } from \"@salt-ds/core\";\nimport { createContext, useContext } from \"react\";\nimport {\n type CellValidationState,\n GridColumn,\n type GridColumnProps,\n} from \"./GridColumn\";\n\nexport const RowValidationStatusContext = createContext<{\n status?: CellValidationState;\n}>({});\n\nexport type RowValidationStatusColumnProps<T> = Omit<\n GridColumnProps<T>,\n \"width\" | \"name\"\n>;\n\nexport function RowValidationStatusColumn<T>(\n props: RowValidationStatusColumnProps<T>,\n) {\n return (\n <GridColumn\n aria-label=\"Row status\"\n defaultWidth={30}\n cellValueComponent={RowValidationCell}\n {...props}\n />\n );\n}\n\nconst knownStatus = new Set([\"error\", \"warning\", \"success\"]);\n\nfunction RowValidationCell() {\n const rowValidationContext = useContext(RowValidationStatusContext);\n if (\n !rowValidationContext?.status ||\n !knownStatus.has(rowValidationContext.status)\n )\n return null;\n\n const validationStatus = rowValidationContext.status;\n\n return (\n <div\n style={{\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n height: \"100%\",\n width: \"100%\",\n }}\n >\n <StatusIndicator\n aria-label={`Row ${validationStatus}`}\n status={validationStatus}\n />\n </div>\n );\n}\n"],"names":[],"mappings":";;;;;AAQa,MAAA,0BAAA,GAA6B,aAEvC,CAAA,EAAE;;;;"}
|
|
@@ -6,7 +6,7 @@ const SelectionContext = createContext(
|
|
|
6
6
|
const useSelectionContext = () => {
|
|
7
7
|
const c = useContext(SelectionContext);
|
|
8
8
|
if (!c) {
|
|
9
|
-
throw new Error(
|
|
9
|
+
throw new Error("useSelectionContext invoked outside of a Grid");
|
|
10
10
|
}
|
|
11
11
|
return c;
|
|
12
12
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectionContext.js","sources":["../src/SelectionContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport { CellRange, SelectRowsOptions } from \"./internal\";\n\nexport interface SelectionContext {\n selectedCellRange: CellRange | undefined;\n selRowIdxs: Set<number>;\n isAnySelected: boolean;\n isAllSelected: boolean;\n selectRows: (args: SelectRowsOptions) => void;\n selectAll: () => void;\n unselectAll: () => void;\n}\n\nexport const SelectionContext = createContext<SelectionContext | undefined>(\n undefined
|
|
1
|
+
{"version":3,"file":"SelectionContext.js","sources":["../src/SelectionContext.ts"],"sourcesContent":["import { createContext, useContext } from \"react\";\nimport type { CellRange, SelectRowsOptions } from \"./internal\";\n\nexport interface SelectionContext {\n selectedCellRange: CellRange | undefined;\n selRowIdxs: Set<number>;\n isAnySelected: boolean;\n isAllSelected: boolean;\n selectRows: (args: SelectRowsOptions) => void;\n selectAll: () => void;\n unselectAll: () => void;\n}\n\nexport const SelectionContext = createContext<SelectionContext | undefined>(\n undefined,\n);\n\nexport const useSelectionContext = () => {\n const c = useContext(SelectionContext);\n if (!c) {\n throw new Error(\"useSelectionContext invoked outside of a Grid\");\n }\n return c;\n};\n"],"names":[],"mappings":";;AAaO,MAAM,gBAAmB,GAAA,aAAA;AAAA,EAC9B,KAAA,CAAA;AACF,EAAA;AAEO,MAAM,sBAAsB,MAAM;AACvC,EAAM,MAAA,CAAA,GAAI,WAAW,gBAAgB,CAAA,CAAA;AACrC,EAAA,IAAI,CAAC,CAAG,EAAA;AACN,IAAM,MAAA,IAAI,MAAM,+CAA+C,CAAA,CAAA;AAAA,GACjE;AACA,EAAO,OAAA,CAAA,CAAA;AACT;;;;"}
|
package/dist-es/SizingContext.js
CHANGED
|
@@ -6,7 +6,7 @@ const SizingContext = createContext(
|
|
|
6
6
|
const useSizingContext = () => {
|
|
7
7
|
const c = useContext(SizingContext);
|
|
8
8
|
if (!c) {
|
|
9
|
-
throw new Error(
|
|
9
|
+
throw new Error("useSizingContext invoked outside of a Grid");
|
|
10
10
|
}
|
|
11
11
|
return c;
|
|
12
12
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SizingContext.js","sources":["../src/SizingContext.ts"],"sourcesContent":["import
|
|
1
|
+
{"version":3,"file":"SizingContext.js","sources":["../src/SizingContext.ts"],"sourcesContent":["import type { MouseEvent } from \"react\";\nimport { createContext, useContext } from \"react\";\n\nexport interface SizingContext {\n rowHeight: number;\n resizeColumn: (colIdx: number, width: number) => void;\n onResizeHandleMouseDown: (event: MouseEvent<HTMLDivElement>) => void;\n}\n\nexport const SizingContext = createContext<SizingContext | undefined>(\n undefined,\n);\nexport const useSizingContext = () => {\n const c = useContext(SizingContext);\n if (!c) {\n throw new Error(\"useSizingContext invoked outside of a Grid\");\n }\n return c;\n};\n"],"names":[],"mappings":";;AASO,MAAM,aAAgB,GAAA,aAAA;AAAA,EAC3B,KAAA,CAAA;AACF,EAAA;AACO,MAAM,mBAAmB,MAAM;AACpC,EAAM,MAAA,CAAA,GAAI,WAAW,aAAa,CAAA,CAAA;AAClC,EAAA,IAAI,CAAC,CAAG,EAAA;AACN,IAAM,MAAA,IAAI,MAAM,4CAA4C,CAAA,CAAA;AAAA,GAC9D;AACA,EAAO,OAAA,CAAA,CAAA;AACT;;;;"}
|
|
@@ -1,27 +1,11 @@
|
|
|
1
1
|
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useRef, useState, 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';
|
|
6
|
-
import {
|
|
4
|
+
import { useWindow } from '@salt-ds/window';
|
|
5
|
+
import { useRef, useState, useEffect } from 'react';
|
|
6
|
+
import { CellFrame } from './CellFrame.js';
|
|
7
7
|
import { CornerTag } from './CornerTag.js';
|
|
8
|
-
import {
|
|
9
|
-
import './internal/CellMeasure.js';
|
|
10
|
-
import './internal/Cursor.js';
|
|
11
|
-
import './internal/GroupHeaderRow.js';
|
|
12
|
-
import './internal/HeaderRow.js';
|
|
13
|
-
import './internal/LeftPart.js';
|
|
14
|
-
import './internal/MiddlePart.js';
|
|
15
|
-
import './internal/RightPart.js';
|
|
16
|
-
import './internal/Scrollable.js';
|
|
17
|
-
import './internal/TableRow.js';
|
|
18
|
-
import './SelectionContext.js';
|
|
19
|
-
import './CursorContext.js';
|
|
20
|
-
import './NumberRange.js';
|
|
21
|
-
import './internal/TopLeftPart.js';
|
|
22
|
-
import './internal/TopPart.js';
|
|
23
|
-
import './internal/TopRightPart.js';
|
|
24
|
-
import './internal/DefaultCellValue.js';
|
|
8
|
+
import { useEditorContext } from './EditorContext.js';
|
|
25
9
|
import css_248z from './TextCellEditor.css.js';
|
|
26
10
|
|
|
27
11
|
const withBaseName = makePrefixer("saltGridTextCellEditor");
|
|
@@ -76,7 +60,7 @@ function TextCellEditor(props) {
|
|
|
76
60
|
document == null ? void 0 : document.removeEventListener("mousedown", focusOut, true);
|
|
77
61
|
};
|
|
78
62
|
}, [endEditMode, editorText]);
|
|
79
|
-
return /* @__PURE__ */ jsxs(
|
|
63
|
+
return /* @__PURE__ */ jsxs(CellFrame, {
|
|
80
64
|
separator: column == null ? void 0 : column.separator,
|
|
81
65
|
className: withBaseName(),
|
|
82
66
|
children: [
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextCellEditor.js","sources":["../src/TextCellEditor.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"TextCellEditor.js","sources":["../src/TextCellEditor.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n type ChangeEventHandler,\n type KeyboardEventHandler,\n useEffect,\n useRef,\n useState,\n} from \"react\";\n\nimport { CellFrame } from \"./CellFrame\";\nimport { CornerTag } from \"./CornerTag\";\nimport { useEditorContext } from \"./EditorContext\";\nimport type { GridColumnModel, GridRowModel } from \"./Grid\";\n\nimport textCellEditorCss from \"./TextCellEditor.css\";\n\nconst withBaseName = makePrefixer(\"saltGridTextCellEditor\");\n\nexport interface TextCellEditorProps<T> {\n row?: GridRowModel<T>;\n column?: GridColumnModel<T>;\n}\n\nexport function TextCellEditor<T>(props: TextCellEditorProps<T>) {\n const { column, row } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-text-cell-editor\",\n css: textCellEditorCss,\n window: targetWindow,\n });\n\n const inputRef = useRef<HTMLInputElement>(null);\n\n const { endEditMode, cancelEditMode, initialText } = useEditorContext();\n\n const [editorText, setEditorText] = useState<string>(\n initialText != null ? initialText : column!.info.props.getValue!(row!.data),\n );\n\n const initialSelectionRef = useRef(!!initialText);\n\n const onChange: ChangeEventHandler<HTMLInputElement> = (e) => {\n setEditorText(e.target.value);\n };\n\n const onKeyDown: KeyboardEventHandler<HTMLInputElement> = (event) => {\n if (event.key === \"Enter\") {\n endEditMode(editorText);\n return;\n }\n if (event.key === \"Escape\") {\n cancelEditMode();\n return;\n }\n if (event.key === \"Tab\") {\n endEditMode(editorText);\n event.preventDefault();\n return;\n }\n event.stopPropagation();\n };\n\n useEffect(() => {\n if (inputRef.current && !initialSelectionRef.current) {\n inputRef.current.select();\n initialSelectionRef.current = true;\n }\n }, [inputRef.current]);\n\n useEffect(() => {\n const input = inputRef.current;\n const focusOut = (event: FocusEvent) => {\n if (!input?.contains(event.target as Node)) {\n endEditMode(editorText);\n }\n };\n\n // This uses the capture phase to detect clicks outside the input to avoid a race condition where the component gets unmounted when edit mode ends.\n document?.addEventListener(\"mousedown\", focusOut, true);\n\n return () => {\n document?.removeEventListener(\"mousedown\", focusOut, true);\n };\n }, [endEditMode, editorText]);\n\n return (\n <CellFrame separator={column?.separator} className={withBaseName()}>\n <div className={withBaseName(\"inputContainer\")}>\n <input\n data-testid=\"grid-cell-editor-input\"\n ref={inputRef}\n autoFocus={true}\n value={editorText}\n onChange={onChange}\n onKeyDown={onKeyDown}\n />\n </div>\n <CornerTag />\n </CellFrame>\n );\n}\n"],"names":["textCellEditorCss"],"mappings":"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"}
|
package/dist-es/index.js
CHANGED
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
export { BaseCell, getCellId } from './BaseCell.js';
|
|
2
2
|
export { ColumnGroup } from './ColumnGroup.js';
|
|
3
3
|
export { CellEditor } from './CellEditor.js';
|
|
4
|
+
export { CellFrame } from './CellFrame.js';
|
|
4
5
|
export { CornerTag } from './CornerTag.js';
|
|
6
|
+
export { EditorContext, useEditorContext } from './EditorContext.js';
|
|
5
7
|
export { GroupHeaderCell } from './GroupHeaderCell.js';
|
|
6
8
|
export { GroupHeaderCellValue } from './GroupHeaderCellValue.js';
|
|
7
9
|
export { AutoSizeHeaderCell, HeaderCell, HeaderCellSeparator } from './HeaderCell.js';
|
package/dist-es/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useRef, 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 { useRef, useEffect } from 'react';
|
|
6
6
|
import css_248z from './CellMeasure.css.js';
|
|
7
7
|
|
|
8
8
|
const withBaseName = makePrefixer("saltGridCellMeasure");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellMeasure.js","sources":["../src/internal/CellMeasure.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"CellMeasure.js","sources":["../src/internal/CellMeasure.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useEffect, useRef } from \"react\";\n\nimport cellMeasureCss from \"./CellMeasure.css\";\n\nconst withBaseName = makePrefixer(\"saltGridCellMeasure\");\n\nexport interface CellMeasureProps<T> {\n setRowHeight: (rowHeight: number) => void;\n}\n\n// Renders a cell in invisible location, measures its height and provides it to\n// the grid.\nexport function CellMeasure<T>(props: CellMeasureProps<T>) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-cell-measure\",\n css: cellMeasureCss,\n window: targetWindow,\n });\n\n const rowRef = useRef<HTMLTableRowElement>(null);\n const heightRef = useRef<number>(-1);\n\n const { setRowHeight } = props;\n\n useEffect(() => {\n if (rowRef.current) {\n const height = rowRef.current.getBoundingClientRect().height;\n if (heightRef.current !== height) {\n // console.log(`Row height changing to ${height}px`);\n heightRef.current = height;\n setRowHeight(height);\n }\n }\n });\n\n return (\n <div className={withBaseName()}>\n <table aria-hidden>\n <thead>\n <tr ref={rowRef}>\n <th>Invisible Cell</th>\n </tr>\n </thead>\n </table>\n </div>\n );\n}\n"],"names":["cellMeasureCss"],"mappings":";;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAQhD,SAAS,YAAe,KAA4B,EAAA;AACzD,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,MAAA,GAAS,OAA4B,IAAI,CAAA,CAAA;AAC/C,EAAM,MAAA,SAAA,GAAY,OAAe,CAAE,CAAA,CAAA,CAAA;AAEnC,EAAM,MAAA,EAAE,cAAiB,GAAA,KAAA,CAAA;AAEzB,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,OAAO,OAAS,EAAA;AAClB,MAAA,MAAM,MAAS,GAAA,MAAA,CAAO,OAAQ,CAAA,qBAAA,EAAwB,CAAA,MAAA,CAAA;AACtD,MAAI,IAAA,SAAA,CAAU,YAAY,MAAQ,EAAA;AAEhC,QAAA,SAAA,CAAU,OAAU,GAAA,MAAA,CAAA;AACpB,QAAA,YAAA,CAAa,MAAM,CAAA,CAAA;AAAA,OACrB;AAAA,KACF;AAAA,GACD,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,YAAa,EAAA;AAAA,IAC3B,QAAC,kBAAA,GAAA,CAAA,OAAA,EAAA;AAAA,MAAM,aAAW,EAAA,IAAA;AAAA,MAChB,QAAC,kBAAA,GAAA,CAAA,OAAA,EAAA;AAAA,QACC,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA;AAAA,UAAG,GAAK,EAAA,MAAA;AAAA,UACP,QAAC,kBAAA,GAAA,CAAA,IAAA,EAAA;AAAA,YAAG,QAAA,EAAA,gBAAA;AAAA,WAAc,CAAA;AAAA,SACpB,CAAA;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 { useMemo } 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 { useMemo } from 'react';
|
|
6
6
|
import css_248z from './ColumnDropTarget.css.js';
|
|
7
7
|
|
|
8
8
|
const withBaseName = makePrefixer("saltGridColumnDropTarget");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColumnDropTarget.js","sources":["../src/internal/ColumnDropTarget.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"ColumnDropTarget.js","sources":["../src/internal/ColumnDropTarget.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { useMemo } from \"react\";\n\nimport columDropTargetCss from \"./ColumnDropTarget.css\";\n\nconst withBaseName = makePrefixer(\"saltGridColumnDropTarget\");\n\nexport interface ColumnDropTargetProps {\n x?: number;\n}\n\n// When the user drags a column, this component is used to show the potential\n// drop target. Experimental feature. No UX yet.\nexport function ColumnDropTarget(props: ColumnDropTargetProps) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-column-drop-target\",\n css: columDropTargetCss,\n window: targetWindow,\n });\n\n const { x = 0 } = props;\n\n const style = useMemo(() => {\n return {\n left: `${x - 2}px`,\n };\n }, [x]);\n\n if (props.x === undefined) {\n return null;\n }\n\n return <div className={withBaseName()} style={style} />;\n}\n"],"names":["columDropTargetCss"],"mappings":";;;;;;;AAOA,MAAM,YAAA,GAAe,aAAa,0BAA0B,CAAA,CAAA;AAQrD,SAAS,iBAAiB,KAA8B,EAAA;AAC7D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAM,MAAA,EAAE,CAAI,GAAA,CAAA,EAAM,GAAA,KAAA,CAAA;AAElB,EAAM,MAAA,KAAA,GAAQ,QAAQ,MAAM;AAC1B,IAAO,OAAA;AAAA,MACL,IAAA,EAAM,GAAG,CAAI,GAAA,CAAA,CAAA,EAAA,CAAA;AAAA,KACf,CAAA;AAAA,GACF,EAAG,CAAC,CAAC,CAAC,CAAA,CAAA;AAEN,EAAI,IAAA,KAAA,CAAM,MAAM,KAAW,CAAA,EAAA;AACzB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBAAQ,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,YAAa,EAAA;AAAA,IAAG,KAAA;AAAA,GAAc,CAAA,CAAA;AACvD;;;;"}
|
|
@@ -1,10 +1,10 @@
|
|
|
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 { HeaderRow } from './HeaderRow.js';
|
|
7
6
|
import { TableBody } from './TableBody.js';
|
|
7
|
+
import { TableColGroup } from './TableColGroup.js';
|
|
8
8
|
import css_248z from './ColumnGhost.css.js';
|
|
9
9
|
|
|
10
10
|
const withBaseName = makePrefixer("saltGridColumnGhost");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ColumnGhost.js","sources":["../src/internal/ColumnGhost.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"ColumnGhost.js","sources":["../src/internal/ColumnGhost.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport type { CSSProperties } from \"react\";\n\nimport type { GridColumnModel, GridRowModel } from \"../Grid\";\n\nimport { HeaderRow } from \"./HeaderRow\";\nimport { TableBody } from \"./TableBody\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport type { ColumnDragState } from \"./gridHooks\";\n\nimport columnGhostCss from \"./ColumnGhost.css\";\n\nconst withBaseName = makePrefixer(\"saltGridColumnGhost\");\n\nexport interface ColumnGhostProps<T> {\n dragState?: ColumnDragState;\n columns: GridColumnModel<T>[];\n rows: GridRowModel<T>[];\n zebra?: boolean;\n}\n\n// When the user drags a column this component renders a partially transparent\n// copy of the dragged column.\nexport function ColumnGhost<T = any>(props: ColumnGhostProps<T>) {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-column-ghost\",\n css: columnGhostCss,\n window: targetWindow,\n });\n\n if (!props.dragState) {\n return null;\n }\n\n const { columnIndex, x, y } = props.dragState;\n const { columns, rows, zebra } = props;\n const movingColumn = columns[columnIndex];\n\n const style: CSSProperties = {\n left: x,\n top: y,\n };\n\n return (\n <div className={withBaseName()} style={style}>\n <table aria-hidden>\n <TableColGroup columns={[movingColumn]} />\n <thead>\n <HeaderRow columns={[movingColumn]} />\n </thead>\n <TableBody\n columns={[movingColumn]}\n rows={rows}\n setHoverRowKey={() => {}}\n zebra={zebra}\n />\n </table>\n </div>\n );\n}\n"],"names":["columnGhostCss"],"mappings":";;;;;;;;;AAcA,MAAM,YAAA,GAAe,aAAa,qBAAqB,CAAA,CAAA;AAWhD,SAAS,YAAqB,KAA4B,EAAA;AAC/D,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,mBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,CAAC,MAAM,SAAW,EAAA;AACpB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,MAAM,EAAE,WAAA,EAAa,CAAG,EAAA,CAAA,KAAM,KAAM,CAAA,SAAA,CAAA;AACpC,EAAA,MAAM,EAAE,OAAA,EAAS,IAAM,EAAA,KAAA,EAAU,GAAA,KAAA,CAAA;AACjC,EAAA,MAAM,eAAe,OAAQ,CAAA,WAAA,CAAA,CAAA;AAE7B,EAAA,MAAM,KAAuB,GAAA;AAAA,IAC3B,IAAM,EAAA,CAAA;AAAA,IACN,GAAK,EAAA,CAAA;AAAA,GACP,CAAA;AAEA,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,YAAa,EAAA;AAAA,IAAG,KAAA;AAAA,IAC9B,QAAC,kBAAA,IAAA,CAAA,OAAA,EAAA;AAAA,MAAM,aAAW,EAAA,IAAA;AAAA,MAChB,QAAA,EAAA;AAAA,wBAAC,GAAA,CAAA,aAAA,EAAA;AAAA,UAAc,OAAA,EAAS,CAAC,YAAY,CAAA;AAAA,SAAG,CAAA;AAAA,wBACvC,GAAA,CAAA,OAAA,EAAA;AAAA,UACC,QAAC,kBAAA,GAAA,CAAA,SAAA,EAAA;AAAA,YAAU,OAAA,EAAS,CAAC,YAAY,CAAA;AAAA,WAAG,CAAA;AAAA,SACtC,CAAA;AAAA,wBACC,GAAA,CAAA,SAAA,EAAA;AAAA,UACC,OAAA,EAAS,CAAC,YAAY,CAAA;AAAA,UACtB,IAAA;AAAA,UACA,gBAAgB,MAAM;AAAA,WAAC;AAAA,UACvB,KAAA;AAAA,SACF,CAAA;AAAA,OAAA;AAAA,KACF,CAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { 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
5
|
import css_248z from './Cursor.css.js';
|
|
6
6
|
|
|
7
7
|
const withBaseName = makePrefixer("saltGridCursor");
|
|
8
|
-
function Cursor(
|
|
8
|
+
function Cursor() {
|
|
9
9
|
const targetWindow = useWindow();
|
|
10
10
|
useComponentCssInjection({
|
|
11
11
|
testId: "salt-cursor",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Cursor.js","sources":["../src/internal/Cursor.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport {
|
|
1
|
+
{"version":3,"file":"Cursor.js","sources":["../src/internal/Cursor.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport cursorCss from \"./Cursor.css\";\n\nconst withBaseName = makePrefixer(\"saltGridCursor\");\n\n// This is probably obsolete. Cursor is rendered using cell borders now.\nexport function Cursor() {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-cursor\",\n css: cursorCss,\n window: targetWindow,\n });\n\n return <div className={withBaseName()} />;\n}\n"],"names":["cursorCss"],"mappings":";;;;;;AAMA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA,CAAA;AAG3C,SAAS,MAAS,GAAA;AACvB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,aAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBAAQ,GAAA,CAAA,KAAA,EAAA;AAAA,IAAI,WAAW,YAAa,EAAA;AAAA,GAAG,CAAA,CAAA;AACzC;;;;"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
2
|
import { makePrefixer } from '@salt-ds/core';
|
|
3
|
-
import { clsx } from 'clsx';
|
|
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 css_248z from './DefaultCellValue.css.js';
|
|
7
7
|
|
|
8
8
|
const withBaseName = makePrefixer("saltGridDefaultCellValue");
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DefaultCellValue.js","sources":["../src/internal/DefaultCellValue.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"DefaultCellValue.js","sources":["../src/internal/DefaultCellValue.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 { ReactNode } from \"react\";\n\nimport type { GridCellValueProps } from \"../GridColumn\";\n\nimport defaultCellValueCss from \"./DefaultCellValue.css\";\n\nconst withBaseName = makePrefixer(\"saltGridDefaultCellValue\");\n\n// Default component for cell value wrappers. Rendered as a child of cell\n// components (<td>s)\nexport function DefaultCellValue<T>(props: GridCellValueProps<T>) {\n const { value } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-default-cell-value\",\n css: defaultCellValueCss,\n window: targetWindow,\n });\n\n return (\n <div\n className={clsx(withBaseName(), {\n [withBaseName(\"alignRight\")]: props.column.info.props.align === \"right\",\n })}\n >\n {value as ReactNode}\n </div>\n );\n}\n"],"names":["defaultCellValueCss"],"mappings":";;;;;;;AAUA,MAAM,YAAA,GAAe,aAAa,0BAA0B,CAAA,CAAA;AAIrD,SAAS,iBAAoB,KAA8B,EAAA;AAChE,EAAM,MAAA,EAAE,OAAU,GAAA,KAAA,CAAA;AAElB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,yBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAA,uBACG,GAAA,CAAA,KAAA,EAAA;AAAA,IACC,SAAA,EAAW,IAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,aAAa,YAAY,CAAA,GAAI,MAAM,MAAO,CAAA,IAAA,CAAK,MAAM,KAAU,KAAA,OAAA;AAAA,KACjE,CAAA;AAAA,IAEA,QAAA,EAAA,KAAA;AAAA,GACH,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from 'react/jsx-runtime';
|
|
2
|
-
import { useWindow } from '@salt-ds/window';
|
|
3
2
|
import { useComponentCssInjection } from '@salt-ds/styles';
|
|
4
|
-
import {
|
|
3
|
+
import { useWindow } from '@salt-ds/window';
|
|
4
|
+
import { CellFrame } from '../CellFrame.js';
|
|
5
5
|
import css_248z from './FakeCell.css.js';
|
|
6
6
|
|
|
7
7
|
function FakeCell(props) {
|
|
@@ -12,7 +12,7 @@ function FakeCell(props) {
|
|
|
12
12
|
css: css_248z,
|
|
13
13
|
window: targetWindow
|
|
14
14
|
});
|
|
15
|
-
return /* @__PURE__ */ jsx(
|
|
15
|
+
return /* @__PURE__ */ jsx(CellFrame, {
|
|
16
16
|
className: "saltGridFakeCell",
|
|
17
17
|
"data-row-index": row.index,
|
|
18
18
|
"data-column-index": -1
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"FakeCell.js","sources":["../src/internal/FakeCell.tsx"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"FakeCell.js","sources":["../src/internal/FakeCell.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport { CellFrame } from \"../CellFrame\";\nimport type { GridCellProps } from \"../GridColumn\";\n\nimport fakeCellCss from \"./FakeCell.css\";\n\nexport type FakeCellProps<T> = Pick<GridCellProps<T>, \"row\">;\n\n// When there is unused space (total width of all columns is less than the\n// available client width of the grid) a column with fake cells is rendered to\n// fill this space. Zebra and row selection/hover highlighting is applied to\n// this column. Fake cells can't have keyboard focus or render any values.\nexport function FakeCell<T>(props: FakeCellProps<T>) {\n const { row } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-fake-cell\",\n css: fakeCellCss,\n window: targetWindow,\n });\n\n return (\n <CellFrame\n className=\"saltGridFakeCell\"\n data-row-index={row.index}\n data-column-index={-1}\n />\n );\n}\n"],"names":["fakeCellCss"],"mappings":";;;;;;AAcO,SAAS,SAAY,KAAyB,EAAA;AACnD,EAAM,MAAA,EAAE,KAAQ,GAAA,KAAA,CAAA;AAEhB,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,EAAA,uBACG,GAAA,CAAA,SAAA,EAAA;AAAA,IACC,SAAU,EAAA,kBAAA;AAAA,IACV,kBAAgB,GAAI,CAAA,KAAA;AAAA,IACpB,mBAAmB,EAAA,CAAA,CAAA;AAAA,GACrB,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
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
5
|
import { GroupHeaderCell } from '../GroupHeaderCell.js';
|
|
6
6
|
import { GroupHeaderCellValue } from '../GroupHeaderCellValue.js';
|
|
7
7
|
import { FakeGroupCell } from './FakeGroupCell.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"GroupHeaderRow.js","sources":["../src/internal/GroupHeaderRow.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport {
|
|
1
|
+
{"version":3,"file":"GroupHeaderRow.js","sources":["../src/internal/GroupHeaderRow.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\n\nimport type { GridColumnGroupModel } from \"../Grid\";\nimport { GroupHeaderCell } from \"../GroupHeaderCell\";\nimport { GroupHeaderCellValue } from \"../GroupHeaderCellValue\";\n\nimport { FakeGroupCell } from \"./FakeGroupCell\";\n\nimport groupHeaderRowCss from \"./GroupHeaderRow.css\";\n\nconst withBaseName = makePrefixer(\"saltGridGroupHeaderRow\");\n\nexport interface GroupHeaderRowProps<T> {\n groups: GridColumnGroupModel[];\n gap?: number;\n}\n\nexport function GroupHeaderRow<T>(props: GroupHeaderRowProps<T>) {\n const { groups, gap } = props;\n\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"salt-group-header-row\",\n css: groupHeaderRowCss,\n window: targetWindow,\n });\n\n if (groups.length === 0) {\n return null;\n }\n return (\n <tr className={withBaseName()} role=\"row\">\n {groups.map((group) => {\n const Cell = group.data.headerComponent || GroupHeaderCell;\n const CellValue =\n group.data.headerValueComponent || GroupHeaderCellValue;\n return (\n <Cell key={group.data.id} group={group}>\n <CellValue group={group} />\n </Cell>\n );\n })}\n {gap !== undefined && gap > 0 ? <FakeGroupCell /> : null}\n </tr>\n );\n}\n"],"names":["groupHeaderRowCss"],"mappings":";;;;;;;;;AAYA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA,CAAA;AAOnD,SAAS,eAAkB,KAA+B,EAAA;AAC/D,EAAM,MAAA,EAAE,MAAQ,EAAA,GAAA,EAAQ,GAAA,KAAA,CAAA;AAExB,EAAA,MAAM,eAAe,SAAU,EAAA,CAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,uBAAA;AAAA,IACR,GAAK,EAAAA,QAAA;AAAA,IACL,MAAQ,EAAA,YAAA;AAAA,GACT,CAAA,CAAA;AAED,EAAI,IAAA,MAAA,CAAO,WAAW,CAAG,EAAA;AACvB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AACA,EAAA,uBACG,IAAA,CAAA,IAAA,EAAA;AAAA,IAAG,WAAW,YAAa,EAAA;AAAA,IAAG,IAAK,EAAA,KAAA;AAAA,IACjC,QAAA,EAAA;AAAA,MAAO,MAAA,CAAA,GAAA,CAAI,CAAC,KAAU,KAAA;AACrB,QAAM,MAAA,IAAA,GAAO,KAAM,CAAA,IAAA,CAAK,eAAmB,IAAA,eAAA,CAAA;AAC3C,QAAM,MAAA,SAAA,GACJ,KAAM,CAAA,IAAA,CAAK,oBAAwB,IAAA,oBAAA,CAAA;AACrC,QAAA,uBACG,GAAA,CAAA,IAAA,EAAA;AAAA,UAAyB,KAAA;AAAA,UACxB,QAAC,kBAAA,GAAA,CAAA,SAAA,EAAA;AAAA,YAAU,KAAA;AAAA,WAAc,CAAA;AAAA,SADhB,EAAA,KAAA,CAAM,KAAK,EAEtB,CAAA,CAAA;AAAA,OAEH,CAAA;AAAA,MACA,QAAQ,KAAa,CAAA,IAAA,GAAA,GAAM,CAAI,mBAAA,GAAA,CAAC,iBAAc,CAAK,GAAA,IAAA;AAAA,KAAA;AAAA,GACtD,CAAA,CAAA;AAEJ;;;;"}
|