@helpscout/hsds-react/components/Table/Table.skins.js

React component library for Help Scout's Design System

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.chooseSkin = exports.alternativeSkin = exports.defaultSkin = void 0;

var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));

var _color = require("../../styles/utilities/color");

var defaultSkin = {
  fontColorHeader: (0, _color.getColor)('charcoal.500'),
  fontColorBody: (0, _color.getColor)('charcoal.500'),
  fontColorAlternate: (0, _color.getColor)('charcoal.500'),
  bgColor: (0, _color.getColor)('grey.200'),
  bgAlternate: 'white',
  bgHeader: 'white',
  bgColorHover: (0, _color.getColor)('grey.300'),
  borderTableBody: "1px solid " + (0, _color.getColor)('grey.500'),
  borderTableHeader: 'none',
  borderRows: "1px solid " + (0, _color.getColor)('grey.500'),
  borderColumns: 'none',
  bgFocus: (0, _color.getColor)('blue.100'),
  bgFocusIndicator: (0, _color.getColor)('blue.500'),
  bgSelected: (0, _color.getColor)('blue.100'),
  bgSelectedHover: (0, _color.getColor)('blue.100'),
  headerRowHeight: '48px'
};
exports.defaultSkin = defaultSkin;
var alternativeSkin = (0, _extends2.default)({}, defaultSkin, {
  borderTableHeader: "1px solid " + (0, _color.getColor)('grey.500'),
  bgHeader: (0, _color.getColor)('grey.400')
});
exports.alternativeSkin = alternativeSkin;

var chooseSkin = function chooseSkin(skin) {
  if (!skin || skin === 'default') return defaultSkin;
  if (skin === 'alternative') return alternativeSkin;
  return (0, _extends2.default)({}, defaultSkin, skin);
};

exports.chooseSkin = chooseSkin;