@elliemae/ds-data-table 3.80.0-next.14 → 3.80.0-next.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +3 -3
- package/dist/cjs/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js +2 -4
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/index.js +2 -4
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/index.js.map +2 -2
- package/dist/cjs/configs/useAutocalculated/index.js +9 -5
- package/dist/cjs/configs/useAutocalculated/index.js.map +2 -2
- package/dist/cjs/configs/useStore/useStore.js +4 -0
- package/dist/cjs/configs/useStore/useStore.js.map +2 -2
- package/dist/cjs/configs/useTableResizeCb.js.map +1 -1
- package/dist/cjs/parts/Row.js +3 -2
- package/dist/cjs/parts/Row.js.map +2 -2
- package/dist/cjs/parts/Rows.js +4 -5
- package/dist/cjs/parts/Rows.js.map +2 -2
- package/dist/cjs/parts/VirtualRowsList.js +2 -1
- package/dist/cjs/parts/VirtualRowsList.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/cjs/styled.js +1 -1
- package/dist/cjs/styled.js.map +1 -1
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js +3 -3
- package/dist/esm/addons/Columns/ColumnSelectMultiple/ColumnSelectMultiple.js.map +2 -2
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js +2 -4
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js.map +2 -2
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/index.js +2 -4
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/index.js.map +2 -2
- package/dist/esm/configs/useAutocalculated/index.js +9 -5
- package/dist/esm/configs/useAutocalculated/index.js.map +2 -2
- package/dist/esm/configs/useStore/useStore.js +4 -0
- package/dist/esm/configs/useStore/useStore.js.map +2 -2
- package/dist/esm/configs/useTableResizeCb.js.map +1 -1
- package/dist/esm/parts/Row.js +3 -2
- package/dist/esm/parts/Row.js.map +2 -2
- package/dist/esm/parts/Rows.js +4 -5
- package/dist/esm/parts/Rows.js.map +2 -2
- package/dist/esm/parts/VirtualRowsList.js +2 -1
- package/dist/esm/parts/VirtualRowsList.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/esm/styled.js +1 -1
- package/dist/esm/styled.js.map +1 -1
- package/dist/types/parts/Row.d.ts +4 -2
- package/dist/types/react-desc-prop-types.d.ts +27 -6
- package/package.json +33 -33
|
@@ -94,10 +94,10 @@ const multiSelectColumn = {
|
|
|
94
94
|
() => allDataFlattened.map((datum) => `data-table-checkbox-${datum.uid}${domIdAffix ? `-${domIdAffix}` : ""}`).join(" "),
|
|
95
95
|
[allDataFlattened, domIdAffix]
|
|
96
96
|
);
|
|
97
|
-
const startCandidate = visibleRangeRef.current.
|
|
97
|
+
const startCandidate = visibleRangeRef.current.startIndex - visibleRangeRef.current.overscan;
|
|
98
98
|
const start = startCandidate > 0 ? startCandidate : 0;
|
|
99
|
-
const endCandidate = visibleRangeRef.current.
|
|
100
|
-
const end = endCandidate > visibleRangeRef.current.
|
|
99
|
+
const endCandidate = visibleRangeRef.current.endIndex + visibleRangeRef.current.overscan + 1;
|
|
100
|
+
const end = endCandidate > visibleRangeRef.current.count ? visibleRangeRef.current.count : endCandidate;
|
|
101
101
|
const visibleAriaControls = ariaControls.split(" ").slice(start, end).join(" ");
|
|
102
102
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StyledGlobalCheckboxContainer, { getOwnerProps, getOwnerPropsArguments, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
103
103
|
import_ds_form_checkbox.DSControlledCheckbox,
|
|
@@ -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 { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { styled } from '@elliemae/ds-system';\nimport React, { createRef, useCallback, useMemo, useRef } from 'react';\nimport { uid as genUid } from 'uid';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\nimport { updateRangeSelection } from '../../../helpers/multipleSelectRow.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\n/**\n * Optical wrapper for the select-all checkbox. The header cell top-anchors its content\n * (HeaderCellTitle: align-items flex-start, no padding-top for custom headers), so this\n * min-height:24px + centered box keeps the checkbox vertically centered on the header's\n * first line \u2014 aligned with the column labels and the body row checkboxes \u2014 while still\n * staying top-anchored if the header row grows. Mirrors the expand-all header's wrapper.\n */\nconst StyledGlobalCheckboxContainer = styled('span', {\n name: DSDataTableName,\n slot: DSDataTableSlots.GLOBAL_CHECKBOX_CONTAINER,\n})`\n display: flex;\n align-items: center;\n min-height: 24px;\n`;\n\nexport const multiSelectColumn: DSDataTableT.InternalColumn = {\n // Build our multiSelecter column\n id: 'multiSelecter', // Make sure it has an ID\n Header: () => {\n const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n const selection = usePropsStore((state) => state.selection);\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n const firstFocuseableColumnHeaderId = usePropsStore((state) => state.firstFocuseableColumnHeaderId);\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const visibleRangeRef = usePropsStore((state) => state.visibleRangeRef);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n\n // We for sure have selection, so we just typecast it for TS reasons\n const dtSelection = selection ?? {};\n const selectionKeyCount = flattenedData.reduce(\n (acc, cur) => (dtSelection[cur.uid] && !disabledRows[cur.uid] ? 1 : 0) + acc,\n 0,\n );\n\n const currentGlobalState = useMemo(\n () =>\n selectionKeyCount > 0 && selectionKeyCount < flattenedData.filter((datum) => !disabledRows[datum.uid]).length\n ? 'mixed'\n : selectionKeyCount > 0,\n [selectionKeyCount, flattenedData, disabledRows],\n );\n\n // global state toggling: false to true, mixed to true, true to false\n const newGlobalStateAfterToggle = useMemo(() => currentGlobalState !== true, [currentGlobalState]);\n\n const newSelection: DSDataTableT.Selection = useMemo(() => {\n if (!newGlobalStateAfterToggle) return {};\n\n return allDataFlattened.reduce<DSDataTableT.Selection>((newSelectionObject, datum) => {\n newSelectionObject[datum.uid] = !disabledRows[datum.uid];\n return newSelectionObject;\n }, {});\n }, [newGlobalStateAfterToggle, allDataFlattened, disabledRows]);\n\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n onSelectionChange(newSelection, 'All', e);\n },\n [newSelection, onSelectionChange],\n );\n\n const ariaControls = useMemo(\n () =>\n allDataFlattened\n .map((datum) => `data-table-checkbox-${datum.uid}${domIdAffix ? `-${domIdAffix}` : ''}`)\n .join(' '),\n [allDataFlattened, domIdAffix],\n );\n\n const startCandidate = visibleRangeRef.current.
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD+Ff;AA9FR,8BAAqC;AACrC,uBAAuB;AACvB,mBAA+D;AAC/D,iBAA8B;AAC9B,uBAA4B;AAC5B,2CAAgD;AAChD,IAAAA,oBAAkD;AAClD,+BAAqC;AAUrC,MAAM,oCAAgC,yBAAO,QAAQ;AAAA,EACnD,MAAM;AAAA,EACN,MAAM,mCAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAMM,MAAM,oBAAiD;AAAA;AAAA,EAE5D,IAAI;AAAA;AAAA,EACJ,QAAQ,MAAM;AACZ,UAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,UAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,UAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,UAAM,uBAAmB,oDAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,gCAA4B,oDAAc,CAAC,UAAU,MAAM,yBAAyB;AAC1F,UAAM,uBAAmB,oDAAc,CAAC,UAAU,MAAM,gBAAgB;AACxE,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,UAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,UAAM,oCAAgC,oDAAc,CAAC,UAAU,MAAM,6BAA6B;AAClG,UAAM,iBAAa,oDAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,UAAM,sBAAkB,oDAAc,CAAC,UAAU,MAAM,eAAe;AACtE,UAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,UAAM,6BAAyB,0BAAY,OAAO,CAAC,IAAI,CAAC,CAAC;AAGzD,UAAM,cAAc,aAAa,CAAC;AAClC,UAAM,oBAAoB,cAAc;AAAA,MACtC,CAAC,KAAK,SAAS,YAAY,IAAI,GAAG,KAAK,CAAC,aAAa,IAAI,GAAG,IAAI,IAAI,KAAK;AAAA,MACzE;AAAA,IACF;AAEA,UAAM,yBAAqB;AAAA,MACzB,MACE,oBAAoB,KAAK,oBAAoB,cAAc,OAAO,CAAC,UAAU,CAAC,aAAa,MAAM,GAAG,CAAC,EAAE,SACnG,UACA,oBAAoB;AAAA,MAC1B,CAAC,mBAAmB,eAAe,YAAY;AAAA,IACjD;AAGA,UAAM,gCAA4B,sBAAQ,MAAM,uBAAuB,MAAM,CAAC,kBAAkB,CAAC;AAEjG,UAAM,mBAAuC,sBAAQ,MAAM;AACzD,UAAI,CAAC,0BAA2B,QAAO,CAAC;AAExC,aAAO,iBAAiB,OAA+B,CAAC,oBAAoB,UAAU;AACpF,2BAAmB,MAAM,GAAG,IAAI,CAAC,aAAa,MAAM,GAAG;AACvD,eAAO;AAAA,MACT,GAAG,CAAC,CAAC;AAAA,IACP,GAAG,CAAC,2BAA2B,kBAAkB,YAAY,CAAC;AAE9D,UAAM,sBAAkB;AAAA,MACtB,CAAC,UAAmB,MAAkE;AACpF,0BAAkB,cAAc,OAAO,CAAC;AAAA,MAC1C;AAAA,MACA,CAAC,cAAc,iBAAiB;AAAA,IAClC;AAEA,UAAM,mBAAe;AAAA,MACnB,MACE,iBACG,IAAI,CAAC,UAAU,uBAAuB,MAAM,GAAG,GAAG,aAAa,IAAI,UAAU,KAAK,EAAE,EAAE,EACtF,KAAK,GAAG;AAAA,MACb,CAAC,kBAAkB,UAAU;AAAA,IAC/B;AAEA,UAAM,iBAAiB,gBAAgB,QAAQ,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-statements */\nimport { DSControlledCheckbox } from '@elliemae/ds-form-checkbox';\nimport { styled } from '@elliemae/ds-system';\nimport React, { createRef, useCallback, useMemo, useRef } from 'react';\nimport { uid as genUid } from 'uid';\nimport { DATA_TESTID } from '../../../configs/constants.js';\nimport { useInternalStore, usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../constants/index.js';\nimport { updateRangeSelection } from '../../../helpers/multipleSelectRow.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\n\n/**\n * Optical wrapper for the select-all checkbox. The header cell top-anchors its content\n * (HeaderCellTitle: align-items flex-start, no padding-top for custom headers), so this\n * min-height:24px + centered box keeps the checkbox vertically centered on the header's\n * first line \u2014 aligned with the column labels and the body row checkboxes \u2014 while still\n * staying top-anchored if the header row grows. Mirrors the expand-all header's wrapper.\n */\nconst StyledGlobalCheckboxContainer = styled('span', {\n name: DSDataTableName,\n slot: DSDataTableSlots.GLOBAL_CHECKBOX_CONTAINER,\n})`\n display: flex;\n align-items: center;\n min-height: 24px;\n`;\n\nexport const multiSelectColumn: DSDataTableT.InternalColumn = {\n // Build our multiSelecter column\n id: 'multiSelecter', // Make sure it has an ID\n Header: () => {\n const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n const selection = usePropsStore((state) => state.selection);\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const noResultsMessage = usePropsStore((state) => state.noResultsMessage);\n const noResultsSecondaryMessage = usePropsStore((state) => state.noResultsSecondaryMessage);\n const allDataFlattened = usePropsStore((state) => state.allDataFlattened);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n const firstFocuseableColumnHeaderId = usePropsStore((state) => state.firstFocuseableColumnHeaderId);\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const visibleRangeRef = usePropsStore((state) => state.visibleRangeRef);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => ({}), []);\n\n // We for sure have selection, so we just typecast it for TS reasons\n const dtSelection = selection ?? {};\n const selectionKeyCount = flattenedData.reduce(\n (acc, cur) => (dtSelection[cur.uid] && !disabledRows[cur.uid] ? 1 : 0) + acc,\n 0,\n );\n\n const currentGlobalState = useMemo(\n () =>\n selectionKeyCount > 0 && selectionKeyCount < flattenedData.filter((datum) => !disabledRows[datum.uid]).length\n ? 'mixed'\n : selectionKeyCount > 0,\n [selectionKeyCount, flattenedData, disabledRows],\n );\n\n // global state toggling: false to true, mixed to true, true to false\n const newGlobalStateAfterToggle = useMemo(() => currentGlobalState !== true, [currentGlobalState]);\n\n const newSelection: DSDataTableT.Selection = useMemo(() => {\n if (!newGlobalStateAfterToggle) return {};\n\n return allDataFlattened.reduce<DSDataTableT.Selection>((newSelectionObject, datum) => {\n newSelectionObject[datum.uid] = !disabledRows[datum.uid];\n return newSelectionObject;\n }, {});\n }, [newGlobalStateAfterToggle, allDataFlattened, disabledRows]);\n\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n onSelectionChange(newSelection, 'All', e);\n },\n [newSelection, onSelectionChange],\n );\n\n const ariaControls = useMemo(\n () =>\n allDataFlattened\n .map((datum) => `data-table-checkbox-${datum.uid}${domIdAffix ? `-${domIdAffix}` : ''}`)\n .join(' '),\n [allDataFlattened, domIdAffix],\n );\n\n const startCandidate = visibleRangeRef.current.startIndex - visibleRangeRef.current.overscan;\n const start = startCandidate > 0 ? startCandidate : 0;\n const endCandidate = visibleRangeRef.current.endIndex + visibleRangeRef.current.overscan + 1;\n const end = endCandidate > visibleRangeRef.current.count ? visibleRangeRef.current.count : endCandidate;\n const visibleAriaControls = ariaControls.split(' ').slice(start, end).join(' ');\n\n return (\n <StyledGlobalCheckboxContainer getOwnerProps={getOwnerProps} getOwnerPropsArguments={getOwnerPropsArguments}>\n <DSControlledCheckbox\n aria-controls={visibleAriaControls}\n data-testid={DATA_TESTID.DATA_TABLE_GLOBAL_CHECKBOX}\n aria-label={\n isEmptyContent && firstFocuseableColumnHeaderId === 'multiSelecter'\n ? `${noResultsMessage}. ${\n noResultsSecondaryMessage ? `${noResultsSecondaryMessage}.` : ''\n } Toggle all rows selected`\n : 'Toggle all rows selected'\n }\n checked={currentGlobalState}\n onChange={onChangeHandler}\n />\n </StyledGlobalCheckboxContainer>\n );\n },\n Cell: ({ cell, row, isRowSelected, domIdAffix = genUid(4) }) => {\n const onSelectionChange = usePropsStore((state) => state.onSelectionChange);\n const selection = usePropsStore((state) => state.selection);\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const lastSelected = usePropsStore((state) => state.lastSelected);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const checkboxSelectAllProps = usePropsStore((state) => state.checkboxSelectAllProps);\n\n const isShiftPressed = useInternalStore((state) => state.isShiftPressed);\n const setIsShiftPressed = useInternalStore((state) => state.setIsShiftPressed);\n\n const { uid, realIndex } = row;\n const selectedState = selection?.[uid] ?? false;\n const isShiftPressedKeyRef = useRef(false);\n const onChangeHandler = useCallback(\n (newState: boolean, e: React.ChangeEvent | React.MouseEvent | React.KeyboardEvent) => {\n let newSelection = { ...selection, [uid]: newState }; // we only want true and mixed values\n if (!newState) delete newSelection[uid]; // if newState is false, remove from the new selection\n const now = realIndex;\n if ((isShiftPressed || isShiftPressedKeyRef.current) && lastSelected.current > -1) {\n newSelection = updateRangeSelection(\n newSelection,\n lastSelected.current,\n now,\n flattenedData,\n disabledRows,\n newState,\n );\n }\n lastSelected.current = now;\n onSelectionChange(newSelection, uid, e);\n },\n [selection, uid, realIndex, isShiftPressed, lastSelected, onSelectionChange, flattenedData, disabledRows],\n );\n\n const onKeyDownHandler: React.KeyboardEventHandler = useCallback(\n (e) => {\n setIsShiftPressed(e.code === 'Shift' || e.shiftKey);\n e.stopPropagation();\n },\n [setIsShiftPressed],\n );\n\n const onKeyUpHandler: React.KeyboardEventHandler = useCallback(\n (e) => {\n setIsShiftPressed(false);\n isShiftPressedKeyRef.current = false;\n e.stopPropagation();\n },\n [setIsShiftPressed],\n );\n\n const stopThePropagation = useCallback((e: React.MouseEvent | React.KeyboardEvent) => {\n if (e.shiftKey) {\n isShiftPressedKeyRef.current = true;\n }\n e.stopPropagation();\n }, []);\n\n return (\n <div role=\"presentation\" onClick={stopThePropagation} onKeyDown={onKeyDownHandler} onKeyUp={onKeyUpHandler}>\n <DSControlledCheckbox\n id={`data-table-checkbox-${uid}-${domIdAffix}`}\n data-testid={DATA_TESTID.DATA_TABLE_CHECKBOX}\n aria-label=\"Toggle row selected\"\n checked={selectedState}\n onChange={onChangeHandler}\n disabled={disabledRows[row.uid]}\n innerRef={cell.ref}\n tabIndex={isRowSelected ? 0 : -1}\n {...checkboxSelectAllProps}\n />\n </div>\n );\n },\n textWrap: 'wrap',\n width: 32,\n padding: 7,\n canResize: false,\n isFocuseable: false,\n disableDnD: true,\n parentId: null,\n depth: 0,\n ref: createRef(),\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["import_constants", "genUid"]
|
|
7
7
|
}
|
|
@@ -76,10 +76,8 @@ const FreeTextSearchFilterV2 = (props) => {
|
|
|
76
76
|
const handleRef = (0, import_react.useCallback)((newRef) => {
|
|
77
77
|
ref.current = newRef;
|
|
78
78
|
if (shouldFocus.current) {
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
shouldFocus.current = false;
|
|
82
|
-
});
|
|
79
|
+
ref.current?.focus();
|
|
80
|
+
shouldFocus.current = false;
|
|
83
81
|
}
|
|
84
82
|
}, []);
|
|
85
83
|
(0, import_react.useEffect)(() => {
|
package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { DSInputText } from '@elliemae/ds-form-input-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { uid } from 'uid';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { usePropsStore } from '../../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../../constants/index.js';\nimport { FilterPopoverV2 } from '../../../../exported-related/FilterPopover/FilterPopoverV2.js';\nimport { FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\n\nconst StyledInputFreeTextSearch = styled(DSInputText, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_FILTER,\n})``;\n\nconst StyledInputFreeTextSearchWrapper = styled(Grid, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_WRAPPER,\n})``;\n\nexport const FreeTextSearchFilterV2: React.ComponentType<DSDataTableT.FilterProps<string>> = (props) => {\n const {\n column,\n referenceColumn,\n column: { id, persistFilterInputAfterSubmit = false },\n onValueChange,\n patchHeaderFilterButtonAndMenu,\n reduxHeader,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const ref = useRef<HTMLInputElement | null>(null);\n const shouldFocus = useRef(true);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(\n () => ({\n columnId: id,\n }),\n [id],\n );\n\n const handleRef = useCallback((newRef: HTMLInputElement | null) => {\n ref.current = newRef;\n if (shouldFocus.current) {\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import { DSInputText } from '@elliemae/ds-form-input-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { styled } from '@elliemae/ds-system';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\nimport { uid } from 'uid';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { usePropsStore } from '../../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../../constants/index.js';\nimport { FilterPopoverV2 } from '../../../../exported-related/FilterPopover/FilterPopoverV2.js';\nimport { FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\n\nconst StyledInputFreeTextSearch = styled(DSInputText, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_FILTER,\n})``;\n\nconst StyledInputFreeTextSearchWrapper = styled(Grid, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_WRAPPER,\n})``;\n\nexport const FreeTextSearchFilterV2: React.ComponentType<DSDataTableT.FilterProps<string>> = (props) => {\n const {\n column,\n referenceColumn,\n column: { id, persistFilterInputAfterSubmit = false },\n onValueChange,\n patchHeaderFilterButtonAndMenu,\n reduxHeader,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const ref = useRef<HTMLInputElement | null>(null);\n const shouldFocus = useRef(true);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(\n () => ({\n columnId: id,\n }),\n [id],\n );\n\n /**\n * Focus happens synchronously in the ref callback, not via requestAnimationFrame. The rAF\n * deferral was an unnecessary async hop \u2014 this element is opacity:0 while the popover is\n * closed, not display:none, so it's focusable immediately, no need to wait for a paint. The\n * deferral was riding on an implicit, unstated assumption that a browser frame would always\n * elapse before whatever asserts focus next runs; the ds-data-table react-virtual v3 migration\n * (PUI-19065) added legitimate extra synchronous render work upstream and exposed that this\n * assumption doesn't hold under Jest/jsdom \u2014 confirmed on the sibling non-V2 FreeTextSearchFilter,\n * where it intermittently lost the race against a test's own synchronous focus assertion. See\n * antipattern_focus_management.md.\n */\n const handleRef = useCallback((newRef: HTMLInputElement | null) => {\n ref.current = newRef;\n if (shouldFocus.current) {\n ref.current?.focus();\n shouldFocus.current = false;\n }\n }, []);\n useEffect(() => {\n if (reduxHeader?.hideFilterMenu) {\n shouldFocus.current = true;\n }\n }, [reduxHeader?.hideFilterMenu]);\n\n const [value, setValue] = useState<string>('');\n const handleSubmit = useCallback(\n (e: React.SyntheticEvent) => {\n e.preventDefault();\n\n const trimmed = value.trim();\n if (trimmed === '') return;\n\n onValueChange(FILTER_TYPES.FREE_TEXT_SEARCH_V2, trimmed || undefined);\n if (!persistFilterInputAfterSubmit) {\n setValue('');\n }\n setTimeout(() => {\n patchHeaderFilterButtonAndMenu(id, true);\n innerRef?.current?.focus();\n }, 0);\n },\n [id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu, persistFilterInputAfterSubmit, value],\n );\n const handleReset = useCallback(() => {\n setValue('');\n onValueChange(FILTER_TYPES.FREE_TEXT_SEARCH_V2, undefined);\n }, [onValueChange]);\n return (\n <FilterPopoverV2\n onFilterSubmit={handleSubmit}\n onFilterReset={handleReset}\n firstElementRef={ref}\n reduxHeader={reduxHeader}\n column={column}\n columnReference={referenceColumn}\n columnId={id}\n customStyles={{\n backgroundColor: '#fff',\n width: referenceColumn?.offsetWidth,\n minWidth: '80px',\n }}\n menuContent={\n <StyledInputFreeTextSearchWrapper\n p=\"xxs\"\n gutter=\"xxs\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <ScreenReaderOnly id=\"filter-input-instructions\">\n Press Enter to apply the filter and close the dialog. Focus will return to the button that opened this\n dialog.\n </ScreenReaderOnly>\n <StyledInputFreeTextSearch\n id={`ds-data-table-free-text-search-${id}-${domIdAffix}`}\n placeholder=\"\"\n value={value}\n onValueChange={(newValue) => {\n setValue(newValue);\n }}\n innerRef={handleRef}\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_FREE_TEXT_SEARCH}\n aria-label=\"Free Text Search Filter\"\n aria-describedby=\"filter-input-instructions\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n </StyledInputFreeTextSearchWrapper>\n }\n triggerIcon={<SearchXsmall />}\n innerRef={innerRef}\n ariaLabel=\"Open Free Text Search Filter\"\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6Gf;AA7GR,gCAA4B;AAC5B,qBAAqB;AACrB,sBAA6B;AAC7B,uBAAuB;AACvB,mBAAgE;AAChE,iBAAoB;AACpB,uBAA4B;AAC5B,2CAA8B;AAC9B,IAAAA,oBAAkD;AAClD,6BAAgC;AAChC,8BAA6B;AAE7B,oBAAiC;AAEjC,MAAM,gCAA4B,yBAAO,uCAAa;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,mCAAiB;AACzB,CAAC;AAED,MAAM,uCAAmC,yBAAO,qBAAM;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,mCAAiB;AACzB,CAAC;AAEM,MAAM,yBAAgF,CAAC,UAAU;AACtG,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA,QAAQ,EAAE,IAAI,gCAAgC,MAAM;AAAA,IACpD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAa,gBAAI,CAAC;AAAA,EACpB,IAAI;AAEJ,QAAM,UAAM,qBAAgC,IAAI;AAChD,QAAM,kBAAc,qBAAO,IAAI;AAE/B,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB;AAAA,IAC7B,OAAO;AAAA,MACL,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,EAAE;AAAA,EACL;AAaA,QAAM,gBAAY,0BAAY,CAAC,WAAoC;AACjE,QAAI,UAAU;AACd,QAAI,YAAY,SAAS;AACvB,UAAI,SAAS,MAAM;AACnB,kBAAY,UAAU;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,CAAC;AACL,8BAAU,MAAM;AACd,QAAI,aAAa,gBAAgB;AAC/B,kBAAY,UAAU;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAiB,EAAE;AAC7C,QAAM,mBAAe;AAAA,IACnB,CAAC,MAA4B;AAC3B,QAAE,eAAe;AAEjB,YAAM,UAAU,MAAM,KAAK;AAC3B,UAAI,YAAY,GAAI;AAEpB,oBAAc,qCAAa,qBAAqB,WAAW,MAAS;AACpE,UAAI,CAAC,+BAA+B;AAClC,iBAAS,EAAE;AAAA,MACb;AACA,iBAAW,MAAM;AACf,uCAA+B,IAAI,IAAI;AACvC,kBAAU,SAAS,MAAM;AAAA,MAC3B,GAAG,CAAC;AAAA,IACN;AAAA,IACA,CAAC,IAAI,UAAU,eAAe,gCAAgC,+BAA+B,KAAK;AAAA,EACpG;AACA,QAAM,kBAAc,0BAAY,MAAM;AACpC,aAAS,EAAE;AACX,kBAAc,qCAAa,qBAAqB,MAAS;AAAA,EAC3D,GAAG,CAAC,aAAa,CAAC;AAClB,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,iBAAiB;AAAA,MACjB;AAAA,MACA;AAAA,MACA,iBAAiB;AAAA,MACjB,UAAU;AAAA,MACV,cAAc;AAAA,QACZ,iBAAiB;AAAA,QACjB,OAAO,iBAAiB;AAAA,QACxB,UAAU;AAAA,MACZ;AAAA,MACA,aACE;AAAA,QAAC;AAAA;AAAA,UACC,GAAE;AAAA,UACF,QAAO;AAAA,UACP;AAAA,UACA;AAAA,UAEA;AAAA,wDAAC,kCAAiB,IAAG,6BAA4B,4HAGjD;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,IAAI,kCAAkC,EAAE,IAAI,UAAU;AAAA,gBACtD,aAAY;AAAA,gBACZ;AAAA,gBACA,eAAe,CAAC,aAAa;AAC3B,2BAAS,QAAQ;AAAA,gBACnB;AAAA,gBACA,UAAU;AAAA,gBACV,eAAa,6BAAY;AAAA,gBACzB,cAAW;AAAA,gBACX,oBAAiB;AAAA,gBACjB;AAAA,gBACA;AAAA;AAAA,YACF;AAAA;AAAA;AAAA,MACF;AAAA,MAEF,aAAa,4CAAC,gCAAa;AAAA,MAC3B;AAAA,MACA,WAAU;AAAA;AAAA,EACZ;AAEJ;",
|
|
6
6
|
"names": ["import_constants"]
|
|
7
7
|
}
|
|
@@ -75,10 +75,8 @@ const FreeTextSearchFilter = (props) => {
|
|
|
75
75
|
const handleRef = (0, import_react.useCallback)((newRef) => {
|
|
76
76
|
ref.current = newRef;
|
|
77
77
|
if (shouldFocus.current) {
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
shouldFocus.current = false;
|
|
81
|
-
});
|
|
78
|
+
ref.current?.focus();
|
|
79
|
+
shouldFocus.current = false;
|
|
82
80
|
}
|
|
83
81
|
}, []);
|
|
84
82
|
(0, import_react.useEffect)(() => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/addons/Filters/Components/FreeTextSearchFilter/index.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useRef, useCallback, useState, useEffect } from 'react';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../../constants/index.js';\nimport { usePropsStore } from '../../../../configs/useStore/createInternalAndPropsContext.js';\n\nconst StyledInputFreeTextSearch = styled(DSInputText, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_FILTER,\n})``;\n\nconst StyledInputFreeTextSearchWrapper = styled(Grid, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_WRAPPER,\n})``;\n\nexport const FreeTextSearchFilter: React.ComponentType<DSDataTableT.FilterProps<string>> = (props) => {\n const {\n column,\n referenceColumn,\n column: { id, persistFilterInputAfterSubmit = false },\n onValueChange,\n patchHeaderFilterButtonAndMenu,\n reduxHeader,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const ref = useRef<HTMLInputElement | null>(null);\n const shouldFocus = useRef(true);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(\n () => ({\n columnId: id,\n }),\n [id],\n );\n\n const handleRef = useCallback((newRef: HTMLInputElement | null) => {\n ref.current = newRef;\n if (shouldFocus.current) {\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useCallback, useState, useEffect } from 'react';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../../constants/index.js';\nimport { usePropsStore } from '../../../../configs/useStore/createInternalAndPropsContext.js';\n\nconst StyledInputFreeTextSearch = styled(DSInputText, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_FILTER,\n})``;\n\nconst StyledInputFreeTextSearchWrapper = styled(Grid, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_WRAPPER,\n})``;\n\nexport const FreeTextSearchFilter: React.ComponentType<DSDataTableT.FilterProps<string>> = (props) => {\n const {\n column,\n referenceColumn,\n column: { id, persistFilterInputAfterSubmit = false },\n onValueChange,\n patchHeaderFilterButtonAndMenu,\n reduxHeader,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const ref = useRef<HTMLInputElement | null>(null);\n const shouldFocus = useRef(true);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(\n () => ({\n columnId: id,\n }),\n [id],\n );\n\n /**\n * Focus happens synchronously in the ref callback, not via requestAnimationFrame. The rAF\n * deferral was an unnecessary async hop \u2014 this element is opacity:0 while the popover is\n * closed, not display:none, so it's focusable immediately, no need to wait for a paint. The\n * deferral was riding on an implicit, unstated assumption that a browser frame would always\n * elapse before whatever asserts focus next runs; the ds-data-table react-virtual v3 migration\n * (PUI-19065) added legitimate extra synchronous render work upstream and exposed that this\n * assumption doesn't hold under Jest/jsdom, intermittently losing the race against the test's\n * own synchronous assertion. See antipattern_focus_management.md.\n */\n const handleRef = useCallback((newRef: HTMLInputElement | null) => {\n ref.current = newRef;\n if (shouldFocus.current) {\n ref.current?.focus();\n shouldFocus.current = false;\n }\n }, []);\n useEffect(() => {\n if (reduxHeader?.hideFilterMenu) {\n shouldFocus.current = true;\n }\n }, [reduxHeader?.hideFilterMenu]);\n\n const [value, setValue] = useState<string>('');\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' && value.trim() !== '') {\n // || undefined to clear the filter when empty\n onValueChange(FILTER_TYPES.FREE_TEXT_SEARCH, value || undefined);\n if (!persistFilterInputAfterSubmit) {\n setValue('');\n }\n setTimeout(() => {\n patchHeaderFilterButtonAndMenu(id, true);\n innerRef?.current?.focus();\n }, 0);\n }\n },\n [id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu, persistFilterInputAfterSubmit, value],\n );\n return (\n <FilterPopover\n firstElementRef={ref}\n lastElementRef={ref}\n reduxHeader={reduxHeader}\n column={column}\n columnReference={referenceColumn}\n columnId={id}\n customStyles={{\n backgroundColor: '#fff',\n width: referenceColumn?.offsetWidth,\n minWidth: '80px',\n }}\n menuContent={\n <StyledInputFreeTextSearchWrapper\n p=\"xxs\"\n gutter=\"xxs\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <ScreenReaderOnly id=\"filter-input-instructions\">\n Press Enter to apply the filter and close the dialog. Focus will return to the button that opened this\n dialog.\n </ScreenReaderOnly>\n <StyledInputFreeTextSearch\n id={`ds-data-table-free-text-search-${id}-${domIdAffix}`}\n placeholder=\"\"\n value={value}\n onValueChange={(newValue) => {\n setValue(newValue);\n }}\n innerRef={handleRef}\n onKeyDown={onKeyDown}\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_FREE_TEXT_SEARCH}\n aria-label=\"Free Text Search Filter\"\n aria-describedby=\"filter-input-instructions\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n </StyledInputFreeTextSearchWrapper>\n }\n triggerIcon={<SearchXsmall />}\n innerRef={innerRef}\n ariaLabel=\"Open Free Text Search Filter\"\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["import_constants"]
|
|
7
7
|
}
|
|
@@ -33,7 +33,7 @@ __export(useAutocalculated_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(useAutocalculated_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_react = __toESM(require("react"));
|
|
36
|
-
var import_react_virtual = require("react-virtual");
|
|
36
|
+
var import_react_virtual = require("@tanstack/react-virtual");
|
|
37
37
|
var import_useTableColsWithAddons = require("../useTableColsWithAddons.js");
|
|
38
38
|
var import_useRowFlattenization = require("../useRowFlattenization.js");
|
|
39
39
|
var import_usePaginationConfig = require("../usePaginationConfig.js");
|
|
@@ -63,10 +63,10 @@ const useAutoCalculated = (propsWithDefaults) => {
|
|
|
63
63
|
const [flattenedData, allDataFlattened] = (0, import_useRowFlattenization.useRowFlattenization)(propsWithDefaults);
|
|
64
64
|
const [paginatedData, paginationHelpers] = (0, import_usePaginationConfig.usePaginationConfig)(propsWithDefaults, flattenedData);
|
|
65
65
|
const dataLength = (0, import_react.useMemo)(() => (paginatedData || flattenedData).length, [flattenedData, paginatedData]);
|
|
66
|
-
const visibleRangeRef = (0, import_react.useRef)({
|
|
67
|
-
const virtualListHelpers = (0, import_react_virtual.
|
|
68
|
-
|
|
69
|
-
|
|
66
|
+
const visibleRangeRef = (0, import_react.useRef)({ startIndex: 0, endIndex: 0, overscan: 15, count: dataLength });
|
|
67
|
+
const virtualListHelpers = (0, import_react_virtual.useVirtualizer)({
|
|
68
|
+
count: dataLength,
|
|
69
|
+
getScrollElement: () => virtualListRef.current,
|
|
70
70
|
overscan: 15,
|
|
71
71
|
paddingStart: headerHeightPx,
|
|
72
72
|
estimateSize,
|
|
@@ -75,6 +75,8 @@ const useAutoCalculated = (propsWithDefaults) => {
|
|
|
75
75
|
return (0, import_react_virtual.defaultRangeExtractor)(range);
|
|
76
76
|
}, [])
|
|
77
77
|
});
|
|
78
|
+
const virtualItems = virtualListHelpers.getVirtualItems();
|
|
79
|
+
const totalSize = virtualListHelpers.getTotalSize();
|
|
78
80
|
const isEmptyContent = (0, import_react.useMemo)(() => !isLoading && flattenedData.length === 0, [isLoading, flattenedData.length]);
|
|
79
81
|
const firstFocuseableColumnHeaderId = (0, import_react.useMemo)(() => {
|
|
80
82
|
for (let i = 0; i < visibleColumns.length; i++) {
|
|
@@ -114,6 +116,8 @@ const useAutoCalculated = (propsWithDefaults) => {
|
|
|
114
116
|
paginationHelpers,
|
|
115
117
|
visibleColumns,
|
|
116
118
|
virtualListHelpers,
|
|
119
|
+
virtualItems,
|
|
120
|
+
totalSize,
|
|
117
121
|
flattenedData: paginatedData || flattenedData,
|
|
118
122
|
allDataFlattened,
|
|
119
123
|
isEmptyContent,
|
|
@@ -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": ["/* eslint-disable import/no-cycle */\n/* eslint-disable no-continue */\n/* eslint-disable consistent-return */\n/* eslint-disable no-plusplus */\n/* eslint-disable max-statements */\nimport React, { useEffect, useMemo, useRef } from 'react';\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADKvB,mBAAkD;AAClD,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable import/no-cycle */\n/* eslint-disable no-continue */\n/* eslint-disable consistent-return */\n/* eslint-disable no-plusplus */\n/* eslint-disable max-statements */\nimport React, { useEffect, useMemo, useRef } from 'react';\nimport { useVirtualizer, defaultRangeExtractor, type Range } from '@tanstack/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';\nimport { useNativeResizeObserver } from '../useNativeResizeObserver.js';\n\nconst estimateSize = () => 36;\n\nexport const useAutoCalculated = (propsWithDefaults: DSDataTableT.InternalProps): DSDataTableT.UseAutoCalculatedT => {\n const { actionRef, colsLayoutStyle, hiddenColumns, isLoading } = propsWithDefaults;\n\n const virtualListRef = useRef<HTMLDivElement | null>(null);\n const [bodyClientWidth, setBodyClientWidth] = React.useState<number | string>('100%');\n const columnHeaderRef = useRef<HTMLDivElement | null>(null);\n const [headerHeightPx, setHeaderHeightPx] = React.useState(24);\n const lastSelected = useRef<number>(-1);\n\n const columnHeaderCallbackRef = React.useCallback((node: HTMLDivElement | null) => {\n columnHeaderRef.current = node;\n if (node) setHeaderHeightPx(node.getBoundingClientRect().height);\n }, []);\n\n useNativeResizeObserver(\n columnHeaderRef.current,\n React.useCallback((entry) => {\n setHeaderHeightPx(entry.contentRect.height);\n }, []),\n );\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 // when rangeExtractor is invoked this will be filled with the current range\n const visibleRangeRef = useRef<Range>({ startIndex: 0, endIndex: 0, overscan: 15, count: dataLength });\n // estimateSize should not be really required given what was stated on\n // https://github.com/tannerlinsley/react-virtual/issues/23\n const virtualListHelpers = useVirtualizer<HTMLDivElement, Element>({\n count: dataLength,\n getScrollElement: () => virtualListRef.current,\n overscan: 15,\n paddingStart: headerHeightPx,\n estimateSize,\n rangeExtractor: React.useCallback((range: Range) => {\n visibleRangeRef.current = range;\n\n return defaultRangeExtractor(range);\n }, []),\n });\n\n /**\n * v3's Virtualizer is a single mutated-in-place instance \u2014 virtualListHelpers keeps the exact\n * same reference on every render (unlike v2, which returned a fresh object every render). The\n * props store (zustand, shallow-merged) relies on reference changes to notify subscribers, so a\n * selector reading `state.virtualListHelpers` as a whole (Rows.tsx, VirtualRowsList.tsx) would\n * never see a \"changed\" value again after the first render and would freeze mid-scroll. Calling\n * getVirtualItems()/getTotalSize() here \u2014 unconditionally, on every render of this hook \u2014 pulls\n * fresh, independently-memoized values (new array only when the range truly changes; a plain\n * number otherwise) into their own top-level store fields, so selectors on those specific fields\n * get correct reference/value-based change detection. This call is also what drives the custom\n * rangeExtractor above: it's wired through getVirtualIndexes(), which only runs when something\n * calls getVirtualItems() \u2014 without this, visibleRangeRef would never update either.\n */\n const virtualItems = virtualListHelpers.getVirtualItems();\n const totalSize = virtualListHelpers.getTotalSize();\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({\n virtualListRef,\n measureVirtualList: virtualListHelpers.measure,\n propsWithDefault: propsWithDefaults,\n });\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 virtualItems,\n totalSize,\n flattenedData: paginatedData || flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n virtualListRef,\n columnHeaderRef,\n columnHeaderCallbackRef,\n headerHeightPx,\n lastSelected,\n bodyClientWidth,\n setBodyClientWidth,\n };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -120,6 +120,8 @@ const useWholeStore = () => {
|
|
|
120
120
|
firstFocuseableColumnHeaderId,
|
|
121
121
|
visibleColumns,
|
|
122
122
|
virtualListHelpers,
|
|
123
|
+
virtualItems,
|
|
124
|
+
totalSize,
|
|
123
125
|
layoutHelpers,
|
|
124
126
|
paginationHelpers,
|
|
125
127
|
lastSelected,
|
|
@@ -136,6 +138,8 @@ const useWholeStore = () => {
|
|
|
136
138
|
firstFocuseableColumnHeaderId,
|
|
137
139
|
visibleColumns,
|
|
138
140
|
virtualListHelpers,
|
|
141
|
+
virtualItems,
|
|
142
|
+
totalSize,
|
|
139
143
|
layoutHelpers,
|
|
140
144
|
paginationHelpers,
|
|
141
145
|
lastSelected,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/configs/useStore/useStore.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { type ZustandT } from '@elliemae/ds-zustand-helpers';\nimport { defaultProps, type DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useAutoCalculated } from '../useAutocalculated/index.js';\nimport { InternalProvider, PropsProvider, useInternalStore, usePropsStore } from './createInternalAndPropsContext.js';\n\nconst internalAtomDefaultValues: DSDataTableT.InternalAtoms = {\n drilldownRowId: null,\n focusedRowId: null,\n isShiftPressed: false,\n reduxHeaders: {},\n hoveredColumnId: null,\n isHeaderCellDragging: false,\n};\n\nconst selectors: ZustandT.SelectorObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Selectors> = () => ({});\n\nconst reducers: ZustandT.ReducerObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Reducers> = (get, set) => ({\n patchHeader: (headerId, newHeader) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), ...newHeader },\n },\n }));\n },\n patchHeaderFilterButtonAndMenu: (headerId, value) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), hideFilterMenu: value, hideFilterButton: value },\n },\n }));\n },\n /**\n * PUI-18785: shared \"close this column's own filter menu\" primitive. The header click, the\n * drag handle, and the resize handle all sit inside FilterPopover's floating reference element\n * (the whole header cell), so ds-floating-context's outside-click detection never sees any of\n * those three interactions as \"outside\" and never closes the menu on its own \u2014 each of their\n * handlers calls this instead. Unlike patchHeaderFilterButtonAndMenu (used for genuine outside\n * clicks), only hideFilterMenu is touched \u2014 hideFilterButton is left alone, since these\n * interactions also focus/hover the header cell, which should keep the trigger visible rather\n * than hide it.\n */\n closeFilterMenuIfOpen: (headerId) => {\n if (get().reduxHeaders[headerId]?.hideFilterMenu !== false) return;\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...state.reduxHeaders[headerId], hideFilterMenu: true },\n },\n }));\n },\n // PUI-15154: a column's own onBlur is supposed to hide its DnD handle/sort caret once focus\n // truly leaves it, but that reset doesn't reliably land when focus moves directly from one\n // column's drag handle to another's (both share the same dnd-kit DndContext/PointerSensor).\n // Rather than depend on every column's blur firing correctly, whichever column newly gains\n // focus proactively clears every other column's focus-derived visibility itself. It must skip\n // state.hoveredColumnId though \u2014 hover and focus are independent (a different column can be\n // legitimately hovered by the mouse while this one gains keyboard/click focus), so clearing it\n // here would hide an icon that's still correctly visible under the pointer.\n resetAllHeadersExcept: (exceptHeaderId) => {\n set((state) => {\n const nextReduxHeaders = { ...state.reduxHeaders };\n Object.keys(nextReduxHeaders).forEach((headerId) => {\n if (headerId === exceptHeaderId) return;\n if (headerId === state.hoveredColumnId) return;\n nextReduxHeaders[headerId] = {\n ...nextReduxHeaders[headerId],\n hideFilterMenu: true,\n hideFilterButton: true,\n showDnDHandle: false,\n showSortCaret: false,\n withTabStops: false,\n };\n });\n return { reduxHeaders: nextReduxHeaders };\n });\n },\n});\n\nconst subscribers: ZustandT.Subscribers<DSDataTableT.ShuttleInternalStore> = () => {};\n\nexport const useWholeStore = (): DSDataTableT.Context => {\n const {\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...tableProps\n } = usePropsStore((state) => state);\n\n const internalStore = useInternalStore((state) => state);\n return {\n tableProps,\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...internalStore,\n };\n};\n\nexport const config = {\n defaultProps: defaultProps as () => DSDataTableT.InternalProps,\n internalAtomDefaultValues,\n useAutoCalculated,\n selectors,\n reducers,\n subscribers,\n PropsProvider,\n usePropsStore,\n InternalProvider,\n useInternalStore,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mCAAgD;AAChD,+BAAkC;AAClC,2CAAiF;AAEjF,MAAM,4BAAwD;AAAA,EAC5D,gBAAgB;AAAA,EAChB,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,cAAc,CAAC;AAAA,EACf,iBAAiB;AAAA,EACjB,sBAAsB;AACxB;AAEA,MAAM,YAAgG,OAAO,CAAC;AAE9G,MAAM,WAA6F,CAAC,KAAK,SAAS;AAAA,EAChH,aAAa,CAAC,UAAU,cAAc;AACpC,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAI,MAAM,eAAe,QAAQ,KAAK,CAAC,GAAI,GAAG,UAAU;AAAA,MACxE;AAAA,IACF,EAAE;AAAA,EACJ;AAAA,EACA,gCAAgC,CAAC,UAAU,UAAU;AACnD,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAI,MAAM,eAAe,QAAQ,KAAK,CAAC,GAAI,gBAAgB,OAAO,kBAAkB,MAAM;AAAA,MAC1G;AAAA,IACF,EAAE;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAWA,uBAAuB,CAAC,aAAa;AACnC,QAAI,IAAI,EAAE,aAAa,QAAQ,GAAG,mBAAmB,MAAO;AAC5D,QAAI,CAAC,WAAW;AAAA,MACd,cAAc;AAAA,QACZ,GAAG,MAAM;AAAA,QACT,CAAC,QAAQ,GAAG,EAAE,GAAG,MAAM,aAAa,QAAQ,GAAG,gBAAgB,KAAK;AAAA,MACtE;AAAA,IACF,EAAE;AAAA,EACJ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EASA,uBAAuB,CAAC,mBAAmB;AACzC,QAAI,CAAC,UAAU;AACb,YAAM,mBAAmB,EAAE,GAAG,MAAM,aAAa;AACjD,aAAO,KAAK,gBAAgB,EAAE,QAAQ,CAAC,aAAa;AAClD,YAAI,aAAa,eAAgB;AACjC,YAAI,aAAa,MAAM,gBAAiB;AACxC,yBAAiB,QAAQ,IAAI;AAAA,UAC3B,GAAG,iBAAiB,QAAQ;AAAA,UAC5B,gBAAgB;AAAA,UAChB,kBAAkB;AAAA,UAClB,eAAe;AAAA,UACf,eAAe;AAAA,UACf,cAAc;AAAA,QAChB;AAAA,MACF,CAAC;AACD,aAAO,EAAE,cAAc,iBAAiB;AAAA,IAC1C,CAAC;AAAA,EACH;AACF;AAEA,MAAM,cAAuE,MAAM;AAAC;AAE7E,MAAM,gBAAgB,MAA4B;AACvD,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,QAAI,oDAAc,CAAC,UAAU,KAAK;AAElC,QAAM,oBAAgB,uDAAiB,CAAC,UAAU,KAAK;AACvD,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL;AACF;AAEO,MAAM,SAAS;AAAA,EACpB,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;",
|
|
4
|
+
"sourcesContent": ["import { type ZustandT } from '@elliemae/ds-zustand-helpers';\nimport { defaultProps, type DSDataTableT } from '../../react-desc-prop-types.js';\nimport { useAutoCalculated } from '../useAutocalculated/index.js';\nimport { InternalProvider, PropsProvider, useInternalStore, usePropsStore } from './createInternalAndPropsContext.js';\n\nconst internalAtomDefaultValues: DSDataTableT.InternalAtoms = {\n drilldownRowId: null,\n focusedRowId: null,\n isShiftPressed: false,\n reduxHeaders: {},\n hoveredColumnId: null,\n isHeaderCellDragging: false,\n};\n\nconst selectors: ZustandT.SelectorObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Selectors> = () => ({});\n\nconst reducers: ZustandT.ReducerObject<DSDataTableT.ShuttleInternalStore, DSDataTableT.Reducers> = (get, set) => ({\n patchHeader: (headerId, newHeader) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), ...newHeader },\n },\n }));\n },\n patchHeaderFilterButtonAndMenu: (headerId, value) => {\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...(state.reduxHeaders?.[headerId] ?? {}), hideFilterMenu: value, hideFilterButton: value },\n },\n }));\n },\n /**\n * PUI-18785: shared \"close this column's own filter menu\" primitive. The header click, the\n * drag handle, and the resize handle all sit inside FilterPopover's floating reference element\n * (the whole header cell), so ds-floating-context's outside-click detection never sees any of\n * those three interactions as \"outside\" and never closes the menu on its own \u2014 each of their\n * handlers calls this instead. Unlike patchHeaderFilterButtonAndMenu (used for genuine outside\n * clicks), only hideFilterMenu is touched \u2014 hideFilterButton is left alone, since these\n * interactions also focus/hover the header cell, which should keep the trigger visible rather\n * than hide it.\n */\n closeFilterMenuIfOpen: (headerId) => {\n if (get().reduxHeaders[headerId]?.hideFilterMenu !== false) return;\n set((state) => ({\n reduxHeaders: {\n ...state.reduxHeaders,\n [headerId]: { ...state.reduxHeaders[headerId], hideFilterMenu: true },\n },\n }));\n },\n // PUI-15154: a column's own onBlur is supposed to hide its DnD handle/sort caret once focus\n // truly leaves it, but that reset doesn't reliably land when focus moves directly from one\n // column's drag handle to another's (both share the same dnd-kit DndContext/PointerSensor).\n // Rather than depend on every column's blur firing correctly, whichever column newly gains\n // focus proactively clears every other column's focus-derived visibility itself. It must skip\n // state.hoveredColumnId though \u2014 hover and focus are independent (a different column can be\n // legitimately hovered by the mouse while this one gains keyboard/click focus), so clearing it\n // here would hide an icon that's still correctly visible under the pointer.\n resetAllHeadersExcept: (exceptHeaderId) => {\n set((state) => {\n const nextReduxHeaders = { ...state.reduxHeaders };\n Object.keys(nextReduxHeaders).forEach((headerId) => {\n if (headerId === exceptHeaderId) return;\n if (headerId === state.hoveredColumnId) return;\n nextReduxHeaders[headerId] = {\n ...nextReduxHeaders[headerId],\n hideFilterMenu: true,\n hideFilterButton: true,\n showDnDHandle: false,\n showSortCaret: false,\n withTabStops: false,\n };\n });\n return { reduxHeaders: nextReduxHeaders };\n });\n },\n});\n\nconst subscribers: ZustandT.Subscribers<DSDataTableT.ShuttleInternalStore> = () => {};\n\nexport const useWholeStore = (): DSDataTableT.Context => {\n const {\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n virtualItems,\n totalSize,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...tableProps\n } = usePropsStore((state) => state);\n\n const internalStore = useInternalStore((state) => state);\n return {\n tableProps,\n columnHeaderRef,\n virtualListRef,\n flattenedData,\n allDataFlattened,\n isEmptyContent,\n firstFocuseableColumnHeaderId,\n visibleColumns,\n virtualListHelpers,\n virtualItems,\n totalSize,\n layoutHelpers,\n paginationHelpers,\n lastSelected,\n ...internalStore,\n };\n};\n\nexport const config = {\n defaultProps: defaultProps as () => DSDataTableT.InternalProps,\n internalAtomDefaultValues,\n useAutoCalculated,\n selectors,\n reducers,\n subscribers,\n PropsProvider,\n usePropsStore,\n InternalProvider,\n useInternalStore,\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/configs/useTableResizeCb.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React from 'react';\nimport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\n\n// type for the second parameter of useNativeResizeObserver\ntype NativeResizeObserverCB = Parameters<typeof useNativeResizeObserver>[1];\n\n// type declaration for the custom hook\nexport type UseTableResizeCb = (config: {\n virtualListRef: React.RefObject<HTMLElement>;\n measureVirtualList: DSDataTableT.Context['virtualListHelpers']['measure'];\n propsWithDefault: DSDataTableT.InternalProps;\n}) => void;\n\nexport const useTableResizeCb: UseTableResizeCb = (config) => {\n const { virtualListRef, measureVirtualList, propsWithDefault } = config;\n const { onTableResize } = propsWithDefault;\n const lastMeasuredSize = React.useRef({ width: -1, height: -1 });\n\n const handleResize: NativeResizeObserverCB = React.useCallback(\n (entry) => {\n const { width, height } = entry.contentRect;\n const sizeChanged = width !== lastMeasuredSize.current.width || height !== lastMeasuredSize.current.height;\n\n lastMeasuredSize.current = { width, height };\n\n /**\n * PUI-18153 [Tabs] First DataTable row hidden after switching tabs and returning in carousel mode\n * Recalculate
|
|
4
|
+
"sourcesContent": ["import React from 'react';\nimport { useNativeResizeObserver } from './useNativeResizeObserver.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\n\n// type for the second parameter of useNativeResizeObserver\ntype NativeResizeObserverCB = Parameters<typeof useNativeResizeObserver>[1];\n\n// type declaration for the custom hook\nexport type UseTableResizeCb = (config: {\n virtualListRef: React.RefObject<HTMLElement>;\n measureVirtualList: DSDataTableT.Context['virtualListHelpers']['measure'];\n propsWithDefault: DSDataTableT.InternalProps;\n}) => void;\n\nexport const useTableResizeCb: UseTableResizeCb = (config) => {\n const { virtualListRef, measureVirtualList, propsWithDefault } = config;\n const { onTableResize } = propsWithDefault;\n const lastMeasuredSize = React.useRef({ width: -1, height: -1 });\n\n const handleResize: NativeResizeObserverCB = React.useCallback(\n (entry) => {\n const { width, height } = entry.contentRect;\n const sizeChanged = width !== lastMeasuredSize.current.width || height !== lastMeasuredSize.current.height;\n\n lastMeasuredSize.current = { width, height };\n\n /**\n * PUI-18153 [Tabs] First DataTable row hidden after switching tabs and returning in carousel mode\n * Recalculate the virtualizer's measurements when the scroll container regains\n * a real size after being hidden. This prevents stale offsets/ranges when\n * DataTable is mounted inside tabs or carousel panels.\n *\n * The re-measure is intentionally limited to real, non-zero size changes,\n * which keeps the fix scoped to actual container resize events. A throttle\n * is not added here because no visible resize-related degradation was\n * observed and delaying the re-measure could make the visibility recovery\n * less reliable when the panel becomes visible again.\n */\n if (width > 0 && height > 0 && sizeChanged) {\n measureVirtualList();\n }\n\n if (onTableResize) onTableResize(entry);\n },\n [measureVirtualList, onTableResize],\n );\n\n useNativeResizeObserver(virtualListRef.current, handleResize);\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAClB,qCAAwC;AAajC,MAAM,mBAAqC,CAAC,WAAW;AAC5D,QAAM,EAAE,gBAAgB,oBAAoB,iBAAiB,IAAI;AACjE,QAAM,EAAE,cAAc,IAAI;AAC1B,QAAM,mBAAmB,aAAAA,QAAM,OAAO,EAAE,OAAO,IAAI,QAAQ,GAAG,CAAC;AAE/D,QAAM,eAAuC,aAAAA,QAAM;AAAA,IACjD,CAAC,UAAU;AACT,YAAM,EAAE,OAAO,OAAO,IAAI,MAAM;AAChC,YAAM,cAAc,UAAU,iBAAiB,QAAQ,SAAS,WAAW,iBAAiB,QAAQ;AAEpG,uBAAiB,UAAU,EAAE,OAAO,OAAO;AAc3C,UAAI,QAAQ,KAAK,SAAS,KAAK,aAAa;AAC1C,2BAAmB;AAAA,MACrB;AAEA,UAAI,cAAe,eAAc,KAAK;AAAA,IACxC;AAAA,IACA,CAAC,oBAAoB,aAAa;AAAA,EACpC;AAEA,8DAAwB,eAAe,SAAS,YAAY;AAC9D;",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
package/dist/cjs/parts/Row.js
CHANGED
|
@@ -45,7 +45,7 @@ const StyledRow = (0, import_ds_system.styled)("div", { name: import_constants.D
|
|
|
45
45
|
cursor: ${({ isDisabled }) => isDisabled ? "not-allowed" : "normal"};
|
|
46
46
|
`;
|
|
47
47
|
const Row = (props) => {
|
|
48
|
-
const { row,
|
|
48
|
+
const { row, measureElement, itemIndex, itemWrapperStyle, isDragOverlay } = props;
|
|
49
49
|
const disabledRows = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.disabledRows);
|
|
50
50
|
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
51
51
|
const getOwnerPropsArguments = (0, import_react.useCallback)(() => row, [row]);
|
|
@@ -58,7 +58,8 @@ const Row = (props) => {
|
|
|
58
58
|
{
|
|
59
59
|
isDisabled: disabledRows[row.uid],
|
|
60
60
|
style: !isDragOverlay ? itemWrapperStyle : {},
|
|
61
|
-
innerRef: (0, import_ds_system.mergeRefs)(
|
|
61
|
+
innerRef: (0, import_ds_system.mergeRefs)(measureElement, draggableRef),
|
|
62
|
+
"data-index": itemIndex,
|
|
62
63
|
getOwnerProps,
|
|
63
64
|
getOwnerPropsArguments,
|
|
64
65
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/Row.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useContext } from 'react';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../constants/index.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { SortableItemContext } from './HoC/SortableItemContext.js';\nimport { withDnDSortableRowContext } from './HoC/withDnDSortableRowContext.js';\nimport { RowVariantMapItem } from './RowVariants/index.js';\n\nconst StyledRow = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.ROW })<{ isDisabled: boolean }>`\n cursor: ${({ isDisabled }) => (isDisabled ? 'not-allowed' : 'normal')};\n`;\n\nexport const Row: React.ComponentType<{\n row: DSDataTableT.InternalRow;\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import { mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useContext } from 'react';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../constants/index.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { SortableItemContext } from './HoC/SortableItemContext.js';\nimport { withDnDSortableRowContext } from './HoC/withDnDSortableRowContext.js';\nimport { RowVariantMapItem } from './RowVariants/index.js';\n\nconst StyledRow = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.ROW })<{ isDisabled: boolean }>`\n cursor: ${({ isDisabled }) => (isDisabled ? 'not-allowed' : 'normal')};\n`;\n\nexport const Row: React.ComponentType<{\n row: DSDataTableT.InternalRow;\n measureElement?: DSDataTableT.DataTableVirtualizer['measureElement'];\n itemIndex?: number;\n itemWrapperStyle?: React.CSSProperties;\n isDragOverlay: boolean;\n}> = (props) => {\n const { row, measureElement, itemIndex, itemWrapperStyle, isDragOverlay } = props;\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => row, [row]);\n const focusedRowId = useInternalStore((state) => state.focusedRowId);\n const drilldownRowId = useInternalStore((state) => state.drilldownRowId);\n\n const { draggableProps } = useContext(SortableItemContext);\n const draggableRef = draggableProps && draggableProps.setNodeRef;\n return (\n <StyledRow\n isDisabled={disabledRows[row.uid]}\n style={!isDragOverlay ? itemWrapperStyle : {}}\n innerRef={mergeRefs(measureElement, draggableRef)}\n data-index={itemIndex}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <RowVariantMapItem\n row={row}\n itemIndex={row.realIndex}\n isDragOverlay={isDragOverlay}\n focusedRowId={focusedRowId}\n drilldownRowId={drilldownRowId}\n />\n </StyledRow>\n );\n};\n\nconst RowWithContext = withDnDSortableRowContext(Row);\nexport { RowWithContext };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADsCjB;AAtCN,uBAAkC;AAClC,mBAA+C;AAC/C,2CAAgD;AAChD,uBAAkD;AAElD,iCAAoC;AACpC,uCAA0C;AAC1C,yBAAkC;AAElC,MAAM,gBAAY,yBAAO,OAAO,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,IAAI,CAAC;AAAA,YACzE,CAAC,EAAE,WAAW,MAAO,aAAa,gBAAgB,QAAS;AAAA;AAGhE,MAAM,MAMR,CAAC,UAAU;AACd,QAAM,EAAE,KAAK,gBAAgB,WAAW,kBAAkB,cAAc,IAAI;AAC5E,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB,0BAAY,MAAM,KAAK,CAAC,GAAG,CAAC;AAC3D,QAAM,mBAAe,uDAAiB,CAAC,UAAU,MAAM,YAAY;AACnE,QAAM,qBAAiB,uDAAiB,CAAC,UAAU,MAAM,cAAc;AAEvE,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AACzD,QAAM,eAAe,kBAAkB,eAAe;AACtD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,YAAY,aAAa,IAAI,GAAG;AAAA,MAChC,OAAO,CAAC,gBAAgB,mBAAmB,CAAC;AAAA,MAC5C,cAAU,4BAAU,gBAAgB,YAAY;AAAA,MAChD,cAAY;AAAA,MACZ;AAAA,MACA;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAW,IAAI;AAAA,UACf;AAAA,UACA;AAAA,UACA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,MAAM,qBAAiB,4DAA0B,GAAG;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/parts/Rows.js
CHANGED
|
@@ -41,13 +41,14 @@ var import_DnDTreeContext = require("./HoC/DnDTreeContext.js");
|
|
|
41
41
|
var import_withConditionalDnDRowContext = require("./HoC/withConditionalDnDRowContext.js");
|
|
42
42
|
var import_Row = require("./Row.js");
|
|
43
43
|
const Rows = () => {
|
|
44
|
-
const
|
|
44
|
+
const virtualItems = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.virtualItems);
|
|
45
|
+
const { measureElement } = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.virtualListHelpers);
|
|
45
46
|
const flattenedData = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.flattenedData);
|
|
46
47
|
const visibleColumns = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.visibleColumns);
|
|
47
48
|
const ctx = (0, import_react2.useContext)(import_DnDTreeContext.DnDTreeContext);
|
|
48
49
|
const items = ctx?.visibleItems || flattenedData;
|
|
49
50
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: virtualItems.map((virtualItem) => {
|
|
50
|
-
const { index,
|
|
51
|
+
const { index, start } = virtualItem;
|
|
51
52
|
const row = items[index];
|
|
52
53
|
if (!row) return null;
|
|
53
54
|
(0, import_helpers.addCellData)(row, visibleColumns);
|
|
@@ -59,9 +60,7 @@ const Rows = () => {
|
|
|
59
60
|
};
|
|
60
61
|
const rowProps = {
|
|
61
62
|
row,
|
|
62
|
-
|
|
63
|
-
index,
|
|
64
|
-
// this is consumed by the DnD HOC
|
|
63
|
+
measureElement,
|
|
65
64
|
itemIndex: index,
|
|
66
65
|
itemWrapperStyle: style,
|
|
67
66
|
isDragOverlay: false
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/Rows.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useContext } from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { addCellData } from '../helpers/index.js';\nimport { DnDTreeContext } from './HoC/DnDTreeContext.js';\nimport { withConditionalDnDRowContext } from './HoC/withConditionalDnDRowContext.js';\nimport { RowWithContext as Row } from './Row.js';\n\nconst Rows = (): JSX.Element => {\n const
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useContext } from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { addCellData } from '../helpers/index.js';\nimport { DnDTreeContext } from './HoC/DnDTreeContext.js';\nimport { withConditionalDnDRowContext } from './HoC/withConditionalDnDRowContext.js';\nimport { RowWithContext as Row } from './Row.js';\n\nconst Rows = (): JSX.Element => {\n // virtualItems is its own top-level store field (not read off virtualListHelpers as a whole) \u2014\n // v3's virtualizer instance never changes reference, so a selector on the whole object would\n // never notify this component of new ranges. See useAutocalculated/index.tsx.\n const virtualItems = usePropsStore((state) => state.virtualItems);\n const { measureElement } = usePropsStore((state) => state.virtualListHelpers);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const visibleColumns = usePropsStore((state) => state.visibleColumns);\n\n const ctx = useContext(DnDTreeContext);\n\n const items = ctx?.visibleItems || flattenedData;\n\n return (\n <>\n {virtualItems.map((virtualItem) => {\n const { index, start } = virtualItem;\n const row = items[index];\n if (!row) return null;\n addCellData(row, visibleColumns);\n const style: React.CSSProperties = {\n position: 'absolute',\n top: `${start}px`,\n left: 0,\n width: '100%',\n };\n const rowProps = {\n row,\n measureElement,\n itemIndex: index,\n itemWrapperStyle: style,\n isDragOverlay: false,\n };\n return <Row {...rowProps} key={`ds-table-row-${row.uid}`} />;\n })}\n </>\n );\n};\n\nRows.propTypes = {};\n\nexport const RowsWithContext = withConditionalDnDRowContext(Rows);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADqBnB;AAmBW;AAxCf,IAAAA,gBAAkC;AAClC,2CAA8B;AAC9B,qBAA4B;AAC5B,4BAA+B;AAC/B,0CAA6C;AAC7C,iBAAsC;AAEtC,MAAM,OAAO,MAAmB;AAI9B,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,EAAE,eAAe,QAAI,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AAEpE,QAAM,UAAM,0BAAW,oCAAc;AAErC,QAAM,QAAQ,KAAK,gBAAgB;AAEnC,SACE,2EACG,uBAAa,IAAI,CAAC,gBAAgB;AACjC,UAAM,EAAE,OAAO,MAAM,IAAI;AACzB,UAAM,MAAM,MAAM,KAAK;AACvB,QAAI,CAAC,IAAK,QAAO;AACjB,oCAAY,KAAK,cAAc;AAC/B,UAAM,QAA6B;AAAA,MACjC,UAAU;AAAA,MACV,KAAK,GAAG,KAAK;AAAA,MACb,MAAM;AAAA,MACN,OAAO;AAAA,IACT;AACA,UAAM,WAAW;AAAA,MACf;AAAA,MACA;AAAA,MACA,WAAW;AAAA,MACX,kBAAkB;AAAA,MAClB,eAAe;AAAA,IACjB;AACA,WAAO,gDAAC,WAAAC,gBAAA,EAAK,GAAG,UAAU,KAAK,gBAAgB,IAAI,GAAG,IAAI;AAAA,EAC5D,CAAC,GACH;AAEJ;AAEA,KAAK,YAAY,CAAC;AAEX,MAAM,sBAAkB,kEAA6B,IAAI;",
|
|
6
6
|
"names": ["import_react", "Row"]
|
|
7
7
|
}
|
|
@@ -50,7 +50,8 @@ const VirtualRowsList = () => {
|
|
|
50
50
|
const flattenedData = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.flattenedData);
|
|
51
51
|
const isEmptyContent = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.isEmptyContent);
|
|
52
52
|
const { totalColumnsWidth, gridLayout } = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.layoutHelpers);
|
|
53
|
-
const
|
|
53
|
+
const totalSize = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.totalSize);
|
|
54
|
+
const { scrollToIndex } = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.virtualListHelpers);
|
|
54
55
|
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
55
56
|
const isHeaderCellDragging = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.isHeaderCellDragging);
|
|
56
57
|
const setFocusedRowId = (0, import_createInternalAndPropsContext.useInternalStore)((state) => state.setFocusedRowId);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/parts/VirtualRowsList.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable consistent-return */\nimport React, { useCallback, useMemo } from 'react';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { StyledTableContentWrapper, StyledVirtualListWrapper } from '../styled.js';\nimport { EmptyContent } from './EmptyContent.js'; // imported this way to avoid circular dependencies\nimport { Headers } from './Headers/index.js'; // imported this way to avoid circular dependencies\nimport { MemoizedLoader as Loader } from './Loader.js';\nimport { RowsWithContext as Rows } from './Rows.js'; // imported this way to avoid circular dependencies\nimport { useFreezeVirtualScrollOnDrag } from '../configs/useFreezeVirtualScrollOnDrag.js';\nexport const VirtualRowsList = () => {\n const isLoading = usePropsStore((state) => state.isLoading);\n\n const virtualListRef = usePropsStore((state) => state.virtualListRef);\n const headerHeightPx = usePropsStore((state) => state.headerHeightPx);\n const setBodyClientWidth = usePropsStore((state) => state.setBodyClientWidth);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n const { totalColumnsWidth, gridLayout } = usePropsStore((state) => state.layoutHelpers);\n const
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable consistent-return */\nimport React, { useCallback, useMemo } from 'react';\nimport { useInternalStore, usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport { DATA_TESTID } from '../configs/constants.js';\nimport { StyledTableContentWrapper, StyledVirtualListWrapper } from '../styled.js';\nimport { EmptyContent } from './EmptyContent.js'; // imported this way to avoid circular dependencies\nimport { Headers } from './Headers/index.js'; // imported this way to avoid circular dependencies\nimport { MemoizedLoader as Loader } from './Loader.js';\nimport { RowsWithContext as Rows } from './Rows.js'; // imported this way to avoid circular dependencies\nimport { useFreezeVirtualScrollOnDrag } from '../configs/useFreezeVirtualScrollOnDrag.js';\nexport const VirtualRowsList = () => {\n const isLoading = usePropsStore((state) => state.isLoading);\n\n const virtualListRef = usePropsStore((state) => state.virtualListRef);\n const headerHeightPx = usePropsStore((state) => state.headerHeightPx);\n const setBodyClientWidth = usePropsStore((state) => state.setBodyClientWidth);\n const flattenedData = usePropsStore((state) => state.flattenedData);\n const isEmptyContent = usePropsStore((state) => state.isEmptyContent);\n const { totalColumnsWidth, gridLayout } = usePropsStore((state) => state.layoutHelpers);\n // totalSize is its own top-level store field (not read off virtualListHelpers as a whole) \u2014 see\n // the comment in useAutocalculated/index.tsx for why. scrollToIndex is a stable method on the\n // virtualizer instance, so pulling it off the whole object is fine.\n const totalSize = usePropsStore((state) => state.totalSize);\n const { scrollToIndex } = usePropsStore((state) => state.virtualListHelpers);\n const getOwnerProps = usePropsStore((store) => store.get);\n const isHeaderCellDragging = useInternalStore((state) => state.isHeaderCellDragging);\n const setFocusedRowId = useInternalStore((state) => state.setFocusedRowId);\n\n const onKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.ctrlKey && e.code === 'End') {\n scrollToIndex(flattenedData.length - 1);\n setFocusedRowId(flattenedData[flattenedData.length - 1].uid);\n } else if (e.ctrlKey && e.code === 'Home') {\n scrollToIndex(0, { align: 'center' });\n setFocusedRowId(flattenedData[0].uid);\n }\n },\n [scrollToIndex, setFocusedRowId, flattenedData],\n );\n\n const tableContentWrapperHeight = useMemo(\n () => (isEmptyContent || isLoading ? '100%' : totalSize),\n [isEmptyContent, isLoading, totalSize],\n );\n\n useFreezeVirtualScrollOnDrag(virtualListRef, isHeaderCellDragging);\n\n const trackVirtualListRefAndClientWidth = useCallback(\n (node: HTMLDivElement | null) => {\n virtualListRef.current = node;\n if (node) {\n const { clientWidth } = node;\n // if we don't track this with a non-ref, react will not know some component needs to be re-rendered to apply the new width\n setBodyClientWidth(clientWidth);\n }\n },\n [virtualListRef, setBodyClientWidth],\n );\n\n return (\n <StyledVirtualListWrapper\n innerRef={trackVirtualListRefAndClientWidth}\n data-testid={DATA_TESTID.DATA_TABLE_SCROLLABLE_CONTAINER}\n onKeyDown={onKeyDown}\n tabIndex={-1}\n role=\"rowgroup\"\n gridLayout={gridLayout}\n totalColumnsWidth={totalColumnsWidth}\n headerHeightPx={headerHeightPx}\n aria-busy={isLoading}\n getOwnerProps={getOwnerProps}\n >\n <StyledTableContentWrapper\n height={tableContentWrapperHeight}\n rows={['min-content', 'auto']}\n cols={['100%']}\n getOwnerProps={getOwnerProps}\n >\n <Headers />\n {isEmptyContent && <EmptyContent />}\n {isLoading ? <Loader /> : null}\n {!isLoading && !isEmptyContent && <Rows />}\n </StyledTableContentWrapper>\n </StyledVirtualListWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADyEjB;AAxEN,mBAA4C;AAC5C,2CAAgD;AAChD,uBAA4B;AAC5B,oBAAoE;AACpE,0BAA6B;AAC7B,qBAAwB;AACxB,oBAAyC;AACzC,kBAAwC;AACxC,0CAA6C;AACtC,MAAM,kBAAkB,MAAM;AACnC,QAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAE1D,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,yBAAqB,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,aAAa;AAClE,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,EAAE,mBAAmB,WAAW,QAAI,oDAAc,CAAC,UAAU,MAAM,aAAa;AAItF,QAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,QAAM,EAAE,cAAc,QAAI,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC3E,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,2BAAuB,uDAAiB,CAAC,UAAU,MAAM,oBAAoB;AACnF,QAAM,sBAAkB,uDAAiB,CAAC,UAAU,MAAM,eAAe;AAEzE,QAAM,gBAAY;AAAA,IAChB,CAAC,MAA2B;AAC1B,UAAI,EAAE,WAAW,EAAE,SAAS,OAAO;AACjC,sBAAc,cAAc,SAAS,CAAC;AACtC,wBAAgB,cAAc,cAAc,SAAS,CAAC,EAAE,GAAG;AAAA,MAC7D,WAAW,EAAE,WAAW,EAAE,SAAS,QAAQ;AACzC,sBAAc,GAAG,EAAE,OAAO,SAAS,CAAC;AACpC,wBAAgB,cAAc,CAAC,EAAE,GAAG;AAAA,MACtC;AAAA,IACF;AAAA,IACA,CAAC,eAAe,iBAAiB,aAAa;AAAA,EAChD;AAEA,QAAM,gCAA4B;AAAA,IAChC,MAAO,kBAAkB,YAAY,SAAS;AAAA,IAC9C,CAAC,gBAAgB,WAAW,SAAS;AAAA,EACvC;AAEA,wEAA6B,gBAAgB,oBAAoB;AAEjE,QAAM,wCAAoC;AAAA,IACxC,CAAC,SAAgC;AAC/B,qBAAe,UAAU;AACzB,UAAI,MAAM;AACR,cAAM,EAAE,YAAY,IAAI;AAExB,2BAAmB,WAAW;AAAA,MAChC;AAAA,IACF;AAAA,IACA,CAAC,gBAAgB,kBAAkB;AAAA,EACrC;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,UAAU;AAAA,MACV,eAAa,6BAAY;AAAA,MACzB;AAAA,MACA,UAAU;AAAA,MACV,MAAK;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA,aAAW;AAAA,MACX;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,QAAQ;AAAA,UACR,MAAM,CAAC,eAAe,MAAM;AAAA,UAC5B,MAAM,CAAC,MAAM;AAAA,UACb;AAAA,UAEA;AAAA,wDAAC,0BAAQ;AAAA,YACR,kBAAkB,4CAAC,oCAAa;AAAA,YAChC,YAAY,4CAAC,cAAAA,gBAAA,EAAO,IAAK;AAAA,YACzB,CAAC,aAAa,CAAC,kBAAkB,4CAAC,YAAAC,iBAAA,EAAK;AAAA;AAAA;AAAA,MAC1C;AAAA;AAAA,EACF;AAEJ;",
|
|
6
6
|
"names": ["Loader", "Rows"]
|
|
7
7
|
}
|