baseui/table-grid/styled-components.js

A React Component library implementing the Base design language

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StyledTable = exports.StyledHeadCell = exports.StyledBodyCell = void 0;
var React = _interopRequireWildcard(require("react"));
var _styles = require("../styles");
var _table = require("../table");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
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); } /*
Copyright (c) Uber Technologies, Inc.

This source code is licensed under the MIT license found in the
LICENSE file in the root directory of this source tree.
*/
const StyledTableElement = (0, _styles.withStyle)(_table.StyledTable, props => {
  return {
    display: 'grid',
    gridTemplateColumns: props.$gridTemplateColumns,
    flexDirection: 'unset',
    // Creates a stacking context so we can use z-index on the StyledHeadCell
    // without affecting anything outside of this component.
    transform: 'scale(1)'
  };
});
StyledTableElement.displayName = "StyledTableElement";
StyledTableElement.displayName = 'StyledTableElement';
const StyledTable = exports.StyledTable = (0, _styles.withWrapper)(StyledTableElement, StyledComponent => function StyledTable(props) {
  return /*#__PURE__*/React.createElement(StyledComponent, _extends({
    "data-baseweb": "table-grid"
  }, props));
});
const StyledHeadCell = exports.StyledHeadCell = (0, _styles.withStyle)(_table.StyledHeadCell, ({
  $sticky = true,
  $isFocusVisible,
  $theme
}) => {
  return {
    backgroundColor: $theme.colors.tableHeadBackgroundColor,
    boxShadow: $theme.lighting.shadow400,
    position: $sticky ? 'sticky' : null,
    top: $sticky ? 0 : null,
    width: 'unset',
    ':focus': {
      outline: $isFocusVisible ? `3px solid ${$theme.colors.borderAccent}` : 'none',
      outlineOffset: '-3px'
    },
    zIndex: $sticky ? 1 : 'auto'
  };
});
StyledHeadCell.displayName = "StyledHeadCell";
StyledHeadCell.displayName = 'StyledHeadCell';
const StyledBodyCell = exports.StyledBodyCell = (0, _styles.withStyle)(_table.StyledCell, props => {
  return {
    display: 'block',
    flex: 'unset',
    gridColumn: props.$gridColumn || null,
    gridRow: props.$gridRow || null,
    ':focus': {
      outline: props.$isFocusVisible ? `3px solid ${props.$theme.colors.borderAccent}` : 'none',
      outlineOffset: '-3px'
    }
  };
});
StyledBodyCell.displayName = "StyledBodyCell";
StyledBodyCell.displayName = 'StyledBodyCell';