"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.MobilePickerDataTids = exports.MobilePicker = void 0;var _react = _interopRequireWildcard(require("react"));

var _Calendar = require("../Calendar");
var _CalendarUtils = require("../Calendar/CalendarUtils");
var _ThemeContext = require("../../lib/theming/ThemeContext");
var _MobilePopup = require("../../internal/MobilePopup");
var _DateInput = require("../DateInput");
var _Button = require("../Button");
var _useLocaleForControl = require("../../lib/locale/useLocaleForControl");


var _locale = require("./locale");
var _MobilePicker = require("./MobilePicker.styles");
var _getMobilePickerTheme = require("./getMobilePickerTheme");

var MobilePickerDataTids = exports.MobilePickerDataTids = {
  input: 'MobilePicker__input',
  today: 'MobilePicker__today'
};


















var MobilePicker = exports.MobilePicker = function MobilePicker(props) {
  var locale = (0, _useLocaleForControl.useLocaleForControl)('DatePicker', _locale.DatePickerLocaleHelper);
  var theme = (0, _getMobilePickerTheme.getMobilePickerTheme)((0, _react.useContext)(_ThemeContext.ThemeContext));

  var calendarRef = (0, _react.useRef)(null);
  var inputRef = (0, _react.useRef)(null);

  var _useState = (0, _react.useState)(function () {return (0, _CalendarUtils.getTodayDate)();}),_useState$ = _useState[0],monthNative = _useState$.month,year = _useState$.year;
  var month = (0, _CalendarUtils.getMonthInHumanFormat)(monthNative);

  var onValueChange = function onValueChange(date) {
    props.onValueChange == null || props.onValueChange(date);
    props.onCloseRequest == null || props.onCloseRequest();
  };

  (0, _react.useLayoutEffect)(function () {
    // fix DateInput flushSync warning in React 18
    setTimeout(function () {var _inputRef$current;
      (_inputRef$current = inputRef.current) == null || _inputRef$current.focus();
    });
  }, []);

  var onTodayClick = function onTodayClick() {
    if (calendarRef.current) {
      calendarRef.current.scrollToMonth(month, year);
    }
  };

  return /*#__PURE__*/(
    _react.default.createElement(_ThemeContext.ThemeContext.Provider, { value: theme }, /*#__PURE__*/
    _react.default.createElement(_MobilePopup.MobilePopup, {
      opened: true,
      headerChildComponent: /*#__PURE__*/
      _react.default.createElement(_DateInput.DateInput, {
        value: props.value || '',
        width: "100%",
        withIcon: true,
        ref: inputRef,
        minDate: props.minDate,
        maxDate: props.maxDate,
        onValueChange: props.onValueChange,
        size: "medium",
        warning: props.warning,
        error: props.error,
        "data-tid": MobilePickerDataTids.input }
      ),

      footerChildComponent:
      props.enableTodayLink && /*#__PURE__*/
      _react.default.createElement(_Button.Button, { size: "medium", onClick: onTodayClick, "data-tid": MobilePickerDataTids.today },
      locale.today
      ),


      onCloseRequest: props.onCloseRequest }, /*#__PURE__*/

    _react.default.createElement(_Calendar.Calendar, {
      ref: calendarRef,
      value: props.value,
      className: _MobilePicker.styles.calendarRoot(),
      minDate: props.minDate,
      maxDate: props.maxDate,
      onValueChange: onValueChange,
      isHoliday: props.isHoliday,
      renderDay: props.renderDay,
      onMonthChange: props.onMonthChange }
    )
    )
    ));

};