"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StyledDay = exports.StyledWeek = exports.StyledMonth = exports.StyledNextButton = exports.StyledPrevButton = exports.StyledMonthYearSelectIconContainer = exports.StyledMonthYearSelectButton = exports.StyledMonthHeader = exports.StyledCalendarHeader = exports.StyledSelectorContainer = exports.StyledCalendarContainer = exports.StyledRoot = void 0;

var _index = require("../styles/index.js");

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

/**
 * Main component container element
 */
var StyledRoot = (0, _index.styled)('div', function (props) {
  var _props$$theme = props.$theme,
      typography = _props$$theme.typography,
      colors = _props$$theme.colors,
      borders = _props$$theme.borders;
  return _objectSpread({}, typography.font400, {
    color: props.$theme.colors.datepickerDayFont,
    backgroundColor: colors.datepickerBackground,
    textAlign: 'center',
    borderTopLeftRadius: borders.surfaceBorderRadius,
    borderTopRightRadius: borders.surfaceBorderRadius,
    borderBottomRightRadius: borders.surfaceBorderRadius,
    borderBottomLeftRadius: borders.surfaceBorderRadius,
    display: 'inline-block'
  });
});
exports.StyledRoot = StyledRoot;
StyledRoot.displayName = "StyledRoot";
var StyledCalendarContainer = (0, _index.styled)('div', function (props) {
  var sizing = props.$theme.sizing;
  return {
    paddingTop: sizing.scale400,
    paddingBottom: sizing.scale500,
    paddingLeft: sizing.scale600,
    paddingRight: sizing.scale600
  };
});
exports.StyledCalendarContainer = StyledCalendarContainer;
StyledCalendarContainer.displayName = "StyledCalendarContainer";
var StyledSelectorContainer = (0, _index.styled)('div', function (props) {
  return {
    marginBottom: props.$theme.sizing.scale600,
    paddingLeft: props.$theme.sizing.scale600,
    paddingRight: props.$theme.sizing.scale600,
    textAlign: 'left'
  };
});
exports.StyledSelectorContainer = StyledSelectorContainer;
StyledSelectorContainer.displayName = "StyledSelectorContainer";
var StyledCalendarHeader = (0, _index.styled)('div', function (props) {
  var _props$$theme2 = props.$theme,
      borders = _props$$theme2.borders,
      colors = _props$$theme2.colors,
      sizing = _props$$theme2.sizing;
  return {
    color: colors.white,
    display: 'flex',
    justifyContent: 'space-between',
    alignItems: 'center',
    paddingTop: sizing.scale500,
    paddingBottom: sizing.scale500,
    paddingLeft: sizing.scale600,
    paddingRight: sizing.scale600,
    backgroundColor: colors.primary,
    borderTopLeftRadius: borders.surfaceBorderRadius,
    borderTopRightRadius: borders.surfaceBorderRadius,
    borderBottomRightRadius: 0,
    borderBottomLeftRadius: 0
  };
});
exports.StyledCalendarHeader = StyledCalendarHeader;
StyledCalendarHeader.displayName = "StyledCalendarHeader";
var StyledMonthHeader = (0, _index.styled)('div', function (props) {
  return {
    color: props.$theme.colors.white,
    backgroundColor: props.$theme.colors.primary,
    whiteSpace: 'nowrap'
  };
});
exports.StyledMonthHeader = StyledMonthHeader;
StyledMonthHeader.displayName = "StyledMonthHeader";
var StyledMonthYearSelectButton = (0, _index.styled)('button', function (props) {
  return _objectSpread({}, props.$theme.typography.font400, {
    alignItems: 'center',
    backgroundColor: 'transparent',
    borderWidth: 0,
    color: props.$theme.colors.mono100,
    cursor: 'pointer',
    display: 'flex',
    ':focus': {
      backgroundColor: props.$theme.colors.primary500
    }
  });
});
exports.StyledMonthYearSelectButton = StyledMonthYearSelectButton;
StyledMonthYearSelectButton.displayName = "StyledMonthYearSelectButton";
var StyledMonthYearSelectIconContainer = (0, _index.styled)('span', function (props) {
  return {
    alignItems: 'center',
    display: 'flex',
    marginLeft: props.$theme.sizing.scale500
  };
});
exports.StyledMonthYearSelectIconContainer = StyledMonthYearSelectIconContainer;
StyledMonthYearSelectIconContainer.displayName = "StyledMonthYearSelectIconContainer";

function getArrowBtnStyle(_ref) {
  var $theme = _ref.$theme,
      $disabled = _ref.$disabled;
  return {
    boxSizing: 'border-box',
    height: '22px',
    color: $disabled ? $theme.colors.datepickerDayFontDisabled : $theme.colors.white,
    cursor: $disabled ? 'default' : 'pointer',
    backgroundColor: 'transparent',
    borderWidth: 0,
    paddingTop: '3px',
    paddingBottom: '3px',
    paddingLeft: '3px',
    paddingRight: '3px',
    outline: 'none',
    ':focus': $disabled ? {} : {
      backgroundColor: $theme.colors.primary500,
      borderTopLeftRadius: $theme.borders.surfaceBorderRadius,
      borderTopRightRadius: $theme.borders.surfaceBorderRadius,
      borderBottomRightRadius: $theme.borders.surfaceBorderRadius,
      borderBottomLeftRadius: $theme.borders.surfaceBorderRadius
    }
  };
}

var StyledPrevButton = (0, _index.styled)('button', getArrowBtnStyle);
exports.StyledPrevButton = StyledPrevButton;
StyledPrevButton.displayName = "StyledPrevButton";
var StyledNextButton = (0, _index.styled)('button', getArrowBtnStyle);
exports.StyledNextButton = StyledNextButton;
StyledNextButton.displayName = "StyledNextButton";
var StyledMonth = (0, _index.styled)('div', function (props) {
  return {
    display: 'inline-block'
  };
});
exports.StyledMonth = StyledMonth;
StyledMonth.displayName = "StyledMonth";
var StyledWeek = (0, _index.styled)('div', function (props) {
  var sizing = props.$theme.sizing;
  return {
    whiteSpace: 'nowrap',
    display: 'flex',
    marginBottom: sizing.scale100
  };
});
exports.StyledWeek = StyledWeek;
StyledWeek.displayName = "StyledWeek";

function getBorderRadius(left, right) {
  return {
    borderTopLeftRadius: left,
    borderBottomLeftRadius: left,
    borderTopRightRadius: right,
    borderBottomRightRadius: right
  };
}

function calculateBorderRadius(props) {
  var $isHighlighted = props.$isHighlighted,
      $pseudoHighlighted = props.$pseudoHighlighted,
      $pseudoSelected = props.$pseudoSelected,
      $selected = props.$selected,
      $startDate = props.$startDate,
      $range = props.$range,
      $hasRangeHighlighted = props.$hasRangeHighlighted,
      $hasRangeOnRight = props.$hasRangeOnRight,
      $hasRangeSelected = props.$hasRangeSelected,
      borders = props.$theme.borders;

  if (borders.useRoundedCorners) {
    if ($selected) {
      if (!$range) {
        return getBorderRadius(borders.radius200, borders.radius200);
      } else {
        if ($hasRangeSelected) {
          return $startDate ? getBorderRadius(borders.radius200, 0) : getBorderRadius(0, borders.radius200);
        } else {
          if ($hasRangeHighlighted) {
            return $hasRangeOnRight ? getBorderRadius(borders.radius200, 0) : getBorderRadius(0, borders.radius200);
          } else {
            return getBorderRadius(borders.radius200, borders.radius200);
          }
        }
      }
    } else {
      if (!$isHighlighted && ($pseudoHighlighted || $pseudoSelected)) {
        return getBorderRadius(0, 0);
      } else {
        if ($isHighlighted) {
          if (!$range) {
            return getBorderRadius(borders.radius200, borders.radius200);
          } else if ($hasRangeHighlighted) {
            return $hasRangeOnRight ? getBorderRadius(0, borders.radius200) : getBorderRadius(borders.radius200, 0);
          } else {
            return $pseudoSelected ? getBorderRadius(0, 0) : getBorderRadius(borders.radius200, borders.radius200);
          }
        } else {
          return !$pseudoSelected ? getBorderRadius(borders.radius200, borders.radius200) : null;
        }
      }
    }
  } else {
    return getBorderRadius(0, 0);
  }
}

var StyledDay = (0, _index.styled)('div', function (props) {
  var $disabled = props.$disabled,
      $isHeader = props.$isHeader,
      $isHovered = props.$isHovered,
      $isHighlighted = props.$isHighlighted,
      $outsideMonth = props.$outsideMonth,
      $pseudoHighlighted = props.$pseudoHighlighted,
      $pseudoSelected = props.$pseudoSelected,
      $selected = props.$selected,
      _props$$theme3 = props.$theme,
      colors = _props$$theme3.colors,
      sizing = _props$$theme3.sizing,
      borders = _props$$theme3.borders;
  return _objectSpread({
    boxSizing: 'border-box',
    position: 'relative',
    cursor: $disabled || $isHeader ? 'default' : 'pointer',
    display: 'inline-block',
    width: sizing.scale1000,
    height: sizing.scale1000,
    lineHeight: sizing.scale800,
    textAlign: 'center',
    paddingTop: sizing.scale300,
    paddingBottom: sizing.scale300,
    paddingLeft: sizing.scale200,
    paddingRight: sizing.scale200,
    marginTop: 0,
    marginBottom: 0,
    marginLeft: 0,
    marginRight: 0,
    color: $selected ? colors.white : $outsideMonth || $disabled ? colors.datepickerDayFontDisabled : 'inherit',
    backgroundColor: $selected ? $isHighlighted ? colors.primary500 : colors.primary : $pseudoSelected ? $isHighlighted ? colors.datepickerDayPseudoHighlighted : colors.datepickerDayPseudoSelected : $isHovered || $isHighlighted || $pseudoHighlighted ? colors.datepickerDayPseudoSelected : 'transparent'
  }, calculateBorderRadius(props), {
    ':first-child': _objectSpread({}, borders.useRoundedCorners ? {
      borderTopLeftRadius: borders.radius200,
      borderBottomLeftRadius: borders.radius200
    } : {}),
    ':last-child': _objectSpread({}, borders.useRoundedCorners ? {
      borderTopRightRadius: borders.radius200,
      borderBottomRightRadius: borders.radius200
    } : {})
  });
});
exports.StyledDay = StyledDay;
StyledDay.displayName = "StyledDay";