import _get from "lodash/fp/get";
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
import React from 'react';
import PropTypes from 'prop-types';
import { NovaCompositionNavigationArrowDown as ArrowDown } from '@coorpacademy/nova-icons';
import Select from '../../atom/select';
import Provider from '../../atom/provider';
import style from './style.css';
import FiltersWrapper from './filters-wrapper';
class Filters extends React.Component {
  static contextTypes = {
    skin: Provider.childContextTypes.skin
  };
  constructor(props) {
    super(props);
    this.state = {
      filter: !!props.openFilters,
      sorted: !!props.openSorts
    };
    this.handleOpenFilter = this.handleOpenFilter.bind(this);
    this.handleOpenSort = this.handleOpenSort.bind(this);
    this.handleSearch = this.handleSearch.bind(this);
  }
  handleOpenFilter() {
    const {
      filter
    } = this.state;
    const {
      onToggleFilters
    } = this.props;
    const newValue = !filter;
    this.setState({
      filter: newValue,
      sorted: false
    });
    if (onToggleFilters) {
      onToggleFilters(newValue);
    }
  }
  handleOpenSort() {
    const {
      sorted
    } = this.state;
    const {
      onToggleSorts
    } = this.props;
    const newValue = !sorted;
    this.setState({
      sorted: newValue,
      filter: false
    });
    if (onToggleSorts) onToggleSorts(newValue);
  }
  handleSearch() {
    const {
      onSearch
    } = this.props;
    this.setState({
      sorted: false,
      filter: false
    });
    if (onSearch) onSearch();
  }
  render() {
    const {
      sorting,
      filterCTALabel,
      filterTabLabel,
      sortCTALabel,
      sortTabLabel,
      filters,
      moreFilterAriaLabel,
      moreSortAriaLabel,
      filterGroupAriaLabel,
      sortAriaLabel
    } = this.props;
    const {
      filter,
      sorted
    } = this.state;
    const {
      skin
    } = this.context;
    const defaultColor = _get('common.primary', skin);
    const darkColor = _get('common.dark', skin);
    const filtersActive = filter === true;
    const sortingActive = sorted === true;
    const sortView = sorting !== undefined ? /*#__PURE__*/React.createElement("div", {
      "data-name": "choice",
      className: style.select
    }, /*#__PURE__*/React.createElement(Select, _extends({}, sorting, {
      "aria-label": sortAriaLabel
    }))) : null;
    return /*#__PURE__*/React.createElement("div", {
      "data-name": "search",
      className: style.search
    }, /*#__PURE__*/React.createElement("div", {
      "data-name": "filter",
      "data-open": filtersActive,
      className: filtersActive ? style.activeDefault : style.defaultStyle
    }, /*#__PURE__*/React.createElement("div", {
      className: style.title,
      "data-name": "filterButton",
      onClick: this.handleOpenFilter
    }, filterTabLabel, /*#__PURE__*/React.createElement("div", {
      className: style.arrow
    }, /*#__PURE__*/React.createElement(ArrowDown, {
      style: {
        color: darkColor
      },
      height: 14,
      "aria-label": moreFilterAriaLabel
    })))), /*#__PURE__*/React.createElement("div", {
      "data-name": "sortBy",
      "data-open": sortingActive,
      className: sortingActive ? style.activeWrapperSortBy : style.wrapperSortBy
    }, /*#__PURE__*/React.createElement("div", {
      className: style.title,
      "data-name": "sortButton",
      onClick: this.handleOpenSort
    }, sortTabLabel, /*#__PURE__*/React.createElement("div", {
      className: style.arrow
    }, /*#__PURE__*/React.createElement(ArrowDown, {
      style: {
        color: darkColor
      },
      height: 14,
      "aria-label": moreSortAriaLabel
    })))), /*#__PURE__*/React.createElement("div", {
      "data-name": "filterWrapper",
      className: filtersActive ? style.activeWrapperFilters : style.wrapperFilters
    }, /*#__PURE__*/React.createElement(FiltersWrapper, {
      className: style.wrapper,
      filters: filters,
      filterGroupAriaLabel: filterGroupAriaLabel
    }), /*#__PURE__*/React.createElement("div", {
      "data-name": "cta",
      className: style.ctaFilter,
      style: {
        backgroundColor: defaultColor
      },
      onClick: this.handleSearch
    }, filterCTALabel)), /*#__PURE__*/React.createElement("div", {
      "data-name": "sortWrapper",
      className: sortingActive ? style.activeSorting : style.sorting
    }, sortView, /*#__PURE__*/React.createElement("div", {
      "data-name": "cta",
      className: style.ctaFilter,
      style: {
        backgroundColor: defaultColor
      },
      onClick: this.handleSearch
    }, sortCTALabel)));
  }
}
Filters.propTypes = process.env.NODE_ENV !== "production" ? {
  filterCTALabel: PropTypes.string,
  filterTabLabel: PropTypes.string,
  sortCTALabel: PropTypes.string,
  sortTabLabel: PropTypes.string,
  openFilters: PropTypes.bool,
  openSorts: PropTypes.bool,
  filters: FiltersWrapper.propTypes.filters,
  sorting: PropTypes.shape(Select.propTypes),
  onSearch: PropTypes.func,
  onToggleFilters: PropTypes.func,
  onToggleSorts: PropTypes.func,
  moreSortAriaLabel: PropTypes.string,
  moreFilterAriaLabel: PropTypes.string,
  filterGroupAriaLabel: PropTypes.string,
  sortAriaLabel: PropTypes.string
} : {};
export default Filters;
//# sourceMappingURL=index.js.map