@retailmenot/anchor/esm/table.js

A React UI Library by RetailMeNot

import { a as _taggedTemplateLiteral } from './anchor-chunk-7b9d8557.js';
import { a as __rest } from './anchor-chunk-27f34e54.js';
import { forwardRef, createElement, useContext, useState, Children, Fragment, useEffect, useRef, createRef, Component, cloneElement, useReducer, PureComponent, isValidElement, createContext, useImperativeHandle } from 'react';
import classNames from 'classnames';
import styled, { css } from '@xstyled/styled-components';
import { th, variant, width, height, maxWidth, minWidth, textAlign, fontSize, fontWeight, color, borderRadius, border, space } from '@xstyled/system';

function _templateObject4() {
  var data = _taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n"]);

  _templateObject4 = function _templateObject4() {
    return data;
  };

  return data;
}

function _templateObject3() {
  var data = _taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n"]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n    ", "\n    ", "\n    ", "\n    ", "\n"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    border-spacing: 0;\n    overflow: hidden;\n\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n    ", "\n\n    tbody tr:nth-child(odd) {\n        ", "\n    }\n\n    th {\n        white-space: nowrap;\n    }\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}
var TableSizes = {
  sm: {
    th: {
      padding: '0.25rem 0.75rem'
    },
    td: {
      padding: '0.25rem 0.75rem'
    }
  },
  md: {
    th: {
      padding: '0.5rem 1.25rem'
    },
    td: {
      padding: '0.5rem 1.25rem'
    }
  }
};
var sizeVariantStyles = variant({
  key: 'table.sizes',
  prop: 'size',
  "default": 'md',
  variants: TableSizes
});
var StyledTable = styled('table')(_templateObject(), sizeVariantStyles, border, width, maxWidth, minWidth, borderRadius, color, fontWeight, fontSize, space, function (_ref) {
  var background = _ref.background;
  return css({
    background: th.color(background)
  });
}, function (_ref2) {
  var altBackground = _ref2.altBackground;
  return css({
    background: th.color(altBackground)
  });
});
var Table = function Table(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement(StyledTable, Object.assign({
    className: classNames('anchor-table', className)
  }, props), children);
};
Table.defaultProps = {
  color: 'text.light',
  fontWeight: 500,
  border: 'base',
  borderRadius: 'base',
  background: 'white',
  altBackground: 'background.base'
};
var StyledRow = styled('tr')(_templateObject2(), height, color, space, function (_ref3) {
  var background = _ref3.background;
  return css({
    background: th.color(background)
  });
});
var TableRow = function TableRow(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement(StyledRow, Object.assign({
    className: classNames('anchor-table-row', className)
  }, props), children);
};
Table.Row = TableRow;
var TableBody = function TableBody(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement("tbody", Object.assign({
    className: classNames('anchor-table-body', className)
  }, props), children);
};
Table.Body = TableBody;
var TableHead = function TableHead(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement("thead", Object.assign({
    className: classNames('anchor-table-head', className)
  }, props), children);
};
Table.Head = TableHead;
var TableFooter = function TableFooter(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement("tfoot", Object.assign({
    className: classNames('anchor-table-footer', className)
  }, props), children);
};
Table.Footer = TableFooter;
var StyledTd = styled('td')(_templateObject3(), height, width, maxWidth, minWidth, fontSize, fontWeight, color, space, function (_ref4) {
  var align = _ref4.align;
  return textAlign({
    textAlign: align
  });
});
var TableCell = function TableCell(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement(StyledTd, Object.assign({
    className: classNames('anchor-table-cell', className)
  }, props), children);
};
Table.Cell = TableCell;
var StyledTh = styled('th')(_templateObject4(), height, width, maxWidth, minWidth, fontSize, fontWeight, color, space, function (_ref5) {
  var align = _ref5.align;
  return textAlign({
    textAlign: align
  });
});
var TableHeaderCell = function TableHeaderCell(_a) {
  var className = _a.className,
      children = _a.children,
      props = __rest(_a, ["className", "children"]);

  return createElement(StyledTh, Object.assign({
    className: classNames('anchor-table-header-cell', className)
  }, props), children);
};
Table.HeaderCell = TableHeaderCell;

export { Table };
//# sourceMappingURL=table.js.map