import _isNil from "ramda/src/isNil";
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
import React, { useRef, useMemo } from 'react';
import styled from 'styled-components';
import { addMonths, isFirstDayOfMonth, isLastDayOfMonth, isSameDay, isSameMonth, isWithinInterval } from 'date-fns';
import { Box, Flexbox, Typography } from '../../../..';
import { getCalendar, getLocale } from '../../shared/dateUtils';
import { DOUBLE_CALENDAR_GUTTER, NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE } from '../../shared/constants';
import CalendarDay from '../../shared/components/CalendarDay';
import { useFocusedDate } from '../../shared/hooks';
export var StyledBox = styled(Box).withConfig({
  displayName: "DoubleCalendar__StyledBox",
  componentId: "sc-dj1ati-0"
})(["border:1px solid transparent;min-width:", "px;text-align:center;margin-bottom:", "px;margin-top:", "px;"], function (_ref) {
  var theme = _ref.theme;
  return theme.spacing.unit(10);
}, function (_ref2) {
  var theme = _ref2.theme;
  return theme.spacing.unit(2);
}, function (_ref3) {
  var theme = _ref3.theme;
  return theme.spacing.unit(3);
});
var HiddenDate = styled.div.withConfig({
  displayName: "DoubleCalendar__HiddenDate",
  componentId: "sc-dj1ati-1"
})(["min-width:", "px;min-height:", "px;margin:", "px 0;", ""], function (_ref4) {
  var theme = _ref4.theme;
  return theme.spacing.unit(10) + 2;
}, function (_ref5) {
  var theme = _ref5.theme;
  return theme.spacing.unit(10) + 2;
}, function (_ref6) {
  var theme = _ref6.theme;
  return theme.spacing.unit(0.5);
}, function (_ref7) {
  var $withGutter = _ref7.$withGutter;
  return $withGutter ? "margin-right: ".concat(DOUBLE_CALENDAR_GUTTER, "px;") : '';
});
var StyledCalendarContainer = styled(Flexbox).withConfig({
  displayName: "DoubleCalendar__StyledCalendarContainer",
  componentId: "sc-dj1ati-2"
})(["", ""], function (_ref8) {
  var $withGutter = _ref8.$withGutter;
  return $withGutter ? "margin-right: ".concat(DOUBLE_CALENDAR_GUTTER, "px;") : '';
});
var DoubleCalendar = function DoubleCalendar(_ref9) {
  var _calendar$weekDays, _calendar$dates;
  var disableDate = _ref9.disableDate,
    enableDate = _ref9.enableDate,
    locale = _ref9.locale,
    viewedDate = _ref9.viewedDate,
    _onClick = _ref9.onClick,
    selectedStartDate = _ref9.selectedStartDate,
    selectedEndDate = _ref9.selectedEndDate,
    onMonthChange = _ref9.onMonthChange;
  var calendarRef = useRef(null);
  var dateIsDisabled = function dateIsDisabled(dateToCheck) {
    var isEnabled = dateToCheck && (enableDate === null || enableDate === void 0 ? void 0 : enableDate(dateToCheck));
    var isDisabled = dateToCheck && (disableDate === null || disableDate === void 0 ? void 0 : disableDate(dateToCheck));
    if (_isNil(isEnabled) && _isNil(isDisabled)) return false;
    if (_isNil(isEnabled)) return isDisabled;
    if (_isNil(isDisabled)) return !isEnabled;
    return false;
  };
  var leftViewedDate = viewedDate;
  var rightViewedDate = addMonths(leftViewedDate, 1);
  var localeObj = getLocale(locale);
  var calendar = useMemo(function () {
    var _leftCalendar$dates;
    var leftCalendar = getCalendar(viewedDate, {
      locale: localeObj
    });
    var rightCalendar = getCalendar(addMonths(viewedDate, 1), {
      locale: localeObj
    });
    return {
      weekDays: [].concat(_toConsumableArray(leftCalendar === null || leftCalendar === void 0 ? void 0 : leftCalendar.weekDays), _toConsumableArray(rightCalendar === null || rightCalendar === void 0 ? void 0 : rightCalendar.weekDays)),
      dates: leftCalendar === null || leftCalendar === void 0 || (_leftCalendar$dates = leftCalendar.dates) === null || _leftCalendar$dates === void 0 ? void 0 : _leftCalendar$dates.map(function (leftWeek, index) {
        return [].concat(_toConsumableArray(leftWeek), _toConsumableArray(rightCalendar === null || rightCalendar === void 0 ? void 0 : rightCalendar.dates[index]));
      })
    };
  }, [localeObj, viewedDate]);
  var _useFocusedDate = useFocusedDate({
      calendarRef: calendarRef,
      viewedDate: viewedDate,
      calendar: calendar,
      onMonthChange: onMonthChange,
      dateIsDisabled: dateIsDisabled,
      onSelectDate: _onClick
    }),
    focusedDate = _useFocusedDate.focusedDate,
    handleKeyPress = _useFocusedDate.handleKeyPress,
    handleFocus = _useFocusedDate.handleFocus;
  return React.createElement(Flexbox, {
    ref: calendarRef,
    container: true,
    direction: "row",
    justifyContent: "space-between"
  }, React.createElement(Flexbox, {
    container: true,
    direction: "column",
    "aria-hidden": true
  }, React.createElement(Flexbox, {
    container: true
  }, calendar === null || calendar === void 0 || (_calendar$weekDays = calendar.weekDays) === null || _calendar$weekDays === void 0 ? void 0 : _calendar$weekDays.map(function (n, index) {
    return React.createElement(StyledCalendarContainer, {
      item: true,
      justifyContent: "center",
      alignItems: "center",
      key: "".concat(n, "-").concat(index < NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE ? 'left' : 'right'),
      $withGutter: index === NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE - 1
    }, React.createElement(StyledBox, null, React.createElement(Typography, {
      type: "tertiary"
    }, n)));
  })), calendar === null || calendar === void 0 || (_calendar$dates = calendar.dates) === null || _calendar$dates === void 0 ? void 0 : _calendar$dates.map(function () {
    var week = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
    var weekIndex = arguments.length > 1 ? arguments[1] : undefined;
    return React.createElement(Flexbox, {
      container: true,
      justifyContent: "flex-start",
      key: week.toString()
    }, week === null || week === void 0 ? void 0 : week.map(function (day, dayIndex) {
      var _calendar$dates2;
      var hideDate = !isSameMonth(leftViewedDate, day) && isSameMonth(rightViewedDate, day) && dayIndex < NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE || !isSameMonth(rightViewedDate, day) && isSameMonth(leftViewedDate, day) && dayIndex >= NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE;
      return hideDate ? React.createElement(HiddenDate, {
        key: day.toString(),
        $withGutter: dayIndex === NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE - 1,
        "aria-hidden": true
      }) : React.createElement(CalendarDay, {
        withGutter: dayIndex === NUMBER_OF_VISIBLE_WEEKDAYS_SINGLE - 1,
        onFocus: function onFocus() {
          handleFocus(day);
        },
        focused: !!focusedDate && isSameDay(day, focusedDate),
        key: day.toString(),
        date: day,
        disabled: !!dateIsDisabled(day),
        onClick: function onClick() {
          if (!dateIsDisabled(day)) _onClick(day);
        },
        onKeyDown: handleKeyPress,
        selected: selectedStartDate && isSameDay(selectedStartDate, day) || selectedEndDate && isSameDay(selectedEndDate, day),
        sameMonth: isSameMonth(leftViewedDate, day) || isSameMonth(rightViewedDate, day),
        locale: localeObj,
        isWithinRange: function () {
          if (selectedStartDate && selectedEndDate && selectedStartDate < selectedEndDate) return isWithinInterval(day, {
            start: selectedStartDate,
            end: selectedEndDate
          });
          if (selectedStartDate && selectedEndDate && selectedStartDate > selectedEndDate) return isWithinInterval(day, {
            start: selectedEndDate,
            end: selectedStartDate
          });
          return false;
        }(),
        isFirstDay: weekIndex === 0 && dayIndex === 0 || isFirstDayOfMonth(day) && isSameMonth(rightViewedDate, day),
        isLastDay: weekIndex === (calendar === null || calendar === void 0 || (_calendar$dates2 = calendar.dates) === null || _calendar$dates2 === void 0 ? void 0 : _calendar$dates2.length) - 1 && dayIndex === week.length - 1 || isLastDayOfMonth(day) && isSameMonth(leftViewedDate, day)
      });
    }));
  })));
};
export default DoubleCalendar;