@elliemae/ds-data-table 3.14.9 → 3.14.10
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/DataTableSchema.js +2 -7
- package/dist/cjs/DataTableSchema.js.map +2 -2
- package/dist/cjs/exported-related/FilterBar/FilterBarDropdownMenu.js +4 -1
- package/dist/cjs/exported-related/FilterBar/FilterBarDropdownMenu.js.map +2 -2
- package/dist/cjs/parts/Cells/Cell.js +9 -5
- package/dist/cjs/parts/Cells/Cell.js.map +2 -2
- package/dist/cjs/parts/FilterBar/FiltersBar.js +1 -0
- package/dist/cjs/parts/FilterBar/FiltersBar.js.map +2 -2
- package/dist/esm/DataTableSchema.js +2 -7
- package/dist/esm/DataTableSchema.js.map +2 -2
- package/dist/esm/exported-related/FilterBar/FilterBarDropdownMenu.js +4 -1
- package/dist/esm/exported-related/FilterBar/FilterBarDropdownMenu.js.map +2 -2
- package/dist/esm/parts/Cells/Cell.js +9 -5
- package/dist/esm/parts/Cells/Cell.js.map +2 -2
- package/dist/esm/parts/FilterBar/FiltersBar.js +1 -0
- package/dist/esm/parts/FilterBar/FiltersBar.js.map +2 -2
- package/dist/types/exported-related/FilterBar/FilterBarDropdownMenu.d.ts +7 -1
- package/dist/types/tests/a11y/filter-bar-dropdown-menu.test.d.ts +1 -0
- package/package.json +18 -18
|
@@ -29,13 +29,8 @@ __export(DataTableSchema_exports, {
|
|
|
29
29
|
module.exports = __toCommonJS(DataTableSchema_exports);
|
|
30
30
|
var React = __toESM(require("react"));
|
|
31
31
|
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
"ds-filter-multi-select",
|
|
35
|
-
"ds-filter-single-date",
|
|
36
|
-
"ds-filter-date-range",
|
|
37
|
-
"ds-filter-number-range"
|
|
38
|
-
]);
|
|
32
|
+
var import_exported_related = require("./exported-related");
|
|
33
|
+
const outOfTheBoxFilterType = import_ds_utilities.PropTypes.oneOf(Object.values(import_exported_related.FILTER_TYPES));
|
|
39
34
|
const textWrappingType = import_ds_utilities.PropTypes.oneOf(["wrap", "wrap-all", "truncate"]);
|
|
40
35
|
const columnPropTypes = {
|
|
41
36
|
Header: import_ds_utilities.PropTypes.oneOfType([import_ds_utilities.PropTypes.string, import_ds_utilities.PropTypes.func, import_ds_utilities.PropTypes.element]).description(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DataTableSchema.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport type { WeakValidationMap } from 'react';\n\nconst outOfTheBoxFilterType = PropTypes.oneOf([\n 'ds-filter-select',\n 'ds-filter-multi-select',\n 'ds-filter-single-date',\n 'ds-filter-date-range',\n 'ds-filter-number-range',\n]);\n\nconst textWrappingType = PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']);\n\nconst columnPropTypes = {\n Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'Header name or component',\n ).isRequired,\n accessor: PropTypes.string.description('The entry of the data that this column will display'),\n id: PropTypes.string.description('The id of the column, will default to the Header or accessor if not present'),\n filter: outOfTheBoxFilterType.description('out-of-the-box filters'),\n Filter: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'The custom component to render as a filter',\n ),\n Cell: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('The custom cell renderer component'),\n editable: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'The editable out-of-the-box or component to render',\n ),\n disableDnD: PropTypes.bool.description('Whereas this column should be draggable'),\n canResize: PropTypes.bool.description('Whereas this column should be resizable'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of this column'),\n minWidth: PropTypes.number.description('Minimum width of this column, useful when resizing'),\n maxWidth: PropTypes.number.description('Maximum width of this column, useful when resizing'),\n canSort: PropTypes.bool.description('Whereas this column is sortable'),\n isSortedDesc: PropTypes.bool.description('Whereas this column is sorted descendingly'),\n required: PropTypes.bool.description('Whereas this column is required'),\n alwaysDisplayEditIcon: PropTypes.bool.description(\n 'Whereas to always show the edit icon on this column if it is editable',\n ),\n textWrap: textWrappingType.description('How to wrap the text in the column'),\n};\n\nconst columnsPropTypes = PropTypes.shape(columnPropTypes).description('Columns props');\n\nconst rowPropTypes = {\n tableRowDetails: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description('Component for row details'),\n dimsumHeaderValue: PropTypes.string.description('Header displayed on the header variant of the row'),\n};\n\nconst rowsPropTypes = PropTypes.shape(rowPropTypes).description('Rows props');\n\nexport const DataTableSchema = {\n columns: PropTypes.arrayOf(columnsPropTypes).description('Array of columns').isRequired,\n data: PropTypes.arrayOf(rowsPropTypes).description('Array of rows'),\n height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Height of the datatable component'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of the datatable component'),\n renderRowActions: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]).description(\n 'The renderer to use for the action toolbar',\n ),\n isExpandable: PropTypes.bool.description('Whether the datatable is expandable').defaultValue(false),\n uniqueRowAccessor: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.func,\n ]).description(\n 'Column / Combination of columns / Function to call to produce a unique identifier for each row.' +\n ' This is necessary for the selectable and drag and drop features',\n ),\n disabledRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is disabled or not',\n ),\n expandedRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is expanded or not',\n ),\n onRowExpand: PropTypes.func.description('Function invoked when a row is (un)expanded'),\n cellRendererProps: PropTypes.object.description(\n 'Object with all the props you want the cells to have available when rendering',\n ),\n selectSingle: PropTypes.bool.description('Whether the selectable feature is single').defaultValue(false),\n selection: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is selected or not',\n ),\n onSelectionChange: PropTypes.func.description('Function invoked when a row is selected'),\n groupedRowsRenderHeader: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).description(\n 'String | Function to call which will display in the row headers',\n ),\n isResizeable: PropTypes.bool.description(\"Whether the datatable's columns are resizeable\"),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n type: PropTypes.string,\n value: PropTypes.any,\n }),\n ).description('Array of filter keys and values'),\n withFilterBar: PropTypes.bool.description('Whether to display the filter bar'),\n filterBarProps: PropTypes.shape({\n filterBarAddonRenderer: PropTypes.func.description('Render filterbar right addon component'),\n customPillRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'If you specify custom filters, you will need to render their pills here',\n ),\n isDropdownMenuOpen: PropTypes.bool.description('Wether the DropdownMenu is Open or not.'),\n onDropdownMenuToggle: PropTypes.func.description('Callback to toggle the DropdownMenu.'),\n onClearAllFiltersClick: PropTypes.func.description('Callback for Clear Al Filters option.'),\n onDropdownMenuClickOutside: PropTypes.func.description('Callback triggered when clicking outside DropdownMenu.'),\n onDropdownMenuTriggerClick: PropTypes.func.description('Callback triggered when clicking DropdownMenu ellipsis.'),\n extraOptions: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.string,\n id: PropTypes.string,\n label: PropTypes.string,\n onClick: PropTypes.func,\n }),\n ).description('Any extra option you want in the dropdownmenu of the filter bar'),\n }).description('Props for the filter bar'),\n onFiltersChange: PropTypes.func.description('Function invoked when filters change'),\n pagination: PropTypes.oneOfType([\n PropTypes.oneOf([false]),\n PropTypes.shape({\n pageCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('How many pages are there'),\n isLoadingPageCount: PropTypes.bool.description('Whether the page count is loading'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func\n .description('Function invoked when the page size changes')\n .defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n dataIsPage: PropTypes.bool.description('Whether to treat data as a page').defaultValue(false),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n }),\n ]).description('Object containing the data for the pagination'),\n colsLayoutStyle: PropTypes.oneOf(['auto', 'fixed']).description('Whether the datatable fills its container or not'),\n hiddenColumns: PropTypes.arrayOf(PropTypes.string).description('IDs of columns not to render'),\n dragAndDropRows: PropTypes.bool.description('Whether to turn on the d&d feature for the rows').defaultValue(false),\n onRowsReorder: PropTypes.func.description('Function invoked when a row is reordered'),\n maxDragAndDropLevel: PropTypes.number.description('Which level is the maximum allowed to drop into'),\n dragAndDropColumns: PropTypes.bool.description('Whether to turn on the d&d feature for the columns'),\n onColumnsReorder: PropTypes.func.description('Function invoked when a column is reordered'),\n getIsDropValid: PropTypes.func.description('Function to determine if a drop is valid'),\n textWrap: textWrappingType.description('Global wrapping rule'),\n noResultsMessage: PropTypes.string.description('Message to show when no more data is available'),\n noResultsSecondaryMessage: PropTypes.string.description('Secondary message to show when no more data is available'),\n noResultsButtonLabel: PropTypes.string.description('Label of the button when no more data is available'),\n noResultsPlaceholder: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'Custom content to show when dataset is empty',\n ),\n isLoading: PropTypes.bool.description('Whether to show a global loader in the datatable'),\n onColumnResize: PropTypes.func\n .description('Function invoked when a column is resized')\n .deprecated({ version: '4.x', message: 'Use onColumnSizeChange' }),\n onColumnSizeChange: PropTypes.func.description('Function invoked when a column is resized'),\n onRowClick: PropTypes.func.description('Function invoked when clicking a row'),\n onRowFocus: PropTypes.func.description('Function invoked when focusing a row'),\n onCellValueChange: PropTypes.func.description(\"Function invoked when an editable cell's content is changed\"),\n onColumnSortChange: PropTypes.func\n .description('Function invoked when a column is sorted')\n .deprecated({ version: '4.x', message: 'Use onColumnSort' }),\n onColumnSort: PropTypes.func.description('Function invoked when a column is sorted'),\n actionRef: PropTypes.object.description('Reference where all the exposed action callbacks will be exposed'),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,0BAA0B;
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport { FILTER_TYPES } from './exported-related';\nimport type { WeakValidationMap } from 'react';\n\nconst outOfTheBoxFilterType = PropTypes.oneOf(Object.values(FILTER_TYPES));\n\nconst textWrappingType = PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']);\n\nconst columnPropTypes = {\n Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'Header name or component',\n ).isRequired,\n accessor: PropTypes.string.description('The entry of the data that this column will display'),\n id: PropTypes.string.description('The id of the column, will default to the Header or accessor if not present'),\n filter: outOfTheBoxFilterType.description('out-of-the-box filters'),\n Filter: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'The custom component to render as a filter',\n ),\n Cell: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('The custom cell renderer component'),\n editable: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'The editable out-of-the-box or component to render',\n ),\n disableDnD: PropTypes.bool.description('Whereas this column should be draggable'),\n canResize: PropTypes.bool.description('Whereas this column should be resizable'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of this column'),\n minWidth: PropTypes.number.description('Minimum width of this column, useful when resizing'),\n maxWidth: PropTypes.number.description('Maximum width of this column, useful when resizing'),\n canSort: PropTypes.bool.description('Whereas this column is sortable'),\n isSortedDesc: PropTypes.bool.description('Whereas this column is sorted descendingly'),\n required: PropTypes.bool.description('Whereas this column is required'),\n alwaysDisplayEditIcon: PropTypes.bool.description(\n 'Whereas to always show the edit icon on this column if it is editable',\n ),\n textWrap: textWrappingType.description('How to wrap the text in the column'),\n};\n\nconst columnsPropTypes = PropTypes.shape(columnPropTypes).description('Columns props');\n\nconst rowPropTypes = {\n tableRowDetails: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description('Component for row details'),\n dimsumHeaderValue: PropTypes.string.description('Header displayed on the header variant of the row'),\n};\n\nconst rowsPropTypes = PropTypes.shape(rowPropTypes).description('Rows props');\n\nexport const DataTableSchema = {\n columns: PropTypes.arrayOf(columnsPropTypes).description('Array of columns').isRequired,\n data: PropTypes.arrayOf(rowsPropTypes).description('Array of rows'),\n height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Height of the datatable component'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of the datatable component'),\n renderRowActions: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]).description(\n 'The renderer to use for the action toolbar',\n ),\n isExpandable: PropTypes.bool.description('Whether the datatable is expandable').defaultValue(false),\n uniqueRowAccessor: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.func,\n ]).description(\n 'Column / Combination of columns / Function to call to produce a unique identifier for each row.' +\n ' This is necessary for the selectable and drag and drop features',\n ),\n disabledRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is disabled or not',\n ),\n expandedRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is expanded or not',\n ),\n onRowExpand: PropTypes.func.description('Function invoked when a row is (un)expanded'),\n cellRendererProps: PropTypes.object.description(\n 'Object with all the props you want the cells to have available when rendering',\n ),\n selectSingle: PropTypes.bool.description('Whether the selectable feature is single').defaultValue(false),\n selection: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is selected or not',\n ),\n onSelectionChange: PropTypes.func.description('Function invoked when a row is selected'),\n groupedRowsRenderHeader: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).description(\n 'String | Function to call which will display in the row headers',\n ),\n isResizeable: PropTypes.bool.description(\"Whether the datatable's columns are resizeable\"),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n type: PropTypes.string,\n value: PropTypes.any,\n }),\n ).description('Array of filter keys and values'),\n withFilterBar: PropTypes.bool.description('Whether to display the filter bar'),\n filterBarProps: PropTypes.shape({\n filterBarAddonRenderer: PropTypes.func.description('Render filterbar right addon component'),\n customPillRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'If you specify custom filters, you will need to render their pills here',\n ),\n isDropdownMenuOpen: PropTypes.bool.description('Wether the DropdownMenu is Open or not.'),\n onDropdownMenuToggle: PropTypes.func.description('Callback to toggle the DropdownMenu.'),\n onClearAllFiltersClick: PropTypes.func.description('Callback for Clear Al Filters option.'),\n onDropdownMenuClickOutside: PropTypes.func.description('Callback triggered when clicking outside DropdownMenu.'),\n onDropdownMenuTriggerClick: PropTypes.func.description('Callback triggered when clicking DropdownMenu ellipsis.'),\n extraOptions: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.string,\n id: PropTypes.string,\n label: PropTypes.string,\n onClick: PropTypes.func,\n }),\n ).description('Any extra option you want in the dropdownmenu of the filter bar'),\n }).description('Props for the filter bar'),\n onFiltersChange: PropTypes.func.description('Function invoked when filters change'),\n pagination: PropTypes.oneOfType([\n PropTypes.oneOf([false]),\n PropTypes.shape({\n pageCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('How many pages are there'),\n isLoadingPageCount: PropTypes.bool.description('Whether the page count is loading'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func\n .description('Function invoked when the page size changes')\n .defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n dataIsPage: PropTypes.bool.description('Whether to treat data as a page').defaultValue(false),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n }),\n ]).description('Object containing the data for the pagination'),\n colsLayoutStyle: PropTypes.oneOf(['auto', 'fixed']).description('Whether the datatable fills its container or not'),\n hiddenColumns: PropTypes.arrayOf(PropTypes.string).description('IDs of columns not to render'),\n dragAndDropRows: PropTypes.bool.description('Whether to turn on the d&d feature for the rows').defaultValue(false),\n onRowsReorder: PropTypes.func.description('Function invoked when a row is reordered'),\n maxDragAndDropLevel: PropTypes.number.description('Which level is the maximum allowed to drop into'),\n dragAndDropColumns: PropTypes.bool.description('Whether to turn on the d&d feature for the columns'),\n onColumnsReorder: PropTypes.func.description('Function invoked when a column is reordered'),\n getIsDropValid: PropTypes.func.description('Function to determine if a drop is valid'),\n textWrap: textWrappingType.description('Global wrapping rule'),\n noResultsMessage: PropTypes.string.description('Message to show when no more data is available'),\n noResultsSecondaryMessage: PropTypes.string.description('Secondary message to show when no more data is available'),\n noResultsButtonLabel: PropTypes.string.description('Label of the button when no more data is available'),\n noResultsPlaceholder: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'Custom content to show when dataset is empty',\n ),\n isLoading: PropTypes.bool.description('Whether to show a global loader in the datatable'),\n onColumnResize: PropTypes.func\n .description('Function invoked when a column is resized')\n .deprecated({ version: '4.x', message: 'Use onColumnSizeChange' }),\n onColumnSizeChange: PropTypes.func.description('Function invoked when a column is resized'),\n onRowClick: PropTypes.func.description('Function invoked when clicking a row'),\n onRowFocus: PropTypes.func.description('Function invoked when focusing a row'),\n onCellValueChange: PropTypes.func.description(\"Function invoked when an editable cell's content is changed\"),\n onColumnSortChange: PropTypes.func\n .description('Function invoked when a column is sorted')\n .deprecated({ version: '4.x', message: 'Use onColumnSort' }),\n onColumnSort: PropTypes.func.description('Function invoked when a column is sorted'),\n actionRef: PropTypes.object.description('Reference where all the exposed action callbacks will be exposed'),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -34,12 +34,13 @@ var import_ds_dropdownmenu = require("@elliemae/ds-dropdownmenu");
|
|
|
34
34
|
var import_ds_button = require("@elliemae/ds-button");
|
|
35
35
|
var import_ds_icons = require("@elliemae/ds-icons");
|
|
36
36
|
var import_DataTableContext = require("../../DataTableContext");
|
|
37
|
+
var import_configs = require("../../configs");
|
|
37
38
|
const FilterBarDropdownMenu = (props) => {
|
|
38
39
|
const {
|
|
39
40
|
tableProps: { onFiltersChange }
|
|
40
41
|
} = (0, import_react.useContext)(import_DataTableContext.DataTableContext);
|
|
41
42
|
const [isOpened, setIsOpened] = (0, import_react.useState)(false);
|
|
42
|
-
const { options: extraOptions, innerRef, ...restProps } = props;
|
|
43
|
+
const { options: extraOptions = [], innerRef, ...restProps } = props;
|
|
43
44
|
const removeFilters = (0, import_react.useCallback)(() => {
|
|
44
45
|
onFiltersChange([]);
|
|
45
46
|
setIsOpened(false);
|
|
@@ -80,6 +81,8 @@ const FilterBarDropdownMenu = (props) => {
|
|
|
80
81
|
buttonType: import_ds_button.BUTTON_TYPES.ICON,
|
|
81
82
|
onClick: () => setIsOpened((prevOpened) => !prevOpened),
|
|
82
83
|
innerRef,
|
|
84
|
+
"aria-label": "Filter bar addon",
|
|
85
|
+
"data-testid": import_configs.DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,
|
|
83
86
|
...restProps,
|
|
84
87
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MoreOptionsVert, {})
|
|
85
88
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/exported-related/FilterBar/FilterBarDropdownMenu.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useState, useContext,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useState, useContext, useCallback, useMemo } from 'react';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { DSButtonV2, BUTTON_TYPES } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DataTableContext } from '../../DataTableContext';\nimport { DATA_TESTID } from '../../configs';\n\ninterface FilterBarDropdownMenuProps {\n options?: unknown[];\n innerRef?: React.RefObject<HTMLButtonElement>;\n}\n\nexport const FilterBarDropdownMenu: React.ComponentType<FilterBarDropdownMenuProps> = (props) => {\n const {\n tableProps: { onFiltersChange },\n } = useContext(DataTableContext);\n const [isOpened, setIsOpened] = useState(false);\n\n const { options: extraOptions = [], innerRef, ...restProps } = props;\n const removeFilters = useCallback(() => {\n onFiltersChange([]);\n setIsOpened(false);\n innerRef?.current?.focus?.();\n }, [innerRef, onFiltersChange]);\n\n const options = useMemo(\n () => [\n {\n dsId: '__internal__option__clear__filters',\n label: 'Clear Filters',\n type: 'action',\n onClick: removeFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeFilters();\n },\n },\n ...extraOptions,\n ],\n [extraOptions, removeFilters],\n );\n\n return (\n <div style={{ marginLeft: 'auto' }}>\n <DSDropdownMenuV2\n isOpened={isOpened}\n startPlacementPreference=\"bottom-end\"\n options={options}\n onClickOutside={() => {\n setIsOpened(false);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.code === 'Escape') innerRef?.current?.focus?.();\n }}\n >\n <DSButtonV2\n buttonType={BUTTON_TYPES.ICON}\n onClick={() => setIsOpened((prevOpened) => !prevOpened)}\n innerRef={innerRef}\n aria-label=\"Filter bar addon\"\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n {...restProps}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n </DSDropdownMenuV2>\n </div>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD8Db;AA9DV,mBAAkE;AAClE,6BAAiC;AACjC,uBAAyC;AACzC,sBAAgC;AAChC,8BAAiC;AACjC,qBAA4B;AAOrB,MAAM,wBAAyE,CAAC,UAAU;AAC/F,QAAM;AAAA,IACJ,YAAY,EAAE,gBAAgB;AAAA,EAChC,QAAI,yBAAW,wCAAgB;AAC/B,QAAM,CAAC,UAAU,WAAW,QAAI,uBAAS,KAAK;AAE9C,QAAM,EAAE,SAAS,eAAe,CAAC,GAAG,aAAa,UAAU,IAAI;AAC/D,QAAM,oBAAgB,0BAAY,MAAM;AACtC,oBAAgB,CAAC,CAAC;AAClB,gBAAY,KAAK;AACjB,cAAU,SAAS,QAAQ;AAAA,EAC7B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,QAAM,cAAU;AAAA,IACd,MAAM;AAAA,MACJ;AAAA,QACE,MAAM;AAAA,QACN,OAAO;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI;AAAG,0BAAc;AAAA,QACzD;AAAA,MACF;AAAA,MACA,GAAG;AAAA,IACL;AAAA,IACA,CAAC,cAAc,aAAa;AAAA,EAC9B;AAEA,SACE,4CAAC,SAAI,OAAO,EAAE,YAAY,OAAO,GAC/B;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,0BAAyB;AAAA,MACzB;AAAA,MACA,gBAAgB,MAAM;AACpB,oBAAY,KAAK;AAAA,MACnB;AAAA,MACA,WAAW,CAAC,MAA2B;AACrC,YAAI,EAAE,SAAS;AAAU,oBAAU,SAAS,QAAQ;AAAA,MACtD;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,YAAY,8BAAa;AAAA,UACzB,SAAS,MAAM,YAAY,CAAC,eAAe,CAAC,UAAU;AAAA,UACtD;AAAA,UACA,cAAW;AAAA,UACX,eAAa,2BAAY;AAAA,UACxB,GAAG;AAAA,UAEJ,sDAAC,mCAAgB;AAAA;AAAA,MACnB;AAAA;AAAA,EACF,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -72,18 +72,22 @@ const Cell = ({
|
|
|
72
72
|
[cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow]
|
|
73
73
|
);
|
|
74
74
|
const CellComponent = cell.render;
|
|
75
|
+
const textValue = (0, import_react.useMemo)(
|
|
76
|
+
() => appliedTextWrap === "truncate" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_truncated_tooltip_text.SimpleTruncatedTooltipText, { value: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...cellProps }) }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CellComponent, { ...cellProps }),
|
|
77
|
+
[CellComponent, appliedTextWrap, cellProps]
|
|
78
|
+
);
|
|
75
79
|
const pureCellContent = (0, import_react.useMemo)(() => {
|
|
76
80
|
if (shouldAddExpandCell) {
|
|
77
81
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { cols: ["min-content", "auto"], alignItems: "center", height: "100%", children: [
|
|
78
82
|
shouldAddExpandCell && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Columns.expandRowColumn.Cell, { ...cellProps }),
|
|
79
|
-
|
|
83
|
+
textValue
|
|
80
84
|
] });
|
|
81
85
|
}
|
|
82
|
-
return
|
|
83
|
-
}, [
|
|
86
|
+
return textValue;
|
|
87
|
+
}, [cellProps, shouldAddExpandCell, textValue]);
|
|
84
88
|
const DefaultCellContentJSX = (0, import_react.useMemo)(
|
|
85
|
-
() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledCellContent, { children:
|
|
86
|
-
[
|
|
89
|
+
() => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledCellContent, { children: pureCellContent }),
|
|
90
|
+
[pureCellContent]
|
|
87
91
|
);
|
|
88
92
|
const EditableContentJSX = (0, import_react.useMemo)(() => {
|
|
89
93
|
if (typeof column.editable === "string") {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Cells/Cell.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled';\nimport { outOfTheBoxEditables } from '../../addons/Editables';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { TypescriptColumn, TypescriptRow } from '../../types/props';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { expandRowColumn } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useCellStyle } from './useCellStyle';\n\nconst PureStandardCell = memo<{ cellStyle: unknown; column: TypescriptColumn }>(({ cellStyle, children, column }) => (\n <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n {children}\n </StyledCell>\n));\n\ninterface CellProps {\n cell: any;\n column: TypescriptColumn;\n row: TypescriptRow;\n isRowSelected: boolean;\n shouldAddExpandCell: boolean;\n isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n cell,\n column,\n row,\n isRowSelected,\n shouldAddExpandCell,\n isDragOverlay,\n}) => {\n const ctx = useContext(DataTableContext);\n const {\n tableProps: { cellRendererProps, disabledRows },\n } = ctx;\n const isDisabledRow = disabledRows[row.uid];\n\n const { draggableProps } = useContext(SortableItemContext);\n\n const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n const cellProps = useMemo(\n () => ({\n ...cellRendererProps,\n cell,\n row,\n isRowSelected,\n ctx,\n draggableProps,\n isDragOverlay,\n role: 'cell',\n cellStyle,\n column,\n isDisabledRow,\n }),\n [cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n );\n\n const CellComponent = cell.render;\n\n const pureCellContent = useMemo(() => {\n if (shouldAddExpandCell) {\n return (\n <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n {shouldAddExpandCell && <expandRowColumn.Cell {...cellProps} />}\n
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcrB;AAbF,mBAAiD;AACjD,uCAA2C;AAC3C,qBAAqB;AACrB,oBAA8C;AAC9C,uBAAqC;AACrC,8BAAiC;AAEjC,iCAAoC;AACpC,qBAAgC;AAChC,uBAA4B;AAC5B,0BAA6B;AAE7B,MAAM,uBAAmB,mBAAuD,CAAC,EAAE,WAAW,UAAU,OAAO,MAC7G,4CAAC,4BAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,6BAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,UAAM,yBAAW,wCAAgB;AACvC,QAAM;AAAA,IACJ,YAAY,EAAE,mBAAmB,aAAa;AAAA,EAChD,IAAI;AACJ,QAAM,gBAAgB,aAAa,IAAI;AAEvC,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,QAAI,kCAAa,QAAQ,mBAAmB;AAE7E,QAAM,gBAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,KAAK,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EACpH;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,sBAAkB,sBAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,6CAAC,uBAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,4CAAC,+BAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled';\nimport { outOfTheBoxEditables } from '../../addons/Editables';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { TypescriptColumn, TypescriptRow } from '../../types/props';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { expandRowColumn } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useCellStyle } from './useCellStyle';\n\nconst PureStandardCell = memo<{ cellStyle: unknown; column: TypescriptColumn }>(({ cellStyle, children, column }) => (\n <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n {children}\n </StyledCell>\n));\n\ninterface CellProps {\n cell: any;\n column: TypescriptColumn;\n row: TypescriptRow;\n isRowSelected: boolean;\n shouldAddExpandCell: boolean;\n isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n cell,\n column,\n row,\n isRowSelected,\n shouldAddExpandCell,\n isDragOverlay,\n}) => {\n const ctx = useContext(DataTableContext);\n const {\n tableProps: { cellRendererProps, disabledRows },\n } = ctx;\n const isDisabledRow = disabledRows[row.uid];\n\n const { draggableProps } = useContext(SortableItemContext);\n\n const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n const cellProps = useMemo(\n () => ({\n ...cellRendererProps,\n cell,\n row,\n isRowSelected,\n ctx,\n draggableProps,\n isDragOverlay,\n role: 'cell',\n cellStyle,\n column,\n isDisabledRow,\n }),\n [cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n );\n\n const CellComponent = cell.render;\n\n const textValue = useMemo(\n () =>\n appliedTextWrap === 'truncate' ? (\n <SimpleTruncatedTooltipText value={<CellComponent {...cellProps} />} />\n ) : (\n <CellComponent {...cellProps} />\n ),\n [CellComponent, appliedTextWrap, cellProps],\n );\n const pureCellContent = useMemo(() => {\n if (shouldAddExpandCell) {\n return (\n <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n {shouldAddExpandCell && <expandRowColumn.Cell {...cellProps} />}\n {textValue}\n </Grid>\n );\n }\n return textValue;\n }, [cellProps, shouldAddExpandCell, textValue]);\n const DefaultCellContentJSX = useMemo(\n () => <StyledCellContent>{pureCellContent}</StyledCellContent>,\n [pureCellContent],\n );\n\n const EditableContentJSX = useMemo(() => {\n if (typeof column.editable === 'string') {\n const { EditableComponent } = outOfTheBoxEditables?.[column.editable];\n if (EditableComponent) return <EditableComponent {...cellProps} DefaultCellRender={DefaultCellContentJSX} />;\n }\n if (typeof column.editable === 'function')\n return column.editable({\n DefaultCellRender: DefaultCellContentJSX,\n ...cellProps,\n }) as JSX.Element;\n\n return null;\n }, [DefaultCellContentJSX, cellProps, column]);\n\n return (\n <PureStandardCell {...cellProps}>\n {column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX}\n </PureStandardCell>\n );\n};\n\nexport { Cell };\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADcrB;AAbF,mBAAiD;AACjD,uCAA2C;AAC3C,qBAAqB;AACrB,oBAA8C;AAC9C,uBAAqC;AACrC,8BAAiC;AAEjC,iCAAoC;AACpC,qBAAgC;AAChC,uBAA4B;AAC5B,0BAA6B;AAE7B,MAAM,uBAAmB,mBAAuD,CAAC,EAAE,WAAW,UAAU,OAAO,MAC7G,4CAAC,4BAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,6BAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,UAAM,yBAAW,wCAAgB;AACvC,QAAM;AAAA,IACJ,YAAY,EAAE,mBAAmB,aAAa;AAAA,EAChD,IAAI;AACJ,QAAM,gBAAgB,aAAa,IAAI;AAEvC,QAAM,EAAE,eAAe,QAAI,yBAAW,8CAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,QAAI,kCAAa,QAAQ,mBAAmB;AAE7E,QAAM,gBAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,KAAK,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EACpH;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,gBAAY;AAAA,IAChB,MACE,oBAAoB,aAClB,4CAAC,+DAA2B,OAAO,4CAAC,iBAAe,GAAG,WAAW,GAAI,IAErE,4CAAC,iBAAe,GAAG,WAAW;AAAA,IAElC,CAAC,eAAe,iBAAiB,SAAS;AAAA,EAC5C;AACA,QAAM,sBAAkB,sBAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,6CAAC,uBAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,4CAAC,+BAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QAC5D;AAAA,SACH;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,qBAAqB,SAAS,CAAC;AAC9C,QAAM,4BAAwB;AAAA,IAC5B,MAAM,4CAAC,mCAAmB,2BAAgB;AAAA,IAC1C,CAAC,eAAe;AAAA,EAClB;AAEA,QAAM,yBAAqB,sBAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,wCAAuB,OAAO;AAC5D,UAAI;AAAmB,eAAO,4CAAC,qBAAmB,GAAG,WAAW,mBAAmB,uBAAuB;AAAA,IAC5G;AACA,QAAI,OAAO,OAAO,aAAa;AAC7B,aAAO,OAAO,SAAS;AAAA,QACrB,mBAAmB;AAAA,QACnB,GAAG;AAAA,MACL,CAAC;AAEH,WAAO;AAAA,EACT,GAAG,CAAC,uBAAuB,WAAW,MAAM,CAAC;AAE7C,SACE,4CAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,OAAO,qBAAqB,uBACpE;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -139,6 +139,7 @@ const FiltersBar = () => {
|
|
|
139
139
|
buttonType: "icon",
|
|
140
140
|
innerRef: dropdownMenuRef,
|
|
141
141
|
onClick: onTriggerClick,
|
|
142
|
+
"aria-label": "Filter bar addon",
|
|
142
143
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.MoreOptionsVert, {})
|
|
143
144
|
}
|
|
144
145
|
)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/FilterBar/FiltersBar.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useCallback, useContext, useMemo, useRef, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport type { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const [isOpen, setIsOpen] = useState(false);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const { filterBarAddonRenderer } = filterBarProps || {};\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n filterBarProps?.onClearAllFiltersClick?.();\n setIsOpen(false);\n }, [onFiltersChange, filterBarProps?.onClearAllFiltersClick]);\n\n const onFilterBarClose = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClose');\n dropdownMenuRef.current.focus();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOpen = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(true, 'onOpen');\n setIsOpen(true);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOnClickOutside = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClickOutside');\n filterBarProps?.onDropdownMenuClickOutside?.();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle, filterBarProps?.onDropdownMenuClickOutside]);\n\n const onTriggerClick = useCallback(() => {\n filterBarProps?.onDropdownMenuTriggerClick?.();\n onFilterBarOpen();\n }, [filterBarProps?.onDropdownMenuTriggerClick]);\n\n const finalIsOpen = useMemo(() => {\n if (typeof filterBarProps?.isDropdownMenuOpen === 'boolean') return filterBarProps.isDropdownMenuOpen;\n return isOpen;\n }, [filterBarProps?.isDropdownMenuOpen, isOpen]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n {filterBarAddonRenderer ? (\n filterBarAddonRenderer({ innerRef: dropdownMenuRef })\n ) : (\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n )}\n </StyledWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import React, { useCallback, useContext, useMemo, useRef, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport type { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const [isOpen, setIsOpen] = useState(false);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const { filterBarAddonRenderer } = filterBarProps || {};\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n filterBarProps?.onClearAllFiltersClick?.();\n setIsOpen(false);\n }, [onFiltersChange, filterBarProps?.onClearAllFiltersClick]);\n\n const onFilterBarClose = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClose');\n dropdownMenuRef.current.focus();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOpen = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(true, 'onOpen');\n setIsOpen(true);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOnClickOutside = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClickOutside');\n filterBarProps?.onDropdownMenuClickOutside?.();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle, filterBarProps?.onDropdownMenuClickOutside]);\n\n const onTriggerClick = useCallback(() => {\n filterBarProps?.onDropdownMenuTriggerClick?.();\n onFilterBarOpen();\n }, [filterBarProps?.onDropdownMenuTriggerClick]);\n\n const finalIsOpen = useMemo(() => {\n if (typeof filterBarProps?.isDropdownMenuOpen === 'boolean') return filterBarProps.isDropdownMenuOpen;\n return isOpen;\n }, [filterBarProps?.isDropdownMenuOpen, isOpen]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n {filterBarAddonRenderer ? (\n filterBarAddonRenderer({ innerRef: dropdownMenuRef })\n ) : (\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n aria-label=\"Filter bar addon\"\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n )}\n </StyledWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1,12 +1,7 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
2
|
import { PropTypes } from "@elliemae/ds-utilities";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
"ds-filter-multi-select",
|
|
6
|
-
"ds-filter-single-date",
|
|
7
|
-
"ds-filter-date-range",
|
|
8
|
-
"ds-filter-number-range"
|
|
9
|
-
]);
|
|
3
|
+
import { FILTER_TYPES } from "./exported-related";
|
|
4
|
+
const outOfTheBoxFilterType = PropTypes.oneOf(Object.values(FILTER_TYPES));
|
|
10
5
|
const textWrappingType = PropTypes.oneOf(["wrap", "wrap-all", "truncate"]);
|
|
11
6
|
const columnPropTypes = {
|
|
12
7
|
Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DataTableSchema.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport type { WeakValidationMap } from 'react';\n\nconst outOfTheBoxFilterType = PropTypes.oneOf([\n 'ds-filter-select',\n 'ds-filter-multi-select',\n 'ds-filter-single-date',\n 'ds-filter-date-range',\n 'ds-filter-number-range',\n]);\n\nconst textWrappingType = PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']);\n\nconst columnPropTypes = {\n Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'Header name or component',\n ).isRequired,\n accessor: PropTypes.string.description('The entry of the data that this column will display'),\n id: PropTypes.string.description('The id of the column, will default to the Header or accessor if not present'),\n filter: outOfTheBoxFilterType.description('out-of-the-box filters'),\n Filter: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'The custom component to render as a filter',\n ),\n Cell: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('The custom cell renderer component'),\n editable: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'The editable out-of-the-box or component to render',\n ),\n disableDnD: PropTypes.bool.description('Whereas this column should be draggable'),\n canResize: PropTypes.bool.description('Whereas this column should be resizable'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of this column'),\n minWidth: PropTypes.number.description('Minimum width of this column, useful when resizing'),\n maxWidth: PropTypes.number.description('Maximum width of this column, useful when resizing'),\n canSort: PropTypes.bool.description('Whereas this column is sortable'),\n isSortedDesc: PropTypes.bool.description('Whereas this column is sorted descendingly'),\n required: PropTypes.bool.description('Whereas this column is required'),\n alwaysDisplayEditIcon: PropTypes.bool.description(\n 'Whereas to always show the edit icon on this column if it is editable',\n ),\n textWrap: textWrappingType.description('How to wrap the text in the column'),\n};\n\nconst columnsPropTypes = PropTypes.shape(columnPropTypes).description('Columns props');\n\nconst rowPropTypes = {\n tableRowDetails: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description('Component for row details'),\n dimsumHeaderValue: PropTypes.string.description('Header displayed on the header variant of the row'),\n};\n\nconst rowsPropTypes = PropTypes.shape(rowPropTypes).description('Rows props');\n\nexport const DataTableSchema = {\n columns: PropTypes.arrayOf(columnsPropTypes).description('Array of columns').isRequired,\n data: PropTypes.arrayOf(rowsPropTypes).description('Array of rows'),\n height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Height of the datatable component'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of the datatable component'),\n renderRowActions: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]).description(\n 'The renderer to use for the action toolbar',\n ),\n isExpandable: PropTypes.bool.description('Whether the datatable is expandable').defaultValue(false),\n uniqueRowAccessor: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.func,\n ]).description(\n 'Column / Combination of columns / Function to call to produce a unique identifier for each row.' +\n ' This is necessary for the selectable and drag and drop features',\n ),\n disabledRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is disabled or not',\n ),\n expandedRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is expanded or not',\n ),\n onRowExpand: PropTypes.func.description('Function invoked when a row is (un)expanded'),\n cellRendererProps: PropTypes.object.description(\n 'Object with all the props you want the cells to have available when rendering',\n ),\n selectSingle: PropTypes.bool.description('Whether the selectable feature is single').defaultValue(false),\n selection: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is selected or not',\n ),\n onSelectionChange: PropTypes.func.description('Function invoked when a row is selected'),\n groupedRowsRenderHeader: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).description(\n 'String | Function to call which will display in the row headers',\n ),\n isResizeable: PropTypes.bool.description(\"Whether the datatable's columns are resizeable\"),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n type: PropTypes.string,\n value: PropTypes.any,\n }),\n ).description('Array of filter keys and values'),\n withFilterBar: PropTypes.bool.description('Whether to display the filter bar'),\n filterBarProps: PropTypes.shape({\n filterBarAddonRenderer: PropTypes.func.description('Render filterbar right addon component'),\n customPillRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'If you specify custom filters, you will need to render their pills here',\n ),\n isDropdownMenuOpen: PropTypes.bool.description('Wether the DropdownMenu is Open or not.'),\n onDropdownMenuToggle: PropTypes.func.description('Callback to toggle the DropdownMenu.'),\n onClearAllFiltersClick: PropTypes.func.description('Callback for Clear Al Filters option.'),\n onDropdownMenuClickOutside: PropTypes.func.description('Callback triggered when clicking outside DropdownMenu.'),\n onDropdownMenuTriggerClick: PropTypes.func.description('Callback triggered when clicking DropdownMenu ellipsis.'),\n extraOptions: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.string,\n id: PropTypes.string,\n label: PropTypes.string,\n onClick: PropTypes.func,\n }),\n ).description('Any extra option you want in the dropdownmenu of the filter bar'),\n }).description('Props for the filter bar'),\n onFiltersChange: PropTypes.func.description('Function invoked when filters change'),\n pagination: PropTypes.oneOfType([\n PropTypes.oneOf([false]),\n PropTypes.shape({\n pageCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('How many pages are there'),\n isLoadingPageCount: PropTypes.bool.description('Whether the page count is loading'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func\n .description('Function invoked when the page size changes')\n .defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n dataIsPage: PropTypes.bool.description('Whether to treat data as a page').defaultValue(false),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n }),\n ]).description('Object containing the data for the pagination'),\n colsLayoutStyle: PropTypes.oneOf(['auto', 'fixed']).description('Whether the datatable fills its container or not'),\n hiddenColumns: PropTypes.arrayOf(PropTypes.string).description('IDs of columns not to render'),\n dragAndDropRows: PropTypes.bool.description('Whether to turn on the d&d feature for the rows').defaultValue(false),\n onRowsReorder: PropTypes.func.description('Function invoked when a row is reordered'),\n maxDragAndDropLevel: PropTypes.number.description('Which level is the maximum allowed to drop into'),\n dragAndDropColumns: PropTypes.bool.description('Whether to turn on the d&d feature for the columns'),\n onColumnsReorder: PropTypes.func.description('Function invoked when a column is reordered'),\n getIsDropValid: PropTypes.func.description('Function to determine if a drop is valid'),\n textWrap: textWrappingType.description('Global wrapping rule'),\n noResultsMessage: PropTypes.string.description('Message to show when no more data is available'),\n noResultsSecondaryMessage: PropTypes.string.description('Secondary message to show when no more data is available'),\n noResultsButtonLabel: PropTypes.string.description('Label of the button when no more data is available'),\n noResultsPlaceholder: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'Custom content to show when dataset is empty',\n ),\n isLoading: PropTypes.bool.description('Whether to show a global loader in the datatable'),\n onColumnResize: PropTypes.func\n .description('Function invoked when a column is resized')\n .deprecated({ version: '4.x', message: 'Use onColumnSizeChange' }),\n onColumnSizeChange: PropTypes.func.description('Function invoked when a column is resized'),\n onRowClick: PropTypes.func.description('Function invoked when clicking a row'),\n onRowFocus: PropTypes.func.description('Function invoked when focusing a row'),\n onCellValueChange: PropTypes.func.description(\"Function invoked when an editable cell's content is changed\"),\n onColumnSortChange: PropTypes.func\n .description('Function invoked when a column is sorted')\n .deprecated({ version: '4.x', message: 'Use onColumnSort' }),\n onColumnSort: PropTypes.func.description('Function invoked when a column is sorted'),\n actionRef: PropTypes.object.description('Reference where all the exposed action callbacks will be exposed'),\n} as WeakValidationMap<unknown>;\n"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACCvB,SAAS,iBAAiB;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport { PropTypes } from '@elliemae/ds-utilities';\nimport { FILTER_TYPES } from './exported-related';\nimport type { WeakValidationMap } from 'react';\n\nconst outOfTheBoxFilterType = PropTypes.oneOf(Object.values(FILTER_TYPES));\n\nconst textWrappingType = PropTypes.oneOf(['wrap', 'wrap-all', 'truncate']);\n\nconst columnPropTypes = {\n Header: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'Header name or component',\n ).isRequired,\n accessor: PropTypes.string.description('The entry of the data that this column will display'),\n id: PropTypes.string.description('The id of the column, will default to the Header or accessor if not present'),\n filter: outOfTheBoxFilterType.description('out-of-the-box filters'),\n Filter: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'The custom component to render as a filter',\n ),\n Cell: PropTypes.oneOfType([PropTypes.object, PropTypes.func]).description('The custom cell renderer component'),\n editable: PropTypes.oneOfType([PropTypes.string, PropTypes.func, PropTypes.element]).description(\n 'The editable out-of-the-box or component to render',\n ),\n disableDnD: PropTypes.bool.description('Whereas this column should be draggable'),\n canResize: PropTypes.bool.description('Whereas this column should be resizable'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of this column'),\n minWidth: PropTypes.number.description('Minimum width of this column, useful when resizing'),\n maxWidth: PropTypes.number.description('Maximum width of this column, useful when resizing'),\n canSort: PropTypes.bool.description('Whereas this column is sortable'),\n isSortedDesc: PropTypes.bool.description('Whereas this column is sorted descendingly'),\n required: PropTypes.bool.description('Whereas this column is required'),\n alwaysDisplayEditIcon: PropTypes.bool.description(\n 'Whereas to always show the edit icon on this column if it is editable',\n ),\n textWrap: textWrappingType.description('How to wrap the text in the column'),\n};\n\nconst columnsPropTypes = PropTypes.shape(columnPropTypes).description('Columns props');\n\nconst rowPropTypes = {\n tableRowDetails: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description('Component for row details'),\n dimsumHeaderValue: PropTypes.string.description('Header displayed on the header variant of the row'),\n};\n\nconst rowsPropTypes = PropTypes.shape(rowPropTypes).description('Rows props');\n\nexport const DataTableSchema = {\n columns: PropTypes.arrayOf(columnsPropTypes).description('Array of columns').isRequired,\n data: PropTypes.arrayOf(rowsPropTypes).description('Array of rows'),\n height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Height of the datatable component'),\n width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('Width of the datatable component'),\n renderRowActions: PropTypes.oneOfType([PropTypes.object, PropTypes.bool]).description(\n 'The renderer to use for the action toolbar',\n ),\n isExpandable: PropTypes.bool.description('Whether the datatable is expandable').defaultValue(false),\n uniqueRowAccessor: PropTypes.oneOfType([\n PropTypes.string,\n PropTypes.arrayOf(PropTypes.string),\n PropTypes.func,\n ]).description(\n 'Column / Combination of columns / Function to call to produce a unique identifier for each row.' +\n ' This is necessary for the selectable and drag and drop features',\n ),\n disabledRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is disabled or not',\n ),\n expandedRows: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is expanded or not',\n ),\n onRowExpand: PropTypes.func.description('Function invoked when a row is (un)expanded'),\n cellRendererProps: PropTypes.object.description(\n 'Object with all the props you want the cells to have available when rendering',\n ),\n selectSingle: PropTypes.bool.description('Whether the selectable feature is single').defaultValue(false),\n selection: PropTypes.object.description(\n 'Object with the identifiers of the rows as keys, and booleans as values. Specifies if a row is selected or not',\n ),\n onSelectionChange: PropTypes.func.description('Function invoked when a row is selected'),\n groupedRowsRenderHeader: PropTypes.oneOfType([PropTypes.string, PropTypes.func]).description(\n 'String | Function to call which will display in the row headers',\n ),\n isResizeable: PropTypes.bool.description(\"Whether the datatable's columns are resizeable\"),\n filters: PropTypes.arrayOf(\n PropTypes.shape({\n id: PropTypes.string,\n type: PropTypes.string,\n value: PropTypes.any,\n }),\n ).description('Array of filter keys and values'),\n withFilterBar: PropTypes.bool.description('Whether to display the filter bar'),\n filterBarProps: PropTypes.shape({\n filterBarAddonRenderer: PropTypes.func.description('Render filterbar right addon component'),\n customPillRenderer: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'If you specify custom filters, you will need to render their pills here',\n ),\n isDropdownMenuOpen: PropTypes.bool.description('Wether the DropdownMenu is Open or not.'),\n onDropdownMenuToggle: PropTypes.func.description('Callback to toggle the DropdownMenu.'),\n onClearAllFiltersClick: PropTypes.func.description('Callback for Clear Al Filters option.'),\n onDropdownMenuClickOutside: PropTypes.func.description('Callback triggered when clicking outside DropdownMenu.'),\n onDropdownMenuTriggerClick: PropTypes.func.description('Callback triggered when clicking DropdownMenu ellipsis.'),\n extraOptions: PropTypes.arrayOf(\n PropTypes.shape({\n type: PropTypes.string,\n id: PropTypes.string,\n label: PropTypes.string,\n onClick: PropTypes.func,\n }),\n ).description('Any extra option you want in the dropdownmenu of the filter bar'),\n }).description('Props for the filter bar'),\n onFiltersChange: PropTypes.func.description('Function invoked when filters change'),\n pagination: PropTypes.oneOfType([\n PropTypes.oneOf([false]),\n PropTypes.shape({\n pageCount: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).description('How many pages are there'),\n isLoadingPageCount: PropTypes.bool.description('Whether the page count is loading'),\n pageIndex: PropTypes.number.description('Index of the current page, starting from 1').defaultValue(1),\n canPreviousPage: PropTypes.bool.description('Whether the previous button is disabled or not').defaultValue(true),\n canNextPage: PropTypes.bool.description('Whether the next button is disabled or not').defaultValue(true),\n pageSize: PropTypes.number.description('The current page size').defaultValue(10),\n showPerPageSelector: PropTypes.bool.description('Whether to show the page selector').defaultValue(true),\n perPageOptions: PropTypes.arrayOf(\n PropTypes.oneOfType([\n PropTypes.number,\n PropTypes.shape({\n dsId: PropTypes.string,\n value: PropTypes.number,\n label: PropTypes.string,\n type: PropTypes.oneOf(['single']),\n }),\n ]),\n )\n .description('The available options for page size')\n .defaultValue([10]),\n perPageStep: PropTypes.number.description('Step for the per page options').defaultValue(5),\n minPerPage: PropTypes.number.description('Step for the per page options').defaultValue(0),\n maxPerPage: PropTypes.number.description('Step for the per page options').defaultValue(100),\n onPageSizeChange: PropTypes.func\n .description('Function invoked when the page size changes')\n .defaultValue(() => null),\n onPreviousPage: PropTypes.func\n .description('Function invoked when the previous button is pressed')\n .defaultValue(() => null),\n onPageChange: PropTypes.func.description('Function invoked when the page changes').defaultValue(() => null),\n onNextPage: PropTypes.func.description('Function invoked when next button is pressed').defaultValue(() => null),\n pageDetails: PropTypes.arrayOf(PropTypes.string).description('Details to provide for each page').defaultValue([]),\n dataIsPage: PropTypes.bool.description('Whether to treat data as a page').defaultValue(false),\n pageDetailsTitle: PropTypes.string\n .description('The title of the details (usually a column of your dataset)')\n .defaultValue(''),\n }),\n ]).description('Object containing the data for the pagination'),\n colsLayoutStyle: PropTypes.oneOf(['auto', 'fixed']).description('Whether the datatable fills its container or not'),\n hiddenColumns: PropTypes.arrayOf(PropTypes.string).description('IDs of columns not to render'),\n dragAndDropRows: PropTypes.bool.description('Whether to turn on the d&d feature for the rows').defaultValue(false),\n onRowsReorder: PropTypes.func.description('Function invoked when a row is reordered'),\n maxDragAndDropLevel: PropTypes.number.description('Which level is the maximum allowed to drop into'),\n dragAndDropColumns: PropTypes.bool.description('Whether to turn on the d&d feature for the columns'),\n onColumnsReorder: PropTypes.func.description('Function invoked when a column is reordered'),\n getIsDropValid: PropTypes.func.description('Function to determine if a drop is valid'),\n textWrap: textWrappingType.description('Global wrapping rule'),\n noResultsMessage: PropTypes.string.description('Message to show when no more data is available'),\n noResultsSecondaryMessage: PropTypes.string.description('Secondary message to show when no more data is available'),\n noResultsButtonLabel: PropTypes.string.description('Label of the button when no more data is available'),\n noResultsPlaceholder: PropTypes.oneOfType([PropTypes.func, PropTypes.element]).description(\n 'Custom content to show when dataset is empty',\n ),\n isLoading: PropTypes.bool.description('Whether to show a global loader in the datatable'),\n onColumnResize: PropTypes.func\n .description('Function invoked when a column is resized')\n .deprecated({ version: '4.x', message: 'Use onColumnSizeChange' }),\n onColumnSizeChange: PropTypes.func.description('Function invoked when a column is resized'),\n onRowClick: PropTypes.func.description('Function invoked when clicking a row'),\n onRowFocus: PropTypes.func.description('Function invoked when focusing a row'),\n onCellValueChange: PropTypes.func.description(\"Function invoked when an editable cell's content is changed\"),\n onColumnSortChange: PropTypes.func\n .description('Function invoked when a column is sorted')\n .deprecated({ version: '4.x', message: 'Use onColumnSort' }),\n onColumnSort: PropTypes.func.description('Function invoked when a column is sorted'),\n actionRef: PropTypes.object.description('Reference where all the exposed action callbacks will be exposed'),\n} as WeakValidationMap<unknown>;\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -5,12 +5,13 @@ import { DSDropdownMenuV2 } from "@elliemae/ds-dropdownmenu";
|
|
|
5
5
|
import { DSButtonV2, BUTTON_TYPES } from "@elliemae/ds-button";
|
|
6
6
|
import { MoreOptionsVert } from "@elliemae/ds-icons";
|
|
7
7
|
import { DataTableContext } from "../../DataTableContext";
|
|
8
|
+
import { DATA_TESTID } from "../../configs";
|
|
8
9
|
const FilterBarDropdownMenu = (props) => {
|
|
9
10
|
const {
|
|
10
11
|
tableProps: { onFiltersChange }
|
|
11
12
|
} = useContext(DataTableContext);
|
|
12
13
|
const [isOpened, setIsOpened] = useState(false);
|
|
13
|
-
const { options: extraOptions, innerRef, ...restProps } = props;
|
|
14
|
+
const { options: extraOptions = [], innerRef, ...restProps } = props;
|
|
14
15
|
const removeFilters = useCallback(() => {
|
|
15
16
|
onFiltersChange([]);
|
|
16
17
|
setIsOpened(false);
|
|
@@ -51,6 +52,8 @@ const FilterBarDropdownMenu = (props) => {
|
|
|
51
52
|
buttonType: BUTTON_TYPES.ICON,
|
|
52
53
|
onClick: () => setIsOpened((prevOpened) => !prevOpened),
|
|
53
54
|
innerRef,
|
|
55
|
+
"aria-label": "Filter bar addon",
|
|
56
|
+
"data-testid": DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON,
|
|
54
57
|
...restProps,
|
|
55
58
|
children: /* @__PURE__ */ jsx(MoreOptionsVert, {})
|
|
56
59
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/exported-related/FilterBar/FilterBarDropdownMenu.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useContext,
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useState, useContext, useCallback, useMemo } from 'react';\nimport { DSDropdownMenuV2 } from '@elliemae/ds-dropdownmenu';\nimport { DSButtonV2, BUTTON_TYPES } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { DataTableContext } from '../../DataTableContext';\nimport { DATA_TESTID } from '../../configs';\n\ninterface FilterBarDropdownMenuProps {\n options?: unknown[];\n innerRef?: React.RefObject<HTMLButtonElement>;\n}\n\nexport const FilterBarDropdownMenu: React.ComponentType<FilterBarDropdownMenuProps> = (props) => {\n const {\n tableProps: { onFiltersChange },\n } = useContext(DataTableContext);\n const [isOpened, setIsOpened] = useState(false);\n\n const { options: extraOptions = [], innerRef, ...restProps } = props;\n const removeFilters = useCallback(() => {\n onFiltersChange([]);\n setIsOpened(false);\n innerRef?.current?.focus?.();\n }, [innerRef, onFiltersChange]);\n\n const options = useMemo(\n () => [\n {\n dsId: '__internal__option__clear__filters',\n label: 'Clear Filters',\n type: 'action',\n onClick: removeFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeFilters();\n },\n },\n ...extraOptions,\n ],\n [extraOptions, removeFilters],\n );\n\n return (\n <div style={{ marginLeft: 'auto' }}>\n <DSDropdownMenuV2\n isOpened={isOpened}\n startPlacementPreference=\"bottom-end\"\n options={options}\n onClickOutside={() => {\n setIsOpened(false);\n }}\n onKeyDown={(e: React.KeyboardEvent) => {\n if (e.code === 'Escape') innerRef?.current?.focus?.();\n }}\n >\n <DSButtonV2\n buttonType={BUTTON_TYPES.ICON}\n onClick={() => setIsOpened((prevOpened) => !prevOpened)}\n innerRef={innerRef}\n aria-label=\"Filter bar addon\"\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n {...restProps}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n </DSDropdownMenuV2>\n </div>\n );\n};\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;AC8Db;AA9DV,SAAgB,UAAU,YAAY,aAAa,eAAe;AAClE,SAAS,wBAAwB;AACjC,SAAS,YAAY,oBAAoB;AACzC,SAAS,uBAAuB;AAChC,SAAS,wBAAwB;AACjC,SAAS,mBAAmB;AAOrB,MAAM,wBAAyE,CAAC,UAAU;AAC/F,QAAM;AAAA,IACJ,YAAY,EAAE,gBAAgB;AAAA,EAChC,IAAI,WAAW,gBAAgB;AAC/B,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,KAAK;AAE9C,QAAM,EAAE,SAAS,eAAe,CAAC,GAAG,aAAa,UAAU,IAAI;AAC/D,QAAM,gBAAgB,YAAY,MAAM;AACtC,oBAAgB,CAAC,CAAC;AAClB,gBAAY,KAAK;AACjB,cAAU,SAAS,QAAQ;AAAA,EAC7B,GAAG,CAAC,UAAU,eAAe,CAAC;AAE9B,QAAM,UAAU;AAAA,IACd,MAAM;AAAA,MACJ;AAAA,QACE,MAAM;AAAA,QACN,OAAO;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,WAAW,CAAC,MAA2B;AACrC,cAAI,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI;AAAG,0BAAc;AAAA,QACzD;AAAA,MACF;AAAA,MACA,GAAG;AAAA,IACL;AAAA,IACA,CAAC,cAAc,aAAa;AAAA,EAC9B;AAEA,SACE,oBAAC,SAAI,OAAO,EAAE,YAAY,OAAO,GAC/B;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,0BAAyB;AAAA,MACzB;AAAA,MACA,gBAAgB,MAAM;AACpB,oBAAY,KAAK;AAAA,MACnB;AAAA,MACA,WAAW,CAAC,MAA2B;AACrC,YAAI,EAAE,SAAS;AAAU,oBAAU,SAAS,QAAQ;AAAA,MACtD;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,YAAY,aAAa;AAAA,UACzB,SAAS,MAAM,YAAY,CAAC,eAAe,CAAC,UAAU;AAAA,UACtD;AAAA,UACA,cAAW;AAAA,UACX,eAAa,YAAY;AAAA,UACxB,GAAG;AAAA,UAEJ,8BAAC,mBAAgB;AAAA;AAAA,MACnB;AAAA;AAAA,EACF,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -43,18 +43,22 @@ const Cell = ({
|
|
|
43
43
|
[cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow]
|
|
44
44
|
);
|
|
45
45
|
const CellComponent = cell.render;
|
|
46
|
+
const textValue = useMemo(
|
|
47
|
+
() => appliedTextWrap === "truncate" ? /* @__PURE__ */ jsx(SimpleTruncatedTooltipText, { value: /* @__PURE__ */ jsx(CellComponent, { ...cellProps }) }) : /* @__PURE__ */ jsx(CellComponent, { ...cellProps }),
|
|
48
|
+
[CellComponent, appliedTextWrap, cellProps]
|
|
49
|
+
);
|
|
46
50
|
const pureCellContent = useMemo(() => {
|
|
47
51
|
if (shouldAddExpandCell) {
|
|
48
52
|
return /* @__PURE__ */ jsxs(Grid, { cols: ["min-content", "auto"], alignItems: "center", height: "100%", children: [
|
|
49
53
|
shouldAddExpandCell && /* @__PURE__ */ jsx(expandRowColumn.Cell, { ...cellProps }),
|
|
50
|
-
|
|
54
|
+
textValue
|
|
51
55
|
] });
|
|
52
56
|
}
|
|
53
|
-
return
|
|
54
|
-
}, [
|
|
57
|
+
return textValue;
|
|
58
|
+
}, [cellProps, shouldAddExpandCell, textValue]);
|
|
55
59
|
const DefaultCellContentJSX = useMemo(
|
|
56
|
-
() => /* @__PURE__ */ jsx(StyledCellContent, { children:
|
|
57
|
-
[
|
|
60
|
+
() => /* @__PURE__ */ jsx(StyledCellContent, { children: pureCellContent }),
|
|
61
|
+
[pureCellContent]
|
|
58
62
|
);
|
|
59
63
|
const EditableContentJSX = useMemo(() => {
|
|
60
64
|
if (typeof column.editable === "string") {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/Cells/Cell.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled';\nimport { outOfTheBoxEditables } from '../../addons/Editables';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { TypescriptColumn, TypescriptRow } from '../../types/props';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { expandRowColumn } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useCellStyle } from './useCellStyle';\n\nconst PureStandardCell = memo<{ cellStyle: unknown; column: TypescriptColumn }>(({ cellStyle, children, column }) => (\n <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n {children}\n </StyledCell>\n));\n\ninterface CellProps {\n cell: any;\n column: TypescriptColumn;\n row: TypescriptRow;\n isRowSelected: boolean;\n shouldAddExpandCell: boolean;\n isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n cell,\n column,\n row,\n isRowSelected,\n shouldAddExpandCell,\n isDragOverlay,\n}) => {\n const ctx = useContext(DataTableContext);\n const {\n tableProps: { cellRendererProps, disabledRows },\n } = ctx;\n const isDisabledRow = disabledRows[row.uid];\n\n const { draggableProps } = useContext(SortableItemContext);\n\n const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n const cellProps = useMemo(\n () => ({\n ...cellRendererProps,\n cell,\n row,\n isRowSelected,\n ctx,\n draggableProps,\n isDragOverlay,\n role: 'cell',\n cellStyle,\n column,\n isDisabledRow,\n }),\n [cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n );\n\n const CellComponent = cell.render;\n\n const pureCellContent = useMemo(() => {\n if (shouldAddExpandCell) {\n return (\n <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n {shouldAddExpandCell && <expandRowColumn.Cell {...cellProps} />}\n
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACcrB,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { useContext, useMemo, memo } from 'react';\nimport { SimpleTruncatedTooltipText } from '@elliemae/ds-truncated-tooltip-text';\nimport { Grid } from '@elliemae/ds-grid';\nimport { StyledCell, StyledCellContent } from '../../styled';\nimport { outOfTheBoxEditables } from '../../addons/Editables';\nimport { DataTableContext } from '../../DataTableContext';\nimport type { TypescriptColumn, TypescriptRow } from '../../types/props';\nimport { SortableItemContext } from '../HoC/SortableItemContext';\nimport { expandRowColumn } from '../../addons/Columns';\nimport { DATA_TESTID } from '../../configs/constants';\nimport { useCellStyle } from './useCellStyle';\n\nconst PureStandardCell = memo<{ cellStyle: unknown; column: TypescriptColumn }>(({ cellStyle, children, column }) => (\n <StyledCell column={column} style={cellStyle} role=\"cell\" data-testid={DATA_TESTID.DATA_TABLE_CELL}>\n {children}\n </StyledCell>\n));\n\ninterface CellProps {\n cell: any;\n column: TypescriptColumn;\n row: TypescriptRow;\n isRowSelected: boolean;\n shouldAddExpandCell: boolean;\n isDragOverlay: boolean;\n}\n\nconst Cell: React.ComponentType<CellProps> = ({\n cell,\n column,\n row,\n isRowSelected,\n shouldAddExpandCell,\n isDragOverlay,\n}) => {\n const ctx = useContext(DataTableContext);\n const {\n tableProps: { cellRendererProps, disabledRows },\n } = ctx;\n const isDisabledRow = disabledRows[row.uid];\n\n const { draggableProps } = useContext(SortableItemContext);\n\n const [appliedTextWrap, cellStyle] = useCellStyle(column, shouldAddExpandCell);\n\n const cellProps = useMemo(\n () => ({\n ...cellRendererProps,\n cell,\n row,\n isRowSelected,\n ctx,\n draggableProps,\n isDragOverlay,\n role: 'cell',\n cellStyle,\n column,\n isDisabledRow,\n }),\n [cellRendererProps, cell, row, isRowSelected, ctx, draggableProps, isDragOverlay, cellStyle, column, isDisabledRow],\n );\n\n const CellComponent = cell.render;\n\n const textValue = useMemo(\n () =>\n appliedTextWrap === 'truncate' ? (\n <SimpleTruncatedTooltipText value={<CellComponent {...cellProps} />} />\n ) : (\n <CellComponent {...cellProps} />\n ),\n [CellComponent, appliedTextWrap, cellProps],\n );\n const pureCellContent = useMemo(() => {\n if (shouldAddExpandCell) {\n return (\n <Grid cols={['min-content', 'auto']} alignItems=\"center\" height=\"100%\">\n {shouldAddExpandCell && <expandRowColumn.Cell {...cellProps} />}\n {textValue}\n </Grid>\n );\n }\n return textValue;\n }, [cellProps, shouldAddExpandCell, textValue]);\n const DefaultCellContentJSX = useMemo(\n () => <StyledCellContent>{pureCellContent}</StyledCellContent>,\n [pureCellContent],\n );\n\n const EditableContentJSX = useMemo(() => {\n if (typeof column.editable === 'string') {\n const { EditableComponent } = outOfTheBoxEditables?.[column.editable];\n if (EditableComponent) return <EditableComponent {...cellProps} DefaultCellRender={DefaultCellContentJSX} />;\n }\n if (typeof column.editable === 'function')\n return column.editable({\n DefaultCellRender: DefaultCellContentJSX,\n ...cellProps,\n }) as JSX.Element;\n\n return null;\n }, [DefaultCellContentJSX, cellProps, column]);\n\n return (\n <PureStandardCell {...cellProps}>\n {column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX}\n </PureStandardCell>\n );\n};\n\nexport { Cell };\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACcrB,cA+DM,YA/DN;AAbF,SAAgB,YAAY,SAAS,YAAY;AACjD,SAAS,kCAAkC;AAC3C,SAAS,YAAY;AACrB,SAAS,YAAY,yBAAyB;AAC9C,SAAS,4BAA4B;AACrC,SAAS,wBAAwB;AAEjC,SAAS,2BAA2B;AACpC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAE7B,MAAM,mBAAmB,KAAuD,CAAC,EAAE,WAAW,UAAU,OAAO,MAC7G,oBAAC,cAAW,QAAgB,OAAO,WAAW,MAAK,QAAO,eAAa,YAAY,iBAChF,UACH,CACD;AAWD,MAAM,OAAuC,CAAC;AAAA,EAC5C;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,MAAM,WAAW,gBAAgB;AACvC,QAAM;AAAA,IACJ,YAAY,EAAE,mBAAmB,aAAa;AAAA,EAChD,IAAI;AACJ,QAAM,gBAAgB,aAAa,IAAI;AAEvC,QAAM,EAAE,eAAe,IAAI,WAAW,mBAAmB;AAEzD,QAAM,CAAC,iBAAiB,SAAS,IAAI,aAAa,QAAQ,mBAAmB;AAE7E,QAAM,YAAY;AAAA,IAChB,OAAO;AAAA,MACL,GAAG;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,MAAM;AAAA,MACN;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,mBAAmB,MAAM,KAAK,eAAe,KAAK,gBAAgB,eAAe,WAAW,QAAQ,aAAa;AAAA,EACpH;AAEA,QAAM,gBAAgB,KAAK;AAE3B,QAAM,YAAY;AAAA,IAChB,MACE,oBAAoB,aAClB,oBAAC,8BAA2B,OAAO,oBAAC,iBAAe,GAAG,WAAW,GAAI,IAErE,oBAAC,iBAAe,GAAG,WAAW;AAAA,IAElC,CAAC,eAAe,iBAAiB,SAAS;AAAA,EAC5C;AACA,QAAM,kBAAkB,QAAQ,MAAM;AACpC,QAAI,qBAAqB;AACvB,aACE,qBAAC,QAAK,MAAM,CAAC,eAAe,MAAM,GAAG,YAAW,UAAS,QAAO,QAC7D;AAAA,+BAAuB,oBAAC,gBAAgB,MAAhB,EAAsB,GAAG,WAAW;AAAA,QAC5D;AAAA,SACH;AAAA,IAEJ;AACA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,qBAAqB,SAAS,CAAC;AAC9C,QAAM,wBAAwB;AAAA,IAC5B,MAAM,oBAAC,qBAAmB,2BAAgB;AAAA,IAC1C,CAAC,eAAe;AAAA,EAClB;AAEA,QAAM,qBAAqB,QAAQ,MAAM;AACvC,QAAI,OAAO,OAAO,aAAa,UAAU;AACvC,YAAM,EAAE,kBAAkB,IAAI,uBAAuB,OAAO;AAC5D,UAAI;AAAmB,eAAO,oBAAC,qBAAmB,GAAG,WAAW,mBAAmB,uBAAuB;AAAA,IAC5G;AACA,QAAI,OAAO,OAAO,aAAa;AAC7B,aAAO,OAAO,SAAS;AAAA,QACrB,mBAAmB;AAAA,QACnB,GAAG;AAAA,MACL,CAAC;AAEH,WAAO;AAAA,EACT,GAAG,CAAC,uBAAuB,WAAW,MAAM,CAAC;AAE7C,SACE,oBAAC,oBAAkB,GAAG,WACnB,iBAAO,YAAY,CAAC,aAAa,IAAI,OAAO,qBAAqB,uBACpE;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../scripts/build/transpile/react-shim.js", "../../../../src/parts/FilterBar/FiltersBar.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useContext, useMemo, useRef, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport type { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const [isOpen, setIsOpen] = useState(false);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const { filterBarAddonRenderer } = filterBarProps || {};\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n filterBarProps?.onClearAllFiltersClick?.();\n setIsOpen(false);\n }, [onFiltersChange, filterBarProps?.onClearAllFiltersClick]);\n\n const onFilterBarClose = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClose');\n dropdownMenuRef.current.focus();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOpen = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(true, 'onOpen');\n setIsOpen(true);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOnClickOutside = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClickOutside');\n filterBarProps?.onDropdownMenuClickOutside?.();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle, filterBarProps?.onDropdownMenuClickOutside]);\n\n const onTriggerClick = useCallback(() => {\n filterBarProps?.onDropdownMenuTriggerClick?.();\n onFilterBarOpen();\n }, [filterBarProps?.onDropdownMenuTriggerClick]);\n\n const finalIsOpen = useMemo(() => {\n if (typeof filterBarProps?.isDropdownMenuOpen === 'boolean') return filterBarProps.isDropdownMenuOpen;\n return isOpen;\n }, [filterBarProps?.isDropdownMenuOpen, isOpen]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n {filterBarAddonRenderer ? (\n filterBarAddonRenderer({ innerRef: dropdownMenuRef })\n ) : (\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n )}\n </StyledWrapper>\n );\n};\n"],
|
|
5
|
-
"mappings": "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
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useContext, useMemo, useRef, useState } from 'react';\nimport { DSButtonV2 } from '@elliemae/ds-button';\nimport { MoreOptionsVert } from '@elliemae/ds-icons';\nimport { FILTER_TYPES } from '../../exported-related';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n} from './components';\nimport { DataTableContext } from '../../DataTableContext';\nimport { StyledDropdownMenu, StyledWrapper } from './styled';\nimport type { FilterPillComponent } from './types';\nimport { DATA_TESTID } from '../../configs/constants';\n\nconst pillRenderMapper: Record<string, FilterPillComponent<any>> = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n};\n\nexport const FiltersBar: React.ComponentType = () => {\n const {\n tableProps: { width, filterBarProps, onFiltersChange, filters },\n visibleColumns,\n } = useContext(DataTableContext);\n\n const [isOpen, setIsOpen] = useState(false);\n\n const pillGroupRefs = useMemo(() => {\n const refs: React.RefObject<HTMLElement>[] = [];\n for (let i = 0; i < filters.length; i += 1) refs.push(React.createRef());\n return refs;\n }, [filters.length]);\n\n const dropdownMenuRef = useRef(null);\n\n const { filterBarAddonRenderer } = filterBarProps || {};\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n filterBarProps?.onClearAllFiltersClick?.();\n setIsOpen(false);\n }, [onFiltersChange, filterBarProps?.onClearAllFiltersClick]);\n\n const onFilterBarClose = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClose');\n dropdownMenuRef.current.focus();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOpen = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(true, 'onOpen');\n setIsOpen(true);\n }, [filterBarProps?.onDropdownMenuToggle]);\n\n const onFilterBarOnClickOutside = useCallback(() => {\n filterBarProps?.onDropdownMenuToggle?.(false, 'onClickOutside');\n filterBarProps?.onDropdownMenuClickOutside?.();\n setIsOpen(false);\n }, [filterBarProps?.onDropdownMenuToggle, filterBarProps?.onDropdownMenuClickOutside]);\n\n const onTriggerClick = useCallback(() => {\n filterBarProps?.onDropdownMenuTriggerClick?.();\n onFilterBarOpen();\n }, [filterBarProps?.onDropdownMenuTriggerClick]);\n\n const finalIsOpen = useMemo(() => {\n if (typeof filterBarProps?.isDropdownMenuOpen === 'boolean') return filterBarProps.isDropdownMenuOpen;\n return isOpen;\n }, [filterBarProps?.isDropdownMenuOpen, isOpen]);\n\n return (\n <StyledWrapper width={width} aria-live=\"polite\" aria-relevant=\"additions removals\" gutter=\"xs\">\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component: FilterPillComponent<unknown> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType];\n } else if (filterBarProps?.customPillRenderer) {\n Component = filterBarProps.customPillRenderer;\n }\n return (\n <Component\n key={column}\n columnHeader={typeof columnHeader === 'string' ? columnHeader : column}\n column={column}\n value={value}\n filters={filters}\n onFiltersChange={onFiltersChange}\n prevRef={pillGroupRefs[index - 1]}\n innerRef={pillGroupRefs[index]}\n nextRef={pillGroupRefs[index + 1] ?? dropdownMenuRef}\n />\n );\n })}\n {filterBarAddonRenderer ? (\n filterBarAddonRenderer({ innerRef: dropdownMenuRef })\n ) : (\n <StyledDropdownMenu\n preventOverflow=\"scrollParent\"\n isOpen={finalIsOpen}\n onClose={onFilterBarClose}\n onClickOutsideMenu={onFilterBarOnClickOutside}\n options={[\n {\n id: '__internal__option__clear__filters',\n label: 'Clear Filters',\n onClick: removeAllFilters,\n onKeyDown: (e: React.KeyboardEvent) => {\n if (['Enter', 'Space'].includes(e.code)) removeAllFilters();\n },\n },\n ...(filterBarProps?.extraOptions || []),\n ]}\n triggerComponent={\n <DSButtonV2\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON}\n buttonType=\"icon\"\n innerRef={dropdownMenuRef}\n onClick={onTriggerClick}\n aria-label=\"Filter bar addon\"\n >\n <MoreOptionsVert />\n </DSButtonV2>\n }\n />\n )}\n </StyledWrapper>\n );\n};\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -1 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
import React from 'react';
|
|
2
|
+
interface FilterBarDropdownMenuProps {
|
|
3
|
+
options?: unknown[];
|
|
4
|
+
innerRef?: React.RefObject<HTMLButtonElement>;
|
|
5
|
+
}
|
|
6
|
+
export declare const FilterBarDropdownMenu: React.ComponentType<FilterBarDropdownMenuProps>;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-data-table",
|
|
3
|
-
"version": "3.14.
|
|
3
|
+
"version": "3.14.10",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Data Table",
|
|
6
6
|
"files": [
|
|
@@ -573,23 +573,23 @@
|
|
|
573
573
|
"dependencies": {
|
|
574
574
|
"react-virtual": "~2.10.4",
|
|
575
575
|
"uid": "~2.0.0",
|
|
576
|
-
"@elliemae/ds-button": "3.14.
|
|
577
|
-
"@elliemae/ds-circular-progress-indicator": "3.14.
|
|
578
|
-
"@elliemae/ds-controlled-form": "3.14.
|
|
579
|
-
"@elliemae/ds-
|
|
580
|
-
"@elliemae/ds-
|
|
581
|
-
"@elliemae/ds-form": "3.14.
|
|
582
|
-
"@elliemae/ds-form-layout-blocks": "3.14.
|
|
583
|
-
"@elliemae/ds-grid": "3.14.
|
|
584
|
-
"@elliemae/ds-pagination": "3.14.
|
|
585
|
-
"@elliemae/ds-
|
|
586
|
-
"@elliemae/ds-
|
|
587
|
-
"@elliemae/ds-
|
|
588
|
-
"@elliemae/ds-
|
|
589
|
-
"@elliemae/ds-
|
|
590
|
-
"@elliemae/ds-
|
|
591
|
-
"@elliemae/ds-utilities": "3.14.
|
|
592
|
-
"@elliemae/ds-
|
|
576
|
+
"@elliemae/ds-button": "3.14.10",
|
|
577
|
+
"@elliemae/ds-circular-progress-indicator": "3.14.10",
|
|
578
|
+
"@elliemae/ds-controlled-form": "3.14.10",
|
|
579
|
+
"@elliemae/ds-dropdownmenu": "3.14.10",
|
|
580
|
+
"@elliemae/ds-drag-and-drop": "3.14.10",
|
|
581
|
+
"@elliemae/ds-form": "3.14.10",
|
|
582
|
+
"@elliemae/ds-form-layout-blocks": "3.14.10",
|
|
583
|
+
"@elliemae/ds-grid": "3.14.10",
|
|
584
|
+
"@elliemae/ds-pagination": "3.14.10",
|
|
585
|
+
"@elliemae/ds-pills": "3.14.10",
|
|
586
|
+
"@elliemae/ds-icons": "3.14.10",
|
|
587
|
+
"@elliemae/ds-skeleton": "3.14.10",
|
|
588
|
+
"@elliemae/ds-popperjs": "3.14.10",
|
|
589
|
+
"@elliemae/ds-system": "3.14.10",
|
|
590
|
+
"@elliemae/ds-toolbar": "3.14.10",
|
|
591
|
+
"@elliemae/ds-utilities": "3.14.10",
|
|
592
|
+
"@elliemae/ds-truncated-tooltip-text": "3.14.10"
|
|
593
593
|
},
|
|
594
594
|
"devDependencies": {
|
|
595
595
|
"@testing-library/react": "~12.1.3",
|