"use strict";

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

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

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

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

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

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

var _Sort = require("../Sort");

var _templateObject, _templateObject2, _templateObject3;

var SortStrip = function SortStrip() {
  var _useListingConfig = (0, _lib.useListingConfig)(),
      sortOptionsRaw = _useListingConfig.sortOptions,
      defaultSortKeyRaw = _useListingConfig.defaultSortKey;

  var _useSort = (0, _lib.useSort)({
    sorts: sortOptionsRaw,
    defaultSortKey: defaultSortKeyRaw
  }),
      selectedSort = _useSort.selectedSort,
      sortOptions = _useSort.sortOptions;

  var _React$useState = _react["default"].useState(false),
      open = _React$useState[0],
      setOpen = _React$useState[1];

  var toggleSort = function toggleSort(forceClose) {
    return forceClose === true ? setOpen(false) : setOpen(!open);
  };

  var containerRef = _react["default"].useRef(null);

  var absoluteRef = _react["default"].useRef(null);

  (0, _lib.useClickOutside)(containerRef, function () {
    return toggleSort(true);
  }, [absoluteRef]);
  return /*#__PURE__*/_react["default"].createElement(RelativeContainer, null, /*#__PURE__*/_react["default"].createElement(Content, null, /*#__PURE__*/_react["default"].createElement(SortRefineWrapper, {
    onClick: toggleSort,
    ref: containerRef
  }, /*#__PURE__*/_react["default"].createElement(_Sort.Sort, {
    open: open,
    currentSort: selectedSort,
    sortOptions: sortOptions || [],
    absoluteRef: absoluteRef
  }))));
};

exports.SortStrip = SortStrip;

var RelativeContainer = _styledComponents["default"].div(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  position: relative;\n"])));

var Content = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])([""])));

var SortRefineWrapper = _styledComponents["default"].div.attrs({
  className: 'd-flex justify-content-md-end justify-content-center align-items-center'
})(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2["default"])([""])));
//# sourceMappingURL=index.js.map