"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = exports.VIEW_MODE_TYPE = exports.VIEW_MODE = exports.INITIAL_DIRECTION = exports.ANCHOR_TYPES = void 0;
var _react = _interopRequireWildcard(require("react"));
var _dropdown = require("../dropdown");
var _useTranslation = require("../hooks/use-translation");
var _datetimeRangePickerButton = _interopRequireDefault(require("./datetime-range-picker-button"));
var _datetimeRangePickerPanel = _interopRequireWildcard(require("./datetime-range-picker-panel"));
var _datetimeRangePickerInput = _interopRequireDefault(require("./datetime-range-picker-input"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
const ANCHOR_TYPES = exports.ANCHOR_TYPES = {
  BUTTON: 'button',
  INPUT: 'input'
};
const VIEW_MODE_TYPE = exports.VIEW_MODE_TYPE = {
  DAYS: 'days',
  MONTHS: 'months',
  TIME: 'time',
  YEARS: 'years'
};
const VIEW_MODE = exports.VIEW_MODE = [VIEW_MODE_TYPE.DAYS, VIEW_MODE_TYPE.MONTHS, VIEW_MODE_TYPE.TIME, VIEW_MODE_TYPE.YEARS];
const INITIAL_DIRECTION = exports.INITIAL_DIRECTION = {
  PAST: 'past',
  FUTURE: 'future'
};
/**
 * Display two datetime pickers side-by-side for selecting a range
 * @midnight-gray-supported
 * @alpine-light-supported
 * */
function DateRangePicker({
  onUpdate,
  validateOnChange,
  validateOnClick,
  start,
  end,
  minStart,
  maxEnd,
  sameDateError,
  labelFormat,
  anchorType = ANCHOR_TYPES.BUTTON,
  buttonText,
  cancelButtonText,
  resetText,
  dateFormat = 'YYYY-MM-DD',
  timeFormat = 'HH:mm',
  initialDirection = INITIAL_DIRECTION.PAST,
  initialViewMode = VIEW_MODE_TYPE.DAYS,
  placement = _dropdown.DROPDOWN_PLACEMENT_TYPES.TOP_START,
  showTimeZoneSuffix = true,
  isDisabled,
  utcSuffix,
  dateStartInputAriaLabel,
  dateEndInputAriaLabel
}) {
  const {
    t
  } = (0, _useTranslation.useTranslation)();
  const utcSuffixValue = utcSuffix ?? t('UTC');
  const dateStartInputAriaLabelValue = dateStartInputAriaLabel ?? t('Start date');
  const dateEndInputAriaLabelValue = dateEndInputAriaLabel ?? t('End date');
  function handleSuccessfulUpdate(updatedStart, updatedEnd) {
    onUpdate(updatedStart, updatedEnd);
  }
  const [initialTargetInput, setInitialTargetInput] = (0, _react.useState)(_datetimeRangePickerPanel.DATE_RANGE_INPUT_TYPES.START);
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_dropdown.Dropdown, {
    contentClassName: "datetime-range-picker-panel",
    placement: placement,
    hasCustomFocusHandling: true,
    shouldCloseDropdownOnEsc: true,
    renderAnchor: ({
      ref,
      onClick,
      isOpen
    }) => anchorType === ANCHOR_TYPES.INPUT ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_datetimeRangePickerInput.default, {
      ref: ref,
      onClick: ({
        originalEvent,
        targetInput = _datetimeRangePickerPanel.DATE_RANGE_INPUT_TYPES.START,
        openedWithKeyboard
      }) => {
        if (isDisabled) {
          return;
        }
        setInitialTargetInput(targetInput);
        onClick(originalEvent, openedWithKeyboard);
      },
      start: start,
      end: end,
      labelFormat: labelFormat,
      dateFormat: dateFormat,
      timeFormat: timeFormat,
      showTimeZoneSuffix: showTimeZoneSuffix,
      isDisabled: isOpen || isDisabled,
      utcSuffix: utcSuffixValue,
      dateStartInputAriaLabel: dateStartInputAriaLabelValue,
      dateEndInputAriaLabel: dateEndInputAriaLabelValue
    }) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_datetimeRangePickerButton.default, {
      ref: ref,
      onClick: onClick,
      isOpen: isOpen,
      isDisabled: isDisabled,
      start: start,
      end: end,
      labelFormat: labelFormat,
      dateFormat: dateFormat,
      timeFormat: timeFormat,
      showTimeZoneSuffix: showTimeZoneSuffix,
      utcSuffix: utcSuffixValue
    }),
    children: ({
      closeDropdown
    }) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_datetimeRangePickerPanel.default, {
      buttonText: buttonText ?? t('Update window'),
      defaultStart: start,
      defaultEnd: end,
      minStart: minStart,
      maxEnd: maxEnd,
      sameDateError: sameDateError,
      dateFormat: dateFormat,
      timeFormat: timeFormat,
      initialViewMode: initialViewMode,
      initialDirection: initialDirection,
      onSubmit: (newStart, newEnd) => {
        handleSuccessfulUpdate(newStart, newEnd);
        closeDropdown();
      },
      onDismiss: closeDropdown,
      validateOnClick: validateOnClick,
      validateOnChange: validateOnChange,
      resetText: resetText ?? t('Reset to initial value'),
      cancelButtonText: cancelButtonText ?? t('Cancel'),
      utcSuffix: utcSuffixValue,
      initialTargetInput: initialTargetInput,
      dateStartInputAriaLabel: dateStartInputAriaLabelValue,
      dateEndInputAriaLabel: dateEndInputAriaLabelValue
    })
  });
}
var _default = exports.default = DateRangePicker;