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

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _includes = _interopRequireDefault(require("core-js-pure/stable/instance/includes.js"));
var _react = require("react");
var _Checkbox = _interopRequireDefault(require("../checkbox/Checkbox.js"));
var _Flex = _interopRequireDefault(require("../flex/Flex.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 FilterSelection({
  label,
  filterKey,
  defaultOpen,
  data: options
}) {
  const context = (0, _react.useContext)(_FilterContext.FilterContext);
  if (!context) {
    throw new Error('Filter.Selection must be used inside a Filter.Root.');
  }
  const {
    state,
    setFilter,
    removeFilter
  } = context;
  const itemContext = (0, _react.useContext)(_FilterContext.FilterItemContext);
  const prefix = `${filterKey}/`;
  const currentValue = (0, _react.useMemo)(() => {
    return Object.keys(state.filters).filter(key => key.startsWith(prefix)).map(key => key.slice(prefix.length));
  }, [state.filters, prefix]);
  const handleChange = (0, _react.useCallback)((optionValue, checked) => {
    const key = `${prefix}${optionValue}`;
    if (checked) {
      var _option$label;
      const option = options.find(opt => opt.value === optionValue);
      setFilter(key, {
        value: optionValue,
        label: (_option$label = option?.label) !== null && _option$label !== void 0 ? _option$label : optionValue,
        categoryLabel: label
      });
    } else {
      if (itemContext) {
        setFilter(key, undefined);
      } else {
        removeFilter(key);
      }
    }
  }, [itemContext, setFilter, removeFilter, prefix, label, options]);
  return (0, _jsxRuntime.jsx)(_FilterItem.default, {
    label: label,
    filterKey: filterKey,
    defaultOpen: defaultOpen,
    children: (0, _jsxRuntime.jsx)(_Flex.default.Vertical, {
      gap: "small",
      children: options.map(option => (0, _jsxRuntime.jsx)(_Checkbox.default, {
        label: option.label,
        checked: (0, _includes.default)(currentValue).call(currentValue, option.value),
        onChange: ({
          checked
        }) => handleChange(option.value, checked)
      }, option.value))
    })
  });
}
var _default = exports.default = FilterSelection;
//# sourceMappingURL=FilterSelection.js.map