@elliemae/ds-data-table 3.70.0-next.49 → 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/constants/index.js +1 -0
- package/dist/cjs/constants/index.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/constants/index.js +1 -0
- package/dist/esm/constants/index.js.map +2 -2
- package/dist/types/constants/index.d.ts +4 -0
- package/package.json +30 -30
|
@@ -33,12 +33,22 @@ __export(ColumnSelectMultiple_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(ColumnSelectMultiple_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
-
var import_react = require("react");
|
|
37
36
|
var import_ds_form_checkbox = require("@elliemae/ds-form-checkbox");
|
|
37
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
38
|
+
var import_react = require("react");
|
|
38
39
|
var import_uid = require("uid");
|
|
39
40
|
var import_constants = require("../../../configs/constants.js");
|
|
40
41
|
var import_createInternalAndPropsContext = require("../../../configs/useStore/createInternalAndPropsContext.js");
|
|
42
|
+
var import_constants2 = require("../../../constants/index.js");
|
|
41
43
|
var import_multipleSelectRow = require("../../../helpers/multipleSelectRow.js");
|
|
44
|
+
const StyledGlobalCheckboxContainer = (0, import_ds_system.styled)("span", {
|
|
45
|
+
name: import_constants2.DSDataTableName,
|
|
46
|
+
slot: import_constants2.DSDataTableSlots.GLOBAL_CHECKBOX_CONTAINER
|
|
47
|
+
})`
|
|
48
|
+
display: flex;
|
|
49
|
+
align-items: center;
|
|
50
|
+
min-height: 24px;
|
|
51
|
+
`;
|
|
42
52
|
const multiSelectColumn = {
|
|
43
53
|
// Build our multiSelecter column
|
|
44
54
|
id: "multiSelecter",
|
|
@@ -55,6 +65,8 @@ const multiSelectColumn = {
|
|
|
55
65
|
const firstFocuseableColumnHeaderId = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.firstFocuseableColumnHeaderId);
|
|
56
66
|
const domIdAffix = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.domIdAffix);
|
|
57
67
|
const visibleRangeRef = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.visibleRangeRef);
|
|
68
|
+
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
69
|
+
const getOwnerPropsArguments = (0, import_react.useCallback)(() => ({}), []);
|
|
58
70
|
const dtSelection = selection ?? {};
|
|
59
71
|
const selectionKeyCount = flattenedData.reduce(
|
|
60
72
|
(acc, cur) => (dtSelection[cur.uid] && !disabledRows[cur.uid] ? 1 : 0) + acc,
|
|
@@ -87,7 +99,7 @@ const multiSelectColumn = {
|
|
|
87
99
|
const endCandidate = visibleRangeRef.current.end + visibleRangeRef.current.overscan + 1;
|
|
88
100
|
const end = endCandidate > visibleRangeRef.current.size ? visibleRangeRef.current.size : endCandidate;
|
|
89
101
|
const visibleAriaControls = ariaControls.split(" ").slice(start, end).join(" ");
|
|
90
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
102
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledGlobalCheckboxContainer, { getOwnerProps, getOwnerPropsArguments, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
91
103
|
import_ds_form_checkbox.DSControlledCheckbox,
|
|
92
104
|
{
|
|
93
105
|
"aria-controls": visibleAriaControls,
|
|
@@ -96,7 +108,7 @@ const multiSelectColumn = {
|
|
|
96
108
|
checked: currentGlobalState,
|
|
97
109
|
onChange: onChangeHandler
|
|
98
110
|
}
|
|
99
|
-
);
|
|
111
|
+
) });
|
|
100
112
|
},
|
|
101
113
|
Cell: ({ cell, row, isRowSelected, domIdAffix = (0, import_uid.uid)(4) }) => {
|
|
102
114
|
const onSelectionChange = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onSelectionChange);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-statements */\nimport
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": ["genUid"]
|
|
4
|
+
"sourcesContent": ["/* 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", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+Ff;AA9FR,8BAAqC;AACrC,uBAAuB;AACvB,mBAA+D;AAC/D,iBAA8B;AAC9B,uBAA4B;AAC5B,2CAAgD;AAChD,IAAAA,oBAAkD;AAClD,+BAAqC;AAUrC,MAAM,oCAAgC,yBAAO,QAAQ;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,mCAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,oBAAiD;AAAA;AAAA,EAE5D,IAAI;AAAA;AAAA,EACJ,QAAQ,MAAM;AACZ,UAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,uBAAmB,oDAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,gCAA4B,oDAAc,CAAC,UAAU,MAAM,yBAAyB;AAC1F,UAAM,uBAAmB,oDAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,UAAM,oCAAgC,oDAAc,CAAC,UAAU,MAAM,6BAA6B;AAClG,UAAM,iBAAa,oDAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,UAAM,sBAAkB,oDAAc,CAAC,UAAU,MAAM,eAAe;AACtE,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,UAAM,6BAAyB,0BAAY,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,yBAAqB;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,gCAA4B,sBAAQ,MAAM,uBAAuB,MAAM,CAAC,kBAAkB,CAAC;AAEjG,UAAM,mBAAuC,sBAAQ,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,sBAAkB;AAAA,MACtB,CAAC,UAAmB,MAAkE;AACpF,0BAAkB,cAAc,OAAO,CAAC;AAAA,MAC1C;AAAA,MACA,CAAC,cAAc,iBAAiB;AAAA,IAClC;AAEA,UAAM,mBAAe;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,4CAAC,iCAA8B,eAA8B,wBAC3D;AAAA,MAAC;AAAA;AAAA,QACC,iBAAe;AAAA,QACf,eAAa,6BAAY;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,iBAAa,WAAAC,KAAO,CAAC,EAAE,MAAM;AAC9D,UAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,6BAAyB,oDAAc,CAAC,UAAU,MAAM,sBAAsB;AAEpF,UAAM,qBAAiB,uDAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,UAAM,wBAAoB,uDAAiB,CAAC,UAAU,MAAM,iBAAiB;AAE7E,UAAM,EAAE,KAAK,UAAU,IAAI;AAC3B,UAAM,gBAAgB,YAAY,GAAG,KAAK;AAC1C,UAAM,2BAAuB,qBAAO,KAAK;AACzC,UAAM,sBAAkB;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,6BAAe;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,uBAA+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,qBAA6C;AAAA,MACjD,CAAC,MAAM;AACL,0BAAkB,KAAK;AACvB,6BAAqB,UAAU;AAC/B,UAAE,gBAAgB;AAAA,MACpB;AAAA,MACA,CAAC,iBAAiB;AAAA,IACpB;AAEA,UAAM,yBAAqB,0BAAY,CAAC,MAA8C;AACpF,UAAI,EAAE,UAAU;AACd,6BAAqB,UAAU;AAAA,MACjC;AACA,QAAE,gBAAgB;AAAA,IACpB,GAAG,CAAC,CAAC;AAEL,WACE,4CAAC,SAAI,MAAK,gBAAe,SAAS,oBAAoB,WAAW,kBAAkB,SAAS,gBAC1F;AAAA,MAAC;AAAA;AAAA,QACC,IAAI,uBAAuB,GAAG,IAAI,UAAU;AAAA,QAC5C,eAAa,6BAAY;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,SAAK,wBAAU;AACjB;",
|
|
6
|
+
"names": ["import_constants", "genUid"]
|
|
7
7
|
}
|
|
@@ -55,6 +55,7 @@ const DATA_TABLE_SLOTS = {
|
|
|
55
55
|
RESIZER: "resizer",
|
|
56
56
|
ACTION_CELL: "action-cell",
|
|
57
57
|
EXPAND_CELL_CONTAINER: "expand-cell-container",
|
|
58
|
+
GLOBAL_CHECKBOX_CONTAINER: "global-checkbox-container",
|
|
58
59
|
SINGLE_CELL_CONTAINER: "single-cell-container",
|
|
59
60
|
DRAG_AND_DROP_GRIPPER: "drag-and-drop-gripper",
|
|
60
61
|
TEXT_EDITABLE_CELL_INPUT: "text-editable-cell-input",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/constants/index.ts", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AACxC,kCAAkC;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,OAAG,0CAAwB,iBAAiB,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO5D,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKH,iBAAiB,8CAAkB;AAAA,EACnC,eAAe,8CAAkB;AAAA,EACjC,gBAAgB,8CAAkB;AAAA,EAClC,uBAAuB,8CAAkB;AAAA,EACzC,yBAAyB,8CAAkB;AAAA,EAC3C,uBAAuB,8CAAkB;AAAA,EACzC,SAAS,8CAAkB;AAAA,EAC3B,MAAM,8CAAkB;AAAA,EACxB,eAAe,8CAAkB;AAAA,EACjC,MAAM,8CAAkB;AAAA,EACxB,sBAAsB,8CAAkB;AAAA,EACxC,wBAAwB,8CAAkB;AAAA,EAC1C,wBAAwB,8CAAkB;AAAA;AAAA,EAE1C,uBAAuB;AACzB;AAGO,MAAM,mBAAmB;AACzB,MAAM,yBAAyB;",
|
|
4
|
+
"sourcesContent": ["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", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AACxC,kCAAkC;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,OAAG,0CAAwB,iBAAiB,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAO5D,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKH,iBAAiB,8CAAkB;AAAA,EACnC,eAAe,8CAAkB;AAAA,EACjC,gBAAgB,8CAAkB;AAAA,EAClC,uBAAuB,8CAAkB;AAAA,EACzC,yBAAyB,8CAAkB;AAAA,EAC3C,uBAAuB,8CAAkB;AAAA,EACzC,SAAS,8CAAkB;AAAA,EAC3B,MAAM,8CAAkB;AAAA,EACxB,eAAe,8CAAkB;AAAA,EACjC,MAAM,8CAAkB;AAAA,EACxB,sBAAsB,8CAAkB;AAAA,EACxC,wBAAwB,8CAAkB;AAAA,EAC1C,wBAAwB,8CAAkB;AAAA;AAAA,EAE1C,uBAAuB;AACzB;AAGO,MAAM,mBAAmB;AACzB,MAAM,yBAAyB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -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": "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",
|
|
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
|
}
|
|
@@ -15,6 +15,7 @@ export declare const DATA_TABLE_SLOTS: {
|
|
|
15
15
|
readonly RESIZER: "resizer";
|
|
16
16
|
readonly ACTION_CELL: "action-cell";
|
|
17
17
|
readonly EXPAND_CELL_CONTAINER: "expand-cell-container";
|
|
18
|
+
readonly GLOBAL_CHECKBOX_CONTAINER: "global-checkbox-container";
|
|
18
19
|
readonly SINGLE_CELL_CONTAINER: "single-cell-container";
|
|
19
20
|
readonly DRAG_AND_DROP_GRIPPER: "drag-and-drop-gripper";
|
|
20
21
|
readonly TEXT_EDITABLE_CELL_INPUT: "text-editable-cell-input";
|
|
@@ -112,6 +113,7 @@ export declare const DATA_TABLE_DATA_TESTID: {
|
|
|
112
113
|
EMPTY_HEADER: "ds-datatable-empty-header";
|
|
113
114
|
RESIZER: "ds-datatable-resizer";
|
|
114
115
|
ACTION_CELL: "ds-datatable-action-cell";
|
|
116
|
+
GLOBAL_CHECKBOX_CONTAINER: "ds-datatable-global-checkbox-container";
|
|
115
117
|
SINGLE_CELL_CONTAINER: "ds-datatable-single-cell-container";
|
|
116
118
|
TEXT_EDITABLE_CELL_INPUT: "ds-datatable-text-editable-cell-input";
|
|
117
119
|
FILTER_POPOVER_CONTENT: "ds-datatable-filter-popover-content";
|
|
@@ -153,6 +155,7 @@ export declare const DSDataTableSlots: {
|
|
|
153
155
|
readonly RESIZER: "resizer";
|
|
154
156
|
readonly ACTION_CELL: "action-cell";
|
|
155
157
|
readonly EXPAND_CELL_CONTAINER: "expand-cell-container";
|
|
158
|
+
readonly GLOBAL_CHECKBOX_CONTAINER: "global-checkbox-container";
|
|
156
159
|
readonly SINGLE_CELL_CONTAINER: "single-cell-container";
|
|
157
160
|
readonly DRAG_AND_DROP_GRIPPER: "drag-and-drop-gripper";
|
|
158
161
|
readonly TEXT_EDITABLE_CELL_INPUT: "text-editable-cell-input";
|
|
@@ -250,6 +253,7 @@ export declare const DSDataTableDataTestIds: {
|
|
|
250
253
|
EMPTY_HEADER: "ds-datatable-empty-header";
|
|
251
254
|
RESIZER: "ds-datatable-resizer";
|
|
252
255
|
ACTION_CELL: "ds-datatable-action-cell";
|
|
256
|
+
GLOBAL_CHECKBOX_CONTAINER: "ds-datatable-global-checkbox-container";
|
|
253
257
|
SINGLE_CELL_CONTAINER: "ds-datatable-single-cell-container";
|
|
254
258
|
TEXT_EDITABLE_CELL_INPUT: "ds-datatable-text-editable-cell-input";
|
|
255
259
|
FILTER_POPOVER_CONTENT: "ds-datatable-filter-popover-content";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-data-table",
|
|
3
|
-
"version": "3.70.0-next.
|
|
3
|
+
"version": "3.70.0-next.50",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Data Table",
|
|
6
6
|
"files": [
|
|
@@ -41,40 +41,40 @@
|
|
|
41
41
|
"react-virtual": "~2.10.4",
|
|
42
42
|
"uid": "^2.0.2",
|
|
43
43
|
"use-onclickoutside": "0.4.1",
|
|
44
|
-
"@elliemae/ds-
|
|
45
|
-
"@elliemae/ds-
|
|
46
|
-
"@elliemae/ds-
|
|
47
|
-
"@elliemae/ds-
|
|
48
|
-
"@elliemae/ds-
|
|
49
|
-
"@elliemae/ds-
|
|
50
|
-
"@elliemae/ds-
|
|
51
|
-
"@elliemae/ds-form-
|
|
52
|
-
"@elliemae/ds-
|
|
53
|
-
"@elliemae/ds-form-
|
|
54
|
-
"@elliemae/ds-form-
|
|
55
|
-
"@elliemae/ds-form-
|
|
56
|
-
"@elliemae/ds-form-
|
|
57
|
-
"@elliemae/ds-
|
|
58
|
-
"@elliemae/ds-
|
|
59
|
-
"@elliemae/ds-hooks-focus-trap": "3.70.0-next.
|
|
60
|
-
"@elliemae/ds-menu-button": "3.70.0-next.
|
|
61
|
-
"@elliemae/ds-
|
|
62
|
-
"@elliemae/ds-
|
|
63
|
-
"@elliemae/ds-props-helpers": "3.70.0-next.
|
|
64
|
-
"@elliemae/ds-skeleton": "3.70.0-next.
|
|
65
|
-
"@elliemae/ds-
|
|
66
|
-
"@elliemae/ds-
|
|
67
|
-
"@elliemae/ds-
|
|
68
|
-
"@elliemae/ds-
|
|
44
|
+
"@elliemae/ds-circular-progress-indicator": "3.70.0-next.50",
|
|
45
|
+
"@elliemae/ds-button-v2": "3.70.0-next.50",
|
|
46
|
+
"@elliemae/ds-dialog": "3.70.0-next.50",
|
|
47
|
+
"@elliemae/ds-form-checkbox": "3.70.0-next.50",
|
|
48
|
+
"@elliemae/ds-drag-and-drop": "3.70.0-next.50",
|
|
49
|
+
"@elliemae/ds-dropdownmenu-v2": "3.70.0-next.50",
|
|
50
|
+
"@elliemae/ds-floating-context": "3.70.0-next.50",
|
|
51
|
+
"@elliemae/ds-form-combobox": "3.70.0-next.50",
|
|
52
|
+
"@elliemae/ds-form-date-range-picker": "3.70.0-next.50",
|
|
53
|
+
"@elliemae/ds-form-date-time-picker": "3.70.0-next.50",
|
|
54
|
+
"@elliemae/ds-form-helpers-mask-hooks": "3.70.0-next.50",
|
|
55
|
+
"@elliemae/ds-form-layout-blocks": "3.70.0-next.50",
|
|
56
|
+
"@elliemae/ds-form-radio": "3.70.0-next.50",
|
|
57
|
+
"@elliemae/ds-grid": "3.70.0-next.50",
|
|
58
|
+
"@elliemae/ds-form-input-text": "3.70.0-next.50",
|
|
59
|
+
"@elliemae/ds-hooks-focus-trap": "3.70.0-next.50",
|
|
60
|
+
"@elliemae/ds-menu-button": "3.70.0-next.50",
|
|
61
|
+
"@elliemae/ds-pagination": "3.70.0-next.50",
|
|
62
|
+
"@elliemae/ds-pills-v2": "3.70.0-next.50",
|
|
63
|
+
"@elliemae/ds-props-helpers": "3.70.0-next.50",
|
|
64
|
+
"@elliemae/ds-skeleton": "3.70.0-next.50",
|
|
65
|
+
"@elliemae/ds-system": "3.70.0-next.50",
|
|
66
|
+
"@elliemae/ds-zustand-helpers": "3.70.0-next.50",
|
|
67
|
+
"@elliemae/ds-typescript-helpers": "3.70.0-next.50",
|
|
68
|
+
"@elliemae/ds-icons": "3.70.0-next.50"
|
|
69
69
|
},
|
|
70
70
|
"devDependencies": {
|
|
71
71
|
"jest": "^30.0.0",
|
|
72
72
|
"styled-components": "~5.3.9",
|
|
73
73
|
"styled-system": "^5.1.5",
|
|
74
|
-
"@elliemae/ds-
|
|
75
|
-
"@elliemae/ds-
|
|
76
|
-
"@elliemae/ds-toolbar-v2": "3.70.0-next.
|
|
77
|
-
"@elliemae/ds-
|
|
74
|
+
"@elliemae/ds-tabs": "3.70.0-next.50",
|
|
75
|
+
"@elliemae/ds-test-utils": "3.70.0-next.50",
|
|
76
|
+
"@elliemae/ds-toolbar-v2": "3.70.0-next.50",
|
|
77
|
+
"@elliemae/ds-monorepo-devops": "3.70.0-next.50"
|
|
78
78
|
},
|
|
79
79
|
"peerDependencies": {
|
|
80
80
|
"lodash-es": "^4.18.1",
|