"use strict";var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.DateRangePickerStart = exports.DateRangePickerEnd = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireWildcard(require("react"));

var _useLocaleForControl = require("../../lib/locale/useLocaleForControl");

var _DateInput = require("../DateInput");
var _ResponsiveLayout = require("../ResponsiveLayout");
var _forwardRefAndName = require("../../lib/forwardRefAndName");
var _utils = require("../../lib/utils");

var _DateRangePickerContext = require("./DateRangePickerContext");
var _DateRangePicker = require("./DateRangePicker");
var _locale = require("./locale");











var DateRangePickerInput = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
  var _useContext =



















    (0, _react.useContext)(_DateRangePickerContext.DateRangePickerContext),minDate = _useContext.minDate,maxDate = _useContext.maxDate,startValue = _useContext.startValue,endValue = _useContext.endValue,size = _useContext.size,setStartValue = _useContext.setStartValue,setStartOptional = _useContext.setStartOptional,setStartDisabled = _useContext.setStartDisabled,setEndValue = _useContext.setEndValue,setEndOptional = _useContext.setEndOptional,setEndDisabled = _useContext.setEndDisabled,setMinDate = _useContext.setMinDate,setMaxDate = _useContext.setMaxDate,setFocusInput = _useContext.setFocusInput,open = _useContext.open,close = _useContext.close,dateRangePickerRef = _useContext.dateRangePickerRef,startRef = _useContext.startRef,endRef = _useContext.endRef;
  var isStart = props.type === 'start';
  var isEnd = props.type === 'end';
  var locale = (0, _useLocaleForControl.useLocaleForControl)('DateRangePicker', _locale.DateRangePickerLocaleHelper);

  var _useResponsiveLayout = (0, _ResponsiveLayout.useResponsiveLayout)(),isMobile = _useResponsiveLayout.isMobile;

  (0, _react.useImperativeHandle)(ref, function () {return isStart ? startRef.current : endRef.current;}, []);

  (0, _react.useEffect)(function () {
    if (isStart && startValue !== props.value) {
      setStartValue(props.value || '');
    } else if (isEnd && endValue !== props.value) {
      setEndValue(props.value || '');
    }
  }, [props.value]);

  (0, _react.useEffect)(function () {
    if (isStart) {
      setStartOptional(props.optional || false);
      setStartDisabled(props.disabled || false);
      setMinDate(props.minDate || '');
    } else if (isEnd) {
      setEndOptional(props.optional || false);
      setEndDisabled(props.disabled || false);
      setMaxDate(props.maxDate || '');
    }
  }, [props.optional, props.disabled, props.minDate, props.maxDate]);

  (0, _react.useEffect)(function () {
    if (isStart && startValue !== props.value && (0, _utils.isNonNullable)(startValue)) {
      props.onValueChange == null || props.onValueChange(startValue);
    }
  }, [startValue]);

  (0, _react.useEffect)(function () {
    if (isEnd && endValue !== props.value && (0, _utils.isNonNullable)(endValue)) {
      props.onValueChange == null || props.onValueChange(endValue);
    }
  }, [endValue]);

  var commonProps = (0, _extends2.default)({
    withIcon: true,
    size: size,
    minDate: minDate,
    maxDate: maxDate },
  props, {
    onValueChange: function onValueChange(value) {
      if (isStart) {
        setStartValue(value || '');
      } else if (isEnd) {
        setEndValue(value || '');
      }
    },
    onClick: function onClick(e) {
      if (props.disabled) {
        return;
      }
      open(props.type);
      props.onClick == null || props.onClick(e);
    },
    onFocus: function onFocus(e) {
      open(props.type);
      props.onFocus == null || props.onFocus(e);
    },
    onBlur: function onBlur(e) {var _dateRangePickerRef$c;
      props.onBlur == null || props.onBlur(e);

      if (isMobile) {
        return;
      }
      var nextFocusedElement = e.relatedTarget;
      if (!((_dateRangePickerRef$c = dateRangePickerRef.current) != null && _dateRangePickerRef$c.contains(nextFocusedElement))) {
        close();
      }
      setFocusInput(null);
    } });


  switch (props.type) {
    case 'start':
      return /*#__PURE__*/(
        _react.default.createElement(_DateInput.DateInput, (0, _extends2.default)({},
        commonProps, {
          value: props.value || '',
          "data-tid": props['data-tid'] || _DateRangePicker.DateRangePickerDataTids.start,
          "aria-label": props['aria-label'] || locale.startDateLabel,
          ref: startRef })
        ));

    case 'end':
      return /*#__PURE__*/(
        _react.default.createElement(_DateInput.DateInput, (0, _extends2.default)({},
        commonProps, {
          value: props.value || '',
          "data-tid": props['data-tid'] || _DateRangePicker.DateRangePickerDataTids.end,
          "aria-label": props['aria-label'] || locale.endDateLabel,
          ref: endRef })
        ));

  }
});

var DateRangePickerStart = exports.DateRangePickerStart = (0, _forwardRefAndName.forwardRefAndName)(
  'DateRangePickerStart',
  function (props, ref) {return /*#__PURE__*/(
      _react.default.createElement(DateRangePickerInput, (0, _extends2.default)({ type: "start" }, props, { ref: ref })));}

);

var DateRangePickerEnd = exports.DateRangePickerEnd = (0, _forwardRefAndName.forwardRefAndName)(
  'DateRangePickerEnd',
  function (props, ref) {return /*#__PURE__*/(
      _react.default.createElement(DateRangePickerInput, (0, _extends2.default)({ type: "end" }, props, { ref: ref })));}

);