@stenajs-webui/filter 17.6.0 → 17.9.0

package/dist/index.js

@@ -1,466 +1,5 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var React = require('react');
-var modal = require('@stenajs-webui/modal');
-var theme = require('@stenajs-webui/theme');
-var core = require('@stenajs-webui/core');
-var elements = require('@stenajs-webui/elements');
-var panels = require('@stenajs-webui/panels');
-var lodash = require('lodash');
-var redux = require('redux');
-var redux$1 = require('@stenajs-webui/redux');
-var styled = require('@emotion/styled');
-var forms = require('@stenajs-webui/forms');
-var select = require('@stenajs-webui/select');
-var calendar = require('@stenajs-webui/calendar');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
-
-function _interopNamespace(e) {
-    if (e && e.__esModule) return e;
-    var n = Object.create(null);
-    if (e) {
-        Object.keys(e).forEach(function (k) {
-            if (k !== 'default') {
-                var d = Object.getOwnPropertyDescriptor(e, k);
-                Object.defineProperty(n, k, d.get ? d : {
-                    enumerable: true,
-                    get: function () { return e[k]; }
-                });
-            }
-        });
-    }
-    n["default"] = e;
-    return Object.freeze(n);
-}
-
-var React__namespace = /*#__PURE__*/_interopNamespace(React);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
-
-/*! *****************************************************************************
-Copyright (c) Microsoft Corporation.
-
-Permission to use, copy, modify, and/or distribute this software for any
-purpose with or without fee is hereby granted.
-
-THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH
-REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY
-AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT,
-INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM
-LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR
-OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR
-PERFORMANCE OF THIS SOFTWARE.
-***************************************************************************** */
-
-var __assign = function() {
-    __assign = Object.assign || function __assign(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p)) t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-
-function __rest(s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-}
-
-function __makeTemplateObject(cooked, raw) {
-    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
-    return cooked;
-}
-
-var SearchFilterPanelHeader = function (_a) {
-    var onRequestClose = _a.onRequestClose, _b = _a.header, header = _b === void 0 ? "Filters" : _b;
-    return (React__namespace.createElement(core.Row, { height: "56px", justifyContent: "space-between", alignItems: "center", indent: 2 },
-        React__namespace.createElement(core.Row, { alignItems: "center" },
-            React__namespace.createElement(elements.Icon, { icon: elements.stenaSliders, color: theme.cssColor("--lhds-color-ui-800"), size: 24 }),
-            React__namespace.createElement(core.Indent, null),
-            React__namespace.createElement(core.Heading, { variant: "h4" }, header)),
-        React__namespace.createElement(elements.SecondaryButton, { leftIcon: elements.stenaTimes, onClick: onRequestClose })));
-};
-
-var SearchFilterStateContext = React.createContext(null);
-var useSearchFilterState = function () {
-    var c = React.useContext(SearchFilterStateContext);
-    if (!c) {
-        throw new Error("Missing search filter context, wrap components with SearchFilterContext component.");
-    }
-    return c;
-};
-
-var SearchFilterDispatchContext = React.createContext(null);
-var useSearchFilterDispatch = function () {
-    var c = React.useContext(SearchFilterDispatchContext);
-    if (!c) {
-        throw new Error("Missing search filter dispatch context.");
-    }
-    return c;
-};
-
-var SearchFilterActionsContext = React.createContext(null);
-var useSearchFilterActions = function () {
-    var c = React.useContext(SearchFilterActionsContext);
-    if (!c) {
-        throw new Error("Missing search filter actions context.");
-    }
-    return c;
-};
-
-var SearchFilterDrawer = function (_a) {
-    var children = _a.children, header = _a.header, drawerProps = __rest(_a, ["children", "header"]);
-    var open = useSearchFilterState().settings.open;
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var closeDrawer = React.useCallback(function () {
-        dispatch(actions.closeFilters());
-    }, [actions, dispatch]);
-    return (React__namespace.createElement(modal.Drawer, __assign({ background: theme.cssColor("--lhds-color-ui-50"), width: "370px", isOpen: open, onRequestClose: closeDrawer }, drawerProps),
-        React__namespace.createElement(core.Column, null,
-            React__namespace.createElement(SearchFilterPanelHeader, { onRequestClose: closeDrawer, header: header }),
-            React__namespace.createElement(core.SeparatorLine, null),
-            children)));
-};
-
-var SearchFilterButton = function (_a) {
-    var _b = _a.label, label = _b === void 0 ? "Filters" : _b;
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var onClickButton = React.useCallback(function () {
-        dispatch(actions.openFilters());
-    }, [actions, dispatch]);
-    return (React__namespace.createElement(elements.SecondaryButton, { label: label, leftIcon: elements.stenaSliders, onClick: onClickButton }));
-};
-
-var SearchFilterSection = function SearchFilterSection(_a) {
-    var _b;
-    var sectionId = _a.sectionId, label = _a.label, contentLeft = _a.contentLeft, contentRight = _a.contentRight, loading = _a.loading, error = _a.error, onRetry = _a.onRetry, disableContentPadding = _a.disableContentPadding, children = _a.children;
-    var state = useSearchFilterState();
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var expanded = (_b = state.expandedSections.values[sectionId]) !== null && _b !== void 0 ? _b : false;
-    var onClickLabel = React.useCallback(function () {
-        dispatch(actions.setSectionExpanded(sectionId, !expanded));
-    }, [actions, dispatch, expanded, sectionId]);
-    var activeLabel = label !== null && label !== void 0 ? label : formatColumnIdToHeaderCellLabel(sectionId);
-    return (React__namespace.createElement(panels.Collapsible, { label: activeLabel, collapsed: !expanded, onClick: onClickLabel, contentLeft: contentLeft, contentRight: contentRight }, loading ? (React__namespace.createElement(panels.CollapsibleContent, null,
-        React__namespace.createElement(core.Row, { spacing: true, justifyContent: "center", flex: 1 },
-            React__namespace.createElement(elements.Spinner, { size: "small" })))) : error ? (React__namespace.createElement(elements.Banner, { variant: "error", text: error, contentRight: onRetry ? React__namespace.createElement(elements.FlatButton, { label: "Retry", onClick: onRetry }) : null })) : disableContentPadding ? (children) : (React__namespace.createElement(panels.CollapsibleContent, null, children))));
-};
-var formatColumnIdToHeaderCellLabel = function (columnId) {
-    return lodash.upperFirst(lodash.lowerCase(columnId));
-};
-
-var SearchFilterModelContext = React.createContext(null);
-var useSearchFilterModel = function () {
-    var c = React.useContext(SearchFilterModelContext);
-    if (!c) {
-        throw new Error("Missing search filter context, wrap components with SearchFilterContext component.");
-    }
-    return c;
-};
-
-var SearchFilterContext = function SearchFilterScope(_a) {
-    var state = _a.state, dispatch = _a.dispatch, actions = _a.actions, children = _a.children;
-    return (React__namespace.createElement(SearchFilterDispatchContext.Provider, { value: dispatch },
-        React__namespace.createElement(SearchFilterActionsContext.Provider, { value: actions },
-            React__namespace.createElement(SearchFilterStateContext.Provider, { value: state },
-                React__namespace.createElement(SearchFilterModelContext.Provider, { value: state.formModel }, children)))));
-};
-
-var createSearchFilterInitialState = function (initialFormModel) { return ({
-    settings: {
-        open: false,
-    },
-    formModel: initialFormModel,
-    expandedSections: { values: {} },
-}); };
-var createSearchFilterReducer = function (reducerId, initialState) {
-    return redux.combineReducers({
-        expandedSections: redux$1.reducerIdGate(getReducerIdFor(reducerId, "expandedSections"), redux$1.createValueByIdReducer(initialState.expandedSections)),
-        formModel: redux$1.reducerIdGate(getReducerIdFor(reducerId, "formModel"), redux$1.createEntityReducer(initialState.formModel)),
-        settings: redux$1.reducerIdGate(getReducerIdFor(reducerId, "settings"), redux$1.createEntityReducer(initialState.settings)),
-    });
-};
-var createSearchFilterActions = function (reducerId, initialFormModel) { return ({
-    openFilters: function () {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "settings"), redux$1.createEntityActions().setEntityFields({
-            open: true,
-        }));
-    },
-    closeFilters: function () {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "settings"), redux$1.createEntityActions().setEntityFields({
-            open: false,
-        }));
-    },
-    setFormModelFields: function (fields) {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "formModel"), redux$1.createEntityActions().setEntityFields(fields));
-    },
-    clearFormModel: function () {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "formModel"), redux$1.createEntityActions().setEntity(initialFormModel));
-    },
-    expandSection: function (section) {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "expandedSections"), redux$1.createValueByIdActions().setValue(section, true));
-    },
-    collapseSection: function (section) {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "expandedSections"), redux$1.createValueByIdActions().setValue(section, false));
-    },
-    setSectionExpanded: function (section, expanded) {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "expandedSections"), redux$1.createValueByIdActions().setValue(section, expanded));
-    },
-    clearExpandedSections: function () {
-        return redux$1.reducerIdGateAction(getReducerIdFor(reducerId, "expandedSections"), redux$1.createValueByIdActions().clearAllValues());
-    },
-}); };
-var getReducerIdFor = function (reducerId, reducerIdSuffix) { return "".concat(reducerId, ".").concat(reducerIdSuffix); };
-
-var useLocalSearchFilterState = function (initialState) {
-    var reducer = React.useState(function () {
-        return createSearchFilterReducer("local", initialState);
-    })[0];
-    var actions = React.useState(function () {
-        return createSearchFilterActions("local", initialState.formModel);
-    })[0];
-    var _a = React.useReducer(reducer, initialState), state = _a[0], dispatch = _a[1];
-    return {
-        actions: actions,
-        state: state,
-        dispatch: dispatch,
-    };
-};
-
-var SearchFilterLocalStateContext = function SearchFilterLocalScope(_a) {
-    var initialFormModel = _a.initialFormModel, children = _a.children;
-    var _b = useLocalSearchFilterState(createSearchFilterInitialState(initialFormModel)), state = _b.state, actions = _b.actions, dispatch = _b.dispatch;
-    return (React__namespace.createElement(SearchFilterContext, { state: state, actions: actions, dispatch: dispatch }, children));
-};
-
-var ChipSpacer = styled__default["default"].div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  padding: calc(var(--swui-metrics-spacing) / 2)\n    calc(var(--swui-metrics-indent) / 2);\n"], ["\n  padding: calc(var(--swui-metrics-spacing) / 2)\n    calc(var(--swui-metrics-indent) / 2);\n"])));
-var templateObject_1;
-
-var SearchFilterChips = function (_a) {
-    var children = _a.children, _b = _a.disableClearAllButton, disableClearAllButton = _b === void 0 ? false : _b;
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var onClickClearAll = React.useCallback(function () { return dispatch(actions.clearFormModel()); }, [actions, dispatch]);
-    return (React__namespace.createElement(core.Row, { flexWrap: "wrap" },
-        children,
-        !disableClearAllButton && (React__namespace.createElement(ChipSpacer, null,
-            React__namespace.createElement(elements.FlatButton, { size: "small", label: "Clear all", onClick: onClickClearAll })))));
-};
-
-var EmptyChip = function EmptyChip(_a) {
-    var label = _a.label, sectionId = _a.sectionId;
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var onClickLabel = React.useCallback(function () {
-        dispatch(actions.clearExpandedSections());
-        dispatch(actions.expandSection(sectionId));
-        dispatch(actions.openFilters());
-    }, [actions, dispatch, sectionId]);
-    return (React__namespace.createElement(ChipSpacer, null,
-        React__namespace.createElement(elements.Chip, { label: label, variant: "secondary", onClick: onClickLabel })));
-};
-
-var SearchFilterChip = function SearchFilterChip(_a) {
-    var sectionId = _a.sectionId, label = _a.label, value = _a.value, onClickRemove = _a.onClickRemove;
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var setFormModelFields = React.useCallback(function (fields) {
-        return dispatch(actions.setFormModelFields(fields));
-    }, [dispatch, actions]);
-    var onClickRemoveHandler = React.useCallback(function () {
-        onClickRemove === null || onClickRemove === void 0 ? void 0 : onClickRemove({ value: value, setFormModelFields: setFormModelFields });
-    }, [onClickRemove, setFormModelFields, value]);
-    var onClickLabel = React.useCallback(function () {
-        dispatch(actions.clearExpandedSections());
-        dispatch(actions.expandSection(sectionId));
-        dispatch(actions.openFilters());
-    }, [actions, dispatch, sectionId]);
-    return (React__namespace.createElement(ChipSpacer, null,
-        React__namespace.createElement(elements.Chip, { label: label !== null && label !== void 0 ? label : sectionId, onClick: onClickLabel, onClickRemove: onClickRemove ? onClickRemoveHandler : undefined })));
-};
-
-var SectionChips = function SectionChips(_a) {
-    var sectionId = _a.sectionId, chips = _a.chips, emptyChipLabel = _a.emptyChipLabel, onClickRemoveOnChip = _a.onClickRemoveOnChip;
-    if (!(chips === null || chips === void 0 ? void 0 : chips.length)) {
-        if (!emptyChipLabel) {
-            return null;
-        }
-        return React__namespace.createElement(EmptyChip, { sectionId: sectionId, label: emptyChipLabel });
-    }
-    return (React__namespace.createElement(React__namespace.Fragment, null, chips.map(function (_a) {
-        var label = _a.label, value = _a.value;
-        return (React__namespace.createElement(SearchFilterChip, { key: value, label: label !== null && label !== void 0 ? label : sectionId, sectionId: sectionId, onClickRemove: onClickRemoveOnChip, value: value }));
-    })));
-};
-
-var createChipsPropsForBooleanRecord = function (formModel, fieldName, options) { return ({
-    chips: createChipsForBooleanRecord(formModel[fieldName], options),
-    onClickRemoveOnChip: createOnClickRemoveOnChipForBooleanRecord(formModel, fieldName),
-}); };
-var createChipsForBooleanRecord = function (booleanRecord, options) {
-    return core.truthyKeysAsList(booleanRecord).map(function (key) {
-        var _a;
-        var option = options === null || options === void 0 ? void 0 : options.find(function (o) { return o.value === key; });
-        return { value: key, label: (_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : key };
-    });
-};
-var createOnClickRemoveOnChipForBooleanRecord = function (formModel, fieldName) {
-    return function (_a) {
-        var _b;
-        var setFormModelFields = _a.setFormModelFields, value = _a.value;
-        var newRecord = __assign({}, formModel[fieldName]);
-        newRecord[value] = false;
-        setFormModelFields((_b = {},
-            _b[fieldName] = newRecord,
-            _b));
-    };
-};
-
-var SimpleCheckboxListSection = function (_a) {
-    var options = _a.options, value = _a.value, onValueChange = _a.onValueChange, sectionProps = __rest(_a, ["options", "value", "onValueChange"]);
-    return (React__namespace.createElement(SearchFilterSection, __assign({ disableContentPadding: true }, sectionProps),
-        React__namespace.createElement(core.Column, { maxHeight: "400px", overflowY: "auto", flex: 1 }, options === null || options === void 0 ? void 0 : options.map(function (d) { return (React__namespace.createElement(panels.CollapsibleClickableContent, { key: d.value, onClick: function () {
-                var _a;
-                if (value && onValueChange) {
-                    var sel = !value[d.value];
-                    onValueChange(__assign(__assign({}, value), (_a = {}, _a[d.value] = sel, _a)));
-                }
-            }, contentLeft: React__namespace.createElement(forms.Checkbox, { tabIndex: -1, value: value === null || value === void 0 ? void 0 : value[d.value] }) },
-            React__namespace.createElement(core.Text, null, d.label))); }))));
-};
-
-var ChipMultiSelectSection = function (_a) {
-    var options = _a.options, value = _a.value, noneSelectedLabel = _a.noneSelectedLabel, onValueChange = _a.onValueChange, sectionProps = __rest(_a, ["options", "value", "noneSelectedLabel", "onValueChange"]);
-    var _b = React.useState(""), text = _b[0], setText = _b[1];
-    var listValue = React.useMemo(function () {
-        return value
-            ? core.truthyKeysAsList(value).map(function (key) {
-                var _a;
-                var option = options === null || options === void 0 ? void 0 : options.find(function (o) { return o.value === key; });
-                return { value: key, label: (_a = option === null || option === void 0 ? void 0 : option.label) !== null && _a !== void 0 ? _a : key };
-            })
-            : [];
-    }, [options, value]);
-    var filteredOptions = React.useMemo(function () {
-        return options === null || options === void 0 ? void 0 : options.filter(function (p) {
-            return p.value.toLocaleLowerCase().indexOf(text.toLocaleLowerCase()) > -1 ||
-                p.label.toLocaleLowerCase().indexOf(text.toLocaleLowerCase()) > -1;
-        });
-    }, [options, text]);
-    var onValueChangeInternal = React.useCallback(function (value) {
-        onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(createBooleanRecordFromValue(value));
-    }, [onValueChange]);
-    return (React__namespace.createElement(SearchFilterSection, __assign({}, sectionProps),
-        React__namespace.createElement(select.ChipMultiSelect, { options: filteredOptions, value: listValue, onValueChange: onValueChangeInternal, inputValue: text, noneSelectedLabel: noneSelectedLabel, onInputChange: setText, closeMenuOnSelect: false })));
-};
-var createBooleanRecordFromValue = function (value) {
-    return value.reduce(function (sum, item) {
-        sum[item.value] = true;
-        return sum;
-    }, {});
-};
-
-var createChipsPropsForDateRange = function (formModel, startDateFieldName, endDateFieldName) { return ({
-    chips: createChipsForDateRange(formModel[startDateFieldName], formModel[endDateFieldName]),
-    onClickRemoveOnChip: createOnClickRemoveOnChipForDateRange(startDateFieldName, endDateFieldName),
-}); };
-var createChipsForDateRange = function (startDate, endDate) {
-    if (!startDate && !endDate) {
-        return [];
-    }
-    return [
-        { value: "dateRange", label: "".concat(startDate !== null && startDate !== void 0 ? startDate : "", " - ").concat(endDate !== null && endDate !== void 0 ? endDate : "") },
-    ];
-};
-var createOnClickRemoveOnChipForDateRange = function (startDateFieldName, endDateFieldName) {
-    return function (_a) {
-        var _b;
-        var setFormModelFields = _a.setFormModelFields;
-        setFormModelFields((_b = {},
-            _b[startDateFieldName] = undefined,
-            _b[endDateFieldName] = undefined,
-            _b));
-    };
-};
-
-var createDateRangeSectionProps = function (formModel, startDateFieldName, endDateFieldName) { return ({
-    value: {
-        startDate: formModel[startDateFieldName],
-        endDate: formModel[endDateFieldName],
-    },
-    onValueChange: function (value, _a) {
-        var _b;
-        var dispatch = _a.dispatch, actions = _a.actions;
-        var fields = (_b = {},
-            _b[startDateFieldName] = value.startDate,
-            _b[endDateFieldName] = value.endDate,
-            _b);
-        dispatch(actions.setFormModelFields(fields));
-    },
-}); };
-
-var DateRangeCalendarSection = function (_a) {
-    var value = _a.value, onValueChange = _a.onValueChange, sectionId = _a.sectionId, dateRangeCalendarProps = __rest(_a, ["value", "onValueChange", "sectionId"]);
-    var dispatch = useSearchFilterDispatch();
-    var actions = useSearchFilterActions();
-    var options = React.useMemo(function () { return ({ dispatch: dispatch, actions: actions }); }, [actions, dispatch]);
-    var _b = React.useState("startDate"), focusedInput = _b[0], setFocusedInput = _b[1];
-    var dateRangeValue = React.useMemo(function () { return calendar.stringsToDateRange(value); }, [value]);
-    var onValueChangeHandler = React.useCallback(function (value) {
-        onValueChange(calendar.dateRangeToStrings(value), options);
-    }, [onValueChange, options]);
-    return (React__namespace.createElement(SearchFilterSection, { sectionId: sectionId },
-        React__namespace.createElement(core.Box, { flex: 1, alignItems: "center" },
-            React__namespace.createElement(core.Box, { background: "white", indent: true },
-                React__namespace.createElement(calendar.DateRangeCalendar, __assign({ setFocusedInput: setFocusedInput, focusedInput: focusedInput, value: dateRangeValue, onValueChange: onValueChangeHandler }, dateRangeCalendarProps))))));
-};
-
-exports.ChipMultiSelectSection = ChipMultiSelectSection;
-exports.DateRangeCalendarSection = DateRangeCalendarSection;
-exports.EmptyChip = EmptyChip;
-exports.SearchFilterActionsContext = SearchFilterActionsContext;
-exports.SearchFilterButton = SearchFilterButton;
-exports.SearchFilterChip = SearchFilterChip;
-exports.SearchFilterChips = SearchFilterChips;
-exports.SearchFilterContext = SearchFilterContext;
-exports.SearchFilterDispatchContext = SearchFilterDispatchContext;
-exports.SearchFilterDrawer = SearchFilterDrawer;
-exports.SearchFilterLocalStateContext = SearchFilterLocalStateContext;
-exports.SearchFilterModelContext = SearchFilterModelContext;
-exports.SearchFilterPanelHeader = SearchFilterPanelHeader;
-exports.SearchFilterSection = SearchFilterSection;
-exports.SearchFilterStateContext = SearchFilterStateContext;
-exports.SectionChips = SectionChips;
-exports.SimpleCheckboxListSection = SimpleCheckboxListSection;
-exports.createChipsForBooleanRecord = createChipsForBooleanRecord;
-exports.createChipsForDateRange = createChipsForDateRange;
-exports.createChipsPropsForBooleanRecord = createChipsPropsForBooleanRecord;
-exports.createChipsPropsForDateRange = createChipsPropsForDateRange;
-exports.createDateRangeSectionProps = createDateRangeSectionProps;
-exports.createOnClickRemoveOnChipForBooleanRecord = createOnClickRemoveOnChipForBooleanRecord;
-exports.createOnClickRemoveOnChipForDateRange = createOnClickRemoveOnChipForDateRange;
-exports.createSearchFilterActions = createSearchFilterActions;
-exports.createSearchFilterInitialState = createSearchFilterInitialState;
-exports.createSearchFilterReducer = createSearchFilterReducer;
-exports.formatColumnIdToHeaderCellLabel = formatColumnIdToHeaderCellLabel;
-exports.getReducerIdFor = getReducerIdFor;
-exports.useLocalSearchFilterState = useLocalSearchFilterState;
-exports.useSearchFilterActions = useSearchFilterActions;
-exports.useSearchFilterDispatch = useSearchFilterDispatch;
-exports.useSearchFilterModel = useSearchFilterModel;
-exports.useSearchFilterState = useSearchFilterState;
+(function(){ try {var elementStyle = document.createElement('style'); elementStyle.appendChild(document.createTextNode("")); document.head.appendChild(elementStyle);} catch(e) {console.error('vite-plugin-css-injected-by-js', e);} })();"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var o=require("react"),Q=require("@stenajs-webui/modal"),I=require("@stenajs-webui/theme"),d=require("@stenajs-webui/core"),x=require("@stenajs-webui/elements"),c=require("react/jsx-runtime"),v=require("@stenajs-webui/panels"),E=require("lodash"),U=require("redux"),i=require("@stenajs-webui/redux"),X=require("@emotion/styled"),Z=require("@stenajs-webui/forms"),N=require("@stenajs-webui/select"),b=require("@stenajs-webui/calendar");function ee(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}var te=ee(X);const q=({onRequestClose:e,header:t="Filters"})=>c.jsxs(d.Row,{height:"56px",justifyContent:"space-between",alignItems:"center",indent:2,children:[c.jsxs(d.Row,{alignItems:"center",children:[c.jsx(x.Icon,{icon:x.stenaSliders,color:I.cssColor("--lhds-color-ui-800"),size:24}),c.jsx(d.Indent,{}),c.jsx(d.Heading,{variant:"h4",children:t})]}),c.jsx(x.SecondaryButton,{leftIcon:x.stenaTimes,onClick:e})]}),w=o.createContext(null),M=()=>{const e=o.useContext(w);if(!e)throw new Error("Missing search filter context, wrap components with SearchFilterContext component.");return e},k=o.createContext(null),F=()=>{const e=o.useContext(k);if(!e)throw new Error("Missing search filter dispatch context.");return e},y=o.createContext(null),j=()=>{const e=o.useContext(y);if(!e)throw new Error("Missing search filter actions context.");return e},re=({children:e,header:t,...r})=>{const{settings:{open:n}}=M(),s=F(),a=j(),l=o.useCallback(()=>{s(a.closeFilters())},[a,s]);return c.jsx(Q.Drawer,{background:I.cssColor("--lhds-color-ui-50"),width:"370px",isOpen:n,onRequestClose:l,...r,children:c.jsxs(d.Column,{children:[c.jsx(q,{onRequestClose:l,header:t}),c.jsx(d.SeparatorLine,{}),e]})})},ne=({label:e="Filters"})=>{const t=F(),r=j(),n=o.useCallback(()=>{t(r.openFilters())},[r,t]);return c.jsx(x.SecondaryButton,{label:e,leftIcon:x.stenaSliders,onClick:n})},R=function({sectionId:t,label:r,contentLeft:n,contentRight:s,loading:a,error:l,onRetry:C,disableContentPadding:f,children:S}){var B;const u=M(),p=F(),m=j(),g=(B=u.expandedSections.values[t])!=null?B:!1,Y=o.useCallback(()=>{p(m.setSectionExpanded(t,!g))},[m,p,g,t]),J=r!=null?r:O(t);return c.jsx(v.Collapsible,{label:J,collapsed:!g,onClick:Y,contentLeft:n,contentRight:s,children:a?c.jsx(v.CollapsibleContent,{children:c.jsx(d.Row,{spacing:!0,justifyContent:"center",flex:1,children:c.jsx(x.Spinner,{size:"small"})})}):l?c.jsx(x.Banner,{variant:"error",text:l,contentRight:C?c.jsx(x.FlatButton,{label:"Retry",onClick:C}):null}):f?S:c.jsx(v.CollapsibleContent,{children:S})})},O=e=>E.upperFirst(E.lowerCase(e)),A=o.createContext(null),ce=()=>{const e=o.useContext(A);if(!e)throw new Error("Missing search filter context, wrap components with SearchFilterContext component.");return e},P=function({state:t,dispatch:r,actions:n,children:s}){return c.jsx(k.Provider,{value:r,children:c.jsx(y.Provider,{value:n,children:c.jsx(w.Provider,{value:t,children:c.jsx(A.Provider,{value:t.formModel,children:s})})})})},D=e=>({settings:{open:!1},formModel:e,expandedSections:{values:{}}}),G=(e,t)=>U.combineReducers({expandedSections:i.reducerIdGate(h(e,"expandedSections"),i.createValueByIdReducer(t.expandedSections)),formModel:i.reducerIdGate(h(e,"formModel"),i.createEntityReducer(t.formModel)),settings:i.reducerIdGate(h(e,"settings"),i.createEntityReducer(t.settings))}),V=(e,t)=>({openFilters:()=>i.reducerIdGateAction(h(e,"settings"),i.createEntityActions().setEntityFields({open:!0})),closeFilters:()=>i.reducerIdGateAction(h(e,"settings"),i.createEntityActions().setEntityFields({open:!1})),setFormModelFields:r=>i.reducerIdGateAction(h(e,"formModel"),i.createEntityActions().setEntityFields(r)),clearFormModel:()=>i.reducerIdGateAction(h(e,"formModel"),i.createEntityActions().setEntity(t)),expandSection:r=>i.reducerIdGateAction(h(e,"expandedSections"),i.createValueByIdActions().setValue(r,!0)),collapseSection:r=>i.reducerIdGateAction(h(e,"expandedSections"),i.createValueByIdActions().setValue(r,!1)),setSectionExpanded:(r,n)=>i.reducerIdGateAction(h(e,"expandedSections"),i.createValueByIdActions().setValue(r,n)),clearExpandedSections:()=>i.reducerIdGateAction(h(e,"expandedSections"),i.createValueByIdActions().clearAllValues())}),h=(e,t)=>`${e}.${t}`,H=e=>{const[t]=o.useState(()=>G("local",e)),[r]=o.useState(()=>V("local",e.formModel)),[n,s]=o.useReducer(t,e);return{actions:r,state:n,dispatch:s}},se=function({initialFormModel:t,children:r}){const{state:n,actions:s,dispatch:a}=H(D(t));return c.jsx(P,{state:n,actions:s,dispatch:a,children:r})},L=te.default.div`
+  padding: calc(var(--swui-metrics-spacing) / 2)
+    calc(var(--swui-metrics-indent) / 2);
+`,ae=({children:e,disableClearAllButton:t=!1})=>{const r=F(),n=j(),s=o.useCallback(()=>r(n.clearFormModel()),[n,r]);return c.jsxs(d.Row,{flexWrap:"wrap",children:[e,!t&&c.jsx(L,{children:c.jsx(x.FlatButton,{size:"small",label:"Clear all",onClick:s})})]})},T=function({label:t,sectionId:r}){const n=F(),s=j(),a=o.useCallback(()=>{n(s.clearExpandedSections()),n(s.expandSection(r)),n(s.openFilters())},[s,n,r]);return c.jsx(L,{children:c.jsx(x.Chip,{label:t,variant:"secondary",onClick:a})})},_=function({sectionId:t,label:r,value:n,onClickRemove:s}){const a=F(),l=j(),C=o.useCallback(u=>a(l.setFormModelFields(u)),[a,l]),f=o.useCallback(()=>{s==null||s({value:n,setFormModelFields:C})},[s,C,n]),S=o.useCallback(()=>{a(l.clearExpandedSections()),a(l.expandSection(t)),a(l.openFilters())},[l,a,t]);return c.jsx(L,{children:c.jsx(x.Chip,{label:r!=null?r:t,onClick:S,onClickRemove:s?f:void 0})})},oe=function({sectionId:t,chips:r,emptyChipLabel:n,onClickRemoveOnChip:s}){return r!=null&&r.length?c.jsx(c.Fragment,{children:r.map(({label:a,value:l})=>c.jsx(_,{label:a!=null?a:t,sectionId:t,onClickRemove:s,value:l},l))}):n?c.jsx(T,{sectionId:t,label:n}):null},le=(e,t,r)=>({chips:$(e[t],r),onClickRemoveOnChip:z(e,t)}),$=(e,t)=>d.truthyKeysAsList(e).map(r=>{var s;const n=t==null?void 0:t.find(a=>a.value===r);return{value:r,label:(s=n==null?void 0:n.label)!=null?s:r}}),z=(e,t)=>({setFormModelFields:r,value:n})=>{const s={...e[t]};s[n]=!1,r({[t]:s})},ie=({options:e,value:t,onValueChange:r,...n})=>c.jsx(R,{disableContentPadding:!0,...n,children:c.jsx(d.Column,{maxHeight:"400px",overflowY:"auto",flex:1,children:e==null?void 0:e.map(s=>c.jsx(v.CollapsibleClickableContent,{onClick:()=>{if(t&&r){const a=!t[s.value];r({...t,[s.value]:a})}},contentLeft:c.jsx(Z.Checkbox,{tabIndex:-1,value:t==null?void 0:t[s.value]}),children:c.jsx(d.Text,{children:s.label})},s.value))})}),ue=({options:e,value:t,noneSelectedLabel:r,onValueChange:n,...s})=>{const[a,l]=o.useState(""),C=o.useMemo(()=>t?d.truthyKeysAsList(t).map(u=>{var m;const p=e==null?void 0:e.find(g=>g.value===u);return{value:u,label:(m=p==null?void 0:p.label)!=null?m:u}}):[],[e,t]),f=o.useMemo(()=>e==null?void 0:e.filter(u=>u.value.toLocaleLowerCase().indexOf(a.toLocaleLowerCase())>-1||u.label.toLocaleLowerCase().indexOf(a.toLocaleLowerCase())>-1),[e,a]),S=o.useCallback(u=>{n==null||n(de(u))},[n]);return c.jsx(R,{...s,children:c.jsx(N.ChipMultiSelect,{options:f,value:C,onValueChange:S,inputValue:a,noneSelectedLabel:r,onInputChange:l,closeMenuOnSelect:!1})})},de=e=>e.reduce((t,r)=>(t[r.value]=!0,t),{}),he=(e,t,r)=>({chips:K(e[t],e[r]),onClickRemoveOnChip:W(t,r)}),K=(e,t)=>!e&&!t?[]:[{value:"dateRange",label:`${e!=null?e:""} - ${t!=null?t:""}`}],W=(e,t)=>({setFormModelFields:r})=>{r({[e]:void 0,[t]:void 0})},xe=(e,t,r)=>({value:{startDate:e[t],endDate:e[r]},onValueChange:(n,{dispatch:s,actions:a})=>{const l={[t]:n.startDate,[r]:n.endDate};s(a.setFormModelFields(l))}}),Ce=({value:e,onValueChange:t,sectionId:r,...n})=>{const s=F(),a=j(),l=o.useMemo(()=>({dispatch:s,actions:a}),[a,s]),[C,f]=o.useState("startDate"),S=o.useMemo(()=>b.stringsToDateRange(e),[e]),u=o.useCallback(p=>{t(b.dateRangeToStrings(p),l)},[t,l]);return c.jsx(R,{sectionId:r,children:c.jsx(d.Box,{flex:1,alignItems:"center",children:c.jsx(d.Box,{background:"white",indent:!0,children:c.jsx(b.DateRangeCalendar,{setFocusedInput:f,focusedInput:C,value:S,onValueChange:u,...n})})})})};exports.ChipMultiSelectSection=ue;exports.DateRangeCalendarSection=Ce;exports.EmptyChip=T;exports.SearchFilterActionsContext=y;exports.SearchFilterButton=ne;exports.SearchFilterChip=_;exports.SearchFilterChips=ae;exports.SearchFilterContext=P;exports.SearchFilterDispatchContext=k;exports.SearchFilterDrawer=re;exports.SearchFilterLocalStateContext=se;exports.SearchFilterModelContext=A;exports.SearchFilterPanelHeader=q;exports.SearchFilterSection=R;exports.SearchFilterStateContext=w;exports.SectionChips=oe;exports.SimpleCheckboxListSection=ie;exports.createChipsForBooleanRecord=$;exports.createChipsForDateRange=K;exports.createChipsPropsForBooleanRecord=le;exports.createChipsPropsForDateRange=he;exports.createDateRangeSectionProps=xe;exports.createOnClickRemoveOnChipForBooleanRecord=z;exports.createOnClickRemoveOnChipForDateRange=W;exports.createSearchFilterActions=V;exports.createSearchFilterInitialState=D;exports.createSearchFilterReducer=G;exports.formatColumnIdToHeaderCellLabel=O;exports.getReducerIdFor=h;exports.useLocalSearchFilterState=H;exports.useSearchFilterActions=j;exports.useSearchFilterDispatch=F;exports.useSearchFilterModel=ce;exports.useSearchFilterState=M;
 //# sourceMappingURL=index.js.map