@elliemae/ds-data-table 3.51.0-next.9 → 3.51.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 +4 -1
- package/dist/cjs/DSDataTableDefinitions.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/usePaginationConfig.js +5 -2
- package/dist/cjs/configs/usePaginationConfig.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/RowRenderer/DefaultRowContentRenderer.js +4 -0
- package/dist/cjs/exported-related/RowRenderer/DefaultRowContentRenderer.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/SortByCaret.js +1 -1
- package/dist/cjs/parts/SortByCaret.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/esm/DSDataTableDefinitions.js +4 -1
- package/dist/esm/DSDataTableDefinitions.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/usePaginationConfig.js +5 -2
- package/dist/esm/configs/usePaginationConfig.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/RowRenderer/DefaultRowContentRenderer.js +5 -1
- package/dist/esm/exported-related/RowRenderer/DefaultRowContentRenderer.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/SortByCaret.js +1 -1
- package/dist/esm/parts/SortByCaret.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/types/DSDataTableDefinitions.d.ts +1 -0
- package/dist/types/configs/useTableColsWithAddons.d.ts +1 -2
- package/dist/types/react-desc-prop-types.d.ts +2 -1
- package/package.json +28 -28
|
@@ -28,11 +28,13 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
28
28
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
29
|
var DSDataTableDefinitions_exports = {};
|
|
30
30
|
__export(DSDataTableDefinitions_exports, {
|
|
31
|
+
DSDataTableDataTestIds: () => DSDataTableDataTestIds,
|
|
31
32
|
DSDataTableName: () => DSDataTableName,
|
|
32
33
|
DSDataTableSlots: () => DSDataTableSlots
|
|
33
34
|
});
|
|
34
35
|
module.exports = __toCommonJS(DSDataTableDefinitions_exports);
|
|
35
36
|
var React = __toESM(require("react"));
|
|
37
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
36
38
|
const DSDataTableName = "DSDatatable";
|
|
37
39
|
const DSDataTableSlots = {
|
|
38
40
|
ROOT: "root",
|
|
@@ -64,7 +66,7 @@ const DSDataTableSlots = {
|
|
|
64
66
|
ROW: "row",
|
|
65
67
|
GROUP_HEADER_CONTAINER: "group-header-container",
|
|
66
68
|
GROUP_HEADER_TITLE: "header-title",
|
|
67
|
-
CELL_CONTAINER: "
|
|
69
|
+
CELL_CONTAINER: "cells-container",
|
|
68
70
|
TOOLBAR_WRAPPER: "toolbar-wrapper",
|
|
69
71
|
TOOLBAR_BUTTONS_WRAPPER: "toolbar-buttons-wrapper",
|
|
70
72
|
TOOLBAR_BUTTON: "toolbar-button",
|
|
@@ -78,4 +80,5 @@ const DSDataTableSlots = {
|
|
|
78
80
|
LOADER_WRAPPER: "loader-wrapper",
|
|
79
81
|
FILTER_BAR_WRAPPER: "filter-bar-wrapper"
|
|
80
82
|
};
|
|
83
|
+
const DSDataTableDataTestIds = (0, import_ds_system.slotObjectToDataTestIds)(DSDataTableName, DSDataTableSlots);
|
|
81
84
|
//# sourceMappingURL=DSDataTableDefinitions.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSDataTableDefinitions.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\nexport 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: 'cells-container',\n TOOLBAR_WRAPPER: 'toolbar-wrapper',\n TOOLBAR_BUTTONS_WRAPPER: 'toolbar-buttons-wrapper',\n TOOLBAR_BUTTON: 'toolbar-button',\n TOOLBAR_POSITION: 'toolbar-position',\n EMPTY_STATE_WRAPPER: 'empty-state-wrapper',\n WARNING_ICON: 'warning-icon',\n EMPTY_PRIMARY_MESSAGE: 'empty-primary-message',\n EMPTY_SECONDARY_MESSAGE: 'empty-secondary-message',\n EMPTY_BUTTON: 'empty-button',\n CENTER_CONTENT_FLEX_WRAPPER: 'center-content-flex-wrapper',\n LOADER_WRAPPER: 'loader-wrapper',\n FILTER_BAR_WRAPPER: 'filter-bar-wrapper',\n};\n\nexport const DSDataTableDataTestIds = slotObjectToDataTestIds(DSDataTableName, DSDataTableSlots);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AACjC,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;AAEO,MAAM,6BAAyB,0CAAwB,iBAAiB,gBAAgB;",
|
|
6
6
|
"names": []
|
|
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
|
}
|
|
@@ -56,7 +56,8 @@ const usePaginationConfig = (props, flattenedData) => {
|
|
|
56
56
|
maxPerPage = 100,
|
|
57
57
|
showPerPageSelector = true,
|
|
58
58
|
pageDetails = [],
|
|
59
|
-
pageDetailsTitle = ""
|
|
59
|
+
pageDetailsTitle = "",
|
|
60
|
+
...rest
|
|
60
61
|
} = pagination || noPagination;
|
|
61
62
|
const page = (0, import_react.useMemo)(() => {
|
|
62
63
|
if (!hasPagination || !pagination) return null;
|
|
@@ -65,6 +66,7 @@ const usePaginationConfig = (props, flattenedData) => {
|
|
|
65
66
|
}, [hasPagination, pagination, dataIsPage, flattenedData, pageIndex, pageSize]);
|
|
66
67
|
const paginationHelpers = (0, import_react.useMemo)(
|
|
67
68
|
() => ({
|
|
69
|
+
...rest,
|
|
68
70
|
hasPagination,
|
|
69
71
|
pageIndex,
|
|
70
72
|
canPreviousPage,
|
|
@@ -102,7 +104,8 @@ const usePaginationConfig = (props, flattenedData) => {
|
|
|
102
104
|
maxPerPage,
|
|
103
105
|
showPerPageSelector,
|
|
104
106
|
pageDetails,
|
|
105
|
-
pageDetailsTitle
|
|
107
|
+
pageDetailsTitle,
|
|
108
|
+
rest
|
|
106
109
|
]
|
|
107
110
|
);
|
|
108
111
|
return [page, paginationHelpers];
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/configs/usePaginationConfig.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { useMemo } from 'react';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\n\nconst noPagination: Record<string, never> = {};\n\nconst emptyFunc = () => null;\n\nexport const usePaginationConfig = (\n props: DSDataTableT.InternalProps,\n flattenedData: DSDataTableT.InternalRow[],\n): [DSDataTableT.InternalRow[] | null, DSDataTableT.Pagination] => {\n const { pagination, Pagination } = props;\n\n const hasPagination = Boolean(pagination || Pagination);\n\n // Set default values\n const {\n pageIndex = 1,\n canPreviousPage = true,\n canNextPage = true,\n pageSize = 10,\n perPageOptions = [10],\n onPageSizeChange = emptyFunc,\n onPreviousPage = emptyFunc,\n onNextPage = emptyFunc,\n onPageChange = emptyFunc,\n pageCount = Math.ceil(flattenedData.length / pageSize),\n isLoadingPageCount = false,\n dataIsPage = false,\n perPageStep = 5,\n minPerPage = 0,\n maxPerPage = 100,\n showPerPageSelector = true,\n pageDetails = [],\n pageDetailsTitle = '',\n } = pagination || noPagination; // pagination can be false\n\n // Get the needed page\n const page = useMemo(() => {\n if (!hasPagination || !pagination) return null;\n if (dataIsPage) return flattenedData;\n return flattenedData.slice((pageIndex - 1) * pageSize, pageIndex * pageSize);\n }, [hasPagination, pagination, dataIsPage, flattenedData, pageIndex, pageSize]);\n\n const paginationHelpers = useMemo(\n () => ({\n hasPagination,\n pageIndex,\n canPreviousPage,\n canNextPage,\n pageSize,\n perPageOptions,\n onPageSizeChange,\n onPreviousPage,\n onNextPage,\n onPageChange,\n pageCount,\n isLoadingPageCount: isLoadingPageCount,\n perPageStep,\n minPerPage,\n maxPerPage,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n }),\n [\n hasPagination,\n pageIndex,\n canPreviousPage,\n canNextPage,\n pageSize,\n perPageOptions,\n onPageSizeChange,\n onPreviousPage,\n onNextPage,\n onPageChange,\n pageCount,\n isLoadingPageCount,\n perPageStep,\n minPerPage,\n maxPerPage,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n ],\n );\n return [page, paginationHelpers];\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAGxB,MAAM,eAAsC,CAAC;AAE7C,MAAM,YAAY,MAAM;AAEjB,MAAM,sBAAsB,CACjC,OACA,kBACiE;AACjE,QAAM,EAAE,YAAY,WAAW,IAAI;AAEnC,QAAM,gBAAgB,QAAQ,cAAc,UAAU;AAGtD,QAAM;AAAA,IACJ,YAAY;AAAA,IACZ,kBAAkB;AAAA,IAClB,cAAc;AAAA,IACd,WAAW;AAAA,IACX,iBAAiB,CAAC,EAAE;AAAA,IACpB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,eAAe;AAAA,IACf,YAAY,KAAK,KAAK,cAAc,SAAS,QAAQ;AAAA,IACrD,qBAAqB;AAAA,IACrB,aAAa;AAAA,IACb,cAAc;AAAA,IACd,aAAa;AAAA,IACb,aAAa;AAAA,IACb,sBAAsB;AAAA,IACtB,cAAc,CAAC;AAAA,IACf,mBAAmB;AAAA,
|
|
4
|
+
"sourcesContent": ["import { useMemo } from 'react';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\n\nconst noPagination: Record<string, never> = {};\n\nconst emptyFunc = () => null;\n\nexport const usePaginationConfig = (\n props: DSDataTableT.InternalProps,\n flattenedData: DSDataTableT.InternalRow[],\n): [DSDataTableT.InternalRow[] | null, DSDataTableT.Pagination] => {\n const { pagination, Pagination } = props;\n\n const hasPagination = Boolean(pagination || Pagination);\n\n // Set default values\n const {\n pageIndex = 1,\n canPreviousPage = true,\n canNextPage = true,\n pageSize = 10,\n perPageOptions = [10],\n onPageSizeChange = emptyFunc,\n onPreviousPage = emptyFunc,\n onNextPage = emptyFunc,\n onPageChange = emptyFunc,\n pageCount = Math.ceil(flattenedData.length / pageSize),\n isLoadingPageCount = false,\n dataIsPage = false,\n perPageStep = 5,\n minPerPage = 0,\n maxPerPage = 100,\n showPerPageSelector = true,\n pageDetails = [],\n pageDetailsTitle = '',\n ...rest\n } = pagination || noPagination; // pagination can be false\n\n // Get the needed page\n const page = useMemo(() => {\n if (!hasPagination || !pagination) return null;\n if (dataIsPage) return flattenedData;\n return flattenedData.slice((pageIndex - 1) * pageSize, pageIndex * pageSize);\n }, [hasPagination, pagination, dataIsPage, flattenedData, pageIndex, pageSize]);\n\n const paginationHelpers = useMemo(\n () => ({\n ...rest,\n hasPagination,\n pageIndex,\n canPreviousPage,\n canNextPage,\n pageSize,\n perPageOptions,\n onPageSizeChange,\n onPreviousPage,\n onNextPage,\n onPageChange,\n pageCount,\n isLoadingPageCount: isLoadingPageCount,\n perPageStep,\n minPerPage,\n maxPerPage,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n }),\n [\n hasPagination,\n pageIndex,\n canPreviousPage,\n canNextPage,\n pageSize,\n perPageOptions,\n onPageSizeChange,\n onPreviousPage,\n onNextPage,\n onPageChange,\n pageCount,\n isLoadingPageCount,\n perPageStep,\n minPerPage,\n maxPerPage,\n showPerPageSelector,\n pageDetails,\n pageDetailsTitle,\n rest,\n ],\n );\n return [page, paginationHelpers];\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAGxB,MAAM,eAAsC,CAAC;AAE7C,MAAM,YAAY,MAAM;AAEjB,MAAM,sBAAsB,CACjC,OACA,kBACiE;AACjE,QAAM,EAAE,YAAY,WAAW,IAAI;AAEnC,QAAM,gBAAgB,QAAQ,cAAc,UAAU;AAGtD,QAAM;AAAA,IACJ,YAAY;AAAA,IACZ,kBAAkB;AAAA,IAClB,cAAc;AAAA,IACd,WAAW;AAAA,IACX,iBAAiB,CAAC,EAAE;AAAA,IACpB,mBAAmB;AAAA,IACnB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb,eAAe;AAAA,IACf,YAAY,KAAK,KAAK,cAAc,SAAS,QAAQ;AAAA,IACrD,qBAAqB;AAAA,IACrB,aAAa;AAAA,IACb,cAAc;AAAA,IACd,aAAa;AAAA,IACb,aAAa;AAAA,IACb,sBAAsB;AAAA,IACtB,cAAc,CAAC;AAAA,IACf,mBAAmB;AAAA,IACnB,GAAG;AAAA,EACL,IAAI,cAAc;AAGlB,QAAM,WAAO,sBAAQ,MAAM;AACzB,QAAI,CAAC,iBAAiB,CAAC,WAAY,QAAO;AAC1C,QAAI,WAAY,QAAO;AACvB,WAAO,cAAc,OAAO,YAAY,KAAK,UAAU,YAAY,QAAQ;AAAA,EAC7E,GAAG,CAAC,eAAe,YAAY,YAAY,eAAe,WAAW,QAAQ,CAAC;AAE9E,QAAM,wBAAoB;AAAA,IACxB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,SAAO,CAAC,MAAM,iBAAiB;AACjC;",
|
|
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
|
}
|
|
@@ -84,6 +84,8 @@ const DefaultRowContentRenderer = (props) => {
|
|
|
84
84
|
const getAriaLabelForRow = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.getAriaLabelForRow);
|
|
85
85
|
const visibleColumns = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.visibleColumns);
|
|
86
86
|
const domIdAffix = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.domIdAffix);
|
|
87
|
+
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
88
|
+
const getOwnerPropsArguments = (0, import_react.useCallback)(() => row, [row]);
|
|
87
89
|
const rowRef = (0, import_react.useRef)(null);
|
|
88
90
|
const isDndActive = draggableProps && draggableProps.active;
|
|
89
91
|
const isDragging = draggableProps && draggableProps.isDragging;
|
|
@@ -134,6 +136,8 @@ const DefaultRowContentRenderer = (props) => {
|
|
|
134
136
|
selected: noSelectionColumn && selection?.[row.uid] === true,
|
|
135
137
|
isDisabled: disabledRows[row.uid],
|
|
136
138
|
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_ROW_CONTENT,
|
|
139
|
+
getOwnerProps,
|
|
140
|
+
getOwnerPropsArguments,
|
|
137
141
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
138
142
|
import_Cells.Cells,
|
|
139
143
|
{
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/exported-related/RowRenderer/DefaultRowContentRenderer.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable complexity */\nimport React, {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADarB;AAAA;AAAA;AAAA;AAAA;AAZF,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable complexity */\nimport React, { useMemo, useLayoutEffect, useRef, type PropsWithChildren, useCallback } from 'react';\nimport { INTERNAL_COLUMNS } from '../../addons/Columns/index.js';\nimport { DATA_TESTID, DropIndicatorPosition } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { Cells } from '../../parts/Cells/index.js';\nimport type { RowVariantProps } from '../../parts/RowVariants/types.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { StyledCellContainer } from '../../styled.js';\n\nconst DetailsWrapper: React.ComponentType<PropsWithChildren> = (props) => (\n // This can be further customized\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n data-role=\"detail-view\"\n style={{\n borderTop: '1px solid #EBEDF0',\n borderBottom: '1px solid #EBEDF0',\n }}\n onClick={(e) => e.stopPropagation()}\n onKeyDown={(e) => e.stopPropagation()}\n >\n {props.children}\n </div>\n);\n\nconst getDefaultAriaLabelMessageForRow = ({\n row,\n selected,\n disabled,\n expanded,\n expandable,\n}: {\n row: DSDataTableT.InternalRow;\n selected: boolean;\n disabled: boolean;\n expanded: boolean;\n expandable: boolean;\n}) =>\n `Row number ${row.realIndex + 1}${row.parentIndex !== null ? `, child of row number ${row.parentIndex + 1}` : ''}. ${\n selected ? 'Selected. ' : ''\n }${disabled ? 'Disabled. ' : 'To interact with the cells press enter. '}${\n // eslint-disable-next-line no-nested-ternary\n expandable ? (expanded ? 'Expanded. ' : 'Collapsed. ') : ''\n }`;\n\nexport const DefaultRowContentRenderer: React.ComponentType<RowVariantProps> = (props) => {\n const {\n row,\n draggableProps,\n isDragOverlay,\n backgroundColor = 'neutral-000',\n dropIndicatorPosition,\n isDropValid,\n focusedRowId,\n drilldownRowId,\n compact,\n } = props;\n\n const isExpandable = usePropsStore((state) => state.isExpandable);\n const selection = usePropsStore((state) => state.selection);\n const noSelectionColumn = usePropsStore((state) => state.noSelectionColumn);\n const expandedRows = usePropsStore((state) => state.expandedRows);\n const disabledRows = usePropsStore((state) => state.disabledRows);\n const getAriaLabelForRow = usePropsStore((state) => state.getAriaLabelForRow);\n const visibleColumns = usePropsStore((state) => state.visibleColumns);\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(() => row, [row]);\n const rowRef = useRef<HTMLDivElement>(null);\n const isDndActive = draggableProps && draggableProps.active;\n const isDragging = draggableProps && draggableProps.isDragging;\n\n useLayoutEffect(() => {\n if (row.uid === focusedRowId) {\n rowRef.current?.focus();\n }\n }, [focusedRowId, row.uid]);\n\n const detailsIndent = useMemo(() => {\n let padding = 0;\n for (let i = 0; i < visibleColumns.length; i += 1) {\n if (INTERNAL_COLUMNS.includes(visibleColumns[i].id)) {\n padding += visibleColumns[i].width as number;\n } else {\n padding += row.depth * 32 + 15;\n break;\n }\n }\n return padding;\n }, [row.depth, visibleColumns]);\n\n const DetailsView = row.original.tableRowDetails;\n\n const rowAriaLabelProps = {\n row,\n selected: selection?.[row.uid] === true,\n disabled: disabledRows[row.uid],\n expandable: isExpandable,\n expanded: expandedRows[row.uid] === true,\n };\n\n return (\n <>\n <StyledCellContainer\n innerRef={rowRef}\n key={row.uid}\n tabIndex={0}\n role=\"row\"\n aria-rowindex={row.realIndex + 1}\n aria-label={(getAriaLabelForRow ?? getDefaultAriaLabelMessageForRow)(rowAriaLabelProps)}\n aria-selected={selection?.[row.uid] === true}\n aria-disabled={disabledRows[row.uid]}\n backgroundColor={backgroundColor}\n height={compact ? '24px' : 'auto'}\n minHeight={compact ? '24px' : '36px'}\n isDropIndicatorPositionInside={dropIndicatorPosition === DropIndicatorPosition.Inside}\n isDropValid={isDropValid}\n shouldDisplayHover={!isDndActive && !isDragging && !isDragOverlay}\n isDragOverlay={isDragOverlay}\n isDragging={isDragging}\n selected={noSelectionColumn && selection?.[row.uid] === true}\n isDisabled={disabledRows[row.uid]}\n data-testid={DATA_TESTID.DATA_TABLE_ROW_CONTENT}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n <Cells\n row={row}\n isRowSelected={drilldownRowId === row.uid}\n isDragOverlay={isDragOverlay}\n key={row.uid}\n // @ts-expect-error - data-table typescript is broken\n domIdAffix={domIdAffix}\n />\n </StyledCellContainer>\n {!isDragOverlay && isExpandable && row.isExpanded && DetailsView && (\n <DetailsWrapper>\n <DetailsView row={row} detailsIndent={detailsIndent} />\n </DetailsWrapper>\n )}\n </>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADarB;AAAA;AAAA;AAAA;AAAA;AAZF,mBAA6F;AAC7F,qBAAiC;AACjC,uBAAmD;AACnD,2CAA8B;AAC9B,mBAAsB;AAGtB,oBAAoC;AAEpC,MAAM,iBAAyD,CAAC,UAG9D;AAAA,EAAC;AAAA;AAAA,IACC,aAAU;AAAA,IACV,OAAO;AAAA,MACL,WAAW;AAAA,MACX,cAAc;AAAA,IAChB;AAAA,IACA,SAAS,CAAC,MAAM,EAAE,gBAAgB;AAAA,IAClC,WAAW,CAAC,MAAM,EAAE,gBAAgB;AAAA,IAEnC,gBAAM;AAAA;AACT;AAGF,MAAM,mCAAmC,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAOE,cAAc,IAAI,YAAY,CAAC,GAAG,IAAI,gBAAgB,OAAO,yBAAyB,IAAI,cAAc,CAAC,KAAK,EAAE,KAC9G,WAAW,eAAe,EAC5B,GAAG,WAAW,eAAe,0CAA0C;AAErE,aAAc,WAAW,eAAe,gBAAiB,EAC3D;AAEK,MAAM,4BAAkE,CAAC,UAAU;AACxF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,kBAAkB;AAAA,IAClB;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,gBAAY,oDAAc,CAAC,UAAU,MAAM,SAAS;AAC1D,QAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,mBAAe,oDAAc,CAAC,UAAU,MAAM,YAAY;AAChE,QAAM,yBAAqB,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,qBAAiB,oDAAc,CAAC,UAAU,MAAM,cAAc;AACpE,QAAM,iBAAa,oDAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB,0BAAY,MAAM,KAAK,CAAC,GAAG,CAAC;AAC3D,QAAM,aAAS,qBAAuB,IAAI;AAC1C,QAAM,cAAc,kBAAkB,eAAe;AACrD,QAAM,aAAa,kBAAkB,eAAe;AAEpD,oCAAgB,MAAM;AACpB,QAAI,IAAI,QAAQ,cAAc;AAC5B,aAAO,SAAS,MAAM;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,cAAc,IAAI,GAAG,CAAC;AAE1B,QAAM,oBAAgB,sBAAQ,MAAM;AAClC,QAAI,UAAU;AACd,aAAS,IAAI,GAAG,IAAI,eAAe,QAAQ,KAAK,GAAG;AACjD,UAAI,gCAAiB,SAAS,eAAe,CAAC,EAAE,EAAE,GAAG;AACnD,mBAAW,eAAe,CAAC,EAAE;AAAA,MAC/B,OAAO;AACL,mBAAW,IAAI,QAAQ,KAAK;AAC5B;AAAA,MACF;AAAA,IACF;AACA,WAAO;AAAA,EACT,GAAG,CAAC,IAAI,OAAO,cAAc,CAAC;AAE9B,QAAM,cAAc,IAAI,SAAS;AAEjC,QAAM,oBAAoB;AAAA,IACxB;AAAA,IACA,UAAU,YAAY,IAAI,GAAG,MAAM;AAAA,IACnC,UAAU,aAAa,IAAI,GAAG;AAAA,IAC9B,YAAY;AAAA,IACZ,UAAU,aAAa,IAAI,GAAG,MAAM;AAAA,EACtC;AAEA,SACE,4EACE;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,UAAU;AAAA,QAEV,UAAU;AAAA,QACV,MAAK;AAAA,QACL,iBAAe,IAAI,YAAY;AAAA,QAC/B,eAAa,sBAAsB,kCAAkC,iBAAiB;AAAA,QACtF,iBAAe,YAAY,IAAI,GAAG,MAAM;AAAA,QACxC,iBAAe,aAAa,IAAI,GAAG;AAAA,QACnC;AAAA,QACA,QAAQ,UAAU,SAAS;AAAA,QAC3B,WAAW,UAAU,SAAS;AAAA,QAC9B,+BAA+B,0BAA0B,uCAAsB;AAAA,QAC/E;AAAA,QACA,oBAAoB,CAAC,eAAe,CAAC,cAAc,CAAC;AAAA,QACpD;AAAA,QACA;AAAA,QACA,UAAU,qBAAqB,YAAY,IAAI,GAAG,MAAM;AAAA,QACxD,YAAY,aAAa,IAAI,GAAG;AAAA,QAChC,eAAa,6BAAY;AAAA,QACzB;AAAA,QACA;AAAA,QAEA;AAAA,UAAC;AAAA;AAAA,YACC;AAAA,YACA,eAAe,mBAAmB,IAAI;AAAA,YACtC;AAAA,YAGA;AAAA;AAAA,UAFK,IAAI;AAAA,QAGX;AAAA;AAAA,MA5BK,IAAI;AAAA,IA6BX;AAAA,IACC,CAAC,iBAAiB,gBAAgB,IAAI,cAAc,eACnD,4CAAC,kBACC,sDAAC,eAAY,KAAU,eAA8B,GACvD;AAAA,KAEJ;AAEJ;",
|
|
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 { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { css, mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.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 { DSButtonV3 } from '@elliemae/ds-button-v2';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { css, mergeRefs, styled } from '@elliemae/ds-system';\nimport React, { useCallback, useRef, useState } from 'react';\nimport useOnClickOutside from 'use-onclickoutside';\nimport { DSDataTableName, DSDataTableSlots } from '../../DSDataTableDefinitions.js';\nimport { DATA_TESTID } from '../../configs/constants.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.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,0BAA2B;AAC3B,sBAAgC;AAChC,uBAAuC;AACvC,mBAAqD;AACrD,gCAA8B;AAC9B,oCAAkD;AAClD,uBAA4B;AAC5B,2CAA8B;AAG9B,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,oDAAc,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
|
}
|
|
@@ -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
|
}
|