var _excluded = ["className", "hideSeparator", "separatorColor", "children", "stickyOffsetTop"];
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
import React from 'react';
import styled from 'styled-components';
import Row from './Row';
import { useFlexTable } from '../shared/FlexTableProvider';
import { getStylesForSizes } from '../shared';
var getStickyHeaderStyles = function getStickyHeaderStyles(_ref) {
  var stickyHeader = _ref.stickyHeader,
    stickyOffsetTop = _ref.stickyOffsetTop;
  if (stickyHeader) {
    return "\n      z-index: 1;\n      position: sticky;\n      top: ".concat(stickyOffsetTop, "px;\n    ");
  }
  return "\n      z-index: 0;\n      position: static;\n      top: unset;\n    ";
};
var StyledHeaderRow = styled(Row).withConfig({
  displayName: "HeaderRow__StyledHeaderRow",
  componentId: "sc-1vg8bsb-0"
})(["", " ", ""], function (p) {
  return !p.$hideSeparator ? "border-bottom: 1px solid ".concat(p.$separatorColor(p.theme), ";") : '';
}, getStylesForSizes(function (p) {
  return {
    stickyOffsetTop: p.$stickyOffsetTop,
    xs: p.$xs,
    sm: p.$sm,
    md: p.$md,
    lg: p.$lg,
    xl: p.$xl
  };
}, {
  stickyHeader: getStickyHeaderStyles
}));
export var HeaderRow = function HeaderRow(_ref2) {
  var className = _ref2.className,
    _ref2$hideSeparator = _ref2.hideSeparator,
    hideSeparator = _ref2$hideSeparator === void 0 ? false : _ref2$hideSeparator,
    _ref2$separatorColor = _ref2.separatorColor,
    separatorColor = _ref2$separatorColor === void 0 ? function (theme) {
      return theme.colorTokens.neutral.border_weak;
    } : _ref2$separatorColor,
    children = _ref2.children,
    _ref2$stickyOffsetTop = _ref2.stickyOffsetTop,
    stickyOffsetTop = _ref2$stickyOffsetTop === void 0 ? 0 : _ref2$stickyOffsetTop,
    htmlProps = _objectWithoutProperties(_ref2, _excluded);
  var _useFlexTable = useFlexTable('stickyHeader'),
    xs = _useFlexTable.xs,
    sm = _useFlexTable.sm,
    md = _useFlexTable.md,
    lg = _useFlexTable.lg,
    xl = _useFlexTable.xl;
  return React.createElement(StyledHeaderRow, _extends({
    className: className,
    hoverHighlight: false,
    rowType: "header",
    $hideSeparator: hideSeparator,
    $separatorColor: separatorColor,
    $stickyOffsetTop: stickyOffsetTop,
    $xs: xs,
    $sm: sm,
    $md: md,
    $lg: lg,
    $xl: xl
  }, htmlProps), children);
};