'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 Wrapper = styled__default['default'].div `
  font-family: ${(props) => props.theme.font.familyPrimary};
  display: flex;
  flex-direction: column;
  width: 100%;
  ${index.getFontSize('size16')};
`;
const SliderWrapper = styled__default['default'].div.withConfig({
    shouldForwardProp: index.convertToTransientProps(['isThumbText']),
}) `
  position: relative;
  display: flex;
  min-width: 150px;
  width: 100%;
  height: 40px;
  ${(props) => props.isThumbText
    ? styled.css `
          margin-bottom: ${index.getSpacing('s02')};
        `
    : styled.css `
          margin-bottom: ${index.getSpacing('s00')};
        `};
  cursor: pointer;
  align-items: center;
`;
const Input = styled__default['default'].input ``;
const Track = styled__default['default'].span.withConfig({
    shouldForwardProp: index.convertToTransientProps(['trackColor']),
}) `
  width: 100%;
  height: 4px;
  border-radius: ${(props) => props.theme.radius.roundedA};
  ${(props) => styled.css `
    background: linear-gradient(
      to right,
      ${props.trackColor === 'primary'
    ? index.getColorAlias('interactiveBrand')
    : index.getColorAlias('supportInfoInverse')}
        0%,
      ${props.trackColor === 'primary'
    ? index.getColorAlias('interactiveBrand')
    : index.getColorAlias('supportInfoInverse')}
        ${props.position}%,
      ${index.getColorAlias('interactiveSecondary')} ${props.position}%,
      ${index.getColorAlias('interactiveSecondary')} 100%
    );
  `}
`;
const ThumbWrapper = styled__default['default'].div `
  cursor: pointer;
  position: absolute;
  left: ${(props) => props.position ? `calc(${props.position}% - 10px)` : '0%'};
  top: 11px;
  display: flex;
  flex-direction: column;
  align-items: center;
`;
const ThumbValue = styled__default['default'].span `
  ${index.getFontSize('size14')};
  white-space: nowrap;
  position: absolute;
  top: 18px;
  color: ${index.getColorAlias('containerInverse')};
`;
const Thumb = styled__default['default'].span `
  width: 16px;
  height: 16px;
  background: ${index.getColorAlias('interactiveLight')};
  border-radius: ${(props) => props.theme.radius.roundedE};
  box-shadow: ${(props) => props.theme.elevation.e2};
  top: 11px;
`;
const MinMaxValuesWrapper = styled__default['default'].div.withConfig({
    shouldForwardProp: index.convertToTransientProps(['onlyMax']),
}) `
  ${index.getFontSize('size14')}
  color: ${index.getColorAlias('contentDisabled')};
  display: flex;
  align-items: center;
  justify-content: ${(props) => props.onlyMax ? 'space-between' : 'flex-start'};
`;
const Col = styled__default['default'].div `
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: stretch;
`;
const TextWrapper = styled__default['default'].div `
  display: flex;
  justify-content: space-between;
  margin-bottom: -8px;
`;
const Title = styled__default['default'].span `
  ${index.getFontSize('size14')};
  font-weight: ${(props) => props.theme.font.weightBold};
  color: ${index.getColorAlias('containerInverse')};
`;
const SupportText = styled__default['default'].span `
  ${index.getFontSize('size14')};
  display: flex;
  color: ${index.getColorAlias('contentDisabled')};
  align-items: flex-end;
`;

exports.Col = Col;
exports.Input = Input;
exports.MinMaxValuesWrapper = MinMaxValuesWrapper;
exports.SliderWrapper = SliderWrapper;
exports.SupportText = SupportText;
exports.TextWrapper = TextWrapper;
exports.Thumb = Thumb;
exports.ThumbValue = ThumbValue;
exports.ThumbWrapper = ThumbWrapper;
exports.Title = Title;
exports.Track = Track;
exports.Wrapper = Wrapper;
