"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.CustomDayPicker = CustomDayPicker;
exports.default = void 0;
exports.formatMonthCaption = formatMonthCaption;
var _CustomDayPickerCaption = _interopRequireDefault(require("./CustomDayPickerCaption"));
var _format = _interopRequireDefault(require("date-fns/format"));
var _reactDayPicker = require("react-day-picker");
var _Icons = require("../Icons");
var _i18n = require("../i18n");
var _jsxRuntime = require("preact/compat/jsx-runtime");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
/**
 * The default formatter for the Month caption.
 */
function formatMonthCaption(month, options) {
  return (0, _format.default)(month, 'LLL', options);
}
function CustomDayPicker(props) {
  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactDayPicker.DayPicker, {
    mode: "single",
    footer: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
      className: "ds-u-visibility--screen-reader",
      children: (0, _i18n.t)('singleInputDateField.arrowKeyInstructions')
    }),
    captionLayout: "dropdown",
    components: {
      Caption: _CustomDayPickerCaption.default,
      IconDropdown: _Icons.ArrowsStackedIcon
    },
    formatters: {
      formatMonthCaption
    },
    ...props
  });
}
var _default = CustomDayPicker;
exports.default = _default;