@salt-ds/data-grid 1.0.4-alpha.0 → 1.0.4-alpha.1
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/packages/grid/src/BaseCell.css.js +1 -1
- package/dist-cjs/packages/grid/src/BaseCell.js +35 -3
- package/dist-cjs/packages/grid/src/BaseCell.js.map +1 -1
- package/dist-cjs/packages/grid/src/ColumnSortContext.js +20 -0
- package/dist-cjs/packages/grid/src/ColumnSortContext.js.map +1 -0
- package/dist-cjs/packages/grid/src/Grid.js +208 -126
- package/dist-cjs/packages/grid/src/Grid.js.map +1 -1
- package/dist-cjs/packages/grid/src/GridColumn.js +1 -1
- package/dist-cjs/packages/grid/src/GridColumn.js.map +1 -1
- package/dist-cjs/packages/grid/src/HeaderCell.css.js +1 -1
- package/dist-cjs/packages/grid/src/HeaderCell.js +66 -2
- package/dist-cjs/packages/grid/src/HeaderCell.js.map +1 -1
- package/dist-cjs/packages/grid/src/RowSelectionCheckboxColumn.js +14 -7
- package/dist-cjs/packages/grid/src/RowSelectionCheckboxColumn.js.map +1 -1
- package/dist-cjs/packages/grid/src/RowSelectionRadioColumn.js +11 -7
- package/dist-cjs/packages/grid/src/RowSelectionRadioColumn.js.map +1 -1
- package/dist-cjs/packages/grid/src/RowValidationStatus.js +13 -0
- package/dist-cjs/packages/grid/src/RowValidationStatus.js.map +1 -0
- package/dist-cjs/packages/grid/src/index.js +1 -0
- package/dist-cjs/packages/grid/src/index.js.map +1 -1
- package/dist-cjs/packages/grid/src/internal/Cell.css.js +1 -1
- package/dist-cjs/packages/grid/src/internal/CellStatusIcons.js +46 -0
- package/dist-cjs/packages/grid/src/internal/CellStatusIcons.js.map +1 -0
- package/dist-cjs/packages/grid/src/internal/LeftPart.js +4 -2
- package/dist-cjs/packages/grid/src/internal/LeftPart.js.map +1 -1
- package/dist-cjs/packages/grid/src/internal/MiddlePart.js +4 -2
- package/dist-cjs/packages/grid/src/internal/MiddlePart.js.map +1 -1
- package/dist-cjs/packages/grid/src/internal/RightPart.js +4 -2
- package/dist-cjs/packages/grid/src/internal/RightPart.js.map +1 -1
- package/dist-cjs/packages/grid/src/internal/TableBody.js +11 -4
- package/dist-cjs/packages/grid/src/internal/TableBody.js.map +1 -1
- package/dist-cjs/packages/grid/src/internal/TableRow.css.js +1 -1
- package/dist-cjs/packages/grid/src/internal/TableRow.js +33 -12
- package/dist-cjs/packages/grid/src/internal/TableRow.js.map +1 -1
- package/dist-es/packages/grid/src/BaseCell.css.js +1 -1
- package/dist-es/packages/grid/src/BaseCell.js +35 -3
- package/dist-es/packages/grid/src/BaseCell.js.map +1 -1
- package/dist-es/packages/grid/src/ColumnSortContext.js +15 -0
- package/dist-es/packages/grid/src/ColumnSortContext.js.map +1 -0
- package/dist-es/packages/grid/src/Grid.js +208 -127
- package/dist-es/packages/grid/src/Grid.js.map +1 -1
- package/dist-es/packages/grid/src/GridColumn.js +1 -1
- package/dist-es/packages/grid/src/GridColumn.js.map +1 -1
- package/dist-es/packages/grid/src/HeaderCell.css.js +1 -1
- package/dist-es/packages/grid/src/HeaderCell.js +66 -2
- package/dist-es/packages/grid/src/HeaderCell.js.map +1 -1
- package/dist-es/packages/grid/src/RowSelectionCheckboxColumn.js +14 -7
- package/dist-es/packages/grid/src/RowSelectionCheckboxColumn.js.map +1 -1
- package/dist-es/packages/grid/src/RowSelectionRadioColumn.js +11 -7
- package/dist-es/packages/grid/src/RowSelectionRadioColumn.js.map +1 -1
- package/dist-es/packages/grid/src/RowValidationStatus.js +9 -0
- package/dist-es/packages/grid/src/RowValidationStatus.js.map +1 -0
- package/dist-es/packages/grid/src/index.js +1 -1
- package/dist-es/packages/grid/src/internal/Cell.css.js +1 -1
- package/dist-es/packages/grid/src/internal/CellStatusIcons.js +40 -0
- package/dist-es/packages/grid/src/internal/CellStatusIcons.js.map +1 -0
- package/dist-es/packages/grid/src/internal/LeftPart.js +4 -2
- package/dist-es/packages/grid/src/internal/LeftPart.js.map +1 -1
- package/dist-es/packages/grid/src/internal/MiddlePart.js +4 -2
- package/dist-es/packages/grid/src/internal/MiddlePart.js.map +1 -1
- package/dist-es/packages/grid/src/internal/RightPart.js +4 -2
- package/dist-es/packages/grid/src/internal/RightPart.js.map +1 -1
- package/dist-es/packages/grid/src/internal/TableBody.js +11 -4
- package/dist-es/packages/grid/src/internal/TableBody.js.map +1 -1
- package/dist-es/packages/grid/src/internal/TableRow.css.js +1 -1
- package/dist-es/packages/grid/src/internal/TableRow.js +33 -12
- package/dist-es/packages/grid/src/internal/TableRow.js.map +1 -1
- package/dist-es/packages/grid/src/internal/gridHooks.js +1 -1
- package/dist-types/ColumnSortContext.d.ts +12 -0
- package/dist-types/Grid.d.ts +7 -1
- package/dist-types/GridColumn.d.ts +54 -2
- package/dist-types/RowValidationStatus.d.ts +7 -0
- package/dist-types/internal/CellStatusIcons.d.ts +4 -0
- package/dist-types/internal/LeftPart.d.ts +2 -0
- package/dist-types/internal/MiddlePart.d.ts +2 -0
- package/dist-types/internal/RightPart.d.ts +2 -0
- package/dist-types/internal/TableBody.d.ts +2 -0
- package/dist-types/internal/TableRow.d.ts +2 -1
- package/package.json +4 -3
|
@@ -7,16 +7,20 @@ var RowSelectionRadioCellValue = require('./RowSelectionRadioCellValue.js');
|
|
|
7
7
|
var GridColumn = require('./GridColumn.js');
|
|
8
8
|
var RowSelectionRadioHeaderCell = require('./RowSelectionRadioHeaderCell.js');
|
|
9
9
|
var SelectionContext = require('./SelectionContext.js');
|
|
10
|
+
var react = require('react');
|
|
10
11
|
|
|
11
12
|
function RowSelectionRadioColumn(props) {
|
|
12
13
|
const { selectRows } = SelectionContext.useSelectionContext();
|
|
13
|
-
const onKeyDown = (
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
14
|
+
const onKeyDown = react.useCallback(
|
|
15
|
+
(event, rowIndex) => {
|
|
16
|
+
if (event.key === " ") {
|
|
17
|
+
selectRows({ rowIndex });
|
|
18
|
+
event.preventDefault();
|
|
19
|
+
event.stopPropagation();
|
|
20
|
+
}
|
|
21
|
+
},
|
|
22
|
+
[selectRows]
|
|
23
|
+
);
|
|
20
24
|
return /* @__PURE__ */ jsxRuntime.jsx(GridColumn.GridColumn, {
|
|
21
25
|
...props,
|
|
22
26
|
defaultWidth: 100,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RowSelectionRadioColumn.js","sources":["../src/RowSelectionRadioColumn.tsx"],"sourcesContent":["import { RowSelectionRadioCellValue } from \"./RowSelectionRadioCellValue\";\nimport { GridColumn, GridColumnProps } from \"./GridColumn\";\nimport { RowSelectionRadioHeaderCell } from \"./RowSelectionRadioHeaderCell\";\nimport { useSelectionContext } from \"./SelectionContext\";\nimport { KeyboardEvent } from \"react\";\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 = (\n event: KeyboardEvent<HTMLDivElement
|
|
1
|
+
{"version":3,"file":"RowSelectionRadioColumn.js","sources":["../src/RowSelectionRadioColumn.tsx"],"sourcesContent":["import { RowSelectionRadioCellValue } from \"./RowSelectionRadioCellValue\";\nimport { GridColumn, GridColumnProps } from \"./GridColumn\";\nimport { RowSelectionRadioHeaderCell } from \"./RowSelectionRadioHeaderCell\";\nimport { useSelectionContext } from \"./SelectionContext\";\nimport { KeyboardEvent, useCallback } from \"react\";\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":["useSelectionContext","useCallback","jsx","GridColumn","RowSelectionRadioHeaderCell","RowSelectionRadioCellValue"],"mappings":";;;;;;;;;;;AAWO,SAAS,wBACd,KACA,EAAA;AACA,EAAM,MAAA,EAAE,UAAW,EAAA,GAAIA,oCAAoB,EAAA,CAAA;AAE3C,EAAA,MAAM,SAAY,GAAAC,iBAAA;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,uBACGC,cAAA,CAAAC,qBAAA,EAAA;AAAA,IACE,GAAG,KAAA;AAAA,IACJ,YAAc,EAAA,GAAA;AAAA,IACd,eAAiB,EAAAC,uDAAA;AAAA,IACjB,kBAAoB,EAAAC,qDAAA;AAAA,IACpB,SAAA;AAAA,GACF,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
require('react/jsx-runtime');
|
|
6
|
+
require('@salt-ds/core');
|
|
7
|
+
var react = require('react');
|
|
8
|
+
require('./GridContext.js');
|
|
9
|
+
|
|
10
|
+
const RowValidationStatusContext = react.createContext({});
|
|
11
|
+
|
|
12
|
+
exports.RowValidationStatusContext = RowValidationStatusContext;
|
|
13
|
+
//# sourceMappingURL=RowValidationStatus.js.map
|
|
@@ -0,0 +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, GridColumn, GridColumnProps } 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":["createContext"],"mappings":";;;;;;;;;AAIa,MAAA,0BAAA,GAA6BA,mBAEvC,CAAA,EAAE;;;;"}
|
|
@@ -47,6 +47,7 @@ exports.useSelectionContext = SelectionContext.useSelectionContext;
|
|
|
47
47
|
exports.SizingContext = SizingContext.SizingContext;
|
|
48
48
|
exports.useSizingContext = SizingContext.useSizingContext;
|
|
49
49
|
exports.Grid = Grid.Grid;
|
|
50
|
+
exports.SortOrder = Grid.SortOrder;
|
|
50
51
|
exports.GridColumn = GridColumn.GridColumn;
|
|
51
52
|
exports.GridContext = GridContext.GridContext;
|
|
52
53
|
exports.useGridContext = GridContext.useGridContext;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
|
|
4
4
|
|
|
5
|
-
var css_248z = ".saltGridCell {\n box-sizing: border-box;\n
|
|
5
|
+
var css_248z = ".saltGridCell {\n box-sizing: border-box;\n margin: 0;\n padding: 0;\n\n white-space: nowrap;\n position: relative;\n font-size: var(--grid-fontSize);\n font-weight: normal;\n\n outline: 0;\n}\n\n.saltGridCell-selected {\n background: var(--grid-cell-background-selected);\n}\n\n.saltGridCell-rowSeparator {\n position: absolute;\n right: 0;\n bottom: 0;\n left: 0;\n height: 1px;\n background-color: var(--grid-row-borderColor);\n}\n\n.saltGridCell-topSeparator {\n position: absolute;\n top: 0;\n right: 0;\n left: 0;\n height: 1px;\n background-color: transparent;\n display: none;\n}\n\n.saltGridTableRow-first .saltGridCell-topSeparator {\n display: unset;\n}\n\n.saltGridCell-columnSeparator {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n width: 1px;\n background-color: var(--grid-row-background);\n}\n\n.saltGrid-columnSeparators .saltGridCell-regularSeparator .saltGridCell-columnSeparator {\n background-color: var(--grid-columnSeparator-color);\n}\n\n.saltGrid-columnSeparators .saltGridCell-pinnedSeparator .saltGridCell-columnSeparator {\n background-color: var(--grid-columnSeparator-color);\n}\n\n.saltGrid-pinnedSeparators .saltGridCell-pinnedSeparator .saltGridCell-columnSeparator {\n background-color: var(--grid-pinnedSeparator-color);\n}\n\n.saltGridTableRow-selected.saltGridTableRow-first .saltGridCell-topSeparator {\n background-color: var(--grid-row-borderColor);\n}\n\n.saltGridCell-body {\n box-sizing: border-box;\n position: absolute;\n top: 0;\n right: 0;\n bottom: 1px;\n left: 0;\n background: var(--grid-row-background);\n border-right: solid 1px transparent;\n}\n\n.saltGridTableRow-first .saltGridCell-body {\n top: 1px;\n}\n";
|
|
6
6
|
styleInject_es(css_248z);
|
|
7
7
|
|
|
8
8
|
module.exports = css_248z;
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
6
|
+
|
|
7
|
+
const CellWarningIcon = /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
8
|
+
"aria-hidden": true,
|
|
9
|
+
height: "1em",
|
|
10
|
+
viewBox: "0 0 10 8",
|
|
11
|
+
fill: "none",
|
|
12
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
13
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
14
|
+
d: "M4.6188 0L9.2376 8H0L4.6188 0Z"
|
|
15
|
+
})
|
|
16
|
+
});
|
|
17
|
+
const CellErrorIcon = /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
18
|
+
"aria-hidden": true,
|
|
19
|
+
width: "1em",
|
|
20
|
+
height: "1em",
|
|
21
|
+
viewBox: "0 0 8 8",
|
|
22
|
+
fill: "none",
|
|
23
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
24
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("circle", {
|
|
25
|
+
cx: "4",
|
|
26
|
+
cy: "4",
|
|
27
|
+
r: "4"
|
|
28
|
+
})
|
|
29
|
+
});
|
|
30
|
+
const CellSuccessIcon = /* @__PURE__ */ jsxRuntime.jsx("svg", {
|
|
31
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
32
|
+
width: "1em",
|
|
33
|
+
viewBox: "0 0 14 14",
|
|
34
|
+
fill: "none",
|
|
35
|
+
children: /* @__PURE__ */ jsxRuntime.jsx("path", {
|
|
36
|
+
fillRule: "evenodd",
|
|
37
|
+
clipRule: "evenodd",
|
|
38
|
+
d: "M13.7668 2.63645L5.06034 12.0309L0.277532 7.56074L1.47248 6.28223L4.97136 9.55242L12.4832 1.4469L13.7668 2.63645Z",
|
|
39
|
+
fill: "#24874B"
|
|
40
|
+
})
|
|
41
|
+
});
|
|
42
|
+
|
|
43
|
+
exports.CellErrorIcon = CellErrorIcon;
|
|
44
|
+
exports.CellSuccessIcon = CellSuccessIcon;
|
|
45
|
+
exports.CellWarningIcon = CellWarningIcon;
|
|
46
|
+
//# sourceMappingURL=CellStatusIcons.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CellStatusIcons.js","sources":["../src/internal/CellStatusIcons.tsx"],"sourcesContent":["export const CellWarningIcon = (\n <svg\n aria-hidden\n height=\"1em\"\n viewBox=\"0 0 10 8\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path d=\"M4.6188 0L9.2376 8H0L4.6188 0Z\" />\n </svg>\n);\n\nexport const CellErrorIcon = (\n <svg\n aria-hidden\n width=\"1em\"\n height=\"1em\"\n viewBox=\"0 0 8 8\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <circle cx=\"4\" cy=\"4\" r=\"4\" />\n </svg>\n);\n\nexport const CellSuccessIcon = (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width=\"1em\"\n viewBox=\"0 0 14 14\"\n fill=\"none\"\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M13.7668 2.63645L5.06034 12.0309L0.277532 7.56074L1.47248 6.28223L4.97136 9.55242L12.4832 1.4469L13.7668 2.63645Z\"\n fill=\"#24874B\"\n />\n </svg>\n);\n"],"names":["jsx"],"mappings":";;;;;;AAAO,MAAM,kCACVA,cAAA,CAAA,KAAA,EAAA;AAAA,EACC,aAAW,EAAA,IAAA;AAAA,EACX,MAAO,EAAA,KAAA;AAAA,EACP,OAAQ,EAAA,UAAA;AAAA,EACR,IAAK,EAAA,MAAA;AAAA,EACL,KAAM,EAAA,4BAAA;AAAA,EAEN,QAAC,kBAAAA,cAAA,CAAA,MAAA,EAAA;AAAA,IAAK,CAAE,EAAA,gCAAA;AAAA,GAAiC,CAAA;AAAA,CAC3C,EAAA;AAGK,MAAM,gCACVA,cAAA,CAAA,KAAA,EAAA;AAAA,EACC,aAAW,EAAA,IAAA;AAAA,EACX,KAAM,EAAA,KAAA;AAAA,EACN,MAAO,EAAA,KAAA;AAAA,EACP,OAAQ,EAAA,SAAA;AAAA,EACR,IAAK,EAAA,MAAA;AAAA,EACL,KAAM,EAAA,4BAAA;AAAA,EAEN,QAAC,kBAAAA,cAAA,CAAA,QAAA,EAAA;AAAA,IAAO,EAAG,EAAA,GAAA;AAAA,IAAI,EAAG,EAAA,GAAA;AAAA,IAAI,CAAE,EAAA,GAAA;AAAA,GAAI,CAAA;AAAA,CAC9B,EAAA;AAGK,MAAM,kCACVA,cAAA,CAAA,KAAA,EAAA;AAAA,EACC,KAAM,EAAA,4BAAA;AAAA,EACN,KAAM,EAAA,KAAA;AAAA,EACN,OAAQ,EAAA,WAAA;AAAA,EACR,IAAK,EAAA,MAAA;AAAA,EAEL,QAAC,kBAAAA,cAAA,CAAA,MAAA,EAAA;AAAA,IACC,QAAS,EAAA,SAAA;AAAA,IACT,QAAS,EAAA,SAAA;AAAA,IACT,CAAE,EAAA,mHAAA;AAAA,IACF,IAAK,EAAA,SAAA;AAAA,GACP,CAAA;AAAA,CACF;;;;;;"}
|
|
@@ -20,7 +20,8 @@ function LeftPart(props) {
|
|
|
20
20
|
rows,
|
|
21
21
|
hoverOverRowKey,
|
|
22
22
|
setHoverOverRowKey,
|
|
23
|
-
zebra
|
|
23
|
+
zebra,
|
|
24
|
+
getRowValidationStatus
|
|
24
25
|
} = props;
|
|
25
26
|
const tableRef = gridHooks.useActiveOnWheel(onWheel);
|
|
26
27
|
if (columns.length === 0) {
|
|
@@ -46,7 +47,8 @@ function LeftPart(props) {
|
|
|
46
47
|
rows,
|
|
47
48
|
hoverRowKey: hoverOverRowKey,
|
|
48
49
|
setHoverRowKey: setHoverOverRowKey,
|
|
49
|
-
zebra
|
|
50
|
+
zebra,
|
|
51
|
+
getRowValidationStatus
|
|
50
52
|
})
|
|
51
53
|
]
|
|
52
54
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LeftPart.js","sources":["../src/internal/LeftPart.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { TableBody } from \"./TableBody\";\nimport { RefObject } from \"react\";\nimport \"./LeftPart.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { useActiveOnWheel } from \"./gridHooks\";\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}\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 } = props;\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 />\n </table>\n </div>\n </div>\n );\n}\n"],"names":["makePrefixer","useActiveOnWheel","jsx","clsx","jsxs","TableColGroup","TableBody"],"mappings":";;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"LeftPart.js","sources":["../src/internal/LeftPart.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { TableBody } from \"./TableBody\";\nimport { RefObject } from \"react\";\nimport \"./LeftPart.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { useActiveOnWheel } from \"./gridHooks\";\nimport { CellValidationState } from \"../GridColumn\";\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 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":["makePrefixer","useActiveOnWheel","jsx","clsx","jsxs","TableColGroup","TableBody"],"mappings":";;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,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,EAAM,MAAA,QAAA,GAAWC,2BAAiB,OAAO,CAAA,CAAA;AAEzC,EAAI,IAAA,OAAA,CAAQ,WAAW,CAAG,EAAA;AACxB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,OAAA;AAAA,IACL,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,aAAa,CAAI,GAAA,WAAA;AAAA,KAChC,CAAA;AAAA,IAED,QAAC,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAAG,aAAY,EAAA,gBAAA;AAAA,MACjD,QAAC,kBAAAE,eAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAACF,cAAA,CAAAG,2BAAA,EAAA;AAAA,YAAc,OAAA;AAAA,WAAkB,CAAA;AAAA,0BAChCH,cAAA,CAAAI,mBAAA,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;;;;"}
|
|
@@ -19,7 +19,8 @@ function MiddlePart(props) {
|
|
|
19
19
|
hoverOverRowKey,
|
|
20
20
|
setHoverOverRowKey,
|
|
21
21
|
midGap,
|
|
22
|
-
zebra
|
|
22
|
+
zebra,
|
|
23
|
+
getRowValidationStatus
|
|
23
24
|
} = props;
|
|
24
25
|
const tableRef = gridHooks.useActiveOnWheel(onWheel);
|
|
25
26
|
return /* @__PURE__ */ jsxRuntime.jsx("div", {
|
|
@@ -42,7 +43,8 @@ function MiddlePart(props) {
|
|
|
42
43
|
hoverRowKey: hoverOverRowKey,
|
|
43
44
|
setHoverRowKey: setHoverOverRowKey,
|
|
44
45
|
gap: midGap,
|
|
45
|
-
zebra
|
|
46
|
+
zebra,
|
|
47
|
+
getRowValidationStatus
|
|
46
48
|
})
|
|
47
49
|
]
|
|
48
50
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MiddlePart.js","sources":["../src/internal/MiddlePart.tsx"],"sourcesContent":["import { RefObject } from \"react\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { TableBody } from \"./TableBody\";\nimport \"./MiddlePart.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { useActiveOnWheel } from \"./gridHooks\";\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}\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 } = props;\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 />\n </table>\n </div>\n </div>\n );\n}\n"],"names":["makePrefixer","useActiveOnWheel","jsx","jsxs","TableColGroup","TableBody"],"mappings":";;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"MiddlePart.js","sources":["../src/internal/MiddlePart.tsx"],"sourcesContent":["import { RefObject } from \"react\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { TableBody } from \"./TableBody\";\nimport \"./MiddlePart.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { useActiveOnWheel } from \"./gridHooks\";\nimport { CellValidationState } from \"../GridColumn\";\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 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":["makePrefixer","useActiveOnWheel","jsx","jsxs","TableColGroup","TableBody"],"mappings":";;;;;;;;;;;AASA,MAAM,YAAA,GAAeA,kBAAa,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,EAAM,MAAA,QAAA,GAAWC,2BAAiB,OAAO,CAAA,CAAA;AAEzC,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,SAAA;AAAA,IACL,WAAW,YAAa,EAAA;AAAA,IACxB,aAAY,EAAA,kBAAA;AAAA,IAEZ,QAAC,kBAAAA,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAClC,QAAC,kBAAAC,eAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAACD,cAAA,CAAAE,2BAAA,EAAA;AAAA,YAAc,OAAA;AAAA,YAAkB,GAAK,EAAA,MAAA;AAAA,WAAQ,CAAA;AAAA,0BAC7CF,cAAA,CAAAG,mBAAA,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;;;;"}
|
|
@@ -20,7 +20,8 @@ function RightPart(props) {
|
|
|
20
20
|
rows,
|
|
21
21
|
hoverOverRowKey,
|
|
22
22
|
setHoverOverRowKey,
|
|
23
|
-
zebra
|
|
23
|
+
zebra,
|
|
24
|
+
getRowValidationStatus
|
|
24
25
|
} = props;
|
|
25
26
|
const tableRef = gridHooks.useActiveOnWheel(onWheel);
|
|
26
27
|
if (columns.length === 0) {
|
|
@@ -46,7 +47,8 @@ function RightPart(props) {
|
|
|
46
47
|
rows,
|
|
47
48
|
hoverRowKey: hoverOverRowKey,
|
|
48
49
|
setHoverRowKey: setHoverOverRowKey,
|
|
49
|
-
zebra
|
|
50
|
+
zebra,
|
|
51
|
+
getRowValidationStatus
|
|
50
52
|
})
|
|
51
53
|
]
|
|
52
54
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RightPart.js","sources":["../src/internal/RightPart.tsx"],"sourcesContent":["import { RefObject } from \"react\";\nimport { clsx } from \"clsx\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { TableBody } from \"./TableBody\";\nimport \"./RightPart.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { useActiveOnWheel } from \"./gridHooks\";\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}\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 } = props;\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 />\n </table>\n </div>\n </div>\n );\n}\n"],"names":["makePrefixer","useActiveOnWheel","jsx","clsx","jsxs","TableColGroup","TableBody"],"mappings":";;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"RightPart.js","sources":["../src/internal/RightPart.tsx"],"sourcesContent":["import { RefObject } from \"react\";\nimport { clsx } from \"clsx\";\nimport { TableColGroup } from \"./TableColGroup\";\nimport { TableBody } from \"./TableBody\";\nimport \"./RightPart.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { useActiveOnWheel } from \"./gridHooks\";\nimport { CellValidationState } from \"../GridColumn\";\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 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":["makePrefixer","useActiveOnWheel","jsx","clsx","jsxs","TableColGroup","TableBody"],"mappings":";;;;;;;;;;;;AAUA,MAAM,YAAA,GAAeA,kBAAa,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,EAAM,MAAA,QAAA,GAAWC,2BAAiB,OAAO,CAAA,CAAA;AAEzC,EAAI,IAAA,OAAA,CAAQ,WAAW,CAAG,EAAA;AACxB,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,uBACGC,cAAA,CAAA,KAAA,EAAA;AAAA,IACC,GAAK,EAAA,QAAA;AAAA,IACL,SAAA,EAAWC,SAAK,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,kBAAAD,cAAA,CAAA,KAAA,EAAA;AAAA,MAAI,SAAA,EAAW,aAAa,OAAO,CAAA;AAAA,MAClC,QAAC,kBAAAE,eAAA,CAAA,OAAA,EAAA;AAAA,QAAM,GAAK,EAAA,QAAA;AAAA,QAAU,IAAK,EAAA,cAAA;AAAA,QACzB,QAAA,EAAA;AAAA,0BAACF,cAAA,CAAAG,2BAAA,EAAA;AAAA,YAAc,OAAA;AAAA,WAAkB,CAAA;AAAA,0BAChCH,cAAA,CAAAI,mBAAA,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;;;;"}
|
|
@@ -11,7 +11,15 @@ var EditorContext = require('../EditorContext.js');
|
|
|
11
11
|
var CursorContext = require('../CursorContext.js');
|
|
12
12
|
|
|
13
13
|
function TableBody(props) {
|
|
14
|
-
const {
|
|
14
|
+
const {
|
|
15
|
+
columns,
|
|
16
|
+
rows,
|
|
17
|
+
hoverRowKey,
|
|
18
|
+
setHoverRowKey,
|
|
19
|
+
gap,
|
|
20
|
+
zebra,
|
|
21
|
+
getRowValidationStatus
|
|
22
|
+
} = props;
|
|
15
23
|
const { selRowIdxs, selectedCellRange } = SelectionContext.useSelectionContext();
|
|
16
24
|
const isCellInSelectedRange = react.useCallback(
|
|
17
25
|
(rowIdx, colIdx) => {
|
|
@@ -45,7 +53,6 @@ function TableBody(props) {
|
|
|
45
53
|
onDoubleClick,
|
|
46
54
|
children: rows.map((row) => {
|
|
47
55
|
const isSelected = selRowIdxs.has(row.index);
|
|
48
|
-
const isFollowedBySelected = selRowIdxs.has(row.index + 1);
|
|
49
56
|
const cursorIdx = focusedPart === "body" && cursorRowIdx === row.index ? cursorColIdx : void 0;
|
|
50
57
|
const editorColIdx = editMode ? cursorIdx : void 0;
|
|
51
58
|
return /* @__PURE__ */ jsxRuntime.jsx(TableRow.TableRow, {
|
|
@@ -54,13 +61,13 @@ function TableBody(props) {
|
|
|
54
61
|
columns,
|
|
55
62
|
isHoverOver: row.key === hoverRowKey,
|
|
56
63
|
isSelected,
|
|
57
|
-
isFollowedBySelected,
|
|
58
64
|
cursorColIdx: cursorIdx,
|
|
59
65
|
gap,
|
|
60
66
|
zebra: zebra && row.index % 2 == 0,
|
|
61
67
|
editorColIdx,
|
|
62
68
|
isCellSelected: isCellInSelectedRange,
|
|
63
|
-
headerIsFocusable
|
|
69
|
+
headerIsFocusable,
|
|
70
|
+
validationStatus: getRowValidationStatus ? getRowValidationStatus(row) : void 0
|
|
64
71
|
}, row.key);
|
|
65
72
|
})
|
|
66
73
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableBody.js","sources":["../src/internal/TableBody.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useMemo } from \"react\";\nimport { TableRow } from \"./TableRow\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { getRowKeyAttribute } from \"./utils\";\nimport { useSelectionContext } from \"../SelectionContext\";\nimport { useEditorContext } from \"../EditorContext\";\nimport { useCursorContext } from \"../CursorContext\";\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}\n\nexport function TableBody<T>(props: TableBodyProps<T>) {\n const {
|
|
1
|
+
{"version":3,"file":"TableBody.js","sources":["../src/internal/TableBody.tsx"],"sourcesContent":["import { MouseEventHandler, useCallback, useMemo } from \"react\";\nimport { TableRow } from \"./TableRow\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { getRowKeyAttribute } from \"./utils\";\nimport { useSelectionContext } from \"../SelectionContext\";\nimport { useEditorContext } from \"../EditorContext\";\nimport { useCursorContext } from \"../CursorContext\";\nimport { CellValidationState } from \"../GridColumn\";\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.target as HTMLElement;\n const rowKey = getRowKeyAttribute(target);\n setHoverRowKey(rowKey);\n };\n\n const onMouseLeave: MouseEventHandler<HTMLTableSectionElement> = (event) => {\n setHoverRowKey(undefined);\n };\n\n const onDoubleClick: MouseEventHandler<HTMLTableSectionElement> = (event) => {\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":["useSelectionContext","useCallback","useCursorContext","useEditorContext","getRowKeyAttribute","jsx","TableRow"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
var styleInject_es = require('../../../../node_modules/style-inject/dist/style-inject.es.js');
|
|
4
4
|
|
|
5
|
-
var css_248z = ".saltGridTableRow {\n height: var(--grid-row-height);\n /* Row border doesn't render properly in Chrome on Windows. Applying borders to cells */\n --grid-row-borderColor: var(--grid-rowSeparator-color);\n --grid-row-background: var(--grid-background);\n}\n\n.saltGridTableRow-first {\n height: calc(var(--grid-row-height) + 1px);\n}\n\n.saltGridTableRow th {\n border-style: solid;\n border-color: var(--grid-row-borderColor);\n border-width: var(--grid-rowSeparator-width) 0 0 0;\n}\n\n.saltGridTableRow-divided {\n --grid-row-borderColor: var(--grid-rowSeparator-color-divided);\n}\n\n.saltGridTableRow-zebra {\n --grid-row-background: var(--grid-zebraColor);\n}\n\n.saltGridTableRow-hover {\n --grid-row-background: var(--grid-row-background-hover);\n}\n\n.saltGridTableRow-selected {\n --grid-row-borderColor: var(--grid-row-borderColor-selected);\n --grid-row-background: var(--grid-row-background-selected);\n}\n\n.saltGridTableRow-
|
|
5
|
+
var css_248z = ".saltGridTableRow {\n height: var(--grid-row-height);\n /* Row border doesn't render properly in Chrome on Windows. Applying borders to cells */\n --grid-row-borderColor: var(--grid-rowSeparator-color);\n --grid-row-background: var(--grid-background);\n}\n\n.saltGridTableRow-first {\n height: calc(var(--grid-row-height) + 1px);\n}\n\n.saltGridTableRow th {\n border-style: solid;\n border-color: var(--grid-row-borderColor);\n border-width: var(--grid-rowSeparator-width) 0 0 0;\n}\n\n.saltGridTableRow-divided {\n --grid-row-borderColor: var(--grid-rowSeparator-color-divided);\n}\n\n.saltGridTableRow-zebra {\n --grid-row-background: var(--grid-zebraColor);\n}\n\n.saltGridTableRow-hover {\n --grid-row-background: var(--grid-row-background-hover);\n}\n\n.saltGridTableRow-selected {\n --grid-row-borderColor: var(--grid-row-borderColor-selected);\n --grid-row-background: var(--grid-row-background-selected);\n}\n\n.saltGridTableRow-selected .saltGridCell:before {\n content: \"\";\n position: absolute;\n top: -1px;\n left: 0;\n right: 0;\n height: 1px;\n background: var(--grid-row-borderColor);\n z-index: var(--salt-zIndex-default);\n}\n\n.saltGridTableRow-zebra.saltGridTableRow-selected {\n --grid-row-background: var(--grid-row-background-selected);\n}\n\n.saltGridTableRow-zebra.saltGridTableRow-hover {\n --grid-row-background: var(--grid-row-background-hover);\n}\n\n.saltGridTableRow-zebra.saltGridTableRow-selected.saltGridTableRow-hover {\n --grid-row-background: var(--grid-row-background-hover);\n}\n\n.saltGridTableRow-selected.saltGridTableRow-hover {\n --grid-row-background: var(--grid-row-background-hover);\n}\n\n.saltGridTableRow-validationStatus-error,\n.saltGridTableRow-validationStatus-error.saltGridTableRow-hover {\n --grid-row-background: var(--salt-status-error-background-emphasize);\n}\n.saltGridTableRow-validationStatus-warning,\n.saltGridTableRow-validationStatus-warning.saltGridTableRow-hover {\n --grid-row-background: var(--salt-status-warning-background-emphasize);\n}\n.saltGridTableRow-validationStatus-success,\n.saltGridTableRow-validationStatus-success.saltGridTableRow-hover {\n --grid-row-background: var(--salt-status-success-background-emphasize);\n}\n\n.saltGridTableRow-validationStatus-error.saltGridTableRow-selected {\n --grid-row-background: var(--salt-status-error-background-selected);\n --grid-row-borderColor: var(--salt-status-error-borderColor);\n}\n.saltGridTableRow-validationStatus-warning.saltGridTableRow-selected {\n --grid-row-background: var(--salt-status-warning-background-selected);\n --grid-row-borderColor: var(--salt-status-warning-borderColor);\n}\n.saltGridTableRow-validationStatus-success.saltGridTableRow-selected {\n --grid-row-background: var(--salt-status-success-background-selected);\n --grid-row-borderColor: var(--salt-status-success-borderColor);\n}\n";
|
|
6
6
|
styleInject_es(css_248z);
|
|
7
7
|
|
|
8
8
|
module.exports = css_248z;
|
|
@@ -11,13 +11,13 @@ var clsx = require('clsx');
|
|
|
11
11
|
var FakeCell = require('./FakeCell.js');
|
|
12
12
|
var DefaultCellValue = require('./DefaultCellValue.js');
|
|
13
13
|
var GridContext = require('../GridContext.js');
|
|
14
|
+
var RowValidationStatus = require('../RowValidationStatus.js');
|
|
14
15
|
|
|
15
16
|
const withBaseName = core.makePrefixer("saltGridTableRow");
|
|
16
17
|
function TableRow(props) {
|
|
17
18
|
const {
|
|
18
19
|
row,
|
|
19
20
|
isSelected,
|
|
20
|
-
isFollowedBySelected,
|
|
21
21
|
zebra,
|
|
22
22
|
isHoverOver,
|
|
23
23
|
columns,
|
|
@@ -27,7 +27,8 @@ function TableRow(props) {
|
|
|
27
27
|
gap,
|
|
28
28
|
editorColIdx,
|
|
29
29
|
isCellSelected,
|
|
30
|
-
headerIsFocusable
|
|
30
|
+
headerIsFocusable,
|
|
31
|
+
validationStatus: rowValidationStatus
|
|
31
32
|
} = props;
|
|
32
33
|
const grid = GridContext.useGridContext();
|
|
33
34
|
if (!row.key) {
|
|
@@ -41,8 +42,8 @@ function TableRow(props) {
|
|
|
41
42
|
[withBaseName("zebra")]: zebra,
|
|
42
43
|
[withBaseName("hover")]: isHoverOver,
|
|
43
44
|
[withBaseName("selected")]: isSelected,
|
|
44
|
-
[withBaseName("
|
|
45
|
-
[withBaseName(
|
|
45
|
+
[withBaseName("first")]: row.index === 0,
|
|
46
|
+
[withBaseName(`validationStatus-${rowValidationStatus}`)]: rowValidationStatus
|
|
46
47
|
}),
|
|
47
48
|
onMouseEnter,
|
|
48
49
|
onMouseLeave,
|
|
@@ -51,6 +52,7 @@ function TableRow(props) {
|
|
|
51
52
|
role: "row",
|
|
52
53
|
children: [
|
|
53
54
|
columns.map((column, i) => {
|
|
55
|
+
var _a, _b, _c, _d;
|
|
54
56
|
const colKey = column.info.props.id;
|
|
55
57
|
const editorInfo = grid.getEditor(column.info.props.id);
|
|
56
58
|
const isEditable = !!editorInfo;
|
|
@@ -71,19 +73,38 @@ function TableRow(props) {
|
|
|
71
73
|
const value = column.info.props.getValue && row.data ? column.info.props.getValue(row.data) : null;
|
|
72
74
|
const isFocused = cursorColIdx === column.index;
|
|
73
75
|
const isSelected2 = isCellSelected && isCellSelected(row.index, column.index);
|
|
74
|
-
|
|
76
|
+
const validationFnArg = {
|
|
75
77
|
row,
|
|
76
78
|
column,
|
|
77
79
|
isFocused,
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
80
|
+
value
|
|
81
|
+
};
|
|
82
|
+
const validationStatus = (_b = (_a = column.info.props).getValidationStatus) == null ? void 0 : _b.call(_a, validationFnArg);
|
|
83
|
+
const validationMessage = validationStatus && ((_d = (_c = column.info.props).getValidationMessage) == null ? void 0 : _d.call(_c, validationFnArg));
|
|
84
|
+
return /* @__PURE__ */ jsxRuntime.jsx(RowValidationStatus.RowValidationStatusContext.Provider, {
|
|
85
|
+
value: { status: rowValidationStatus },
|
|
86
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(Cell, {
|
|
82
87
|
row,
|
|
88
|
+
column,
|
|
89
|
+
isFocused,
|
|
90
|
+
isSelected: isSelected2,
|
|
91
|
+
isEditable,
|
|
92
|
+
validationStatus,
|
|
93
|
+
validationMessage,
|
|
94
|
+
validationType: column.info.props.validationType,
|
|
83
95
|
value,
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
96
|
+
align: column.info.props.align,
|
|
97
|
+
children: /* @__PURE__ */ jsxRuntime.jsx(CellValue, {
|
|
98
|
+
column,
|
|
99
|
+
row,
|
|
100
|
+
value,
|
|
101
|
+
isFocused,
|
|
102
|
+
validationStatus,
|
|
103
|
+
validationMessage,
|
|
104
|
+
validationType: column.info.props.validationType
|
|
105
|
+
})
|
|
106
|
+
}, colKey)
|
|
107
|
+
});
|
|
87
108
|
}),
|
|
88
109
|
gap !== void 0 && gap > 0 ? /* @__PURE__ */ jsxRuntime.jsx(FakeCell.FakeCell, {
|
|
89
110
|
row
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TableRow.js","sources":["../src/internal/TableRow.tsx"],"sourcesContent":["import {\n Children,\n cloneElement,\n isValidElement,\n MouseEventHandler,\n} from \"react\";\nimport \"./TableRow.css\";\nimport { BaseCell } from \"../BaseCell\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { FakeCell } from \"./FakeCell\";\nimport { DefaultCellValue } from \"./DefaultCellValue\";\nimport { useGridContext } from \"../GridContext\";\n\nconst withBaseName = makePrefixer(\"saltGridTableRow\");\n\nexport interface TableRowProps<T> {\n row: GridRowModel<T>;\n isSelected?: boolean
|
|
1
|
+
{"version":3,"file":"TableRow.js","sources":["../src/internal/TableRow.tsx"],"sourcesContent":["import {\n Children,\n cloneElement,\n isValidElement,\n MouseEventHandler,\n} from \"react\";\nimport \"./TableRow.css\";\nimport { BaseCell } from \"../BaseCell\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport { GridColumnModel, GridRowModel } from \"../Grid\";\nimport { FakeCell } from \"./FakeCell\";\nimport { DefaultCellValue } from \"./DefaultCellValue\";\nimport { useGridContext } from \"../GridContext\";\nimport { CellValidationState } from \"../GridColumn\";\nimport { RowValidationStatusContext } from \"../RowValidationStatus\";\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 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 =\n isCellSelected && 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 value={{ status: rowValidationStatus }}\n >\n <Cell\n key={colKey}\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":["makePrefixer","useGridContext","jsxs","clsx","isValidElement","Children","cloneElement","BaseCell","DefaultCellValue","isSelected","jsx","RowValidationStatusContext","FakeCell"],"mappings":";;;;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAeA,kBAAa,kBAAkB,CAAA,CAAA;AAkB7C,SAAS,SAAY,KAAyB,EAAA;AACnD,EAAM,MAAA;AAAA,IACJ,GAAA;AAAA,IACA,UAAA;AAAA,IACA,KAAA;AAAA,IACA,WAAA;AAAA,IACA,OAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,GAAA;AAAA,IACA,YAAA;AAAA,IACA,cAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAkB,EAAA,mBAAA;AAAA,GAChB,GAAA,KAAA,CAAA;AAEJ,EAAA,MAAM,OAAOC,0BAAe,EAAA,CAAA;AAE5B,EAAI,IAAA,CAAC,IAAI,GAAK,EAAA;AACZ,IAAM,MAAA,IAAI,MAAM,CAAa,WAAA,CAAA,CAAA,CAAA;AAAA,GAC/B;AAEA,EAAA,MAAM,eAAe,iBAAoB,GAAA,GAAA,CAAI,KAAQ,GAAA,CAAA,GAAI,IAAI,KAAQ,GAAA,CAAA,CAAA;AAErE,EAAA,uBACGC,eAAA,CAAA,IAAA,EAAA;AAAA,IACC,eAAe,EAAA,YAAA;AAAA,IACf,eAAA,EAAe,aAAa,IAAO,GAAA,KAAA,CAAA;AAAA,IACnC,SAAA,EAAWC,SAAK,CAAA,YAAA,EAAgB,EAAA;AAAA,MAC9B,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,KAAA;AAAA,MACzB,CAAC,YAAa,CAAA,OAAO,CAAI,GAAA,WAAA;AAAA,MACzB,CAAC,YAAa,CAAA,UAAU,CAAI,GAAA,UAAA;AAAA,MAC5B,CAAC,YAAA,CAAa,OAAO,CAAA,GAAI,IAAI,KAAU,KAAA,CAAA;AAAA,MACvC,CAAC,YAAA,CAAa,CAAoB,iBAAA,EAAA,mBAAA,CAAA,CAAqB,CACrD,GAAA,mBAAA;AAAA,KACH,CAAA;AAAA,IACD,YAAA;AAAA,IACA,YAAA;AAAA,IACA,kBAAgB,GAAI,CAAA,KAAA;AAAA,IACpB,gBAAc,GAAI,CAAA,GAAA;AAAA,IAClB,IAAK,EAAA,KAAA;AAAA,IAEJ,QAAA,EAAA;AAAA,MAAQ,OAAA,CAAA,GAAA,CAAI,CAAC,MAAA,EAAQ,CAAM,KAAA;AA9ElC,QAAA,IAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,EAAA,CAAA;AA+EQ,QAAM,MAAA,MAAA,GAAS,MAAO,CAAA,IAAA,CAAK,KAAM,CAAA,EAAA,CAAA;AACjC,QAAA,MAAM,aAAa,IAAK,CAAA,SAAA,CAAU,MAAO,CAAA,IAAA,CAAK,MAAM,EAAE,CAAA,CAAA;AACtD,QAAM,MAAA,UAAA,GAAa,CAAC,CAAC,UAAA,CAAA;AAErB,QAAI,IAAA,YAAA,KAAiB,OAAO,KAAO,EAAA;AACjC,UAAA,IAAI,UAAY,EAAA;AACd,YAAI,IAAAC,oBAAA,CAAe,UAAW,CAAA,QAAQ,CAAG,EAAA;AACvC,cAAA,MAAM,aAAgB,GAAAC,cAAA,CAAS,IAAK,CAAA,UAAA,CAAW,QAAQ,CAAA,CAAA;AACvD,cAAA,OAAOC,mBAAa,aAAe,EAAA;AAAA,gBACjC,GAAK,EAAA,MAAA;AAAA,gBACL,GAAA;AAAA,gBACA,MAAA;AAAA,eACM,CAAA,CAAA;AAAA,aACV;AAAA,WACF;AAAA,SACF;AAEA,QAAA,MAAM,IAAO,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,aAAiB,IAAAC,iBAAA,CAAA;AAChD,QAAA,MAAM,SACJ,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,kBAAsB,IAAAC,iCAAA,CAAA;AAC1C,QAAA,MAAM,KACJ,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,QAAY,IAAA,GAAA,CAAI,IAC9B,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,CAAM,QAAS,CAAA,GAAA,CAAI,IAAI,CACnC,GAAA,IAAA,CAAA;AACN,QAAM,MAAA,SAAA,GAAY,iBAAiB,MAAO,CAAA,KAAA,CAAA;AAC1C,QAAA,MAAMC,cACJ,cAAkB,IAAA,cAAA,CAAe,GAAI,CAAA,KAAA,EAAO,OAAO,KAAK,CAAA,CAAA;AAC1D,QAAA,MAAM,eAAkB,GAAA;AAAA,UACtB,GAAA;AAAA,UACA,MAAA;AAAA,UACA,SAAA;AAAA,UACA,KAAA;AAAA,SACF,CAAA;AACA,QAAA,MAAM,gBACJ,GAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,EAAM,wBAAlB,IAAwC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAA,eAAA,CAAA,CAAA;AAC1C,QAAA,MAAM,oBACJ,gBACA,KAAA,CAAA,EAAA,GAAA,CAAA,EAAA,GAAA,MAAA,CAAO,IAAK,CAAA,KAAA,EAAM,yBAAlB,IAAyC,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,EAAA,EAAA,eAAA,CAAA,CAAA,CAAA;AAE3C,QACE,uBAAAC,cAAA,CAACC,+CAA2B,QAA3B,EAAA;AAAA,UACC,KAAA,EAAO,EAAE,MAAA,EAAQ,mBAAoB,EAAA;AAAA,UAErC,QAAC,kBAAAD,cAAA,CAAA,IAAA,EAAA;AAAA,YAEC,GAAA;AAAA,YACA,MAAA;AAAA,YACA,SAAA;AAAA,YACA,UAAYD,EAAAA,WAAAA;AAAA,YACZ,UAAA;AAAA,YACA,gBAAA;AAAA,YACA,iBAAA;AAAA,YACA,cAAA,EAAgB,MAAO,CAAA,IAAA,CAAK,KAAM,CAAA,cAAA;AAAA,YAClC,KAAA;AAAA,YACA,KAAA,EAAO,MAAO,CAAA,IAAA,CAAK,KAAM,CAAA,KAAA;AAAA,YAEzB,QAAC,kBAAAC,cAAA,CAAA,SAAA,EAAA;AAAA,cACC,MAAA;AAAA,cACA,GAAA;AAAA,cACA,KAAA;AAAA,cACA,SAAA;AAAA,cACA,gBAAA;AAAA,cACA,iBAAA;AAAA,cACA,cAAA,EAAgB,MAAO,CAAA,IAAA,CAAK,KAAM,CAAA,cAAA;AAAA,aACpC,CAAA;AAAA,WAAA,EApBK,MAqBP,CAAA;AAAA,SACF,CAAA,CAAA;AAAA,OAEH,CAAA;AAAA,MACA,GAAQ,KAAA,KAAA,CAAA,IAAa,GAAM,GAAA,CAAA,mBAAKA,cAAA,CAAAE,iBAAA,EAAA;AAAA,QAAS,GAAA;AAAA,OAAU,CAAK,GAAA,IAAA;AAAA,KAAA;AAAA,GAC3D,CAAA,CAAA;AAEJ;;;;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import styleInject from '../../../node_modules/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".saltGridBaseCell-valueContainer {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n box-sizing: border-box;\n overflow: hidden;\n text-overflow: ellipsis;\n line-height: calc(var(--grid-row-height) - 2px);\n border-style: solid;\n border-width: 1px;\n border-color: transparent;\n --grid-cell-padding: 0 calc(var(--grid-padding) - 1px);\n}\n\n.saltGridCell-editable .saltGridBaseCell-valueContainer {\n border-style: solid;\n border-width: 1px;\n border-color: var(--grid-editableCell-borderColor);\n}\n\n.saltGridCell-editable:hover .saltGridBaseCell-valueContainer {\n border-color: var(--grid-editableCell-borderColor-hover);\n}\n\n.saltGridCell-editable:focus .saltGridBaseCell-valueContainer {\n border-color: transparent;\n}\n";
|
|
3
|
+
var css_248z = ".saltGridBaseCell-valueContainer {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n box-sizing: border-box;\n overflow: hidden;\n text-overflow: ellipsis;\n line-height: calc(var(--grid-row-height) - 2px);\n border-style: solid;\n border-width: 1px;\n border-color: transparent;\n --grid-cell-padding: 0 calc(var(--grid-padding) - 1px);\n}\n\n.saltGridCell-editable .saltGridBaseCell-valueContainer {\n border-style: solid;\n border-width: 1px;\n border-color: var(--grid-editableCell-borderColor);\n}\n\n.saltGridCell-editable:hover .saltGridBaseCell-valueContainer {\n border-color: var(--grid-editableCell-borderColor-hover);\n}\n\n.saltGridCell-editable:focus .saltGridBaseCell-valueContainer {\n border-color: transparent;\n}\n\n.saltGridBaseCell-status-error {\n --status-border-color: var(--salt-status-error-borderColor);\n --status-background-color: var(--salt-status-error-background-emphasize);\n}\n\n.saltGridBaseCell-status-warning {\n --status-border-color: var(--salt-status-warning-borderColor);\n --status-background-color: var(--salt-status-warning-background-emphasize);\n}\n\n.saltGridBaseCell-status-success {\n --status-border-color: var(--salt-status-success-borderColor);\n --status-background-color: var(--salt-status-success-background-emphasize);\n}\n\n.saltGridCell-editable .saltGridBaseCell-valueContainer {\n border-color: var(--status-border-color);\n}\n\n.saltGridBaseCell-hasValidation:focus .saltGridCursor {\n border-color: var(--status-border-color);\n}\n\n.saltGridBaseCell-hasValidation:focus .saltGridCornerTag-focusOnly {\n border-left-color: var(--status-border-color);\n}\n\n.saltGridBaseCell-valueContainer {\n background-color: var(--status-background-color);\n}\n\n.salt-density-high {\n --grid-statusIndicator-size: 5px;\n}\n\n.salt-density-medium {\n --grid-statusIndicator-size: 6px;\n}\n\n.salt-density-low {\n --grid-statusIndicator-size: 7px;\n}\n\n.salt-density-touch {\n --grid-statusIndicator-size: 9px;\n}\n\n.saltGridBaseCell-statusContainer {\n font-size: var(--saltGrid-statusIndicator-size, var(--grid-statusIndicator-size));\n position: absolute;\n bottom: 3px;\n right: 3px;\n}\n\n.saltGridBaseCell-statusContainer svg {\n display: block;\n fill: var(--status-border-color);\n}\n\n.saltGridBaseCell-statusContainer.saltGridBaseCell-statusContainer-align-right {\n right: auto;\n left: 3px;\n}\n";
|
|
4
4
|
styleInject(css_248z);
|
|
5
5
|
|
|
6
6
|
export { css_248z as default };
|
|
@@ -23,11 +23,17 @@ import './internal/TopRightPart.js';
|
|
|
23
23
|
import './internal/FakeCell.css.js';
|
|
24
24
|
import './internal/DefaultCellValue.js';
|
|
25
25
|
import { CornerTag } from './CornerTag.js';
|
|
26
|
+
import { CellWarningIcon, CellErrorIcon, CellSuccessIcon } from './internal/CellStatusIcons.js';
|
|
26
27
|
|
|
27
28
|
const withBaseName = makePrefixer("saltGridBaseCell");
|
|
28
29
|
function getCellId(rowKey, column) {
|
|
29
30
|
return `R${rowKey}C${column.info.props.id}`;
|
|
30
31
|
}
|
|
32
|
+
const icons = {
|
|
33
|
+
warning: CellWarningIcon,
|
|
34
|
+
error: CellErrorIcon,
|
|
35
|
+
success: CellSuccessIcon
|
|
36
|
+
};
|
|
31
37
|
function BaseCell(props) {
|
|
32
38
|
const {
|
|
33
39
|
column,
|
|
@@ -37,12 +43,20 @@ function BaseCell(props) {
|
|
|
37
43
|
isFocused,
|
|
38
44
|
isSelected,
|
|
39
45
|
isEditable,
|
|
40
|
-
children
|
|
46
|
+
children,
|
|
47
|
+
validationStatus,
|
|
48
|
+
validationMessage,
|
|
49
|
+
validationType = "light",
|
|
50
|
+
align
|
|
41
51
|
} = props;
|
|
42
52
|
const { ref, isFocusableContent, onFocus } = useFocusableContent();
|
|
53
|
+
const cellId = getCellId(row.key, column);
|
|
54
|
+
const hasValidation = !!validationStatus;
|
|
55
|
+
const hasValidationMessage = !!validationMessage || hasValidation;
|
|
56
|
+
const validationMessageId = `${cellId}-statusMessage`;
|
|
43
57
|
return /* @__PURE__ */ jsxs(Cell, {
|
|
44
58
|
ref,
|
|
45
|
-
id:
|
|
59
|
+
id: cellId,
|
|
46
60
|
"data-row-index": row.index,
|
|
47
61
|
"data-column-index": column.index,
|
|
48
62
|
"data-testid": isFocused ? "grid-cell-focused" : void 0,
|
|
@@ -51,15 +65,33 @@ function BaseCell(props) {
|
|
|
51
65
|
separator: column.separator,
|
|
52
66
|
isSelected,
|
|
53
67
|
isEditable,
|
|
54
|
-
className,
|
|
68
|
+
className: clsx(className, {
|
|
69
|
+
[withBaseName("hasValidation")]: hasValidation,
|
|
70
|
+
[withBaseName(`status-${validationStatus}`)]: validationStatus
|
|
71
|
+
}),
|
|
55
72
|
style,
|
|
56
73
|
tabIndex: isFocused && !isFocusableContent ? 0 : -1,
|
|
57
74
|
onFocus,
|
|
75
|
+
"aria-invalid": validationStatus === "error" || void 0,
|
|
76
|
+
"aria-describedby": hasValidationMessage ? validationMessageId : void 0,
|
|
58
77
|
children: [
|
|
78
|
+
hasValidationMessage ? /* @__PURE__ */ jsx("div", {
|
|
79
|
+
id: validationMessageId,
|
|
80
|
+
className: "salt-visuallyHidden",
|
|
81
|
+
"aria-hidden": true,
|
|
82
|
+
role: "status",
|
|
83
|
+
children: validationMessage ? validationMessage : `Cell validation state is ${validationStatus}`
|
|
84
|
+
}) : null,
|
|
59
85
|
/* @__PURE__ */ jsx("div", {
|
|
60
86
|
className: clsx(withBaseName("valueContainer")),
|
|
61
87
|
children
|
|
62
88
|
}),
|
|
89
|
+
hasValidation && validationType === "strong" ? /* @__PURE__ */ jsx("div", {
|
|
90
|
+
className: clsx(withBaseName("statusContainer"), {
|
|
91
|
+
[withBaseName(`statusContainer-align-${align}`)]: align
|
|
92
|
+
}),
|
|
93
|
+
children: icons[validationStatus]
|
|
94
|
+
}) : null,
|
|
63
95
|
isFocused && isEditable && /* @__PURE__ */ jsx(CornerTag, {
|
|
64
96
|
focusOnly: true
|
|
65
97
|
}),
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BaseCell.js","sources":["../src/BaseCell.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport \"./BaseCell.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridCellProps } from \"./GridColumn\";\nimport { GridColumnModel } from \"./Grid\";\nimport { Cell, Cursor, useFocusableContent } from \"./internal\";\nimport { CornerTag } from \"./CornerTag\";\n\nconst withBaseName = makePrefixer(\"saltGridBaseCell\");\n\nexport function getCellId<T>(rowKey: string, column: GridColumnModel<T>) {\n return `R${rowKey}C${column.info.props.id}`;\n}\n\n// Default component for grid cells. Provides selection, on-hover highlighting,\n// cursor etc.\nexport function BaseCell<T>(props: GridCellProps<T>) {\n const {\n column,\n className,\n row,\n style,\n isFocused,\n isSelected,\n isEditable,\n children,\n } = props;\n\n const { ref, isFocusableContent, onFocus } =\n useFocusableContent<HTMLTableCellElement>();\n
|
|
1
|
+
{"version":3,"file":"BaseCell.js","sources":["../src/BaseCell.tsx"],"sourcesContent":["import { clsx } from \"clsx\";\nimport \"./BaseCell.css\";\nimport { makePrefixer } from \"@salt-ds/core\";\nimport { GridCellProps } from \"./GridColumn\";\nimport { GridColumnModel } from \"./Grid\";\nimport { Cell, Cursor, useFocusableContent } from \"./internal\";\nimport { CornerTag } from \"./CornerTag\";\nimport {\n CellErrorIcon,\n CellSuccessIcon,\n CellWarningIcon,\n} from \"./internal/CellStatusIcons\";\n\nconst withBaseName = makePrefixer(\"saltGridBaseCell\");\n\nexport function getCellId<T>(rowKey: string, column: GridColumnModel<T>) {\n return `R${rowKey}C${column.info.props.id}`;\n}\n\nconst icons = {\n warning: CellWarningIcon,\n error: CellErrorIcon,\n success: CellSuccessIcon,\n};\n\n// Default component for grid cells. Provides selection, on-hover highlighting,\n// cursor etc.\nexport function BaseCell<T>(props: GridCellProps<T>) {\n const {\n column,\n className,\n row,\n style,\n isFocused,\n isSelected,\n isEditable,\n children,\n validationStatus,\n validationMessage,\n validationType = \"light\",\n align,\n } = props;\n\n const { ref, isFocusableContent, onFocus } =\n useFocusableContent<HTMLTableCellElement>();\n const cellId = getCellId(row.key, column);\n const hasValidation = !!validationStatus;\n const hasValidationMessage = !!validationMessage || hasValidation;\n const validationMessageId = `${cellId}-statusMessage`;\n return (\n <Cell\n ref={ref}\n id={cellId}\n data-row-index={row.index}\n data-column-index={column.index}\n data-testid={isFocused ? \"grid-cell-focused\" : undefined}\n // aria-colindex uses one-based array indexing\n aria-colindex={column.index + 1}\n role=\"gridcell\"\n separator={column.separator}\n isSelected={isSelected}\n isEditable={isEditable}\n className={clsx(className, {\n [withBaseName(\"hasValidation\")]: hasValidation,\n [withBaseName(`status-${validationStatus as string}`)]:\n validationStatus,\n })}\n style={style}\n tabIndex={isFocused && !isFocusableContent ? 0 : -1}\n onFocus={onFocus}\n aria-invalid={validationStatus === \"error\" || undefined}\n aria-describedby={hasValidationMessage ? validationMessageId : undefined}\n >\n {hasValidationMessage ? (\n <div\n id={validationMessageId}\n className=\"salt-visuallyHidden\"\n aria-hidden\n role=\"status\"\n >\n {validationMessage\n ? validationMessage\n : `Cell validation state is ${validationStatus as string}`}\n </div>\n ) : null}\n <div className={clsx(withBaseName(\"valueContainer\"))}>{children}</div>\n {hasValidation && validationType === \"strong\" ? (\n <div\n className={clsx(withBaseName(\"statusContainer\"), {\n [withBaseName(`statusContainer-align-${align as string}`)]: align,\n })}\n >\n {icons[validationStatus]}\n </div>\n ) : null}\n {isFocused && isEditable && <CornerTag focusOnly={true} />}\n {isFocused && !isFocusableContent && <Cursor />}\n </Cell>\n );\n}\n"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import { createContext, useContext } from 'react';
|
|
2
|
+
|
|
3
|
+
const ColumnSortContext = createContext(
|
|
4
|
+
void 0
|
|
5
|
+
);
|
|
6
|
+
const useColumnSortContext = () => {
|
|
7
|
+
const c = useContext(ColumnSortContext);
|
|
8
|
+
if (!c) {
|
|
9
|
+
throw new Error(`useColumnSortContext invoked outside of a Grid`);
|
|
10
|
+
}
|
|
11
|
+
return c;
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
export { ColumnSortContext, useColumnSortContext };
|
|
15
|
+
//# sourceMappingURL=ColumnSortContext.js.map
|