'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var _extends = require('@babel/runtime/helpers/extends');
var _slicedToArray = require('@babel/runtime/helpers/slicedToArray');
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
require('core-js/modules/es.symbol.js');
require('core-js/modules/es.array.concat.js');
require('core-js/modules/es.array.filter.js');
require('core-js/modules/es.array.map.js');
require('core-js/modules/es.object.get-own-property-descriptor.js');
require('core-js/modules/es.object.get-own-property-descriptors.js');
require('core-js/modules/es.object.keys.js');
require('core-js/modules/es.object.to-string.js');
require('core-js/modules/web.dom-collections.for-each.js');
var React = require('react');
var PropTypes = require('prop-types');
var react = require('@carbon/react');
var classnames = require('classnames');
var uuid = require('uuid');
var warning = require('warning');
var useLangDirection = require('../../utils/useLangDirection.js');
var TimePickerSpinner = require('../TimePickerSpinner/TimePickerSpinner.js');
var Settings = require('../../constants/Settings.js');
var dayjs = require('../../utils/dayjs.js');
var DateConstants = require('../../constants/DateConstants.js');
var Button = require('../Button/Button.js');
var FlyoutMenu = require('../FlyoutMenu/FlyoutMenu.js');
var componentUtilityFunctions = require('../../utils/componentUtilityFunctions.js');
var dateTimePickerUtils = require('./dateTimePickerUtils.js');
var iconsReact = require('@carbon/icons-react');

function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

var _extends__default = /*#__PURE__*/_interopDefault(_extends);
var _slicedToArray__default = /*#__PURE__*/_interopDefault(_slicedToArray);
var _defineProperty__default = /*#__PURE__*/_interopDefault(_defineProperty);
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefault(_objectWithoutProperties);
var React__default = /*#__PURE__*/_interopDefault(React);
var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
var classnames__default = /*#__PURE__*/_interopDefault(classnames);
var warning__default = /*#__PURE__*/_interopDefault(warning);

var _excluded = ["testId", "defaultValue", "dateTimeMask", "presets", "intervals", "relatives", "expanded", "disabled", "invalid", "showRelativeOption", "showCustomRangeLink", "hasTimeInput", "renderPresetTooltipText", "onCancel", "onApply", "i18n", "light", "locale", "timeZone", "hasIconOnly", "menuOffset", "renderInPortal", "useAutoPositioning", "style", "buttonProps"];
function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty__default.default(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
var iotPrefix = Settings.settings.iotPrefix,
  prefix = Settings.settings.prefix;
var DateTimePickerDefaultValuePropTypes = PropTypes__default.default.oneOfType([PropTypes__default.default.exact({
  timeRangeKind: PropTypes__default.default.oneOf([DateConstants.PICKER_KINDS.PRESET]).isRequired,
  timeRangeValue: PropTypes__default.default.exact({
    id: PropTypes__default.default.string,
    label: PropTypes__default.default.string.isRequired,
    /** offset is in minutes */
    offset: PropTypes__default.default.number.isRequired
  }).isRequired
}).isRequired, PropTypes__default.default.exact({
  timeRangeKind: PropTypes__default.default.oneOf([DateConstants.PICKER_KINDS.RELATIVE]).isRequired,
  timeRangeValue: PropTypes__default.default.exact({
    lastNumber: PropTypes__default.default.number.isRequired,
    lastInterval: PropTypes__default.default.string.isRequired,
    relativeToWhen: PropTypes__default.default.string.isRequired,
    relativeToTime: PropTypes__default.default.string.isRequired
  }).isRequired
}).isRequired, PropTypes__default.default.exact({
  timeRangeKind: PropTypes__default.default.oneOf([DateConstants.PICKER_KINDS.ABSOLUTE]).isRequired,
  timeRangeValue: PropTypes__default.default.exact({
    startDate: PropTypes__default.default.string.isRequired,
    startTime: PropTypes__default.default.string.isRequired,
    /** Can be a full parsable DateTime string or a Date object */
    start: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.instanceOf(Date)]),
    /** Can be a full parsable DateTime string or a Date object */
    end: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.instanceOf(Date)]),
    endDate: PropTypes__default.default.string.isRequired,
    endTime: PropTypes__default.default.string.isRequired
  }).isRequired
}).isRequired]);
var propTypes = {
  testId: PropTypes__default.default.string,
  /** default value for the picker */
  defaultValue: DateTimePickerDefaultValuePropTypes,
  /** the dayjs.js format for the human readable interval value */
  dateTimeMask: PropTypes__default.default.string,
  /** a list of options to for the default presets */
  presets: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
    id: PropTypes__default.default.string,
    label: PropTypes__default.default.string,
    offset: PropTypes__default.default.number
  })),
  /** a list of options to put on the 'Last' interval dropdown */
  intervals: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
    label: PropTypes__default.default.string,
    value: PropTypes__default.default.string
  })),
  /** a list of options to put on the 'Relative to' dropdown */
  relatives: PropTypes__default.default.arrayOf(PropTypes__default.default.shape({
    label: PropTypes__default.default.string,
    value: PropTypes__default.default.string
  })),
  /** show the picker in the expanded state */
  expanded: PropTypes__default.default.bool,
  /** disable the input */
  disabled: PropTypes__default.default.bool,
  /** specify the input in invalid state */
  invalid: PropTypes__default.default.bool,
  /** show the relative custom range picker */
  showRelativeOption: PropTypes__default.default.bool,
  /** show the custom range link */
  showCustomRangeLink: PropTypes__default.default.bool,
  /** show time input fields */
  hasTimeInput: PropTypes__default.default.bool,
  /**
   * Function hook used to provide the appropriate tooltip content for the preset time
   * picker. This function takes in the currentValue and should return a string message.
   */
  renderPresetTooltipText: PropTypes__default.default.func,
  /** triggered on cancel */
  onCancel: PropTypes__default.default.func,
  /** triggered on apply with returning object with similar signature to defaultValue */
  onApply: PropTypes__default.default.func,
  /** All the labels that need translation */
  i18n: PropTypes__default.default.shape({
    toLabel: PropTypes__default.default.string,
    toNowLabel: PropTypes__default.default.string,
    calendarLabel: PropTypes__default.default.string,
    presetLabels: PropTypes__default.default.arrayOf(PropTypes__default.default.string),
    intervalLabels: PropTypes__default.default.arrayOf(PropTypes__default.default.string),
    relativeLabels: PropTypes__default.default.arrayOf(PropTypes__default.default.string),
    customRangeLinkLabel: PropTypes__default.default.string,
    customRangeLabel: PropTypes__default.default.string,
    relativeLabel: PropTypes__default.default.string,
    lastLabel: PropTypes__default.default.string,
    invalidNumberLabel: PropTypes__default.default.string,
    relativeToLabel: PropTypes__default.default.string,
    absoluteLabel: PropTypes__default.default.string,
    startDateLabel: PropTypes__default.default.string,
    endDateLabel: PropTypes__default.default.string,
    startTimeLabel: PropTypes__default.default.string,
    endTimeLabel: PropTypes__default.default.string,
    applyBtnLabel: PropTypes__default.default.string,
    cancelBtnLabel: PropTypes__default.default.string,
    backBtnLabel: PropTypes__default.default.string,
    increment: PropTypes__default.default.string,
    decrement: PropTypes__default.default.string,
    hours: PropTypes__default.default.string,
    minutes: PropTypes__default.default.string,
    number: PropTypes__default.default.string,
    invalidText: PropTypes__default.default.string
  }),
  /** Light version  */
  light: PropTypes__default.default.bool,
  /** The language locale used to format the days of the week, months, and numbers. */
  locale: PropTypes__default.default.string,
  /** IANA timezone string to set as default timezone for dayjs */
  timeZone: PropTypes__default.default.string,
  /** Unique id of the component */
  id: PropTypes__default.default.string,
  /** Optionally renders only an icon rather than displaying the current selected time */
  hasIconOnly: PropTypes__default.default.bool,
  /** Allow repositioning the flyout menu */
  menuOffset: PropTypes__default.default.shape({
    left: PropTypes__default.default.number,
    top: PropTypes__default.default.number
  }),
  /** If set to true it will render outside of the current DOM in a portal, otherwise render as a child */
  renderInPortal: PropTypes__default.default.bool,
  /** Auto reposition if flyout menu offscreen */
  useAutoPositioning: PropTypes__default.default.bool,
  style: PropTypes__default.default.objectOf(PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number])),
  buttonProps: PropTypes__default.default.shape({
    className: PropTypes__default.default.string
  })
};
var defaultProps = {
  testId: 'date-time-picker',
  defaultValue: null,
  dateTimeMask: dayjs.DAYJS_INPUT_FORMATS.RANGE,
  presets: DateConstants.PRESET_VALUES,
  intervals: [{
    label: 'minutes',
    value: DateConstants.INTERVAL_VALUES.MINUTES
  }, {
    label: 'hours',
    value: DateConstants.INTERVAL_VALUES.HOURS
  }, {
    label: 'days',
    value: DateConstants.INTERVAL_VALUES.DAYS
  }, {
    label: 'weeks',
    value: DateConstants.INTERVAL_VALUES.WEEKS
  }, {
    label: 'months',
    value: DateConstants.INTERVAL_VALUES.MONTHS
  }, {
    label: 'years',
    value: DateConstants.INTERVAL_VALUES.YEARS
  }],
  relatives: [{
    label: 'Today',
    value: DateConstants.RELATIVE_VALUES.TODAY
  }, {
    label: 'Yesterday',
    value: DateConstants.RELATIVE_VALUES.YESTERDAY
  }],
  expanded: false,
  disabled: false,
  invalid: false,
  showRelativeOption: true,
  showCustomRangeLink: true,
  hasTimeInput: true,
  renderPresetTooltipText: null,
  onCancel: null,
  onApply: null,
  i18n: {
    toLabel: 'to',
    toNowLabel: 'to Now',
    calendarLabel: 'Calendar',
    presetLabels: [],
    intervalLabels: [],
    relativeLabels: [],
    customRangeLinkLabel: 'Custom Range',
    customRangeLabel: 'Custom range',
    relativeLabel: 'Relative',
    lastLabel: 'Last',
    invalidNumberLabel: 'Number is not valid',
    relativeToLabel: 'Relative to',
    absoluteLabel: 'Absolute',
    startTimeLabel: 'Start time',
    endTimeLabel: 'End time',
    startDateLabel: 'Start Date',
    endDateLabel: 'End Date',
    startAriaLabel: 'Date time start',
    endAriaLabel: 'Date time end',
    applyBtnLabel: 'Apply',
    cancelBtnLabel: 'Cancel',
    backBtnLabel: 'Back',
    increment: 'Increment',
    decrement: 'Decrement',
    hours: 'hours',
    minutes: 'minutes',
    number: 'number',
    invalidText: 'The date time entered is invalid'
  },
  light: false,
  locale: 'en',
  timeZone: undefined,
  id: undefined,
  hasIconOnly: false,
  menuOffset: undefined,
  renderInPortal: true,
  useAutoPositioning: false,
  style: {},
  buttonProps: {}
};
var DateTimePicker = function DateTimePicker(_ref) {
  var _ref4, _buttonProps$classNam;
  var testId = _ref.testId,
    defaultValue = _ref.defaultValue,
    dateTimeMask = _ref.dateTimeMask,
    presets = _ref.presets,
    intervals = _ref.intervals,
    relatives = _ref.relatives,
    expanded = _ref.expanded,
    disabled = _ref.disabled,
    invalid = _ref.invalid,
    showRelativeOption = _ref.showRelativeOption,
    showCustomRangeLink = _ref.showCustomRangeLink,
    hasTimeInput = _ref.hasTimeInput,
    renderPresetTooltipText = _ref.renderPresetTooltipText,
    onCancel = _ref.onCancel,
    onApply = _ref.onApply,
    i18n = _ref.i18n,
    light = _ref.light,
    locale = _ref.locale,
    timeZone = _ref.timeZone,
    hasIconOnly = _ref.hasIconOnly,
    menuOffset = _ref.menuOffset,
    renderInPortal = _ref.renderInPortal,
    useAutoPositioning = _ref.useAutoPositioning,
    style = _ref.style,
    buttonProps = _ref.buttonProps,
    others = _objectWithoutProperties__default.default(_ref, _excluded);
  var effectiveTimezone = timeZone || dayjs.default.tz.guess();
  dayjs.default.tz.setDefault(effectiveTimezone);
  dayjs.default.locale(locale);
  var id = React.useRef(others.id || uuid.v4()).current;
  React__default.default.useEffect(function () {
    {
      warning__default.default(false, 'The `DateTimePickerV2` is an experimental component and could be lacking unit test and documentation. Be aware that minor version bumps could introduce breaking changes. For the reasons listed above use of this component in production is highly discouraged') ;
    }
  }, []);
  var langDir = useLangDirection.useLangDirection();
  var mergedI18n = React.useMemo(function () {
    return _objectSpread(_objectSpread({}, defaultProps.i18n), i18n);
  }, [i18n]);
  // initialize the dayjs locale
  React.useEffect(function () {
    dayjs.default.locale(locale);
  }, [locale]);

  // State
  var _useDateTimePickerRan = dateTimePickerUtils.useDateTimePickerRangeKind(showRelativeOption),
    _useDateTimePickerRan2 = _slicedToArray__default.default(_useDateTimePickerRan, 3),
    customRangeKind = _useDateTimePickerRan2[0],
    setCustomRangeKind = _useDateTimePickerRan2[1],
    onCustomRangeChange = _useDateTimePickerRan2[2];
  var _useState = React.useState(false),
    _useState2 = _slicedToArray__default.default(_useState, 2),
    isCustomRange = _useState2[0],
    setIsCustomRange = _useState2[1];
  var _useState3 = React.useState(null),
    _useState4 = _slicedToArray__default.default(_useState3, 2),
    selectedPreset = _useState4[0],
    setSelectedPreset = _useState4[1];
  var _useState5 = React.useState(null),
    _useState6 = _slicedToArray__default.default(_useState5, 2),
    currentValue = _useState6[0],
    setCurrentValue = _useState6[1];
  var _useState7 = React.useState(null),
    _useState8 = _slicedToArray__default.default(_useState7, 2),
    lastAppliedValue = _useState8[0],
    setLastAppliedValue = _useState8[1];
  var _useState9 = React.useState(null),
    _useState10 = _slicedToArray__default.default(_useState9, 2),
    humanValue = _useState10[0],
    setHumanValue = _useState10[1];
  var _useState11 = React.useState(invalid),
    _useState12 = _slicedToArray__default.default(_useState11, 2),
    invalidState = _useState12[0],
    setInvalidState = _useState12[1];
  var relativeSelect = React.useRef(null);
  var containerRef = React.useRef();
  var dropdownRef = React.useRef();
  var updatedStyle = React.useMemo(function () {
    var _style$zIndex;
    return _objectSpread(_objectSpread({}, style), {}, {
      '--zIndex': (_style$zIndex = style.zIndex) !== null && _style$zIndex !== void 0 ? _style$zIndex : 0
    });
  }, [style]);
  var _useAbsoluteDateTimeV = dateTimePickerUtils.useAbsoluteDateTimeValue(),
    absoluteValue = _useAbsoluteDateTimeV.absoluteValue,
    setAbsoluteValue = _useAbsoluteDateTimeV.setAbsoluteValue,
    absoluteStartTimeInvalid = _useAbsoluteDateTimeV.absoluteStartTimeInvalid,
    setAbsoluteStartTimeInvalid = _useAbsoluteDateTimeV.setAbsoluteStartTimeInvalid,
    absoluteEndTimeInvalid = _useAbsoluteDateTimeV.absoluteEndTimeInvalid,
    setAbsoluteEndTimeInvalid = _useAbsoluteDateTimeV.setAbsoluteEndTimeInvalid,
    onAbsoluteStartTimeChange = _useAbsoluteDateTimeV.onAbsoluteStartTimeChange,
    onAbsoluteEndTimeChange = _useAbsoluteDateTimeV.onAbsoluteEndTimeChange,
    resetAbsoluteValue = _useAbsoluteDateTimeV.resetAbsoluteValue;
  var _useRelativeDateTimeV = dateTimePickerUtils.useRelativeDateTimeValue({
      defaultInterval: intervals[0].value,
      defaultRelativeTo: relatives[0].value
    }),
    relativeValue = _useRelativeDateTimeV.relativeValue,
    setRelativeValue = _useRelativeDateTimeV.setRelativeValue,
    relativeToTimeInvalid = _useRelativeDateTimeV.relativeToTimeInvalid,
    resetRelativeValue = _useRelativeDateTimeV.resetRelativeValue,
    relativeLastNumberInvalid = _useRelativeDateTimeV.relativeLastNumberInvalid,
    onRelativeLastNumberChange = _useRelativeDateTimeV.onRelativeLastNumberChange,
    onRelativeLastIntervalChange = _useRelativeDateTimeV.onRelativeLastIntervalChange,
    onRelativeToWhenChange = _useRelativeDateTimeV.onRelativeToWhenChange,
    onRelativeToTimeChange = _useRelativeDateTimeV.onRelativeToTimeChange;
  var _useDateTimePickerKey = dateTimePickerUtils.useDateTimePickerKeyboardInteraction({
      expanded: expanded,
      setCustomRangeKind: setCustomRangeKind
    }),
    isExpanded = _useDateTimePickerKey.isExpanded,
    setIsExpanded = _useDateTimePickerKey.setIsExpanded,
    presetListRef = _useDateTimePickerKey.presetListRef,
    onFieldInteraction = _useDateTimePickerKey.onFieldInteraction,
    onNavigateRadioButton = _useDateTimePickerKey.onNavigateRadioButton,
    onNavigatePresets = _useDateTimePickerKey.onNavigatePresets;
  var dateTimePickerBaseValue = {
    kind: '',
    preset: {
      id: presets[0].id,
      label: presets[0].label,
      offset: presets[0].offset
    },
    relative: {
      lastNumber: null,
      lastInterval: intervals[0].value,
      relativeToWhen: relatives[0].value,
      relativeToTime: null
    },
    absolute: {
      startDate: null,
      startTime: null,
      endDate: null,
      endTime: null
    }
  };

  /**
   * Transforms a default or selected value into a full blown returnable object
   * @param {Object} [preset] clicked preset
   * @param {string} preset.label preset label
   * @param {number} preset.offset preset offset in minutes
   * @returns {Object} the augmented value itself and the human readable value
   */
  var renderValue = function renderValue() {
    var clickedPreset = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : null;
    var value = _objectSpread({}, dateTimePickerBaseValue);
    if (isCustomRange) {
      if (customRangeKind === DateConstants.PICKER_KINDS.RELATIVE) {
        value.relative = relativeValue;
      } else {
        value.absolute = absoluteValue;
      }
      value.kind = customRangeKind;
    } else {
      var preset = presets.filter(function (p) {
        var filteredPreset;
        if (p.id) {
          filteredPreset = p.id === (clickedPreset ? clickedPreset.id : selectedPreset);
        } else {
          filteredPreset = p.offset === (clickedPreset ? clickedPreset.offset : selectedPreset);
        }
        return filteredPreset;
      }).pop();
      value.preset = preset;
      value.kind = DateConstants.PICKER_KINDS.PRESET;
    }
    setCurrentValue(value);
    var parsedValue = dateTimePickerUtils.parseValue(value, dateTimeMask, mergedI18n.toLabel, hasTimeInput, effectiveTimezone);
    setHumanValue(parsedValue.readableValue);
    return _objectSpread(_objectSpread({}, value), parsedValue);
  };
  React.useEffect(function () {
    if (absoluteValue || relativeValue) {
      renderValue();
    }
  },
  // eslint-disable-next-line react-hooks/exhaustive-deps
  [absoluteValue, relativeValue]);
  var onDatePickerChange = function onDatePickerChange(_ref2) {
    var _ref3 = _slicedToArray__default.default(_ref2, 2),
      start = _ref3[0],
      end = _ref3[1];
    var newAbsolute = _objectSpread({}, absoluteValue);
    newAbsolute.start = start;
    newAbsolute.startDate = start ? dayjs.default(newAbsolute.start).format('MM/DD/YYYY') : '';
    newAbsolute.end = end;
    newAbsolute.endDate = end ? dayjs.default(newAbsolute.end).format('MM/DD/YYYY') : '';
    setAbsoluteValue(newAbsolute);

    // Update end and start time invalid state when date changed
    setAbsoluteEndTimeInvalid(dateTimePickerUtils.invalidEndDate(newAbsolute.startTime, newAbsolute.endTime, newAbsolute));
    setAbsoluteStartTimeInvalid(dateTimePickerUtils.invalidStartDate(newAbsolute.startTime, newAbsolute.endTime, newAbsolute));
  };
  var onPresetClick = function onPresetClick(preset) {
    var _preset$id;
    setSelectedPreset((_preset$id = preset.id) !== null && _preset$id !== void 0 ? _preset$id : preset.offset);
    renderValue(preset);
  };
  var parseDefaultValue = function parseDefaultValue(parsableValue) {
    var currentCustomRangeKind = showRelativeOption ? DateConstants.PICKER_KINDS.RELATIVE : DateConstants.PICKER_KINDS.ABSOLUTE;
    if (parsableValue !== null) {
      if (parsableValue.timeRangeKind === DateConstants.PICKER_KINDS.PRESET) {
        // preset
        resetAbsoluteValue();
        resetRelativeValue();
        setCustomRangeKind(currentCustomRangeKind);
        onPresetClick(parsableValue.timeRangeValue);
      }
      if (parsableValue.timeRangeKind === DateConstants.PICKER_KINDS.RELATIVE) {
        // relative
        resetAbsoluteValue();
        setIsCustomRange(true);
        setCustomRangeKind(currentCustomRangeKind);
        setRelativeValue(parsableValue.timeRangeValue);
      }
      if (parsableValue.timeRangeKind === DateConstants.PICKER_KINDS.ABSOLUTE) {
        // absolute
        var absolute = _objectSpread({}, parsableValue.timeRangeValue);
        resetRelativeValue();
        setIsCustomRange(true);
        setCustomRangeKind(DateConstants.PICKER_KINDS.ABSOLUTE);
        if (!absolute.hasOwnProperty('start')) {
          var startDateTime = "".concat(absolute.startDate, " ").concat(absolute.startTime);
          absolute.start = dayjs.default.tz(startDateTime, dayjs.detectDateTimeFormat(startDateTime), effectiveTimezone).valueOf();
        }
        if (!absolute.hasOwnProperty('end')) {
          var endDateTime = "".concat(absolute.endDate, " ").concat(absolute.endTime);
          absolute.end = dayjs.default.tz(endDateTime, dayjs.detectDateTimeFormat(endDateTime), effectiveTimezone).valueOf();
        }
        absolute.startDate = dayjs.default.tz(absolute.start).format('MM/DD/YYYY');
        absolute.startTime = dayjs.default.tz(absolute.start).format('HH:mm');
        absolute.endDate = dayjs.default.tz(absolute.end).format('MM/DD/YYYY');
        absolute.endTime = dayjs.default.tz(absolute.end).format('HH:mm');
        setAbsoluteValue(absolute);
      }
    } else {
      resetAbsoluteValue();
      resetRelativeValue();
      setCustomRangeKind(currentCustomRangeKind);
      onPresetClick(presets[0]);
    }
  };
  var toggleIsCustomRange = function toggleIsCustomRange(event) {
    // stop the event from bubbling
    event.stopPropagation();
    setIsCustomRange(!isCustomRange);

    // If value was changed reset when going back to Preset
    if (absoluteValue.startDate !== '' || relativeValue.lastNumber > 0) {
      if (selectedPreset) {
        onPresetClick(presets.filter(function (p) {
          var _p$id;
          return (_p$id = p.id) !== null && _p$id !== void 0 ? _p$id : p.offset === selectedPreset;
        })[0]);
        resetAbsoluteValue();
        resetRelativeValue();
      } else {
        onPresetClick(presets[0]);
        resetAbsoluteValue();
        resetRelativeValue();
      }
    }
  };
  React.useEffect(function () {
    /* istanbul ignore else */
    if (defaultValue || humanValue === null) {
      parseDefaultValue(defaultValue);
      setLastAppliedValue(defaultValue);
    }
  },
  // eslint-disable-next-line react-hooks/exhaustive-deps
  [defaultValue]);
  var tooltipValue = renderPresetTooltipText ? renderPresetTooltipText(currentValue) : dateTimePickerUtils.getIntervalValue({
    currentValue: currentValue,
    mergedI18n: mergedI18n,
    dateTimeMask: dateTimeMask,
    humanValue: humanValue
  });
  var disableRelativeApply = isCustomRange && customRangeKind === DateConstants.PICKER_KINDS.RELATIVE && (relativeLastNumberInvalid || relativeToTimeInvalid);
  var disableAbsoluteApply = isCustomRange && customRangeKind === DateConstants.PICKER_KINDS.ABSOLUTE && (absoluteStartTimeInvalid || absoluteEndTimeInvalid || !absoluteValue.startDate || !absoluteValue.endDate || (hasTimeInput ? !absoluteValue.startTime || !absoluteValue.endTime : false));
  var disableApply = disableRelativeApply || disableAbsoluteApply;
  React.useEffect(function () {
    return setInvalidState(invalid || disableApply);
  }, [invalid, disableApply]);
  var onApplyClick = function onApplyClick() {
    setIsExpanded(false);
    var value = renderValue();
    setLastAppliedValue(value);
    var returnValue = {
      timeRangeKind: value.kind,
      timeRangeValue: null
    };
    switch (value.kind) {
      case DateConstants.PICKER_KINDS.ABSOLUTE:
        returnValue.timeRangeValue = _objectSpread(_objectSpread({}, value.absolute), {}, {
          humanValue: humanValue,
          tooltipValue: tooltipValue
        });
        break;
      case DateConstants.PICKER_KINDS.RELATIVE:
        returnValue.timeRangeValue = _objectSpread(_objectSpread({}, value.relative), {}, {
          humanValue: humanValue,
          tooltipValue: tooltipValue
        });
        break;
      default:
        returnValue.timeRangeValue = _objectSpread(_objectSpread({}, value.preset), {}, {
          tooltipValue: tooltipValue
        });
        break;
    }
    if (onApply) {
      onApply(returnValue);
    }
  };
  var onCancelClick = function onCancelClick() {
    parseDefaultValue(lastAppliedValue);
    setIsExpanded(false);

    /* istanbul ignore else */
    if (onCancel) {
      onCancel();
    }
  };
  var closeDropdown = dateTimePickerUtils.useCloseDropdown({
    isExpanded: isExpanded,
    isCustomRange: isCustomRange,
    setIsCustomRange: setIsCustomRange,
    setIsExpanded: setIsExpanded,
    parseDefaultValue: parseDefaultValue,
    defaultValue: defaultValue,
    setCustomRangeKind: setCustomRangeKind,
    lastAppliedValue: lastAppliedValue
  });
  var onClickOutside = dateTimePickerUtils.useDateTimePickerClickOutside(closeDropdown, containerRef);
  componentUtilityFunctions.useOnClickOutside(dropdownRef, onClickOutside);

  // eslint-disable-next-line react/prop-types
  var CustomFooter = function CustomFooter() {
    return /*#__PURE__*/React__default.default.createElement("div", {
      className: "".concat(iotPrefix, "--date-time-picker__menu-btn-set")
    }, isCustomRange ? /*#__PURE__*/React__default.default.createElement(Button, _extends__default.default({
      kind: "secondary",
      className: "".concat(iotPrefix, "--date-time-picker__menu-btn ").concat(iotPrefix, "--date-time-picker__menu-btn-back"),
      size: "md"
    }, others, {
      onClick: toggleIsCustomRange,
      onKeyUp: componentUtilityFunctions.handleSpecificKeyDown(['Enter', ' '], toggleIsCustomRange)
    }), mergedI18n.backBtnLabel) : /*#__PURE__*/React__default.default.createElement(Button, _extends__default.default({
      kind: "secondary",
      className: "".concat(iotPrefix, "--date-time-picker__menu-btn ").concat(iotPrefix, "--date-time-picker__menu-btn-cancel"),
      onClick: onCancelClick,
      size: "md"
    }, others, {
      onKeyUp: componentUtilityFunctions.handleSpecificKeyDown(['Enter', ' '], onCancelClick)
    }), mergedI18n.cancelBtnLabel), /*#__PURE__*/React__default.default.createElement(Button, _extends__default.default({
      kind: "primary",
      className: "".concat(iotPrefix, "--date-time-picker__menu-btn ").concat(iotPrefix, "--date-time-picker__menu-btn-apply")
    }, others, {
      onClick: onApplyClick,
      onKeyUp: componentUtilityFunctions.handleSpecificKeyDown(['Enter', ' '], onApplyClick),
      size: "md",
      disabled: disableApply
    }), mergedI18n.applyBtnLabel));
  };
  var menuOffsetLeft = menuOffset !== null && menuOffset !== void 0 && menuOffset.left ? menuOffset.left : langDir === 'ltr' ? 0 : hasIconOnly ? -15 : 288;
  var menuOffsetTop = menuOffset !== null && menuOffset !== void 0 && menuOffset.top ? menuOffset.top : 0;
  var _useCustomHeight = dateTimePickerUtils.useCustomHeight({
      containerRef: containerRef,
      isCustomRange: isCustomRange,
      showRelativeOption: showRelativeOption,
      customRangeKind: customRangeKind,
      setIsExpanded: setIsExpanded
    }),
    _useCustomHeight2 = _slicedToArray__default.default(_useCustomHeight, 6),
    offTop = _useCustomHeight2[0],
    inputTop = _useCustomHeight2[2],
    inputBottom = _useCustomHeight2[3],
    customHeight = _useCustomHeight2[4],
    maxHeight = _useCustomHeight2[5];
  var direction = offTop ? FlyoutMenu.FlyoutMenuDirection.BottomEnd : FlyoutMenu.FlyoutMenuDirection.TopEnd;
  var tooltipField = /*#__PURE__*/React__default.default.createElement("div", {
    className: classnames__default.default(_defineProperty__default.default(_defineProperty__default.default(_defineProperty__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--date-time-picker__box--full"), !hasIconOnly), "".concat(iotPrefix, "--date-time-picker__box--light"), light), "".concat(iotPrefix, "--date-time-picker__box--disabled"), disabled), "".concat(iotPrefix, "--date-time-picker__box--invalid"), invalidState))
  }, !hasIconOnly ? /*#__PURE__*/React__default.default.createElement("div", {
    "data-testid": "".concat(testId, "__field"),
    className: "".concat(iotPrefix, "--date-time-picker__field")
  }, isExpanded || currentValue && currentValue.kind !== DateConstants.PICKER_KINDS.PRESET || humanValue ? /*#__PURE__*/React__default.default.createElement("span", {
    className: classnames__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--date-time-picker__disabled"), disabled)),
    title: humanValue
  }, humanValue) : null) : null, /*#__PURE__*/React__default.default.createElement(FlyoutMenu.default, {
    isOpen: isExpanded,
    buttonSize: hasIconOnly ? FlyoutMenu.FlyoutMenuButtonSize.Default : FlyoutMenu.FlyoutMenuButtonSize.Small,
    renderIcon: invalidState ? iconsReact.WarningFilled : iconsReact.Calendar,
    iconDescription: (_ref4 = invalidState ? i18n.invalidText : i18n.calendarLabel) !== null && _ref4 !== void 0 ? _ref4 : '',
    disabled: disabled,
    buttonProps: {
      size: 'lg',
      tooltipPosition: 'top',
      tabIndex: -1,
      className: classnames__default.default(["".concat(iotPrefix, "--date-time-picker--trigger-button"), (_buttonProps$classNam = buttonProps.className) !== null && _buttonProps$classNam !== void 0 ? _buttonProps$classNam : ''], _defineProperty__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--date-time-picker--trigger-button--invalid"), invalid), "".concat(iotPrefix, "--date-time-picker--trigger-button--disabled"), disabled))
    },
    hideTooltip: true,
    passive: false,
    triggerId: "test-trigger-".concat(id),
    light: light,
    menuOffset: {
      top: menuOffsetTop,
      left: menuOffsetLeft,
      inputTop: inputTop,
      inputBottom: inputBottom
    },
    testId: "".concat(testId, "-datepicker-flyout"),
    direction: direction,
    tooltipFocusTrap: false,
    renderInPortal: renderInPortal,
    useAutoPositioning: useAutoPositioning,
    tooltipClassName: classnames__default.default("".concat(iotPrefix, "--date-time-picker--tooltip"), _defineProperty__default.default({}, "".concat(iotPrefix, "--date-time-picker--tooltip--icon"), hasIconOnly)),
    tooltipContentClassName: "".concat(iotPrefix, "--date-time-picker--menu"),
    style: updatedStyle
  }, /*#__PURE__*/React__default.default.createElement("div", {
    ref: dropdownRef,
    className: "".concat(iotPrefix, "--date-time-picker__menu-scroll"),
    style: {
      '--wrapper-width': '20rem',
      height: customHeight,
      maxHeight: maxHeight
    },
    role: "presentation",
    onClick: function onClick(event) {
      return event.stopPropagation();
    } // need to stop the event so that it will not close the menu
    ,
    onKeyDown: function onKeyDown(event) {
      return event.stopPropagation();
    } // need to stop the event so that it will not close the menu
    ,
    tabIndex: "-1"
  }, !isCustomRange ?
  /*#__PURE__*/
  // Catch bubbled Up/Down keys from the preset list and move focus.
  // eslint-disable-next-line jsx-a11y/no-static-element-interactions
  React__default.default.createElement("div", {
    ref: presetListRef,
    onKeyDown: componentUtilityFunctions.handleSpecificKeyDown(['ArrowUp', 'ArrowDown'], onNavigatePresets)
  }, /*#__PURE__*/React__default.default.createElement(react.OrderedList, {
    nested: false
  }, tooltipValue ? /*#__PURE__*/React__default.default.createElement(react.ListItem, {
    className: "".concat(iotPrefix, "--date-time-picker__listitem ").concat(iotPrefix, "--date-time-picker__listitem--current")
  }, tooltipValue) : null, showCustomRangeLink ? /*#__PURE__*/React__default.default.createElement(react.ListItem, {
    onClick: toggleIsCustomRange,
    onKeyDown: componentUtilityFunctions.handleSpecificKeyDown(['Enter', ' '], toggleIsCustomRange),
    className: "".concat(iotPrefix, "--date-time-picker__listitem ").concat(iotPrefix, "--date-time-picker__listitem--preset ").concat(iotPrefix, "--date-time-picker__listitem--custom"),
    tabIndex: 0
  }, mergedI18n.customRangeLinkLabel) : null, presets.map(function (preset, i) {
    var _preset$id2;
    return /*#__PURE__*/React__default.default.createElement(react.ListItem, {
      key: i,
      onClick: function onClick() {
        return onPresetClick(preset);
      },
      onKeyDown: componentUtilityFunctions.handleSpecificKeyDown(['Enter', ' '], function () {
        return onPresetClick(preset);
      }),
      className: classnames__default.default("".concat(iotPrefix, "--date-time-picker__listitem ").concat(iotPrefix, "--date-time-picker__listitem--preset"), _defineProperty__default.default({}, "".concat(iotPrefix, "--date-time-picker__listitem--preset-selected"), selectedPreset === ((_preset$id2 = preset.id) !== null && _preset$id2 !== void 0 ? _preset$id2 : preset.offset))),
      tabIndex: 0
    }, mergedI18n.presetLabels[i] || preset.label);
  }))) : /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--date-time-picker__custom-wrapper"),
    style: {
      '--wrapper-width': '20rem'
    }
  }, showRelativeOption ? /*#__PURE__*/React__default.default.createElement(react.FormGroup, {
    legendText: mergedI18n.customRangeLabel,
    className: "".concat(iotPrefix, "--date-time-picker__menu-formgroup")
  }, /*#__PURE__*/React__default.default.createElement(react.RadioButtonGroup, {
    valueSelected: customRangeKind,
    onChange: onCustomRangeChange,
    name: "".concat(id, "-radiogroup")
  }, /*#__PURE__*/React__default.default.createElement(react.RadioButton, {
    value: DateConstants.PICKER_KINDS.RELATIVE,
    id: "".concat(id, "-relative"),
    labelText: mergedI18n.relativeLabel,
    onKeyDown: componentUtilityFunctions.handleSpecificKeyDown(['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'], onNavigateRadioButton)
  }), /*#__PURE__*/React__default.default.createElement(react.RadioButton, {
    value: DateConstants.PICKER_KINDS.ABSOLUTE,
    id: "".concat(id, "-absolute"),
    labelText: mergedI18n.absoluteLabel,
    onKeyDown: componentUtilityFunctions.handleSpecificKeyDown(['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'], onNavigateRadioButton)
  }))) : null, showRelativeOption && customRangeKind === DateConstants.PICKER_KINDS.RELATIVE ? /*#__PURE__*/React__default.default.createElement(React__default.default.Fragment, null, /*#__PURE__*/React__default.default.createElement(react.FormGroup, {
    legendText: mergedI18n.lastLabel,
    className: "".concat(iotPrefix, "--date-time-picker__menu-formgroup")
  }, /*#__PURE__*/React__default.default.createElement("div", {
    className: classnames__default.default("".concat(iotPrefix, "--date-time-picker__fields-wrapper"), "".concat(iotPrefix, "--date-time-picker__fields-wrapper--with-gap"))
  }, /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(react.NumberInput, {
    id: "".concat(id, "-last-number"),
    invalidText: mergedI18n.invalidNumberLabel,
    step: 1,
    min: 0,
    value: relativeValue ? relativeValue.lastNumber : 0,
    onChange: onRelativeLastNumberChange,
    translateWithId: function translateWithId(messageId) {
      return messageId === 'increment.number' ? "".concat(i18n.increment, " ").concat(i18n.number) : messageId === 'decrement.number' ? "".concat(i18n.decrement, " ").concat(i18n.number) : null;
    }
  })), /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(react.Select, _extends__default.default({}, others, {
    id: "".concat(id, "-last-interval"),
    defaultValue: relativeValue ? relativeValue.lastInterval : DateConstants.INTERVAL_VALUES.MINUTES,
    onChange: onRelativeLastIntervalChange,
    hideLabel: true
  }), intervals.map(function (interval, i) {
    return /*#__PURE__*/React__default.default.createElement(react.SelectItem, {
      key: i,
      value: interval.value,
      text: mergedI18n.intervalLabels[i] || interval.label
    });
  }))))), /*#__PURE__*/React__default.default.createElement(react.FormGroup, {
    legendText: mergedI18n.relativeToLabel,
    className: "".concat(iotPrefix, "--date-time-picker__menu-formgroup")
  }, /*#__PURE__*/React__default.default.createElement("div", {
    className: classnames__default.default("".concat(iotPrefix, "--date-time-picker__fields-wrapper"), "".concat(iotPrefix, "--date-time-picker__fields-wrapper--with-gap"))
  }, /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(react.Select, _extends__default.default({}, others, {
    ref: relativeSelect,
    id: "".concat(id, "-relative-to-when"),
    defaultValue: relativeValue ? relativeValue.relativeToWhen : '',
    onChange: onRelativeToWhenChange,
    hideLabel: true
  }), relatives.map(function (relative, i) {
    return /*#__PURE__*/React__default.default.createElement(react.SelectItem, {
      key: i,
      value: relative.value,
      text: mergedI18n.relativeLabels[i] || relative.label
    });
  }))), hasTimeInput ? /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(TimePickerSpinner.default, {
    id: "".concat(id, "-relative-to-time"),
    invalid: relativeToTimeInvalid,
    value: relativeValue ? relativeValue.relativeToTime : '',
    i18n: i18n,
    onChange: onRelativeToTimeChange,
    spinner: true,
    autoComplete: "off"
  })) : null))) : /*#__PURE__*/React__default.default.createElement("div", {
    "data-testid": "".concat(testId, "-datepicker")
  }, /*#__PURE__*/React__default.default.createElement(react.FormGroup, {
    className: "".concat(iotPrefix, "--date-time-picker__menu-formgroup")
  }, /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(react.DatePicker, {
    datePickerType: "range",
    dateFormat: "m/d/Y",
    onChange: onDatePickerChange,
    value: absoluteValue ? [absoluteValue.startDate, absoluteValue.endDate] : '',
    locale: locale === null || locale === void 0 ? void 0 : locale.split('-')[0]
  }, /*#__PURE__*/React__default.default.createElement(react.DatePickerInput, {
    labelText: mergedI18n.startDateLabel,
    "aria-label": mergedI18n.startAriaLabel,
    id: "".concat(id, "-date-picker-input-start")
  }), /*#__PURE__*/React__default.default.createElement(react.DatePickerInput, {
    labelText: mergedI18n.endDateLabel,
    "aria-label": mergedI18n.endAriaLabel,
    id: "".concat(id, "-date-picker-input-end")
  })))), hasTimeInput ? /*#__PURE__*/React__default.default.createElement(react.FormGroup, {
    legendText: "",
    className: "".concat(iotPrefix, "--date-time-picker__menu-formgroup")
  }, /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--date-time-picker__fields-wrapper")
  }, /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(TimePickerSpinner.default, {
    id: "".concat(id, "-start-time"),
    invalid: absoluteStartTimeInvalid,
    labelText: mergedI18n.startTimeLabel,
    value: absoluteValue ? absoluteValue.startTime : null,
    i18n: i18n,
    onChange: onAbsoluteStartTimeChange,
    spinner: true,
    autoComplete: "off"
  })), /*#__PURE__*/React__default.default.createElement(react.Layer, null, /*#__PURE__*/React__default.default.createElement(TimePickerSpinner.default, {
    id: "".concat(id, "-end-time"),
    invalid: absoluteEndTimeInvalid,
    labelText: mergedI18n.endTimeLabel,
    value: absoluteValue ? absoluteValue.endTime : null,
    i18n: i18n,
    onChange: onAbsoluteEndTimeChange,
    spinner: true,
    autoComplete: "off"
  })))) : /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--date-time-picker__no-formgroup")
  })))), CustomFooter()));
  return /*#__PURE__*/React__default.default.createElement("div", {
    className: "".concat(iotPrefix, "--date-time-pickerv2"),
    ref: containerRef
  }, /*#__PURE__*/React__default.default.createElement("div", {
    "data-testid": testId,
    id: "".concat(id, "-").concat(iotPrefix, "--date-time-pickerv2__wrapper"),
    className: classnames__default.default("".concat(iotPrefix, "--date-time-pickerv2__wrapper"), _defineProperty__default.default(_defineProperty__default.default({}, "".concat(iotPrefix, "--date-time-pickerv2__wrapper--disabled"), disabled), "".concat(iotPrefix, "--date-time-pickerv2__wrapper--invalid"), invalidState)),
    style: {
      '--wrapper-width': hasIconOnly ? '3rem' : '20rem'
    },
    role: "button",
    onClick: onFieldInteraction,
    onKeyDown: componentUtilityFunctions.handleSpecificKeyDown(['Enter', ' ', 'Escape', 'ArrowDown'], function (event) {
      // the onApplyClick event gets blocked when called via the keyboard from the flyout menu's
      // custom footer. This is a catch to ensure the onApplyCLick is called correctly for preset
      // ranges via the keyboard.
      if ((event.key === 'Enter' || event.key === ' ') && event.target.classList.contains("".concat(iotPrefix, "--date-time-picker__menu-btn-apply")) && !isCustomRange) {
        onApplyClick();
      }
      onFieldInteraction(event);
    }),
    tabIndex: 0
  }, tooltipField), invalidState && !hasIconOnly ? /*#__PURE__*/React__default.default.createElement("p", {
    className: classnames__default.default("".concat(prefix, "--form__helper-text"), "".concat(iotPrefix, "--date-time-picker__helper-text--invalid"))
  }, mergedI18n.invalidText) : null);
};
DateTimePicker.propTypes = propTypes;
DateTimePicker.defaultProps = defaultProps;
DateTimePicker.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "DateTimePicker",
  "props": {
    "testId": {
      "defaultValue": {
        "value": "'date-time-picker'",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "defaultValue": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "default value for the picker",
      "type": {
        "name": "custom",
        "raw": "DateTimePickerDefaultValuePropTypes"
      },
      "required": false
    },
    "dateTimeMask": {
      "defaultValue": {
        "value": "DAYJS_INPUT_FORMATS.RANGE",
        "computed": true
      },
      "description": "the dayjs.js format for the human readable interval value",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "presets": {
      "defaultValue": {
        "value": "PRESET_VALUES",
        "computed": true
      },
      "description": "a list of options to for the default presets",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "shape",
          "value": {
            "id": {
              "name": "string",
              "required": false
            },
            "label": {
              "name": "string",
              "required": false
            },
            "offset": {
              "name": "number",
              "required": false
            }
          }
        }
      },
      "required": false
    },
    "intervals": {
      "defaultValue": {
        "value": "[\n  {\n    label: 'minutes',\n    value: INTERVAL_VALUES.MINUTES,\n  },\n  {\n    label: 'hours',\n    value: INTERVAL_VALUES.HOURS,\n  },\n  {\n    label: 'days',\n    value: INTERVAL_VALUES.DAYS,\n  },\n  {\n    label: 'weeks',\n    value: INTERVAL_VALUES.WEEKS,\n  },\n  {\n    label: 'months',\n    value: INTERVAL_VALUES.MONTHS,\n  },\n  {\n    label: 'years',\n    value: INTERVAL_VALUES.YEARS,\n  },\n]",
        "computed": false
      },
      "description": "a list of options to put on the 'Last' interval dropdown",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "shape",
          "value": {
            "label": {
              "name": "string",
              "required": false
            },
            "value": {
              "name": "string",
              "required": false
            }
          }
        }
      },
      "required": false
    },
    "relatives": {
      "defaultValue": {
        "value": "[\n  {\n    label: 'Today',\n    value: RELATIVE_VALUES.TODAY,\n  },\n  {\n    label: 'Yesterday',\n    value: RELATIVE_VALUES.YESTERDAY,\n  },\n]",
        "computed": false
      },
      "description": "a list of options to put on the 'Relative to' dropdown",
      "type": {
        "name": "arrayOf",
        "value": {
          "name": "shape",
          "value": {
            "label": {
              "name": "string",
              "required": false
            },
            "value": {
              "name": "string",
              "required": false
            }
          }
        }
      },
      "required": false
    },
    "expanded": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "show the picker in the expanded state",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "disabled": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "disable the input",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "invalid": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "specify the input in invalid state",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "showRelativeOption": {
      "defaultValue": {
        "value": "true",
        "computed": false
      },
      "description": "show the relative custom range picker",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "showCustomRangeLink": {
      "defaultValue": {
        "value": "true",
        "computed": false
      },
      "description": "show the custom range link",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "hasTimeInput": {
      "defaultValue": {
        "value": "true",
        "computed": false
      },
      "description": "show time input fields",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "renderPresetTooltipText": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "Function hook used to provide the appropriate tooltip content for the preset time\npicker. This function takes in the currentValue and should return a string message.",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "onCancel": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "triggered on cancel",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "onApply": {
      "defaultValue": {
        "value": "null",
        "computed": false
      },
      "description": "triggered on apply with returning object with similar signature to defaultValue",
      "type": {
        "name": "func"
      },
      "required": false
    },
    "i18n": {
      "defaultValue": {
        "value": "{\n  toLabel: 'to',\n  toNowLabel: 'to Now',\n  calendarLabel: 'Calendar',\n  presetLabels: [],\n  intervalLabels: [],\n  relativeLabels: [],\n  customRangeLinkLabel: 'Custom Range',\n  customRangeLabel: 'Custom range',\n  relativeLabel: 'Relative',\n  lastLabel: 'Last',\n  invalidNumberLabel: 'Number is not valid',\n  relativeToLabel: 'Relative to',\n  absoluteLabel: 'Absolute',\n  startTimeLabel: 'Start time',\n  endTimeLabel: 'End time',\n  startDateLabel: 'Start Date',\n  endDateLabel: 'End Date',\n  startAriaLabel: 'Date time start',\n  endAriaLabel: 'Date time end',\n  applyBtnLabel: 'Apply',\n  cancelBtnLabel: 'Cancel',\n  backBtnLabel: 'Back',\n  increment: 'Increment',\n  decrement: 'Decrement',\n  hours: 'hours',\n  minutes: 'minutes',\n  number: 'number',\n  invalidText: 'The date time entered is invalid',\n}",
        "computed": false
      },
      "description": "All the labels that need translation",
      "type": {
        "name": "shape",
        "value": {
          "toLabel": {
            "name": "string",
            "required": false
          },
          "toNowLabel": {
            "name": "string",
            "required": false
          },
          "calendarLabel": {
            "name": "string",
            "required": false
          },
          "presetLabels": {
            "name": "arrayOf",
            "value": {
              "name": "string"
            },
            "required": false
          },
          "intervalLabels": {
            "name": "arrayOf",
            "value": {
              "name": "string"
            },
            "required": false
          },
          "relativeLabels": {
            "name": "arrayOf",
            "value": {
              "name": "string"
            },
            "required": false
          },
          "customRangeLinkLabel": {
            "name": "string",
            "required": false
          },
          "customRangeLabel": {
            "name": "string",
            "required": false
          },
          "relativeLabel": {
            "name": "string",
            "required": false
          },
          "lastLabel": {
            "name": "string",
            "required": false
          },
          "invalidNumberLabel": {
            "name": "string",
            "required": false
          },
          "relativeToLabel": {
            "name": "string",
            "required": false
          },
          "absoluteLabel": {
            "name": "string",
            "required": false
          },
          "startDateLabel": {
            "name": "string",
            "required": false
          },
          "endDateLabel": {
            "name": "string",
            "required": false
          },
          "startTimeLabel": {
            "name": "string",
            "required": false
          },
          "endTimeLabel": {
            "name": "string",
            "required": false
          },
          "applyBtnLabel": {
            "name": "string",
            "required": false
          },
          "cancelBtnLabel": {
            "name": "string",
            "required": false
          },
          "backBtnLabel": {
            "name": "string",
            "required": false
          },
          "increment": {
            "name": "string",
            "required": false
          },
          "decrement": {
            "name": "string",
            "required": false
          },
          "hours": {
            "name": "string",
            "required": false
          },
          "minutes": {
            "name": "string",
            "required": false
          },
          "number": {
            "name": "string",
            "required": false
          },
          "invalidText": {
            "name": "string",
            "required": false
          }
        }
      },
      "required": false
    },
    "light": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Light version",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "locale": {
      "defaultValue": {
        "value": "'en'",
        "computed": false
      },
      "description": "The language locale used to format the days of the week, months, and numbers.",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "timeZone": {
      "defaultValue": {
        "value": "undefined",
        "computed": true
      },
      "description": "IANA timezone string to set as default timezone for dayjs",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "id": {
      "defaultValue": {
        "value": "undefined",
        "computed": true
      },
      "description": "Unique id of the component",
      "type": {
        "name": "string"
      },
      "required": false
    },
    "hasIconOnly": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Optionally renders only an icon rather than displaying the current selected time",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "menuOffset": {
      "defaultValue": {
        "value": "undefined",
        "computed": true
      },
      "description": "Allow repositioning the flyout menu",
      "type": {
        "name": "shape",
        "value": {
          "left": {
            "name": "number",
            "required": false
          },
          "top": {
            "name": "number",
            "required": false
          }
        }
      },
      "required": false
    },
    "renderInPortal": {
      "defaultValue": {
        "value": "true",
        "computed": false
      },
      "description": "If set to true it will render outside of the current DOM in a portal, otherwise render as a child",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "useAutoPositioning": {
      "defaultValue": {
        "value": "false",
        "computed": false
      },
      "description": "Auto reposition if flyout menu offscreen",
      "type": {
        "name": "bool"
      },
      "required": false
    },
    "style": {
      "defaultValue": {
        "value": "{}",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "objectOf",
        "value": {
          "name": "union",
          "value": [{
            "name": "string"
          }, {
            "name": "number"
          }]
        }
      },
      "required": false
    },
    "buttonProps": {
      "defaultValue": {
        "value": "{}",
        "computed": false
      },
      "description": "",
      "type": {
        "name": "shape",
        "value": {
          "className": {
            "name": "string",
            "required": false
          }
        }
      },
      "required": false
    }
  }
};
var DateTimePickerOld = DateTimePicker;

exports.DateTimePickerDefaultValuePropTypes = DateTimePickerDefaultValuePropTypes;
exports.default = DateTimePickerOld;
