function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

import React from 'react';
import CustomDayPickerCaption from './CustomDayPickerCaption';
import format from 'date-fns/format';
import { DayPicker } from 'react-day-picker';
import { ArrowsStackedIcon } from '../Icons';
import { t } from '../i18n';

/**
 * The default formatter for the Month caption.
 */
export function formatMonthCaption(month, options) {
  return format(month, 'LLL', options);
}
export function CustomDayPicker(props) {
  return /*#__PURE__*/React.createElement(DayPicker, _extends({
    mode: "single",
    footer: /*#__PURE__*/React.createElement("span", {
      className: "ds-u-visibility--screen-reader"
    }, t('singleInputDateField.arrowKeyInstructions')),
    captionLayout: "dropdown",
    components: {
      Caption: CustomDayPickerCaption,
      IconDropdown: ArrowsStackedIcon
    },
    formatters: {
      formatMonthCaption: formatMonthCaption
    }
  }, props));
}
export default CustomDayPicker;