'use strict';

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

var styled = require('styled-components');
var index = require('../../utils/index.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);

const DataTableWrapper = styled__default['default'].div `
  display: flex;
  flex-flow: column;
  overflow: hidden;
  border-radius: ${(props) => props.theme.radius.roundedC};
  border: 1px solid ${index.getColorAlias('borderDefault')};
  background-color: ${index.getColorAlias('containerDefault')};
  color: ${index.getColorAlias('contentDefault')};
`;
const Header = styled__default['default'].header `
  display: flex;
  flex-flow: column;
  padding: ${index.getSpacing('s04')};

  ${({ headerVariant }) => headerVariant === 'strong' &&
    styled.css `
      background-color: ${index.getColorAlias('supportBrand02')};
    `};

  h2 {
    ${({ variant }) => variant === 'wide' ? index.getFontSize('size24') : index.getFontSize('size20')}
    margin: unset;
  }

  p {
    margin: ${index.getSpacing('s02')} 0 0 0;
  }
`;
const ResponsiveTableWrapper = styled__default['default'].div `
  display: block;
  overflow-x: auto;

  ${({ theme }) => theme.mode === 'light' &&
    styled.css `
      /* Shadow if content is scrollable */
      background: linear-gradient(to right, white, white),
        linear-gradient(to right, white, white),
        linear-gradient(to right, rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0.3)),
        linear-gradient(to left, rgba(0, 0, 0, 0.15), rgba(255, 255, 255, 0.3));

      background-position: left center, right center, left center, right center;
      background-repeat: no-repeat;
      background-color: white;
      background-size: 20px 100%, 20px 100%, 10px 100%, 10px 100%;
      background-attachment: local, local, scroll, scroll;
    `};
`;
const Table = styled__default['default'].table `
  border-collapse: collapse;
  width: 100%;

  th,
  td {
    ${index.getFontSize('size16')}
    padding: ${index.getSpacing('s04')};
    border-bottom: 1px solid ${index.getColorAlias('borderDefault')};
    vertical-align: top;
  }

  tr {
    &:hover:not(thead > tr) {
      background-color: ${index.getModifiedColorByThemeMode('hover01', 'containerDefault')};
    }

    &[data-selected=\"true\"] {
      background-color: ${index.getColorAlias('containerStrong')};
    }

    &[data-disabled=\"true\"] {
      color: ${index.getColorAlias('contentDisabled')};
    }
  }
`;
const Th = styled__default['default'].th.withConfig({
    shouldForwardProp: index.convertToTransientProps(['textAlign', 'columnWidth']),
}) `
  text-align: ${({ textAlign }) => textAlign || 'left'};
  width: ${({ columnWidth }) => columnWidth || 'auto'};
  cursor: ${({ onClick }) => (onClick ? 'pointer' : 'default')};
`;
const Td = styled__default['default'].td.withConfig({
    shouldForwardProp: index.convertToTransientProps(['textAlign']),
}) `
  text-align: ${({ textAlign }) => textAlign || 'left'};
  vertical-align: middle;
`;
const ThContainer = styled__default['default'].div `
  display: flex;
  justify-content: space-between;
  max-height: 48px;
  width: 100%;
  align-items: center;

  span {
    overflow: hidden;
    text-overflow: ellipsis;
    height: inherit;
    width: inherit;
  }

  svg {
    margin-left: ${index.getSpacing('s02')};
    min-height: 20px;
    min-width: 20px;
  }
`;
const CheckboxCell = styled__default['default'].span `
  width: 40px;
  padding: calc(${index.getSpacing('s04')} + 2px) 0 ${index.getSpacing('s04', 's04')} !important;
`;
const ActionBar = styled__default['default'].div `
  ${index.getFontSize('size16')}
  display: flex;
  background-color: ${index.getColorAlias('containerInverse')};
  color: ${index.getColorAlias('contentInverse')};
  padding: ${index.getSpacing('s02', 's04')};
  align-items: center;
  justify-content: space-between;
`;
const SelectedItemsInfo = styled__default['default'].div `
  ${index.getFontSize('size16')}
`;
const ActionButtons = styled__default['default'].div `
  display: flex;

  button:not(:last-child) {
    margin-right: ${index.getSpacing('s04')};
  }
`;
const Footer = styled__default['default'].footer `
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding: ${index.getSpacing('s02', 's04')};
`;
const ResultsArea = styled__default['default'].div `
  ${index.getFontSize('size14')}
  margin-right: ${index.getSpacing('s04')};
`;

exports.ActionBar = ActionBar;
exports.ActionButtons = ActionButtons;
exports.CheckboxCell = CheckboxCell;
exports.DataTableWrapper = DataTableWrapper;
exports.Footer = Footer;
exports.Header = Header;
exports.ResponsiveTableWrapper = ResponsiveTableWrapper;
exports.ResultsArea = ResultsArea;
exports.SelectedItemsInfo = SelectedItemsInfo;
exports.Table = Table;
exports.Td = Td;
exports.Th = Th;
exports.ThContainer = ThContainer;
