"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

exports.__esModule = true;
exports.SelectedFilters = void 0;

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

var _react = _interopRequireDefault(require("react"));

var _Common = require("../../../../../Common");

var _styledComponents = _interopRequireWildcard(require("styled-components"));

var _lib = require("@sentecacommerce-theme/lib");

var _FilterWrapper = require("../FilterWrapper");

var _templateObject, _templateObject2, _templateObject3, _templateObject4;

var SelectedFilters = function SelectedFilters(_ref) {
  var _ref$isInModal = _ref.isInModal,
      isInModal = _ref$isInModal === void 0 ? false : _ref$isInModal,
      data = _ref.data;
  var clearAll = (0, _lib.useClearAllFilters)();
  var labels = (0, _lib.useLocalLabels)();
  var selectedFilters = (0, _lib.useAllSelectedFilters)(data);
  var config = (0, _lib.useConfigState)();
  var labelGettersMap = {
    terms: _lib.getTermsAggregationLabel,
    ranges: function ranges(filter) {
      if (filter.data.from === '*') {
        return "\u043F\u043E\u0434 " + filter.data.to / 100 + "\u043B\u0432";
      }

      if (filter.data.to === '*') {
        return "\u043D\u0430\u0434 " + filter.data.from / 100 + "\u043B\u0432";
      }

      return filter.data.from / 100 + "\u043B\u0432 - " + filter.data.to / 100 + "\u043B\u0432";
    },
    stats: function stats(filter) {
      var from = (0, _lib.formatAsCurrency)({
        currency: 'BGN',
        // We need useInterfaceConfig, pls
        locale: config.price.locale,
        price: +filter.data.valueFrom / 100
      });
      var to = (0, _lib.formatAsCurrency)({
        currency: 'BGN',
        // We need useInterfaceConfig, pls
        locale: config.price.locale,
        price: +filter.data.valueTo / 100
      });
      return filter.data.label + ": " + from.displayValue + " - " + to.displayValue;
    }
  };
  if (!selectedFilters.length) return null;

  var Items = /*#__PURE__*/_react["default"].createElement(_Common.ScrollView, {
    maxHeight: "none",
    maxWidth: "100%",
    overflowDirection: "x"
  }, /*#__PURE__*/_react["default"].createElement(Container, null, selectedFilters.map(function (item, i) {
    var _labelGettersMap;

    var label = ((_labelGettersMap = labelGettersMap[item.aggregationType || '']) == null ? void 0 : _labelGettersMap.call(labelGettersMap, item)) || null;
    return /*#__PURE__*/_react["default"].createElement(Wrapper, {
      key: "Item__" + (label || i)
    }, /*#__PURE__*/_react["default"].createElement(Text, {
      onClick: item.onClick
    }, /*#__PURE__*/_react["default"].createElement("span", null, label || 'N/A'), /*#__PURE__*/_react["default"].createElement(_Common.IconClose, {
      className: "ml-2 p-1"
    })));
  }), !isInModal && selectedFilters.length > 1 && /*#__PURE__*/_react["default"].createElement(Wrapper, null, /*#__PURE__*/_react["default"].createElement(Text, {
    isClearAll: true,
    onClick: clearAll
  }, /*#__PURE__*/_react["default"].createElement("span", null, labels.clearAllFilters)))));

  if (isInModal) {
    return /*#__PURE__*/_react["default"].createElement(_FilterWrapper.FilterWrapper, {
      withResetAllButton: true,
      filterName: "Filtered by"
    }, Items);
  }

  return Items;
};

exports.SelectedFilters = SelectedFilters;

var Container = _styledComponents["default"].div.attrs({
  className: 'd-flex flex-lg-wrap'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  max-width: calc(100% + 1.6rem);\n  margin-left: -0.8rem;\n  margin-bottom: -1.6rem;\n\n  @media (min-width: ", ") {\n    margin-left: -0.4rem;\n    margin-bottom: -0.8rem;\n  }\n"])), function (_ref2) {
  var theme = _ref2.theme;
  return theme.breakpoints.lg.min;
});

var Wrapper = _styledComponents["default"].div.attrs({
  className: 'mb-3 px-2 px-lg-1 mb-lg-2'
})(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  &:last-of-type {\n    padding-right: 0 !important;\n  }\n"])));

var Text = (0, _styledComponents["default"])(_Common.Typography).attrs({
  as: 'span',
  variant: 7,
  color: 'primary',
  className: 'd-flex align-items-center px-3',
  tabIndex: 0
})(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  cursor: pointer;\n  white-space: nowrap;\n  line-height: 3rem;\n  color: ", ";\n  opacity: 0.6;\n\n  & > svg {\n    width: 1.8rem;\n    opacity: 0.8;\n    background: ", ";\n    border-radius: 50%;\n    color: ", ";\n  }\n\n  &:hover {\n    opacity: 1;\n  }\n\n  ", "\n"])), function (_ref3) {
  var theme = _ref3.theme;
  return theme.palette.primary;
}, function (_ref4) {
  var theme = _ref4.theme;
  return theme.palette.hint;
}, function (_ref5) {
  var theme = _ref5.theme;
  return theme.palette.secondary;
}, function (props) {
  return !props.isClearAll ? (0, _styledComponents.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2["default"])(["\n          border: 0.1rem solid ", ";\n        "])), function (_ref6) {
    var theme = _ref6.theme;
    return theme.palette.primary;
  }) : "\n          font-size: 1.4rem;\n      ";
});
//# sourceMappingURL=index.js.map