@elliemae/ds-data-table 3.50.0-next.1 → 3.50.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/DSDataTableDefinitions.js +1 -1
- package/dist/cjs/DSDataTableDefinitions.js.map +1 -1
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +1 -2
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/cjs/configs/useAutocalculated/index.js +2 -13
- package/dist/cjs/configs/useAutocalculated/index.js.map +2 -2
- package/dist/cjs/configs/useTableColsWithAddons.js +24 -3
- package/dist/cjs/configs/useTableColsWithAddons.js.map +2 -2
- package/dist/cjs/exported-related/Toolbar/Toolbar.js +2 -1
- package/dist/cjs/exported-related/Toolbar/Toolbar.js.map +2 -2
- package/dist/cjs/parts/FilterBar/DeprecatedDropdown.js +6 -1
- package/dist/cjs/parts/FilterBar/DeprecatedDropdown.js.map +2 -2
- package/dist/cjs/parts/HoC/withConditionalDnDSortableContext.js.map +2 -2
- package/dist/cjs/parts/SortByCaret.js +1 -1
- package/dist/cjs/parts/SortByCaret.js.map +2 -2
- package/dist/cjs/types/FunctionalHoC.js.map +1 -1
- package/dist/esm/DSDataTableDefinitions.js +1 -1
- package/dist/esm/DSDataTableDefinitions.js.map +1 -1
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +1 -2
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/esm/configs/useAutocalculated/index.js +2 -13
- package/dist/esm/configs/useAutocalculated/index.js.map +2 -2
- package/dist/esm/configs/useTableColsWithAddons.js +24 -3
- package/dist/esm/configs/useTableColsWithAddons.js.map +2 -2
- package/dist/esm/exported-related/Toolbar/Toolbar.js +2 -1
- package/dist/esm/exported-related/Toolbar/Toolbar.js.map +2 -2
- package/dist/esm/parts/FilterBar/DeprecatedDropdown.js +6 -1
- package/dist/esm/parts/FilterBar/DeprecatedDropdown.js.map +2 -2
- package/dist/esm/parts/HoC/withConditionalDnDSortableContext.js.map +2 -2
- package/dist/esm/parts/SortByCaret.js +1 -1
- package/dist/esm/parts/SortByCaret.js.map +2 -2
- package/dist/types/DSDataTableDefinitions.d.ts +1 -1
- package/dist/types/configs/useTableColsWithAddons.d.ts +1 -2
- package/dist/types/parts/Headers/index.d.ts +1 -1
- package/dist/types/parts/HoC/withConditionalDnDSortableContext.d.ts +1 -1
- package/dist/types/parts/MainContent.d.ts +1 -0
- package/dist/types/parts/Rows.d.ts +1 -1
- package/dist/types/parts/SortableHeaderCell.d.ts +1 -0
- package/dist/types/types/FunctionalHoC.d.ts +1 -1
- package/package.json +32 -30
|
@@ -33,7 +33,7 @@ __export(DSDataTableDefinitions_exports, {
|
|
|
33
33
|
});
|
|
34
34
|
module.exports = __toCommonJS(DSDataTableDefinitions_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
|
-
const DSDataTableName = "
|
|
36
|
+
const DSDataTableName = "DSDatatable";
|
|
37
37
|
const DSDataTableSlots = {
|
|
38
38
|
ROOT: "root",
|
|
39
39
|
CONTENT_WRAPPER: "content-wrapper",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSDataTableDefinitions.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export const DSDataTableName = '
|
|
4
|
+
"sourcesContent": ["export const DSDataTableName = 'DSDatatable';\n\nexport const DSDataTableSlots = {\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: 'cell-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};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,kBAAkB;AAExB,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;AACtB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -138,10 +138,9 @@ const multiSelectColumn = {
|
|
|
138
138
|
(e) => {
|
|
139
139
|
setIsShiftPressed(false);
|
|
140
140
|
isShiftPressedKeyRef.current = false;
|
|
141
|
-
lastSelected.current = -1;
|
|
142
141
|
e.stopPropagation();
|
|
143
142
|
},
|
|
144
|
-
[
|
|
143
|
+
[setIsShiftPressed]
|
|
145
144
|
);
|
|
146
145
|
const stopThePropagation = (0, import_react.useCallback)((e) => {
|
|
147
146
|
if (e.shiftKey) {
|
|
@@ -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 React, { useMemo, useRef, useCallback, createRef } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { uid as genUid } from 'uid';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/useStore.js';\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\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 <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 );\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 } = row;\n const selectedState = selection?.[uid] ?? false;\n\n const isShiftPressedKeyRef = useRef(false);\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n const 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 = Number.parseInt(uid, 10);\n if ((isShiftPressed || isShiftPressedKeyRef.current) && lastSelected.current > -1) {\n for (let i = Math.min(lastSelected.current, now); i <= Math.max(lastSelected.current, now); i += 1) {\n const correctDataIndex = flattenedData[i]?.id;\n if (!Object.keys(disabledRows).includes(correctDataIndex))\n newSelection[correctDataIndex] = newSelection[lastSelected.current];\n if (!newSelection[correctDataIndex]) delete newSelection[correctDataIndex];\n }\n }\n lastSelected.current = now;\n onSelectionChange(newSelection, uid, e);\n },\n [disabledRows, flattenedData, isShiftPressed, lastSelected, onSelectionChange, selection, uid],\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
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-statements */\nimport React, { useMemo, useRef, useCallback, createRef } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { uid as genUid } from 'uid';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/useStore.js';\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\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 <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 );\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 } = row;\n const selectedState = selection?.[uid] ?? false;\n\n const isShiftPressedKeyRef = useRef(false);\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n const 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 = Number.parseInt(uid, 10);\n if ((isShiftPressed || isShiftPressedKeyRef.current) && lastSelected.current > -1) {\n for (let i = Math.min(lastSelected.current, now); i <= Math.max(lastSelected.current, now); i += 1) {\n const correctDataIndex = flattenedData[i]?.id;\n if (!Object.keys(disabledRows).includes(correctDataIndex))\n newSelection[correctDataIndex] = newSelection[lastSelected.current];\n if (!newSelection[correctDataIndex]) delete newSelection[correctDataIndex];\n }\n }\n lastSelected.current = now;\n onSelectionChange(newSelection, uid, e);\n },\n [disabledRows, flattenedData, isShiftPressed, lastSelected, onSelectionChange, selection, uid],\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;ADyEjB;AAxEN,mBAA+D;AAC/D,8BAAqC;AACrC,iBAA8B;AAE9B,uBAA4B;AAC5B,sBAAgD;AAEzC,MAAM,oBAAiD;AAAA;AAAA,EAE5D,IAAI;AAAA;AAAA,EACJ,QAAQ,MAAM;AACZ,UAAM,wBAAoB,+BAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,gBAAY,+BAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,+BAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,uBAAmB,+BAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,gCAA4B,+BAAc,CAAC,UAAU,MAAM,yBAAyB;AAC1F,UAAM,uBAAmB,+BAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,qBAAiB,+BAAc,CAAC,UAAU,MAAM,cAAc;AACpE,UAAM,oCAAgC,+BAAc,CAAC,UAAU,MAAM,6BAA6B;AAClG,UAAM,iBAAa,+BAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,UAAM,sBAAkB,+BAAc,CAAC,UAAU,MAAM,eAAe;AAGtE,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;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;AAAA,EAEJ;AAAA,EACA,MAAM,CAAC,EAAE,MAAM,KAAK,eAAe,iBAAa,WAAAA,KAAO,CAAC,EAAE,MAAM;AAC9D,UAAM,wBAAoB,+BAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,gBAAY,+BAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,+BAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,mBAAe,+BAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,6BAAyB,+BAAc,CAAC,UAAU,MAAM,sBAAsB;AAEpF,UAAM,qBAAiB,kCAAiB,CAAC,UAAU,MAAM,cAAc;AACvE,UAAM,wBAAoB,kCAAiB,CAAC,UAAU,MAAM,iBAAiB;AAE7E,UAAM,EAAE,IAAI,IAAI;AAChB,UAAM,gBAAgB,YAAY,GAAG,KAAK;AAE1C,UAAM,2BAAuB,qBAAO,KAAK;AACzC,UAAM,sBAAkB;AAAA,MACtB,CAAC,UAAmB,MAAkE;AACpF,cAAM,eAAe,EAAE,GAAG,WAAW,CAAC,GAAG,GAAG,SAAS;AACrD,YAAI,CAAC,SAAU,QAAO,aAAa,GAAG;AACtC,cAAM,MAAM,OAAO,SAAS,KAAK,EAAE;AACnC,aAAK,kBAAkB,qBAAqB,YAAY,aAAa,UAAU,IAAI;AACjF,mBAAS,IAAI,KAAK,IAAI,aAAa,SAAS,GAAG,GAAG,KAAK,KAAK,IAAI,aAAa,SAAS,GAAG,GAAG,KAAK,GAAG;AAClG,kBAAM,mBAAmB,cAAc,CAAC,GAAG;AAC3C,gBAAI,CAAC,OAAO,KAAK,YAAY,EAAE,SAAS,gBAAgB;AACtD,2BAAa,gBAAgB,IAAI,aAAa,aAAa,OAAO;AACpE,gBAAI,CAAC,aAAa,gBAAgB,EAAG,QAAO,aAAa,gBAAgB;AAAA,UAC3E;AAAA,QACF;AACA,qBAAa,UAAU;AACvB,0BAAkB,cAAc,KAAK,CAAC;AAAA,MACxC;AAAA,MACA,CAAC,cAAc,eAAe,gBAAgB,cAAc,mBAAmB,WAAW,GAAG;AAAA,IAC/F;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
6
|
"names": ["genUid"]
|
|
7
7
|
}
|
|
@@ -33,10 +33,10 @@ __export(useAutocalculated_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(useAutocalculated_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_react = require("react");
|
|
36
|
+
var import_react_virtual = require("react-virtual");
|
|
36
37
|
var import_useTableColsWithAddons = require("../useTableColsWithAddons.js");
|
|
37
38
|
var import_useRowFlattenization = require("../useRowFlattenization.js");
|
|
38
39
|
var import_usePaginationConfig = require("../usePaginationConfig.js");
|
|
39
|
-
var import_react_virtual = require("react-virtual");
|
|
40
40
|
var import_columnsToGrid = require("../../helpers/columnsToGrid.js");
|
|
41
41
|
var import_constants = require("../constants.js");
|
|
42
42
|
var import_useTableResizeCb = require("../useTableResizeCb.js");
|
|
@@ -47,18 +47,7 @@ const useAutoCalculated = (propsWithDefaults) => {
|
|
|
47
47
|
const virtualListRef = (0, import_react.useRef)(null);
|
|
48
48
|
const columnHeaderRef = (0, import_react.useRef)(null);
|
|
49
49
|
const lastSelected = (0, import_react.useRef)(-1);
|
|
50
|
-
const
|
|
51
|
-
const visibleColumns = (0, import_react.useMemo)(
|
|
52
|
-
() => tableColsWithAddons.filter((col) => col.accessor === void 0 || !hiddenColumns?.includes(col.accessor)).map((col) => {
|
|
53
|
-
if (col.columns) {
|
|
54
|
-
col.columns = col.columns.filter(
|
|
55
|
-
(subCol) => subCol.accessor === void 0 || !hiddenColumns?.includes(subCol.accessor)
|
|
56
|
-
);
|
|
57
|
-
}
|
|
58
|
-
return col;
|
|
59
|
-
}),
|
|
60
|
-
[hiddenColumns, tableColsWithAddons]
|
|
61
|
-
);
|
|
50
|
+
const visibleColumns = (0, import_useTableColsWithAddons.useTableColsWithAddons)(propsWithDefaults, hiddenColumns);
|
|
62
51
|
const [flattenedData, allDataFlattened] = (0, import_useRowFlattenization.useRowFlattenization)(propsWithDefaults);
|
|
63
52
|
const [paginatedData, paginationHelpers] = (0, import_usePaginationConfig.usePaginationConfig)(propsWithDefaults, flattenedData);
|
|
64
53
|
const dataLength = (0, import_react.useMemo)(() => (paginatedData || flattenedData).length, [flattenedData, paginatedData]);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/configs/useAutocalculated/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-statements */\nimport { useEffect, useMemo, useRef } from 'react';\nimport { useVirtual, defaultRangeExtractor, type Range } from 'react-virtual';\nimport { type DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useTableColsWithAddons } from '../useTableColsWithAddons.js';\nimport { useRowFlattenization } from '../useRowFlattenization.js';\nimport { usePaginationConfig } from '../usePaginationConfig.js';\nimport { columnsToGrid } from '../../helpers/columnsToGrid.js';\nimport { ColsLayoutStyle } from '../constants.js';\nimport { useTableResizeCb } from '../useTableResizeCb.js';\n\nconst estimateSize = () => 36;\n\nexport const useAutoCalculated = (propsWithDefaults: DSDataTableT.InternalProps): DSDataTableT.UseAutoCalculatedT => {\n const { actionRef, colsLayoutStyle, hiddenColumns, isLoading } = propsWithDefaults;\n\n const visibleRangeRef = useRef<Range>({ start: 0, end: 0 });\n const virtualListRef = useRef<HTMLDivElement | null>(null);\n const columnHeaderRef = useRef<HTMLDivElement | null>(null);\n const lastSelected = useRef<number>(-1);\n\n // ===========================================================================\n // Column config\n // ===========================================================================\n const visibleColumns = useTableColsWithAddons(propsWithDefaults, hiddenColumns);\n\n // ===========================================================================\n // Data flattenization and pagination\n // ===========================================================================\n\n const [flattenedData, allDataFlattened] = useRowFlattenization(propsWithDefaults);\n\n const [paginatedData, paginationHelpers] = usePaginationConfig(propsWithDefaults, flattenedData);\n\n const dataLength = useMemo(() => (paginatedData || flattenedData).length, [flattenedData, paginatedData]);\n\n // estimateSize should not be really required given what was stated on\n // https://github.com/tannerlinsley/react-virtual/issues/23\n const virtualListHelpers = useVirtual({\n size: dataLength,\n parentRef: virtualListRef,\n overscan: 15,\n paddingStart: columnHeaderRef.current?.getBoundingClientRect()?.height ?? 24,\n estimateSize,\n rangeExtractor: React.useCallback((range: Range) => {\n visibleRangeRef.current = range;\n\n return defaultRangeExtractor(range);\n }, []),\n });\n\n // ===========================================================================\n // Empty content config\n // ===========================================================================\n\n const isEmptyContent = useMemo(() => !isLoading && flattenedData.length === 0, [isLoading, flattenedData.length]);\n\n const firstFocuseableColumnHeaderId = useMemo(() => {\n for (let i = 0; i < visibleColumns.length; i++) {\n const column = visibleColumns[i];\n if (column.isFocuseable === false && column.id !== 'expander' && column.id !== 'multiSelecter') {\n continue;\n }\n return column.id;\n }\n }, [visibleColumns]);\n\n // ===========================================================================\n // Layout config\n // ===========================================================================\n\n const gridLayout = useMemo(() => columnsToGrid(visibleColumns, colsLayoutStyle), [colsLayoutStyle, visibleColumns]);\n\n // We need to listen and update the state based on this props\n const totalColumnsWidth = useMemo(\n () =>\n colsLayoutStyle === ColsLayoutStyle.Fixed\n ? gridLayout.reduce((acc: number, cur: string) => acc + Number.parseInt(cur, 10), 0)\n : '100%',\n [colsLayoutStyle, gridLayout],\n );\n\n const layoutHelpers = useMemo(\n () => ({\n gridLayout,\n totalColumnsWidth,\n }),\n [gridLayout, totalColumnsWidth],\n );\n\n useTableResizeCb({ virtualListRef, propsWithDefault: propsWithDefaults });\n\n // ===========================================================================\n // Action ref setup\n // ===========================================================================\n useEffect(() => {\n if (actionRef) {\n actionRef.current.scrollToIndex = virtualListHelpers.scrollToIndex;\n actionRef.current.scrollToOffset = virtualListHelpers.scrollToOffset;\n }\n }, [actionRef, virtualListHelpers.scrollToIndex, virtualListHelpers.scrollToOffset]);\n\n return {\n visibleRangeRef,\n layoutHelpers,\n paginationHelpers,\n visibleColumns,\n virtualListHelpers,\n flattenedData: paginatedData || flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n virtualListRef,\n columnHeaderRef,\n lastSelected,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAA2C;AAC3C,2BAA8D;AAE9D,oCAAuC;AACvC,kCAAqC;AACrC,iCAAoC;AACpC,2BAA8B;AAC9B,uBAAgC;AAChC,8BAAiC;AAEjC,MAAM,eAAe,MAAM;AAEpB,MAAM,oBAAoB,CAAC,sBAAmF;AACnH,QAAM,EAAE,WAAW,iBAAiB,eAAe,UAAU,IAAI;AAEjE,QAAM,sBAAkB,qBAAc,EAAE,OAAO,GAAG,KAAK,EAAE,CAAC;AAC1D,QAAM,qBAAiB,qBAA8B,IAAI;AACzD,QAAM,sBAAkB,qBAA8B,IAAI;AAC1D,QAAM,mBAAe,qBAAe,EAAE;AAKtC,QAAM,qBAAiB,sDAAuB,mBAAmB,aAAa;AAM9E,QAAM,CAAC,eAAe,gBAAgB,QAAI,kDAAqB,iBAAiB;AAEhF,QAAM,CAAC,eAAe,iBAAiB,QAAI,gDAAoB,mBAAmB,aAAa;AAE/F,QAAM,iBAAa,sBAAQ,OAAO,iBAAiB,eAAe,QAAQ,CAAC,eAAe,aAAa,CAAC;AAIxG,QAAM,yBAAqB,iCAAW;AAAA,IACpC,MAAM;AAAA,IACN,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc,gBAAgB,SAAS,sBAAsB,GAAG,UAAU;AAAA,IAC1E;AAAA,IACA,gBAAgB,MAAM,YAAY,CAAC,UAAiB;AAClD,sBAAgB,UAAU;AAE1B,iBAAO,4CAAsB,KAAK;AAAA,IACpC,GAAG,CAAC,CAAC;AAAA,EACP,CAAC;AAMD,QAAM,qBAAiB,sBAAQ,MAAM,CAAC,aAAa,cAAc,WAAW,GAAG,CAAC,WAAW,cAAc,MAAM,CAAC;AAEhH,QAAM,oCAAgC,sBAAQ,MAAM;AAClD,aAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,YAAM,SAAS,eAAe,CAAC;AAC/B,UAAI,OAAO,iBAAiB,SAAS,OAAO,OAAO,cAAc,OAAO,OAAO,iBAAiB;AAC9F;AAAA,MACF;AACA,aAAO,OAAO;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAMnB,QAAM,iBAAa,sBAAQ,UAAM,oCAAc,gBAAgB,eAAe,GAAG,CAAC,iBAAiB,cAAc,CAAC;AAGlH,QAAM,wBAAoB;AAAA,IACxB,MACE,oBAAoB,iCAAgB,QAChC,WAAW,OAAO,CAAC,KAAa,QAAgB,MAAM,OAAO,SAAS,KAAK,EAAE,GAAG,CAAC,IACjF;AAAA,IACN,CAAC,iBAAiB,UAAU;AAAA,EAC9B;AAEA,QAAM,oBAAgB;AAAA,IACpB,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,YAAY,iBAAiB;AAAA,EAChC;AAEA,gDAAiB,EAAE,gBAAgB,kBAAkB,kBAAkB,CAAC;AAKxE,8BAAU,MAAM;AACd,QAAI,WAAW;AACb,gBAAU,QAAQ,gBAAgB,mBAAmB;AACrD,gBAAU,QAAQ,iBAAiB,mBAAmB;AAAA,IACxD;AAAA,EACF,GAAG,CAAC,WAAW,mBAAmB,eAAe,mBAAmB,cAAc,CAAC;AAEnF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe,iBAAiB;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -61,7 +61,7 @@ const useTableColsWithAddons = ({
|
|
|
61
61
|
selection,
|
|
62
62
|
dragAndDropRows,
|
|
63
63
|
noSelectionColumn
|
|
64
|
-
}) => {
|
|
64
|
+
}, hiddenColumns) => {
|
|
65
65
|
const withSelection = Boolean(selection);
|
|
66
66
|
return (0, import_react.useMemo)(() => {
|
|
67
67
|
const columnsWithAddons = [...augmentColumns(columns)];
|
|
@@ -80,7 +80,28 @@ const useTableColsWithAddons = ({
|
|
|
80
80
|
colsToAppend.forEach((col) => {
|
|
81
81
|
if (!isColumnInArrayOfColumns(columnsWithAddons, col)) columnsWithAddons.push(col);
|
|
82
82
|
});
|
|
83
|
-
return columnsWithAddons
|
|
84
|
-
|
|
83
|
+
return columnsWithAddons.filter((col) => col.accessor === void 0 || !isColumnVisible(col.accessor, col.columns, hiddenColumns)).map((col) => {
|
|
84
|
+
if (col.columns) {
|
|
85
|
+
col.columns = col.columns.filter(
|
|
86
|
+
(subCol) => subCol.accessor === void 0 || !hiddenColumns?.includes(subCol.accessor)
|
|
87
|
+
);
|
|
88
|
+
}
|
|
89
|
+
return col;
|
|
90
|
+
});
|
|
91
|
+
}, [
|
|
92
|
+
columns,
|
|
93
|
+
isExpandable,
|
|
94
|
+
withSelection,
|
|
95
|
+
noSelectionColumn,
|
|
96
|
+
dragAndDropRows,
|
|
97
|
+
renderRowActions,
|
|
98
|
+
selectSingle,
|
|
99
|
+
hiddenColumns
|
|
100
|
+
]);
|
|
101
|
+
};
|
|
102
|
+
const isColumnVisible = (columnAccessor, columns, hiddenColumns) => {
|
|
103
|
+
if (!columns) return hiddenColumns.includes(columnAccessor);
|
|
104
|
+
if (hiddenColumns.includes(columnAccessor)) return true;
|
|
105
|
+
return columns.every((col) => hiddenColumns.includes(col.accessor || col.id));
|
|
85
106
|
};
|
|
86
107
|
//# sourceMappingURL=useTableColsWithAddons.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/configs/useTableColsWithAddons.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-params */\nimport { createRef, useMemo } from 'react';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport {\n dragHandleColumn,\n expandRowColumn,\n actionColumn,\n singleSelectColumn,\n multiSelectColumn,\n} from '../addons/Columns/index.js';\n\
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable max-params */\nimport { createRef, useMemo } from 'react';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport {\n dragHandleColumn,\n expandRowColumn,\n actionColumn,\n singleSelectColumn,\n multiSelectColumn,\n} from '../addons/Columns/index.js';\n\nconst augmentColumns = (columns: DSDataTableT.Column[]): DSDataTableT.InternalColumn[] => {\n const augmentColumn = (\n column: DSDataTableT.Column,\n index: number,\n parentId: string | null = null,\n depth = 0,\n ): DSDataTableT.InternalColumn => {\n let id = `column${index}`;\n if (typeof column.Header === 'string') id = column.Header;\n if (typeof column.accessor === 'string') id = column.accessor;\n const { columns: childColumns, ...restOfColumn } = column;\n const newCol: DSDataTableT.InternalColumn = {\n id,\n parentId,\n depth,\n ...restOfColumn,\n ref: createRef<HTMLTableColElement>() as React.MutableRefObject<HTMLTableColElement>,\n };\n if (childColumns) newCol.columns = childColumns.map((col, i) => augmentColumn(col, i, id, depth + 1));\n return newCol;\n };\n return columns.map((col, index) => augmentColumn(col, index));\n};\n\nconst isColumnInArrayOfColumns = (columns: DSDataTableT.Column[], col: DSDataTableT.Column) =>\n columns.some((column) => column.id === col.id);\n\nconst useTableColsWithAddons = (\n {\n columns,\n renderRowActions,\n isExpandable,\n selectSingle,\n selection,\n dragAndDropRows,\n noSelectionColumn,\n }: DSDataTableT.InternalProps,\n hiddenColumns: string[],\n) => {\n const withSelection = Boolean(selection);\n\n return useMemo(() => {\n const columnsWithAddons = [...augmentColumns(columns)];\n // Columns to be prepended\n const colsToPrepend: DSDataTableT.InternalColumn[] = [];\n // Columns to be appended\n const colsToAppend: DSDataTableT.InternalColumn[] = [];\n\n if (isExpandable) colsToPrepend.push(expandRowColumn);\n if (withSelection && !noSelectionColumn) {\n if (selectSingle) colsToPrepend.push(singleSelectColumn as unknown as DSDataTableT.InternalColumn);\n else colsToPrepend.push(multiSelectColumn as unknown as DSDataTableT.InternalColumn);\n }\n if (dragAndDropRows) colsToPrepend.push(dragHandleColumn as unknown as DSDataTableT.InternalColumn);\n if (renderRowActions) colsToAppend.push(actionColumn(renderRowActions));\n\n // Prepend or append all the columns that were not extended by the user\n colsToPrepend.forEach((col) => {\n if (!isColumnInArrayOfColumns(columnsWithAddons, col)) columnsWithAddons.unshift(col);\n });\n colsToAppend.forEach((col) => {\n if (!isColumnInArrayOfColumns(columnsWithAddons, col)) columnsWithAddons.push(col);\n });\n\n return columnsWithAddons\n .filter((col) => col.accessor === undefined || !isColumnVisible(col.accessor, col.columns, hiddenColumns))\n .map((col) => {\n if (col.columns) {\n col.columns = col.columns.filter(\n (subCol: DSDataTableT.Column) => subCol.accessor === undefined || !hiddenColumns?.includes(subCol.accessor),\n );\n }\n return col;\n });\n }, [\n columns,\n isExpandable,\n withSelection,\n noSelectionColumn,\n dragAndDropRows,\n renderRowActions,\n selectSingle,\n hiddenColumns,\n ]);\n};\n\nexport { useTableColsWithAddons };\n\nconst isColumnVisible = (\n columnAccessor: string,\n columns: DSDataTableT.Column[] | undefined,\n hiddenColumns: string[],\n) => {\n if (!columns) return hiddenColumns.includes(columnAccessor);\n if (hiddenColumns.includes(columnAccessor)) return true;\n return columns.every((col) => hiddenColumns.includes(col.accessor || col.id!));\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAAmC;AAEnC,qBAMO;AAEP,MAAM,iBAAiB,CAAC,YAAkE;AACxF,QAAM,gBAAgB,CACpB,QACA,OACA,WAA0B,MAC1B,QAAQ,MACwB;AAChC,QAAI,KAAK,SAAS,KAAK;AACvB,QAAI,OAAO,OAAO,WAAW,SAAU,MAAK,OAAO;AACnD,QAAI,OAAO,OAAO,aAAa,SAAU,MAAK,OAAO;AACrD,UAAM,EAAE,SAAS,cAAc,GAAG,aAAa,IAAI;AACnD,UAAM,SAAsC;AAAA,MAC1C;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,SAAK,wBAA+B;AAAA,IACtC;AACA,QAAI,aAAc,QAAO,UAAU,aAAa,IAAI,CAAC,KAAK,MAAM,cAAc,KAAK,GAAG,IAAI,QAAQ,CAAC,CAAC;AACpG,WAAO;AAAA,EACT;AACA,SAAO,QAAQ,IAAI,CAAC,KAAK,UAAU,cAAc,KAAK,KAAK,CAAC;AAC9D;AAEA,MAAM,2BAA2B,CAAC,SAAgC,QAChE,QAAQ,KAAK,CAAC,WAAW,OAAO,OAAO,IAAI,EAAE;AAE/C,MAAM,yBAAyB,CAC7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GACA,kBACG;AACH,QAAM,gBAAgB,QAAQ,SAAS;AAEvC,aAAO,sBAAQ,MAAM;AACnB,UAAM,oBAAoB,CAAC,GAAG,eAAe,OAAO,CAAC;AAErD,UAAM,gBAA+C,CAAC;AAEtD,UAAM,eAA8C,CAAC;AAErD,QAAI,aAAc,eAAc,KAAK,8BAAe;AACpD,QAAI,iBAAiB,CAAC,mBAAmB;AACvC,UAAI,aAAc,eAAc,KAAK,iCAA4D;AAAA,UAC5F,eAAc,KAAK,gCAA2D;AAAA,IACrF;AACA,QAAI,gBAAiB,eAAc,KAAK,+BAA0D;AAClG,QAAI,iBAAkB,cAAa,SAAK,6BAAa,gBAAgB,CAAC;AAGtE,kBAAc,QAAQ,CAAC,QAAQ;AAC7B,UAAI,CAAC,yBAAyB,mBAAmB,GAAG,EAAG,mBAAkB,QAAQ,GAAG;AAAA,IACtF,CAAC;AACD,iBAAa,QAAQ,CAAC,QAAQ;AAC5B,UAAI,CAAC,yBAAyB,mBAAmB,GAAG,EAAG,mBAAkB,KAAK,GAAG;AAAA,IACnF,CAAC;AAED,WAAO,kBACJ,OAAO,CAAC,QAAQ,IAAI,aAAa,UAAa,CAAC,gBAAgB,IAAI,UAAU,IAAI,SAAS,aAAa,CAAC,EACxG,IAAI,CAAC,QAAQ;AACZ,UAAI,IAAI,SAAS;AACf,YAAI,UAAU,IAAI,QAAQ;AAAA,UACxB,CAAC,WAAgC,OAAO,aAAa,UAAa,CAAC,eAAe,SAAS,OAAO,QAAQ;AAAA,QAC5G;AAAA,MACF;AACA,aAAO;AAAA,IACT,CAAC;AAAA,EACL,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACH;AAIA,MAAM,kBAAkB,CACtB,gBACA,SACA,kBACG;AACH,MAAI,CAAC,QAAS,QAAO,cAAc,SAAS,cAAc;AAC1D,MAAI,cAAc,SAAS,cAAc,EAAG,QAAO;AACnD,SAAO,QAAQ,MAAM,CAAC,QAAQ,cAAc,SAAS,IAAI,YAAY,IAAI,EAAG,CAAC;AAC/E;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/exported-related/Toolbar/Toolbar.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { styled, css, mergeRefs } from '@elliemae/ds-system';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst ToolbarBtns = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;\n\nconst boxShadow = css`\n box-shadow:\n 0 1px 2px 0 rgba(0, 0, 0, 0.13),\n 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n`;\n\nconst ToolbarWrapper = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_WRAPPER })<{\n isOpen: boolean;\n}>`\n display: flex;\n align-items: center;\n pointer-events: all;\n\n & .toolbar-trigger:focus {\n z-index: 8;\n }\n\n ${({ isOpen }) => isOpen && boxShadow}\n`;\n\nconst StyledButton = styled(DSButtonV3, { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTON })`\n background-color: transparent;\n`;\n\nconst ToolbarPosition = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_POSITION })`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: transparent;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left:
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { styled, css, mergeRefs } from '@elliemae/ds-system';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst ToolbarBtns = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;\n\nconst boxShadow = css`\n box-shadow:\n 0 1px 2px 0 rgba(0, 0, 0, 0.13),\n 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n`;\n\nconst ToolbarWrapper = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_WRAPPER })<{\n isOpen: boolean;\n}>`\n display: flex;\n align-items: center;\n pointer-events: all;\n\n & .toolbar-trigger:focus {\n z-index: 8;\n }\n\n ${({ isOpen }) => isOpen && boxShadow}\n`;\n\nconst StyledButton = styled(DSButtonV3, { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTON })`\n background-color: transparent;\n`;\n\nconst ToolbarPosition = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_POSITION })`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: transparent;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left: 1px;\n padding-right: 1px;\n outline: none;\n &:hover {\n z-index: 1;\n }\n :after {\n content: '';\n position: absolute;\n left: 0px;\n top: 4px;\n bottom: 4px;\n width: 1px;\n background-color: neutral-080;\n z-index: 7;\n }\n`;\n\ninterface ToolbarProps {\n isRowSelected?: boolean;\n cell: DSDataTableT.Cell;\n children: React.ReactNode;\n}\n\nexport const Toolbar: React.ComponentType<ToolbarProps> = ({ isRowSelected, cell, children }) => {\n const [show, setShow] = useState(false);\n\n const toolbarRef = useRef<HTMLDivElement | null>(null);\n const toolbarTriggerRef = useRef<HTMLButtonElement | null>(null);\n\n const handleOnClickOutside = useCallback(() => setShow(false), []);\n\n const handleOnClick = useCallback(() => setShow((prev) => !prev), []);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n\n const stopPropagation: React.MouseEventHandler = useCallback((e) => e.stopPropagation(), []);\n\n useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n const onToolbarKeyDown = useCallback((e: React.KeyboardEvent) => {\n if (e.code === 'Escape') {\n setShow(false);\n toolbarTriggerRef.current?.focus();\n }\n e.stopPropagation();\n }, []);\n\n const handleOnBlurToolBar = useCallback(() => {\n setTimeout(() => {\n if (!toolbarRef?.current?.contains?.(document.activeElement)) {\n setShow(false);\n }\n });\n }, []);\n\n return (\n <ToolbarPosition onBlur={handleOnBlurToolBar} innerRef={toolbarRef} tabIndex={-1} getOwnerProps={getOwnerProps}>\n <ToolbarWrapper\n onKeyDown={onToolbarKeyDown}\n onClick={stopPropagation}\n isOpen={show}\n getOwnerProps={getOwnerProps}\n >\n {show && <ToolbarBtns getOwnerProps={getOwnerProps}>{children}</ToolbarBtns>}\n <StyledButton\n buttonType=\"icon\"\n className=\"toolbar-trigger\"\n data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n innerRef={mergeRefs(toolbarTriggerRef, cell?.ref)}\n onClick={handleOnClick}\n tabIndex={isRowSelected === false ? -1 : 0}\n aria-label=\"Row actions\"\n >\n <MoreOptionsVert />\n </StyledButton>\n </ToolbarWrapper>\n </ToolbarPosition>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0GjB;AA1GN,mBAAqD;AACrD,gCAA8B;AAC9B,uBAAuC;AACvC,0BAA2B;AAC3B,sBAAgC;AAChC,uBAA4B;AAE5B,oCAAkD;AAClD,sBAA8B;AAE9B,MAAM,kBAAc,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,wBAAwB,CAAC;AAE3G,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,MAAM,qBAAiB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWlG,CAAC,EAAE,OAAO,MAAM,UAAU,SAAS;AAAA;AAGvC,MAAM,mBAAe,yBAAO,gCAAY,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,eAAe,CAAC;AAAA;AAAA;AAIxG,MAAM,sBAAkB,yBAAO,OAAO,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,iBAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCjG,MAAM,UAA6C,CAAC,EAAE,eAAe,MAAM,SAAS,MAAM;AAC/F,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,KAAK;AAEtC,QAAM,iBAAa,qBAA8B,IAAI;AACrD,QAAM,wBAAoB,qBAAiC,IAAI;AAE/D,QAAM,2BAAuB,0BAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAEjE,QAAM,oBAAgB,0BAAY,MAAM,QAAQ,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,CAAC;AAEpE,QAAM,oBAAgB,+BAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,sBAA2C,0BAAY,CAAC,MAAM,EAAE,gBAAgB,GAAG,CAAC,CAAC;AAE3F,gCAAAA,SAAkB,YAAY,oBAAoB;AAElD,QAAM,uBAAmB,0BAAY,CAAC,MAA2B;AAC/D,QAAI,EAAE,SAAS,UAAU;AACvB,cAAQ,KAAK;AACb,wBAAkB,SAAS,MAAM;AAAA,IACnC;AACA,MAAE,gBAAgB;AAAA,EACpB,GAAG,CAAC,CAAC;AAEL,QAAM,0BAAsB,0BAAY,MAAM;AAC5C,eAAW,MAAM;AACf,UAAI,CAAC,YAAY,SAAS,WAAW,SAAS,aAAa,GAAG;AAC5D,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SACE,4CAAC,mBAAgB,QAAQ,qBAAqB,UAAU,YAAY,UAAU,IAAI,eAChF;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA,gBAAQ,4CAAC,eAAY,eAA+B,UAAS;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAa,6BAAY;AAAA,YACzB,cAAU,4BAAU,mBAAmB,MAAM,GAAG;AAAA,YAChD,SAAS;AAAA,YACT,UAAU,kBAAkB,QAAQ,KAAK;AAAA,YACzC,cAAW;AAAA,YAEX,sDAAC,mCAAgB;AAAA;AAAA,QACnB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;",
|
|
6
6
|
"names": ["useOnClickOutside"]
|
|
7
7
|
}
|
|
@@ -61,7 +61,12 @@ const DeprecatedDropdown = ({
|
|
|
61
61
|
if (["Enter", "Space"].includes(e.code)) removeAllFilters();
|
|
62
62
|
}
|
|
63
63
|
},
|
|
64
|
-
...filterBarProps?.extraOptions || []
|
|
64
|
+
...(filterBarProps?.extraOptions || []).map((option) => ({
|
|
65
|
+
...option,
|
|
66
|
+
onKeyDown: (e) => {
|
|
67
|
+
if (["Enter", "Space"].includes(e.code)) option?.onClick?.(e);
|
|
68
|
+
}
|
|
69
|
+
}))
|
|
65
70
|
],
|
|
66
71
|
triggerComponent: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
67
72
|
import_ds_button_v2.DSButtonV2,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/FilterBar/DeprecatedDropdown.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck This is using the deprecated dropdown menu\nimport React from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { DATA_TESTID } from '../../configs/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface DeprecatedDropdownProps {\n finalIsOpen: boolean;\n onFilterBarClose: () => void;\n onFilterBarOnClickOutside: () => void;\n removeAllFilters: () => void;\n filterBarProps: DSDataTableT.Props['filterBarProps'];\n dropdownMenuRef: React.MutableRefObject<HTMLButtonElement | null>;\n onTriggerClick: () => void;\n}\n\nexport const DeprecatedDropdown: React.ComponentType<DeprecatedDropdownProps> = ({\n finalIsOpen,\n onFilterBarClose,\n onFilterBarOnClickOutside,\n removeAllFilters,\n filterBarProps,\n dropdownMenuRef,\n onTriggerClick,\n}) => (\n <DSDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n aria-label=\"Filter bar addon\"\n style={{ marginLeft: 'auto' }}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck This is using the deprecated dropdown menu\nimport React from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { DATA_TESTID } from '../../configs/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface DeprecatedDropdownProps {\n finalIsOpen: boolean;\n onFilterBarClose: () => void;\n onFilterBarOnClickOutside: () => void;\n removeAllFilters: () => void;\n filterBarProps: DSDataTableT.Props['filterBarProps'];\n dropdownMenuRef: React.MutableRefObject<HTMLButtonElement | null>;\n onTriggerClick: () => void;\n}\n\nexport const DeprecatedDropdown: React.ComponentType<DeprecatedDropdownProps> = ({\n finalIsOpen,\n onFilterBarClose,\n onFilterBarOnClickOutside,\n removeAllFilters,\n filterBarProps,\n dropdownMenuRef,\n onTriggerClick,\n}) => (\n <DSDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []).map((option) => ({\n ...option,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) option?.onClick?.(e);\n },\n })),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n aria-label=\"Filter bar addon\"\n style={{ marginLeft: 'auto' }}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD0Df;AAvDR,0BAA2B;AAC3B,sBAAgC;AAChC,6BAA+B;AAC/B,qBAA4B;AAarB,MAAM,qBAAmE,CAAC;AAAA,EAC/E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC,iBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,oBAAoB;AAAA,IACpB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,kBAAiB;AAAA,QAC5D;AAAA,MACF;AAAA,MACA,IAAI,gBAAgB,gBAAgB,CAAC,GAAG,IAAI,CAAC,YAAY;AAAA,QACvD,GAAG;AAAA,QACH,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,SAAQ,UAAU,CAAC;AAAA,QAC9D;AAAA,MACF,EAAE;AAAA,IACJ;AAAA,IACA,kBACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa,2BAAY;AAAA,QACzB,YAAW;AAAA,QACX,UAAU;AAAA,QACV,SAAS;AAAA,QACT,cAAW;AAAA,QACX,OAAO,EAAE,YAAY,OAAO;AAAA,QAE5B,sDAAC,mCAAgB;AAAA;AAAA,IACnB;AAAA;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/HoC/withConditionalDnDSortableContext.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport { horizontalListSortingStrategy, SortableContext } from '@elliemae/ds-drag-and-drop';\nimport React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\ninterface Props {\n items: DSDataTableT.InternalColumn[];\n isDragOverlay: boolean;\n}\n\nexport const withConditionalDnDSortableContext =\n <T,>(Component: React.ComponentType<T>) =>\n (props: T & JSX.IntrinsicAttributes & Props) => {\n const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n\n const { isDragOverlay, items } = props;\n\n // Only add the context if it's not a dragOverlay and dnd for cols was requested\n // It's important that drag overlays DO NOT have any sortable functionality!\n if (!isDragOverlay && dragAndDropColumns)\n return (\n <SortableContext items={items.map((item) => item.id)} strategy={horizontalListSortingStrategy}>\n <Component {...props} />\n </SortableContext>\n );\n\n return <Component {...props} />;\n };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBb;AAtBV,8BAA+D;AAG/D,sBAA8B;AAOvB,MAAM,oCACX,CAAK,cACL,CAAC,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable react/function-component-definition */\nimport { horizontalListSortingStrategy, SortableContext } from '@elliemae/ds-drag-and-drop';\nimport React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\ninterface Props {\n items: DSDataTableT.InternalColumn[];\n isDragOverlay: boolean;\n}\n\nexport const withConditionalDnDSortableContext =\n <T,>(Component: React.ComponentType<T>) =>\n (props: T & React.JSX.IntrinsicAttributes & Props) => {\n const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n\n const { isDragOverlay, items } = props;\n\n // Only add the context if it's not a dragOverlay and dnd for cols was requested\n // It's important that drag overlays DO NOT have any sortable functionality!\n if (!isDragOverlay && dragAndDropColumns)\n return (\n <SortableContext items={items.map((item) => item.id)} strategy={horizontalListSortingStrategy}>\n <Component {...props} />\n </SortableContext>\n );\n\n return <Component {...props} />;\n };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADuBb;AAtBV,8BAA+D;AAG/D,sBAA8B;AAOvB,MAAM,oCACX,CAAK,cACL,CAAC,UAAqD;AACpD,QAAM,yBAAqB,+BAAc,CAAC,UAAU,MAAM,kBAAkB;AAE5E,QAAM,EAAE,eAAe,MAAM,IAAI;AAIjC,MAAI,CAAC,iBAAiB;AACpB,WACE,4CAAC,2CAAgB,OAAO,MAAM,IAAI,CAAC,SAAS,KAAK,EAAE,GAAG,UAAU,uDAC9D,sDAAC,aAAW,GAAG,OAAO,GACxB;AAGJ,SAAO,4CAAC,aAAW,GAAG,OAAO;AAC/B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -56,7 +56,7 @@ const SortByCaret = import_react.default.memo(({ isSortedDesc, isReachable, redu
|
|
|
56
56
|
}
|
|
57
57
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.ArrowheadUp, { color: iconColor });
|
|
58
58
|
}, [isSortedDesc]);
|
|
59
|
-
if (!showSortCaret && !isMenuOpen && !isIconVisible) return null;
|
|
59
|
+
if (!showSortCaret && !isMenuOpen && !isIconVisible && isSortedDesc === void 0) return null;
|
|
60
60
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
61
61
|
import_ds_button_v2.DSButtonV2,
|
|
62
62
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/SortByCaret.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useMemo } from 'react';\nimport type { SvgIconT } from '@elliemae/ds-icons';\nimport { ArrowheadDown, ArrowheadUp, SortNeutral } from '@elliemae/ds-icons';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { useGetFilterVisibility } from '../exported-related/FilterPopover/useGetFilterVisibility.js';\nconst iconColor: SvgIconT.ColorType = ['brand-primary', '800'];\n\nexport const SortByCaret: React.ComponentType<{\n isSortedDesc: boolean | undefined;\n onClick: (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n isReachable: boolean;\n column: DSDataTableT.InternalColumn;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.RefObject<HTMLButtonElement>;\n}> = React.memo(({ isSortedDesc, isReachable, reduxHeader, innerRef, column, onClick }) => {\n const { isMenuOpen, isIconVisible } = useGetFilterVisibility(reduxHeader);\n\n const { showSortCaret } = useMemo(\n () =>\n reduxHeader || {\n showSortCaret: false,\n },\n [reduxHeader],\n );\n\n const icon = useMemo(() => {\n if (isSortedDesc === undefined) {\n return <SortNeutral color={iconColor} />;\n }\n\n if (isSortedDesc) {\n return <ArrowheadDown size=\"s\" color={iconColor} />;\n }\n\n return <ArrowheadUp color={iconColor} />;\n }, [isSortedDesc]);\n\n if (!showSortCaret && !isMenuOpen && !isIconVisible) return null;\n\n return (\n <DSButtonV2\n onClick={onClick}\n tabIndex={isReachable ? 0 : -1}\n buttonType=\"icon\"\n style={{ marginLeft: '4px' }}\n aria-label={`Sort ${column.id} ${isSortedDesc ? 'ascending' : 'descending'}`}\n size=\"s\"\n innerRef={innerRef}\n data-testid={DATA_TESTID.DATA_TABLE_SORT_BUTTON}\n >\n {icon}\n </DSButtonV2>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BV;AA7Bb,mBAA+B;AAE/B,sBAAwD;AACxD,0BAA2B;AAE3B,uBAA4B;AAC5B,oCAAuC;AACvC,MAAM,YAAgC,CAAC,iBAAiB,KAAK;AAEtD,MAAM,cAOR,aAAAA,QAAM,KAAK,CAAC,EAAE,cAAc,aAAa,aAAa,UAAU,QAAQ,QAAQ,MAAM;AACzF,QAAM,EAAE,YAAY,cAAc,QAAI,sDAAuB,WAAW;AAExE,QAAM,EAAE,cAAc,QAAI;AAAA,IACxB,MACE,eAAe;AAAA,MACb,eAAe;AAAA,IACjB;AAAA,IACF,CAAC,WAAW;AAAA,EACd;AAEA,QAAM,WAAO,sBAAQ,MAAM;AACzB,QAAI,iBAAiB,QAAW;AAC9B,aAAO,4CAAC,+BAAY,OAAO,WAAW;AAAA,IACxC;AAEA,QAAI,cAAc;AAChB,aAAO,4CAAC,iCAAc,MAAK,KAAI,OAAO,WAAW;AAAA,IACnD;AAEA,WAAO,4CAAC,+BAAY,OAAO,WAAW;AAAA,EACxC,GAAG,CAAC,YAAY,CAAC;AAEjB,MAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,
|
|
4
|
+
"sourcesContent": ["import React, { useMemo } from 'react';\nimport type { SvgIconT } from '@elliemae/ds-icons';\nimport { ArrowheadDown, ArrowheadUp, SortNeutral } from '@elliemae/ds-icons';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { useGetFilterVisibility } from '../exported-related/FilterPopover/useGetFilterVisibility.js';\nconst iconColor: SvgIconT.ColorType = ['brand-primary', '800'];\n\nexport const SortByCaret: React.ComponentType<{\n isSortedDesc: boolean | undefined;\n onClick: (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n isReachable: boolean;\n column: DSDataTableT.InternalColumn;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.RefObject<HTMLButtonElement>;\n}> = React.memo(({ isSortedDesc, isReachable, reduxHeader, innerRef, column, onClick }) => {\n const { isMenuOpen, isIconVisible } = useGetFilterVisibility(reduxHeader);\n\n const { showSortCaret } = useMemo(\n () =>\n reduxHeader || {\n showSortCaret: false,\n },\n [reduxHeader],\n );\n\n const icon = useMemo(() => {\n if (isSortedDesc === undefined) {\n return <SortNeutral color={iconColor} />;\n }\n\n if (isSortedDesc) {\n return <ArrowheadDown size=\"s\" color={iconColor} />;\n }\n\n return <ArrowheadUp color={iconColor} />;\n }, [isSortedDesc]);\n\n if (!showSortCaret && !isMenuOpen && !isIconVisible && isSortedDesc === undefined) return null;\n\n return (\n <DSButtonV2\n onClick={onClick}\n tabIndex={isReachable ? 0 : -1}\n buttonType=\"icon\"\n style={{ marginLeft: '4px' }}\n aria-label={`Sort ${column.id} ${isSortedDesc ? 'ascending' : 'descending'}`}\n size=\"s\"\n innerRef={innerRef}\n data-testid={DATA_TESTID.DATA_TABLE_SORT_BUTTON}\n >\n {icon}\n </DSButtonV2>\n );\n});\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6BV;AA7Bb,mBAA+B;AAE/B,sBAAwD;AACxD,0BAA2B;AAE3B,uBAA4B;AAC5B,oCAAuC;AACvC,MAAM,YAAgC,CAAC,iBAAiB,KAAK;AAEtD,MAAM,cAOR,aAAAA,QAAM,KAAK,CAAC,EAAE,cAAc,aAAa,aAAa,UAAU,QAAQ,QAAQ,MAAM;AACzF,QAAM,EAAE,YAAY,cAAc,QAAI,sDAAuB,WAAW;AAExE,QAAM,EAAE,cAAc,QAAI;AAAA,IACxB,MACE,eAAe;AAAA,MACb,eAAe;AAAA,IACjB;AAAA,IACF,CAAC,WAAW;AAAA,EACd;AAEA,QAAM,WAAO,sBAAQ,MAAM;AACzB,QAAI,iBAAiB,QAAW;AAC9B,aAAO,4CAAC,+BAAY,OAAO,WAAW;AAAA,IACxC;AAEA,QAAI,cAAc;AAChB,aAAO,4CAAC,iCAAc,MAAK,KAAI,OAAO,WAAW;AAAA,IACnD;AAEA,WAAO,4CAAC,+BAAY,OAAO,WAAW;AAAA,EACxC,GAAG,CAAC,YAAY,CAAC;AAEjB,MAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,iBAAiB,iBAAiB,OAAW,QAAO;AAE1F,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,UAAU,cAAc,IAAI;AAAA,MAC5B,YAAW;AAAA,MACX,OAAO,EAAE,YAAY,MAAM;AAAA,MAC3B,cAAY,QAAQ,OAAO,EAAE,IAAI,eAAe,cAAc,YAAY;AAAA,MAC1E,MAAK;AAAA,MACL;AAAA,MACA,eAAa,6BAAY;AAAA,MAExB;AAAA;AAAA,EACH;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/types/FunctionalHoC.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type React from 'react';\n\nexport type FunctionalHOC = <T = unknown>(\n Component: React.ComponentType<T>,\n ...other: unknown[]\n) => React.ComponentType<T & JSX.IntrinsicAttributes>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\n\nexport type FunctionalHOC = <T = unknown>(\n Component: React.ComponentType<T>,\n ...other: unknown[]\n) => React.ComponentType<T & React.JSX.IntrinsicAttributes>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
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/DSDataTableDefinitions.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSDataTableName = '
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export const DSDataTableName = 'DSDatatable';\n\nexport const DSDataTableSlots = {\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: 'cell-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};\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAhB,MAAM,kBAAkB;AAExB,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;AACtB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -105,10 +105,9 @@ const multiSelectColumn = {
|
|
|
105
105
|
(e) => {
|
|
106
106
|
setIsShiftPressed(false);
|
|
107
107
|
isShiftPressedKeyRef.current = false;
|
|
108
|
-
lastSelected.current = -1;
|
|
109
108
|
e.stopPropagation();
|
|
110
109
|
},
|
|
111
|
-
[
|
|
110
|
+
[setIsShiftPressed]
|
|
112
111
|
);
|
|
113
112
|
const stopThePropagation = useCallback((e) => {
|
|
114
113
|
if (e.shiftKey) {
|
|
@@ -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 React, { useMemo, useRef, useCallback, createRef } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { uid as genUid } from 'uid';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/useStore.js';\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\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 <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 );\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 } = row;\n const selectedState = selection?.[uid] ?? false;\n\n const isShiftPressedKeyRef = useRef(false);\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n const 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 = Number.parseInt(uid, 10);\n if ((isShiftPressed || isShiftPressedKeyRef.current) && lastSelected.current > -1) {\n for (let i = Math.min(lastSelected.current, now); i <= Math.max(lastSelected.current, now); i += 1) {\n const correctDataIndex = flattenedData[i]?.id;\n if (!Object.keys(disabledRows).includes(correctDataIndex))\n newSelection[correctDataIndex] = newSelection[lastSelected.current];\n if (!newSelection[correctDataIndex]) delete newSelection[correctDataIndex];\n }\n }\n lastSelected.current = now;\n onSelectionChange(newSelection, uid, e);\n },\n [disabledRows, flattenedData, isShiftPressed, lastSelected, onSelectionChange, selection, uid],\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
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport React, { useMemo, useRef, useCallback, createRef } from 'react';\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { uid as genUid } from 'uid';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/useStore.js';\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\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 <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 );\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 } = row;\n const selectedState = selection?.[uid] ?? false;\n\n const isShiftPressedKeyRef = useRef(false);\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n const 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 = Number.parseInt(uid, 10);\n if ((isShiftPressed || isShiftPressedKeyRef.current) && lastSelected.current > -1) {\n for (let i = Math.min(lastSelected.current, now); i <= Math.max(lastSelected.current, now); i += 1) {\n const correctDataIndex = flattenedData[i]?.id;\n if (!Object.keys(disabledRows).includes(correctDataIndex))\n newSelection[correctDataIndex] = newSelection[lastSelected.current];\n if (!newSelection[correctDataIndex]) delete newSelection[correctDataIndex];\n }\n }\n lastSelected.current = now;\n onSelectionChange(newSelection, uid, e);\n },\n [disabledRows, flattenedData, isShiftPressed, lastSelected, onSelectionChange, selection, uid],\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
|
}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { useEffect, useMemo, useRef } from "react";
|
|
3
|
+
import { useVirtual, defaultRangeExtractor } from "react-virtual";
|
|
3
4
|
import { useTableColsWithAddons } from "../useTableColsWithAddons.js";
|
|
4
5
|
import { useRowFlattenization } from "../useRowFlattenization.js";
|
|
5
6
|
import { usePaginationConfig } from "../usePaginationConfig.js";
|
|
6
|
-
import { useVirtual, defaultRangeExtractor } from "react-virtual";
|
|
7
7
|
import { columnsToGrid } from "../../helpers/columnsToGrid.js";
|
|
8
8
|
import { ColsLayoutStyle } from "../constants.js";
|
|
9
9
|
import { useTableResizeCb } from "../useTableResizeCb.js";
|
|
@@ -14,18 +14,7 @@ const useAutoCalculated = (propsWithDefaults) => {
|
|
|
14
14
|
const virtualListRef = useRef(null);
|
|
15
15
|
const columnHeaderRef = useRef(null);
|
|
16
16
|
const lastSelected = useRef(-1);
|
|
17
|
-
const
|
|
18
|
-
const visibleColumns = useMemo(
|
|
19
|
-
() => tableColsWithAddons.filter((col) => col.accessor === void 0 || !hiddenColumns?.includes(col.accessor)).map((col) => {
|
|
20
|
-
if (col.columns) {
|
|
21
|
-
col.columns = col.columns.filter(
|
|
22
|
-
(subCol) => subCol.accessor === void 0 || !hiddenColumns?.includes(subCol.accessor)
|
|
23
|
-
);
|
|
24
|
-
}
|
|
25
|
-
return col;
|
|
26
|
-
}),
|
|
27
|
-
[hiddenColumns, tableColsWithAddons]
|
|
28
|
-
);
|
|
17
|
+
const visibleColumns = useTableColsWithAddons(propsWithDefaults, hiddenColumns);
|
|
29
18
|
const [flattenedData, allDataFlattened] = useRowFlattenization(propsWithDefaults);
|
|
30
19
|
const [paginatedData, paginationHelpers] = usePaginationConfig(propsWithDefaults, flattenedData);
|
|
31
20
|
const dataLength = useMemo(() => (paginatedData || flattenedData).length, [flattenedData, paginatedData]);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/configs/useAutocalculated/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-statements */\nimport { useEffect, useMemo, useRef } from 'react';\nimport { useVirtual, defaultRangeExtractor, type Range } from 'react-virtual';\nimport { type DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useTableColsWithAddons } from '../useTableColsWithAddons.js';\nimport { useRowFlattenization } from '../useRowFlattenization.js';\nimport { usePaginationConfig } from '../usePaginationConfig.js';\nimport { columnsToGrid } from '../../helpers/columnsToGrid.js';\nimport { ColsLayoutStyle } from '../constants.js';\nimport { useTableResizeCb } from '../useTableResizeCb.js';\n\nconst estimateSize = () => 36;\n\nexport const useAutoCalculated = (propsWithDefaults: DSDataTableT.InternalProps): DSDataTableT.UseAutoCalculatedT => {\n const { actionRef, colsLayoutStyle, hiddenColumns, isLoading } = propsWithDefaults;\n\n const visibleRangeRef = useRef<Range>({ start: 0, end: 0 });\n const virtualListRef = useRef<HTMLDivElement | null>(null);\n const columnHeaderRef = useRef<HTMLDivElement | null>(null);\n const lastSelected = useRef<number>(-1);\n\n // ===========================================================================\n // Column config\n // ===========================================================================\n const visibleColumns = useTableColsWithAddons(propsWithDefaults, hiddenColumns);\n\n // ===========================================================================\n // Data flattenization and pagination\n // ===========================================================================\n\n const [flattenedData, allDataFlattened] = useRowFlattenization(propsWithDefaults);\n\n const [paginatedData, paginationHelpers] = usePaginationConfig(propsWithDefaults, flattenedData);\n\n const dataLength = useMemo(() => (paginatedData || flattenedData).length, [flattenedData, paginatedData]);\n\n // estimateSize should not be really required given what was stated on\n // https://github.com/tannerlinsley/react-virtual/issues/23\n const virtualListHelpers = useVirtual({\n size: dataLength,\n parentRef: virtualListRef,\n overscan: 15,\n paddingStart: columnHeaderRef.current?.getBoundingClientRect()?.height ?? 24,\n estimateSize,\n rangeExtractor: React.useCallback((range: Range) => {\n visibleRangeRef.current = range;\n\n return defaultRangeExtractor(range);\n }, []),\n });\n\n // ===========================================================================\n // Empty content config\n // ===========================================================================\n\n const isEmptyContent = useMemo(() => !isLoading && flattenedData.length === 0, [isLoading, flattenedData.length]);\n\n const firstFocuseableColumnHeaderId = useMemo(() => {\n for (let i = 0; i < visibleColumns.length; i++) {\n const column = visibleColumns[i];\n if (column.isFocuseable === false && column.id !== 'expander' && column.id !== 'multiSelecter') {\n continue;\n }\n return column.id;\n }\n }, [visibleColumns]);\n\n // ===========================================================================\n // Layout config\n // ===========================================================================\n\n const gridLayout = useMemo(() => columnsToGrid(visibleColumns, colsLayoutStyle), [colsLayoutStyle, visibleColumns]);\n\n // We need to listen and update the state based on this props\n const totalColumnsWidth = useMemo(\n () =>\n colsLayoutStyle === ColsLayoutStyle.Fixed\n ? gridLayout.reduce((acc: number, cur: string) => acc + Number.parseInt(cur, 10), 0)\n : '100%',\n [colsLayoutStyle, gridLayout],\n );\n\n const layoutHelpers = useMemo(\n () => ({\n gridLayout,\n totalColumnsWidth,\n }),\n [gridLayout, totalColumnsWidth],\n );\n\n useTableResizeCb({ virtualListRef, propsWithDefault: propsWithDefaults });\n\n // ===========================================================================\n // Action ref setup\n // ===========================================================================\n useEffect(() => {\n if (actionRef) {\n actionRef.current.scrollToIndex = virtualListHelpers.scrollToIndex;\n actionRef.current.scrollToOffset = virtualListHelpers.scrollToOffset;\n }\n }, [actionRef, virtualListHelpers.scrollToIndex, virtualListHelpers.scrollToOffset]);\n\n return {\n visibleRangeRef,\n layoutHelpers,\n paginationHelpers,\n visibleColumns,\n virtualListHelpers,\n flattenedData: paginatedData || flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n virtualListRef,\n columnHeaderRef,\n lastSelected,\n };\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,WAAW,SAAS,cAAc;AAC3C,SAAS,YAAY,6BAAyC;AAE9D,SAAS,8BAA8B;AACvC,SAAS,4BAA4B;AACrC,SAAS,2BAA2B;AACpC,SAAS,qBAAqB;AAC9B,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AAEjC,MAAM,eAAe,MAAM;AAEpB,MAAM,oBAAoB,CAAC,sBAAmF;AACnH,QAAM,EAAE,WAAW,iBAAiB,eAAe,UAAU,IAAI;AAEjE,QAAM,kBAAkB,OAAc,EAAE,OAAO,GAAG,KAAK,EAAE,CAAC;AAC1D,QAAM,iBAAiB,OAA8B,IAAI;AACzD,QAAM,kBAAkB,OAA8B,IAAI;AAC1D,QAAM,eAAe,OAAe,EAAE;AAKtC,QAAM,iBAAiB,uBAAuB,mBAAmB,aAAa;AAM9E,QAAM,CAAC,eAAe,gBAAgB,IAAI,qBAAqB,iBAAiB;AAEhF,QAAM,CAAC,eAAe,iBAAiB,IAAI,oBAAoB,mBAAmB,aAAa;AAE/F,QAAM,aAAa,QAAQ,OAAO,iBAAiB,eAAe,QAAQ,CAAC,eAAe,aAAa,CAAC;AAIxG,QAAM,qBAAqB,WAAW;AAAA,IACpC,MAAM;AAAA,IACN,WAAW;AAAA,IACX,UAAU;AAAA,IACV,cAAc,gBAAgB,SAAS,sBAAsB,GAAG,UAAU;AAAA,IAC1E;AAAA,IACA,gBAAgB,MAAM,YAAY,CAAC,UAAiB;AAClD,sBAAgB,UAAU;AAE1B,aAAO,sBAAsB,KAAK;AAAA,IACpC,GAAG,CAAC,CAAC;AAAA,EACP,CAAC;AAMD,QAAM,iBAAiB,QAAQ,MAAM,CAAC,aAAa,cAAc,WAAW,GAAG,CAAC,WAAW,cAAc,MAAM,CAAC;AAEhH,QAAM,gCAAgC,QAAQ,MAAM;AAClD,aAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK;AAC9C,YAAM,SAAS,eAAe,CAAC;AAC/B,UAAI,OAAO,iBAAiB,SAAS,OAAO,OAAO,cAAc,OAAO,OAAO,iBAAiB;AAC9F;AAAA,MACF;AACA,aAAO,OAAO;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,cAAc,CAAC;AAMnB,QAAM,aAAa,QAAQ,MAAM,cAAc,gBAAgB,eAAe,GAAG,CAAC,iBAAiB,cAAc,CAAC;AAGlH,QAAM,oBAAoB;AAAA,IACxB,MACE,oBAAoB,gBAAgB,QAChC,WAAW,OAAO,CAAC,KAAa,QAAgB,MAAM,OAAO,SAAS,KAAK,EAAE,GAAG,CAAC,IACjF;AAAA,IACN,CAAC,iBAAiB,UAAU;AAAA,EAC9B;AAEA,QAAM,gBAAgB;AAAA,IACpB,OAAO;AAAA,MACL;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,YAAY,iBAAiB;AAAA,EAChC;AAEA,mBAAiB,EAAE,gBAAgB,kBAAkB,kBAAkB,CAAC;AAKxE,YAAU,MAAM;AACd,QAAI,WAAW;AACb,gBAAU,QAAQ,gBAAgB,mBAAmB;AACrD,gBAAU,QAAQ,iBAAiB,mBAAmB;AAAA,IACxD;AAAA,EACF,GAAG,CAAC,WAAW,mBAAmB,eAAe,mBAAmB,cAAc,CAAC;AAEnF,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe,iBAAiB;AAAA,IAChC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,7 +34,7 @@ const useTableColsWithAddons = ({
|
|
|
34
34
|
selection,
|
|
35
35
|
dragAndDropRows,
|
|
36
36
|
noSelectionColumn
|
|
37
|
-
}) => {
|
|
37
|
+
}, hiddenColumns) => {
|
|
38
38
|
const withSelection = Boolean(selection);
|
|
39
39
|
return useMemo(() => {
|
|
40
40
|
const columnsWithAddons = [...augmentColumns(columns)];
|
|
@@ -53,8 +53,29 @@ const useTableColsWithAddons = ({
|
|
|
53
53
|
colsToAppend.forEach((col) => {
|
|
54
54
|
if (!isColumnInArrayOfColumns(columnsWithAddons, col)) columnsWithAddons.push(col);
|
|
55
55
|
});
|
|
56
|
-
return columnsWithAddons
|
|
57
|
-
|
|
56
|
+
return columnsWithAddons.filter((col) => col.accessor === void 0 || !isColumnVisible(col.accessor, col.columns, hiddenColumns)).map((col) => {
|
|
57
|
+
if (col.columns) {
|
|
58
|
+
col.columns = col.columns.filter(
|
|
59
|
+
(subCol) => subCol.accessor === void 0 || !hiddenColumns?.includes(subCol.accessor)
|
|
60
|
+
);
|
|
61
|
+
}
|
|
62
|
+
return col;
|
|
63
|
+
});
|
|
64
|
+
}, [
|
|
65
|
+
columns,
|
|
66
|
+
isExpandable,
|
|
67
|
+
withSelection,
|
|
68
|
+
noSelectionColumn,
|
|
69
|
+
dragAndDropRows,
|
|
70
|
+
renderRowActions,
|
|
71
|
+
selectSingle,
|
|
72
|
+
hiddenColumns
|
|
73
|
+
]);
|
|
74
|
+
};
|
|
75
|
+
const isColumnVisible = (columnAccessor, columns, hiddenColumns) => {
|
|
76
|
+
if (!columns) return hiddenColumns.includes(columnAccessor);
|
|
77
|
+
if (hiddenColumns.includes(columnAccessor)) return true;
|
|
78
|
+
return columns.every((col) => hiddenColumns.includes(col.accessor || col.id));
|
|
58
79
|
};
|
|
59
80
|
export {
|
|
60
81
|
useTableColsWithAddons
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/configs/useTableColsWithAddons.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-params */\nimport { createRef, useMemo } from 'react';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport {\n dragHandleColumn,\n expandRowColumn,\n actionColumn,\n singleSelectColumn,\n multiSelectColumn,\n} from '../addons/Columns/index.js';\n\
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable @typescript-eslint/no-use-before-define */\n/* eslint-disable max-params */\nimport { createRef, useMemo } from 'react';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport {\n dragHandleColumn,\n expandRowColumn,\n actionColumn,\n singleSelectColumn,\n multiSelectColumn,\n} from '../addons/Columns/index.js';\n\nconst augmentColumns = (columns: DSDataTableT.Column[]): DSDataTableT.InternalColumn[] => {\n const augmentColumn = (\n column: DSDataTableT.Column,\n index: number,\n parentId: string | null = null,\n depth = 0,\n ): DSDataTableT.InternalColumn => {\n let id = `column${index}`;\n if (typeof column.Header === 'string') id = column.Header;\n if (typeof column.accessor === 'string') id = column.accessor;\n const { columns: childColumns, ...restOfColumn } = column;\n const newCol: DSDataTableT.InternalColumn = {\n id,\n parentId,\n depth,\n ...restOfColumn,\n ref: createRef<HTMLTableColElement>() as React.MutableRefObject<HTMLTableColElement>,\n };\n if (childColumns) newCol.columns = childColumns.map((col, i) => augmentColumn(col, i, id, depth + 1));\n return newCol;\n };\n return columns.map((col, index) => augmentColumn(col, index));\n};\n\nconst isColumnInArrayOfColumns = (columns: DSDataTableT.Column[], col: DSDataTableT.Column) =>\n columns.some((column) => column.id === col.id);\n\nconst useTableColsWithAddons = (\n {\n columns,\n renderRowActions,\n isExpandable,\n selectSingle,\n selection,\n dragAndDropRows,\n noSelectionColumn,\n }: DSDataTableT.InternalProps,\n hiddenColumns: string[],\n) => {\n const withSelection = Boolean(selection);\n\n return useMemo(() => {\n const columnsWithAddons = [...augmentColumns(columns)];\n // Columns to be prepended\n const colsToPrepend: DSDataTableT.InternalColumn[] = [];\n // Columns to be appended\n const colsToAppend: DSDataTableT.InternalColumn[] = [];\n\n if (isExpandable) colsToPrepend.push(expandRowColumn);\n if (withSelection && !noSelectionColumn) {\n if (selectSingle) colsToPrepend.push(singleSelectColumn as unknown as DSDataTableT.InternalColumn);\n else colsToPrepend.push(multiSelectColumn as unknown as DSDataTableT.InternalColumn);\n }\n if (dragAndDropRows) colsToPrepend.push(dragHandleColumn as unknown as DSDataTableT.InternalColumn);\n if (renderRowActions) colsToAppend.push(actionColumn(renderRowActions));\n\n // Prepend or append all the columns that were not extended by the user\n colsToPrepend.forEach((col) => {\n if (!isColumnInArrayOfColumns(columnsWithAddons, col)) columnsWithAddons.unshift(col);\n });\n colsToAppend.forEach((col) => {\n if (!isColumnInArrayOfColumns(columnsWithAddons, col)) columnsWithAddons.push(col);\n });\n\n return columnsWithAddons\n .filter((col) => col.accessor === undefined || !isColumnVisible(col.accessor, col.columns, hiddenColumns))\n .map((col) => {\n if (col.columns) {\n col.columns = col.columns.filter(\n (subCol: DSDataTableT.Column) => subCol.accessor === undefined || !hiddenColumns?.includes(subCol.accessor),\n );\n }\n return col;\n });\n }, [\n columns,\n isExpandable,\n withSelection,\n noSelectionColumn,\n dragAndDropRows,\n renderRowActions,\n selectSingle,\n hiddenColumns,\n ]);\n};\n\nexport { useTableColsWithAddons };\n\nconst isColumnVisible = (\n columnAccessor: string,\n columns: DSDataTableT.Column[] | undefined,\n hiddenColumns: string[],\n) => {\n if (!columns) return hiddenColumns.includes(columnAccessor);\n if (hiddenColumns.includes(columnAccessor)) return true;\n return columns.every((col) => hiddenColumns.includes(col.accessor || col.id!));\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,WAAW,eAAe;AAEnC;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,iBAAiB,CAAC,YAAkE;AACxF,QAAM,gBAAgB,CACpB,QACA,OACA,WAA0B,MAC1B,QAAQ,MACwB;AAChC,QAAI,KAAK,SAAS,KAAK;AACvB,QAAI,OAAO,OAAO,WAAW,SAAU,MAAK,OAAO;AACnD,QAAI,OAAO,OAAO,aAAa,SAAU,MAAK,OAAO;AACrD,UAAM,EAAE,SAAS,cAAc,GAAG,aAAa,IAAI;AACnD,UAAM,SAAsC;AAAA,MAC1C;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAG;AAAA,MACH,KAAK,UAA+B;AAAA,IACtC;AACA,QAAI,aAAc,QAAO,UAAU,aAAa,IAAI,CAAC,KAAK,MAAM,cAAc,KAAK,GAAG,IAAI,QAAQ,CAAC,CAAC;AACpG,WAAO;AAAA,EACT;AACA,SAAO,QAAQ,IAAI,CAAC,KAAK,UAAU,cAAc,KAAK,KAAK,CAAC;AAC9D;AAEA,MAAM,2BAA2B,CAAC,SAAgC,QAChE,QAAQ,KAAK,CAAC,WAAW,OAAO,OAAO,IAAI,EAAE;AAE/C,MAAM,yBAAyB,CAC7B;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GACA,kBACG;AACH,QAAM,gBAAgB,QAAQ,SAAS;AAEvC,SAAO,QAAQ,MAAM;AACnB,UAAM,oBAAoB,CAAC,GAAG,eAAe,OAAO,CAAC;AAErD,UAAM,gBAA+C,CAAC;AAEtD,UAAM,eAA8C,CAAC;AAErD,QAAI,aAAc,eAAc,KAAK,eAAe;AACpD,QAAI,iBAAiB,CAAC,mBAAmB;AACvC,UAAI,aAAc,eAAc,KAAK,kBAA4D;AAAA,UAC5F,eAAc,KAAK,iBAA2D;AAAA,IACrF;AACA,QAAI,gBAAiB,eAAc,KAAK,gBAA0D;AAClG,QAAI,iBAAkB,cAAa,KAAK,aAAa,gBAAgB,CAAC;AAGtE,kBAAc,QAAQ,CAAC,QAAQ;AAC7B,UAAI,CAAC,yBAAyB,mBAAmB,GAAG,EAAG,mBAAkB,QAAQ,GAAG;AAAA,IACtF,CAAC;AACD,iBAAa,QAAQ,CAAC,QAAQ;AAC5B,UAAI,CAAC,yBAAyB,mBAAmB,GAAG,EAAG,mBAAkB,KAAK,GAAG;AAAA,IACnF,CAAC;AAED,WAAO,kBACJ,OAAO,CAAC,QAAQ,IAAI,aAAa,UAAa,CAAC,gBAAgB,IAAI,UAAU,IAAI,SAAS,aAAa,CAAC,EACxG,IAAI,CAAC,QAAQ;AACZ,UAAI,IAAI,SAAS;AACf,YAAI,UAAU,IAAI,QAAQ;AAAA,UACxB,CAAC,WAAgC,OAAO,aAAa,UAAa,CAAC,eAAe,SAAS,OAAO,QAAQ;AAAA,QAC5G;AAAA,MACF;AACA,aAAO;AAAA,IACT,CAAC;AAAA,EACL,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AACH;AAIA,MAAM,kBAAkB,CACtB,gBACA,SACA,kBACG;AACH,MAAI,CAAC,QAAS,QAAO,cAAc,SAAS,cAAc;AAC1D,MAAI,cAAc,SAAS,cAAc,EAAG,QAAO;AACnD,SAAO,QAAQ,MAAM,CAAC,QAAQ,cAAc,SAAS,IAAI,YAAY,IAAI,EAAG,CAAC;AAC/E;",
|
|
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/exported-related/Toolbar/Toolbar.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { styled, css, mergeRefs } from '@elliemae/ds-system';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst ToolbarBtns = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;\n\nconst boxShadow = css`\n box-shadow:\n 0 1px 2px 0 rgba(0, 0, 0, 0.13),\n 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n`;\n\nconst ToolbarWrapper = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_WRAPPER })<{\n isOpen: boolean;\n}>`\n display: flex;\n align-items: center;\n pointer-events: all;\n\n & .toolbar-trigger:focus {\n z-index: 8;\n }\n\n ${({ isOpen }) => isOpen && boxShadow}\n`;\n\nconst StyledButton = styled(DSButtonV3, { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTON })`\n background-color: transparent;\n`;\n\nconst ToolbarPosition = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_POSITION })`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: transparent;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left:
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { styled, css, mergeRefs } from '@elliemae/ds-system';\nimport { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\nconst ToolbarBtns = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTONS_WRAPPER })``;\n\nconst boxShadow = css`\n box-shadow:\n 0 1px 2px 0 rgba(0, 0, 0, 0.13),\n 0 1px 2px 0 rgba(0, 0, 0, 0.2);\n & > .toolbar-trigger {\n border: none;\n }\n`;\n\nconst ToolbarWrapper = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_WRAPPER })<{\n isOpen: boolean;\n}>`\n display: flex;\n align-items: center;\n pointer-events: all;\n\n & .toolbar-trigger:focus {\n z-index: 8;\n }\n\n ${({ isOpen }) => isOpen && boxShadow}\n`;\n\nconst StyledButton = styled(DSButtonV3, { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_BUTTON })`\n background-color: transparent;\n`;\n\nconst ToolbarPosition = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.TOOLBAR_POSITION })`\n display: flex;\n justify-content: flex-end;\n align-items: center;\n pointer-events: none;\n background: transparent;\n height: 28px;\n margin-top: 4px;\n width: 100%;\n padding-left: 1px;\n padding-right: 1px;\n outline: none;\n &:hover {\n z-index: 1;\n }\n :after {\n content: '';\n position: absolute;\n left: 0px;\n top: 4px;\n bottom: 4px;\n width: 1px;\n background-color: neutral-080;\n z-index: 7;\n }\n`;\n\ninterface ToolbarProps {\n isRowSelected?: boolean;\n cell: DSDataTableT.Cell;\n children: React.ReactNode;\n}\n\nexport const Toolbar: React.ComponentType<ToolbarProps> = ({ isRowSelected, cell, children }) => {\n const [show, setShow] = useState(false);\n\n const toolbarRef = useRef<HTMLDivElement | null>(null);\n const toolbarTriggerRef = useRef<HTMLButtonElement | null>(null);\n\n const handleOnClickOutside = useCallback(() => setShow(false), []);\n\n const handleOnClick = useCallback(() => setShow((prev) => !prev), []);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n\n const stopPropagation: React.MouseEventHandler = useCallback((e) => e.stopPropagation(), []);\n\n useOnClickOutside(toolbarRef, handleOnClickOutside);\n\n const onToolbarKeyDown = useCallback((e: React.KeyboardEvent) => {\n if (e.code === 'Escape') {\n setShow(false);\n toolbarTriggerRef.current?.focus();\n }\n e.stopPropagation();\n }, []);\n\n const handleOnBlurToolBar = useCallback(() => {\n setTimeout(() => {\n if (!toolbarRef?.current?.contains?.(document.activeElement)) {\n setShow(false);\n }\n });\n }, []);\n\n return (\n <ToolbarPosition onBlur={handleOnBlurToolBar} innerRef={toolbarRef} tabIndex={-1} getOwnerProps={getOwnerProps}>\n <ToolbarWrapper\n onKeyDown={onToolbarKeyDown}\n onClick={stopPropagation}\n isOpen={show}\n getOwnerProps={getOwnerProps}\n >\n {show && <ToolbarBtns getOwnerProps={getOwnerProps}>{children}</ToolbarBtns>}\n <StyledButton\n buttonType=\"icon\"\n className=\"toolbar-trigger\"\n data-testid={DATA_TESTID.DATA_TABLE_TOOLBAR_TRIGGER}\n innerRef={mergeRefs(toolbarTriggerRef, cell?.ref)}\n onClick={handleOnClick}\n tabIndex={isRowSelected === false ? -1 : 0}\n aria-label=\"Row actions\"\n >\n <MoreOptionsVert />\n </StyledButton>\n </ToolbarWrapper>\n </ToolbarPosition>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC0GjB,SAMW,KANX;AA1GN,SAAgB,aAAa,QAAQ,gBAAgB;AACrD,OAAO,uBAAuB;AAC9B,SAAS,QAAQ,KAAK,iBAAiB;AACvC,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAE5B,SAAS,iBAAiB,wBAAwB;AAClD,SAAS,qBAAqB;AAE9B,MAAM,cAAc,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,wBAAwB,CAAC;AAE3G,MAAM,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASlB,MAAM,iBAAiB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,gBAAgB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAWlG,CAAC,EAAE,OAAO,MAAM,UAAU,SAAS;AAAA;AAGvC,MAAM,eAAe,OAAO,YAAY,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,eAAe,CAAC;AAAA;AAAA;AAIxG,MAAM,kBAAkB,OAAO,OAAO,EAAE,MAAM,iBAAiB,MAAM,iBAAiB,iBAAiB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiCjG,MAAM,UAA6C,CAAC,EAAE,eAAe,MAAM,SAAS,MAAM;AAC/F,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,KAAK;AAEtC,QAAM,aAAa,OAA8B,IAAI;AACrD,QAAM,oBAAoB,OAAiC,IAAI;AAE/D,QAAM,uBAAuB,YAAY,MAAM,QAAQ,KAAK,GAAG,CAAC,CAAC;AAEjE,QAAM,gBAAgB,YAAY,MAAM,QAAQ,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,CAAC;AAEpE,QAAM,gBAAgB,cAAc,CAAC,UAAU,MAAM,GAAG;AAExD,QAAM,kBAA2C,YAAY,CAAC,MAAM,EAAE,gBAAgB,GAAG,CAAC,CAAC;AAE3F,oBAAkB,YAAY,oBAAoB;AAElD,QAAM,mBAAmB,YAAY,CAAC,MAA2B;AAC/D,QAAI,EAAE,SAAS,UAAU;AACvB,cAAQ,KAAK;AACb,wBAAkB,SAAS,MAAM;AAAA,IACnC;AACA,MAAE,gBAAgB;AAAA,EACpB,GAAG,CAAC,CAAC;AAEL,QAAM,sBAAsB,YAAY,MAAM;AAC5C,eAAW,MAAM;AACf,UAAI,CAAC,YAAY,SAAS,WAAW,SAAS,aAAa,GAAG;AAC5D,gBAAQ,KAAK;AAAA,MACf;AAAA,IACF,CAAC;AAAA,EACH,GAAG,CAAC,CAAC;AAEL,SACE,oBAAC,mBAAgB,QAAQ,qBAAqB,UAAU,YAAY,UAAU,IAAI,eAChF;AAAA,IAAC;AAAA;AAAA,MACC,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA,gBAAQ,oBAAC,eAAY,eAA+B,UAAS;AAAA,QAC9D;AAAA,UAAC;AAAA;AAAA,YACC,YAAW;AAAA,YACX,WAAU;AAAA,YACV,eAAa,YAAY;AAAA,YACzB,UAAU,UAAU,mBAAmB,MAAM,GAAG;AAAA,YAChD,SAAS;AAAA,YACT,UAAU,kBAAkB,QAAQ,KAAK;AAAA,YACzC,cAAW;AAAA,YAEX,8BAAC,mBAAgB;AAAA;AAAA,QACnB;AAAA;AAAA;AAAA,EACF,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -28,7 +28,12 @@ const DeprecatedDropdown = ({
|
|
|
28
28
|
if (["Enter", "Space"].includes(e.code)) removeAllFilters();
|
|
29
29
|
}
|
|
30
30
|
},
|
|
31
|
-
...filterBarProps?.extraOptions || []
|
|
31
|
+
...(filterBarProps?.extraOptions || []).map((option) => ({
|
|
32
|
+
...option,
|
|
33
|
+
onKeyDown: (e) => {
|
|
34
|
+
if (["Enter", "Space"].includes(e.code)) option?.onClick?.(e);
|
|
35
|
+
}
|
|
36
|
+
}))
|
|
32
37
|
],
|
|
33
38
|
triggerComponent: /* @__PURE__ */ jsx(
|
|
34
39
|
DSButtonV2,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/FilterBar/DeprecatedDropdown.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck This is using the deprecated dropdown menu\nimport React from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { DATA_TESTID } from '../../configs/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface DeprecatedDropdownProps {\n finalIsOpen: boolean;\n onFilterBarClose: () => void;\n onFilterBarOnClickOutside: () => void;\n removeAllFilters: () => void;\n filterBarProps: DSDataTableT.Props['filterBarProps'];\n dropdownMenuRef: React.MutableRefObject<HTMLButtonElement | null>;\n onTriggerClick: () => void;\n}\n\nexport const DeprecatedDropdown: React.ComponentType<DeprecatedDropdownProps> = ({\n finalIsOpen,\n onFilterBarClose,\n onFilterBarOnClickOutside,\n removeAllFilters,\n filterBarProps,\n dropdownMenuRef,\n onTriggerClick,\n}) => (\n <DSDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n aria-label=\"Filter bar addon\"\n style={{ marginLeft: 'auto' }}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n);\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "// eslint-disable-next-line @typescript-eslint/ban-ts-comment\n// @ts-nocheck This is using the deprecated dropdown menu\nimport React from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DSDropdownMenu } from '@elliemae/ds-dropdownmenu';\nimport { DATA_TESTID } from '../../configs/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\ninterface DeprecatedDropdownProps {\n finalIsOpen: boolean;\n onFilterBarClose: () => void;\n onFilterBarOnClickOutside: () => void;\n removeAllFilters: () => void;\n filterBarProps: DSDataTableT.Props['filterBarProps'];\n dropdownMenuRef: React.MutableRefObject<HTMLButtonElement | null>;\n onTriggerClick: () => void;\n}\n\nexport const DeprecatedDropdown: React.ComponentType<DeprecatedDropdownProps> = ({\n finalIsOpen,\n onFilterBarClose,\n onFilterBarOnClickOutside,\n removeAllFilters,\n filterBarProps,\n dropdownMenuRef,\n onTriggerClick,\n}) => (\n <DSDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []).map((option) => ({\n ...option,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) option?.onClick?.(e);\n },\n })),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n aria-label=\"Filter bar addon\"\n style={{ marginLeft: 'auto' }}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n);\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC0Df;AAvDR,SAAS,kBAAkB;AAC3B,SAAS,uBAAuB;AAChC,SAAS,sBAAsB;AAC/B,SAAS,mBAAmB;AAarB,MAAM,qBAAmE,CAAC;AAAA,EAC/E;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MACE;AAAA,EAAC;AAAA;AAAA,IACC,iBAAgB;AAAA,IAChB,QAAQ;AAAA,IACR,SAAS;AAAA,IACT,oBAAoB;AAAA,IACpB,SAAS;AAAA,MACP;AAAA,QACE,IAAI;AAAA,QACJ,OAAO;AAAA,QACP,SAAS;AAAA,QACT,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,kBAAiB;AAAA,QAC5D;AAAA,MACF;AAAA,MACA,IAAI,gBAAgB,gBAAgB,CAAC,GAAG,IAAI,CAAC,YAAY;AAAA,QACvD,GAAG;AAAA,QACH,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,EAAG,SAAQ,UAAU,CAAC;AAAA,QAC9D;AAAA,MACF,EAAE;AAAA,IACJ;AAAA,IACA,kBACE;AAAA,MAAC;AAAA;AAAA,QACC,eAAa,YAAY;AAAA,QACzB,YAAW;AAAA,QACX,UAAU;AAAA,QACV,SAAS;AAAA,QACT,cAAW;AAAA,QACX,OAAO,EAAE,YAAY,OAAO;AAAA,QAE5B,8BAAC,mBAAgB;AAAA;AAAA,IACnB;AAAA;AAEJ;",
|
|
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/parts/HoC/withConditionalDnDSortableContext.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/function-component-definition */\nimport { horizontalListSortingStrategy, SortableContext } from '@elliemae/ds-drag-and-drop';\nimport React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\ninterface Props {\n items: DSDataTableT.InternalColumn[];\n isDragOverlay: boolean;\n}\n\nexport const withConditionalDnDSortableContext =\n <T,>(Component: React.ComponentType<T>) =>\n (props: T & JSX.IntrinsicAttributes & Props) => {\n const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n\n const { isDragOverlay, items } = props;\n\n // Only add the context if it's not a dragOverlay and dnd for cols was requested\n // It's important that drag overlays DO NOT have any sortable functionality!\n if (!isDragOverlay && dragAndDropColumns)\n return (\n <SortableContext items={items.map((item) => item.id)} strategy={horizontalListSortingStrategy}>\n <Component {...props} />\n </SortableContext>\n );\n\n return <Component {...props} />;\n };\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACuBb;AAtBV,SAAS,+BAA+B,uBAAuB;AAG/D,SAAS,qBAAqB;AAOvB,MAAM,oCACX,CAAK,cACL,CAAC,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable react/function-component-definition */\nimport { horizontalListSortingStrategy, SortableContext } from '@elliemae/ds-drag-and-drop';\nimport React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/useStore.js';\n\ninterface Props {\n items: DSDataTableT.InternalColumn[];\n isDragOverlay: boolean;\n}\n\nexport const withConditionalDnDSortableContext =\n <T,>(Component: React.ComponentType<T>) =>\n (props: T & React.JSX.IntrinsicAttributes & Props) => {\n const dragAndDropColumns = usePropsStore((state) => state.dragAndDropColumns);\n\n const { isDragOverlay, items } = props;\n\n // Only add the context if it's not a dragOverlay and dnd for cols was requested\n // It's important that drag overlays DO NOT have any sortable functionality!\n if (!isDragOverlay && dragAndDropColumns)\n return (\n <SortableContext items={items.map((item) => item.id)} strategy={horizontalListSortingStrategy}>\n <Component {...props} />\n </SortableContext>\n );\n\n return <Component {...props} />;\n };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACuBb;AAtBV,SAAS,+BAA+B,uBAAuB;AAG/D,SAAS,qBAAqB;AAOvB,MAAM,oCACX,CAAK,cACL,CAAC,UAAqD;AACpD,QAAM,qBAAqB,cAAc,CAAC,UAAU,MAAM,kBAAkB;AAE5E,QAAM,EAAE,eAAe,MAAM,IAAI;AAIjC,MAAI,CAAC,iBAAiB;AACpB,WACE,oBAAC,mBAAgB,OAAO,MAAM,IAAI,CAAC,SAAS,KAAK,EAAE,GAAG,UAAU,+BAC9D,8BAAC,aAAW,GAAG,OAAO,GACxB;AAGJ,SAAO,oBAAC,aAAW,GAAG,OAAO;AAC/B;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -23,7 +23,7 @@ const SortByCaret = React2.memo(({ isSortedDesc, isReachable, reduxHeader, inner
|
|
|
23
23
|
}
|
|
24
24
|
return /* @__PURE__ */ jsx(ArrowheadUp, { color: iconColor });
|
|
25
25
|
}, [isSortedDesc]);
|
|
26
|
-
if (!showSortCaret && !isMenuOpen && !isIconVisible) return null;
|
|
26
|
+
if (!showSortCaret && !isMenuOpen && !isIconVisible && isSortedDesc === void 0) return null;
|
|
27
27
|
return /* @__PURE__ */ jsx(
|
|
28
28
|
DSButtonV2,
|
|
29
29
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../src/parts/SortByCaret.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport type { SvgIconT } from '@elliemae/ds-icons';\nimport { ArrowheadDown, ArrowheadUp, SortNeutral } from '@elliemae/ds-icons';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { useGetFilterVisibility } from '../exported-related/FilterPopover/useGetFilterVisibility.js';\nconst iconColor: SvgIconT.ColorType = ['brand-primary', '800'];\n\nexport const SortByCaret: React.ComponentType<{\n isSortedDesc: boolean | undefined;\n onClick: (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n isReachable: boolean;\n column: DSDataTableT.InternalColumn;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.RefObject<HTMLButtonElement>;\n}> = React.memo(({ isSortedDesc, isReachable, reduxHeader, innerRef, column, onClick }) => {\n const { isMenuOpen, isIconVisible } = useGetFilterVisibility(reduxHeader);\n\n const { showSortCaret } = useMemo(\n () =>\n reduxHeader || {\n showSortCaret: false,\n },\n [reduxHeader],\n );\n\n const icon = useMemo(() => {\n if (isSortedDesc === undefined) {\n return <SortNeutral color={iconColor} />;\n }\n\n if (isSortedDesc) {\n return <ArrowheadDown size=\"s\" color={iconColor} />;\n }\n\n return <ArrowheadUp color={iconColor} />;\n }, [isSortedDesc]);\n\n if (!showSortCaret && !isMenuOpen && !isIconVisible) return null;\n\n return (\n <DSButtonV2\n onClick={onClick}\n tabIndex={isReachable ? 0 : -1}\n buttonType=\"icon\"\n style={{ marginLeft: '4px' }}\n aria-label={`Sort ${column.id} ${isSortedDesc ? 'ascending' : 'descending'}`}\n size=\"s\"\n innerRef={innerRef}\n data-testid={DATA_TESTID.DATA_TABLE_SORT_BUTTON}\n >\n {icon}\n </DSButtonV2>\n );\n});\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;AC6BV;AA7Bb,OAAOA,UAAS,eAAe;AAE/B,SAAS,eAAe,aAAa,mBAAmB;AACxD,SAAS,kBAAkB;AAE3B,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AACvC,MAAM,YAAgC,CAAC,iBAAiB,KAAK;AAEtD,MAAM,cAORA,OAAM,KAAK,CAAC,EAAE,cAAc,aAAa,aAAa,UAAU,QAAQ,QAAQ,MAAM;AACzF,QAAM,EAAE,YAAY,cAAc,IAAI,uBAAuB,WAAW;AAExE,QAAM,EAAE,cAAc,IAAI;AAAA,IACxB,MACE,eAAe;AAAA,MACb,eAAe;AAAA,IACjB;AAAA,IACF,CAAC,WAAW;AAAA,EACd;AAEA,QAAM,OAAO,QAAQ,MAAM;AACzB,QAAI,iBAAiB,QAAW;AAC9B,aAAO,oBAAC,eAAY,OAAO,WAAW;AAAA,IACxC;AAEA,QAAI,cAAc;AAChB,aAAO,oBAAC,iBAAc,MAAK,KAAI,OAAO,WAAW;AAAA,IACnD;AAEA,WAAO,oBAAC,eAAY,OAAO,WAAW;AAAA,EACxC,GAAG,CAAC,YAAY,CAAC;AAEjB,MAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport type { SvgIconT } from '@elliemae/ds-icons';\nimport { ArrowheadDown, ArrowheadUp, SortNeutral } from '@elliemae/ds-icons';\nimport { DSButtonV2 } from '@elliemae/ds-button-v2';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { useGetFilterVisibility } from '../exported-related/FilterPopover/useGetFilterVisibility.js';\nconst iconColor: SvgIconT.ColorType = ['brand-primary', '800'];\n\nexport const SortByCaret: React.ComponentType<{\n isSortedDesc: boolean | undefined;\n onClick: (e: React.KeyboardEvent<HTMLButtonElement> | React.MouseEvent<HTMLButtonElement, MouseEvent>) => void;\n isReachable: boolean;\n column: DSDataTableT.InternalColumn;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.RefObject<HTMLButtonElement>;\n}> = React.memo(({ isSortedDesc, isReachable, reduxHeader, innerRef, column, onClick }) => {\n const { isMenuOpen, isIconVisible } = useGetFilterVisibility(reduxHeader);\n\n const { showSortCaret } = useMemo(\n () =>\n reduxHeader || {\n showSortCaret: false,\n },\n [reduxHeader],\n );\n\n const icon = useMemo(() => {\n if (isSortedDesc === undefined) {\n return <SortNeutral color={iconColor} />;\n }\n\n if (isSortedDesc) {\n return <ArrowheadDown size=\"s\" color={iconColor} />;\n }\n\n return <ArrowheadUp color={iconColor} />;\n }, [isSortedDesc]);\n\n if (!showSortCaret && !isMenuOpen && !isIconVisible && isSortedDesc === undefined) return null;\n\n return (\n <DSButtonV2\n onClick={onClick}\n tabIndex={isReachable ? 0 : -1}\n buttonType=\"icon\"\n style={{ marginLeft: '4px' }}\n aria-label={`Sort ${column.id} ${isSortedDesc ? 'ascending' : 'descending'}`}\n size=\"s\"\n innerRef={innerRef}\n data-testid={DATA_TESTID.DATA_TABLE_SORT_BUTTON}\n >\n {icon}\n </DSButtonV2>\n );\n});\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC6BV;AA7Bb,OAAOA,UAAS,eAAe;AAE/B,SAAS,eAAe,aAAa,mBAAmB;AACxD,SAAS,kBAAkB;AAE3B,SAAS,mBAAmB;AAC5B,SAAS,8BAA8B;AACvC,MAAM,YAAgC,CAAC,iBAAiB,KAAK;AAEtD,MAAM,cAORA,OAAM,KAAK,CAAC,EAAE,cAAc,aAAa,aAAa,UAAU,QAAQ,QAAQ,MAAM;AACzF,QAAM,EAAE,YAAY,cAAc,IAAI,uBAAuB,WAAW;AAExE,QAAM,EAAE,cAAc,IAAI;AAAA,IACxB,MACE,eAAe;AAAA,MACb,eAAe;AAAA,IACjB;AAAA,IACF,CAAC,WAAW;AAAA,EACd;AAEA,QAAM,OAAO,QAAQ,MAAM;AACzB,QAAI,iBAAiB,QAAW;AAC9B,aAAO,oBAAC,eAAY,OAAO,WAAW;AAAA,IACxC;AAEA,QAAI,cAAc;AAChB,aAAO,oBAAC,iBAAc,MAAK,KAAI,OAAO,WAAW;AAAA,IACnD;AAEA,WAAO,oBAAC,eAAY,OAAO,WAAW;AAAA,EACxC,GAAG,CAAC,YAAY,CAAC;AAEjB,MAAI,CAAC,iBAAiB,CAAC,cAAc,CAAC,iBAAiB,iBAAiB,OAAW,QAAO;AAE1F,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,UAAU,cAAc,IAAI;AAAA,MAC5B,YAAW;AAAA,MACX,OAAO,EAAE,YAAY,MAAM;AAAA,MAC3B,cAAY,QAAQ,OAAO,EAAE,IAAI,eAAe,cAAc,YAAY;AAAA,MAC1E,MAAK;AAAA,MACL;AAAA,MACA,eAAa,YAAY;AAAA,MAExB;AAAA;AAAA,EACH;AAEJ,CAAC;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
1
|
import type { DSDataTableT } from '../react-desc-prop-types.js';
|
|
2
|
-
|
|
3
|
-
declare const useTableColsWithAddons: UseTableColsWithAddonsType;
|
|
2
|
+
declare const useTableColsWithAddons: ({ columns, renderRowActions, isExpandable, selectSingle, selection, dragAndDropRows, noSelectionColumn, }: DSDataTableT.InternalProps, hiddenColumns: string[]) => DSDataTableT.InternalColumn[];
|
|
4
3
|
export { useTableColsWithAddons };
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
export declare const Headers: React.ComponentType<JSX.IntrinsicAttributes>;
|
|
2
|
+
export declare const Headers: React.ComponentType<React.JSX.IntrinsicAttributes>;
|
|
@@ -4,5 +4,5 @@ interface Props {
|
|
|
4
4
|
items: DSDataTableT.InternalColumn[];
|
|
5
5
|
isDragOverlay: boolean;
|
|
6
6
|
}
|
|
7
|
-
export declare const withConditionalDnDSortableContext: <T>(Component: React.ComponentType<T>) => (props: T & JSX.IntrinsicAttributes & Props) => import("react/jsx-runtime.js").JSX.Element;
|
|
7
|
+
export declare const withConditionalDnDSortableContext: <T>(Component: React.ComponentType<T>) => (props: T & React.JSX.IntrinsicAttributes & Props) => import("react/jsx-runtime.js").JSX.Element;
|
|
8
8
|
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
|
-
export declare const RowsWithContext: React.ComponentType<JSX.IntrinsicAttributes>;
|
|
2
|
+
export declare const RowsWithContext: React.ComponentType<React.JSX.IntrinsicAttributes>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import type React from 'react';
|
|
2
|
-
export type FunctionalHOC = <T = unknown>(Component: React.ComponentType<T>, ...other: unknown[]) => React.ComponentType<T & JSX.IntrinsicAttributes>;
|
|
2
|
+
export type FunctionalHOC = <T = unknown>(Component: React.ComponentType<T>, ...other: unknown[]) => React.ComponentType<T & React.JSX.IntrinsicAttributes>;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-data-table",
|
|
3
|
-
"version": "3.50.0-
|
|
3
|
+
"version": "3.50.0-rc.1",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Data Table",
|
|
6
6
|
"files": [
|
|
@@ -25,8 +25,8 @@
|
|
|
25
25
|
"url": "https://git.elliemae.io/platform-ui/dimsum.git"
|
|
26
26
|
},
|
|
27
27
|
"engines": {
|
|
28
|
-
"pnpm": ">=
|
|
29
|
-
"node": ">=
|
|
28
|
+
"pnpm": ">=9",
|
|
29
|
+
"node": ">=22"
|
|
30
30
|
},
|
|
31
31
|
"author": "ICE MT",
|
|
32
32
|
"jestSonar": {
|
|
@@ -39,38 +39,40 @@
|
|
|
39
39
|
"react-virtual": "~2.10.4",
|
|
40
40
|
"uid": "~2.0.1",
|
|
41
41
|
"use-onclickoutside": "0.4.1",
|
|
42
|
-
"@elliemae/ds-
|
|
43
|
-
"@elliemae/ds-button
|
|
44
|
-
"@elliemae/ds-
|
|
45
|
-
"@elliemae/ds-
|
|
46
|
-
"@elliemae/ds-
|
|
47
|
-
"@elliemae/ds-
|
|
48
|
-
"@elliemae/ds-form-
|
|
49
|
-
"@elliemae/ds-form-combobox": "3.50.0-
|
|
50
|
-
"@elliemae/ds-form-date-range-picker": "3.50.0-
|
|
51
|
-
"@elliemae/ds-form-
|
|
52
|
-
"@elliemae/ds-form-
|
|
53
|
-
"@elliemae/ds-form-
|
|
54
|
-
"@elliemae/ds-
|
|
55
|
-
"@elliemae/ds-
|
|
56
|
-
"@elliemae/ds-
|
|
57
|
-
"@elliemae/ds-
|
|
58
|
-
"@elliemae/ds-
|
|
59
|
-
"@elliemae/ds-
|
|
60
|
-
"@elliemae/ds-
|
|
61
|
-
"@elliemae/ds-
|
|
62
|
-
"@elliemae/ds-skeleton": "3.50.0-
|
|
63
|
-
"@elliemae/ds-
|
|
64
|
-
"@elliemae/ds-
|
|
65
|
-
"@elliemae/ds-
|
|
66
|
-
"@elliemae/ds-
|
|
42
|
+
"@elliemae/ds-circular-progress-indicator": "3.50.0-rc.1",
|
|
43
|
+
"@elliemae/ds-button": "3.50.0-rc.1",
|
|
44
|
+
"@elliemae/ds-dropdownmenu-v2": "3.50.0-rc.1",
|
|
45
|
+
"@elliemae/ds-dropdownmenu": "3.50.0-rc.1",
|
|
46
|
+
"@elliemae/ds-drag-and-drop": "3.50.0-rc.1",
|
|
47
|
+
"@elliemae/ds-form-checkbox": "3.50.0-rc.1",
|
|
48
|
+
"@elliemae/ds-form-date-time-picker": "3.50.0-rc.1",
|
|
49
|
+
"@elliemae/ds-form-combobox": "3.50.0-rc.1",
|
|
50
|
+
"@elliemae/ds-form-date-range-picker": "3.50.0-rc.1",
|
|
51
|
+
"@elliemae/ds-form-helpers-mask-hooks": "3.50.0-rc.1",
|
|
52
|
+
"@elliemae/ds-form-input-text": "3.50.0-rc.1",
|
|
53
|
+
"@elliemae/ds-form-layout-blocks": "3.50.0-rc.1",
|
|
54
|
+
"@elliemae/ds-grid": "3.50.0-rc.1",
|
|
55
|
+
"@elliemae/ds-pills-v2": "3.50.0-rc.1",
|
|
56
|
+
"@elliemae/ds-icons": "3.50.0-rc.1",
|
|
57
|
+
"@elliemae/ds-pagination": "3.50.0-rc.1",
|
|
58
|
+
"@elliemae/ds-form-radio": "3.50.0-rc.1",
|
|
59
|
+
"@elliemae/ds-popperjs": "3.50.0-rc.1",
|
|
60
|
+
"@elliemae/ds-props-helpers": "3.50.0-rc.1",
|
|
61
|
+
"@elliemae/ds-system": "3.50.0-rc.1",
|
|
62
|
+
"@elliemae/ds-skeleton": "3.50.0-rc.1",
|
|
63
|
+
"@elliemae/ds-truncated-tooltip-text": "3.50.0-rc.1",
|
|
64
|
+
"@elliemae/ds-typescript-helpers": "3.50.0-rc.1",
|
|
65
|
+
"@elliemae/ds-zustand-helpers": "3.50.0-rc.1",
|
|
66
|
+
"@elliemae/ds-button-v2": "3.50.0-rc.1"
|
|
67
67
|
},
|
|
68
68
|
"devDependencies": {
|
|
69
69
|
"@elliemae/pui-cli": "9.0.0-next.50",
|
|
70
|
+
"jest": "~29.7.0",
|
|
71
|
+
"jest-cli": "~29.7.0",
|
|
70
72
|
"styled-components": "~5.3.9",
|
|
71
73
|
"styled-system": "~5.1.5",
|
|
72
|
-
"@elliemae/ds-monorepo-devops": "3.50.0-
|
|
73
|
-
"@elliemae/ds-toolbar-v2": "3.50.0-
|
|
74
|
+
"@elliemae/ds-monorepo-devops": "3.50.0-rc.1",
|
|
75
|
+
"@elliemae/ds-toolbar-v2": "3.50.0-rc.1"
|
|
74
76
|
},
|
|
75
77
|
"peerDependencies": {
|
|
76
78
|
"lodash": "^4.17.21",
|