@retailmenot/anchor/commonjs/table.js

A React UI Library by RetailMeNot

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

function _interopDefault (ex) { return (ex && (typeof ex === 'object') && 'default' in ex) ? ex['default'] : ex; }

var __chunk_1 = require('./anchor-chunk-24f232e7.js');
var __chunk_2 = require('./anchor-chunk-9d9a5df6.js');
var React = require('react');
var classNames = _interopDefault(require('classnames'));
var styled = require('@xstyled/styled-components');
var styled__default = _interopDefault(styled);
var system = require('@xstyled/system');

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

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

  return data;
}

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

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

  return data;
}

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

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

  return data;
}

function _templateObject() {
  var data = __chunk_1._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 = system.variant({
  key: 'table.sizes',
  prop: 'size',
  "default": 'md',
  variants: TableSizes
});
var StyledTable = styled__default('table')(_templateObject(), sizeVariantStyles, system.border, system.width, system.maxWidth, system.minWidth, system.borderRadius, system.color, system.fontWeight, system.fontSize, system.space, function (_ref) {
  var background = _ref.background;
  return styled.css({
    background: system.th.color(background)
  });
}, function (_ref2) {
  var altBackground = _ref2.altBackground;
  return styled.css({
    background: system.th.color(altBackground)
  });
});
var Table = function Table(_a) {
  var className = _a.className,
      children = _a.children,
      props = __chunk_2.__rest(_a, ["className", "children"]);

  return React.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__default('tr')(_templateObject2(), system.height, system.color, system.space, function (_ref3) {
  var background = _ref3.background;
  return styled.css({
    background: system.th.color(background)
  });
});
var TableRow = function TableRow(_a) {
  var className = _a.className,
      children = _a.children,
      props = __chunk_2.__rest(_a, ["className", "children"]);

  return React.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 = __chunk_2.__rest(_a, ["className", "children"]);

  return React.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 = __chunk_2.__rest(_a, ["className", "children"]);

  return React.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 = __chunk_2.__rest(_a, ["className", "children"]);

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

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

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

exports.Table = Table;
//# sourceMappingURL=table.js.map