"use strict";

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

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

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

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

var _ArrowUpIcon = _interopRequireDefault(require("mdi-react/ArrowUpIcon"));

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

var _Box = require("../../../Box");

var _Flex = require("../../../Flex");

var _PseudoBox = require("../../../PseudoBox");

var _styles = _interopRequireDefault(require("../../styles"));

var __jsx = _react["default"].createElement;

var Th = /*#__PURE__*/_react["default"].forwardRef(function (_ref, ref) {
  var id = _ref.id,
      sorting = _ref.sorting,
      onSort = _ref.onSort,
      span = _ref.span,
      props = (0, _objectWithoutProperties2["default"])(_ref, ["id", "sorting", "onSort", "span"]);

  var _useTableStyle = (0, _styles["default"])({
    sortable: id && onSort,
    span: span
  }),
      cellStyleProps = _useTableStyle.cell,
      headerCellStyleProps = _useTableStyle.headerCell;

  var allowSorting = id && sorting && onSort && typeof onSort === 'function';
  var showIcon = (sorting === null || sorting === void 0 ? void 0 : sorting.id) === id;
  var sortProps = allowSorting ? {
    onClick: function onClick() {
      onSort({
        id: id,
        direction: sorting.direction === 'asc' ? 'desc' : 'asc'
      });
    }
  } : {};
  return __jsx(_PseudoBox.PseudoBox, (0, _extends2["default"])({
    as: "th",
    ref: ref
  }, sortProps, cellStyleProps, props), __jsx(_Flex.Flex, headerCellStyleProps, __jsx(_Box.Box, null, props.children), allowSorting && showIcon && __jsx(_Box.Box, {
    ml: 1,
    transform: "rotate(".concat(sorting.direction === 'asc' ? 0 : 180, "deg)"),
    transition: "0.2s"
  }, __jsx(_ArrowUpIcon["default"], {
    size: 16
  }))));
});

exports.Th = Th;
//# sourceMappingURL=Th.js.map