@elliemae/ds-data-table 3.70.0-next.48 → 3.70.0-next.50
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/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +15 -3
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +3 -3
- package/dist/cjs/configs/useStore/useStore.js +27 -0
- package/dist/cjs/configs/useStore/useStore.js.map +2 -2
- package/dist/cjs/constants/index.js +1 -0
- package/dist/cjs/constants/index.js.map +2 -2
- package/dist/cjs/parts/Headers/useHeaderCellHandlers.js +33 -7
- package/dist/cjs/parts/Headers/useHeaderCellHandlers.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +15 -3
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/esm/configs/useStore/useStore.js +27 -0
- package/dist/esm/configs/useStore/useStore.js.map +2 -2
- package/dist/esm/constants/index.js +1 -0
- package/dist/esm/constants/index.js.map +2 -2
- package/dist/esm/parts/Headers/useHeaderCellHandlers.js +33 -7
- package/dist/esm/parts/Headers/useHeaderCellHandlers.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/types/constants/index.d.ts +4 -0
- package/dist/types/react-desc-prop-types.d.ts +5 -0
- package/package.json +30 -30
|
@@ -1,11 +1,21 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { jsx } from "react/jsx-runtime";
|
|
3
|
-
import { useMemo, useRef, useCallback, createRef } from "react";
|
|
4
3
|
import { DSControlledCheckbox } from "@elliemae/ds-form-checkbox";
|
|
4
|
+
import { styled } from "@elliemae/ds-system";
|
|
5
|
+
import { createRef, useCallback, useMemo, useRef } from "react";
|
|
5
6
|
import { uid as genUid } from "uid";
|
|
6
7
|
import { DATA_TESTID } from "../../../configs/constants.js";
|
|
7
8
|
import { useInternalStore, usePropsStore } from "../../../configs/useStore/createInternalAndPropsContext.js";
|
|
9
|
+
import { DSDataTableName, DSDataTableSlots } from "../../../constants/index.js";
|
|
8
10
|
import { updateRangeSelection } from "../../../helpers/multipleSelectRow.js";
|
|
11
|
+
const StyledGlobalCheckboxContainer = styled("span", {
|
|
12
|
+
name: DSDataTableName,
|
|
13
|
+
slot: DSDataTableSlots.GLOBAL_CHECKBOX_CONTAINER
|
|
14
|
+
})`
|
|
15
|
+
display: flex;
|
|
16
|
+
align-items: center;
|
|
17
|
+
min-height: 24px;
|
|
18
|
+
`;
|
|
9
19
|
const multiSelectColumn = {
|
|
10
20
|
// Build our multiSelecter column
|
|
11
21
|
id: "multiSelecter",
|
|
@@ -22,6 +32,8 @@ const multiSelectColumn = {
|
|
|
22
32
|
const firstFocuseableColumnHeaderId = usePropsStore((state) => state.firstFocuseableColumnHeaderId);
|
|
23
33
|
const domIdAffix = usePropsStore((state) => state.domIdAffix);
|
|
24
34
|
const visibleRangeRef = usePropsStore((state) => state.visibleRangeRef);
|
|
35
|
+
const getOwnerProps = usePropsStore((store) => store.get);
|
|
36
|
+
const getOwnerPropsArguments = useCallback(() => ({}), []);
|
|
25
37
|
const dtSelection = selection ?? {};
|
|
26
38
|
const selectionKeyCount = flattenedData.reduce(
|
|
27
39
|
(acc, cur) => (dtSelection[cur.uid] && !disabledRows[cur.uid] ? 1 : 0) + acc,
|
|
@@ -54,7 +66,7 @@ const multiSelectColumn = {
|
|
|
54
66
|
const endCandidate = visibleRangeRef.current.end + visibleRangeRef.current.overscan + 1;
|
|
55
67
|
const end = endCandidate > visibleRangeRef.current.size ? visibleRangeRef.current.size : endCandidate;
|
|
56
68
|
const visibleAriaControls = ariaControls.split(" ").slice(start, end).join(" ");
|
|
57
|
-
return /* @__PURE__ */ jsx(
|
|
69
|
+
return /* @__PURE__ */ jsx(StyledGlobalCheckboxContainer, { getOwnerProps, getOwnerPropsArguments, children: /* @__PURE__ */ jsx(
|
|
58
70
|
DSControlledCheckbox,
|
|
59
71
|
{
|
|
60
72
|
"aria-controls": visibleAriaControls,
|
|
@@ -63,7 +75,7 @@ const multiSelectColumn = {
|
|
|
63
75
|
checked: currentGlobalState,
|
|
64
76
|
onChange: onChangeHandler
|
|
65
77
|
}
|
|
66
|
-
);
|
|
78
|
+
) });
|
|
67
79
|
},
|
|
68
80
|
Cell: ({ cell, row, isRowSelected, domIdAffix = genUid(4) }) => {
|
|
69
81
|
const onSelectionChange = usePropsStore((state) => state.onSelectionChange);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../../scripts/build/transpile/react-shim.js", "../../../../../src/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { styled } from '@elliemae/ds-system';\nimport React, { createRef, useCallback, useMemo, useRef } from 'react';\nimport { uid as genUid } from 'uid';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\nimport { updateRangeSelection } from '../../../helpers/multipleSelectRow.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\n/**\n * Optical wrapper for the select-all checkbox. The header cell top-anchors its content\n * (HeaderCellTitle: align-items flex-start, no padding-top for custom headers), so this\n * min-height:24px + centered box keeps the checkbox vertically centered on the header's\n * first line \u2014 aligned with the column labels and the body row checkboxes \u2014 while still\n * staying top-anchored if the header row grows. Mirrors the expand-all header's wrapper.\n */\nconst StyledGlobalCheckboxContainer = styled('span', {\n name: DSDataTableName,\n slot: DSDataTableSlots.GLOBAL_CHECKBOX_CONTAINER,\n})`\n display: flex;\n align-items: center;\n min-height: 24px;\n`;\n\nexport const multiSelectColumn: DSDataTableT.InternalColumn = {\n // Build our multiSelecter column\n id: 'multiSelecter', // Make sure it has an ID\n Header: () => {\n const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n const selection = usePropsStore((state) => state.selection);\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n const firstFocuseableColumnHeaderId = usePropsStore((state) => state.firstFocuseableColumnHeaderId);\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const visibleRangeRef = usePropsStore((state) => state.visibleRangeRef);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n\n // We for sure have selection, so we just typecast it for TS reasons\n const dtSelection = selection ?? {};\n const selectionKeyCount = flattenedData.reduce(\n (acc, cur) => (dtSelection[cur.uid] && !disabledRows[cur.uid] ? 1 : 0) + acc,\n 0,\n );\n\n const currentGlobalState = useMemo(\n () =>\n selectionKeyCount > 0 && selectionKeyCount < flattenedData.filter((datum) => !disabledRows[datum.uid]).length\n ? 'mixed'\n : selectionKeyCount > 0,\n [selectionKeyCount, flattenedData, disabledRows],\n );\n\n // global state toggling: false to true, mixed to true, true to false\n const newGlobalStateAfterToggle = useMemo(() => currentGlobalState !== true, [currentGlobalState]);\n\n const newSelection: DSDataTableT.Selection = useMemo(() => {\n if (!newGlobalStateAfterToggle) return {};\n\n return allDataFlattened.reduce<DSDataTableT.Selection>((newSelectionObject, datum) => {\n newSelectionObject[datum.uid] = !disabledRows[datum.uid];\n return newSelectionObject;\n }, {});\n }, [newGlobalStateAfterToggle, allDataFlattened, disabledRows]);\n\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n onSelectionChange(newSelection, 'All', e);\n },\n [newSelection, onSelectionChange],\n );\n\n const ariaControls = useMemo(\n () =>\n allDataFlattened\n .map((datum) => `data-table-checkbox-${datum.uid}${domIdAffix ? `-${domIdAffix}` : ''}`)\n .join(' '),\n [allDataFlattened, domIdAffix],\n );\n\n const startCandidate = visibleRangeRef.current.start - visibleRangeRef.current.overscan;\n const start = startCandidate > 0 ? startCandidate : 0;\n const endCandidate = visibleRangeRef.current.end + visibleRangeRef.current.overscan + 1;\n const end = endCandidate > visibleRangeRef.current.size ? visibleRangeRef.current.size : endCandidate;\n const visibleAriaControls = ariaControls.split(' ').slice(start, end).join(' ');\n\n return (\n <StyledGlobalCheckboxContainer getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <DSControlledCheckbox\n aria-controls={visibleAriaControls}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_CHECKBOX}\n aria-label={\n isEmptyContent && firstFocuseableColumnHeaderId === 'multiSelecter'\n ? `${noResultsMessage}. ${\n noResultsSecondaryMessage ? `${noResultsSecondaryMessage}.` : ''\n } Toggle all rows selected`\n : 'Toggle all rows selected'\n }\n checked={currentGlobalState}\n onChange={onChangeHandler}\n />\n </StyledGlobalCheckboxContainer>\n );\n },\n Cell: ({ cell, row, isRowSelected, domIdAffix = genUid(4) }) => {\n const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n const selection = usePropsStore((state) => state.selection);\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const lastSelected = usePropsStore((state) => state.lastSelected);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const checkboxSelectAllProps = usePropsStore((state) => state.checkboxSelectAllProps);\n\n const isShiftPressed = useInternalStore((state) => state.isShiftPressed);\n const setIsShiftPressed = useInternalStore((state) => state.setIsShiftPressed);\n\n const { uid, realIndex } = row;\n const selectedState = selection?.[uid] ?? false;\n const isShiftPressedKeyRef = useRef(false);\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n let newSelection = { ...selection, [uid]: newState }; // we only want true and mixed values\n if (!newState) delete newSelection[uid]; // if newState is false, remove from the new selection\n const now = realIndex;\n if ((isShiftPressed || isShiftPressedKeyRef.current) && lastSelected.current > -1) {\n newSelection = updateRangeSelection(\n newSelection,\n lastSelected.current,\n now,\n flattenedData,\n disabledRows,\n newState,\n );\n }\n lastSelected.current = now;\n onSelectionChange(newSelection, uid, e);\n },\n [selection, uid, realIndex, isShiftPressed, lastSelected, onSelectionChange, flattenedData, disabledRows],\n );\n\n const onKeyDownHandler: React.KeyboardEventHandler = useCallback(\n (e) => {\n setIsShiftPressed(e.code === 'Shift' || e.shiftKey);\n e.stopPropagation();\n },\n [setIsShiftPressed],\n );\n\n const onKeyUpHandler: React.KeyboardEventHandler = useCallback(\n (e) => {\n setIsShiftPressed(false);\n isShiftPressedKeyRef.current = false;\n e.stopPropagation();\n },\n [setIsShiftPressed],\n );\n\n const stopThePropagation = useCallback((e: React.MouseEvent | React.KeyboardEvent) => {\n if (e.shiftKey) {\n isShiftPressedKeyRef.current = true;\n }\n e.stopPropagation();\n }, []);\n\n return (\n <div role=\"presentation\" onClick={stopThePropagation} onKeyDown={onKeyDownHandler} onKeyUp={onKeyUpHandler}>\n <DSControlledCheckbox\n id={`data-table-checkbox-${uid}-${domIdAffix}`}\n data-testid={DATA_TESTID.DATA_TABLE_CHECKBOX}\n aria-label=\"Toggle row selected\"\n checked={selectedState}\n onChange={onChangeHandler}\n disabled={disabledRows[row.uid]}\n innerRef={cell.ref}\n tabIndex={isRowSelected ? 0 : -1}\n {...checkboxSelectAllProps}\n />\n </div>\n );\n },\n textWrap: 'wrap',\n width: 32,\n padding: 7,\n canResize: false,\n isFocuseable: false,\n disableDnD: true,\n parentId: null,\n depth: 0,\n ref: createRef(),\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC+Ff;AA9FR,SAAS,4BAA4B;AACrC,SAAS,cAAc;AACvB,SAAgB,WAAW,aAAa,SAAS,cAAc;AAC/D,SAAS,OAAO,cAAc;AAC9B,SAAS,mBAAmB;AAC5B,SAAS,kBAAkB,qBAAqB;AAChD,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,4BAA4B;AAUrC,MAAM,gCAAgC,OAAO,QAAQ;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,iBAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,oBAAiD;AAAA;AAAA,EAE5D,IAAI;AAAA;AAAA,EACJ,QAAQ,MAAM;AACZ,UAAM,oBAAoB,cAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,eAAe,cAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,mBAAmB,cAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,4BAA4B,cAAc,CAAC,UAAU,MAAM,yBAAyB;AAC1F,UAAM,mBAAmB,cAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,UAAM,gCAAgC,cAAc,CAAC,UAAU,MAAM,6BAA6B;AAClG,UAAM,aAAa,cAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,UAAM,kBAAkB,cAAc,CAAC,UAAU,MAAM,eAAe;AACtE,UAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AACxD,UAAM,yBAAyB,YAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAGzD,UAAM,cAAc,aAAa,CAAC;AAClC,UAAM,oBAAoB,cAAc;AAAA,MACtC,CAAC,KAAK,SAAS,YAAY,IAAI,GAAG,KAAK,CAAC,aAAa,IAAI,GAAG,IAAI,IAAI,KAAK;AAAA,MACzE;AAAA,IACF;AAEA,UAAM,qBAAqB;AAAA,MACzB,MACE,oBAAoB,KAAK,oBAAoB,cAAc,OAAO,CAAC,UAAU,CAAC,aAAa,MAAM,GAAG,CAAC,EAAE,SACnG,UACA,oBAAoB;AAAA,MAC1B,CAAC,mBAAmB,eAAe,YAAY;AAAA,IACjD;AAGA,UAAM,4BAA4B,QAAQ,MAAM,uBAAuB,MAAM,CAAC,kBAAkB,CAAC;AAEjG,UAAM,eAAuC,QAAQ,MAAM;AACzD,UAAI,CAAC,0BAA2B,QAAO,CAAC;AAExC,aAAO,iBAAiB,OAA+B,CAAC,oBAAoB,UAAU;AACpF,2BAAmB,MAAM,GAAG,IAAI,CAAC,aAAa,MAAM,GAAG;AACvD,eAAO;AAAA,MACT,GAAG,CAAC,CAAC;AAAA,IACP,GAAG,CAAC,2BAA2B,kBAAkB,YAAY,CAAC;AAE9D,UAAM,kBAAkB;AAAA,MACtB,CAAC,UAAmB,MAAkE;AACpF,0BAAkB,cAAc,OAAO,CAAC;AAAA,MAC1C;AAAA,MACA,CAAC,cAAc,iBAAiB;AAAA,IAClC;AAEA,UAAM,eAAe;AAAA,MACnB,MACE,iBACG,IAAI,CAAC,UAAU,uBAAuB,MAAM,GAAG,GAAG,aAAa,IAAI,UAAU,KAAK,EAAE,EAAE,EACtF,KAAK,GAAG;AAAA,MACb,CAAC,kBAAkB,UAAU;AAAA,IAC/B;AAEA,UAAM,iBAAiB,gBAAgB,QAAQ,QAAQ,gBAAgB,QAAQ;AAC/E,UAAM,QAAQ,iBAAiB,IAAI,iBAAiB;AACpD,UAAM,eAAe,gBAAgB,QAAQ,MAAM,gBAAgB,QAAQ,WAAW;AACtF,UAAM,MAAM,eAAe,gBAAgB,QAAQ,OAAO,gBAAgB,QAAQ,OAAO;AACzF,UAAM,sBAAsB,aAAa,MAAM,GAAG,EAAE,MAAM,OAAO,GAAG,EAAE,KAAK,GAAG;AAE9E,WACE,oBAAC,iCAA8B,eAA8B,wBAC3D;AAAA,MAAC;AAAA;AAAA,QACC,iBAAe;AAAA,QACf,eAAa,YAAY;AAAA,QACzB,cACE,kBAAkB,kCAAkC,kBAChD,GAAG,gBAAgB,KACjB,4BAA4B,GAAG,yBAAyB,MAAM,EAChE,8BACA;AAAA,QAEN,SAAS;AAAA,QACT,UAAU;AAAA;AAAA,IACZ,GACF;AAAA,EAEJ;AAAA,EACA,MAAM,CAAC,EAAE,MAAM,KAAK,eAAe,aAAa,OAAO,CAAC,EAAE,MAAM;AAC9D,UAAM,oBAAoB,cAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,YAAY,cAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,eAAe,cAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,eAAe,cAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,yBAAyB,cAAc,CAAC,UAAU,MAAM,sBAAsB;AAEpF,UAAM,iBAAiB,iBAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,UAAM,oBAAoB,iBAAiB,CAAC,UAAU,MAAM,iBAAiB;AAE7E,UAAM,EAAE,KAAK,UAAU,IAAI;AAC3B,UAAM,gBAAgB,YAAY,GAAG,KAAK;AAC1C,UAAM,uBAAuB,OAAO,KAAK;AACzC,UAAM,kBAAkB;AAAA,MACtB,CAAC,UAAmB,MAAkE;AACpF,YAAI,eAAe,EAAE,GAAG,WAAW,CAAC,GAAG,GAAG,SAAS;AACnD,YAAI,CAAC,SAAU,QAAO,aAAa,GAAG;AACtC,cAAM,MAAM;AACZ,aAAK,kBAAkB,qBAAqB,YAAY,aAAa,UAAU,IAAI;AACjF,yBAAe;AAAA,YACb;AAAA,YACA,aAAa;AAAA,YACb;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,UACF;AAAA,QACF;AACA,qBAAa,UAAU;AACvB,0BAAkB,cAAc,KAAK,CAAC;AAAA,MACxC;AAAA,MACA,CAAC,WAAW,KAAK,WAAW,gBAAgB,cAAc,mBAAmB,eAAe,YAAY;AAAA,IAC1G;AAEA,UAAM,mBAA+C;AAAA,MACnD,CAAC,MAAM;AACL,0BAAkB,EAAE,SAAS,WAAW,EAAE,QAAQ;AAClD,UAAE,gBAAgB;AAAA,MACpB;AAAA,MACA,CAAC,iBAAiB;AAAA,IACpB;AAEA,UAAM,iBAA6C;AAAA,MACjD,CAAC,MAAM;AACL,0BAAkB,KAAK;AACvB,6BAAqB,UAAU;AAC/B,UAAE,gBAAgB;AAAA,MACpB;AAAA,MACA,CAAC,iBAAiB;AAAA,IACpB;AAEA,UAAM,qBAAqB,YAAY,CAAC,MAA8C;AACpF,UAAI,EAAE,UAAU;AACd,6BAAqB,UAAU;AAAA,MACjC;AACA,QAAE,gBAAgB;AAAA,IACpB,GAAG,CAAC,CAAC;AAEL,WACE,oBAAC,SAAI,MAAK,gBAAe,SAAS,oBAAoB,WAAW,kBAAkB,SAAS,gBAC1F;AAAA,MAAC;AAAA;AAAA,QACC,IAAI,uBAAuB,GAAG,IAAI,UAAU;AAAA,QAC5C,eAAa,YAAY;AAAA,QACzB,cAAW;AAAA,QACX,SAAS;AAAA,QACT,UAAU;AAAA,QACV,UAAU,aAAa,IAAI,GAAG;AAAA,QAC9B,UAAU,KAAK;AAAA,QACf,UAAU,gBAAgB,IAAI;AAAA,QAC7B,GAAG;AAAA;AAAA,IACN,GACF;AAAA,EAEJ;AAAA,EACA,UAAU;AAAA,EACV,OAAO;AAAA,EACP,SAAS;AAAA,EACT,WAAW;AAAA,EACX,cAAc;AAAA,EACd,YAAY;AAAA,EACZ,UAAU;AAAA,EACV,OAAO;AAAA,EACP,KAAK,UAAU;AACjB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -7,6 +7,7 @@ const internalAtomDefaultValues = {
|
|
|
7
7
|
focusedRowId: null,
|
|
8
8
|
isShiftPressed: false,
|
|
9
9
|
reduxHeaders: {},
|
|
10
|
+
hoveredColumnId: null,
|
|
10
11
|
isHeaderCellDragging: false
|
|
11
12
|
};
|
|
12
13
|
const selectors = () => ({});
|
|
@@ -26,6 +27,32 @@ const reducers = (get, set) => ({
|
|
|
26
27
|
[headerId]: { ...state.reduxHeaders?.[headerId] ?? {}, hideFilterMenu: value, hideFilterButton: value }
|
|
27
28
|
}
|
|
28
29
|
}));
|
|
30
|
+
},
|
|
31
|
+
// PUI-15154: a column's own onBlur is supposed to hide its DnD handle/sort caret once focus
|
|
32
|
+
// truly leaves it, but that reset doesn't reliably land when focus moves directly from one
|
|
33
|
+
// column's drag handle to another's (both share the same dnd-kit DndContext/PointerSensor).
|
|
34
|
+
// Rather than depend on every column's blur firing correctly, whichever column newly gains
|
|
35
|
+
// focus proactively clears every other column's focus-derived visibility itself. It must skip
|
|
36
|
+
// state.hoveredColumnId though — hover and focus are independent (a different column can be
|
|
37
|
+
// legitimately hovered by the mouse while this one gains keyboard/click focus), so clearing it
|
|
38
|
+
// here would hide an icon that's still correctly visible under the pointer.
|
|
39
|
+
resetAllHeadersExcept: (exceptHeaderId) => {
|
|
40
|
+
set((state) => {
|
|
41
|
+
const nextReduxHeaders = { ...state.reduxHeaders };
|
|
42
|
+
Object.keys(nextReduxHeaders).forEach((headerId) => {
|
|
43
|
+
if (headerId === exceptHeaderId) return;
|
|
44
|
+
if (headerId === state.hoveredColumnId) return;
|
|
45
|
+
nextReduxHeaders[headerId] = {
|
|
46
|
+
...nextReduxHeaders[headerId],
|
|
47
|
+
hideFilterMenu: true,
|
|
48
|
+
hideFilterButton: true,
|
|
49
|
+
showDnDHandle: false,
|
|
50
|
+
showSortCaret: false,
|
|
51
|
+
withTabStops: false
|
|
52
|
+
};
|
|
53
|
+
});
|
|
54
|
+
return { reduxHeaders: nextReduxHeaders };
|
|
55
|
+
});
|
|
29
56
|
}
|
|
30
57
|
});
|
|
31
58
|
const subscribers = () => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/configs/useStore/useStore.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { type ZustandT } from '@elliemae/ds-zustand-helpers';\nimport { defaultProps, type DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useAutoCalculated } from '../useAutocalculated/index.js';\nimport { InternalProvider, PropsProvider, useInternalStore, usePropsStore } from './createInternalAndPropsContext.js';\n\nconst internalAtomDefaultValues: DSDataTableT.InternalAtoms = {\n drilldownRowId: null,\n focusedRowId: null,\n isShiftPressed: false,\n reduxHeaders: {},\n isHeaderCellDragging: false,\n};\n\nconst selectors: ZustandT.SelectorObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Selectors> = () => ({});\n\nconst reducers: ZustandT.ReducerObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Reducers> = (get, set) => ({\n patchHeader: (headerId, newHeader) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), ...newHeader },\n },\n }));\n },\n patchHeaderFilterButtonAndMenu: (headerId, value) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), hideFilterMenu: value, hideFilterButton: value },\n },\n }));\n },\n});\n\nconst subscribers: ZustandT.Subscribers<DSDataTableT.ShuttleInternalStore> = () => {};\n\nexport const useWholeStore = (): DSDataTableT.Context => {\n const {\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...tableProps\n } = usePropsStore((state) => state);\n\n const internalStore = useInternalStore((state) => state);\n return {\n tableProps,\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...internalStore,\n };\n};\n\nexport const config = {\n defaultProps: defaultProps as () => DSDataTableT.InternalProps,\n internalAtomDefaultValues,\n useAutoCalculated,\n selectors,\n reducers,\n subscribers,\n PropsProvider,\n usePropsStore,\n InternalProvider,\n useInternalStore,\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,oBAAuC;AAChD,SAAS,yBAAyB;AAClC,SAAS,kBAAkB,eAAe,kBAAkB,qBAAqB;AAEjF,MAAM,4BAAwD;AAAA,EAC5D,gBAAgB;AAAA,EAChB,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,cAAc,CAAC;AAAA,EACf,sBAAsB;AACxB;AAEA,MAAM,YAAgG,OAAO,CAAC;AAE9G,MAAM,WAA6F,CAAC,KAAK,SAAS;AAAA,EAChH,aAAa,CAAC,UAAU,cAAc;AACpC,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAI,MAAM,eAAe,QAAQ,KAAK,CAAC,GAAI,GAAG,UAAU;AAAA,MACxE;AAAA,IACF,EAAE;AAAA,EACJ;AAAA,EACA,gCAAgC,CAAC,UAAU,UAAU;AACnD,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAI,MAAM,eAAe,QAAQ,KAAK,CAAC,GAAI,gBAAgB,OAAO,kBAAkB,MAAM;AAAA,MAC1G;AAAA,IACF,EAAE;AAAA,EACJ;AACF;AAEA,MAAM,cAAuE,MAAM;AAAC;AAE7E,MAAM,gBAAgB,MAA4B;AACvD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,cAAc,CAAC,UAAU,KAAK;AAElC,QAAM,gBAAgB,iBAAiB,CAAC,UAAU,KAAK;AACvD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;AAEO,MAAM,SAAS;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { type ZustandT } from '@elliemae/ds-zustand-helpers';\nimport { defaultProps, type DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useAutoCalculated } from '../useAutocalculated/index.js';\nimport { InternalProvider, PropsProvider, useInternalStore, usePropsStore } from './createInternalAndPropsContext.js';\n\nconst internalAtomDefaultValues: DSDataTableT.InternalAtoms = {\n drilldownRowId: null,\n focusedRowId: null,\n isShiftPressed: false,\n reduxHeaders: {},\n hoveredColumnId: null,\n isHeaderCellDragging: false,\n};\n\nconst selectors: ZustandT.SelectorObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Selectors> = () => ({});\n\nconst reducers: ZustandT.ReducerObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Reducers> = (get, set) => ({\n patchHeader: (headerId, newHeader) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), ...newHeader },\n },\n }));\n },\n patchHeaderFilterButtonAndMenu: (headerId, value) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), hideFilterMenu: value, hideFilterButton: value },\n },\n }));\n },\n // PUI-15154: a column's own onBlur is supposed to hide its DnD handle/sort caret once focus\n // truly leaves it, but that reset doesn't reliably land when focus moves directly from one\n // column's drag handle to another's (both share the same dnd-kit DndContext/PointerSensor).\n // Rather than depend on every column's blur firing correctly, whichever column newly gains\n // focus proactively clears every other column's focus-derived visibility itself. It must skip\n // state.hoveredColumnId though \u2014 hover and focus are independent (a different column can be\n // legitimately hovered by the mouse while this one gains keyboard/click focus), so clearing it\n // here would hide an icon that's still correctly visible under the pointer.\n resetAllHeadersExcept: (exceptHeaderId) => {\n set((state) => {\n const nextReduxHeaders = { ...state.reduxHeaders };\n Object.keys(nextReduxHeaders).forEach((headerId) => {\n if (headerId === exceptHeaderId) return;\n if (headerId === state.hoveredColumnId) return;\n nextReduxHeaders[headerId] = {\n ...nextReduxHeaders[headerId],\n hideFilterMenu: true,\n hideFilterButton: true,\n showDnDHandle: false,\n showSortCaret: false,\n withTabStops: false,\n };\n });\n return { reduxHeaders: nextReduxHeaders };\n });\n },\n});\n\nconst subscribers: ZustandT.Subscribers<DSDataTableT.ShuttleInternalStore> = () => {};\n\nexport const useWholeStore = (): DSDataTableT.Context => {\n const {\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...tableProps\n } = usePropsStore((state) => state);\n\n const internalStore = useInternalStore((state) => state);\n return {\n tableProps,\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...internalStore,\n };\n};\n\nexport const config = {\n defaultProps: defaultProps as () => DSDataTableT.InternalProps,\n internalAtomDefaultValues,\n useAutoCalculated,\n selectors,\n reducers,\n subscribers,\n PropsProvider,\n usePropsStore,\n InternalProvider,\n useInternalStore,\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,oBAAuC;AAChD,SAAS,yBAAyB;AAClC,SAAS,kBAAkB,eAAe,kBAAkB,qBAAqB;AAEjF,MAAM,4BAAwD;AAAA,EAC5D,gBAAgB;AAAA,EAChB,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,cAAc,CAAC;AAAA,EACf,iBAAiB;AAAA,EACjB,sBAAsB;AACxB;AAEA,MAAM,YAAgG,OAAO,CAAC;AAE9G,MAAM,WAA6F,CAAC,KAAK,SAAS;AAAA,EAChH,aAAa,CAAC,UAAU,cAAc;AACpC,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAI,MAAM,eAAe,QAAQ,KAAK,CAAC,GAAI,GAAG,UAAU;AAAA,MACxE;AAAA,IACF,EAAE;AAAA,EACJ;AAAA,EACA,gCAAgC,CAAC,UAAU,UAAU;AACnD,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAI,MAAM,eAAe,QAAQ,KAAK,CAAC,GAAI,gBAAgB,OAAO,kBAAkB,MAAM;AAAA,MAC1G;AAAA,IACF,EAAE;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,uBAAuB,CAAC,mBAAmB;AACzC,QAAI,CAAC,UAAU;AACb,YAAM,mBAAmB,EAAE,GAAG,MAAM,aAAa;AACjD,aAAO,KAAK,gBAAgB,EAAE,QAAQ,CAAC,aAAa;AAClD,YAAI,aAAa,eAAgB;AACjC,YAAI,aAAa,MAAM,gBAAiB;AACxC,yBAAiB,QAAQ,IAAI;AAAA,UAC3B,GAAG,iBAAiB,QAAQ;AAAA,UAC5B,gBAAgB;AAAA,UAChB,kBAAkB;AAAA,UAClB,eAAe;AAAA,UACf,eAAe;AAAA,UACf,cAAc;AAAA,QAChB;AAAA,MACF,CAAC;AACD,aAAO,EAAE,cAAc,iBAAiB;AAAA,IAC1C,CAAC;AAAA,EACH;AACF;AAEA,MAAM,cAAuE,MAAM;AAAC;AAE7E,MAAM,gBAAgB,MAA4B;AACvD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI,cAAc,CAAC,UAAU,KAAK;AAElC,QAAM,gBAAgB,iBAAiB,CAAC,UAAU,KAAK;AACvD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;AAEO,MAAM,SAAS;AAAA,EACpB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -18,6 +18,7 @@ const DATA_TABLE_SLOTS = {
|
|
|
18
18
|
RESIZER: "resizer",
|
|
19
19
|
ACTION_CELL: "action-cell",
|
|
20
20
|
EXPAND_CELL_CONTAINER: "expand-cell-container",
|
|
21
|
+
GLOBAL_CHECKBOX_CONTAINER: "global-checkbox-container",
|
|
21
22
|
SINGLE_CELL_CONTAINER: "single-cell-container",
|
|
22
23
|
DRAG_AND_DROP_GRIPPER: "drag-and-drop-gripper",
|
|
23
24
|
TEXT_EDITABLE_CELL_INPUT: "text-editable-cell-input",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/constants/index.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\nimport { legacyDataTestIds } from './legacyToBeDeprecated.js';\n\nexport const DSDataTableName = 'DSDatatable';\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const DATA_TABLE_SLOTS = {\n ROOT: 'root',\n CONTENT_WRAPPER: 'content-wrapper',\n TABLE_WRAPPER: 'table-wrapper',\n PAGINATION_WRAPPER: 'pagination-wrapper',\n TABLE_CONTENT_WRAPPER: 'table-content-wrapper',\n VIRTUAL_LIST_WRAPPER: 'virtual-list-wrapper',\n HEAD_WRAPPER: 'head-wrapper',\n HEAD_TR: 'head-tr',\n HEAD_TH: 'head-th',\n HEAD_RIGHT_ICONS_WRAPPER: 'head-right-icons-wrapper',\n HEADER_CELL_WRAPPER: 'header-cell-wrapper',\n EMPTY_HEADER: 'empty-header',\n RESIZER: 'resizer',\n ACTION_CELL: 'action-cell',\n EXPAND_CELL_CONTAINER: 'expand-cell-container',\n SINGLE_CELL_CONTAINER: 'single-cell-container',\n DRAG_AND_DROP_GRIPPER: 'drag-and-drop-gripper',\n TEXT_EDITABLE_CELL_INPUT: 'text-editable-cell-input',\n FILTER_POPOVER_BUTTON: 'filter-popover-button',\n FILTER_POPOVER_CONTENT: 'filter-popover-content',\n DROP_INDICATOR: 'drop-indicator',\n CELL: 'cell',\n CELL_CONTENT: 'cell-content',\n PENCIL_ICON: 'pencil-icon',\n EDITABLE_CONTAINER: 'editable-container',\n FULLSIZE_GRID: 'fullsize-grid',\n ROW: 'row',\n GROUP_HEADER_CONTAINER: 'group-header-container',\n GROUP_HEADER_TITLE: 'header-title',\n CELL_CONTAINER: 'cells-container',\n TOOLBAR_WRAPPER: 'toolbar-wrapper',\n TOOLBAR_BUTTONS_WRAPPER: 'toolbar-buttons-wrapper',\n TOOLBAR_BUTTON: 'toolbar-button',\n TOOLBAR_POSITION: 'toolbar-position',\n EMPTY_STATE_WRAPPER: 'empty-state-wrapper',\n WARNING_ICON: 'warning-icon',\n EMPTY_PRIMARY_MESSAGE: 'empty-primary-message',\n EMPTY_SECONDARY_MESSAGE: 'empty-secondary-message',\n EMPTY_BUTTON: 'empty-button',\n CENTER_CONTENT_FLEX_WRAPPER: 'center-content-flex-wrapper',\n LOADER_WRAPPER: 'loader-wrapper',\n FILTER_BAR_WRAPPER: 'filter-bar-wrapper',\n FREE_TEXT_SEARCH_FILTER: 'free-text-search-filter',\n FREE_TEXT_SEARCH_WRAPPER: 'free-text-search-wrapper',\n FILTER_POPOVER: 'filter-popover',\n FILTER_BAR_MENU_BUTTON: 'filter-bar-menu-button',\n FILTER_POPOVER_FOOTER: 'filter-popover-footer',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const DATA_TABLE_DATA_TESTID = {\n ...slotObjectToDataTestIds(DSDataTableName, DATA_TABLE_SLOTS),\n /**\n * These data-testid were defined in src/configs/constants.tsx\n * but they were never exposed to consumers in the index.ts file.\n * We are exposing them here for backward compatibility, as they are the ones used in the component implementation.\n *\n */\n ...legacyDataTestIds,\n /**\n * As there is a mix of hardcoded data-testid and the ones auto generated by slot definitions\n * we are overriding the auto generated ones with the hardcoded values for consistency.\n */\n CONTENT_WRAPPER: legacyDataTestIds.DATA_TABLE_CONTENT_WRAPPER,\n TABLE_WRAPPER: legacyDataTestIds.DATA_TABLE_TABLE,\n CELL_CONTAINER: legacyDataTestIds.DATA_TABLE_ROW_CONTENT,\n DRAG_AND_DROP_GRIPPER: legacyDataTestIds.DATA_TABLE_DRAG_HANDLE,\n FREE_TEXT_SEARCH_FILTER: legacyDataTestIds.DATA_TABLE_FILTER_FREE_TEXT_SEARCH,\n FILTER_POPOVER_BUTTON: legacyDataTestIds.DATA_TABLE_FILTER_BUTTON,\n HEAD_TH: legacyDataTestIds.DATA_TABLE_HEADER,\n CELL: legacyDataTestIds.DATA_TABLE_CELL,\n FULLSIZE_GRID: legacyDataTestIds.DATA_TABLE_ROW,\n ROOT: legacyDataTestIds.DATA_TABLE_WRAPPER,\n VIRTUAL_LIST_WRAPPER: legacyDataTestIds.DATA_TABLE_SCROLLABLE_CONTAINER,\n GROUP_HEADER_CONTAINER: legacyDataTestIds.DATA_TABLE_ROW_GROUP_HEADER,\n FILTER_BAR_MENU_BUTTON: legacyDataTestIds.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,\n // This one does not exist in the legacy list, but it was hardcoded in the component definition\n EXPAND_CELL_CONTAINER: 'data-table-row-expand-cell',\n};\n\n// Legacy exports before Dimsum Compliance Task\nexport const DSDataTableSlots = DATA_TABLE_SLOTS;\nexport const DSDataTableDataTestIds = DATA_TABLE_DATA_TESTID;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AACxC,SAAS,yBAAyB;AAE3B,MAAM,kBAAkB;AAGxB,MAAM,mBAAmB;AAAA,EAC9B,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,SAAS;AAAA,EACT,0BAA0B;AAAA,EAC1B,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,aAAa;AAAA,EACb,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,0BAA0B;AAAA,EAC1B,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,cAAc;AAAA,EACd,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,KAAK;AAAA,EACL,wBAAwB;AAAA,EACxB,oBAAoB;AAAA,EACpB,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,uBAAuB;AAAA,EACvB,yBAAyB;AAAA,EACzB,cAAc;AAAA,EACd,6BAA6B;AAAA,EAC7B,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,gBAAgB;AAAA,EAChB,wBAAwB;AAAA,EACxB,uBAAuB;AACzB;AAGO,MAAM,yBAAyB;AAAA,EACpC,GAAG,wBAAwB,iBAAiB,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO5D,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKH,iBAAiB,kBAAkB;AAAA,EACnC,eAAe,kBAAkB;AAAA,EACjC,gBAAgB,kBAAkB;AAAA,EAClC,uBAAuB,kBAAkB;AAAA,EACzC,yBAAyB,kBAAkB;AAAA,EAC3C,uBAAuB,kBAAkB;AAAA,EACzC,SAAS,kBAAkB;AAAA,EAC3B,MAAM,kBAAkB;AAAA,EACxB,eAAe,kBAAkB;AAAA,EACjC,MAAM,kBAAkB;AAAA,EACxB,sBAAsB,kBAAkB;AAAA,EACxC,wBAAwB,kBAAkB;AAAA,EAC1C,wBAAwB,kBAAkB;AAAA;AAAA,EAE1C,uBAAuB;AACzB;AAGO,MAAM,mBAAmB;AACzB,MAAM,yBAAyB;",
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { slotObjectToDataTestIds } from '@elliemae/ds-system';\nimport { legacyDataTestIds } from './legacyToBeDeprecated.js';\n\nexport const DSDataTableName = 'DSDatatable';\n\n// we are naming this with the ${component_name}_slots convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const DATA_TABLE_SLOTS = {\n ROOT: 'root',\n CONTENT_WRAPPER: 'content-wrapper',\n TABLE_WRAPPER: 'table-wrapper',\n PAGINATION_WRAPPER: 'pagination-wrapper',\n TABLE_CONTENT_WRAPPER: 'table-content-wrapper',\n VIRTUAL_LIST_WRAPPER: 'virtual-list-wrapper',\n HEAD_WRAPPER: 'head-wrapper',\n HEAD_TR: 'head-tr',\n HEAD_TH: 'head-th',\n HEAD_RIGHT_ICONS_WRAPPER: 'head-right-icons-wrapper',\n HEADER_CELL_WRAPPER: 'header-cell-wrapper',\n EMPTY_HEADER: 'empty-header',\n RESIZER: 'resizer',\n ACTION_CELL: 'action-cell',\n EXPAND_CELL_CONTAINER: 'expand-cell-container',\n GLOBAL_CHECKBOX_CONTAINER: 'global-checkbox-container',\n SINGLE_CELL_CONTAINER: 'single-cell-container',\n DRAG_AND_DROP_GRIPPER: 'drag-and-drop-gripper',\n TEXT_EDITABLE_CELL_INPUT: 'text-editable-cell-input',\n FILTER_POPOVER_BUTTON: 'filter-popover-button',\n FILTER_POPOVER_CONTENT: 'filter-popover-content',\n DROP_INDICATOR: 'drop-indicator',\n CELL: 'cell',\n CELL_CONTENT: 'cell-content',\n PENCIL_ICON: 'pencil-icon',\n EDITABLE_CONTAINER: 'editable-container',\n FULLSIZE_GRID: 'fullsize-grid',\n ROW: 'row',\n GROUP_HEADER_CONTAINER: 'group-header-container',\n GROUP_HEADER_TITLE: 'header-title',\n CELL_CONTAINER: 'cells-container',\n TOOLBAR_WRAPPER: 'toolbar-wrapper',\n TOOLBAR_BUTTONS_WRAPPER: 'toolbar-buttons-wrapper',\n TOOLBAR_BUTTON: 'toolbar-button',\n TOOLBAR_POSITION: 'toolbar-position',\n EMPTY_STATE_WRAPPER: 'empty-state-wrapper',\n WARNING_ICON: 'warning-icon',\n EMPTY_PRIMARY_MESSAGE: 'empty-primary-message',\n EMPTY_SECONDARY_MESSAGE: 'empty-secondary-message',\n EMPTY_BUTTON: 'empty-button',\n CENTER_CONTENT_FLEX_WRAPPER: 'center-content-flex-wrapper',\n LOADER_WRAPPER: 'loader-wrapper',\n FILTER_BAR_WRAPPER: 'filter-bar-wrapper',\n FREE_TEXT_SEARCH_FILTER: 'free-text-search-filter',\n FREE_TEXT_SEARCH_WRAPPER: 'free-text-search-wrapper',\n FILTER_POPOVER: 'filter-popover',\n FILTER_BAR_MENU_BUTTON: 'filter-bar-menu-button',\n FILTER_POPOVER_FOOTER: 'filter-popover-footer',\n} as const;\n\n// we are naming this with the ${component_name}_data_testid convention to namespace & avoid errors on duplicate exports variables in aggregators\nexport const DATA_TABLE_DATA_TESTID = {\n ...slotObjectToDataTestIds(DSDataTableName, DATA_TABLE_SLOTS),\n /**\n * These data-testid were defined in src/configs/constants.tsx\n * but they were never exposed to consumers in the index.ts file.\n * We are exposing them here for backward compatibility, as they are the ones used in the component implementation.\n *\n */\n ...legacyDataTestIds,\n /**\n * As there is a mix of hardcoded data-testid and the ones auto generated by slot definitions\n * we are overriding the auto generated ones with the hardcoded values for consistency.\n */\n CONTENT_WRAPPER: legacyDataTestIds.DATA_TABLE_CONTENT_WRAPPER,\n TABLE_WRAPPER: legacyDataTestIds.DATA_TABLE_TABLE,\n CELL_CONTAINER: legacyDataTestIds.DATA_TABLE_ROW_CONTENT,\n DRAG_AND_DROP_GRIPPER: legacyDataTestIds.DATA_TABLE_DRAG_HANDLE,\n FREE_TEXT_SEARCH_FILTER: legacyDataTestIds.DATA_TABLE_FILTER_FREE_TEXT_SEARCH,\n FILTER_POPOVER_BUTTON: legacyDataTestIds.DATA_TABLE_FILTER_BUTTON,\n HEAD_TH: legacyDataTestIds.DATA_TABLE_HEADER,\n CELL: legacyDataTestIds.DATA_TABLE_CELL,\n FULLSIZE_GRID: legacyDataTestIds.DATA_TABLE_ROW,\n ROOT: legacyDataTestIds.DATA_TABLE_WRAPPER,\n VIRTUAL_LIST_WRAPPER: legacyDataTestIds.DATA_TABLE_SCROLLABLE_CONTAINER,\n GROUP_HEADER_CONTAINER: legacyDataTestIds.DATA_TABLE_ROW_GROUP_HEADER,\n FILTER_BAR_MENU_BUTTON: legacyDataTestIds.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,\n // This one does not exist in the legacy list, but it was hardcoded in the component definition\n EXPAND_CELL_CONTAINER: 'data-table-row-expand-cell',\n};\n\n// Legacy exports before Dimsum Compliance Task\nexport const DSDataTableSlots = DATA_TABLE_SLOTS;\nexport const DSDataTableDataTestIds = DATA_TABLE_DATA_TESTID;\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,+BAA+B;AACxC,SAAS,yBAAyB;AAE3B,MAAM,kBAAkB;AAGxB,MAAM,mBAAmB;AAAA,EAC9B,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,SAAS;AAAA,EACT,0BAA0B;AAAA,EAC1B,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,aAAa;AAAA,EACb,uBAAuB;AAAA,EACvB,2BAA2B;AAAA,EAC3B,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,0BAA0B;AAAA,EAC1B,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,cAAc;AAAA,EACd,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,KAAK;AAAA,EACL,wBAAwB;AAAA,EACxB,oBAAoB;AAAA,EACpB,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,uBAAuB;AAAA,EACvB,yBAAyB;AAAA,EACzB,cAAc;AAAA,EACd,6BAA6B;AAAA,EAC7B,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,yBAAyB;AAAA,EACzB,0BAA0B;AAAA,EAC1B,gBAAgB;AAAA,EAChB,wBAAwB;AAAA,EACxB,uBAAuB;AACzB;AAGO,MAAM,yBAAyB;AAAA,EACpC,GAAG,wBAAwB,iBAAiB,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO5D,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKH,iBAAiB,kBAAkB;AAAA,EACnC,eAAe,kBAAkB;AAAA,EACjC,gBAAgB,kBAAkB;AAAA,EAClC,uBAAuB,kBAAkB;AAAA,EACzC,yBAAyB,kBAAkB;AAAA,EAC3C,uBAAuB,kBAAkB;AAAA,EACzC,SAAS,kBAAkB;AAAA,EAC3B,MAAM,kBAAkB;AAAA,EACxB,eAAe,kBAAkB;AAAA,EACjC,MAAM,kBAAkB;AAAA,EACxB,sBAAsB,kBAAkB;AAAA,EACxC,wBAAwB,kBAAkB;AAAA,EAC1C,wBAAwB,kBAAkB;AAAA;AAAA,EAE1C,uBAAuB;AACzB;AAGO,MAAM,mBAAmB;AACzB,MAAM,yBAAyB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -42,17 +42,24 @@ const useHeaderCellHandlers = ({
|
|
|
42
42
|
const visibleColumns = usePropsStore((state) => state.visibleColumns);
|
|
43
43
|
const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);
|
|
44
44
|
const patchHeader = useInternalStore((state) => state.patchHeader);
|
|
45
|
+
const resetAllHeadersExcept = useInternalStore((state) => state.resetAllHeadersExcept);
|
|
46
|
+
const hoveredColumnId = useInternalStore((state) => state.hoveredColumnId);
|
|
47
|
+
const setHoveredColumnId = useInternalStore((state) => state.setHoveredColumnId);
|
|
45
48
|
const reduxHeaders = useInternalStore((state) => state.reduxHeaders);
|
|
46
49
|
const reduxHeader = useMemo(() => reduxHeaders[column.id], [reduxHeaders, column]);
|
|
47
50
|
const headerRef = referenceColumn.current;
|
|
48
51
|
const onMouseEnter = useCallback(() => {
|
|
52
|
+
setHoveredColumnId(column.id);
|
|
49
53
|
patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret));
|
|
50
|
-
}, [column.id, hasDnD, hasFilter, patchHeader, reduxHeader, hasSortingCaret]);
|
|
54
|
+
}, [column.id, hasDnD, hasFilter, patchHeader, reduxHeader, hasSortingCaret, setHoveredColumnId]);
|
|
51
55
|
const onMouseLeave = useCallback(() => {
|
|
56
|
+
setHoveredColumnId(
|
|
57
|
+
(currentHoveredColumnId) => currentHoveredColumnId === column.id ? null : currentHoveredColumnId
|
|
58
|
+
);
|
|
52
59
|
if (!headerRef?.contains(document.activeElement)) {
|
|
53
60
|
patchHeader(column.id, buildNextHeader(reduxHeader, false, hasFilter, hasDnD, false));
|
|
54
61
|
}
|
|
55
|
-
}, [column.id, hasDnD, hasFilter, headerRef, patchHeader, reduxHeader]);
|
|
62
|
+
}, [column.id, hasDnD, hasFilter, headerRef, patchHeader, reduxHeader, setHoveredColumnId]);
|
|
56
63
|
const handleSort = useCallback(() => {
|
|
57
64
|
if (column.canSort) {
|
|
58
65
|
onColumnSortChange?.({
|
|
@@ -124,10 +131,12 @@ const useHeaderCellHandlers = ({
|
|
|
124
131
|
resizeHandlerRef.current
|
|
125
132
|
];
|
|
126
133
|
if (e.target === headerRef) {
|
|
134
|
+
resetAllHeadersExcept(column.id);
|
|
127
135
|
patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret));
|
|
128
136
|
setFocusedRowId(null);
|
|
129
137
|
}
|
|
130
138
|
if (possibleTargets.includes(e.target)) {
|
|
139
|
+
resetAllHeadersExcept(column.id);
|
|
131
140
|
patchHeader(column.id, {
|
|
132
141
|
hideFilterButton: !hasFilter,
|
|
133
142
|
showDnDHandle: hasDnD,
|
|
@@ -144,6 +153,7 @@ const useHeaderCellHandlers = ({
|
|
|
144
153
|
hasFilter,
|
|
145
154
|
headerRef,
|
|
146
155
|
patchHeader,
|
|
156
|
+
resetAllHeadersExcept,
|
|
147
157
|
reduxHeader,
|
|
148
158
|
resizeHandlerRef,
|
|
149
159
|
setFocusedRowId,
|
|
@@ -152,13 +162,29 @@ const useHeaderCellHandlers = ({
|
|
|
152
162
|
);
|
|
153
163
|
const onBlur = useCallback(
|
|
154
164
|
(e) => {
|
|
155
|
-
|
|
156
|
-
if (
|
|
157
|
-
if (
|
|
158
|
-
if (
|
|
165
|
+
const { relatedTarget } = e;
|
|
166
|
+
if (relatedTarget && relatedTarget === dragHandleRef.current) return;
|
|
167
|
+
if (relatedTarget && relatedTarget === filterIconRef.current) return;
|
|
168
|
+
if (relatedTarget && relatedTarget === resizeHandlerRef.current) return;
|
|
169
|
+
if (relatedTarget && relatedTarget === sortRef?.current) return;
|
|
170
|
+
if (hoveredColumnId === column.id) {
|
|
171
|
+
patchHeader(column.id, { withTabStops: false });
|
|
172
|
+
return;
|
|
173
|
+
}
|
|
159
174
|
patchHeader(column.id, buildNextHeader(reduxHeader, false, hasFilter, hasDnD, false));
|
|
160
175
|
},
|
|
161
|
-
[
|
|
176
|
+
[
|
|
177
|
+
dragHandleRef,
|
|
178
|
+
filterIconRef,
|
|
179
|
+
resizeHandlerRef,
|
|
180
|
+
sortRef,
|
|
181
|
+
patchHeader,
|
|
182
|
+
column.id,
|
|
183
|
+
reduxHeader,
|
|
184
|
+
hasFilter,
|
|
185
|
+
hasDnD,
|
|
186
|
+
hoveredColumnId
|
|
187
|
+
]
|
|
162
188
|
);
|
|
163
189
|
return { onMouseEnter, onMouseLeave, handleSort, onKeyDown, onBlur, onFocus };
|
|
164
190
|
};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Headers/useHeaderCellHandlers.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-params */\nimport { useCallback, useMemo } from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\ntype UseHeaderCellHandlersType = (args: {\n hasFilter: boolean;\n column: DSDataTableT.InternalColumn;\n hasDnD: boolean;\n dragHandleRef: React.MutableRefObject<HTMLDivElement | null>;\n sortRef: React.MutableRefObject<HTMLButtonElement | null>;\n filterIconRef: React.MutableRefObject<HTMLButtonElement | null>;\n resizeHandlerRef: React.MutableRefObject<HTMLDivElement | null>;\n hasSortingCaret: boolean;\n isDragOverlay?: boolean;\n draggableProps: DSDataTableT.DraggablePropsT;\n referenceColumn: React.MutableRefObject<HTMLDivElement | null>;\n}) => {\n onMouseEnter: React.MouseEventHandler;\n onMouseLeave: React.MouseEventHandler;\n handleSort: React.MouseEventHandler;\n onKeyDown: React.KeyboardEventHandler;\n onFocus: React.FocusEventHandler;\n onBlur: React.FocusEventHandler;\n};\n\n// TODO: reduxHeader was a mistake from the start.\n// Please remove this and make this logic more simple and\n// easy to follow.\nconst buildNextHeader = (\n reduxHeader: DSDataTableT.ReduxHeader,\n value: boolean,\n hasFilter: boolean,\n hasDnD: boolean,\n hasSortingCaret: boolean,\n withTabStops = false,\n) => ({\n hideFilterMenu: true, // Do this to overwrite it if it exists\n ...reduxHeader,\n hideFilterButton: !(hasFilter && value),\n showDnDHandle: hasDnD && value,\n showSortCaret: hasSortingCaret,\n withTabStops,\n});\n\nconst getNextSortedVisibleColumns = (\n visibleColumns: DSDataTableT.InternalColumn[],\n columnId: string,\n isSortedDesc: boolean,\n) => {\n const doit = (columns: DSDataTableT.InternalColumn[]) =>\n columns.map((col) => {\n const newCol = { ...col };\n delete newCol.isSortedDesc;\n if (col.id === columnId) {\n newCol.isSortedDesc = isSortedDesc;\n }\n if (newCol.columns) {\n newCol.columns = doit(newCol.columns);\n }\n return newCol;\n });\n return doit(visibleColumns);\n};\n\nexport const useHeaderCellHandlers: UseHeaderCellHandlersType = ({\n hasFilter,\n column,\n hasDnD,\n dragHandleRef,\n filterIconRef,\n sortRef,\n resizeHandlerRef,\n hasSortingCaret,\n isDragOverlay,\n draggableProps,\n referenceColumn,\n}) => {\n const onColumnSortChange = usePropsStore((state) => state.onColumnSortChange);\n const onColumnSort = usePropsStore((state) => state.onColumnSort);\n const visibleColumns = usePropsStore((state) => state.visibleColumns);\n const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n const patchHeader = useInternalStore((state) => state.patchHeader);\n const reduxHeaders = useInternalStore((state) => state.reduxHeaders);\n\n const reduxHeader = useMemo(() => reduxHeaders[column.id], [reduxHeaders, column]);\n\n const headerRef = referenceColumn.current;\n\n const onMouseEnter: React.MouseEventHandler = useCallback(() => {\n patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret));\n }, [column.id, hasDnD, hasFilter, patchHeader, reduxHeader, hasSortingCaret]);\n\n const onMouseLeave: React.MouseEventHandler = useCallback(() => {\n if (!headerRef?.contains(document.activeElement)) {\n patchHeader(column.id, buildNextHeader(reduxHeader, false, hasFilter, hasDnD, false));\n }\n }, [column.id, hasDnD, hasFilter, headerRef, patchHeader, reduxHeader]);\n\n const handleSort: React.MouseEventHandler = useCallback(() => {\n if (column.canSort) {\n onColumnSortChange?.({\n column: column.id,\n direction: column.isSortedDesc ? 'ASC' : 'DESC',\n });\n onColumnSort(\n getNextSortedVisibleColumns(visibleColumns, column.id, !column.isSortedDesc),\n column.id,\n column.isSortedDesc ? 'ASC' : 'DESC',\n );\n }\n }, [column.canSort, column.id, column.isSortedDesc, onColumnSort, onColumnSortChange, visibleColumns]);\n\n const isActive = draggableProps && draggableProps.active;\n\n const onKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n // we do the same as the draggable rows.\n // we stop the event if the overlay is active\n // main reason is the tab key\n if (isDragOverlay || isActive) {\n e.preventDefault();\n }\n\n if (e.currentTarget !== e.target) return;\n if (e.code === 'ArrowDown' && column.canSort) {\n e.preventDefault();\n onColumnSortChange?.({\n column: column.id,\n direction: 'DESC',\n });\n onColumnSort(getNextSortedVisibleColumns(visibleColumns, column.id, true), column.id, 'DESC');\n } else if (e.code === 'ArrowUp' && column.canSort) {\n e.preventDefault();\n onColumnSortChange?.({\n column: column.id,\n direction: 'ASC',\n });\n onColumnSort(getNextSortedVisibleColumns(visibleColumns, column.id, false), column.id, 'ASC');\n } else if (['Enter', 'Space'].includes(e.code)) {\n patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret, true));\n // Elements don't not yet exist\n setTimeout(() => {\n if (dragHandleRef.current) dragHandleRef.current.focus();\n else if (filterIconRef.current) filterIconRef.current.focus();\n else if (resizeHandlerRef.current) resizeHandlerRef.current.focus();\n else if (sortRef?.current) sortRef.current.focus();\n });\n }\n },\n [\n isDragOverlay,\n isActive,\n column.canSort,\n column.id,\n onColumnSortChange,\n onColumnSort,\n visibleColumns,\n patchHeader,\n reduxHeader,\n hasFilter,\n hasDnD,\n hasSortingCaret,\n dragHandleRef,\n filterIconRef,\n resizeHandlerRef,\n sortRef,\n ],\n );\n\n const onFocus: React.FocusEventHandler = useCallback(\n (e) => {\n // Don't do anything if focus wasn't placed in the element (bubling issues)\n const possibleTargets: (HTMLElement | null)[] = [\n dragHandleRef.current,\n filterIconRef.current,\n resizeHandlerRef.current,\n ];\n if (e.target === headerRef) {\n patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret));\n setFocusedRowId(null);\n }\n\n if (possibleTargets.includes(e.target as HTMLElement | null)) {\n patchHeader(column.id, {\n hideFilterButton: !hasFilter,\n showDnDHandle: hasDnD,\n withTabStops: true,\n });\n setFocusedRowId(null);\n }\n },\n [\n column.id,\n dragHandleRef,\n filterIconRef,\n hasDnD,\n hasFilter,\n headerRef,\n patchHeader,\n reduxHeader,\n resizeHandlerRef,\n setFocusedRowId,\n hasSortingCaret,\n ],\n );\n\n const onBlur: React.FocusEventHandler = useCallback(\n (e) => {\n // Don't do anything if blur was caused by going to a child\n if (e.relatedTarget === dragHandleRef.current) return;\n if (e.relatedTarget === filterIconRef.current) return;\n if (e.relatedTarget === resizeHandlerRef.current) return;\n if (e.relatedTarget === sortRef?.current) return;\n patchHeader(column.id, buildNextHeader(reduxHeader, false, hasFilter, hasDnD, false));\n },\n [dragHandleRef, filterIconRef, resizeHandlerRef, sortRef, patchHeader, column.id, reduxHeader, hasFilter, hasDnD],\n );\n\n return { onMouseEnter, onMouseLeave, handleSort, onKeyDown, onBlur, onFocus };\n};\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,aAAa,eAAe;AAErC,SAAS,kBAAkB,qBAAqB;AAyBhD,MAAM,kBAAkB,CACtB,aACA,OACA,WACA,QACA,iBACA,eAAe,WACX;AAAA,EACJ,gBAAgB;AAAA;AAAA,EAChB,GAAG;AAAA,EACH,kBAAkB,EAAE,aAAa;AAAA,EACjC,eAAe,UAAU;AAAA,EACzB,eAAe;AAAA,EACf;AACF;AAEA,MAAM,8BAA8B,CAClC,gBACA,UACA,iBACG;AACH,QAAM,OAAO,CAAC,YACZ,QAAQ,IAAI,CAAC,QAAQ;AACnB,UAAM,SAAS,EAAE,GAAG,IAAI;AACxB,WAAO,OAAO;AACd,QAAI,IAAI,OAAO,UAAU;AACvB,aAAO,eAAe;AAAA,IACxB;AACA,QAAI,OAAO,SAAS;AAClB,aAAO,UAAU,KAAK,OAAO,OAAO;AAAA,IACtC;AACA,WAAO;AAAA,EACT,CAAC;AACH,SAAO,KAAK,cAAc;AAC5B;AAEO,MAAM,wBAAmD,CAAC;AAAA,EAC/D;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,qBAAqB,cAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,eAAe,cAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,iBAAiB,cAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,kBAAkB,iBAAiB,CAAC,UAAU,MAAM,eAAe;AACzE,QAAM,cAAc,iBAAiB,CAAC,UAAU,MAAM,WAAW;AACjE,QAAM,eAAe,iBAAiB,CAAC,UAAU,MAAM,YAAY;AAEnE,QAAM,cAAc,QAAQ,MAAM,aAAa,OAAO,EAAE,GAAG,CAAC,cAAc,MAAM,CAAC;AAEjF,QAAM,YAAY,gBAAgB;AAElC,QAAM,eAAwC,YAAY,MAAM;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable max-params */\nimport { useCallback, useMemo } from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\ntype UseHeaderCellHandlersType = (args: {\n hasFilter: boolean;\n column: DSDataTableT.InternalColumn;\n hasDnD: boolean;\n dragHandleRef: React.MutableRefObject<HTMLDivElement | null>;\n sortRef: React.MutableRefObject<HTMLButtonElement | null>;\n filterIconRef: React.MutableRefObject<HTMLButtonElement | null>;\n resizeHandlerRef: React.MutableRefObject<HTMLDivElement | null>;\n hasSortingCaret: boolean;\n isDragOverlay?: boolean;\n draggableProps: DSDataTableT.DraggablePropsT;\n referenceColumn: React.MutableRefObject<HTMLDivElement | null>;\n}) => {\n onMouseEnter: React.MouseEventHandler;\n onMouseLeave: React.MouseEventHandler;\n handleSort: React.MouseEventHandler;\n onKeyDown: React.KeyboardEventHandler;\n onFocus: React.FocusEventHandler;\n onBlur: React.FocusEventHandler;\n};\n\n// TODO: reduxHeader was a mistake from the start.\n// Please remove this and make this logic more simple and\n// easy to follow.\nconst buildNextHeader = (\n reduxHeader: DSDataTableT.ReduxHeader,\n value: boolean,\n hasFilter: boolean,\n hasDnD: boolean,\n hasSortingCaret: boolean,\n withTabStops = false,\n) => ({\n hideFilterMenu: true, // Do this to overwrite it if it exists\n ...reduxHeader,\n hideFilterButton: !(hasFilter && value),\n showDnDHandle: hasDnD && value,\n showSortCaret: hasSortingCaret,\n withTabStops,\n});\n\nconst getNextSortedVisibleColumns = (\n visibleColumns: DSDataTableT.InternalColumn[],\n columnId: string,\n isSortedDesc: boolean,\n) => {\n const doit = (columns: DSDataTableT.InternalColumn[]) =>\n columns.map((col) => {\n const newCol = { ...col };\n delete newCol.isSortedDesc;\n if (col.id === columnId) {\n newCol.isSortedDesc = isSortedDesc;\n }\n if (newCol.columns) {\n newCol.columns = doit(newCol.columns);\n }\n return newCol;\n });\n return doit(visibleColumns);\n};\n\nexport const useHeaderCellHandlers: UseHeaderCellHandlersType = ({\n hasFilter,\n column,\n hasDnD,\n dragHandleRef,\n filterIconRef,\n sortRef,\n resizeHandlerRef,\n hasSortingCaret,\n isDragOverlay,\n draggableProps,\n referenceColumn,\n}) => {\n const onColumnSortChange = usePropsStore((state) => state.onColumnSortChange);\n const onColumnSort = usePropsStore((state) => state.onColumnSort);\n const visibleColumns = usePropsStore((state) => state.visibleColumns);\n const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n const patchHeader = useInternalStore((state) => state.patchHeader);\n const resetAllHeadersExcept = useInternalStore((state) => state.resetAllHeadersExcept);\n const hoveredColumnId = useInternalStore((state) => state.hoveredColumnId);\n const setHoveredColumnId = useInternalStore((state) => state.setHoveredColumnId);\n const reduxHeaders = useInternalStore((state) => state.reduxHeaders);\n\n const reduxHeader = useMemo(() => reduxHeaders[column.id], [reduxHeaders, column]);\n\n const headerRef = referenceColumn.current;\n\n const onMouseEnter: React.MouseEventHandler = useCallback(() => {\n // PUI-15154: tracked separately from reduxHeader's own fields \u2014 see resetAllHeadersExcept in\n // useStore.tsx for why hover identity can't be folded into the same per-column booleans focus\n // writes to.\n setHoveredColumnId(column.id);\n patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret));\n }, [column.id, hasDnD, hasFilter, patchHeader, reduxHeader, hasSortingCaret, setHoveredColumnId]);\n\n const onMouseLeave: React.MouseEventHandler = useCallback(() => {\n setHoveredColumnId((currentHoveredColumnId) =>\n currentHoveredColumnId === column.id ? null : currentHoveredColumnId,\n );\n if (!headerRef?.contains(document.activeElement)) {\n patchHeader(column.id, buildNextHeader(reduxHeader, false, hasFilter, hasDnD, false));\n }\n }, [column.id, hasDnD, hasFilter, headerRef, patchHeader, reduxHeader, setHoveredColumnId]);\n\n const handleSort: React.MouseEventHandler = useCallback(() => {\n if (column.canSort) {\n onColumnSortChange?.({\n column: column.id,\n direction: column.isSortedDesc ? 'ASC' : 'DESC',\n });\n onColumnSort(\n getNextSortedVisibleColumns(visibleColumns, column.id, !column.isSortedDesc),\n column.id,\n column.isSortedDesc ? 'ASC' : 'DESC',\n );\n }\n }, [column.canSort, column.id, column.isSortedDesc, onColumnSort, onColumnSortChange, visibleColumns]);\n\n const isActive = draggableProps && draggableProps.active;\n\n const onKeyDown: React.KeyboardEventHandler = useCallback(\n (e) => {\n // we do the same as the draggable rows.\n // we stop the event if the overlay is active\n // main reason is the tab key\n if (isDragOverlay || isActive) {\n e.preventDefault();\n }\n\n if (e.currentTarget !== e.target) return;\n if (e.code === 'ArrowDown' && column.canSort) {\n e.preventDefault();\n onColumnSortChange?.({\n column: column.id,\n direction: 'DESC',\n });\n onColumnSort(getNextSortedVisibleColumns(visibleColumns, column.id, true), column.id, 'DESC');\n } else if (e.code === 'ArrowUp' && column.canSort) {\n e.preventDefault();\n onColumnSortChange?.({\n column: column.id,\n direction: 'ASC',\n });\n onColumnSort(getNextSortedVisibleColumns(visibleColumns, column.id, false), column.id, 'ASC');\n } else if (['Enter', 'Space'].includes(e.code)) {\n patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret, true));\n // Elements don't not yet exist\n setTimeout(() => {\n if (dragHandleRef.current) dragHandleRef.current.focus();\n else if (filterIconRef.current) filterIconRef.current.focus();\n else if (resizeHandlerRef.current) resizeHandlerRef.current.focus();\n else if (sortRef?.current) sortRef.current.focus();\n });\n }\n },\n [\n isDragOverlay,\n isActive,\n column.canSort,\n column.id,\n onColumnSortChange,\n onColumnSort,\n visibleColumns,\n patchHeader,\n reduxHeader,\n hasFilter,\n hasDnD,\n hasSortingCaret,\n dragHandleRef,\n filterIconRef,\n resizeHandlerRef,\n sortRef,\n ],\n );\n\n const onFocus: React.FocusEventHandler = useCallback(\n (e) => {\n // Don't do anything if focus wasn't placed in the element (bubling issues)\n const possibleTargets: (HTMLElement | null)[] = [\n dragHandleRef.current,\n filterIconRef.current,\n resizeHandlerRef.current,\n ];\n if (e.target === headerRef) {\n // PUI-15154: proactively clear every other column's stuck DnD handle/sort caret \u2014 see\n // resetAllHeadersExcept in useStore.tsx for why this can't rely solely on the previous\n // column's own onBlur.\n resetAllHeadersExcept(column.id);\n patchHeader(column.id, buildNextHeader(reduxHeader, true, hasFilter, hasDnD, hasSortingCaret));\n setFocusedRowId(null);\n }\n\n if (possibleTargets.includes(e.target as HTMLElement | null)) {\n resetAllHeadersExcept(column.id);\n patchHeader(column.id, {\n hideFilterButton: !hasFilter,\n showDnDHandle: hasDnD,\n withTabStops: true,\n });\n setFocusedRowId(null);\n }\n },\n [\n column.id,\n dragHandleRef,\n filterIconRef,\n hasDnD,\n hasFilter,\n headerRef,\n patchHeader,\n resetAllHeadersExcept,\n reduxHeader,\n resizeHandlerRef,\n setFocusedRowId,\n hasSortingCaret,\n ],\n );\n\n const onBlur: React.FocusEventHandler = useCallback(\n (e) => {\n // PUI-15154: don't do anything if blur was caused by going to a child \u2014 but only when\n // relatedTarget is a real element. When focus leaves with nowhere specific to land (a click\n // on a non-focusable area, or Tab past the last focusable element), relatedTarget is null.\n // Any of these refs is null too whenever that control isn't rendered for this column (e.g.\n // filterIconRef when the column has no filter \u2014 FilterMapItem renders null). Comparing with\n // plain === then false-matches null against null and skips the reset, leaving the DnD handle\n // and sort caret visibly stuck even though focus genuinely left the header.\n const { relatedTarget } = e;\n if (relatedTarget && relatedTarget === dragHandleRef.current) return;\n if (relatedTarget && relatedTarget === filterIconRef.current) return;\n if (relatedTarget && relatedTarget === resizeHandlerRef.current) return;\n if (relatedTarget && relatedTarget === sortRef?.current) return;\n // PUI-15154: if the mouse is still hovering this same column, don't hide its hover-driven\n // visibility just because focus left it \u2014 only the focus-derived tab-stop state resets.\n // showDnDHandle/showSortCaret stay as hover set them.\n if (hoveredColumnId === column.id) {\n patchHeader(column.id, { withTabStops: false });\n return;\n }\n patchHeader(column.id, buildNextHeader(reduxHeader, false, hasFilter, hasDnD, false));\n },\n [\n dragHandleRef,\n filterIconRef,\n resizeHandlerRef,\n sortRef,\n patchHeader,\n column.id,\n reduxHeader,\n hasFilter,\n hasDnD,\n hoveredColumnId,\n ],\n );\n\n return { onMouseEnter, onMouseLeave, handleSort, onKeyDown, onBlur, onFocus };\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { uid } from 'uid';\nimport type { Range, useVirtual } from 'react-virtual/types';\nimport type { ZustandT } from '@elliemae/ds-zustand-helpers';\nimport type { DSPaginationT } from '@elliemae/ds-pagination';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DnDKitTree, useSortable } from '@elliemae/ds-drag-and-drop';\nimport type { DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport type { DSComboboxT } from '@elliemae/ds-form-combobox';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n type DSPropTypesSchema,\n type ValidationMap,\n} from '@elliemae/ds-props-helpers';\nimport { FILTER_TYPES } from './exported-related/index.js';\nimport { type DropIndicatorPosition, ColsLayoutStyle, ResizerA11yMode } from './configs/constants.js';\nimport { DSDataTableName, DSDataTableSlots } from './constants/index.js';\nexport namespace DSDataTableT {\n // ===========================================================================\n // Typescript definition for auxiliary types\n // ===========================================================================\n type PropsT<D, R, O> = Partial<D> & R & O;\n\n type InternalPropsT<D, R, O> = D & R & O;\n\n // ===========================================================================\n // Typescript definition for zustand store\n // ===========================================================================\n\n export type InternalAtoms = {\n drilldownRowId: string | null;\n focusedRowId: string | null;\n isShiftPressed: boolean;\n reduxHeaders: Record<string, ReduxHeader>;\n isHeaderCellDragging: boolean;\n };\n export type UseAutoCalculatedT = {\n /**\n * visibleRangeRef: React.MutableRefObject<Range>\n * We can use this ref to get the visible range of the virtual list\n * taking in consideration the end-start and overscan.\n */\n visibleRangeRef: React.MutableRefObject<Range>;\n columnHeaderRef: React.MutableRefObject<HTMLDivElement | null>;\n columnHeaderCallbackRef: (node: HTMLDivElement | null) => void;\n /** Sticky header height (px) \u2014 drives both useVirtual paddingStart and the scroll container's scroll-padding-top (PUI-18626). */\n headerHeightPx: number;\n virtualListRef: React.MutableRefObject<HTMLDivElement | null>;\n flattenedData: InternalRow[];\n allDataFlattened: InternalRow[];\n isEmptyContent: boolean;\n firstFocuseableColumnHeaderId: string | undefined;\n visibleColumns: InternalColumn[];\n virtualListHelpers: ReturnType<typeof useVirtual>;\n layoutHelpers: {\n totalColumnsWidth: number | string;\n gridLayout: string[];\n };\n paginationHelpers: Pagination;\n lastSelected: React.MutableRefObject<number>;\n bodyClientWidth: number | string;\n setBodyClientWidth: React.Dispatch<React.SetStateAction<number | string>>;\n };\n export type Selectors = Record<string, never>;\n export type Reducers = {\n patchHeader: (headerId: string, newHeader: Partial<ReduxHeader>) => void;\n patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n };\n export type ShuttleInternalStore = ZustandT.InternalStore<InternalAtoms, Selectors, Reducers>;\n\n // ===========================================================================\n // Typescript definition for data table related things\n // ===========================================================================\n\n export interface Filter {\n id: string;\n type: string;\n value: unknown;\n }\n\n export type FilterFn<T> = (unfilteredData: Row[], filterKey: string, filterValue: T) => Row[];\n export type FilterFnOutOfTheBoxCurrencyRange = DSDataTableT.FilterFn<{ from: string; to: string }>;\n export type FilterFnOutOfTheBoxDateRange = DSDataTableT.FilterFn<{ startDate: string; endDate: string }>;\n export type FilterFnOutOfTheBoxDateSwitcher = DSDataTableT.FilterFn<{\n startDate: string;\n endDate: string;\n isDateRange: boolean;\n }>;\n export type FilterFnOutOfTheBoxMultiSelect = DSDataTableT.FilterFn<{ label: string; value: string }[]>;\n export type FilterFnOutOfTheBoxNumberRange = DSDataTableT.FilterFn<{ from?: number; to?: number }>;\n export type FilterFnOutOfTheBoxSingleDate = DSDataTableT.FilterFn<string>;\n export type FilterFnOutOfTheBoxSingleSelect = DSDataTableT.FilterFn<{ label: string; value: string }>;\n export type FilterFnOutOfTheBoxFreeTextSearch = DSDataTableT.FilterFn<string>;\n export interface FilterItemProps {\n column: InternalColumn;\n filters: Filter[];\n onFiltersChange: (filters: Filter[]) => void;\n reduxHeader: ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n referenceColumn?: HTMLDivElement | null;\n }\n\n export interface FilterProps<T> {\n column: InternalColumn;\n referenceColumn?: HTMLDivElement | null;\n onValueChange: (type: string, value: T | undefined) => void;\n patchHeaderFilterButtonAndMenu: (headerId: string, newState: boolean) => void;\n patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n filterValue: T;\n reduxHeader: ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n domIdAffix?: string;\n }\n\n export interface FilterPillProps<T> {\n columnHeader: string;\n column: string;\n value: T;\n filters: Filter[];\n onFiltersChange: (filters: Filter[]) => void;\n prevRef?: React.RefObject<HTMLElement>;\n innerRef: React.RefObject<HTMLElement>;\n nextRef?: React.RefObject<HTMLElement>;\n onPillRemove?: (remove: () => void) => void;\n }\n\n export interface ReduxHeader {\n hideFilterMenu?: boolean;\n hideFilterButton?: boolean;\n showDnDHandle?: boolean;\n withTabStops?: boolean;\n showSortCaret?: boolean;\n }\n\n export type SelectionItem = boolean | 'mixed';\n\n export type Selection = Record<string | number, SelectionItem>;\n\n export type UniqueRowAccessorType = string | string[] | ((row: Row) => string) | undefined;\n\n export interface SortBy {\n id: string;\n desc: boolean;\n }\n\n export interface Pagination extends DSPaginationT.Props {\n hasPagination: boolean;\n pageIndex?: number;\n canPreviousPage?: boolean;\n canNextPage?: boolean;\n pageSize?: number;\n dataIsPage?: boolean;\n showPerPageSelector?: boolean;\n perPageOptions?: number[];\n perPageStep?: number;\n minPerPage?: number;\n maxPerPage?: number;\n onPageSizeChange?: (pageSize: number) => void;\n onPreviousPage?: () => void;\n onNextPage?: () => void;\n onPageChange?: (page: number) => void;\n pageCount?: number | string;\n isLoadingPageCount?: boolean;\n pageDetails?: string[];\n pageDetailsTitle?: string;\n }\n\n export type RowVariant = 'ds-header-group-row' | 'ds-primary-row' | 'ds-secondary-row';\n\n export interface RenderRowActionsConfig {\n columnWidth: number;\n renderer: React.ComponentType<CellProps>;\n }\n\n export type RenderRowActions = false | RenderRowActionsConfig;\n\n export type DropIndicatorPositionValues = TypescriptHelpersT.ObjectValues<typeof DropIndicatorPosition>;\n\n export type ColsLayoutStyleValues = TypescriptHelpersT.ObjectValues<typeof ColsLayoutStyle>;\n\n export type ResizerA11yModeValues = TypescriptHelpersT.ObjectValues<typeof ResizerA11yMode>;\n\n export type DraggablePropsT =\n | false\n | (ReturnType<typeof useSortable> & {\n dropIndicatorPosition: DropIndicatorPositionValues;\n shouldShowDropIndicatorPosition: boolean;\n isDropValid: boolean;\n });\n\n export type FilterOptionT = DSComboboxT.Props['allOptions'][number];\n export type EditOptionT = DSComboboxT.Props['allOptions'][number];\n\n // ===========================================================================\n // Typescript definition for the row and columns\n // ===========================================================================\n\n export interface Row {\n [key: string]: unknown;\n id: string;\n subRows?: Row[];\n tableRowDetails?: React.ComponentType<DetailsProps>;\n dimsumHeaderValue?: string;\n }\n export interface EditableCellProps<T extends HTMLElement = HTMLElement> extends CellProps<T> {\n DefaultCellRender: JSX.Element;\n }\n\n export interface Column {\n id?: string;\n Header: string | React.ComponentType<HeaderProps>;\n accessor?: string;\n filter?: string;\n filterOptions?: FilterOptionT[] | (() => FilterOptionT[]);\n disableFirstOptionFocusOnFilter?: boolean;\n editOptions?: EditOptionT[] | (() => EditOptionT[]);\n filterMinWidth?: number | string;\n Filter?: React.ComponentType<FilterProps<unknown>>;\n Cell?: React.ComponentType<CellRendererProps>;\n editable?: string | React.ComponentType<EditableCellProps>;\n disableDnD?: boolean;\n width?: number;\n minWidth?: number;\n maxWidth?: number;\n padding?: number;\n columns?: Column[];\n canSort?: boolean;\n isSortedDesc?: boolean;\n canResize?: boolean;\n isFocuseable?: boolean;\n textWrap?: 'wrap' | 'wrap-all' | 'truncate';\n pillLabel?: string;\n ref?: React.MutableRefObject<HTMLTableColElement | null>;\n required?: boolean;\n cellStyle?: React.CSSProperties;\n alwaysDisplayEditIcon?: boolean;\n }\n\n // ===========================================================================\n // Typescript definition for the internal representation of the row and columns\n // ===========================================================================\n\n export interface InternalRow {\n id: string;\n uid: string;\n index: number;\n realIndex: number;\n parent: InternalRow | null;\n parentId: string | null;\n parentIndex: number | null;\n depth: number;\n isExpanded: boolean;\n subRows: Row[];\n childrenCount: number;\n original: Row;\n cells: Cell[];\n }\n\n export interface InternalColumn extends Column {\n index?: number;\n id: string;\n parentId: string | null;\n depth: number;\n ref: React.MutableRefObject<HTMLTableColElement | null>;\n columns?: InternalColumn[];\n persistFilterInputAfterSubmit?: boolean;\n }\n\n // ===========================================================================\n // Typescript definition for the internal representation of the cell\n // ===========================================================================\n\n export interface CellRendererProps {\n row: InternalRow;\n column: InternalColumn;\n cell: Cell;\n isRowSelected: boolean;\n isDragOverlay: boolean;\n shouldAddExpandCell: boolean;\n // cellIsNextToExpander: boolean;\n isDisabledRow?: boolean;\n draggableProps?: DraggablePropsT;\n domIdAffix?: string;\n }\n\n export interface Cell<T extends HTMLElement = HTMLElement> {\n column: InternalColumn;\n value: unknown;\n render: React.ComponentType<CellRendererProps>;\n row: InternalRow;\n ref: React.MutableRefObject<T | null>;\n id: string;\n }\n\n // ===========================================================================\n // Typescript definition for all component props\n // ===========================================================================\n\n export interface HeaderProps {\n column: InternalColumn;\n draggableProps: DraggablePropsT;\n }\n\n export interface CellProps<T extends HTMLElement = HTMLElement> {\n row: InternalRow;\n column: InternalColumn;\n cell: Cell<T>;\n domIdAffix?: string;\n isRowSelected: boolean;\n isDragOverlay: boolean;\n shouldAddExpandCell: boolean;\n cellIsNextToExpander: boolean;\n isDisabledRow?: boolean;\n draggableProps?: DraggablePropsT;\n }\n\n export interface DetailsProps {\n detailsIndent: number;\n row: InternalRow;\n }\n export interface RowVariantProps {\n row: DSDataTableT.InternalRow;\n itemIndex: number;\n isDragOverlay: boolean;\n focusedRowId: string | null;\n drilldownRowId: string | null;\n }\n\n // ===========================================================================\n // Typescript definition for the React Context\n // ===========================================================================\n\n export interface Context {\n tableProps: InternalProps;\n columnHeaderRef: React.MutableRefObject<HTMLDivElement | null>;\n virtualListRef: React.MutableRefObject<HTMLDivElement | null>;\n flattenedData: InternalRow[];\n allDataFlattened: InternalRow[];\n isEmptyContent: boolean;\n firstFocuseableColumnHeaderId: string | undefined;\n visibleColumns: InternalColumn[];\n virtualListHelpers: ReturnType<typeof useVirtual>;\n layoutHelpers: {\n totalColumnsWidth: number | string;\n gridLayout: string[];\n };\n paginationHelpers: Pagination;\n drilldownRowId: string | null;\n setDrilldownRowId: React.Dispatch<React.SetStateAction<string | null>>;\n focusedRowId: string | null;\n setFocusedRowId: React.Dispatch<React.SetStateAction<string | null>>;\n reduxHeaders: Record<string, ReduxHeader>;\n patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n isShiftPressed: boolean;\n setIsShiftPressed: React.Dispatch<React.SetStateAction<boolean>>;\n lastSelected: React.MutableRefObject<number>;\n isHeaderCellDragging: boolean;\n setIsHeaderCellDragging: React.Dispatch<React.SetStateAction<boolean>>;\n }\n\n export interface DefaultProps {\n height: string;\n width: string;\n renderRowActions: false | RenderRowActionsConfig;\n getRowVariant: (\n row: InternalRow,\n defaultCellRenderer: React.ComponentType<{\n row: DSDataTableT.InternalRow;\n isRowSelected: boolean;\n isDragOverlay: boolean;\n }>,\n ) => RowVariant | React.ComponentType<RowVariantProps>;\n withFilterBar: boolean;\n isExpandable: boolean;\n expandedRows: Record<string, boolean>;\n disabledRows: Record<string, boolean>;\n isResizeable: boolean;\n isLoading: boolean;\n pagination: false | Pagination;\n filters: Filter[];\n colsLayoutStyle: ColsLayoutStyleValues;\n resizerA11yMode: ResizerA11yModeValues;\n hiddenColumns: string[];\n noResultsMessage: string;\n dragAndDropRows: boolean;\n maxDragAndDropLevel: number;\n onRowsReorder: (\n newData: Row[],\n indexes: { targetIndex: number; fromIndex: number },\n considerExpanding: string | null,\n extraData: { flattenedData: InternalRow[]; allDataFlattened: InternalRow[] },\n ) => void;\n dragAndDropColumns: boolean;\n onColumnsReorder: (newData: Column[], indexes: { targetIndex: number; fromIndex: number }) => void;\n getIsDropValid: (\n active: DnDKitTree.Item<Row>,\n over: DnDKitTree.Item<Row>,\n dropIndicatorPosition: DropIndicatorPositionValues,\n ) => boolean;\n onColumnResize: (headerId: string, width: number) => void;\n onColumnSizeChange: (newColumns: Column[], headerId: string, width: number) => void;\n onRowClick: TypescriptHelpersT.GenericFunc;\n onRowFocus: TypescriptHelpersT.GenericFunc;\n noSelectionColumn: boolean;\n selectSingle: boolean;\n onSelectionChange: (\n newSelection: Selection,\n selectedControl: string,\n event: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent,\n ) => void;\n textWrap: 'wrap' | 'wrap-all' | 'truncate';\n onCellValueChange: (cellChange: { value: unknown; property: unknown; rowIndex: number }) => void;\n onFiltersChange: TypescriptHelpersT.GenericFunc;\n onPageChanged: TypescriptHelpersT.GenericFunc;\n onRowExpand: (expandedRows: Record<string, boolean>, toggledRow: string) => void;\n onColumnSortChange: (newSortRequest: { column: unknown; direction: unknown }) => void;\n onColumnSort: (newColumns: Column[], headerId: string, direction: 'ASC' | 'DESC') => void;\n isSkeleton: boolean;\n domIdAffix?: string;\n }\n export interface OptionalProps\n extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSDataTableName, typeof DSDataTableSlots> {\n uniqueRowAccessor?: UniqueRowAccessorType;\n cellRendererProps?: Record<string, unknown>;\n selection?: Selection;\n groupedRowsRenderHeader?:\n | ((dimsumHeaderValue: string | undefined, subRows: Row[] | undefined) => JSX.Element)\n | string;\n filterBarProps?: {\n filterBarAddonRenderer?: React.ComponentType<{ innerRef: React.MutableRefObject<HTMLButtonElement | null> }>;\n customPillRenderer?: React.ComponentType<FilterPillProps<unknown>>;\n onClearAllFiltersClick?: () => void;\n onDropdownMenuToggle?: (isOpen: boolean, eventType: string) => void;\n onDropdownMenuClickOutside?: () => void;\n onDropdownMenuTriggerClick?: () => void;\n isDropdownMenuOpen?: boolean;\n extraOptions?: { type: string; id: string; label: string; onClick?: TypescriptHelpersT.GenericFunc }[];\n };\n actionRef?: React.MutableRefObject<{\n scrollToIndex: ReturnType<typeof useVirtual>['scrollToIndex'];\n scrollToOffset: ReturnType<typeof useVirtual>['scrollToOffset'];\n }>;\n noResultsSecondaryMessage?: string;\n noResultsButtonLabel?: string;\n noResultsPlaceholder?: React.ReactElement;\n onNoResultsButtonClick?: TypescriptHelpersT.GenericFunc;\n onTableResize?: TypescriptHelpersT.GenericFunc;\n Pagination?: React.ComponentType<Record<string, never>>;\n getAriaLabelForRow?: (args: {\n row: InternalRow;\n selected: boolean;\n disabled: boolean;\n expandable: boolean;\n expanded: boolean;\n }) => string;\n checkboxSelectAllProps?: DSControlledCheckboxT.Props;\n }\n export interface RequiredProps {\n columns: Column[];\n data: Row[];\n }\n\n export type Props = PropsT<DefaultProps, RequiredProps, OptionalProps>;\n\n export type InternalProps = InternalPropsT<DefaultProps, RequiredProps, OptionalProps>;\n\n export type GetOwnerPropsT = () => ZustandT.PropsStore<\n DefaultProps & RequiredProps & OptionalProps & UseAutoCalculatedT\n >;\n}\n\n// default props is a function to ensure that the uid is unique for each instance of the component\n// this is supported by the useMemoMergePropsWithDefault function.\nexport const defaultProps: () => DSDataTableT.DefaultProps = () => ({\n height: '100%',\n width: '100%',\n renderRowActions: false,\n getRowVariant: () => 'ds-primary-row',\n isExpandable: false,\n expandedRows: {},\n disabledRows: {},\n isResizeable: false,\n isLoading: false,\n pagination: false,\n withFilterBar: false,\n filters: [],\n getIsDropValid: () => true,\n onColumnResize: () => null,\n onColumnSortChange: () => null,\n colsLayoutStyle: ColsLayoutStyle.Fixed,\n resizerA11yMode: ResizerA11yMode.Separator,\n hiddenColumns: [],\n noResultsMessage: 'No Results Found',\n dragAndDropRows: false,\n maxDragAndDropLevel: 1,\n onRowsReorder: () => null,\n dragAndDropColumns: false,\n onColumnsReorder: () => null,\n onColumnSizeChange: () => null,\n onRowClick: () => null,\n onRowFocus: () => null,\n noSelectionColumn: false,\n selectSingle: false,\n onSelectionChange: () => null,\n textWrap: 'wrap',\n onCellValueChange: () => null,\n onFiltersChange: () => null,\n onPageChanged: () => null,\n onRowExpand: () => null,\n onColumnSort: () => null,\n isSkeleton: false,\n domIdAffix: uid(8),\n});\n\nexport const DSDataTablePropTypes: DSPropTypesSchema<DSDataTableT.Props> = {\n ...getPropsPerSlotPropTypes(DSDataTableName, DSDataTableSlots),\n columns: PropTypes.arrayOf(\n PropTypes.shape({\n Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.node]).description(\n 'Header name or component',\n ).isRequired,\n accessor: PropTypes.string.description('The entry of the data that this column will display'),\n id: PropTypes.string.description('The id of the column, will default to the Header or accessor if not present'),\n filter: PropTypes.oneOf(Object.values(FILTER_TYPES)).description('out-of-the-box filters'),\n Filter: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).description(\n 'The custom component to render as a filter',\n ),\n Cell: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('The custom cell renderer component'),\n editable: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.node]).description(\n 'The editable out-of-the-box or component to render',\n ),\n disableDnD: PropTypes.bool.description('Whereas this column should be draggable'),\n canResize: PropTypes.bool.description('Whereas this column should be resizable'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of this column'),\n minWidth: PropTypes.number.description(\n 'Minimum width this column can be resized down to. Defaults to 30px, which is NOT guaranteed to fit the header title and icon affordances (drag handle / filter / sort) enabled on this column. When isResizeable is used, pass an explicit minWidth sized to the actual header content \u2014 otherwise the resize handle can overlap the header title.',\n ),\n maxWidth: PropTypes.number.description(\n 'Maximum width this column can be resized up to, useful when resizing. Defaults to 600px.',\n ),\n canSort: PropTypes.bool.description('Whereas this column is sortable'),\n disableFirstOptionFocusOnFilter: PropTypes.bool.description(\n 'Whereas the first option should not be focused on filter',\n ),\n filterMinWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n 'Minimum width of the filter',\n ),\n filterOptions: PropTypes.arrayOf(\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.string,\n label: PropTypes.string,\n }),\n ).description('Filter options'),\n isSortedDesc: PropTypes.bool.description('Whereas this column is sorted descendingly'),\n required: PropTypes.bool.description('Whereas this column is required'),\n alwaysDisplayEditIcon: PropTypes.bool.description(\n 'Whereas to always show the edit icon on this column if it is editable',\n ),\n textWrap: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']).description('How to wrap the text in the column'),\n pillLabel: PropTypes.string.description(\n 'Overrides the filter pill label text for this column when non-empty; defaults to the column Header',\n ),\n }),\n ).description('Array of columns').isRequired,\n data: PropTypes.arrayOf(\n PropTypes.shape({\n tableRowDetails: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).description('Component for row details'),\n dimsumHeaderValue: PropTypes.string.description('Header displayed on the header variant of the row'),\n }),\n ).description('Array of rows'),\n height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Height of the datatable component'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of the datatable component'),\n renderRowActions: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]).description(\n 'The renderer to use for the action toolbar',\n ),\n isExpandable: PropTypes.bool.description('Whether the datatable is expandable').defaultValue(false),\n uniqueRowAccessor: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.func,\n ]).description(\n 'Column / Combination of columns / Function to call to produce a unique identifier for each row.' +\n ' This is necessary for the selectable and drag and drop features',\n ),\n disabledRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is disabled or not',\n ),\n expandedRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is expanded or not',\n ),\n onRowExpand: PropTypes.func.description('Function invoked when a row is (un)expanded'),\n cellRendererProps: PropTypes.object.description(\n 'Object with all the props you want the cells to have available when rendering',\n ),\n selectSingle: PropTypes.bool.description('Whether the selectable feature is single').defaultValue(false),\n selection: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is selected or not',\n ),\n onSelectionChange: PropTypes.func.description('Function invoked when a row is selected'),\n groupedRowsRenderHeader: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).description(\n 'String | Function to call which will display in the row headers',\n ),\n isResizeable: PropTypes.bool.description(\"Whether the datatable's columns are resizeable\"),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n type: PropTypes.string,\n value: PropTypes.any,\n }),\n ).description('Array of filter keys and values'),\n withFilterBar: PropTypes.bool.description('Whether to display the filter bar'),\n filterBarProps: PropTypes.shape({\n filterBarAddonRenderer: PropTypes.func.description('Render filterbar right addon component'),\n customPillRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).description(\n 'If you specify custom filters, you will need to render their pills here',\n ),\n isDropdownMenuOpen: PropTypes.bool.description('Wether the DropdownMenu is Open or not.'),\n onDropdownMenuToggle: PropTypes.func.description('Callback to toggle the DropdownMenu.'),\n onClearAllFiltersClick: PropTypes.func.description('Callback for Clear Al Filters option.'),\n onDropdownMenuClickOutside: PropTypes.func.description('Callback triggered when clicking outside DropdownMenu.'),\n onDropdownMenuTriggerClick: PropTypes.func.description('Callback triggered when clicking DropdownMenu ellipsis.'),\n extraOptions: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.string,\n id: PropTypes.string,\n label: PropTypes.string,\n onClick: PropTypes.func,\n }),\n ).description('Any extra option you want in the dropdownmenu of the filter bar'),\n }).description('Props for the filter bar'),\n onFiltersChange: PropTypes.func.description('Function invoked when filters change'),\n pagination: PropTypes.oneOfType([\n PropTypes.oneOf([false]),\n PropTypes.shape({\n pageCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('How many pages are there'),\n isLoadingPageCount: PropTypes.bool.description('Whether the page count is loading'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func\n .description('Function invoked when the page size changes')\n .defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n dataIsPage: PropTypes.bool.description('Whether to treat data as a page').defaultValue(false),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n }),\n ]).description('Object containing the data for the pagination'),\n Pagination: PropTypes.func.description('Custom component to show in place of the pagination'),\n colsLayoutStyle: PropTypes.oneOf(['auto', 'fixed']).description('Whether the datatable fills its container or not'),\n resizerA11yMode: PropTypes.oneOf(['separator', 'slider']).description(\n 'EXPERIMENTAL \u2014 accessible role exposed by the column resize control (PUI-17784), for a11y SME evaluation. Defaults to \"separator\".',\n ),\n hiddenColumns: PropTypes.arrayOf(PropTypes.string).description('IDs of columns not to render'),\n dragAndDropRows: PropTypes.bool.description('Whether to turn on the d&d feature for the rows').defaultValue(false),\n onRowsReorder: PropTypes.func.description('Function invoked when a row is reordered'),\n maxDragAndDropLevel: PropTypes.number.description('Which level is the maximum allowed to drop into'),\n dragAndDropColumns: PropTypes.bool.description('Whether to turn on the d&d feature for the columns'),\n onColumnsReorder: PropTypes.func.description('Function invoked when a column is reordered'),\n getIsDropValid: PropTypes.func.description('Function to determine if a drop is valid'),\n textWrap: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']).description('Global wrapping rule'),\n noResultsMessage: PropTypes.string.description('Message to show when no more data is available'),\n noResultsSecondaryMessage: PropTypes.string.description('Secondary message to show when no more data is available'),\n noResultsButtonLabel: PropTypes.string.description('Label of the button when no more data is available'),\n noResultsPlaceholder: PropTypes.oneOfType([PropTypes.node]).description(\n 'Custom content to show when dataset is empty',\n ),\n isLoading: PropTypes.bool.description('Whether to show a global loader in the datatable'),\n onColumnResize: PropTypes.func\n .description('Function invoked when a column is resized')\n .deprecated({ version: '4.x', message: 'Use onColumnSizeChange' }),\n onColumnSizeChange: PropTypes.func.description('Function invoked when a column is resized'),\n onRowClick: PropTypes.func.description('Function invoked when clicking a row'),\n onRowFocus: PropTypes.func.description('Function invoked when focusing a row'),\n onCellValueChange: PropTypes.func.description(\"Function invoked when an editable cell's content is changed\"),\n onColumnSortChange: PropTypes.func\n .description('Function invoked when a column is sorted')\n .deprecated({ version: '4.x', message: 'Use onColumnSort' }),\n onColumnSort: PropTypes.func.description('Function invoked when a column is sorted'),\n onTableResize: PropTypes.func.description(\n 'Function invoked when the size of the internal table changes, e.g. when a the browser window is resized',\n ),\n actionRef: PropTypes.object.description('Reference where all the exposed action callbacks will be exposed'),\n getRowVariant: PropTypes.func\n .description(\"Function invoked to determine a row's variant\")\n .defaultValue(`() => 'ds-primary-row'`),\n noSelectionColumn: PropTypes.bool.description('Whether to show the selection column or not').defaultValue(false),\n onPageChanged: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNoResultsButtonClick: PropTypes.func\n .description('Function invoked when the no results button is clicked')\n .defaultValue(() => null),\n isSkeleton: PropTypes.bool.description('Whether to show a skeleton loader in the datatable'),\n getAriaLabelForRow: PropTypes.func.description('Function invoked to determine a row aria-label'),\n domIdAffix: PropTypes.string\n .description('Affix to avoid duplicate ids')\n .defaultValue('8 randomly generated characters'),\n checkboxSelectAllProps: PropTypes.object.description('Props for the select all checkbox'),\n};\n\nexport const DSDataTablePropTypesSchema = DSDataTablePropTypes as unknown as ValidationMap<DSDataTableT.Props>;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW;AAQpB;AAAA,EACE;AAAA,EACA;AAAA,OAGK;AACP,SAAS,oBAAoB;AAC7B,SAAqC,iBAAiB,uBAAuB;AAC7E,SAAS,iBAAiB,wBAAwB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\n/* eslint-disable @typescript-eslint/no-empty-interface */\nimport { uid } from 'uid';\nimport type { Range, useVirtual } from 'react-virtual/types';\nimport type { ZustandT } from '@elliemae/ds-zustand-helpers';\nimport type { DSPaginationT } from '@elliemae/ds-pagination';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport type { DnDKitTree, useSortable } from '@elliemae/ds-drag-and-drop';\nimport type { DSControlledCheckboxT } from '@elliemae/ds-form-checkbox';\nimport type { DSComboboxT } from '@elliemae/ds-form-combobox';\nimport {\n PropTypes,\n getPropsPerSlotPropTypes,\n type DSPropTypesSchema,\n type ValidationMap,\n} from '@elliemae/ds-props-helpers';\nimport { FILTER_TYPES } from './exported-related/index.js';\nimport { type DropIndicatorPosition, ColsLayoutStyle, ResizerA11yMode } from './configs/constants.js';\nimport { DSDataTableName, DSDataTableSlots } from './constants/index.js';\nexport namespace DSDataTableT {\n // ===========================================================================\n // Typescript definition for auxiliary types\n // ===========================================================================\n type PropsT<D, R, O> = Partial<D> & R & O;\n\n type InternalPropsT<D, R, O> = D & R & O;\n\n // ===========================================================================\n // Typescript definition for zustand store\n // ===========================================================================\n\n export type InternalAtoms = {\n drilldownRowId: string | null;\n focusedRowId: string | null;\n isShiftPressed: boolean;\n reduxHeaders: Record<string, ReduxHeader>;\n // PUI-15154: which column (if any) the mouse is currently over \u2014 tracked independently of\n // reduxHeaders' hover/focus-derived fields so resetAllHeadersExcept can tell \"this other\n // column is legitimately still hovered\" apart from \"this other column has the stuck-focus\n // bug\" (hover and focus are independent axes: a column can be hovered while a different one\n // has keyboard/click focus, and both should stay visible).\n hoveredColumnId: string | null;\n isHeaderCellDragging: boolean;\n };\n export type UseAutoCalculatedT = {\n /**\n * visibleRangeRef: React.MutableRefObject<Range>\n * We can use this ref to get the visible range of the virtual list\n * taking in consideration the end-start and overscan.\n */\n visibleRangeRef: React.MutableRefObject<Range>;\n columnHeaderRef: React.MutableRefObject<HTMLDivElement | null>;\n columnHeaderCallbackRef: (node: HTMLDivElement | null) => void;\n /** Sticky header height (px) \u2014 drives both useVirtual paddingStart and the scroll container's scroll-padding-top (PUI-18626). */\n headerHeightPx: number;\n virtualListRef: React.MutableRefObject<HTMLDivElement | null>;\n flattenedData: InternalRow[];\n allDataFlattened: InternalRow[];\n isEmptyContent: boolean;\n firstFocuseableColumnHeaderId: string | undefined;\n visibleColumns: InternalColumn[];\n virtualListHelpers: ReturnType<typeof useVirtual>;\n layoutHelpers: {\n totalColumnsWidth: number | string;\n gridLayout: string[];\n };\n paginationHelpers: Pagination;\n lastSelected: React.MutableRefObject<number>;\n bodyClientWidth: number | string;\n setBodyClientWidth: React.Dispatch<React.SetStateAction<number | string>>;\n };\n export type Selectors = Record<string, never>;\n export type Reducers = {\n patchHeader: (headerId: string, newHeader: Partial<ReduxHeader>) => void;\n patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n resetAllHeadersExcept: (exceptHeaderId: string) => void;\n };\n export type ShuttleInternalStore = ZustandT.InternalStore<InternalAtoms, Selectors, Reducers>;\n\n // ===========================================================================\n // Typescript definition for data table related things\n // ===========================================================================\n\n export interface Filter {\n id: string;\n type: string;\n value: unknown;\n }\n\n export type FilterFn<T> = (unfilteredData: Row[], filterKey: string, filterValue: T) => Row[];\n export type FilterFnOutOfTheBoxCurrencyRange = DSDataTableT.FilterFn<{ from: string; to: string }>;\n export type FilterFnOutOfTheBoxDateRange = DSDataTableT.FilterFn<{ startDate: string; endDate: string }>;\n export type FilterFnOutOfTheBoxDateSwitcher = DSDataTableT.FilterFn<{\n startDate: string;\n endDate: string;\n isDateRange: boolean;\n }>;\n export type FilterFnOutOfTheBoxMultiSelect = DSDataTableT.FilterFn<{ label: string; value: string }[]>;\n export type FilterFnOutOfTheBoxNumberRange = DSDataTableT.FilterFn<{ from?: number; to?: number }>;\n export type FilterFnOutOfTheBoxSingleDate = DSDataTableT.FilterFn<string>;\n export type FilterFnOutOfTheBoxSingleSelect = DSDataTableT.FilterFn<{ label: string; value: string }>;\n export type FilterFnOutOfTheBoxFreeTextSearch = DSDataTableT.FilterFn<string>;\n export interface FilterItemProps {\n column: InternalColumn;\n filters: Filter[];\n onFiltersChange: (filters: Filter[]) => void;\n reduxHeader: ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n referenceColumn?: HTMLDivElement | null;\n }\n\n export interface FilterProps<T> {\n column: InternalColumn;\n referenceColumn?: HTMLDivElement | null;\n onValueChange: (type: string, value: T | undefined) => void;\n patchHeaderFilterButtonAndMenu: (headerId: string, newState: boolean) => void;\n patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n filterValue: T;\n reduxHeader: ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n domIdAffix?: string;\n }\n\n export interface FilterPillProps<T> {\n columnHeader: string;\n column: string;\n value: T;\n filters: Filter[];\n onFiltersChange: (filters: Filter[]) => void;\n prevRef?: React.RefObject<HTMLElement>;\n innerRef: React.RefObject<HTMLElement>;\n nextRef?: React.RefObject<HTMLElement>;\n onPillRemove?: (remove: () => void) => void;\n }\n\n export interface ReduxHeader {\n hideFilterMenu?: boolean;\n hideFilterButton?: boolean;\n showDnDHandle?: boolean;\n withTabStops?: boolean;\n showSortCaret?: boolean;\n }\n\n export type SelectionItem = boolean | 'mixed';\n\n export type Selection = Record<string | number, SelectionItem>;\n\n export type UniqueRowAccessorType = string | string[] | ((row: Row) => string) | undefined;\n\n export interface SortBy {\n id: string;\n desc: boolean;\n }\n\n export interface Pagination extends DSPaginationT.Props {\n hasPagination: boolean;\n pageIndex?: number;\n canPreviousPage?: boolean;\n canNextPage?: boolean;\n pageSize?: number;\n dataIsPage?: boolean;\n showPerPageSelector?: boolean;\n perPageOptions?: number[];\n perPageStep?: number;\n minPerPage?: number;\n maxPerPage?: number;\n onPageSizeChange?: (pageSize: number) => void;\n onPreviousPage?: () => void;\n onNextPage?: () => void;\n onPageChange?: (page: number) => void;\n pageCount?: number | string;\n isLoadingPageCount?: boolean;\n pageDetails?: string[];\n pageDetailsTitle?: string;\n }\n\n export type RowVariant = 'ds-header-group-row' | 'ds-primary-row' | 'ds-secondary-row';\n\n export interface RenderRowActionsConfig {\n columnWidth: number;\n renderer: React.ComponentType<CellProps>;\n }\n\n export type RenderRowActions = false | RenderRowActionsConfig;\n\n export type DropIndicatorPositionValues = TypescriptHelpersT.ObjectValues<typeof DropIndicatorPosition>;\n\n export type ColsLayoutStyleValues = TypescriptHelpersT.ObjectValues<typeof ColsLayoutStyle>;\n\n export type ResizerA11yModeValues = TypescriptHelpersT.ObjectValues<typeof ResizerA11yMode>;\n\n export type DraggablePropsT =\n | false\n | (ReturnType<typeof useSortable> & {\n dropIndicatorPosition: DropIndicatorPositionValues;\n shouldShowDropIndicatorPosition: boolean;\n isDropValid: boolean;\n });\n\n export type FilterOptionT = DSComboboxT.Props['allOptions'][number];\n export type EditOptionT = DSComboboxT.Props['allOptions'][number];\n\n // ===========================================================================\n // Typescript definition for the row and columns\n // ===========================================================================\n\n export interface Row {\n [key: string]: unknown;\n id: string;\n subRows?: Row[];\n tableRowDetails?: React.ComponentType<DetailsProps>;\n dimsumHeaderValue?: string;\n }\n export interface EditableCellProps<T extends HTMLElement = HTMLElement> extends CellProps<T> {\n DefaultCellRender: JSX.Element;\n }\n\n export interface Column {\n id?: string;\n Header: string | React.ComponentType<HeaderProps>;\n accessor?: string;\n filter?: string;\n filterOptions?: FilterOptionT[] | (() => FilterOptionT[]);\n disableFirstOptionFocusOnFilter?: boolean;\n editOptions?: EditOptionT[] | (() => EditOptionT[]);\n filterMinWidth?: number | string;\n Filter?: React.ComponentType<FilterProps<unknown>>;\n Cell?: React.ComponentType<CellRendererProps>;\n editable?: string | React.ComponentType<EditableCellProps>;\n disableDnD?: boolean;\n width?: number;\n minWidth?: number;\n maxWidth?: number;\n padding?: number;\n columns?: Column[];\n canSort?: boolean;\n isSortedDesc?: boolean;\n canResize?: boolean;\n isFocuseable?: boolean;\n textWrap?: 'wrap' | 'wrap-all' | 'truncate';\n pillLabel?: string;\n ref?: React.MutableRefObject<HTMLTableColElement | null>;\n required?: boolean;\n cellStyle?: React.CSSProperties;\n alwaysDisplayEditIcon?: boolean;\n }\n\n // ===========================================================================\n // Typescript definition for the internal representation of the row and columns\n // ===========================================================================\n\n export interface InternalRow {\n id: string;\n uid: string;\n index: number;\n realIndex: number;\n parent: InternalRow | null;\n parentId: string | null;\n parentIndex: number | null;\n depth: number;\n isExpanded: boolean;\n subRows: Row[];\n childrenCount: number;\n original: Row;\n cells: Cell[];\n }\n\n export interface InternalColumn extends Column {\n index?: number;\n id: string;\n parentId: string | null;\n depth: number;\n ref: React.MutableRefObject<HTMLTableColElement | null>;\n columns?: InternalColumn[];\n persistFilterInputAfterSubmit?: boolean;\n }\n\n // ===========================================================================\n // Typescript definition for the internal representation of the cell\n // ===========================================================================\n\n export interface CellRendererProps {\n row: InternalRow;\n column: InternalColumn;\n cell: Cell;\n isRowSelected: boolean;\n isDragOverlay: boolean;\n shouldAddExpandCell: boolean;\n // cellIsNextToExpander: boolean;\n isDisabledRow?: boolean;\n draggableProps?: DraggablePropsT;\n domIdAffix?: string;\n }\n\n export interface Cell<T extends HTMLElement = HTMLElement> {\n column: InternalColumn;\n value: unknown;\n render: React.ComponentType<CellRendererProps>;\n row: InternalRow;\n ref: React.MutableRefObject<T | null>;\n id: string;\n }\n\n // ===========================================================================\n // Typescript definition for all component props\n // ===========================================================================\n\n export interface HeaderProps {\n column: InternalColumn;\n draggableProps: DraggablePropsT;\n }\n\n export interface CellProps<T extends HTMLElement = HTMLElement> {\n row: InternalRow;\n column: InternalColumn;\n cell: Cell<T>;\n domIdAffix?: string;\n isRowSelected: boolean;\n isDragOverlay: boolean;\n shouldAddExpandCell: boolean;\n cellIsNextToExpander: boolean;\n isDisabledRow?: boolean;\n draggableProps?: DraggablePropsT;\n }\n\n export interface DetailsProps {\n detailsIndent: number;\n row: InternalRow;\n }\n export interface RowVariantProps {\n row: DSDataTableT.InternalRow;\n itemIndex: number;\n isDragOverlay: boolean;\n focusedRowId: string | null;\n drilldownRowId: string | null;\n }\n\n // ===========================================================================\n // Typescript definition for the React Context\n // ===========================================================================\n\n export interface Context {\n tableProps: InternalProps;\n columnHeaderRef: React.MutableRefObject<HTMLDivElement | null>;\n virtualListRef: React.MutableRefObject<HTMLDivElement | null>;\n flattenedData: InternalRow[];\n allDataFlattened: InternalRow[];\n isEmptyContent: boolean;\n firstFocuseableColumnHeaderId: string | undefined;\n visibleColumns: InternalColumn[];\n virtualListHelpers: ReturnType<typeof useVirtual>;\n layoutHelpers: {\n totalColumnsWidth: number | string;\n gridLayout: string[];\n };\n paginationHelpers: Pagination;\n drilldownRowId: string | null;\n setDrilldownRowId: React.Dispatch<React.SetStateAction<string | null>>;\n focusedRowId: string | null;\n setFocusedRowId: React.Dispatch<React.SetStateAction<string | null>>;\n hoveredColumnId: string | null;\n setHoveredColumnId: React.Dispatch<React.SetStateAction<string | null>>;\n reduxHeaders: Record<string, ReduxHeader>;\n patchHeader: (headerId: string, newHeader: ReduxHeader) => void;\n patchHeaderFilterButtonAndMenu: (headerId: string, value: boolean) => void;\n resetAllHeadersExcept: (exceptHeaderId: string) => void;\n isShiftPressed: boolean;\n setIsShiftPressed: React.Dispatch<React.SetStateAction<boolean>>;\n lastSelected: React.MutableRefObject<number>;\n isHeaderCellDragging: boolean;\n setIsHeaderCellDragging: React.Dispatch<React.SetStateAction<boolean>>;\n }\n\n export interface DefaultProps {\n height: string;\n width: string;\n renderRowActions: false | RenderRowActionsConfig;\n getRowVariant: (\n row: InternalRow,\n defaultCellRenderer: React.ComponentType<{\n row: DSDataTableT.InternalRow;\n isRowSelected: boolean;\n isDragOverlay: boolean;\n }>,\n ) => RowVariant | React.ComponentType<RowVariantProps>;\n withFilterBar: boolean;\n isExpandable: boolean;\n expandedRows: Record<string, boolean>;\n disabledRows: Record<string, boolean>;\n isResizeable: boolean;\n isLoading: boolean;\n pagination: false | Pagination;\n filters: Filter[];\n colsLayoutStyle: ColsLayoutStyleValues;\n resizerA11yMode: ResizerA11yModeValues;\n hiddenColumns: string[];\n noResultsMessage: string;\n dragAndDropRows: boolean;\n maxDragAndDropLevel: number;\n onRowsReorder: (\n newData: Row[],\n indexes: { targetIndex: number; fromIndex: number },\n considerExpanding: string | null,\n extraData: { flattenedData: InternalRow[]; allDataFlattened: InternalRow[] },\n ) => void;\n dragAndDropColumns: boolean;\n onColumnsReorder: (newData: Column[], indexes: { targetIndex: number; fromIndex: number }) => void;\n getIsDropValid: (\n active: DnDKitTree.Item<Row>,\n over: DnDKitTree.Item<Row>,\n dropIndicatorPosition: DropIndicatorPositionValues,\n ) => boolean;\n onColumnResize: (headerId: string, width: number) => void;\n onColumnSizeChange: (newColumns: Column[], headerId: string, width: number) => void;\n onRowClick: TypescriptHelpersT.GenericFunc;\n onRowFocus: TypescriptHelpersT.GenericFunc;\n noSelectionColumn: boolean;\n selectSingle: boolean;\n onSelectionChange: (\n newSelection: Selection,\n selectedControl: string,\n event: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent,\n ) => void;\n textWrap: 'wrap' | 'wrap-all' | 'truncate';\n onCellValueChange: (cellChange: { value: unknown; property: unknown; rowIndex: number }) => void;\n onFiltersChange: TypescriptHelpersT.GenericFunc;\n onPageChanged: TypescriptHelpersT.GenericFunc;\n onRowExpand: (expandedRows: Record<string, boolean>, toggledRow: string) => void;\n onColumnSortChange: (newSortRequest: { column: unknown; direction: unknown }) => void;\n onColumnSort: (newColumns: Column[], headerId: string, direction: 'ASC' | 'DESC') => void;\n isSkeleton: boolean;\n domIdAffix?: string;\n }\n export interface OptionalProps\n extends TypescriptHelpersT.PropsForGlobalOnSlots<typeof DSDataTableName, typeof DSDataTableSlots> {\n uniqueRowAccessor?: UniqueRowAccessorType;\n cellRendererProps?: Record<string, unknown>;\n selection?: Selection;\n groupedRowsRenderHeader?:\n | ((dimsumHeaderValue: string | undefined, subRows: Row[] | undefined) => JSX.Element)\n | string;\n filterBarProps?: {\n filterBarAddonRenderer?: React.ComponentType<{ innerRef: React.MutableRefObject<HTMLButtonElement | null> }>;\n customPillRenderer?: React.ComponentType<FilterPillProps<unknown>>;\n onClearAllFiltersClick?: () => void;\n onDropdownMenuToggle?: (isOpen: boolean, eventType: string) => void;\n onDropdownMenuClickOutside?: () => void;\n onDropdownMenuTriggerClick?: () => void;\n isDropdownMenuOpen?: boolean;\n extraOptions?: { type: string; id: string; label: string; onClick?: TypescriptHelpersT.GenericFunc }[];\n };\n actionRef?: React.MutableRefObject<{\n scrollToIndex: ReturnType<typeof useVirtual>['scrollToIndex'];\n scrollToOffset: ReturnType<typeof useVirtual>['scrollToOffset'];\n }>;\n noResultsSecondaryMessage?: string;\n noResultsButtonLabel?: string;\n noResultsPlaceholder?: React.ReactElement;\n onNoResultsButtonClick?: TypescriptHelpersT.GenericFunc;\n onTableResize?: TypescriptHelpersT.GenericFunc;\n Pagination?: React.ComponentType<Record<string, never>>;\n getAriaLabelForRow?: (args: {\n row: InternalRow;\n selected: boolean;\n disabled: boolean;\n expandable: boolean;\n expanded: boolean;\n }) => string;\n checkboxSelectAllProps?: DSControlledCheckboxT.Props;\n }\n export interface RequiredProps {\n columns: Column[];\n data: Row[];\n }\n\n export type Props = PropsT<DefaultProps, RequiredProps, OptionalProps>;\n\n export type InternalProps = InternalPropsT<DefaultProps, RequiredProps, OptionalProps>;\n\n export type GetOwnerPropsT = () => ZustandT.PropsStore<\n DefaultProps & RequiredProps & OptionalProps & UseAutoCalculatedT\n >;\n}\n\n// default props is a function to ensure that the uid is unique for each instance of the component\n// this is supported by the useMemoMergePropsWithDefault function.\nexport const defaultProps: () => DSDataTableT.DefaultProps = () => ({\n height: '100%',\n width: '100%',\n renderRowActions: false,\n getRowVariant: () => 'ds-primary-row',\n isExpandable: false,\n expandedRows: {},\n disabledRows: {},\n isResizeable: false,\n isLoading: false,\n pagination: false,\n withFilterBar: false,\n filters: [],\n getIsDropValid: () => true,\n onColumnResize: () => null,\n onColumnSortChange: () => null,\n colsLayoutStyle: ColsLayoutStyle.Fixed,\n resizerA11yMode: ResizerA11yMode.Separator,\n hiddenColumns: [],\n noResultsMessage: 'No Results Found',\n dragAndDropRows: false,\n maxDragAndDropLevel: 1,\n onRowsReorder: () => null,\n dragAndDropColumns: false,\n onColumnsReorder: () => null,\n onColumnSizeChange: () => null,\n onRowClick: () => null,\n onRowFocus: () => null,\n noSelectionColumn: false,\n selectSingle: false,\n onSelectionChange: () => null,\n textWrap: 'wrap',\n onCellValueChange: () => null,\n onFiltersChange: () => null,\n onPageChanged: () => null,\n onRowExpand: () => null,\n onColumnSort: () => null,\n isSkeleton: false,\n domIdAffix: uid(8),\n});\n\nexport const DSDataTablePropTypes: DSPropTypesSchema<DSDataTableT.Props> = {\n ...getPropsPerSlotPropTypes(DSDataTableName, DSDataTableSlots),\n columns: PropTypes.arrayOf(\n PropTypes.shape({\n Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.node]).description(\n 'Header name or component',\n ).isRequired,\n accessor: PropTypes.string.description('The entry of the data that this column will display'),\n id: PropTypes.string.description('The id of the column, will default to the Header or accessor if not present'),\n filter: PropTypes.oneOf(Object.values(FILTER_TYPES)).description('out-of-the-box filters'),\n Filter: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).description(\n 'The custom component to render as a filter',\n ),\n Cell: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('The custom cell renderer component'),\n editable: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.node]).description(\n 'The editable out-of-the-box or component to render',\n ),\n disableDnD: PropTypes.bool.description('Whereas this column should be draggable'),\n canResize: PropTypes.bool.description('Whereas this column should be resizable'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of this column'),\n minWidth: PropTypes.number.description(\n 'Minimum width this column can be resized down to. Defaults to 30px, which is NOT guaranteed to fit the header title and icon affordances (drag handle / filter / sort) enabled on this column. When isResizeable is used, pass an explicit minWidth sized to the actual header content \u2014 otherwise the resize handle can overlap the header title.',\n ),\n maxWidth: PropTypes.number.description(\n 'Maximum width this column can be resized up to, useful when resizing. Defaults to 600px.',\n ),\n canSort: PropTypes.bool.description('Whereas this column is sortable'),\n disableFirstOptionFocusOnFilter: PropTypes.bool.description(\n 'Whereas the first option should not be focused on filter',\n ),\n filterMinWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description(\n 'Minimum width of the filter',\n ),\n filterOptions: PropTypes.arrayOf(\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.string,\n label: PropTypes.string,\n }),\n ).description('Filter options'),\n isSortedDesc: PropTypes.bool.description('Whereas this column is sorted descendingly'),\n required: PropTypes.bool.description('Whereas this column is required'),\n alwaysDisplayEditIcon: PropTypes.bool.description(\n 'Whereas to always show the edit icon on this column if it is editable',\n ),\n textWrap: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']).description('How to wrap the text in the column'),\n pillLabel: PropTypes.string.description(\n 'Overrides the filter pill label text for this column when non-empty; defaults to the column Header',\n ),\n }),\n ).description('Array of columns').isRequired,\n data: PropTypes.arrayOf(\n PropTypes.shape({\n tableRowDetails: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).description('Component for row details'),\n dimsumHeaderValue: PropTypes.string.description('Header displayed on the header variant of the row'),\n }),\n ).description('Array of rows'),\n height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Height of the datatable component'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of the datatable component'),\n renderRowActions: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]).description(\n 'The renderer to use for the action toolbar',\n ),\n isExpandable: PropTypes.bool.description('Whether the datatable is expandable').defaultValue(false),\n uniqueRowAccessor: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.func,\n ]).description(\n 'Column / Combination of columns / Function to call to produce a unique identifier for each row.' +\n ' This is necessary for the selectable and drag and drop features',\n ),\n disabledRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is disabled or not',\n ),\n expandedRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is expanded or not',\n ),\n onRowExpand: PropTypes.func.description('Function invoked when a row is (un)expanded'),\n cellRendererProps: PropTypes.object.description(\n 'Object with all the props you want the cells to have available when rendering',\n ),\n selectSingle: PropTypes.bool.description('Whether the selectable feature is single').defaultValue(false),\n selection: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is selected or not',\n ),\n onSelectionChange: PropTypes.func.description('Function invoked when a row is selected'),\n groupedRowsRenderHeader: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).description(\n 'String | Function to call which will display in the row headers',\n ),\n isResizeable: PropTypes.bool.description(\"Whether the datatable's columns are resizeable\"),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n type: PropTypes.string,\n value: PropTypes.any,\n }),\n ).description('Array of filter keys and values'),\n withFilterBar: PropTypes.bool.description('Whether to display the filter bar'),\n filterBarProps: PropTypes.shape({\n filterBarAddonRenderer: PropTypes.func.description('Render filterbar right addon component'),\n customPillRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.node]).description(\n 'If you specify custom filters, you will need to render their pills here',\n ),\n isDropdownMenuOpen: PropTypes.bool.description('Wether the DropdownMenu is Open or not.'),\n onDropdownMenuToggle: PropTypes.func.description('Callback to toggle the DropdownMenu.'),\n onClearAllFiltersClick: PropTypes.func.description('Callback for Clear Al Filters option.'),\n onDropdownMenuClickOutside: PropTypes.func.description('Callback triggered when clicking outside DropdownMenu.'),\n onDropdownMenuTriggerClick: PropTypes.func.description('Callback triggered when clicking DropdownMenu ellipsis.'),\n extraOptions: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.string,\n id: PropTypes.string,\n label: PropTypes.string,\n onClick: PropTypes.func,\n }),\n ).description('Any extra option you want in the dropdownmenu of the filter bar'),\n }).description('Props for the filter bar'),\n onFiltersChange: PropTypes.func.description('Function invoked when filters change'),\n pagination: PropTypes.oneOfType([\n PropTypes.oneOf([false]),\n PropTypes.shape({\n pageCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('How many pages are there'),\n isLoadingPageCount: PropTypes.bool.description('Whether the page count is loading'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func\n .description('Function invoked when the page size changes')\n .defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n dataIsPage: PropTypes.bool.description('Whether to treat data as a page').defaultValue(false),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n }),\n ]).description('Object containing the data for the pagination'),\n Pagination: PropTypes.func.description('Custom component to show in place of the pagination'),\n colsLayoutStyle: PropTypes.oneOf(['auto', 'fixed']).description('Whether the datatable fills its container or not'),\n resizerA11yMode: PropTypes.oneOf(['separator', 'slider']).description(\n 'EXPERIMENTAL \u2014 accessible role exposed by the column resize control (PUI-17784), for a11y SME evaluation. Defaults to \"separator\".',\n ),\n hiddenColumns: PropTypes.arrayOf(PropTypes.string).description('IDs of columns not to render'),\n dragAndDropRows: PropTypes.bool.description('Whether to turn on the d&d feature for the rows').defaultValue(false),\n onRowsReorder: PropTypes.func.description('Function invoked when a row is reordered'),\n maxDragAndDropLevel: PropTypes.number.description('Which level is the maximum allowed to drop into'),\n dragAndDropColumns: PropTypes.bool.description('Whether to turn on the d&d feature for the columns'),\n onColumnsReorder: PropTypes.func.description('Function invoked when a column is reordered'),\n getIsDropValid: PropTypes.func.description('Function to determine if a drop is valid'),\n textWrap: PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']).description('Global wrapping rule'),\n noResultsMessage: PropTypes.string.description('Message to show when no more data is available'),\n noResultsSecondaryMessage: PropTypes.string.description('Secondary message to show when no more data is available'),\n noResultsButtonLabel: PropTypes.string.description('Label of the button when no more data is available'),\n noResultsPlaceholder: PropTypes.oneOfType([PropTypes.node]).description(\n 'Custom content to show when dataset is empty',\n ),\n isLoading: PropTypes.bool.description('Whether to show a global loader in the datatable'),\n onColumnResize: PropTypes.func\n .description('Function invoked when a column is resized')\n .deprecated({ version: '4.x', message: 'Use onColumnSizeChange' }),\n onColumnSizeChange: PropTypes.func.description('Function invoked when a column is resized'),\n onRowClick: PropTypes.func.description('Function invoked when clicking a row'),\n onRowFocus: PropTypes.func.description('Function invoked when focusing a row'),\n onCellValueChange: PropTypes.func.description(\"Function invoked when an editable cell's content is changed\"),\n onColumnSortChange: PropTypes.func\n .description('Function invoked when a column is sorted')\n .deprecated({ version: '4.x', message: 'Use onColumnSort' }),\n onColumnSort: PropTypes.func.description('Function invoked when a column is sorted'),\n onTableResize: PropTypes.func.description(\n 'Function invoked when the size of the internal table changes, e.g. when a the browser window is resized',\n ),\n actionRef: PropTypes.object.description('Reference where all the exposed action callbacks will be exposed'),\n getRowVariant: PropTypes.func\n .description(\"Function invoked to determine a row's variant\")\n .defaultValue(`() => 'ds-primary-row'`),\n noSelectionColumn: PropTypes.bool.description('Whether to show the selection column or not').defaultValue(false),\n onPageChanged: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNoResultsButtonClick: PropTypes.func\n .description('Function invoked when the no results button is clicked')\n .defaultValue(() => null),\n isSkeleton: PropTypes.bool.description('Whether to show a skeleton loader in the datatable'),\n getAriaLabelForRow: PropTypes.func.description('Function invoked to determine a row aria-label'),\n domIdAffix: PropTypes.string\n .description('Affix to avoid duplicate ids')\n .defaultValue('8 randomly generated characters'),\n checkboxSelectAllProps: PropTypes.object.description('Props for the select all checkbox'),\n};\n\nexport const DSDataTablePropTypesSchema = DSDataTablePropTypes as unknown as ValidationMap<DSDataTableT.Props>;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|