@dnb/eufemia/cjs/components/filter/FilterMultiSelection.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _MultiSelection = _interopRequireDefault(require("../../extensions/forms/Field/MultiSelection/MultiSelection.js"));
var _FilterContext = require("./FilterContext.js");
var _FilterItem = _interopRequireDefault(require("./FilterItem.js"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function FilterMultiSelection({
  label,
  filterKey,
  defaultOpen,
  data
}) {
  const context = (0, _react.useContext)(_FilterContext.FilterContext);
  if (!context) {
    throw new Error('Filter.MultiSelection must be used inside a Filter.Root.');
  }
  const {
    state,
    replaceFilters
  } = context;
  const filtersRef = (0, _react.useRef)(state.filters);
  filtersRef.current = state.filters;
  const prefix = `${filterKey}/`;
  const currentValue = (0, _react.useMemo)(() => {
    const values = Object.keys(state.filters).filter(key => key.startsWith(prefix)).map(key => key.slice(prefix.length));
    return values.length > 0 ? values : undefined;
  }, [state.filters, prefix]);
  const handleChange = (0, _react.useCallback)(value => {
    const nextValues = Array.from(new Set((value !== null && value !== void 0 ? value : []).map(v => String(v))));
    const currentFilters = {
      ...filtersRef.current
    };
    for (const key of Object.keys(currentFilters)) {
      if (key.startsWith(prefix)) {
        delete currentFilters[key];
      }
    }
    for (const v of nextValues) {
      const key = `${prefix}${v}`;
      const item = data.find(d => String(d.value) === v);
      currentFilters[key] = {
        value: v,
        label: item ? String(item.title) : v,
        categoryLabel: label
      };
    }
    replaceFilters(currentFilters);
  }, [replaceFilters, prefix, label, data]);
  return (0, _jsxRuntime.jsx)(_FilterItem.default, {
    label: label,
    filterKey: filterKey,
    defaultOpen: defaultOpen,
    children: (0, _jsxRuntime.jsx)(_MultiSelection.default, {
      label: label,
      labelSrOnly: true,
      data: data,
      value: currentValue,
      onChange: handleChange,
      variant: "inline",
      showSearchField: true
    })
  });
}
var _default = exports.default = FilterMultiSelection;
//# sourceMappingURL=FilterMultiSelection.js.map