function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure 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 _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; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { useState, useEffect, useRef } from 'react';
import { InputAndLabel } from '@filerobot/common';
import getDateString from '@filerobot/utils/lib/getDateString';
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
var oneDay = 60 * 60 * 24 * 1000;
var todayTimestamp = Date.now() - Date.now() % oneDay + new Date().getTimezoneOffset() * 1000 * 60;
var MyDatePicker = function MyDatePicker(props) {
  var _useState = useState(function () {
      return new Date().getFullYear();
    }),
    _useState2 = _slicedToArray(_useState, 2),
    year = _useState2[0],
    setYear = _useState2[1];
  var _useState3 = useState(function () {
      return new Date().getMonth();
    }),
    _useState4 = _slicedToArray(_useState3, 2),
    month = _useState4[0],
    setMonth = _useState4[1];
  var _useState5 = useState(function () {
      return todayTimestamp;
    }),
    _useState6 = _slicedToArray(_useState5, 2),
    selectedDay = _useState6[0],
    setSelectedDay = _useState6[1];
  var _useState7 = useState(false),
    _useState8 = _slicedToArray(_useState7, 2),
    showDatePicker = _useState8[0],
    setShowDatePicker = _useState8[1];
  var _useState9 = useState(0),
    _useState10 = _slicedToArray(_useState9, 2),
    menuHeight = _useState10[0],
    setMenuHeight = _useState10[1];
  var wrapper = useRef();
  var inputRef = useRef();
  var iconRef = useRef();
  var datePickerRef = useRef();
  var getDayDetails = function getDayDetails(args) {
    var daysMap = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
    var date = args.index - args.firstDay;
    var day = args.index % 7;
    var prevMonth = args.month - 1;
    var prevYear = args.year;
    if (prevMonth < 0) {
      prevMonth = 11;
      prevYear--;
    }
    var prevMonthNumberOfDays = getNumberOfDays(prevYear, prevMonth);
    var _date = (date < 0 ? prevMonthNumberOfDays + date : date % args.numberOfDays) + 1;
    var month = date < 0 ? -1 : date >= args.numberOfDays ? 1 : 0;
    var timestamp = new Date(args.year, args.month, _date).getTime();
    return {
      date: _date,
      day: day,
      month: month,
      timestamp: timestamp,
      dayString: daysMap[day]
    };
  };
  var getNumberOfDays = function getNumberOfDays(year, month) {
    return 40 - new Date(year, month, 40).getDate();
  };
  var getMonthDetails = function getMonthDetails(year, month) {
    var firstDay = new Date(year, month).getDay();
    var numberOfDays = getNumberOfDays(year, month);
    var monthArray = [];
    var rows = 6;
    var currentDay = null;
    var index = 0;
    var cols = 7;
    for (var row = 0; row < rows; row++) {
      for (var col = 0; col < cols; col++) {
        currentDay = getDayDetails({
          index: index,
          numberOfDays: numberOfDays,
          firstDay: firstDay,
          year: year,
          month: month
        });
        monthArray.push(currentDay);
        index++;
      }
    }
    return monthArray;
  };
  var _useState11 = useState(function () {
      return getMonthDetails(year, month);
    }),
    _useState12 = _slicedToArray(_useState11, 2),
    monthDetails = _useState12[0],
    setMonthDetails = _useState12[1];
  useEffect(function () {
    setDateToInput(selectedDay);
  }, []);
  useEffect(function () {
    getMenuHeight();
  }, [showDatePicker]);
  useEffect(function () {
    setDateToInput(selectedDay.timestamp);
  }, [selectedDay]);
  useEffect(function () {
    var closeDatePicker = function closeDatePicker(e) {
      var _iconRef$current, _datePickerRef$curren;
      if (!((_iconRef$current = iconRef.current) !== null && _iconRef$current !== void 0 && _iconRef$current.contains(e.target)) && !((_datePickerRef$curren = datePickerRef.current) !== null && _datePickerRef$curren !== void 0 && _datePickerRef$curren.contains(e.target))) {
        e.preventDefault();
        e.stopPropagation();
        setShowDatePicker(false);
      }
    };
    document.addEventListener('click', closeDatePicker);
    return function () {
      document.removeEventListener('click', closeDatePicker);
    };
  }, []);
  var getMenuHeight = function getMenuHeight() {
    var _document$querySelect, _document$querySelect2;
    var height = (_document$querySelect = document.querySelector('.filerobot-common-datePicker-container')) === null || _document$querySelect === void 0 ? void 0 : (_document$querySelect2 = _document$querySelect.getBoundingClientRect()) === null || _document$querySelect2 === void 0 ? void 0 : _document$querySelect2.height;
    setMenuHeight(height);
  };
  var getMenuPosition = function getMenuPosition() {
    return menuHeight + props.top >= props.containerHeight ? {
      bottom: 45
    } : {
      top: 45
    };
  };
  var showADatePicker = function showADatePicker(e) {
    props.getParentPosition(e);
    e.preventDefault();
    e.stopPropagation();
    setShowDatePicker(!showDatePicker);
  };
  var isCurrentDay = function isCurrentDay(day) {
    return day.timestamp === todayTimestamp;
  };
  var isSelectedDay = function isSelectedDay(day) {
    return day.timestamp === selectedDay;
  };
  var getDateFromDateString = function getDateFromDateString(dateValue) {
    var dateData = dateValue.split('-').map(function (d) {
      return parseInt(d, 10);
    });
    if (dateData.length < 3) {
      return null;
    }
    var year = dateData[0];
    var month = dateData[1];
    var date = dateData[2];
    return {
      year: year,
      month: month,
      date: date
    };
  };
  var getMonthStr = function getMonthStr(month) {
    var monthMap = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
    return monthMap[Math.max(Math.min(11, month), 0)] || 'Month';
  };
  var getDateStringFromTimestamp = function getDateStringFromTimestamp(timestamp) {
    var dateObject = new Date(timestamp);
    var month = dateObject.getMonth() + 1;
    var date = dateObject.getDate();
    return dateObject.getFullYear() + '-' + (month < 10 ? '0' + month : month) + '-' + (date < 10 ? '0' + date : date);
  };
  var setDate = function setDate(dateData) {
    var selectedDay = new Date(dateData.year, dateData.month - 1, dateData.date).getTime();
    setSelectedDay(selectedDay);
    if (props.onChange) {
      props.onChange({}, getDateString('ymd', '-', selectedDay));
    }
  };
  var updateDateFromInput = function updateDateFromInput(e) {
    var dateData = getDateFromDateString(inputRef.current.value);
    if (dateData !== null) {
      setDate(dateData);
      setYear(dateData.year);
      setMonth(dateData.month - 1);
      setMonthDetails(getMonthDetails(dateData.year, dateData.month - 1));
    }
  };
  var setDateToInput = function setDateToInput(timestamp) {
    var dateString = getDateStringFromTimestamp(timestamp);

    // if no update from external value update internally
    if (inputRef && !props.onChange) {
      inputRef.current.value = dateString;
    }
  };
  var onDateClick = function onDateClick(day) {
    setSelectedDay(day.timestamp);
    if (props.onChange) {
      props.onChange({}, getDateStringFromTimestamp(day.timestamp));
    }
  };
  var setNewYear = function setNewYear(offset) {
    var newYear = year + offset;
    setYear(newYear);
    setMonthDetails(getMonthDetails(newYear, month));
  };
  var setNewMonth = function setNewMonth(offset) {
    var newYear = year;
    var newMonth = month + offset;
    if (month === -1) {
      newMonth = 11;
      newYear--;
    } else if (month === 12) {
      newMonth = 0;
      newYear++;
    }
    setYear(newYear);
    setMonth(newMonth);
    setMonthDetails(getMonthDetails(newYear, newMonth));
  };
  var renderCalendar = function renderCalendar() {
    var days = monthDetails.map(function (day, index) {
      return /*#__PURE__*/_jsx("div", {
        className: "filerobot-common-datePicker-calendar-day".concat(day.month !== 0 ? ' disabled' : '') + (isCurrentDay(day) ? ' highlight' : '') + (isSelectedDay(day) ? ' highlight-green' : ''),
        children: /*#__PURE__*/_jsx("div", {
          className: "filerobot-common-datePicker-calendar-day-container",
          children: /*#__PURE__*/_jsx("span", {
            onClick: function onClick() {
              return onDateClick(day);
            },
            children: day.date
          })
        })
      }, index);
    });
    return /*#__PURE__*/_jsxs("div", {
      className: "filerobot-common-datePicker-calendar",
      children: [/*#__PURE__*/_jsx("div", {
        className: "filerobot-common-datePicker-calendar-head",
        children: ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'].map(function (d, i) {
          return /*#__PURE__*/_jsx("div", {
            className: "filerobot-common-datePicker-calendar-head-name",
            children: d
          }, i);
        })
      }), /*#__PURE__*/_jsx("div", {
        className: "filerobot-common-datePicker-calendar-body",
        children: days
      })]
    });
  };
  var showLabel = typeof props.showLabel === 'boolean' ? props.showLabel : true;
  return /*#__PURE__*/_jsx(_Fragment, {
    children: /*#__PURE__*/_jsxs("div", {
      className: "filerobot-common-datePicker ".concat(props.classes ? "".concat(props.classes) : ''),
      style: props.isFilterOptions ? {
        position: 'unset'
      } : {},
      ref: wrapper,
      children: [/*#__PURE__*/_jsx("div", {
        className: "filerobot-common-datePicker-input",
        children: /*#__PURE__*/_jsx(InputAndLabel, {
          item: "date",
          type: "date",
          value: props.value,
          onChange: updateDateFromInput,
          onClick: showADatePicker,
          ref: inputRef,
          innerRef: iconRef,
          icon: props.icon,
          i18n: props.i18n,
          isFilterOptions: props.isFilterOptions,
          showLabel: showLabel
        })
      }), showDatePicker ? /*#__PURE__*/_jsxs("div", {
        className: "filerobot-common-datePicker-container",
        style: props.isFilterOptions ? {
          bottom: 99,
          left: 10
        } : getMenuPosition(),
        ref: datePickerRef,
        children: [/*#__PURE__*/_jsxs("div", {
          className: "filerobot-common-datePicker-container-head",
          children: [/*#__PURE__*/_jsx("div", {
            className: "filerobot-common-datePicker-container-head-button",
            children: /*#__PURE__*/_jsx("div", {
              className: "filerobot-common-datePicker-container-head-button-inner",
              onClick: function onClick() {
                return setNewYear(-1);
              },
              children: /*#__PURE__*/_jsx("span", {
                className: "mdpchbi-left-arrows"
              })
            })
          }), /*#__PURE__*/_jsx("div", {
            className: "filerobot-common-datePicker-container-head-button",
            children: /*#__PURE__*/_jsx("div", {
              className: "filerobot-common-datePicker-container-head-button-inner",
              onClick: function onClick() {
                return setNewMonth(-1);
              },
              children: /*#__PURE__*/_jsx("span", {
                className: "mdpchbi-left-arrow"
              })
            })
          }), /*#__PURE__*/_jsxs("div", {
            className: "filerobot-common-datePicker-container-head-body",
            children: [/*#__PURE__*/_jsx("div", {
              className: "filerobot-common-datePicker-container-head-body-year",
              children: year
            }), /*#__PURE__*/_jsx("div", {
              className: "filerobot-common-datePicker-container-head-body-month",
              children: getMonthStr(month)
            })]
          }), /*#__PURE__*/_jsx("div", {
            className: "filerobot-common-datePicker-container-head-button",
            children: /*#__PURE__*/_jsx("div", {
              className: "filerobot-common-datePicker-container-head-button-inner",
              onClick: function onClick() {
                return setNewMonth(1);
              },
              children: /*#__PURE__*/_jsx("span", {
                className: "mdpchbi-right-arrow"
              })
            })
          }), /*#__PURE__*/_jsx("div", {
            className: "filerobot-common-datePicker-container-head-button",
            onClick: function onClick() {
              return setNewYear(1);
            },
            children: /*#__PURE__*/_jsx("div", {
              className: "filerobot-common-datePicker-container-head-button-inner",
              children: /*#__PURE__*/_jsx("span", {
                className: "mdpchbi-right-arrows"
              })
            })
          })]
        }), /*#__PURE__*/_jsx("div", {
          className: "filerobot-common-datePicker-container-body",
          children: renderCalendar()
        })]
      }) : '']
    })
  });
};
export default MyDatePicker;