"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports["default"] = void 0;

var React = _interopRequireWildcard(require("react"));

var _reactFocusLock = _interopRequireDefault(require("react-focus-lock"));

var _index = require("../popover/index.js");

var _index2 = require("../styles/index.js");

var _chevronDown = _interopRequireDefault(require("../icon/chevron-down.js"));

var _chevronUp = _interopRequireDefault(require("../icon/chevron-up.js"));

var _filter = _interopRequireDefault(require("../icon/filter.js"));

var _constants = require("./constants.js");

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }

function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; if (obj != null) { var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(source, true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(source).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest(); }

function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance"); }

function _iterableToArrayLimit(arr, i) { if (!(Symbol.iterator in Object(arr) || Object.prototype.toString.call(arr) === "[object Arguments]")) { return; } var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }

function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }

var HeaderCell = React.forwardRef(function (props, _ref) {
  var _useStyletron = (0, _index2.useStyletron)(),
      _useStyletron2 = _slicedToArray(_useStyletron, 2),
      useCss = _useStyletron2[0],
      theme = _useStyletron2[1];

  var sortRef = React.useRef(null);
  var controlStyles = useCss({
    alignItems: 'center',
    display: 'flex',
    flexShrink: 2,
    marginLeft: theme.sizing.scale600,
    justifyContent: 'space-between'
  });
  var filterButtonStyles = useCss({
    backgroundColor: 'transparent',
    border: 'none',
    cursor: 'pointer',
    marginRight: props.sortable ? theme.sizing.scale600 : null,
    paddingTop: 0,
    paddingRight: 0,
    paddingBottom: 0,
    paddingLeft: 0,
    ':hover': {
      color: theme.colors.primary
    }
  });
  var Filter = props.filter;
  return React.createElement("div", {
    role: "button",
    tabIndex: "0",
    ref: function ref(r) {
      if (typeof _ref === 'function') {
        _ref(r);
      }

      sortRef.current = r;
    },
    className: useCss(_objectSpread({}, theme.typography.font250, {
      alignItems: 'center',
      backgroundColor: props.isHovered ? theme.colors.mono200 : null,
      boxSizing: 'border-box',
      cursor: props.sortable ? 'pointer' : null,
      display: props.isMeasured ? 'inline-flex' : 'flex',
      height: '100%',
      paddingLeft: theme.sizing.scale600,
      paddingRight: theme.sizing.scale600,
      flexWrap: 'nowrap',
      whiteSpace: 'nowrap'
    })),
    onMouseEnter: props.onMouseEnter,
    onMouseLeave: function onMouseLeave(event) {
      if (!props.isFilterOpen) {
        props.onMouseLeave(event);
      }
    },
    onKeyUp: function onKeyUp(event) {
      if (event.key === 'Enter') {
        props.onSort(props.index);
      }
    },
    onClick: function onClick(event) {
      if (event.target.isSameNode(sortRef.current) || sortRef.current && sortRef.current.contains(event.target)) {
        props.onSort(props.index);
      }
    }
  }, props.title, React.createElement("div", {
    className: controlStyles
  }, props.isHovered && props.filterable ? React.createElement(_index.Popover, {
    placement: _index.PLACEMENT.bottomLeft,
    ignoreBoundary: true,
    isOpen: props.isFilterOpen,
    onClick: function onClick(e) {
      e.stopPropagation();
      props.onFilterOpen();
    },
    onClickOutside: function onClickOutside() {
      props.onFilterClose();
    },
    onEsc: function onEsc() {
      props.onFilterClose();
    },
    content: function content() {
      return (// eslint-disable-next-line jsx-a11y/no-autofocus
        React.createElement(_reactFocusLock["default"], {
          autoFocus: false
        }, React.createElement(Filter, {
          close: props.onFilterClose
        }))
      );
    }
  }, React.createElement("button", {
    className: filterButtonStyles
  }, React.createElement(_filter["default"], null))) : React.createElement("div", null), (props.isHovered || props.sortDirection) && props.sortable && React.createElement(React.Fragment, null, (props.sortDirection === _constants.SORT_DIRECTIONS.DESC || !props.sortDirection) && React.createElement(_chevronDown["default"], {
    color: props.sortDirection ? theme.colors.primary : undefined
  }), props.sortDirection === _constants.SORT_DIRECTIONS.ASC && React.createElement(_chevronUp["default"], {
    color: props.sortDirection ? theme.colors.primary : undefined
  }))));
});
HeaderCell.displayName = 'HeaderCell';
var _default = HeaderCell;
exports["default"] = _default;