@elliemae/ds-data-table 3.60.0-next.32 → 3.60.0-next.34
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.js +173 -0
- package/dist/cjs/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.js +138 -0
- package/dist/cjs/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/DateSwitcherFilter/DateSwitcherFilterV2.js +177 -0
- package/dist/cjs/addons/Filters/Components/DateSwitcherFilter/DateSwitcherFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js +161 -0
- package/dist/cjs/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/NumberRangeFilter/NumberRangeFilterV2.js +181 -0
- package/dist/cjs/addons/Filters/Components/NumberRangeFilter/NumberRangeFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/BaseSelectFilterV2.js +202 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/BaseSelectFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiCreatableFilterV2.js +68 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiCreatableFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiSelectFilterV2.js +67 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/MultiSelectFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleCreatableFilterV2.js +67 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleCreatableFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleSelectFilterV2.js +66 -0
- package/dist/cjs/addons/Filters/Components/SelectFilter/SingleSelectFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/SingleDateFilter/SingleDateFilterV2.js +118 -0
- package/dist/cjs/addons/Filters/Components/SingleDateFilter/SingleDateFilterV2.js.map +7 -0
- package/dist/cjs/addons/Filters/Components/index.js +26 -0
- package/dist/cjs/addons/Filters/Components/index.js.map +2 -2
- package/dist/cjs/constants/index.js +2 -1
- package/dist/cjs/constants/index.js.map +2 -2
- package/dist/cjs/exported-related/FilterPopover/FilterPopoverV2.js +158 -0
- package/dist/cjs/exported-related/FilterPopover/FilterPopoverV2.js.map +7 -0
- package/dist/cjs/exported-related/FilterPopover/styled.js +62 -0
- package/dist/cjs/exported-related/FilterPopover/styled.js.map +7 -0
- package/dist/cjs/exported-related/FilterPopover/types.js.map +1 -1
- package/dist/cjs/exported-related/FilterPopover/useGetFilterHandlers.js.map +1 -1
- package/dist/cjs/exported-related/FilterPopover/useOnClickOutside.js +60 -0
- package/dist/cjs/exported-related/FilterPopover/useOnClickOutside.js.map +7 -0
- package/dist/cjs/exported-related/FilterTypes.js +11 -1
- package/dist/cjs/exported-related/FilterTypes.js.map +2 -2
- package/dist/cjs/parts/FilterBar/FiltersBar.js +9 -1
- package/dist/cjs/parts/FilterBar/FiltersBar.js.map +2 -2
- package/dist/cjs/parts/Filters/index.js +11 -1
- package/dist/cjs/parts/Filters/index.js.map +2 -2
- package/dist/esm/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.js +143 -0
- package/dist/esm/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.js +108 -0
- package/dist/esm/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/DateSwitcherFilter/DateSwitcherFilterV2.js +147 -0
- package/dist/esm/addons/Filters/Components/DateSwitcherFilter/DateSwitcherFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js +131 -0
- package/dist/esm/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/NumberRangeFilter/NumberRangeFilterV2.js +151 -0
- package/dist/esm/addons/Filters/Components/NumberRangeFilter/NumberRangeFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/BaseSelectFilterV2.js +172 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/BaseSelectFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiCreatableFilterV2.js +38 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiCreatableFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiSelectFilterV2.js +37 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/MultiSelectFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleCreatableFilterV2.js +37 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleCreatableFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleSelectFilterV2.js +36 -0
- package/dist/esm/addons/Filters/Components/SelectFilter/SingleSelectFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/SingleDateFilter/SingleDateFilterV2.js +88 -0
- package/dist/esm/addons/Filters/Components/SingleDateFilter/SingleDateFilterV2.js.map +7 -0
- package/dist/esm/addons/Filters/Components/index.js +22 -0
- package/dist/esm/addons/Filters/Components/index.js.map +2 -2
- package/dist/esm/constants/index.js +2 -1
- package/dist/esm/constants/index.js.map +2 -2
- package/dist/esm/exported-related/FilterPopover/FilterPopoverV2.js +128 -0
- package/dist/esm/exported-related/FilterPopover/FilterPopoverV2.js.map +7 -0
- package/dist/esm/exported-related/FilterPopover/styled.js +32 -0
- package/dist/esm/exported-related/FilterPopover/styled.js.map +7 -0
- package/dist/esm/exported-related/FilterPopover/useGetFilterHandlers.js.map +1 -1
- package/dist/esm/exported-related/FilterPopover/useOnClickOutside.js +30 -0
- package/dist/esm/exported-related/FilterPopover/useOnClickOutside.js.map +7 -0
- package/dist/esm/exported-related/FilterTypes.js +11 -1
- package/dist/esm/exported-related/FilterTypes.js.map +2 -2
- package/dist/esm/parts/FilterBar/FiltersBar.js +9 -1
- package/dist/esm/parts/FilterBar/FiltersBar.js.map +2 -2
- package/dist/esm/parts/Filters/index.js +22 -2
- package/dist/esm/parts/Filters/index.js.map +2 -2
- package/dist/types/addons/Filters/Components/CurrencyRangeFilter/CurrencyRangeFilterV2.d.ts +8 -0
- package/dist/types/addons/Filters/Components/DateRangeFilter/DateRangeFilterV2.d.ts +8 -0
- package/dist/types/addons/Filters/Components/DateSwitcherFilter/DateSwitcherFilterV2.d.ts +9 -0
- package/dist/types/addons/Filters/Components/FreeTextSearchFilter/FreeTextSearchFilterV2.d.ts +3 -0
- package/dist/types/addons/Filters/Components/NumberRangeFilter/NumberRangeFilterV2.d.ts +8 -0
- package/dist/types/addons/Filters/Components/SelectFilter/BaseSelectFilterV2.d.ts +11 -0
- package/dist/types/addons/Filters/Components/SelectFilter/MultiCreatableFilterV2.d.ts +6 -0
- package/dist/types/addons/Filters/Components/SelectFilter/MultiSelectFilterV2.d.ts +6 -0
- package/dist/types/addons/Filters/Components/SelectFilter/SingleCreatableFilterV2.d.ts +6 -0
- package/dist/types/addons/Filters/Components/SelectFilter/SingleSelectFilterV2.d.ts +6 -0
- package/dist/types/addons/Filters/Components/SingleDateFilter/SingleDateFilterV2.d.ts +5 -0
- package/dist/types/addons/Filters/Components/index.d.ts +10 -0
- package/dist/types/constants/index.d.ts +4 -0
- package/dist/types/exported-related/FilterPopover/FilterPopoverV2.d.ts +3 -0
- package/dist/types/exported-related/FilterPopover/styled.d.ts +6 -0
- package/dist/types/exported-related/FilterPopover/types.d.ts +16 -0
- package/dist/types/exported-related/FilterPopover/useGetFilterHandlers.d.ts +2 -2
- package/dist/types/exported-related/FilterPopover/useOnClickOutside.d.ts +1 -0
- package/dist/types/exported-related/FilterTypes.d.ts +10 -0
- package/package.json +30 -29
|
@@ -0,0 +1,158 @@
|
|
|
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 FilterPopoverV2_exports = {};
|
|
30
|
+
__export(FilterPopoverV2_exports, {
|
|
31
|
+
FilterPopoverV2: () => FilterPopoverV2
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(FilterPopoverV2_exports);
|
|
34
|
+
var React = __toESM(require("react"));
|
|
35
|
+
var import_jsx_runtime = require("react/jsx-runtime");
|
|
36
|
+
var import_ds_button_v2 = require("@elliemae/ds-button-v2");
|
|
37
|
+
var import_ds_floating_context = require("@elliemae/ds-floating-context");
|
|
38
|
+
var import_ds_hooks_focus_trap = require("@elliemae/ds-hooks-focus-trap");
|
|
39
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
40
|
+
var import_react = require("react");
|
|
41
|
+
var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
|
|
42
|
+
var import_constants = require("../../constants/index.js");
|
|
43
|
+
var import_useGetFilterHandlers = require("./useGetFilterHandlers.js");
|
|
44
|
+
var import_useGetFilterVisibility = require("./useGetFilterVisibility.js");
|
|
45
|
+
var import_useOnClickOutside = require("./useOnClickOutside.js");
|
|
46
|
+
var import_styled = require("./styled.js");
|
|
47
|
+
const FilterPopoverV2 = (props) => {
|
|
48
|
+
const {
|
|
49
|
+
column,
|
|
50
|
+
customStyles,
|
|
51
|
+
reduxHeader,
|
|
52
|
+
menuContent,
|
|
53
|
+
ariaLabel,
|
|
54
|
+
triggerIcon,
|
|
55
|
+
innerRef,
|
|
56
|
+
columnReference,
|
|
57
|
+
firstElementRef,
|
|
58
|
+
onFilterSubmit,
|
|
59
|
+
onFilterReset
|
|
60
|
+
} = props;
|
|
61
|
+
const getOwnerProps = (0, import_createInternalAndPropsContext.usePropsStore)((store) => store.get);
|
|
62
|
+
const getOwnerPropsArguments = (0, import_react.useCallback)(
|
|
63
|
+
() => ({
|
|
64
|
+
columnId: column.id
|
|
65
|
+
}),
|
|
66
|
+
[column.id]
|
|
67
|
+
);
|
|
68
|
+
const [buttonReference, setButtonReference] = (0, import_react.useState)(null);
|
|
69
|
+
const [isButtonFocused, setIsButtonFocused] = (0, import_react.useState)(false);
|
|
70
|
+
const { isIconVisible, isMenuOpen } = (0, import_useGetFilterVisibility.useGetFilterVisibility)(reduxHeader);
|
|
71
|
+
const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } = (0, import_useGetFilterHandlers.useGetFilterHandlers)(props, isMenuOpen, buttonReference, setIsButtonFocused);
|
|
72
|
+
const lastElementRef = (0, import_react.useRef)(null);
|
|
73
|
+
const boundaryRef = (0, import_react.useRef)(null);
|
|
74
|
+
const {
|
|
75
|
+
floatingStyles,
|
|
76
|
+
isOpen: isFloatingOpen,
|
|
77
|
+
refs,
|
|
78
|
+
context
|
|
79
|
+
} = (0, import_ds_floating_context.useFloatingContext)({
|
|
80
|
+
externallyControlledIsOpen: isMenuOpen,
|
|
81
|
+
placement: "bottom-end",
|
|
82
|
+
withoutAnimation: true,
|
|
83
|
+
customOffset: [0, 0]
|
|
84
|
+
});
|
|
85
|
+
(0, import_useOnClickOutside.useOnClickOutside)(isMenuOpen ? refs.floating : null, handleClickOutsideMenu);
|
|
86
|
+
const handleOnKeyDown = (0, import_ds_hooks_focus_trap.useFocusTrap)({
|
|
87
|
+
firstElementRef,
|
|
88
|
+
lastElementRef
|
|
89
|
+
});
|
|
90
|
+
(0, import_react.useEffect)(() => {
|
|
91
|
+
if (columnReference) {
|
|
92
|
+
refs.setReference(columnReference);
|
|
93
|
+
}
|
|
94
|
+
}, [columnReference, refs]);
|
|
95
|
+
return (
|
|
96
|
+
// eslint-disable-next-line jsx-a11y/no-static-element-interactions
|
|
97
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
98
|
+
"div",
|
|
99
|
+
{
|
|
100
|
+
onClick: (e) => e.stopPropagation(),
|
|
101
|
+
onKeyDown: handleMenuOnKeyDown,
|
|
102
|
+
children: [
|
|
103
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
104
|
+
import_styled.FilterButton,
|
|
105
|
+
{
|
|
106
|
+
hide: !isIconVisible,
|
|
107
|
+
"data-testid": import_constants.DATA_TABLE_DATA_TESTID.FILTER_POPOVER_BUTTON,
|
|
108
|
+
getOwnerProps,
|
|
109
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
110
|
+
import_ds_button_v2.DSButtonV3,
|
|
111
|
+
{
|
|
112
|
+
buttonType: "icon",
|
|
113
|
+
size: "s",
|
|
114
|
+
onClick: handleTriggerClick,
|
|
115
|
+
onKeyDown: handleMenuOnKeyDown,
|
|
116
|
+
onFocus: handleTriggerOnFocus,
|
|
117
|
+
onBlur: handleTriggerOnBlur,
|
|
118
|
+
innerRef: (0, import_ds_system.mergeRefs)(isIconVisible && setButtonReference, innerRef),
|
|
119
|
+
tabIndex: reduxHeader?.withTabStops ? 0 : -1,
|
|
120
|
+
"aria-label": ariaLabel,
|
|
121
|
+
"aria-hidden": !isButtonFocused,
|
|
122
|
+
"data-testid": import_constants.DATA_TABLE_DATA_TESTID.DATA_TABLE_FILTER_BUTTON_ELEMENT,
|
|
123
|
+
children: triggerIcon
|
|
124
|
+
}
|
|
125
|
+
)
|
|
126
|
+
}
|
|
127
|
+
),
|
|
128
|
+
refs.reference && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
129
|
+
import_styled.StyledFloatingWrapper,
|
|
130
|
+
{
|
|
131
|
+
innerRef: refs.setFloating,
|
|
132
|
+
isOpen: isFloatingOpen,
|
|
133
|
+
floatingStyles: {
|
|
134
|
+
...floatingStyles,
|
|
135
|
+
...customStyles,
|
|
136
|
+
minWidth: "min-content"
|
|
137
|
+
},
|
|
138
|
+
context,
|
|
139
|
+
"data-testid": import_constants.DATA_TABLE_DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT,
|
|
140
|
+
getOwnerProps,
|
|
141
|
+
getOwnerPropsArguments,
|
|
142
|
+
"aria-label": `Filter by ${column.Header}`,
|
|
143
|
+
role: "dialog",
|
|
144
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_styled.PopperContent, { getOwnerProps, onKeyDown: handleOnKeyDown, innerRef: boundaryRef, children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("form", { onSubmit: onFilterSubmit, children: [
|
|
145
|
+
menuContent,
|
|
146
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_styled.StyledDSDialogFooter, { children: [
|
|
147
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button_v2.DSButtonV3, { onClick: onFilterReset, buttonType: "outline", size: "s", children: "Reset" }),
|
|
148
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_button_v2.DSButtonV3, { type: "submit", innerRef: lastElementRef, size: "s", children: "Apply" })
|
|
149
|
+
] })
|
|
150
|
+
] }) })
|
|
151
|
+
}
|
|
152
|
+
)
|
|
153
|
+
]
|
|
154
|
+
}
|
|
155
|
+
)
|
|
156
|
+
);
|
|
157
|
+
};
|
|
158
|
+
//# sourceMappingURL=FilterPopoverV2.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/exported-related/FilterPopover/FilterPopoverV2.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { DSButtonV3 } from '@elliemae/ds-button-v2';\n\nimport { useFloatingContext } from '@elliemae/ds-floating-context';\nimport { useFocusTrap } from '@elliemae/ds-hooks-focus-trap';\n\nimport { mergeRefs } from '@elliemae/ds-system';\nimport React, { useCallback, useEffect, useRef, useState } from 'react';\n\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { DATA_TABLE_DATA_TESTID } from '../../constants/index.js';\nimport type { FilterPopoverV2Props } from './types.js';\nimport { useGetFilterHandlers } from './useGetFilterHandlers.js';\nimport { useGetFilterVisibility } from './useGetFilterVisibility.js';\nimport { useOnClickOutside } from './useOnClickOutside.js';\nimport { FilterButton, PopperContent, StyledDSDialogFooter, StyledFloatingWrapper } from './styled.js';\n\nexport const FilterPopoverV2: React.ComponentType<FilterPopoverV2Props> = (props: FilterPopoverV2Props) => {\n const {\n column,\n customStyles,\n reduxHeader,\n menuContent,\n ariaLabel,\n triggerIcon,\n innerRef,\n columnReference,\n firstElementRef,\n onFilterSubmit,\n onFilterReset,\n } = props;\n\n const getOwnerProps = usePropsStore((store) => store.get);\n\n const getOwnerPropsArguments = useCallback(\n () => ({\n columnId: column.id,\n }),\n [column.id],\n );\n\n const [buttonReference, setButtonReference] = useState<HTMLButtonElement | null>(null);\n\n const [isButtonFocused, setIsButtonFocused] = useState(false);\n const { isIconVisible, isMenuOpen } = useGetFilterVisibility(reduxHeader);\n\n const { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur } =\n useGetFilterHandlers(props, isMenuOpen, buttonReference, setIsButtonFocused);\n\n const lastElementRef = useRef<HTMLButtonElement>(null);\n const boundaryRef = useRef<HTMLDivElement | null>(null);\n\n const {\n floatingStyles,\n isOpen: isFloatingOpen,\n refs,\n context,\n } = useFloatingContext({\n externallyControlledIsOpen: isMenuOpen,\n placement: 'bottom-end',\n withoutAnimation: true,\n customOffset: [0, 0],\n });\n\n useOnClickOutside(isMenuOpen ? refs.floating : null, handleClickOutsideMenu);\n const handleOnKeyDown = useFocusTrap({\n firstElementRef,\n lastElementRef,\n });\n\n useEffect(() => {\n if (columnReference) {\n refs.setReference(columnReference);\n }\n }, [columnReference, refs]);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <div\n // This is here to prevent propagation, and not trigger the sort functionality\n onClick={(e) => e.stopPropagation()}\n onKeyDown={handleMenuOnKeyDown}\n >\n <FilterButton\n hide={!isIconVisible}\n data-testid={DATA_TABLE_DATA_TESTID.FILTER_POPOVER_BUTTON}\n getOwnerProps={getOwnerProps}\n >\n <DSButtonV3\n buttonType=\"icon\"\n size=\"s\"\n onClick={handleTriggerClick}\n onKeyDown={handleMenuOnKeyDown}\n onFocus={handleTriggerOnFocus}\n onBlur={handleTriggerOnBlur}\n innerRef={mergeRefs(isIconVisible && setButtonReference, innerRef)}\n tabIndex={reduxHeader?.withTabStops ? 0 : -1}\n aria-label={ariaLabel}\n aria-hidden={!isButtonFocused}\n data-testid={DATA_TABLE_DATA_TESTID.DATA_TABLE_FILTER_BUTTON_ELEMENT}\n >\n {triggerIcon}\n </DSButtonV3>\n </FilterButton>\n {refs.reference && (\n <StyledFloatingWrapper\n innerRef={refs.setFloating}\n isOpen={isFloatingOpen}\n floatingStyles={{\n ...floatingStyles,\n ...customStyles,\n minWidth: 'min-content',\n }}\n context={context}\n data-testid={DATA_TABLE_DATA_TESTID.DATA_TABLE_FILTER_MENU_CONTENT}\n getOwnerProps={getOwnerProps}\n getOwnerPropsArguments={getOwnerPropsArguments}\n aria-label={`Filter by ${column.Header as string}`}\n role=\"dialog\"\n >\n <PopperContent getOwnerProps={getOwnerProps} onKeyDown={handleOnKeyDown} innerRef={boundaryRef}>\n <form onSubmit={onFilterSubmit}>\n {menuContent}\n <StyledDSDialogFooter>\n <DSButtonV3 onClick={onFilterReset} buttonType=\"outline\" size=\"s\">\n Reset\n </DSButtonV3>\n <DSButtonV3 type=\"submit\" innerRef={lastElementRef} size=\"s\">\n Apply\n </DSButtonV3>\n </StyledDSDialogFooter>\n </form>\n </PopperContent>\n </StyledFloatingWrapper>\n )}\n </div>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,62 @@
|
|
|
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 styled_exports = {};
|
|
30
|
+
__export(styled_exports, {
|
|
31
|
+
FilterButton: () => FilterButton,
|
|
32
|
+
PopperContent: () => PopperContent,
|
|
33
|
+
StyledDSDialogFooter: () => StyledDSDialogFooter,
|
|
34
|
+
StyledFloatingWrapper: () => StyledFloatingWrapper
|
|
35
|
+
});
|
|
36
|
+
module.exports = __toCommonJS(styled_exports);
|
|
37
|
+
var React = __toESM(require("react"));
|
|
38
|
+
var import_ds_system = require("@elliemae/ds-system");
|
|
39
|
+
var import_ds_dialog = require("@elliemae/ds-dialog");
|
|
40
|
+
var import_ds_floating_context = require("@elliemae/ds-floating-context");
|
|
41
|
+
var import_constants = require("../../constants/index.js");
|
|
42
|
+
const FilterButton = (0, import_ds_system.styled)("span", { name: import_constants.DSDataTableName, slot: import_constants.DSDataTableSlots.FILTER_POPOVER_BUTTON })`
|
|
43
|
+
display: inline-grid;
|
|
44
|
+
${(props) => props.hide ? "opacity: 0; display: none; width: 0;" : ""}
|
|
45
|
+
`;
|
|
46
|
+
const PopperContent = (0, import_ds_system.styled)("div", { name: import_constants.DSDataTableName, slot: import_constants.DSDataTableSlots.FILTER_POPOVER_CONTENT })`
|
|
47
|
+
background-color: #fff;
|
|
48
|
+
`;
|
|
49
|
+
const StyledFloatingWrapper = (0, import_ds_system.styled)(import_ds_floating_context.FloatingWrapper, {
|
|
50
|
+
name: import_constants.DSDataTableName,
|
|
51
|
+
slot: import_constants.DSDataTableSlots.FILTER_POPOVER
|
|
52
|
+
})``;
|
|
53
|
+
const StyledDSDialogFooter = (0, import_ds_system.styled)(import_ds_dialog.DSDialogFooter, {
|
|
54
|
+
name: import_constants.DSDataTableName,
|
|
55
|
+
slot: import_constants.DSDataTableSlots.FILTER_POPOVER_FOOTER
|
|
56
|
+
})`
|
|
57
|
+
display: flex;
|
|
58
|
+
flex-wrap: wrap;
|
|
59
|
+
padding-top: 8px;
|
|
60
|
+
padding-bottom: 8px;
|
|
61
|
+
`;
|
|
62
|
+
//# sourceMappingURL=styled.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/exported-related/FilterPopover/styled.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import { styled } from '@elliemae/ds-system';\nimport { DSDialogFooter } from '@elliemae/ds-dialog';\nimport { FloatingWrapper } from '@elliemae/ds-floating-context';\nimport { DSDataTableName, DSDataTableSlots } from '../../constants/index.js';\n\nexport const FilterButton = styled('span', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_BUTTON })<{\n hide: boolean;\n}>`\n display: inline-grid;\n ${(props) => (props.hide ? 'opacity: 0; display: none; width: 0;' : '')}\n`;\n\nexport const PopperContent = styled('div', { name: DSDataTableName, slot: DSDataTableSlots.FILTER_POPOVER_CONTENT })`\n background-color: #fff;\n`;\n\nexport const StyledFloatingWrapper = styled(FloatingWrapper, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FILTER_POPOVER,\n})``;\n\nexport const StyledDSDialogFooter = styled(DSDialogFooter, {\n name: DSDataTableName,\n slot: DSDataTableSlots.FILTER_POPOVER_FOOTER,\n})`\n display: flex;\n flex-wrap: wrap;\n padding-top: 8px;\n padding-bottom: 8px;\n`;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAuB;AACvB,uBAA+B;AAC/B,iCAAgC;AAChC,uBAAkD;AAE3C,MAAM,mBAAe,yBAAO,QAAQ,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,sBAAsB,CAAC;AAAA;AAAA,IAI9G,CAAC,UAAW,MAAM,OAAO,yCAAyC,EAAG;AAAA;AAGlE,MAAM,oBAAgB,yBAAO,OAAO,EAAE,MAAM,kCAAiB,MAAM,kCAAiB,uBAAuB,CAAC;AAAA;AAAA;AAI5G,MAAM,4BAAwB,yBAAO,4CAAiB;AAAA,EAC3D,MAAM;AAAA,EACN,MAAM,kCAAiB;AACzB,CAAC;AAEM,MAAM,2BAAuB,yBAAO,iCAAgB;AAAA,EACzD,MAAM;AAAA,EACN,MAAM,kCAAiB;AACzB,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/exported-related/FilterPopover/types.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import type React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport interface FilterPopoverProps {\n column: DSDataTableT.InternalColumn;\n columnId: string;\n columnReference?: HTMLElement | null;\n triggerIcon: JSX.Element;\n menuContent: JSX.Element;\n onTriggerClick?: (id: string, e: React.MouseEvent | React.KeyboardEvent) => void;\n onClickOutsideMenu?: (id: string) => void;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n ariaLabel: string;\n customStyles?: React.CSSProperties;\n firstElementRef: React.RefObject<HTMLElement>;\n lastElementRef: React.RefObject<HTMLElement>;\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["import type React from 'react';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nexport interface FilterPopoverProps {\n column: DSDataTableT.InternalColumn;\n columnId: string;\n columnReference?: HTMLElement | null;\n triggerIcon: JSX.Element;\n menuContent: JSX.Element;\n onTriggerClick?: (id: string, e: React.MouseEvent | React.KeyboardEvent) => void;\n onClickOutsideMenu?: (id: string) => void;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n ariaLabel: string;\n customStyles?: React.CSSProperties;\n firstElementRef: React.RefObject<HTMLElement>;\n lastElementRef: React.RefObject<HTMLElement>;\n}\n\nexport interface FilterPopoverV2Props {\n column: DSDataTableT.InternalColumn;\n columnId: string;\n columnReference?: HTMLElement | null;\n triggerIcon: JSX.Element;\n menuContent: JSX.Element;\n onTriggerClick?: (id: string, e: React.MouseEvent | React.KeyboardEvent) => void;\n onClickOutsideMenu?: (id: string) => void;\n reduxHeader: DSDataTableT.ReduxHeader;\n innerRef: React.MutableRefObject<HTMLButtonElement | null>;\n ariaLabel: string;\n customStyles?: React.CSSProperties;\n firstElementRef: React.RefObject<HTMLElement>;\n onFilterSubmit: (e: React.SyntheticEvent) => void;\n onFilterReset: () => void;\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;ACAA,YAAuB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/exported-related/FilterPopover/useGetFilterHandlers.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-params */\nimport type React from 'react';\nimport { useCallback, useEffect, useRef } from 'react';\nimport { useInternalStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { FilterPopoverProps } from './types.js';\n\nconst emptyFunc = () => null;\n\n// https://jira.elliemae.io/browse/PUI-12457\nconst useIframeClickCloseWorkaround = ({\n columnId,\n isMenuOpen,\n}: {\n columnId: FilterPopoverProps['columnId'];\n isMenuOpen: boolean;\n}) => {\n // due to how browser handle events when iframes are involved we can only listen to window \"blur\" event to understand if the user clicked on any iframe\n // out of the box the filter are supposed to close when the user clicks outside of the filter contextual region\n // this helper ensure that the filter will close even if the user clicks on an iframe.\n // since we must do vanilla javascript we need to handle this with extreme care and ensure we optimize as much as possible.\n // we want to attach/detach the event listener only when the filter is open and we want to detach it as soon as the filter is closed.\n // this is to ensure that no matter how many columns have filter functionality we only pay the performance cost for the filter that would do anything with it.\n const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n\n // we only care to invoke the latest version of patchHeaderFilterButtonAndMenu\n // we do not need to reattach the event listener if pathHeaderFilterButtonAndMenu changes\n // event attachment/detachment is more expensive than a simple ref update performance wise.\n const patchRef = useRef(patchHeaderFilterButtonAndMenu);\n useEffect(() => {\n patchRef.current = patchHeaderFilterButtonAndMenu;\n }, [patchHeaderFilterButtonAndMenu]);\n\n // extremely optimized event listener attachment/detachment\n // we run this side effect strictly when required to ensure the best performance possible.\n // it's strictly required when:\n // - the filter is open ( so clicking an iframe will close it )\n // - the columnId changes ( so we close the correct filter )\n // if patchHeaderFilterButtonAndMenu changes we do not care to reattach the event listener\n // as long as the .current ref is updated in time before the close event is triggered.\n // which is guaranteed by:\n // - the fact that we update the ref in the useEffect above\n // - the fact that we invoke patchRef.current as a consquence of the user \"clicking\" on the filter button (which happens after the previous useEffect)\n useEffect(() => {\n // we declare the function locally in the closure to ensure we can detach it later\n // useEffect is run after render, useCallBack is run before render,\n // which means that using useCallback here could potentially cause a memory-leak/dangling reference/attached event listener that is never detached\n const handleBlur = () => {\n patchRef.current(columnId, true);\n };\n\n if (isMenuOpen) window.addEventListener('blur', handleBlur);\n else window.removeEventListener('blur', handleBlur);\n\n return () => {\n window.removeEventListener('blur', handleBlur);\n };\n }, [columnId, isMenuOpen]);\n};\n\nexport const useGetFilterHandlers = (\n props: FilterPopoverProps,\n isMenuOpen: boolean,\n buttonReference: HTMLButtonElement | null,\n setIsButtonFocused: React.Dispatch<React.SetStateAction<boolean>>,\n) => {\n const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;\n useIframeClickCloseWorkaround({ columnId, isMenuOpen });\n\n const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n const patchHeader = useInternalStore((state) => state.patchHeader);\n\n const handleTriggerClick = useCallback(\n (e: React.MouseEvent | React.KeyboardEvent) => {\n onTriggerClick(columnId, e);\n patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n e.stopPropagation();\n },\n [columnId, isMenuOpen, onTriggerClick, patchHeader],\n );\n\n const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);\n const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);\n\n const handleClickOutsideMenu = useCallback(() => {\n onClickOutsideMenu(columnId);\n if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n }, [columnId, isMenuOpen, onClickOutsideMenu, patchHeaderFilterButtonAndMenu]);\n\n const handleMenuOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n e.stopPropagation();\n if (e.code === 'Escape') {\n patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, showSortCaret: true });\n buttonReference?.focus();\n }\n // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n // so we just prevent default behaviour in this case\n if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n e.preventDefault();\n }\n },\n [buttonReference, columnId, patchHeader],\n );\n\n return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
4
|
+
"sourcesContent": ["/* eslint-disable max-params */\nimport type React from 'react';\nimport { useCallback, useEffect, useRef } from 'react';\nimport { useInternalStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport type { FilterPopoverProps, FilterPopoverV2Props } from './types.js';\n\nconst emptyFunc = () => null;\n\n// https://jira.elliemae.io/browse/PUI-12457\nconst useIframeClickCloseWorkaround = ({\n columnId,\n isMenuOpen,\n}: {\n columnId: FilterPopoverProps['columnId'];\n isMenuOpen: boolean;\n}) => {\n // due to how browser handle events when iframes are involved we can only listen to window \"blur\" event to understand if the user clicked on any iframe\n // out of the box the filter are supposed to close when the user clicks outside of the filter contextual region\n // this helper ensure that the filter will close even if the user clicks on an iframe.\n // since we must do vanilla javascript we need to handle this with extreme care and ensure we optimize as much as possible.\n // we want to attach/detach the event listener only when the filter is open and we want to detach it as soon as the filter is closed.\n // this is to ensure that no matter how many columns have filter functionality we only pay the performance cost for the filter that would do anything with it.\n const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n\n // we only care to invoke the latest version of patchHeaderFilterButtonAndMenu\n // we do not need to reattach the event listener if pathHeaderFilterButtonAndMenu changes\n // event attachment/detachment is more expensive than a simple ref update performance wise.\n const patchRef = useRef(patchHeaderFilterButtonAndMenu);\n useEffect(() => {\n patchRef.current = patchHeaderFilterButtonAndMenu;\n }, [patchHeaderFilterButtonAndMenu]);\n\n // extremely optimized event listener attachment/detachment\n // we run this side effect strictly when required to ensure the best performance possible.\n // it's strictly required when:\n // - the filter is open ( so clicking an iframe will close it )\n // - the columnId changes ( so we close the correct filter )\n // if patchHeaderFilterButtonAndMenu changes we do not care to reattach the event listener\n // as long as the .current ref is updated in time before the close event is triggered.\n // which is guaranteed by:\n // - the fact that we update the ref in the useEffect above\n // - the fact that we invoke patchRef.current as a consquence of the user \"clicking\" on the filter button (which happens after the previous useEffect)\n useEffect(() => {\n // we declare the function locally in the closure to ensure we can detach it later\n // useEffect is run after render, useCallBack is run before render,\n // which means that using useCallback here could potentially cause a memory-leak/dangling reference/attached event listener that is never detached\n const handleBlur = () => {\n patchRef.current(columnId, true);\n };\n\n if (isMenuOpen) window.addEventListener('blur', handleBlur);\n else window.removeEventListener('blur', handleBlur);\n\n return () => {\n window.removeEventListener('blur', handleBlur);\n };\n }, [columnId, isMenuOpen]);\n};\n\nexport const useGetFilterHandlers = (\n props: FilterPopoverProps | FilterPopoverV2Props,\n isMenuOpen: boolean,\n buttonReference: HTMLButtonElement | null,\n setIsButtonFocused: React.Dispatch<React.SetStateAction<boolean>>,\n) => {\n const { columnId, onTriggerClick = emptyFunc, onClickOutsideMenu = emptyFunc } = props;\n useIframeClickCloseWorkaround({ columnId, isMenuOpen });\n\n const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n const patchHeader = useInternalStore((state) => state.patchHeader);\n\n const handleTriggerClick = useCallback(\n (e: React.MouseEvent | React.KeyboardEvent) => {\n onTriggerClick(columnId, e);\n patchHeader(columnId, { hideFilterMenu: isMenuOpen, hideFilterButton: false });\n e.stopPropagation();\n },\n [columnId, isMenuOpen, onTriggerClick, patchHeader],\n );\n\n const handleTriggerOnFocus = useCallback(() => setIsButtonFocused(true), [setIsButtonFocused]);\n const handleTriggerOnBlur = useCallback(() => setIsButtonFocused(false), [setIsButtonFocused]);\n\n const handleClickOutsideMenu = useCallback(() => {\n onClickOutsideMenu(columnId);\n if (isMenuOpen) patchHeaderFilterButtonAndMenu(columnId, true);\n }, [columnId, isMenuOpen, onClickOutsideMenu, patchHeaderFilterButtonAndMenu]);\n\n const handleMenuOnKeyDown = useCallback(\n (e: React.KeyboardEvent) => {\n e.stopPropagation();\n if (e.code === 'Escape') {\n patchHeader(columnId, { hideFilterMenu: true, hideFilterButton: false, showSortCaret: true });\n buttonReference?.focus();\n }\n // Stop propagation for some reason is not enough to prevent scrolling of the datatable\n // so we just prevent default behaviour in this case\n if (['ArrowUp', 'ArrowDown'].includes(e.code)) {\n e.preventDefault();\n }\n },\n [buttonReference, columnId, patchHeader],\n );\n\n return { handleTriggerClick, handleClickOutsideMenu, handleMenuOnKeyDown, handleTriggerOnFocus, handleTriggerOnBlur };\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
5
|
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,mBAA+C;AAC/C,2CAAiC;AAGjC,MAAM,YAAY,MAAM;AAGxB,MAAM,gCAAgC,CAAC;AAAA,EACrC;AAAA,EACA;AACF,MAGM;AAOJ,QAAM,qCAAiC,uDAAiB,CAAC,UAAU,MAAM,8BAA8B;AAKvG,QAAM,eAAW,qBAAO,8BAA8B;AACtD,8BAAU,MAAM;AACd,aAAS,UAAU;AAAA,EACrB,GAAG,CAAC,8BAA8B,CAAC;AAYnC,8BAAU,MAAM;AAId,UAAM,aAAa,MAAM;AACvB,eAAS,QAAQ,UAAU,IAAI;AAAA,IACjC;AAEA,QAAI,WAAY,QAAO,iBAAiB,QAAQ,UAAU;AAAA,QACrD,QAAO,oBAAoB,QAAQ,UAAU;AAElD,WAAO,MAAM;AACX,aAAO,oBAAoB,QAAQ,UAAU;AAAA,IAC/C;AAAA,EACF,GAAG,CAAC,UAAU,UAAU,CAAC;AAC3B;AAEO,MAAM,uBAAuB,CAClC,OACA,YACA,iBACA,uBACG;AACH,QAAM,EAAE,UAAU,iBAAiB,WAAW,qBAAqB,UAAU,IAAI;AACjF,gCAA8B,EAAE,UAAU,WAAW,CAAC;AAEtD,QAAM,qCAAiC,uDAAiB,CAAC,UAAU,MAAM,8BAA8B;AACvG,QAAM,kBAAc,uDAAiB,CAAC,UAAU,MAAM,WAAW;AAEjE,QAAM,yBAAqB;AAAA,IACzB,CAAC,MAA8C;AAC7C,qBAAe,UAAU,CAAC;AAC1B,kBAAY,UAAU,EAAE,gBAAgB,YAAY,kBAAkB,MAAM,CAAC;AAC7E,QAAE,gBAAgB;AAAA,IACpB;AAAA,IACA,CAAC,UAAU,YAAY,gBAAgB,WAAW;AAAA,EACpD;AAEA,QAAM,2BAAuB,0BAAY,MAAM,mBAAmB,IAAI,GAAG,CAAC,kBAAkB,CAAC;AAC7F,QAAM,0BAAsB,0BAAY,MAAM,mBAAmB,KAAK,GAAG,CAAC,kBAAkB,CAAC;AAE7F,QAAM,6BAAyB,0BAAY,MAAM;AAC/C,uBAAmB,QAAQ;AAC3B,QAAI,WAAY,gCAA+B,UAAU,IAAI;AAAA,EAC/D,GAAG,CAAC,UAAU,YAAY,oBAAoB,8BAA8B,CAAC;AAE7E,QAAM,0BAAsB;AAAA,IAC1B,CAAC,MAA2B;AAC1B,QAAE,gBAAgB;AAClB,UAAI,EAAE,SAAS,UAAU;AACvB,oBAAY,UAAU,EAAE,gBAAgB,MAAM,kBAAkB,OAAO,eAAe,KAAK,CAAC;AAC5F,yBAAiB,MAAM;AAAA,MACzB;AAGA,UAAI,CAAC,WAAW,WAAW,EAAE,SAAS,EAAE,IAAI,GAAG;AAC7C,UAAE,eAAe;AAAA,MACnB;AAAA,IACF;AAAA,IACA,CAAC,iBAAiB,UAAU,WAAW;AAAA,EACzC;AAEA,SAAO,EAAE,oBAAoB,wBAAwB,qBAAqB,sBAAsB,oBAAoB;AACtH;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -0,0 +1,60 @@
|
|
|
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 useOnClickOutside_exports = {};
|
|
30
|
+
__export(useOnClickOutside_exports, {
|
|
31
|
+
useOnClickOutside: () => useOnClickOutside
|
|
32
|
+
});
|
|
33
|
+
module.exports = __toCommonJS(useOnClickOutside_exports);
|
|
34
|
+
var React = __toESM(require("react"));
|
|
35
|
+
var import_react = __toESM(require("react"));
|
|
36
|
+
function useOnClickOutside(ref, cb) {
|
|
37
|
+
const cbRef = import_react.default.useRef(cb);
|
|
38
|
+
(0, import_react.useEffect)(() => {
|
|
39
|
+
cbRef.current = cb;
|
|
40
|
+
}, [cb]);
|
|
41
|
+
(0, import_react.useEffect)(() => {
|
|
42
|
+
if (!ref) {
|
|
43
|
+
return () => {
|
|
44
|
+
};
|
|
45
|
+
}
|
|
46
|
+
const listener = (event) => {
|
|
47
|
+
const target = event.target;
|
|
48
|
+
if (!target) return;
|
|
49
|
+
if (ref.contains(target)) return;
|
|
50
|
+
cbRef.current(event);
|
|
51
|
+
};
|
|
52
|
+
document.addEventListener("mousedown", listener, true);
|
|
53
|
+
document.addEventListener("touchstart", listener, true);
|
|
54
|
+
return () => {
|
|
55
|
+
document.removeEventListener("mousedown", listener, true);
|
|
56
|
+
document.removeEventListener("touchstart", listener, true);
|
|
57
|
+
};
|
|
58
|
+
}, [ref]);
|
|
59
|
+
}
|
|
60
|
+
//# sourceMappingURL=useOnClickOutside.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/exported-related/FilterPopover/useOnClickOutside.ts", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
+
"sourcesContent": ["import React, { useEffect } from 'react';\n\nexport function useOnClickOutside<T extends Node>(ref: T | null, cb: (event: Event) => void): void {\n const cbRef = React.useRef(cb);\n\n useEffect(() => {\n cbRef.current = cb;\n }, [cb]);\n\n useEffect(() => {\n if (!ref) {\n return () => {};\n }\n\n const listener = (event: MouseEvent | TouchEvent) => {\n const target = event.target as Node | null;\n if (!target) return;\n\n if (ref.contains(target)) return;\n\n cbRef.current(event);\n };\n\n document.addEventListener('mousedown', listener, true);\n document.addEventListener('touchstart', listener, true);\n\n return () => {\n document.removeEventListener('mousedown', listener, true);\n document.removeEventListener('touchstart', listener, true);\n };\n }, [ref]);\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAiC;AAE1B,SAAS,kBAAkC,KAAe,IAAkC;AACjG,QAAM,QAAQ,aAAAA,QAAM,OAAO,EAAE;AAE7B,8BAAU,MAAM;AACd,UAAM,UAAU;AAAA,EAClB,GAAG,CAAC,EAAE,CAAC;AAEP,8BAAU,MAAM;AACd,QAAI,CAAC,KAAK;AACR,aAAO,MAAM;AAAA,MAAC;AAAA,IAChB;AAEA,UAAM,WAAW,CAAC,UAAmC;AACnD,YAAM,SAAS,MAAM;AACrB,UAAI,CAAC,OAAQ;AAEb,UAAI,IAAI,SAAS,MAAM,EAAG;AAE1B,YAAM,QAAQ,KAAK;AAAA,IACrB;AAEA,aAAS,iBAAiB,aAAa,UAAU,IAAI;AACrD,aAAS,iBAAiB,cAAc,UAAU,IAAI;AAEtD,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa,UAAU,IAAI;AACxD,eAAS,oBAAoB,cAAc,UAAU,IAAI;AAAA,IAC3D;AAAA,EACF,GAAG,CAAC,GAAG,CAAC;AACV;",
|
|
6
|
+
"names": ["React"]
|
|
7
|
+
}
|
|
@@ -34,14 +34,24 @@ module.exports = __toCommonJS(FilterTypes_exports);
|
|
|
34
34
|
var React = __toESM(require("react"));
|
|
35
35
|
const FILTER_TYPES = {
|
|
36
36
|
SELECT: "ds-filter-select",
|
|
37
|
+
SELECT_V2: "ds-filter-select-v2",
|
|
37
38
|
CREATABLE_SELECT: "ds-filter-creatable-select",
|
|
39
|
+
CREATABLE_SELECT_V2: "ds-filter-creatable-select-v2",
|
|
38
40
|
MULTI_SELECT: "ds-filter-multi-select",
|
|
41
|
+
MULTI_SELECT_V2: "ds-filter-multi-select-v2",
|
|
39
42
|
CREATABLE_MULTI_SELECT: "ds-filter-multi-creatable-select",
|
|
43
|
+
CREATABLE_MULTI_SELECT_V2: "ds-filter-multi-creatable-select-v2",
|
|
40
44
|
SINGLE_DATE: "ds-filter-single-date",
|
|
45
|
+
SINGLE_DATE_V2: "ds-filter-single-date-v2",
|
|
41
46
|
DATE_RANGE: "ds-filter-date-range",
|
|
47
|
+
DATE_RANGE_V2: "ds-filter-date-range-v2",
|
|
42
48
|
DATE_SWITCHER: "ds-filter-date-switcher",
|
|
49
|
+
DATE_SWITCHER_V2: "ds-filter-date-switcher-v2",
|
|
43
50
|
NUMBER_RANGE: "ds-filter-number-range",
|
|
51
|
+
NUMBER_RANGE_V2: "ds-filter-number-range-v2",
|
|
44
52
|
CURRENCY_RANGE: "ds-filter-currency-range",
|
|
45
|
-
|
|
53
|
+
CURRENCY_RANGE_V2: "ds-filter-currency-range-v2",
|
|
54
|
+
FREE_TEXT_SEARCH: "ds-filter-free-text-search",
|
|
55
|
+
FREE_TEXT_SEARCH_V2: "ds-filter-free-text-search-v2"
|
|
46
56
|
};
|
|
47
57
|
//# 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 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;
|
|
4
|
+
"sourcesContent": ["export const FILTER_TYPES = {\n SELECT: 'ds-filter-select',\n SELECT_V2: 'ds-filter-select-v2',\n CREATABLE_SELECT: 'ds-filter-creatable-select',\n CREATABLE_SELECT_V2: 'ds-filter-creatable-select-v2',\n MULTI_SELECT: 'ds-filter-multi-select',\n MULTI_SELECT_V2: 'ds-filter-multi-select-v2',\n CREATABLE_MULTI_SELECT: 'ds-filter-multi-creatable-select',\n CREATABLE_MULTI_SELECT_V2: 'ds-filter-multi-creatable-select-v2',\n SINGLE_DATE: 'ds-filter-single-date',\n SINGLE_DATE_V2: 'ds-filter-single-date-v2',\n DATE_RANGE: 'ds-filter-date-range',\n DATE_RANGE_V2: 'ds-filter-date-range-v2',\n DATE_SWITCHER: 'ds-filter-date-switcher',\n DATE_SWITCHER_V2: 'ds-filter-date-switcher-v2',\n NUMBER_RANGE: 'ds-filter-number-range',\n NUMBER_RANGE_V2: 'ds-filter-number-range-v2',\n CURRENCY_RANGE: 'ds-filter-currency-range',\n CURRENCY_RANGE_V2: 'ds-filter-currency-range-v2',\n FREE_TEXT_SEARCH: 'ds-filter-free-text-search',\n FREE_TEXT_SEARCH_V2: 'ds-filter-free-text-search-v2',\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,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,wBAAwB;AAAA,EACxB,2BAA2B;AAAA,EAC3B,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,eAAe;AAAA,EACf,kBAAkB;AAAA,EAClB,cAAc;AAAA,EACd,iBAAiB;AAAA,EACjB,gBAAgB;AAAA,EAChB,mBAAmB;AAAA,EACnB,kBAAkB;AAAA,EAClB,qBAAqB;AACvB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -41,13 +41,21 @@ var import_DeprecatedDropdown = require("./DeprecatedDropdown.js");
|
|
|
41
41
|
var import_createInternalAndPropsContext = require("../../configs/useStore/createInternalAndPropsContext.js");
|
|
42
42
|
const pillRenderMapper = {
|
|
43
43
|
[import_exported_related.FILTER_TYPES.SELECT]: import_components.SelectPill,
|
|
44
|
+
[import_exported_related.FILTER_TYPES.SELECT_V2]: import_components.SelectPill,
|
|
44
45
|
[import_exported_related.FILTER_TYPES.MULTI_SELECT]: import_components.MultiSelectPill,
|
|
46
|
+
[import_exported_related.FILTER_TYPES.MULTI_SELECT_V2]: import_components.MultiSelectPill,
|
|
45
47
|
[import_exported_related.FILTER_TYPES.SINGLE_DATE]: import_components.SingleDatePill,
|
|
48
|
+
[import_exported_related.FILTER_TYPES.SINGLE_DATE_V2]: import_components.SingleDatePill,
|
|
46
49
|
[import_exported_related.FILTER_TYPES.DATE_RANGE]: import_components.DateRangePill,
|
|
50
|
+
[import_exported_related.FILTER_TYPES.DATE_RANGE_V2]: import_components.DateRangePill,
|
|
47
51
|
[import_exported_related.FILTER_TYPES.DATE_SWITCHER]: import_components.DateSwitcherPill,
|
|
52
|
+
[import_exported_related.FILTER_TYPES.DATE_SWITCHER_V2]: import_components.DateSwitcherPill,
|
|
48
53
|
[import_exported_related.FILTER_TYPES.NUMBER_RANGE]: import_components.NumberRangePill,
|
|
54
|
+
[import_exported_related.FILTER_TYPES.NUMBER_RANGE_V2]: import_components.NumberRangePill,
|
|
49
55
|
[import_exported_related.FILTER_TYPES.CURRENCY_RANGE]: import_components.NumberRangePill,
|
|
50
|
-
[import_exported_related.FILTER_TYPES.
|
|
56
|
+
[import_exported_related.FILTER_TYPES.CURRENCY_RANGE_V2]: import_components.NumberRangePill,
|
|
57
|
+
[import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH]: import_components.FreeTextSearchPillPill,
|
|
58
|
+
[import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH_V2]: import_components.FreeTextSearchPillPill
|
|
51
59
|
};
|
|
52
60
|
const FiltersBar = () => {
|
|
53
61
|
const width = (0, import_createInternalAndPropsContext.usePropsStore)((state) => state.width);
|
|
@@ -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, useMemo, useRef, useState } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { FILTER_TYPES } from '../../exported-related/index.js';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n FreeTextSearchPillPill,\n} from './components/index.js';\nimport { StyledWrapper } from './styled.js';\nimport { DeprecatedDropdown } from './DeprecatedDropdown.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\n\nconst pillRenderMapper = {\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 [FILTER_TYPES.FREE_TEXT_SEARCH]: FreeTextSearchPillPill,\n} as const;\n\nexport const FiltersBar: React.ComponentType = () => {\n const width = usePropsStore((state) => state.width);\n const filterBarProps = usePropsStore((state) => state.filterBarProps);\n const onFiltersChange = usePropsStore((state) => state.onFiltersChange);\n const filters = usePropsStore((state) => state.filters);\n const visibleColumns = usePropsStore((state) => state.visibleColumns);\n const getOwnerProps = usePropsStore((store) => store.get);\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<HTMLButtonElement | null>(null);\n\n const {\n filterBarAddonRenderer: FilterBarAddonRenderer,\n onClearAllFiltersClick,\n onDropdownMenuToggle,\n onDropdownMenuClickOutside,\n onDropdownMenuTriggerClick,\n isDropdownMenuOpen,\n } = filterBarProps || {};\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n onClearAllFiltersClick?.();\n setIsOpen(false);\n }, [onFiltersChange, onClearAllFiltersClick]);\n\n const onFilterBarClose = useCallback(() => {\n onDropdownMenuToggle?.(false, 'onClose');\n dropdownMenuRef.current?.focus();\n setIsOpen(false);\n }, [onDropdownMenuToggle]);\n\n const onFilterBarOpen = useCallback(() => {\n onDropdownMenuToggle?.(true, 'onOpen');\n setIsOpen(true);\n }, [onDropdownMenuToggle]);\n\n const onFilterBarOnClickOutside = useCallback(() => {\n onDropdownMenuToggle?.(false, 'onClickOutside');\n onDropdownMenuClickOutside?.();\n setIsOpen(false);\n }, [onDropdownMenuClickOutside, onDropdownMenuToggle]);\n\n const onTriggerClick = useCallback(() => {\n onDropdownMenuTriggerClick?.();\n onFilterBarOpen();\n }, [onDropdownMenuTriggerClick, onFilterBarOpen]);\n\n const finalIsOpen = useMemo(() => {\n if (typeof isDropdownMenuOpen === 'boolean') return isDropdownMenuOpen;\n return isOpen;\n }, [isDropdownMenuOpen, isOpen]);\n\n return (\n <StyledWrapper\n width={width}\n aria-live=\"polite\"\n aria-relevant=\"additions removals\"\n gutter=\"xs\"\n getOwnerProps={getOwnerProps}\n >\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component:\n | TypescriptHelpersT.ObjectValues<typeof pillRenderMapper>\n | React.ComponentType<DSDataTableT.FilterPillProps<unknown>> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType as keyof typeof pillRenderMapper];\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment\n value={value as any}\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 <DeprecatedDropdown\n finalIsOpen={finalIsOpen}\n onFilterBarClose={onFilterBarClose}\n onFilterBarOnClickOutside={onFilterBarOnClickOutside}\n removeAllFilters={removeAllFilters}\n filterBarProps={filterBarProps}\n dropdownMenuRef={dropdownMenuRef}\n onTriggerClick={onTriggerClick}\n />\n )}\n </StyledWrapper>\n );\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import React, { useCallback, useMemo, useRef, useState } from 'react';\nimport { type TypescriptHelpersT } from '@elliemae/ds-typescript-helpers';\nimport { FILTER_TYPES } from '../../exported-related/index.js';\nimport {\n SelectPill,\n MultiSelectPill,\n SingleDatePill,\n DateRangePill,\n NumberRangePill,\n DateSwitcherPill,\n FreeTextSearchPillPill,\n} from './components/index.js';\nimport { StyledWrapper } from './styled.js';\nimport { DeprecatedDropdown } from './DeprecatedDropdown.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\nimport { usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\n\nconst pillRenderMapper = {\n [FILTER_TYPES.SELECT]: SelectPill,\n [FILTER_TYPES.SELECT_V2]: SelectPill,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectPill,\n [FILTER_TYPES.MULTI_SELECT_V2]: MultiSelectPill,\n [FILTER_TYPES.SINGLE_DATE]: SingleDatePill,\n [FILTER_TYPES.SINGLE_DATE_V2]: SingleDatePill,\n [FILTER_TYPES.DATE_RANGE]: DateRangePill,\n [FILTER_TYPES.DATE_RANGE_V2]: DateRangePill,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherPill,\n [FILTER_TYPES.DATE_SWITCHER_V2]: DateSwitcherPill,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangePill,\n [FILTER_TYPES.NUMBER_RANGE_V2]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE]: NumberRangePill,\n [FILTER_TYPES.CURRENCY_RANGE_V2]: NumberRangePill,\n [FILTER_TYPES.FREE_TEXT_SEARCH]: FreeTextSearchPillPill,\n [FILTER_TYPES.FREE_TEXT_SEARCH_V2]: FreeTextSearchPillPill,\n} as const;\n\nexport const FiltersBar: React.ComponentType = () => {\n const width = usePropsStore((state) => state.width);\n const filterBarProps = usePropsStore((state) => state.filterBarProps);\n const onFiltersChange = usePropsStore((state) => state.onFiltersChange);\n const filters = usePropsStore((state) => state.filters);\n const visibleColumns = usePropsStore((state) => state.visibleColumns);\n const getOwnerProps = usePropsStore((store) => store.get);\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<HTMLButtonElement | null>(null);\n\n const {\n filterBarAddonRenderer: FilterBarAddonRenderer,\n onClearAllFiltersClick,\n onDropdownMenuToggle,\n onDropdownMenuClickOutside,\n onDropdownMenuTriggerClick,\n isDropdownMenuOpen,\n } = filterBarProps || {};\n\n const removeAllFilters = useCallback(() => {\n onFiltersChange([]);\n onClearAllFiltersClick?.();\n setIsOpen(false);\n }, [onFiltersChange, onClearAllFiltersClick]);\n\n const onFilterBarClose = useCallback(() => {\n onDropdownMenuToggle?.(false, 'onClose');\n dropdownMenuRef.current?.focus();\n setIsOpen(false);\n }, [onDropdownMenuToggle]);\n\n const onFilterBarOpen = useCallback(() => {\n onDropdownMenuToggle?.(true, 'onOpen');\n setIsOpen(true);\n }, [onDropdownMenuToggle]);\n\n const onFilterBarOnClickOutside = useCallback(() => {\n onDropdownMenuToggle?.(false, 'onClickOutside');\n onDropdownMenuClickOutside?.();\n setIsOpen(false);\n }, [onDropdownMenuClickOutside, onDropdownMenuToggle]);\n\n const onTriggerClick = useCallback(() => {\n onDropdownMenuTriggerClick?.();\n onFilterBarOpen();\n }, [onDropdownMenuTriggerClick, onFilterBarOpen]);\n\n const finalIsOpen = useMemo(() => {\n if (typeof isDropdownMenuOpen === 'boolean') return isDropdownMenuOpen;\n return isOpen;\n }, [isDropdownMenuOpen, isOpen]);\n\n return (\n <StyledWrapper\n width={width}\n aria-live=\"polite\"\n aria-relevant=\"additions removals\"\n gutter=\"xs\"\n getOwnerProps={getOwnerProps}\n >\n {filters.map(({ id: column, type, value }, index) => {\n const columnHeader = visibleColumns.find((col) => col.accessor === column)?.Header;\n let Component:\n | TypescriptHelpersT.ObjectValues<typeof pillRenderMapper>\n | React.ComponentType<DSDataTableT.FilterPillProps<unknown>> = () => null;\n\n const filterType = type;\n if (filterType in pillRenderMapper) {\n Component = pillRenderMapper[filterType as keyof typeof pillRenderMapper];\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 // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unsafe-assignment\n value={value as any}\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 <DeprecatedDropdown\n finalIsOpen={finalIsOpen}\n onFilterBarClose={onFilterBarClose}\n onFilterBarOnClickOutside={onFilterBarOnClickOutside}\n removeAllFilters={removeAllFilters}\n filterBarProps={filterBarProps}\n dropdownMenuRef={dropdownMenuRef}\n onTriggerClick={onTriggerClick}\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
|
}
|
|
@@ -40,15 +40,25 @@ var import_createInternalAndPropsContext = require("../../configs/useStore/creat
|
|
|
40
40
|
var import_exported_related = require("../../exported-related/index.js");
|
|
41
41
|
const FilterMapper = {
|
|
42
42
|
[import_exported_related.FILTER_TYPES.SELECT]: import_Filters.SingleSelectFilter,
|
|
43
|
+
[import_exported_related.FILTER_TYPES.SELECT_V2]: import_Filters.SingleSelectFilterV2,
|
|
43
44
|
[import_exported_related.FILTER_TYPES.CREATABLE_SELECT]: import_Filters.SingleCreatableFilter,
|
|
45
|
+
[import_exported_related.FILTER_TYPES.CREATABLE_SELECT_V2]: import_Filters.SingleCreatableFilterV2,
|
|
44
46
|
[import_exported_related.FILTER_TYPES.MULTI_SELECT]: import_Filters.MultiSelectFilter,
|
|
47
|
+
[import_exported_related.FILTER_TYPES.MULTI_SELECT_V2]: import_Filters.MultiSelectFilterV2,
|
|
45
48
|
[import_exported_related.FILTER_TYPES.CREATABLE_MULTI_SELECT]: import_Filters.MultiCreatableFilter,
|
|
49
|
+
[import_exported_related.FILTER_TYPES.CREATABLE_MULTI_SELECT_V2]: import_Filters.MultiCreatableFilterV2,
|
|
46
50
|
[import_exported_related.FILTER_TYPES.SINGLE_DATE]: import_Filters.SingleDateFilter,
|
|
51
|
+
[import_exported_related.FILTER_TYPES.SINGLE_DATE_V2]: import_Filters.SingleDateFilterV2,
|
|
47
52
|
[import_exported_related.FILTER_TYPES.DATE_RANGE]: import_Filters.DateRangeFilter,
|
|
53
|
+
[import_exported_related.FILTER_TYPES.DATE_RANGE_V2]: import_Filters.DateRangeFilterV2,
|
|
48
54
|
[import_exported_related.FILTER_TYPES.DATE_SWITCHER]: import_Filters.DateSwitcherFilter,
|
|
55
|
+
[import_exported_related.FILTER_TYPES.DATE_SWITCHER_V2]: import_Filters.DateSwitcherFilterV2,
|
|
49
56
|
[import_exported_related.FILTER_TYPES.NUMBER_RANGE]: import_Filters.NumberRangeFilter,
|
|
57
|
+
[import_exported_related.FILTER_TYPES.NUMBER_RANGE_V2]: import_Filters.NumberRangeFilterV2,
|
|
50
58
|
[import_exported_related.FILTER_TYPES.CURRENCY_RANGE]: import_Filters.CurrencyRangeFilter,
|
|
51
|
-
[import_exported_related.FILTER_TYPES.
|
|
59
|
+
[import_exported_related.FILTER_TYPES.CURRENCY_RANGE_V2]: import_Filters.CurrencyRangeFilterV2,
|
|
60
|
+
[import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH]: import_Filters.FreeTextSearchFilter,
|
|
61
|
+
[import_exported_related.FILTER_TYPES.FREE_TEXT_SEARCH_V2]: import_Filters.FreeTextSearchFilterV2
|
|
52
62
|
};
|
|
53
63
|
const FilterMapItem = (props) => {
|
|
54
64
|
const { column, filters, onFiltersChange } = props;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/parts/Filters/index.tsx", "../../../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["import { cloneDeep } from 'lodash-es';\nimport React, { useCallback, useMemo } from 'react';\nimport {\n CurrencyRangeFilter,\n DateRangeFilter,\n DateSwitcherFilter,\n MultiCreatableFilter,\n MultiSelectFilter,\n NumberRangeFilter,\n SingleCreatableFilter,\n SingleDateFilter,\n SingleSelectFilter,\n FreeTextSearchFilter,\n} from '../../addons/Filters/index.js';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { FILTER_TYPES } from '../../exported-related/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst FilterMapper = {\n [FILTER_TYPES.SELECT]: SingleSelectFilter,\n [FILTER_TYPES.CREATABLE_SELECT]: SingleCreatableFilter,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectFilter,\n [FILTER_TYPES.CREATABLE_MULTI_SELECT]: MultiCreatableFilter,\n [FILTER_TYPES.SINGLE_DATE]: SingleDateFilter,\n [FILTER_TYPES.DATE_RANGE]: DateRangeFilter,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherFilter,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangeFilter,\n [FILTER_TYPES.CURRENCY_RANGE]: CurrencyRangeFilter,\n [FILTER_TYPES.FREE_TEXT_SEARCH]: FreeTextSearchFilter,\n} as const;\n\nexport const FilterMapItem: React.ComponentType<DSDataTableT.FilterItemProps> = (props) => {\n const { column, filters, onFiltersChange } = props;\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n const patchHeader = useInternalStore((state) => state.patchHeader);\n\n const filterValue = useMemo(() => filters.find((filter) => filter.id === column.id), [column.id, filters]);\n\n const onValueChange = useCallback(\n (type: string, newValue: unknown) => {\n const filterIndex = filters.findIndex((filter) => filter.id === column.id);\n if (newValue === undefined) {\n const newFilters = filters.filter((filter) => filter.id !== column.id);\n onFiltersChange(newFilters);\n } else if (filterIndex === -1) {\n onFiltersChange([...cloneDeep(filters), { id: column.id, type, value: newValue }]);\n } else {\n const newFilters = cloneDeep(filters);\n newFilters[filterIndex].type = type;\n newFilters[filterIndex].value = newValue;\n onFiltersChange(newFilters);\n }\n },\n [column.id, filters, onFiltersChange],\n );\n\n const filterProps = {\n ...props,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any\n filterValue: filterValue?.value as any,\n onValueChange,\n patchHeader,\n patchHeaderFilterButtonAndMenu,\n domIdAffix,\n };\n\n if (typeof column.filter === 'string') {\n if (!(column.filter in FilterMapper)) {\n throw new Error(`column.filter must be a supported out-of-the-box filter in ${column.id}`);\n }\n const FilterComp = FilterMapper[column.filter as keyof typeof FilterMapper];\n return <FilterComp {...filterProps} />;\n }\n\n if (column.Filter) {\n const FilterComp = column.Filter;\n return <FilterComp {...filterProps} />;\n }\n\n // Column doesn't have any filters\n return null;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;
|
|
4
|
+
"sourcesContent": ["import { cloneDeep } from 'lodash-es';\nimport React, { useCallback, useMemo } from 'react';\nimport {\n CurrencyRangeFilter,\n DateRangeFilter,\n DateSwitcherFilter,\n MultiCreatableFilter,\n MultiSelectFilter,\n NumberRangeFilter,\n SingleCreatableFilter,\n SingleDateFilter,\n SingleSelectFilter,\n FreeTextSearchFilter,\n SingleSelectFilterV2,\n MultiSelectFilterV2,\n SingleCreatableFilterV2,\n MultiCreatableFilterV2,\n SingleDateFilterV2,\n DateRangeFilterV2,\n DateSwitcherFilterV2,\n FreeTextSearchFilterV2,\n CurrencyRangeFilterV2,\n NumberRangeFilterV2,\n} from '../../addons/Filters/index.js';\nimport { useInternalStore, usePropsStore } from '../../configs/useStore/createInternalAndPropsContext.js';\nimport { FILTER_TYPES } from '../../exported-related/index.js';\nimport type { DSDataTableT } from '../../react-desc-prop-types.js';\n\nconst FilterMapper = {\n [FILTER_TYPES.SELECT]: SingleSelectFilter,\n [FILTER_TYPES.SELECT_V2]: SingleSelectFilterV2,\n [FILTER_TYPES.CREATABLE_SELECT]: SingleCreatableFilter,\n [FILTER_TYPES.CREATABLE_SELECT_V2]: SingleCreatableFilterV2,\n [FILTER_TYPES.MULTI_SELECT]: MultiSelectFilter,\n [FILTER_TYPES.MULTI_SELECT_V2]: MultiSelectFilterV2,\n [FILTER_TYPES.CREATABLE_MULTI_SELECT]: MultiCreatableFilter,\n [FILTER_TYPES.CREATABLE_MULTI_SELECT_V2]: MultiCreatableFilterV2,\n [FILTER_TYPES.SINGLE_DATE]: SingleDateFilter,\n [FILTER_TYPES.SINGLE_DATE_V2]: SingleDateFilterV2,\n [FILTER_TYPES.DATE_RANGE]: DateRangeFilter,\n [FILTER_TYPES.DATE_RANGE_V2]: DateRangeFilterV2,\n [FILTER_TYPES.DATE_SWITCHER]: DateSwitcherFilter,\n [FILTER_TYPES.DATE_SWITCHER_V2]: DateSwitcherFilterV2,\n [FILTER_TYPES.NUMBER_RANGE]: NumberRangeFilter,\n [FILTER_TYPES.NUMBER_RANGE_V2]: NumberRangeFilterV2,\n [FILTER_TYPES.CURRENCY_RANGE]: CurrencyRangeFilter,\n [FILTER_TYPES.CURRENCY_RANGE_V2]: CurrencyRangeFilterV2,\n [FILTER_TYPES.FREE_TEXT_SEARCH]: FreeTextSearchFilter,\n [FILTER_TYPES.FREE_TEXT_SEARCH_V2]: FreeTextSearchFilterV2,\n} as const;\n\nexport const FilterMapItem: React.ComponentType<DSDataTableT.FilterItemProps> = (props) => {\n const { column, filters, onFiltersChange } = props;\n const domIdAffix = usePropsStore((state) => state.domIdAffix);\n const patchHeaderFilterButtonAndMenu = useInternalStore((state) => state.patchHeaderFilterButtonAndMenu);\n const patchHeader = useInternalStore((state) => state.patchHeader);\n\n const filterValue = useMemo(() => filters.find((filter) => filter.id === column.id), [column.id, filters]);\n\n const onValueChange = useCallback(\n (type: string, newValue: unknown) => {\n const filterIndex = filters.findIndex((filter) => filter.id === column.id);\n if (newValue === undefined) {\n const newFilters = filters.filter((filter) => filter.id !== column.id);\n onFiltersChange(newFilters);\n } else if (filterIndex === -1) {\n onFiltersChange([...cloneDeep(filters), { id: column.id, type, value: newValue }]);\n } else {\n const newFilters = cloneDeep(filters);\n newFilters[filterIndex].type = type;\n newFilters[filterIndex].value = newValue;\n onFiltersChange(newFilters);\n }\n },\n [column.id, filters, onFiltersChange],\n );\n\n const filterProps = {\n ...props,\n // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment, @typescript-eslint/no-explicit-any\n filterValue: filterValue?.value as any,\n onValueChange,\n patchHeader,\n patchHeaderFilterButtonAndMenu,\n domIdAffix,\n };\n\n if (typeof column.filter === 'string') {\n if (!(column.filter in FilterMapper)) {\n throw new Error(`column.filter must be a supported out-of-the-box filter in ${column.id}`);\n }\n const FilterComp = FilterMapper[column.filter as keyof typeof FilterMapper];\n return <FilterComp {...filterProps} />;\n }\n\n if (column.Filter) {\n const FilterComp = column.Filter;\n return <FilterComp {...filterProps} />;\n }\n\n // Column doesn't have any filters\n return null;\n};\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;AD4FZ;AA5FX,uBAA0B;AAC1B,mBAA4C;AAC5C,qBAqBO;AACP,2CAAgD;AAChD,8BAA6B;AAG7B,MAAM,eAAe;AAAA,EACnB,CAAC,qCAAa,MAAM,GAAG;AAAA,EACvB,CAAC,qCAAa,SAAS,GAAG;AAAA,EAC1B,CAAC,qCAAa,gBAAgB,GAAG;AAAA,EACjC,CAAC,qCAAa,mBAAmB,GAAG;AAAA,EACpC,CAAC,qCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,qCAAa,eAAe,GAAG;AAAA,EAChC,CAAC,qCAAa,sBAAsB,GAAG;AAAA,EACvC,CAAC,qCAAa,yBAAyB,GAAG;AAAA,EAC1C,CAAC,qCAAa,WAAW,GAAG;AAAA,EAC5B,CAAC,qCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,qCAAa,UAAU,GAAG;AAAA,EAC3B,CAAC,qCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,qCAAa,aAAa,GAAG;AAAA,EAC9B,CAAC,qCAAa,gBAAgB,GAAG;AAAA,EACjC,CAAC,qCAAa,YAAY,GAAG;AAAA,EAC7B,CAAC,qCAAa,eAAe,GAAG;AAAA,EAChC,CAAC,qCAAa,cAAc,GAAG;AAAA,EAC/B,CAAC,qCAAa,iBAAiB,GAAG;AAAA,EAClC,CAAC,qCAAa,gBAAgB,GAAG;AAAA,EACjC,CAAC,qCAAa,mBAAmB,GAAG;AACtC;AAEO,MAAM,gBAAmE,CAAC,UAAU;AACzF,QAAM,EAAE,QAAQ,SAAS,gBAAgB,IAAI;AAC7C,QAAM,iBAAa,oDAAc,CAAC,UAAU,MAAM,UAAU;AAC5D,QAAM,qCAAiC,uDAAiB,CAAC,UAAU,MAAM,8BAA8B;AACvG,QAAM,kBAAc,uDAAiB,CAAC,UAAU,MAAM,WAAW;AAEjE,QAAM,kBAAc,sBAAQ,MAAM,QAAQ,KAAK,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE,GAAG,CAAC,OAAO,IAAI,OAAO,CAAC;AAEzG,QAAM,oBAAgB;AAAA,IACpB,CAAC,MAAc,aAAsB;AACnC,YAAM,cAAc,QAAQ,UAAU,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AACzE,UAAI,aAAa,QAAW;AAC1B,cAAM,aAAa,QAAQ,OAAO,CAAC,WAAW,OAAO,OAAO,OAAO,EAAE;AACrE,wBAAgB,UAAU;AAAA,MAC5B,WAAW,gBAAgB,IAAI;AAC7B,wBAAgB,CAAC,OAAG,4BAAU,OAAO,GAAG,EAAE,IAAI,OAAO,IAAI,MAAM,OAAO,SAAS,CAAC,CAAC;AAAA,MACnF,OAAO;AACL,cAAM,iBAAa,4BAAU,OAAO;AACpC,mBAAW,WAAW,EAAE,OAAO;AAC/B,mBAAW,WAAW,EAAE,QAAQ;AAChC,wBAAgB,UAAU;AAAA,MAC5B;AAAA,IACF;AAAA,IACA,CAAC,OAAO,IAAI,SAAS,eAAe;AAAA,EACtC;AAEA,QAAM,cAAc;AAAA,IAClB,GAAG;AAAA;AAAA,IAEH,aAAa,aAAa;AAAA,IAC1B;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AAEA,MAAI,OAAO,OAAO,WAAW,UAAU;AACrC,QAAI,EAAE,OAAO,UAAU,eAAe;AACpC,YAAM,IAAI,MAAM,8DAA8D,OAAO,EAAE,EAAE;AAAA,IAC3F;AACA,UAAM,aAAa,aAAa,OAAO,MAAmC;AAC1E,WAAO,4CAAC,cAAY,GAAG,aAAa;AAAA,EACtC;AAEA,MAAI,OAAO,QAAQ;AACjB,UAAM,aAAa,OAAO;AAC1B,WAAO,4CAAC,cAAY,GAAG,aAAa;AAAA,EACtC;AAGA,SAAO;AACT;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|