import _toString from "lodash/fp/toString";
import _flatMap from "lodash/fp/flatMap";
import _filter from "lodash/fp/filter";
import _pipe from "lodash/fp/pipe";
import _size from "lodash/fp/size";
import _map from "lodash/fp/map";
import React from 'react';
import FilterChip from '../../organism/filter-chip';
import FilterCkeckboxAndSearch from '../../organism/filter-checkbox-and-search';
import Title from '../../atom/title';
import Tag from '../../atom/tag';
import ButtonLink from '../../atom/button-link';
import Provider, { GetTranslateFromContext } from '../../atom/provider';
import propTypes from './prop-types';
import style from './style.css';

// @ts-expect-error convert is not recognized by the types
const uncappedMap = _map.convert({
  cap: false
});
const CLEAR_ALL_BUTTON_STYLE = {
  fontWeight: 'normal',
  padding: 0
};
const FilterSeparator = /*#__PURE__*/React.createElement("div", {
  className: style.filterSeparator
});
const buildFilters = filterOptions => {
  const {
    type,
    options
  } = filterOptions;
  switch (type) {
    case 'chip':
      return /*#__PURE__*/React.createElement(FilterChip, options);
    case 'checkbox':
      return /*#__PURE__*/React.createElement(FilterCkeckboxAndSearch, options);
    default:
      return null;
  }
};
const MultiFilterPanel = (props, context) => {
  const {
    title,
    onClearAll,
    options
  } = props;
  const translate = GetTranslateFromContext(context);
  const allSelectedFilters = _pipe(_map('options'), _flatMap('options'), _filter({
    selected: true
  }), _size)(options);
  const hasSelectedFilters = allSelectedFilters > 0;
  const filters = uncappedMap((filterOptions, i) => {
    const isLastItem = i + 1 === _size(options);
    return /*#__PURE__*/React.createElement("div", {
      key: i
    }, buildFilters(filterOptions), isLastItem ? null : FilterSeparator);
  }, options);
  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
    className: style.header
  }, /*#__PURE__*/React.createElement("div", {
    className: style.titleContainer
  }, /*#__PURE__*/React.createElement(Title, {
    title: title,
    type: "form-group",
    titleSize: "standard-light-weight"
  }), hasSelectedFilters ? /*#__PURE__*/React.createElement(Tag, {
    label: _toString(allSelectedFilters),
    type: "info",
    size: "S"
  }) : null), hasSelectedFilters ? /*#__PURE__*/React.createElement("div", {
    className: style.buttonContainer
  }, /*#__PURE__*/React.createElement(ButtonLink, {
    customStyle: CLEAR_ALL_BUTTON_STYLE,
    label: translate('clear_all'),
    type: "text",
    "data-name": "filters-all-clear-button",
    "aria-label": "filters all clear button",
    onClick: onClearAll
  })) : null), filters);
};
MultiFilterPanel.propTypes = process.env.NODE_ENV !== "production" ? propTypes : {};
MultiFilterPanel.contextTypes = {
  translate: Provider.childContextTypes.translate
};
export default MultiFilterPanel;
//# sourceMappingURL=index.js.map