@ntragas/pouncejstest/dist/esm/components/Table/TableHeaderCell.js

A collection of UI components from Panther labs

import _extends from "@babel/runtime/helpers/extends";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";
import React from 'react';
import Box from '../Box';
import { useTable } from './Table';
var TableHeaderCell = /*#__PURE__*/React.forwardRef(function TableHeaderCell(_ref, ref) {
  var _ref$align = _ref.align,
      align = _ref$align === void 0 ? 'left' : _ref$align,
      sortDir = _ref.sortDir,
      rest = _objectWithoutPropertiesLoose(_ref, ["align", "sortDir"]);

  var _useTable = useTable(),
      size = _useTable.size,
      stickyHeader = _useTable.stickyHeader;

  return /*#__PURE__*/React.createElement(Box, _extends({
    as: "th",
    role: "columnheader",
    ref: ref,
    p: size === 'medium' ? 4 : 2,
    fontWeight: "medium",
    textTransform: "uppercase",
    fontSize: "small",
    textAlign: align,
    "aria-sort": sortDir ? sortDir : undefined,
    position: stickyHeader ? 'sticky' : undefined,
    top: stickyHeader ? 0 : undefined,
    backgroundColor: stickyHeader ? 'navyblue-300' : 'inherit',
    verticalAlign: "middle"
  }, rest));
});
export default /*#__PURE__*/React.memo(TableHeaderCell);