@elliemae/ds-data-table 3.55.0-next.1 → 3.55.0-next.11
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/DSDataTableDefinitions.js +2 -1
- package/dist/cjs/DSDataTableDefinitions.js.map +2 -2
- package/dist/cjs/addons/Editables/TextEditableCell/TextEditableCell.js +4 -2
- package/dist/cjs/addons/Editables/TextEditableCell/TextEditableCell.js.map +3 -3
- package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/index.js +2 -2
- package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/index.js.map +2 -2
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/index.js +138 -0
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/index.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/index.js +1 -0
- package/dist/cjs/addons/Filters/Components/index.js.map +2 -2
- package/dist/cjs/configs/constants.js +1 -0
- package/dist/cjs/configs/constants.js.map +2 -2
- package/dist/cjs/exported-related/EditableCell.js +3 -1
- package/dist/cjs/exported-related/EditableCell.js.map +3 -3
- package/dist/cjs/exported-related/FilterTypes.js +2 -1
- package/dist/cjs/exported-related/FilterTypes.js.map +2 -2
- package/dist/cjs/exported-related/Filters/applyOutOfTheBoxFilters.js +3 -1
- package/dist/cjs/exported-related/Filters/applyOutOfTheBoxFilters.js.map +2 -2
- package/dist/cjs/exported-related/Filters/freeTextSearchFilterFn.js +52 -0
- package/dist/cjs/exported-related/Filters/freeTextSearchFilterFn.js.map +7 -0
- package/dist/cjs/parts/Cells/Cell.js +13 -2
- package/dist/cjs/parts/Cells/Cell.js.map +2 -2
- package/dist/cjs/parts/Cells/CellFactory.js +38 -17
- package/dist/cjs/parts/Cells/CellFactory.js.map +2 -2
- package/dist/cjs/parts/FilterBar/FiltersBar.js +2 -1
- package/dist/cjs/parts/FilterBar/FiltersBar.js.map +2 -2
- package/dist/cjs/parts/FilterBar/components/FreeTextSearchPill.js +58 -0
- package/dist/cjs/parts/FilterBar/components/FreeTextSearchPill.js.map +7 -0
- package/dist/cjs/parts/FilterBar/components/index.js +1 -0
- package/dist/cjs/parts/FilterBar/components/index.js.map +2 -2
- package/dist/cjs/parts/Filters/index.js +2 -1
- package/dist/cjs/parts/Filters/index.js.map +2 -2
- package/dist/cjs/react-desc-prop-types.js.map +2 -2
- package/dist/esm/DSDataTableDefinitions.js +2 -1
- package/dist/esm/DSDataTableDefinitions.js.map +2 -2
- package/dist/esm/addons/Editables/TextEditableCell/TextEditableCell.js +4 -2
- package/dist/esm/addons/Editables/TextEditableCell/TextEditableCell.js.map +3 -3
- package/dist/esm/addons/Filters/Components/CurrencyRangeFilter/index.js +2 -2
- package/dist/esm/addons/Filters/Components/CurrencyRangeFilter/index.js.map +2 -2
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/index.js +108 -0
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/index.js.map +7 -0
- package/dist/esm/addons/Filters/Components/index.js +1 -0
- package/dist/esm/addons/Filters/Components/index.js.map +2 -2
- package/dist/esm/configs/constants.js +1 -0
- package/dist/esm/configs/constants.js.map +2 -2
- package/dist/esm/exported-related/EditableCell.js +3 -1
- package/dist/esm/exported-related/EditableCell.js.map +3 -3
- package/dist/esm/exported-related/FilterTypes.js +2 -1
- package/dist/esm/exported-related/FilterTypes.js.map +2 -2
- package/dist/esm/exported-related/Filters/applyOutOfTheBoxFilters.js +3 -1
- package/dist/esm/exported-related/Filters/applyOutOfTheBoxFilters.js.map +2 -2
- package/dist/esm/exported-related/Filters/freeTextSearchFilterFn.js +22 -0
- package/dist/esm/exported-related/Filters/freeTextSearchFilterFn.js.map +7 -0
- package/dist/esm/parts/Cells/Cell.js +13 -2
- package/dist/esm/parts/Cells/Cell.js.map +2 -2
- package/dist/esm/parts/Cells/CellFactory.js +38 -17
- package/dist/esm/parts/Cells/CellFactory.js.map +2 -2
- package/dist/esm/parts/FilterBar/FiltersBar.js +4 -2
- package/dist/esm/parts/FilterBar/FiltersBar.js.map +2 -2
- package/dist/esm/parts/FilterBar/components/FreeTextSearchPill.js +28 -0
- package/dist/esm/parts/FilterBar/components/FreeTextSearchPill.js.map +7 -0
- package/dist/esm/parts/FilterBar/components/index.js +1 -0
- package/dist/esm/parts/FilterBar/components/index.js.map +2 -2
- package/dist/esm/parts/Filters/index.js +4 -2
- package/dist/esm/parts/Filters/index.js.map +2 -2
- package/dist/esm/react-desc-prop-types.js.map +2 -2
- package/dist/types/DSDataTableDefinitions.d.ts +2 -0
- package/dist/types/addons/Filters/Components/FreeTextSearchFilter/index.d.ts +3 -0
- package/dist/types/addons/Filters/Components/index.d.ts +1 -0
- package/dist/types/configs/constants.d.ts +1 -0
- package/dist/types/exported-related/FilterTypes.d.ts +1 -0
- package/dist/types/exported-related/Filters/freeTextSearchFilterFn.d.ts +2 -0
- package/dist/types/parts/FilterBar/components/FreeTextSearchPill.d.ts +3 -0
- package/dist/types/parts/FilterBar/components/index.d.ts +1 -0
- package/dist/types/react-desc-prop-types.d.ts +3 -0
- package/dist/types/tests/filters/free-text-search-filter.test.d.ts +1 -0
- package/package.json +29 -29
- /package/dist/types/tests/{callbacks/filters → filters}/combobox-filter.test.d.ts +0 -0
- /package/dist/types/tests/{callbacks/filters → filters}/currency-range-filter-PUI-12735.test.d.ts +0 -0
|
@@ -78,7 +78,8 @@ const DSDataTableSlots = {
|
|
|
78
78
|
EMPTY_BUTTON: "empty-button",
|
|
79
79
|
CENTER_CONTENT_FLEX_WRAPPER: "center-content-flex-wrapper",
|
|
80
80
|
LOADER_WRAPPER: "loader-wrapper",
|
|
81
|
-
FILTER_BAR_WRAPPER: "filter-bar-wrapper"
|
|
81
|
+
FILTER_BAR_WRAPPER: "filter-bar-wrapper",
|
|
82
|
+
FREE_TEXT_SEARCH_FILTER: "free-text-search-filter"
|
|
82
83
|
};
|
|
83
84
|
const DSDataTableDataTestIds = (0, import_ds_system.slotObjectToDataTestIds)(DSDataTableName, DSDataTableSlots);
|
|
84
85
|
//# sourceMappingURL=DSDataTableDefinitions.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSDataTableDefinitions.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\nexport const DSDataTableName = 'DSDatatable';\n\nexport const DSDataTableSlots = {\n ROOT: 'root',\n CONTENT_WRAPPER: 'content-wrapper',\n TABLE_WRAPPER: 'table-wrapper',\n PAGINATION_WRAPPER: 'pagination-wrapper',\n TABLE_CONTENT_WRAPPER: 'table-content-wrapper',\n VIRTUAL_LIST_WRAPPER: 'virtual-list-wrapper',\n HEAD_WRAPPER: 'head-wrapper',\n HEAD_TR: 'head-tr',\n HEAD_TH: 'head-th',\n HEAD_RIGHT_ICONS_WRAPPER: 'head-right-icons-wrapper',\n HEADER_CELL_WRAPPER: 'header-cell-wrapper',\n EMPTY_HEADER: 'empty-header',\n RESIZER: 'resizer',\n ACTION_CELL: 'action-cell',\n EXPAND_CELL_CONTAINER: 'expand-cell-container',\n SINGLE_CELL_CONTAINER: 'single-cell-container',\n DRAG_AND_DROP_GRIPPER: 'drag-and-drop-gripper',\n TEXT_EDITABLE_CELL_INPUT: 'text-editable-cell-input',\n FILTER_POPOVER_BUTTON: 'filter-popover-button',\n FILTER_POPOVER_CONTENT: 'filter-popover-content',\n DROP_INDICATOR: 'drop-indicator',\n CELL: 'cell',\n CELL_CONTENT: 'cell-content',\n PENCIL_ICON: 'pencil-icon',\n EDITABLE_CONTAINER: 'editable-container',\n FULLSIZE_GRID: 'fullsize-grid',\n ROW: 'row',\n GROUP_HEADER_CONTAINER: 'group-header-container',\n GROUP_HEADER_TITLE: 'header-title',\n CELL_CONTAINER: 'cells-container',\n TOOLBAR_WRAPPER: 'toolbar-wrapper',\n TOOLBAR_BUTTONS_WRAPPER: 'toolbar-buttons-wrapper',\n TOOLBAR_BUTTON: 'toolbar-button',\n TOOLBAR_POSITION: 'toolbar-position',\n EMPTY_STATE_WRAPPER: 'empty-state-wrapper',\n WARNING_ICON: 'warning-icon',\n EMPTY_PRIMARY_MESSAGE: 'empty-primary-message',\n EMPTY_SECONDARY_MESSAGE: 'empty-secondary-message',\n EMPTY_BUTTON: 'empty-button',\n CENTER_CONTENT_FLEX_WRAPPER: 'center-content-flex-wrapper',\n LOADER_WRAPPER: 'loader-wrapper',\n FILTER_BAR_WRAPPER: 'filter-bar-wrapper',\n};\n\nexport const DSDataTableDataTestIds = slotObjectToDataTestIds(DSDataTableName, DSDataTableSlots);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AACjC,MAAM,kBAAkB;AAExB,MAAM,mBAAmB;AAAA,EAC9B,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,SAAS;AAAA,EACT,0BAA0B;AAAA,EAC1B,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,aAAa;AAAA,EACb,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,0BAA0B;AAAA,EAC1B,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,cAAc;AAAA,EACd,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,KAAK;AAAA,EACL,wBAAwB;AAAA,EACxB,oBAAoB;AAAA,EACpB,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,uBAAuB;AAAA,EACvB,yBAAyB;AAAA,EACzB,cAAc;AAAA,EACd,6BAA6B;AAAA,EAC7B,gBAAgB;AAAA,EAChB,oBAAoB;
|
|
4
|
+
"sourcesContent": ["import { slotObjectToDataTestIds } from '@elliemae/ds-system';\nexport const DSDataTableName = 'DSDatatable';\n\nexport const DSDataTableSlots = {\n ROOT: 'root',\n CONTENT_WRAPPER: 'content-wrapper',\n TABLE_WRAPPER: 'table-wrapper',\n PAGINATION_WRAPPER: 'pagination-wrapper',\n TABLE_CONTENT_WRAPPER: 'table-content-wrapper',\n VIRTUAL_LIST_WRAPPER: 'virtual-list-wrapper',\n HEAD_WRAPPER: 'head-wrapper',\n HEAD_TR: 'head-tr',\n HEAD_TH: 'head-th',\n HEAD_RIGHT_ICONS_WRAPPER: 'head-right-icons-wrapper',\n HEADER_CELL_WRAPPER: 'header-cell-wrapper',\n EMPTY_HEADER: 'empty-header',\n RESIZER: 'resizer',\n ACTION_CELL: 'action-cell',\n EXPAND_CELL_CONTAINER: 'expand-cell-container',\n SINGLE_CELL_CONTAINER: 'single-cell-container',\n DRAG_AND_DROP_GRIPPER: 'drag-and-drop-gripper',\n TEXT_EDITABLE_CELL_INPUT: 'text-editable-cell-input',\n FILTER_POPOVER_BUTTON: 'filter-popover-button',\n FILTER_POPOVER_CONTENT: 'filter-popover-content',\n DROP_INDICATOR: 'drop-indicator',\n CELL: 'cell',\n CELL_CONTENT: 'cell-content',\n PENCIL_ICON: 'pencil-icon',\n EDITABLE_CONTAINER: 'editable-container',\n FULLSIZE_GRID: 'fullsize-grid',\n ROW: 'row',\n GROUP_HEADER_CONTAINER: 'group-header-container',\n GROUP_HEADER_TITLE: 'header-title',\n CELL_CONTAINER: 'cells-container',\n TOOLBAR_WRAPPER: 'toolbar-wrapper',\n TOOLBAR_BUTTONS_WRAPPER: 'toolbar-buttons-wrapper',\n TOOLBAR_BUTTON: 'toolbar-button',\n TOOLBAR_POSITION: 'toolbar-position',\n EMPTY_STATE_WRAPPER: 'empty-state-wrapper',\n WARNING_ICON: 'warning-icon',\n EMPTY_PRIMARY_MESSAGE: 'empty-primary-message',\n EMPTY_SECONDARY_MESSAGE: 'empty-secondary-message',\n EMPTY_BUTTON: 'empty-button',\n CENTER_CONTENT_FLEX_WRAPPER: 'center-content-flex-wrapper',\n LOADER_WRAPPER: 'loader-wrapper',\n FILTER_BAR_WRAPPER: 'filter-bar-wrapper',\n FREE_TEXT_SEARCH_FILTER: 'free-text-search-filter',\n};\n\nexport const DSDataTableDataTestIds = slotObjectToDataTestIds(DSDataTableName, DSDataTableSlots);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAwC;AACjC,MAAM,kBAAkB;AAExB,MAAM,mBAAmB;AAAA,EAC9B,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,oBAAoB;AAAA,EACpB,uBAAuB;AAAA,EACvB,sBAAsB;AAAA,EACtB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,SAAS;AAAA,EACT,0BAA0B;AAAA,EAC1B,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,SAAS;AAAA,EACT,aAAa;AAAA,EACb,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,uBAAuB;AAAA,EACvB,0BAA0B;AAAA,EAC1B,uBAAuB;AAAA,EACvB,wBAAwB;AAAA,EACxB,gBAAgB;AAAA,EAChB,MAAM;AAAA,EACN,cAAc;AAAA,EACd,aAAa;AAAA,EACb,oBAAoB;AAAA,EACpB,eAAe;AAAA,EACf,KAAK;AAAA,EACL,wBAAwB;AAAA,EACxB,oBAAoB;AAAA,EACpB,gBAAgB;AAAA,EAChB,iBAAiB;AAAA,EACjB,yBAAyB;AAAA,EACzB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,uBAAuB;AAAA,EACvB,yBAAyB;AAAA,EACzB,cAAc;AAAA,EACd,6BAA6B;AAAA,EAC7B,gBAAgB;AAAA,EAChB,oBAAoB;AAAA,EACpB,yBAAyB;AAC3B;AAEO,MAAM,6BAAyB,0CAAwB,iBAAiB,gBAAgB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,7 +33,7 @@ __export(TextEditableCell_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(TextEditableCell_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
-
var import_react = require("react");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
37
|
var import_ds_system = require("@elliemae/ds-system");
|
|
38
38
|
var import_exported_related = require("../../../exported-related/index.js");
|
|
39
39
|
var import_createInternalAndPropsContext = require("../../../configs/useStore/createInternalAndPropsContext.js");
|
|
@@ -49,6 +49,7 @@ const TextEditableCell = (props) => {
|
|
|
49
49
|
const { cell, DefaultCellRender, isRowSelected } = props;
|
|
50
50
|
const onCellValueChange = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.onCellValueChange);
|
|
51
51
|
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
52
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => cell, [cell]);
|
|
52
53
|
const [value, setValue] = (0, import_react.useState)(cell.value);
|
|
53
54
|
const handleOnChange = (0, import_react.useCallback)((e) => {
|
|
54
55
|
const {
|
|
@@ -88,7 +89,8 @@ const TextEditableCell = (props) => {
|
|
|
88
89
|
onChange: handleOnChange,
|
|
89
90
|
onBlur: handleOnBlur,
|
|
90
91
|
autoFocus: true,
|
|
91
|
-
getOwnerProps
|
|
92
|
+
getOwnerProps,
|
|
93
|
+
getOwnerPropsArguments
|
|
92
94
|
}
|
|
93
95
|
),
|
|
94
96
|
cell,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Editables/TextEditableCell/TextEditableCell.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable jsx-a11y/no-autofocus */\nimport React, { useState, useCallback } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { EditableCell } from '../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../DSDataTableDefinitions.js';\n\nconst StyledInput = styled('input', { name: DSDataTableName, slot: DSDataTableSlots.TEXT_EDITABLE_CELL_INPUT })`\n outline: none;\n :focus {\n border: 2px solid ${(props) => props.theme.colors.brand[700]};\n }\n max-width: 100%;\n`;\n\nexport const TextEditableCell: React.ComponentType<DSDataTableT.EditableCellProps<HTMLDivElement>> = (props) => {\n const { cell, DefaultCellRender, isRowSelected } = props;\n\n const onCellValueChange = usePropsStore((state) => state.onCellValueChange);\n const getOwnerProps = usePropsStore((store) => store.get);\n\n const [value, setValue] = useState<string>(cell.value as string);\n\n const handleOnChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n const {\n target: { value: tValue },\n } = e;\n setValue(tValue);\n }, []);\n\n const handleOnBlur = useCallback(() => {\n const property = cell.column.id;\n const rowIndex = cell.row.index;\n onCellValueChange({ value, property, rowIndex });\n }, [value, onCellValueChange, cell.column.id, cell.row.index]);\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.code === 'Enter') {\n cell.ref.current?.focus();\n // will exec on blur callback from input and save new value\n }\n if (e.code === 'Escape') {\n setValue(cell.value as string);\n const auxRef = cell.ref.current;\n // this prevent the on blur\n setTimeout(() => {\n auxRef?.focus();\n });\n }\n },\n [cell],\n );\n return (\n <EditableCell\n StandardRender={DefaultCellRender}\n EditableRenderer={\n <StyledInput\n value={value}\n onKeyDown={handleOnKeyDown}\n onChange={handleOnChange}\n onBlur={handleOnBlur}\n autoFocus\n getOwnerProps={getOwnerProps}\n />\n }\n cell={cell}\n isRowSelected={isRowSelected}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["/* eslint-disable jsx-a11y/no-autofocus */\nimport React, { useState, useCallback } from 'react';\nimport { styled } from '@elliemae/ds-system';\nimport { EditableCell } from '../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../../configs/useStore/createInternalAndPropsContext.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../DSDataTableDefinitions.js';\n\nconst StyledInput = styled('input', { name: DSDataTableName, slot: DSDataTableSlots.TEXT_EDITABLE_CELL_INPUT })`\n outline: none;\n :focus {\n border: 2px solid ${(props) => props.theme.colors.brand[700]};\n }\n max-width: 100%;\n`;\n\nexport const TextEditableCell: React.ComponentType<DSDataTableT.EditableCellProps<HTMLDivElement>> = (props) => {\n const { cell, DefaultCellRender, isRowSelected } = props;\n\n const onCellValueChange = usePropsStore((state) => state.onCellValueChange);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => cell, [cell]);\n\n const [value, setValue] = useState<string>(cell.value as string);\n\n const handleOnChange = useCallback((e: React.ChangeEvent<HTMLInputElement>) => {\n const {\n target: { value: tValue },\n } = e;\n setValue(tValue);\n }, []);\n\n const handleOnBlur = useCallback(() => {\n const property = cell.column.id;\n const rowIndex = cell.row.index;\n onCellValueChange({ value, property, rowIndex });\n }, [value, onCellValueChange, cell.column.id, cell.row.index]);\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (e.code === 'Enter') {\n cell.ref.current?.focus();\n // will exec on blur callback from input and save new value\n }\n if (e.code === 'Escape') {\n setValue(cell.value as string);\n const auxRef = cell.ref.current;\n // this prevent the on blur\n setTimeout(() => {\n auxRef?.focus();\n });\n }\n },\n [cell],\n );\n return (\n <EditableCell\n StandardRender={DefaultCellRender}\n EditableRenderer={\n <StyledInput\n value={value}\n onKeyDown={handleOnKeyDown}\n onChange={handleOnChange}\n onBlur={handleOnBlur}\n autoFocus\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n }\n cell={cell}\n isRowSelected={isRowSelected}\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD2Df;AA1DR,mBAA6C;AAC7C,uBAAuB;AACvB,8BAA6B;AAE7B,2CAA8B;AAC9B,oCAAkD;AAElD,MAAM,kBAAc,yBAAO,SAAS,EAAE,MAAM,+CAAiB,MAAM,+CAAiB,yBAAyB,CAAC;AAAA;AAAA;AAAA,wBAGtF,CAAC,UAAU,MAAM,MAAM,OAAO,MAAM,GAAG,CAAC;AAAA;AAAA;AAAA;AAKzD,MAAM,mBAAwF,CAAC,UAAU;AAC9G,QAAM,EAAE,MAAM,mBAAmB,cAAc,IAAI;AAEnD,QAAM,wBAAoB,oDAAc,CAAC,UAAU,MAAM,iBAAiB;AAC1E,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,aAAAA,QAAM,YAAY,MAAM,MAAM,CAAC,IAAI,CAAC;AAEnE,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAiB,KAAK,KAAe;AAE/D,QAAM,qBAAiB,0BAAY,CAAC,MAA2C;AAC7E,UAAM;AAAA,MACJ,QAAQ,EAAE,OAAO,OAAO;AAAA,IAC1B,IAAI;AACJ,aAAS,MAAM;AAAA,EACjB,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAe,0BAAY,MAAM;AACrC,UAAM,WAAW,KAAK,OAAO;AAC7B,UAAM,WAAW,KAAK,IAAI;AAC1B,sBAAkB,EAAE,OAAO,UAAU,SAAS,CAAC;AAAA,EACjD,GAAG,CAAC,OAAO,mBAAmB,KAAK,OAAO,IAAI,KAAK,IAAI,KAAK,CAAC;AAE7D,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA2B;AAC1B,UAAI,EAAE,SAAS,SAAS;AACtB,aAAK,IAAI,SAAS,MAAM;AAAA,MAE1B;AACA,UAAI,EAAE,SAAS,UAAU;AACvB,iBAAS,KAAK,KAAe;AAC7B,cAAM,SAAS,KAAK,IAAI;AAExB,mBAAW,MAAM;AACf,kBAAQ,MAAM;AAAA,QAChB,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,IAAI;AAAA,EACP;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,gBAAgB;AAAA,MAChB,kBACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,WAAW;AAAA,UACX,UAAU;AAAA,UACV,QAAQ;AAAA,UACR,WAAS;AAAA,UACT;AAAA,UACA;AAAA;AAAA,MACF;AAAA,MAEF;AAAA,MACA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -61,8 +61,8 @@ const CurrencyRangeFilter = (props) => {
|
|
|
61
61
|
const [from, setFrom] = (0, import_react.useState)((0, import_ds_form_helpers_mask_hooks.getNumberMaskedValue)(filterValue.from ?? "", opts));
|
|
62
62
|
const [to, setTo] = (0, import_react.useState)((0, import_ds_form_helpers_mask_hooks.getNumberMaskedValue)(filterValue.to ?? "", opts));
|
|
63
63
|
(0, import_react.useEffect)(() => {
|
|
64
|
-
setFrom(
|
|
65
|
-
setTo(
|
|
64
|
+
setFrom(filterValue.from ?? "");
|
|
65
|
+
setTo(filterValue.to ?? "");
|
|
66
66
|
}, [filterValue.from, filterValue.to]);
|
|
67
67
|
const ref = (0, import_react.useRef)(null);
|
|
68
68
|
const shouldFocus = (0, import_react.useRef)(true);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../../src/addons/Filters/Components/CurrencyRangeFilter/index.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useRef, useEffect, useCallback, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { getNumberMaskedValue, useNumberMask } from '@elliemae/ds-form-helpers-mask-hooks';\nimport { DSFormLayoutBlockItem } from '@elliemae/ds-form-layout-blocks';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\n\nconst opts = {\n includeThousandsSeparator: false,\n decimalPlaces: 2,\n decimalRequired: true,\n};\n\nconst idPreffix = 'datatable-currency-range';\n\ninterface CurrentRangeFilterValue {\n from: string | null;\n to: string | null;\n}\n\nexport const CurrencyRangeFilter: React.ComponentType<DSDataTableT.FilterProps<CurrentRangeFilterValue>> = (props) => {\n const {\n column,\n filterValue = { from: null, to: null },\n reduxHeader,\n patchHeader,\n onValueChange,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const [from, setFrom] = useState(getNumberMaskedValue(filterValue.from ?? '', opts));\n const [to, setTo] = useState(getNumberMaskedValue(filterValue.to ?? '', opts));\n\n useEffect(() => {\n // in order to update the input values when the user clear the filters\n // we need to update the state when the filterValue changes\n setFrom(
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmHf;AAnHR,mBAAgE;AAChE,qBAAqB;AACrB,gCAA4B;AAC5B,wCAAoD;AACpD,mCAAsC;AACtC,sBAA6B;AAC7B,iBAAoB;AACpB,8BAA4C;AAE5C,uBAA4B;AAE5B,MAAM,OAAO;AAAA,EACX,2BAA2B;AAAA,EAC3B,eAAe;AAAA,EACf,iBAAiB;AACnB;AAEA,MAAM,YAAY;AAOX,MAAM,sBAA8F,CAAC,UAAU;AACpH,QAAM;AAAA,IACJ;AAAA,IACA,cAAc,EAAE,MAAM,MAAM,IAAI,KAAK;AAAA,IACrC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAa,gBAAI,CAAC;AAAA,EACpB,IAAI;AAEJ,QAAM,CAAC,MAAM,OAAO,QAAI,2BAAS,wDAAqB,YAAY,QAAQ,IAAI,IAAI,CAAC;AACnF,QAAM,CAAC,IAAI,KAAK,QAAI,2BAAS,wDAAqB,YAAY,MAAM,IAAI,IAAI,CAAC;AAE7E,8BAAU,MAAM;AAGd,
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useEffect, useCallback, useState } from 'react';\nimport { Grid } from '@elliemae/ds-grid';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { getNumberMaskedValue, useNumberMask } from '@elliemae/ds-form-helpers-mask-hooks';\nimport { DSFormLayoutBlockItem } from '@elliemae/ds-form-layout-blocks';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\n\nconst opts = {\n includeThousandsSeparator: false,\n decimalPlaces: 2,\n decimalRequired: true,\n};\n\nconst idPreffix = 'datatable-currency-range';\n\ninterface CurrentRangeFilterValue {\n from: string | null;\n to: string | null;\n}\n\nexport const CurrencyRangeFilter: React.ComponentType<DSDataTableT.FilterProps<CurrentRangeFilterValue>> = (props) => {\n const {\n column,\n filterValue = { from: null, to: null },\n reduxHeader,\n patchHeader,\n onValueChange,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const [from, setFrom] = useState(getNumberMaskedValue(filterValue.from ?? '', opts));\n const [to, setTo] = useState(getNumberMaskedValue(filterValue.to ?? '', opts));\n\n useEffect(() => {\n // in order to update the input values when the user clear the filters\n // we need to update the state when the filterValue changes\n setFrom(filterValue.from ?? '');\n setTo(filterValue.to ?? '');\n }, [filterValue.from, filterValue.to]);\n\n const ref = useRef<HTMLInputElement | null>(null);\n const shouldFocus = useRef(true);\n\n const handleApplyChange = useCallback(\n ({ newFrom, newTo }: { newFrom?: string; newTo?: string }) => {\n onValueChange(FILTER_TYPES.CURRENCY_RANGE, { from: newFrom ?? '', to: newTo ?? '' });\n },\n [onValueChange],\n );\n\n const handleFromChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>, newFrom?: string) => {\n handleApplyChange({ newFrom, newTo: to });\n },\n [handleApplyChange, to],\n );\n const handleToChange = useCallback(\n (e: React.ChangeEvent<HTMLInputElement>, newTo?: string) => {\n handleApplyChange({ newFrom: from, newTo });\n },\n [from, handleApplyChange],\n );\n\n const fromInputProps = useNumberMask({\n valueSetter: setFrom,\n onChange: handleFromChange,\n ...opts,\n });\n\n const toInputProps = useNumberMask({\n valueSetter: setTo,\n onChange: handleToChange,\n ...opts,\n });\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent<HTMLInputElement>) => {\n if (e.code === 'Escape') {\n patchHeader(column.id, { hideFilterMenu: true, hideFilterButton: false });\n innerRef.current?.focus();\n }\n },\n [column.id, innerRef, patchHeader],\n );\n\n const handleRef = useCallback(\n (newRef: HTMLInputElement | null) => {\n if (ref.current) ref.current = newRef;\n if (shouldFocus.current) {\n setTimeout(() => {\n newRef?.focus();\n shouldFocus.current = false;\n });\n }\n },\n [shouldFocus],\n );\n\n useEffect(() => {\n if (reduxHeader?.hideFilterMenu) {\n shouldFocus.current = true;\n }\n }, [reduxHeader?.hideFilterMenu]);\n\n return (\n <FilterPopover\n reduxHeader={reduxHeader}\n column={column}\n columnId={column.id}\n menuContent={\n <Grid\n data-testid={DATA_TESTID.DATA_TABLE_CURRENCY_RANGE_CONTROLLER}\n gutter=\"xxxs\"\n padding=\"xxs\"\n cols={['auto', 'auto']}\n style={{ background: 'white' }}\n onKeyDown={handleOnKeyDown}\n >\n <DSFormLayoutBlockItem label=\"Min\" inputID={`${idPreffix}-min-${column.id}-${domIdAffix}`}>\n <DSInputText\n value={from}\n {...fromInputProps}\n id={`${idPreffix}-min-${column.id}-${domIdAffix}`}\n style={{ textAlign: 'right' }}\n placeholder=\"0.00\"\n innerRef={handleRef}\n />\n </DSFormLayoutBlockItem>\n <DSFormLayoutBlockItem label=\"Max\" inputID={`${idPreffix}-max-${column.id}-${domIdAffix}`}>\n <DSInputText\n value={to}\n {...toInputProps}\n id={`${idPreffix}-max-${column.id}s-${domIdAffix}`}\n style={{ textAlign: 'right' }}\n placeholder=\"0.00\"\n />\n </DSFormLayoutBlockItem>\n </Grid>\n }\n triggerIcon={<SearchXsmall />}\n customStyles={{ width: column.ref?.current?.offsetWidth ?? '0px' }}\n innerRef={innerRef}\n ariaLabel=\"Open Currency Range Filter\"\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADmHf;AAnHR,mBAAgE;AAChE,qBAAqB;AACrB,gCAA4B;AAC5B,wCAAoD;AACpD,mCAAsC;AACtC,sBAA6B;AAC7B,iBAAoB;AACpB,8BAA4C;AAE5C,uBAA4B;AAE5B,MAAM,OAAO;AAAA,EACX,2BAA2B;AAAA,EAC3B,eAAe;AAAA,EACf,iBAAiB;AACnB;AAEA,MAAM,YAAY;AAOX,MAAM,sBAA8F,CAAC,UAAU;AACpH,QAAM;AAAA,IACJ;AAAA,IACA,cAAc,EAAE,MAAM,MAAM,IAAI,KAAK;AAAA,IACrC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAa,gBAAI,CAAC;AAAA,EACpB,IAAI;AAEJ,QAAM,CAAC,MAAM,OAAO,QAAI,2BAAS,wDAAqB,YAAY,QAAQ,IAAI,IAAI,CAAC;AACnF,QAAM,CAAC,IAAI,KAAK,QAAI,2BAAS,wDAAqB,YAAY,MAAM,IAAI,IAAI,CAAC;AAE7E,8BAAU,MAAM;AAGd,YAAQ,YAAY,QAAQ,EAAE;AAC9B,UAAM,YAAY,MAAM,EAAE;AAAA,EAC5B,GAAG,CAAC,YAAY,MAAM,YAAY,EAAE,CAAC;AAErC,QAAM,UAAM,qBAAgC,IAAI;AAChD,QAAM,kBAAc,qBAAO,IAAI;AAE/B,QAAM,wBAAoB;AAAA,IACxB,CAAC,EAAE,SAAS,MAAM,MAA4C;AAC5D,oBAAc,qCAAa,gBAAgB,EAAE,MAAM,WAAW,IAAI,IAAI,SAAS,GAAG,CAAC;AAAA,IACrF;AAAA,IACA,CAAC,aAAa;AAAA,EAChB;AAEA,QAAM,uBAAmB;AAAA,IACvB,CAAC,GAAwC,YAAqB;AAC5D,wBAAkB,EAAE,SAAS,OAAO,GAAG,CAAC;AAAA,IAC1C;AAAA,IACA,CAAC,mBAAmB,EAAE;AAAA,EACxB;AACA,QAAM,qBAAiB;AAAA,IACrB,CAAC,GAAwC,UAAmB;AAC1D,wBAAkB,EAAE,SAAS,MAAM,MAAM,CAAC;AAAA,IAC5C;AAAA,IACA,CAAC,MAAM,iBAAiB;AAAA,EAC1B;AAEA,QAAM,qBAAiB,iDAAc;AAAA,IACnC,aAAa;AAAA,IACb,UAAU;AAAA,IACV,GAAG;AAAA,EACL,CAAC;AAED,QAAM,mBAAe,iDAAc;AAAA,IACjC,aAAa;AAAA,IACb,UAAU;AAAA,IACV,GAAG;AAAA,EACL,CAAC;AAED,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA6C;AAC5C,UAAI,EAAE,SAAS,UAAU;AACvB,oBAAY,OAAO,IAAI,EAAE,gBAAgB,MAAM,kBAAkB,MAAM,CAAC;AACxE,iBAAS,SAAS,MAAM;AAAA,MAC1B;AAAA,IACF;AAAA,IACA,CAAC,OAAO,IAAI,UAAU,WAAW;AAAA,EACnC;AAEA,QAAM,gBAAY;AAAA,IAChB,CAAC,WAAoC;AACnC,UAAI,IAAI,QAAS,KAAI,UAAU;AAC/B,UAAI,YAAY,SAAS;AACvB,mBAAW,MAAM;AACf,kBAAQ,MAAM;AACd,sBAAY,UAAU;AAAA,QACxB,CAAC;AAAA,MACH;AAAA,IACF;AAAA,IACA,CAAC,WAAW;AAAA,EACd;AAEA,8BAAU,MAAM;AACd,QAAI,aAAa,gBAAgB;AAC/B,kBAAY,UAAU;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,UAAU,OAAO;AAAA,MACjB,aACE;AAAA,QAAC;AAAA;AAAA,UACC,eAAa,6BAAY;AAAA,UACzB,QAAO;AAAA,UACP,SAAQ;AAAA,UACR,MAAM,CAAC,QAAQ,MAAM;AAAA,UACrB,OAAO,EAAE,YAAY,QAAQ;AAAA,UAC7B,WAAW;AAAA,UAEX;AAAA,wDAAC,sDAAsB,OAAM,OAAM,SAAS,GAAG,SAAS,QAAQ,OAAO,EAAE,IAAI,UAAU,IACrF;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACN,GAAG;AAAA,gBACJ,IAAI,GAAG,SAAS,QAAQ,OAAO,EAAE,IAAI,UAAU;AAAA,gBAC/C,OAAO,EAAE,WAAW,QAAQ;AAAA,gBAC5B,aAAY;AAAA,gBACZ,UAAU;AAAA;AAAA,YACZ,GACF;AAAA,YACA,4CAAC,sDAAsB,OAAM,OAAM,SAAS,GAAG,SAAS,QAAQ,OAAO,EAAE,IAAI,UAAU,IACrF;AAAA,cAAC;AAAA;AAAA,gBACC,OAAO;AAAA,gBACN,GAAG;AAAA,gBACJ,IAAI,GAAG,SAAS,QAAQ,OAAO,EAAE,KAAK,UAAU;AAAA,gBAChD,OAAO,EAAE,WAAW,QAAQ;AAAA,gBAC5B,aAAY;AAAA;AAAA,YACd,GACF;AAAA;AAAA;AAAA,MACF;AAAA,MAEF,aAAa,4CAAC,gCAAa;AAAA,MAC3B,cAAc,EAAE,OAAO,OAAO,KAAK,SAAS,eAAe,MAAM;AAAA,MACjE;AAAA,MACA,WAAU;AAAA;AAAA,EACZ;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,138 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var FreeTextSearchFilter_exports = {};
|
|
30
|
+
__export(FreeTextSearchFilter_exports, {
|
|
31
|
+
FreeTextSearchFilter: () => FreeTextSearchFilter
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(FreeTextSearchFilter_exports);
|
|
34
|
+
var React = __toESM(require("react"));
|
|
35
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
var import_react = require("react");
|
|
37
|
+
var import_ds_icons = require("@elliemae/ds-icons");
|
|
38
|
+
var import_ds_form_input_text = require("@elliemae/ds-form-input-text");
|
|
39
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
40
|
+
var import_ds_grid = require("@elliemae/ds-grid");
|
|
41
|
+
var import_uid = require("uid");
|
|
42
|
+
var import_exported_related = require("../../../../exported-related/index.js");
|
|
43
|
+
var import_constants = require("../../../../configs/constants.js");
|
|
44
|
+
var import_styled = require("../../../../styled.js");
|
|
45
|
+
var import_DSDataTableDefinitions = require("../../../../DSDataTableDefinitions.js");
|
|
46
|
+
var import_createInternalAndPropsContext = require("../../../../configs/useStore/createInternalAndPropsContext.js");
|
|
47
|
+
const StyledInputFreeTextSearch = (0, import_ds_system.styled)(import_ds_form_input_text.DSInputText, {
|
|
48
|
+
name: import_DSDataTableDefinitions.DSDataTableName,
|
|
49
|
+
slot: import_DSDataTableDefinitions.DSDataTableSlots.FREE_TEXT_SEARCH_FILTER
|
|
50
|
+
})``;
|
|
51
|
+
const FreeTextSearchFilter = (props) => {
|
|
52
|
+
const {
|
|
53
|
+
column,
|
|
54
|
+
column: { id, persistFilterInputAfterSubmit = false },
|
|
55
|
+
onValueChange,
|
|
56
|
+
patchHeaderFilterButtonAndMenu,
|
|
57
|
+
reduxHeader,
|
|
58
|
+
innerRef,
|
|
59
|
+
domIdAffix = (0, import_uid.uid)(4)
|
|
60
|
+
} = props;
|
|
61
|
+
const ref = (0, import_react.useRef)(null);
|
|
62
|
+
const shouldFocus = (0, import_react.useRef)(true);
|
|
63
|
+
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
64
|
+
const getOwnerPropsArguments = (0, import_react.useCallback)(
|
|
65
|
+
() => ({
|
|
66
|
+
columnId: id
|
|
67
|
+
}),
|
|
68
|
+
[id]
|
|
69
|
+
);
|
|
70
|
+
const handleRef = (0, import_react.useCallback)((newRef) => {
|
|
71
|
+
ref.current = newRef;
|
|
72
|
+
if (shouldFocus.current) {
|
|
73
|
+
requestAnimationFrame(() => {
|
|
74
|
+
ref.current?.focus();
|
|
75
|
+
shouldFocus.current = false;
|
|
76
|
+
});
|
|
77
|
+
}
|
|
78
|
+
}, []);
|
|
79
|
+
(0, import_react.useEffect)(() => {
|
|
80
|
+
if (reduxHeader?.hideFilterMenu) {
|
|
81
|
+
shouldFocus.current = true;
|
|
82
|
+
}
|
|
83
|
+
}, [reduxHeader?.hideFilterMenu]);
|
|
84
|
+
const [value, setValue] = (0, import_react.useState)("");
|
|
85
|
+
const onKeyDown = (0, import_react.useCallback)(
|
|
86
|
+
(event) => {
|
|
87
|
+
if (event.key === "Enter") {
|
|
88
|
+
onValueChange(import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH, value || void 0);
|
|
89
|
+
if (!persistFilterInputAfterSubmit) {
|
|
90
|
+
setValue("");
|
|
91
|
+
}
|
|
92
|
+
setTimeout(() => {
|
|
93
|
+
patchHeaderFilterButtonAndMenu(id, true);
|
|
94
|
+
innerRef?.current?.focus();
|
|
95
|
+
}, 0);
|
|
96
|
+
}
|
|
97
|
+
},
|
|
98
|
+
[id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu, persistFilterInputAfterSubmit, value]
|
|
99
|
+
);
|
|
100
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
101
|
+
import_exported_related.FilterPopover,
|
|
102
|
+
{
|
|
103
|
+
reduxHeader,
|
|
104
|
+
column,
|
|
105
|
+
columnId: id,
|
|
106
|
+
customStyles: {
|
|
107
|
+
backgroundColor: "#fff",
|
|
108
|
+
width: column.ref?.current?.offsetWidth,
|
|
109
|
+
minWidth: "80px"
|
|
110
|
+
},
|
|
111
|
+
menuContent: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_ds_grid.Grid, { p: "xxs", gutter: "xxs", style: { background: "white" }, children: [
|
|
112
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.ScreenReaderOnly, { id: "filter-input-instructions", children: "Press Enter to apply the filter and close the dialog. Focus will return to the button that opened this dialog." }),
|
|
113
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
114
|
+
StyledInputFreeTextSearch,
|
|
115
|
+
{
|
|
116
|
+
id: `ds-data-table-free-text-search-${id}-${domIdAffix}`,
|
|
117
|
+
placeholder: "",
|
|
118
|
+
value,
|
|
119
|
+
onValueChange: (newValue) => {
|
|
120
|
+
setValue(newValue);
|
|
121
|
+
},
|
|
122
|
+
innerRef: handleRef,
|
|
123
|
+
onKeyDown,
|
|
124
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_FILTER_FREE_TEXT_SEARCH,
|
|
125
|
+
"aria-label": "Free Text Search Filter",
|
|
126
|
+
"aria-describedby": "filter-input-instructions",
|
|
127
|
+
getOwnerProps,
|
|
128
|
+
getOwnerPropsArguments
|
|
129
|
+
}
|
|
130
|
+
)
|
|
131
|
+
] }),
|
|
132
|
+
triggerIcon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_icons.SearchXsmall, {}),
|
|
133
|
+
innerRef,
|
|
134
|
+
ariaLabel: "Open Free Text Search Filter"
|
|
135
|
+
}
|
|
136
|
+
);
|
|
137
|
+
};
|
|
138
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../../../src/addons/Filters/Components/FreeTextSearchFilter/index.tsx", "../../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React, { useRef, useCallback, useState, useEffect } from 'react';\nimport { SearchXsmall } from '@elliemae/ds-icons';\nimport { DSInputText } from '@elliemae/ds-form-input-text';\nimport { styled } from '@elliemae/ds-system';\nimport { Grid } from '@elliemae/ds-grid';\nimport { uid } from 'uid';\nimport { FilterPopover, FILTER_TYPES } from '../../../../exported-related/index.js';\nimport type { DSDataTableT } from '../../../../react-desc-prop-types.js';\nimport { DATA_TESTID } from '../../../../configs/constants.js';\nimport { ScreenReaderOnly } from '../../../../styled.js';\nimport { DSDataTableName, DSDataTableSlots } from '../../../../DSDataTableDefinitions.js';\nimport { usePropsStore } from '../../../../configs/useStore/createInternalAndPropsContext.js';\n\nconst StyledInputFreeTextSearch = styled(DSInputText, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FREE_TEXT_SEARCH_FILTER,\n})``;\n\nexport const FreeTextSearchFilter: React.ComponentType<DSDataTableT.FilterProps<string>> = (props) => {\n const {\n column,\n column: { id, persistFilterInputAfterSubmit = false },\n onValueChange,\n patchHeaderFilterButtonAndMenu,\n reduxHeader,\n innerRef,\n domIdAffix = uid(4),\n } = props;\n\n const ref = useRef<HTMLInputElement | null>(null);\n const shouldFocus = useRef(true);\n\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = useCallback(\n () => ({\n columnId: id,\n }),\n [id],\n );\n\n const handleRef = useCallback((newRef: HTMLInputElement | null) => {\n ref.current = newRef;\n if (shouldFocus.current) {\n requestAnimationFrame(() => {\n ref.current?.focus();\n shouldFocus.current = false;\n });\n }\n }, []);\n useEffect(() => {\n if (reduxHeader?.hideFilterMenu) {\n shouldFocus.current = true;\n }\n }, [reduxHeader?.hideFilterMenu]);\n\n const [value, setValue] = useState<string>('');\n\n const onKeyDown = useCallback(\n (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n // || undefined to clear the filter when empty\n onValueChange(FILTER_TYPES.FREE_TEXT_SEARCH, value || undefined);\n if (!persistFilterInputAfterSubmit) {\n setValue('');\n }\n setTimeout(() => {\n patchHeaderFilterButtonAndMenu(id, true);\n innerRef?.current?.focus();\n }, 0);\n }\n },\n [id, innerRef, onValueChange, patchHeaderFilterButtonAndMenu, persistFilterInputAfterSubmit, value],\n );\n return (\n <FilterPopover\n reduxHeader={reduxHeader}\n column={column}\n columnId={id}\n customStyles={{\n backgroundColor: '#fff',\n width: column.ref?.current?.offsetWidth,\n minWidth: '80px',\n }}\n menuContent={\n <Grid p=\"xxs\" gutter=\"xxs\" style={{ background: 'white' }}>\n <ScreenReaderOnly id=\"filter-input-instructions\">\n Press Enter to apply the filter and close the dialog. Focus will return to the button that opened this\n dialog.\n </ScreenReaderOnly>\n <StyledInputFreeTextSearch\n id={`ds-data-table-free-text-search-${id}-${domIdAffix}`}\n placeholder=\"\"\n value={value}\n onValueChange={(newValue) => {\n setValue(newValue);\n }}\n innerRef={handleRef}\n onKeyDown={onKeyDown}\n data-testid={DATA_TESTID.DATA_TABLE_FILTER_FREE_TEXT_SEARCH}\n aria-label=\"Free Text Search Filter\"\n aria-describedby=\"filter-input-instructions\"\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n />\n </Grid>\n }\n triggerIcon={<SearchXsmall />}\n innerRef={innerRef}\n ariaLabel=\"Open Free Text Search Filter\"\n />\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADoFf;AApFR,mBAAgE;AAChE,sBAA6B;AAC7B,gCAA4B;AAC5B,uBAAuB;AACvB,qBAAqB;AACrB,iBAAoB;AACpB,8BAA4C;AAE5C,uBAA4B;AAC5B,oBAAiC;AACjC,oCAAkD;AAClD,2CAA8B;AAE9B,MAAM,gCAA4B,yBAAO,uCAAa;AAAA,EACpD,MAAM;AAAA,EACN,MAAM,+CAAiB;AACzB,CAAC;AAEM,MAAM,uBAA8E,CAAC,UAAU;AACpG,QAAM;AAAA,IACJ;AAAA,IACA,QAAQ,EAAE,IAAI,gCAAgC,MAAM;AAAA,IACpD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAa,gBAAI,CAAC;AAAA,EACpB,IAAI;AAEJ,QAAM,UAAM,qBAAgC,IAAI;AAChD,QAAM,kBAAc,qBAAO,IAAI;AAE/B,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,6BAAyB;AAAA,IAC7B,OAAO;AAAA,MACL,UAAU;AAAA,IACZ;AAAA,IACA,CAAC,EAAE;AAAA,EACL;AAEA,QAAM,gBAAY,0BAAY,CAAC,WAAoC;AACjE,QAAI,UAAU;AACd,QAAI,YAAY,SAAS;AACvB,4BAAsB,MAAM;AAC1B,YAAI,SAAS,MAAM;AACnB,oBAAY,UAAU;AAAA,MACxB,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,CAAC;AACL,8BAAU,MAAM;AACd,QAAI,aAAa,gBAAgB;AAC/B,kBAAY,UAAU;AAAA,IACxB;AAAA,EACF,GAAG,CAAC,aAAa,cAAc,CAAC;AAEhC,QAAM,CAAC,OAAO,QAAQ,QAAI,uBAAiB,EAAE;AAE7C,QAAM,gBAAY;AAAA,IAChB,CAAC,UAAiD;AAChD,UAAI,MAAM,QAAQ,SAAS;AAEzB,sBAAc,qCAAa,kBAAkB,SAAS,MAAS;AAC/D,YAAI,CAAC,+BAA+B;AAClC,mBAAS,EAAE;AAAA,QACb;AACA,mBAAW,MAAM;AACf,yCAA+B,IAAI,IAAI;AACvC,oBAAU,SAAS,MAAM;AAAA,QAC3B,GAAG,CAAC;AAAA,MACN;AAAA,IACF;AAAA,IACA,CAAC,IAAI,UAAU,eAAe,gCAAgC,+BAA+B,KAAK;AAAA,EACpG;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA,UAAU;AAAA,MACV,cAAc;AAAA,QACZ,iBAAiB;AAAA,QACjB,OAAO,OAAO,KAAK,SAAS;AAAA,QAC5B,UAAU;AAAA,MACZ;AAAA,MACA,aACE,6CAAC,uBAAK,GAAE,OAAM,QAAO,OAAM,OAAO,EAAE,YAAY,QAAQ,GACtD;AAAA,oDAAC,kCAAiB,IAAG,6BAA4B,4HAGjD;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,IAAI,kCAAkC,EAAE,IAAI,UAAU;AAAA,YACtD,aAAY;AAAA,YACZ;AAAA,YACA,eAAe,CAAC,aAAa;AAC3B,uBAAS,QAAQ;AAAA,YACnB;AAAA,YACA,UAAU;AAAA,YACV;AAAA,YACA,eAAa,6BAAY;AAAA,YACzB,cAAW;AAAA,YACX,oBAAiB;AAAA,YACjB;AAAA,YACA;AAAA;AAAA,QACF;AAAA,SACF;AAAA,MAEF,aAAa,4CAAC,gCAAa;AAAA,MAC3B;AAAA,MACA,WAAU;AAAA;AAAA,EACZ;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -35,4 +35,5 @@ __reExport(Components_exports, require("./SelectFilter/MultiSelectFilter.js"), m
|
|
|
35
35
|
__reExport(Components_exports, require("./SingleDateFilter/index.js"), module.exports);
|
|
36
36
|
__reExport(Components_exports, require("./SelectFilter/SingleCreatableFilter.js"), module.exports);
|
|
37
37
|
__reExport(Components_exports, require("./SelectFilter/MultiCreatableFilter.js"), module.exports);
|
|
38
|
+
__reExport(Components_exports, require("./FreeTextSearchFilter/index.js"), module.exports);
|
|
38
39
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../src/addons/Filters/Components/index.tsx", "../../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export * from './DateRangeFilter/index.js';\nexport * from './DateSwitcherFilter/index.js';\nexport * from './NumberRangeFilter/index.js';\nexport * from './CurrencyRangeFilter/index.js';\nexport * from './SelectFilter/SingleSelectFilter.js';\nexport * from './SelectFilter/MultiSelectFilter.js';\nexport * from './SingleDateFilter/index.js';\nexport * from './SelectFilter/SingleCreatableFilter.js';\nexport * from './SelectFilter/MultiCreatableFilter.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAc,uCAAd;AACA,+BAAc,0CADd;AAEA,+BAAc,yCAFd;AAGA,+BAAc,2CAHd;AAIA,+BAAc,iDAJd;AAKA,+BAAc,gDALd;AAMA,+BAAc,wCANd;AAOA,+BAAc,oDAPd;AAQA,+BAAc,mDARd;",
|
|
4
|
+
"sourcesContent": ["export * from './DateRangeFilter/index.js';\nexport * from './DateSwitcherFilter/index.js';\nexport * from './NumberRangeFilter/index.js';\nexport * from './CurrencyRangeFilter/index.js';\nexport * from './SelectFilter/SingleSelectFilter.js';\nexport * from './SelectFilter/MultiSelectFilter.js';\nexport * from './SingleDateFilter/index.js';\nexport * from './SelectFilter/SingleCreatableFilter.js';\nexport * from './SelectFilter/MultiCreatableFilter.js';\nexport * from './FreeTextSearchFilter/index.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAc,uCAAd;AACA,+BAAc,0CADd;AAEA,+BAAc,yCAFd;AAGA,+BAAc,2CAHd;AAIA,+BAAc,iDAJd;AAKA,+BAAc,gDALd;AAMA,+BAAc,wCANd;AAOA,+BAAc,oDAPd;AAQA,+BAAc,mDARd;AASA,+BAAc,4CATd;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -69,6 +69,7 @@ const DATA_TESTID = {
|
|
|
69
69
|
DATA_TABLE_FILTER_BUTTON_ELEMENT: "ds-button",
|
|
70
70
|
// TODO 'data-table-filter-menu-button-element',
|
|
71
71
|
DATA_TABLE_FILTER_MENU_CONTENT: "data-table-filter-menu-content",
|
|
72
|
+
DATA_TABLE_FILTER_FREE_TEXT_SEARCH: "data-table-filter-free-text-search",
|
|
72
73
|
DATA_TABLE_ROW_CONTENT: "data-table-row-content",
|
|
73
74
|
DATA_TABLE_ROW: "data-table-row",
|
|
74
75
|
DATA_TABLE_TOOLBAR_TRIGGER: "data-table-toolbar-trigger",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/configs/constants.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export const momentFormat = 'MM/DD/YYYY';\nexport const ColsLayoutStyle = {\n Fixed: 'fixed',\n Auto: 'auto',\n} as const;\n\nexport const DropIndicatorPosition = {\n None: 'none',\n Before: 'before',\n After: 'after',\n Inside: 'inside',\n} as const;\n\nexport const DATA_TESTID = {\n DATA_TABLE_WRAPPER: 'data-table-wrapper',\n DATA_TABLE_GLOBAL_EXPAND_CELL: 'data-table-global-expand-cell',\n DATA_TABLE_ICON_ARROW_DOWN: 'ic-arrow-head-down',\n DATA_TABLE_ICON_ARROW_RIGHT: 'ic-arrow-head-right',\n DATA_TABLE_ICON_ARROW_MIXED: 'ic-arrow-head-mixed',\n DATA_TABLE_ICON_CHILD: 'ic-arrow-child',\n DATA_TABLE_GLOBAL_CHECKBOX: 'data-table-global-checkbox',\n DATA_TABLE_CHECKBOX: 'data-table-checkbox',\n DATA_TABLE_RADIO: 'data-table-radio',\n DATA_TABLE_DATE_RANGE_CONTROLLER: 'data-table-date-range',\n DATA_TABLE_DATE_RANGE_CONTROLLER_CHECKBOX_SWITCHER: 'data-table-date-range-checkbox-switcher-container',\n DATA_TABLE_SINGLE_DATE_CONTROLLER: 'data-table-single-date',\n DATA_TABLE_NUMBER_RANGE_CONTROLLER: 'data-table-number-range',\n DATA_TABLE_CURRENCY_RANGE_CONTROLLER: 'data-table-currency-range',\n DATA_TABLE_SELECT_MENU_ITEM: 'data-table-filter-menu-list-item',\n DATA_TABLE_MULTISELECT_CONTROLLER: 'data-table-multi-select',\n DATA_TABLE_SINGLESELECT_CONTROLLER: 'data-table-single-select',\n DATA_TABLE_FILTER_BUTTON: 'data-table-filter-menu-button',\n DATA_TABLE_FILTER_BUTTON_ELEMENT: 'ds-button', // TODO 'data-table-filter-menu-button-element',\n DATA_TABLE_FILTER_MENU_CONTENT: 'data-table-filter-menu-content',\n DATA_TABLE_ROW_CONTENT: 'data-table-row-content',\n DATA_TABLE_ROW: 'data-table-row',\n DATA_TABLE_TOOLBAR_TRIGGER: 'data-table-toolbar-trigger',\n DATA_TABLE_CELL: 'data-table-cell',\n DATA_TABLE_DRAG_HANDLE: 'data-table-drag-handle',\n DATA_TABLE_CONTENT_WRAPPER: 'data-table-content-wrapper',\n DATA_TABLE_TABLE: 'data-table-table',\n DATA_TABLE_SCROLLABLE_CONTAINER: 'data-table-scrollable-container',\n DATA_TABLE_HEADER: 'data-table-header',\n DATA_TABLE_ROW_HEADER_CONTENT: 'data-table-row-header-content',\n DATA_TABLE_ROW_GROUP_HEADER: 'data-table-row-group-header',\n DATA_TABLE_COLUMN_DRAG_OVERLAY: 'data-table-drag-column-drag-overlay',\n DATA_TABLE_HEADER_CELL_TITLE: 'header-cell-title',\n DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON: 'filter-bar-ddmenu-button',\n DATA_TABLE_SORT_BUTTON: 'data-table-sort-button',\n} as const;\n\nexport const EMPTY_FILTER = 'ds-empty-filter';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AACrB,MAAM,kBAAkB;AAAA,EAC7B,OAAO;AAAA,EACP,MAAM;AACR;AAEO,MAAM,wBAAwB;AAAA,EACnC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,MAAM,cAAc;AAAA,EACzB,oBAAoB;AAAA,EACpB,+BAA+B;AAAA,EAC/B,4BAA4B;AAAA,EAC5B,6BAA6B;AAAA,EAC7B,6BAA6B;AAAA,EAC7B,uBAAuB;AAAA,EACvB,4BAA4B;AAAA,EAC5B,qBAAqB;AAAA,EACrB,kBAAkB;AAAA,EAClB,kCAAkC;AAAA,EAClC,oDAAoD;AAAA,EACpD,mCAAmC;AAAA,EACnC,oCAAoC;AAAA,EACpC,sCAAsC;AAAA,EACtC,6BAA6B;AAAA,EAC7B,mCAAmC;AAAA,EACnC,oCAAoC;AAAA,EACpC,0BAA0B;AAAA,EAC1B,kCAAkC;AAAA;AAAA,EAClC,gCAAgC;AAAA,EAChC,wBAAwB;AAAA,EACxB,gBAAgB;AAAA,EAChB,4BAA4B;AAAA,EAC5B,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,EACxB,4BAA4B;AAAA,EAC5B,kBAAkB;AAAA,EAClB,iCAAiC;AAAA,EACjC,mBAAmB;AAAA,EACnB,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,gCAAgC;AAAA,EAChC,8BAA8B;AAAA,EAC9B,sCAAsC;AAAA,EACtC,wBAAwB;AAC1B;AAEO,MAAM,eAAe;",
|
|
4
|
+
"sourcesContent": ["export const momentFormat = 'MM/DD/YYYY';\nexport const ColsLayoutStyle = {\n Fixed: 'fixed',\n Auto: 'auto',\n} as const;\n\nexport const DropIndicatorPosition = {\n None: 'none',\n Before: 'before',\n After: 'after',\n Inside: 'inside',\n} as const;\n\nexport const DATA_TESTID = {\n DATA_TABLE_WRAPPER: 'data-table-wrapper',\n DATA_TABLE_GLOBAL_EXPAND_CELL: 'data-table-global-expand-cell',\n DATA_TABLE_ICON_ARROW_DOWN: 'ic-arrow-head-down',\n DATA_TABLE_ICON_ARROW_RIGHT: 'ic-arrow-head-right',\n DATA_TABLE_ICON_ARROW_MIXED: 'ic-arrow-head-mixed',\n DATA_TABLE_ICON_CHILD: 'ic-arrow-child',\n DATA_TABLE_GLOBAL_CHECKBOX: 'data-table-global-checkbox',\n DATA_TABLE_CHECKBOX: 'data-table-checkbox',\n DATA_TABLE_RADIO: 'data-table-radio',\n DATA_TABLE_DATE_RANGE_CONTROLLER: 'data-table-date-range',\n DATA_TABLE_DATE_RANGE_CONTROLLER_CHECKBOX_SWITCHER: 'data-table-date-range-checkbox-switcher-container',\n DATA_TABLE_SINGLE_DATE_CONTROLLER: 'data-table-single-date',\n DATA_TABLE_NUMBER_RANGE_CONTROLLER: 'data-table-number-range',\n DATA_TABLE_CURRENCY_RANGE_CONTROLLER: 'data-table-currency-range',\n DATA_TABLE_SELECT_MENU_ITEM: 'data-table-filter-menu-list-item',\n DATA_TABLE_MULTISELECT_CONTROLLER: 'data-table-multi-select',\n DATA_TABLE_SINGLESELECT_CONTROLLER: 'data-table-single-select',\n DATA_TABLE_FILTER_BUTTON: 'data-table-filter-menu-button',\n DATA_TABLE_FILTER_BUTTON_ELEMENT: 'ds-button', // TODO 'data-table-filter-menu-button-element',\n DATA_TABLE_FILTER_MENU_CONTENT: 'data-table-filter-menu-content',\n DATA_TABLE_FILTER_FREE_TEXT_SEARCH: 'data-table-filter-free-text-search',\n DATA_TABLE_ROW_CONTENT: 'data-table-row-content',\n DATA_TABLE_ROW: 'data-table-row',\n DATA_TABLE_TOOLBAR_TRIGGER: 'data-table-toolbar-trigger',\n DATA_TABLE_CELL: 'data-table-cell',\n DATA_TABLE_DRAG_HANDLE: 'data-table-drag-handle',\n DATA_TABLE_CONTENT_WRAPPER: 'data-table-content-wrapper',\n DATA_TABLE_TABLE: 'data-table-table',\n DATA_TABLE_SCROLLABLE_CONTAINER: 'data-table-scrollable-container',\n DATA_TABLE_HEADER: 'data-table-header',\n DATA_TABLE_ROW_HEADER_CONTENT: 'data-table-row-header-content',\n DATA_TABLE_ROW_GROUP_HEADER: 'data-table-row-group-header',\n DATA_TABLE_COLUMN_DRAG_OVERLAY: 'data-table-drag-column-drag-overlay',\n DATA_TABLE_HEADER_CELL_TITLE: 'header-cell-title',\n DATA_TABLE_FILTER_BAR_DD_MENU_BUTTON: 'filter-bar-ddmenu-button',\n DATA_TABLE_SORT_BUTTON: 'data-table-sort-button',\n} as const;\n\nexport const EMPTY_FILTER = 'ds-empty-filter';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AACrB,MAAM,kBAAkB;AAAA,EAC7B,OAAO;AAAA,EACP,MAAM;AACR;AAEO,MAAM,wBAAwB;AAAA,EACnC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,MAAM,cAAc;AAAA,EACzB,oBAAoB;AAAA,EACpB,+BAA+B;AAAA,EAC/B,4BAA4B;AAAA,EAC5B,6BAA6B;AAAA,EAC7B,6BAA6B;AAAA,EAC7B,uBAAuB;AAAA,EACvB,4BAA4B;AAAA,EAC5B,qBAAqB;AAAA,EACrB,kBAAkB;AAAA,EAClB,kCAAkC;AAAA,EAClC,oDAAoD;AAAA,EACpD,mCAAmC;AAAA,EACnC,oCAAoC;AAAA,EACpC,sCAAsC;AAAA,EACtC,6BAA6B;AAAA,EAC7B,mCAAmC;AAAA,EACnC,oCAAoC;AAAA,EACpC,0BAA0B;AAAA,EAC1B,kCAAkC;AAAA;AAAA,EAClC,gCAAgC;AAAA,EAChC,oCAAoC;AAAA,EACpC,wBAAwB;AAAA,EACxB,gBAAgB;AAAA,EAChB,4BAA4B;AAAA,EAC5B,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,EACxB,4BAA4B;AAAA,EAC5B,kBAAkB;AAAA,EAClB,iCAAiC;AAAA,EACjC,mBAAmB;AAAA,EACnB,+BAA+B;AAAA,EAC/B,6BAA6B;AAAA,EAC7B,gCAAgC;AAAA,EAChC,8BAA8B;AAAA,EAC9B,sCAAsC;AAAA,EACtC,wBAAwB;AAC1B;AAEO,MAAM,eAAe;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -33,7 +33,7 @@ __export(EditableCell_exports, {
|
|
|
33
33
|
module.exports = __toCommonJS(EditableCell_exports);
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
-
var import_react = require("react");
|
|
36
|
+
var import_react = __toESM(require("react"));
|
|
37
37
|
var import_createInternalAndPropsContext = require("../configs/useStore/createInternalAndPropsContext.js");
|
|
38
38
|
var import_styled = require("../styled.js");
|
|
39
39
|
const EditableCell = (props) => {
|
|
@@ -41,6 +41,7 @@ const EditableCell = (props) => {
|
|
|
41
41
|
const domIdAffix = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.domIdAffix);
|
|
42
42
|
const virtualListHelpers = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.virtualListHelpers);
|
|
43
43
|
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
44
|
+
const getOwnerPropsArguments = import_react.default.useCallback(() => cell, [cell]);
|
|
44
45
|
const [isEditing, setIsEditing] = (0, import_react.useState)(false);
|
|
45
46
|
const [lastIsEditing, setLastIsEditing] = (0, import_react.useState)(false);
|
|
46
47
|
(0, import_react.useLayoutEffect)(() => {
|
|
@@ -93,6 +94,7 @@ const EditableCell = (props) => {
|
|
|
93
94
|
role: "group",
|
|
94
95
|
"aria-labelledby": isEditing ? void 0 : cell.id,
|
|
95
96
|
getOwnerProps,
|
|
97
|
+
getOwnerPropsArguments,
|
|
96
98
|
children: [
|
|
97
99
|
!isEditing ? StandardRender : EditableRenderer,
|
|
98
100
|
!isEditing && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.StyledPencilIcon, {}),
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/exported-related/EditableCell.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import React, { useCallback, useLayoutEffect, useState } from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { StyledEditableContainer, StyledPencilIcon } from '../styled.js';\n\nexport const EditableCell: React.ComponentType<{\n StandardRender: JSX.Element;\n EditableRenderer: JSX.Element;\n cell: DSDataTableT.Cell<HTMLDivElement>;\n isRowSelected?: boolean;\n}> = (props) => {\n const { StandardRender, EditableRenderer, cell, isRowSelected } = props;\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const virtualListHelpers = usePropsStore((state) => state.virtualListHelpers);\n const getOwnerProps = usePropsStore((store) => store.get);\n\n const [isEditing, setIsEditing] = useState(false);\n const [lastIsEditing, setLastIsEditing] = useState(false);\n // When an editable cell is switched on-off, we recalculate the height of the rows\n useLayoutEffect(() => {\n if (isEditing !== lastIsEditing) {\n virtualListHelpers.measure();\n setLastIsEditing(isEditing);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isEditing]);\n\n const handleCellClick = useCallback(\n (e: React.MouseEvent | React.KeyboardEvent) => {\n if (!isEditing) {\n e.stopPropagation();\n setIsEditing(true);\n }\n },\n [isEditing],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (isEditing) {\n e.stopPropagation();\n if (['Enter', 'Escape'].includes(e.code)) {\n setIsEditing(false);\n }\n } else if (['Enter', 'Space'].includes(e.code)) {\n handleCellClick(e);\n }\n },\n [isEditing, handleCellClick, setIsEditing],\n );\n\n const handleOnBlur = useCallback(\n (event: React.FocusEvent) => {\n if (isEditing && !event.currentTarget?.contains(event.relatedTarget)) {\n // Not triggered when swapping focus between children\n setIsEditing(false);\n }\n },\n [isEditing],\n );\n const cols = !isEditing ? ['auto', 'min-content'] : ['auto'];\n return (\n <StyledEditableContainer\n cols={cols}\n tabIndex={isRowSelected && !isEditing ? 0 : -1}\n innerRef={cell.ref}\n onClick={handleCellClick}\n onKeyDown={handleOnKeyDown}\n onBlur={handleOnBlur}\n shouldDisplayEditIcon={cell.column.alwaysDisplayEditIcon}\n role=\"group\"\n aria-labelledby={isEditing ? undefined : cell.id}\n getOwnerProps={getOwnerProps}\n >\n {!isEditing ? StandardRender : EditableRenderer}\n {!isEditing && <StyledPencilIcon />}\n <span id={`editable-cell-${cell.id}-${domIdAffix}`} style={{ display: 'none' }} aria-hidden=\"true\">\n {cell.value as string}, editable cell. To edit the content's of this cell, press the Enter key\n </span>\n </StyledEditableContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
6
|
-
"names": []
|
|
4
|
+
"sourcesContent": ["import React, { useCallback, useLayoutEffect, useState } from 'react';\nimport { usePropsStore } from '../configs/useStore/createInternalAndPropsContext.js';\nimport type { DSDataTableT } from '../react-desc-prop-types.js';\nimport { StyledEditableContainer, StyledPencilIcon } from '../styled.js';\n\nexport const EditableCell: React.ComponentType<{\n StandardRender: JSX.Element;\n EditableRenderer: JSX.Element;\n cell: DSDataTableT.Cell<HTMLDivElement>;\n isRowSelected?: boolean;\n}> = (props) => {\n const { StandardRender, EditableRenderer, cell, isRowSelected } = props;\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const virtualListHelpers = usePropsStore((state) => state.virtualListHelpers);\n const getOwnerProps = usePropsStore((store) => store.get);\n const getOwnerPropsArguments = React.useCallback(() => cell, [cell]);\n\n const [isEditing, setIsEditing] = useState(false);\n const [lastIsEditing, setLastIsEditing] = useState(false);\n // When an editable cell is switched on-off, we recalculate the height of the rows\n useLayoutEffect(() => {\n if (isEditing !== lastIsEditing) {\n virtualListHelpers.measure();\n setLastIsEditing(isEditing);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [isEditing]);\n\n const handleCellClick = useCallback(\n (e: React.MouseEvent | React.KeyboardEvent) => {\n if (!isEditing) {\n e.stopPropagation();\n setIsEditing(true);\n }\n },\n [isEditing],\n );\n\n const handleOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n if (isEditing) {\n e.stopPropagation();\n if (['Enter', 'Escape'].includes(e.code)) {\n setIsEditing(false);\n }\n } else if (['Enter', 'Space'].includes(e.code)) {\n handleCellClick(e);\n }\n },\n [isEditing, handleCellClick, setIsEditing],\n );\n\n const handleOnBlur = useCallback(\n (event: React.FocusEvent) => {\n if (isEditing && !event.currentTarget?.contains(event.relatedTarget)) {\n // Not triggered when swapping focus between children\n setIsEditing(false);\n }\n },\n [isEditing],\n );\n const cols = !isEditing ? ['auto', 'min-content'] : ['auto'];\n return (\n <StyledEditableContainer\n cols={cols}\n tabIndex={isRowSelected && !isEditing ? 0 : -1}\n innerRef={cell.ref}\n onClick={handleCellClick}\n onKeyDown={handleOnKeyDown}\n onBlur={handleOnBlur}\n shouldDisplayEditIcon={cell.column.alwaysDisplayEditIcon}\n role=\"group\"\n aria-labelledby={isEditing ? undefined : cell.id}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n >\n {!isEditing ? StandardRender : EditableRenderer}\n {!isEditing && <StyledPencilIcon />}\n <span id={`editable-cell-${cell.id}-${domIdAffix}`} style={{ display: 'none' }} aria-hidden=\"true\">\n {cell.value as string}, editable cell. To edit the content's of this cell, press the Enter key\n </span>\n </StyledEditableContainer>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD6EF;AA7ErB,mBAA8D;AAC9D,2CAA8B;AAE9B,oBAA0D;AAEnD,MAAM,eAKR,CAAC,UAAU;AACd,QAAM,EAAE,gBAAgB,kBAAkB,MAAM,cAAc,IAAI;AAClE,QAAM,iBAAa,oDAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,QAAM,yBAAqB,oDAAc,CAAC,UAAU,MAAM,kBAAkB;AAC5E,QAAM,oBAAgB,oDAAc,CAAC,UAAU,MAAM,GAAG;AACxD,QAAM,yBAAyB,aAAAA,QAAM,YAAY,MAAM,MAAM,CAAC,IAAI,CAAC;AAEnE,QAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAChD,QAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAS,KAAK;AAExD,oCAAgB,MAAM;AACpB,QAAI,cAAc,eAAe;AAC/B,yBAAmB,QAAQ;AAC3B,uBAAiB,SAAS;AAAA,IAC5B;AAAA,EAEF,GAAG,CAAC,SAAS,CAAC;AAEd,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA8C;AAC7C,UAAI,CAAC,WAAW;AACd,UAAE,gBAAgB;AAClB,qBAAa,IAAI;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AAEA,QAAM,sBAAkB;AAAA,IACtB,CAAC,MAA2B;AAC1B,UAAI,WAAW;AACb,UAAE,gBAAgB;AAClB,YAAI,CAAC,SAAS,QAAQ,EAAE,SAAS,EAAE,IAAI,GAAG;AACxC,uBAAa,KAAK;AAAA,QACpB;AAAA,MACF,WAAW,CAAC,SAAS,OAAO,EAAE,SAAS,EAAE,IAAI,GAAG;AAC9C,wBAAgB,CAAC;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,WAAW,iBAAiB,YAAY;AAAA,EAC3C;AAEA,QAAM,mBAAe;AAAA,IACnB,CAAC,UAA4B;AAC3B,UAAI,aAAa,CAAC,MAAM,eAAe,SAAS,MAAM,aAAa,GAAG;AAEpE,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAAA,IACA,CAAC,SAAS;AAAA,EACZ;AACA,QAAM,OAAO,CAAC,YAAY,CAAC,QAAQ,aAAa,IAAI,CAAC,MAAM;AAC3D,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,UAAU,iBAAiB,CAAC,YAAY,IAAI;AAAA,MAC5C,UAAU,KAAK;AAAA,MACf,SAAS;AAAA,MACT,WAAW;AAAA,MACX,QAAQ;AAAA,MACR,uBAAuB,KAAK,OAAO;AAAA,MACnC,MAAK;AAAA,MACL,mBAAiB,YAAY,SAAY,KAAK;AAAA,MAC9C;AAAA,MACA;AAAA,MAEC;AAAA,SAAC,YAAY,iBAAiB;AAAA,QAC9B,CAAC,aAAa,4CAAC,kCAAiB;AAAA,QACjC,6CAAC,UAAK,IAAI,iBAAiB,KAAK,EAAE,IAAI,UAAU,IAAI,OAAO,EAAE,SAAS,OAAO,GAAG,eAAY,QACzF;AAAA,eAAK;AAAA,UAAgB;AAAA,WACxB;AAAA;AAAA;AAAA,EACF;AAEJ;",
|
|
6
|
+
"names": ["React"]
|
|
7
7
|
}
|
|
@@ -41,6 +41,7 @@ const FILTER_TYPES = {
|
|
|
41
41
|
DATE_RANGE: "ds-filter-date-range",
|
|
42
42
|
DATE_SWITCHER: "ds-filter-date-switcher",
|
|
43
43
|
NUMBER_RANGE: "ds-filter-number-range",
|
|
44
|
-
CURRENCY_RANGE: "ds-filter-currency-range"
|
|
44
|
+
CURRENCY_RANGE: "ds-filter-currency-range",
|
|
45
|
+
FREE_TEXT_SEARCH: "ds-filter-free-text-search"
|
|
45
46
|
};
|
|
46
47
|
//# sourceMappingURL=FilterTypes.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/exported-related/FilterTypes.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export const FILTER_TYPES = {\n SELECT: 'ds-filter-select',\n CREATABLE_SELECT: 'ds-filter-creatable-select',\n MULTI_SELECT: 'ds-filter-multi-select',\n CREATABLE_MULTI_SELECT: 'ds-filter-multi-creatable-select',\n SINGLE_DATE: 'ds-filter-single-date',\n DATE_RANGE: 'ds-filter-date-range',\n DATE_SWITCHER: 'ds-filter-date-switcher',\n NUMBER_RANGE: 'ds-filter-number-range',\n CURRENCY_RANGE: 'ds-filter-currency-range',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,wBAAwB;AAAA,EACxB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,cAAc;AAAA,EACd,gBAAgB;
|
|
4
|
+
"sourcesContent": ["export const FILTER_TYPES = {\n SELECT: 'ds-filter-select',\n CREATABLE_SELECT: 'ds-filter-creatable-select',\n MULTI_SELECT: 'ds-filter-multi-select',\n CREATABLE_MULTI_SELECT: 'ds-filter-multi-creatable-select',\n SINGLE_DATE: 'ds-filter-single-date',\n DATE_RANGE: 'ds-filter-date-range',\n DATE_SWITCHER: 'ds-filter-date-switcher',\n NUMBER_RANGE: 'ds-filter-number-range',\n CURRENCY_RANGE: 'ds-filter-currency-range',\n FREE_TEXT_SEARCH: 'ds-filter-free-text-search',\n} as const;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAhB,MAAM,eAAe;AAAA,EAC1B,QAAQ;AAAA,EACR,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,wBAAwB;AAAA,EACxB,aAAa;AAAA,EACb,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,kBAAkB;AACpB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -39,6 +39,7 @@ var import_dateRangeFilterFn = require("./dateRangeFilterFn.js");
|
|
|
39
39
|
var import_dateSwitcherFilterFn = require("./dateSwitcherFilterFn.js");
|
|
40
40
|
var import_numberRangeFilterFn = require("./numberRangeFilterFn.js");
|
|
41
41
|
var import_currencyRangeFilterFn = require("./currencyRangeFilterFn.js");
|
|
42
|
+
var import_freeTextSearchFilterFn = require("./freeTextSearchFilterFn.js");
|
|
42
43
|
var import_FilterTypes = require("../FilterTypes.js");
|
|
43
44
|
const filterMapper = {
|
|
44
45
|
[import_FilterTypes.FILTER_TYPES.SELECT]: import_singleSelectFilterFn.singleSelectFilterFn,
|
|
@@ -47,7 +48,8 @@ const filterMapper = {
|
|
|
47
48
|
[import_FilterTypes.FILTER_TYPES.DATE_RANGE]: import_dateRangeFilterFn.dateRangeFilterFn,
|
|
48
49
|
[import_FilterTypes.FILTER_TYPES.DATE_SWITCHER]: import_dateSwitcherFilterFn.dateSwitcherFilterFn,
|
|
49
50
|
[import_FilterTypes.FILTER_TYPES.NUMBER_RANGE]: import_numberRangeFilterFn.numberRangeFilterFn,
|
|
50
|
-
[import_FilterTypes.FILTER_TYPES.CURRENCY_RANGE]: import_currencyRangeFilterFn.currencyRangeFilterFn
|
|
51
|
+
[import_FilterTypes.FILTER_TYPES.CURRENCY_RANGE]: import_currencyRangeFilterFn.currencyRangeFilterFn,
|
|
52
|
+
[import_FilterTypes.FILTER_TYPES.FREE_TEXT_SEARCH]: import_freeTextSearchFilterFn.freeTextSearchFilterFn
|
|
51
53
|
};
|
|
52
54
|
const isFilterTypeOutOfTheBox = (type) => Object.keys(filterMapper).includes(type);
|
|
53
55
|
const applyOutOfTheBoxFilters = (data, filters) => {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/exported-related/Filters/applyOutOfTheBoxFilters.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { singleSelectFilterFn } from './singleSelectFilterFn.js';\nimport { multiSelectFilterFn } from './multiSelectFilterFn.js';\nimport { singleDateFilterFn } from './singleDateFilterFn.js';\nimport { dateRangeFilterFn } from './dateRangeFilterFn.js';\nimport { dateSwitcherFilterFn } from './dateSwitcherFilterFn.js';\nimport { numberRangeFilterFn } from './numberRangeFilterFn.js';\nimport { currencyRangeFilterFn } from './currencyRangeFilterFn.js';\nimport { FILTER_TYPES } from '../FilterTypes.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst filterMapper = {\n [FILTER_TYPES.SELECT]: singleSelectFilterFn,\n [FILTER_TYPES.MULTI_SELECT]: multiSelectFilterFn,\n [FILTER_TYPES.SINGLE_DATE]: singleDateFilterFn,\n [FILTER_TYPES.DATE_RANGE]: dateRangeFilterFn,\n [FILTER_TYPES.DATE_SWITCHER]: dateSwitcherFilterFn,\n [FILTER_TYPES.NUMBER_RANGE]: numberRangeFilterFn,\n [FILTER_TYPES.CURRENCY_RANGE]: currencyRangeFilterFn,\n} as const;\n\ntype OutOfTheBoxFilterType = keyof typeof filterMapper;\n\nconst isFilterTypeOutOfTheBox = (type: string): type is OutOfTheBoxFilterType =>\n Object.keys(filterMapper).includes(type);\n\nexport const applyOutOfTheBoxFilters = (\n data: DSDataTableT.Row[],\n filters: DSDataTableT.Filter[],\n): DSDataTableT.Row[] => {\n let filteredData = data;\n\n filters.forEach((filter) => {\n const { type } = filter;\n if (isFilterTypeOutOfTheBox(type)) {\n // all the out of the box filters have internal validation for the filter value\n // so we can safely call the filter function with the filter value as unknown, and let the filter function validate it\n const outOfTheBoxfilterFromMapper = filterMapper[type] as DSDataTableT.FilterFn<unknown>;\n const outOfTheBoxFilterValue = filter.value;\n filteredData = outOfTheBoxfilterFromMapper(filteredData, filter.id, outOfTheBoxFilterValue);\n }\n });\n\n return filteredData;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,kCAAqC;AACrC,iCAAoC;AACpC,gCAAmC;AACnC,+BAAkC;AAClC,kCAAqC;AACrC,iCAAoC;AACpC,mCAAsC;AACtC,yBAA6B;AAG7B,MAAM,eAAe;AAAA,EACnB,CAAC,gCAAa,MAAM,GAAG;AAAA,EACvB,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,WAAW,GAAG;AAAA,EAC5B,CAAC,gCAAa,UAAU,GAAG;AAAA,EAC3B,CAAC,gCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,cAAc,GAAG;
|
|
4
|
+
"sourcesContent": ["import { singleSelectFilterFn } from './singleSelectFilterFn.js';\nimport { multiSelectFilterFn } from './multiSelectFilterFn.js';\nimport { singleDateFilterFn } from './singleDateFilterFn.js';\nimport { dateRangeFilterFn } from './dateRangeFilterFn.js';\nimport { dateSwitcherFilterFn } from './dateSwitcherFilterFn.js';\nimport { numberRangeFilterFn } from './numberRangeFilterFn.js';\nimport { currencyRangeFilterFn } from './currencyRangeFilterFn.js';\nimport { freeTextSearchFilterFn } from './freeTextSearchFilterFn.js';\nimport { FILTER_TYPES } from '../FilterTypes.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst filterMapper = {\n [FILTER_TYPES.SELECT]: singleSelectFilterFn,\n [FILTER_TYPES.MULTI_SELECT]: multiSelectFilterFn,\n [FILTER_TYPES.SINGLE_DATE]: singleDateFilterFn,\n [FILTER_TYPES.DATE_RANGE]: dateRangeFilterFn,\n [FILTER_TYPES.DATE_SWITCHER]: dateSwitcherFilterFn,\n [FILTER_TYPES.NUMBER_RANGE]: numberRangeFilterFn,\n [FILTER_TYPES.CURRENCY_RANGE]: currencyRangeFilterFn,\n [FILTER_TYPES.FREE_TEXT_SEARCH]: freeTextSearchFilterFn,\n} as const;\n\ntype OutOfTheBoxFilterType = keyof typeof filterMapper;\n\nconst isFilterTypeOutOfTheBox = (type: string): type is OutOfTheBoxFilterType =>\n Object.keys(filterMapper).includes(type);\n\nexport const applyOutOfTheBoxFilters = (\n data: DSDataTableT.Row[],\n filters: DSDataTableT.Filter[],\n): DSDataTableT.Row[] => {\n let filteredData = data;\n\n filters.forEach((filter) => {\n const { type } = filter;\n if (isFilterTypeOutOfTheBox(type)) {\n // all the out of the box filters have internal validation for the filter value\n // so we can safely call the filter function with the filter value as unknown, and let the filter function validate it\n const outOfTheBoxfilterFromMapper = filterMapper[type] as DSDataTableT.FilterFn<unknown>;\n const outOfTheBoxFilterValue = filter.value;\n filteredData = outOfTheBoxfilterFromMapper(filteredData, filter.id, outOfTheBoxFilterValue);\n }\n });\n\n return filteredData;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,kCAAqC;AACrC,iCAAoC;AACpC,gCAAmC;AACnC,+BAAkC;AAClC,kCAAqC;AACrC,iCAAoC;AACpC,mCAAsC;AACtC,oCAAuC;AACvC,yBAA6B;AAG7B,MAAM,eAAe;AAAA,EACnB,CAAC,gCAAa,MAAM,GAAG;AAAA,EACvB,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,WAAW,GAAG;AAAA,EAC5B,CAAC,gCAAa,UAAU,GAAG;AAAA,EAC3B,CAAC,gCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,gCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,gCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,gCAAa,gBAAgB,GAAG;AACnC;AAIA,MAAM,0BAA0B,CAAC,SAC/B,OAAO,KAAK,YAAY,EAAE,SAAS,IAAI;AAElC,MAAM,0BAA0B,CACrC,MACA,YACuB;AACvB,MAAI,eAAe;AAEnB,UAAQ,QAAQ,CAAC,WAAW;AAC1B,UAAM,EAAE,KAAK,IAAI;AACjB,QAAI,wBAAwB,IAAI,GAAG;AAGjC,YAAM,8BAA8B,aAAa,IAAI;AACrD,YAAM,yBAAyB,OAAO;AACtC,qBAAe,4BAA4B,cAAc,OAAO,IAAI,sBAAsB;AAAA,IAC5F;AAAA,EACF,CAAC;AAED,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __create = Object.create;
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __export = (target, all) => {
|
|
9
|
+
for (var name in all)
|
|
10
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
+
};
|
|
12
|
+
var __copyProps = (to, from, except, desc) => {
|
|
13
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
+
for (let key of __getOwnPropNames(from))
|
|
15
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
+
}
|
|
18
|
+
return to;
|
|
19
|
+
};
|
|
20
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
+
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
+
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
+
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
+
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
+
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
+
mod
|
|
27
|
+
));
|
|
28
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
+
var freeTextSearchFilterFn_exports = {};
|
|
30
|
+
__export(freeTextSearchFilterFn_exports, {
|
|
31
|
+
freeTextSearchFilterFn: () => freeTextSearchFilterFn
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(freeTextSearchFilterFn_exports);
|
|
34
|
+
var React = __toESM(require("react"));
|
|
35
|
+
var import_constants = require("../../configs/constants.js");
|
|
36
|
+
const freeTextSearchFilterFn = (unfilteredData, filterKey, filterValue) => {
|
|
37
|
+
if (!filterValue) return unfilteredData;
|
|
38
|
+
if (typeof filterValue !== "string") {
|
|
39
|
+
throw new Error(
|
|
40
|
+
`Invalid filter value for free text search filter, expected string received: ${JSON.stringify(filterValue)}`
|
|
41
|
+
);
|
|
42
|
+
}
|
|
43
|
+
const lowerCaseFilterValue = filterValue.toLowerCase();
|
|
44
|
+
return unfilteredData.filter((datum) => {
|
|
45
|
+
if (filterValue === import_constants.EMPTY_FILTER) {
|
|
46
|
+
return datum[filterKey] === null || datum[filterKey] === void 0 || datum[filterKey] === "";
|
|
47
|
+
}
|
|
48
|
+
const cellValue = String(datum[filterKey]).toLowerCase();
|
|
49
|
+
return cellValue.includes(lowerCaseFilterValue);
|
|
50
|
+
});
|
|
51
|
+
};
|
|
52
|
+
//# sourceMappingURL=freeTextSearchFilterFn.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/exported-related/Filters/freeTextSearchFilterFn.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { EMPTY_FILTER } from '../../configs/constants.js';\n\nexport const freeTextSearchFilterFn: DSDataTableT.FilterFnOutOfTheBoxFreeTextSearch = (\n unfilteredData,\n filterKey,\n filterValue,\n) => {\n if (!filterValue) return unfilteredData;\n if (typeof filterValue !== 'string') {\n throw new Error(\n `Invalid filter value for free text search filter, expected string received: ${JSON.stringify(filterValue)}`,\n );\n }\n const lowerCaseFilterValue = filterValue.toLowerCase();\n return unfilteredData.filter((datum) => {\n if (filterValue === EMPTY_FILTER) {\n return datum[filterKey] === null || datum[filterKey] === undefined || datum[filterKey] === '';\n }\n const cellValue = String(datum[filterKey]).toLowerCase();\n return cellValue.includes(lowerCaseFilterValue);\n });\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,uBAA6B;AAEtB,MAAM,yBAAyE,CACpF,gBACA,WACA,gBACG;AACH,MAAI,CAAC,YAAa,QAAO;AACzB,MAAI,OAAO,gBAAgB,UAAU;AACnC,UAAM,IAAI;AAAA,MACR,+EAA+E,KAAK,UAAU,WAAW,CAAC;AAAA,IAC5G;AAAA,EACF;AACA,QAAM,uBAAuB,YAAY,YAAY;AACrD,SAAO,eAAe,OAAO,CAAC,UAAU;AACtC,QAAI,gBAAgB,+BAAc;AAChC,aAAO,MAAM,SAAS,MAAM,QAAQ,MAAM,SAAS,MAAM,UAAa,MAAM,SAAS,MAAM;AAAA,IAC7F;AACA,UAAM,YAAY,OAAO,MAAM,SAAS,CAAC,EAAE,YAAY;AACvD,WAAO,UAAU,SAAS,oBAAoB;AAAA,EAChD,CAAC;AACH;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -43,7 +43,18 @@ var import_createInternalAndPropsContext = require("../../configs/useStore/creat
|
|
|
43
43
|
var import_styled = require("../../styled.js");
|
|
44
44
|
var import_SortableItemContext = require("../HoC/SortableItemContext.js");
|
|
45
45
|
var import_useCellStyle = require("./useCellStyle.js");
|
|
46
|
-
const PureStandardCell = (0, import_react.memo)(({ cellStyle, children, column }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
46
|
+
const PureStandardCell = (0, import_react.memo)(({ cellStyle, children, column, getOwnerProps, getOwnerPropsArguments }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
47
|
+
import_styled.StyledCell,
|
|
48
|
+
{
|
|
49
|
+
column,
|
|
50
|
+
style: cellStyle,
|
|
51
|
+
role: "cell",
|
|
52
|
+
"data-testid": import_constants.DATA_TESTID.DATA_TABLE_CELL,
|
|
53
|
+
getOwnerProps,
|
|
54
|
+
getOwnerPropsArguments,
|
|
55
|
+
children
|
|
56
|
+
}
|
|
57
|
+
));
|
|
47
58
|
const Cell = ({
|
|
48
59
|
cell,
|
|
49
60
|
column,
|
|
@@ -110,6 +121,6 @@ const Cell = ({
|
|
|
110
121
|
});
|
|
111
122
|
return null;
|
|
112
123
|
}, [DefaultCellContentJSX, cellProps, column]);
|
|
113
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PureStandardCell, { ...cellProps, children: column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX });
|
|
124
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PureStandardCell, { ...cellProps, getOwnerProps, getOwnerPropsArguments, children: column.editable && !disabledRows[row.uid] ? EditableContentJSX : DefaultCellContentJSX });
|
|
114
125
|
};
|
|
115
126
|
//# sourceMappingURL=Cell.js.map
|