'use strict';

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

var styled = require('styled-components');
require('react');
var ChevronDown = require('../../icons/ChevronDown.js');
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 CollapsableContainer = styled__default['default'].div.withConfig({
    shouldForwardProp: index.convertToTransientProps(['isCollapsed']),
}) `
  max-height: ${(props) => (props.isCollapsed ? '0' : 'min-content')};
  overflow: hidden;
  ${index.getDefaultTransition()};
`;
const AccordionContent = styled__default['default'](CollapsableContainer)((props) => styled.css `
    color: ${index.getColorAlias('contentSubdued')};
    width: 100%;
    white-space: pre-line;
    ${index.getFontSize('size16')};

    ${props.isCollapsed
    ? styled.css `
          padding: ${index.getSpacing('s00', 's04')};
          visibility: hidden;
          opacity: 0;
        `
    : styled.css `
          padding: ${index.getSpacing('s02', 's04')};
          visibility: visible;
          opacity: 1;
        `}
  `);
const AccordionChevron = styled__default['default'](ChevronDown['default']) `
  fill: ${index.getColorAlias('contentDefault')};
  height: 18px;
  transform: rotate(-180deg);
  width: 18px;
  ${index.getDefaultTransition('transform')};
`;
const AccordionHeader = styled__default['default'].button.withConfig({
    shouldForwardProp: index.convertToTransientProps(['isCollapsed']),
})((props) => styled.css `
    background: ${index.getColorAlias('containerDefault')};
    border: 2px solid transparent;
    cursor: pointer;
    margin: 0;
    padding: 12px ${index.getSpacing('s04')};
    ${index.getDefaultTransition('background-color')};
    width: 100%;

    &:hover {
      background: ${index.getDarkenColor('hover01', 'containerDefault')};
    }

    &:active {
      background: ${index.getDarkenColor('active01', 'containerDefault')};
    }

    &:focus {
      border-color: ${index.getColorAlias('focusOuter')};
    }

    &:disabled {
      background: ${index.getColorAlias('containerDefault')};
      cursor: default;
    }

    ${props.isCollapsed &&
    styled.css `
      ${AccordionChevron} {
        transform: rotate(0);
      }
    `}
  `);
function getTitleStyleByVariant(variant) {
    switch (variant) {
        case 'default':
            return styled.css `
        font-weight: ${(props) => props.theme.font.weightExtrabold};
        ${index.getFontSize('size20')};
      `;
        case 'low-emphasis':
            return styled.css `
        font-weight: ${(props) => props.theme.font.weightRegular};
        ${index.getFontSize('size16')};
      `;
    }
}
const AccordionHeaderPrimaryRow = styled__default['default'].div `
  align-items: center;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
`;
const AccordionHeaderTitle = styled__default['default'].span `
  align-items: center;
  color: ${index.getColorAlias('contentDefault')};
  display: flex;
  flex-flow: row nowrap;
  ${(props) => getTitleStyleByVariant(props.variant)};

  span {
    display: flex;
    align-items: center;
  }

  svg {
    fill: ${index.getColorAlias('contentDefault')};
    margin-right: ${index.getSpacing('s04')};
  }
`;
const AccordionHeaderSecondaryRow = styled__default['default'].div `
  align-items: center;
  color: ${index.getColorAlias('contentSubdued')};
  display: flex;
  flex-flow: row nowrap;
  font-weight: ${(props) => props.theme.font.weightRegular};
  margin-top: ${index.getSpacing('s01')};
  ${index.getFontSize('size16')};
`;
const AccordionWrapper = styled__default['default'].div.withConfig({
    shouldForwardProp: index.convertToTransientProps(['hasDivider']),
}) `
  background: ${index.getColorAlias('containerDefault')};
  border-bottom: 1px solid;
  border-color: ${(props) => props.hasDivider ? index.getColorAlias('dividerDefault') : 'transparent'};
  display: flex;
  flex-flow: column nowrap;
  overflow: hidden;
`;

exports.AccordionChevron = AccordionChevron;
exports.AccordionContent = AccordionContent;
exports.AccordionHeader = AccordionHeader;
exports.AccordionHeaderPrimaryRow = AccordionHeaderPrimaryRow;
exports.AccordionHeaderSecondaryRow = AccordionHeaderSecondaryRow;
exports.AccordionHeaderTitle = AccordionHeaderTitle;
exports.AccordionWrapper = AccordionWrapper;
exports.CollapsableContainer = CollapsableContainer;
