react-day-picker 8.4.0 → 8.5.0

package/dist/index.esm.js

@@ -1,38 +1,7 @@
 import * as React from 'react';
 import React__default, { createContext, useContext, useState, forwardRef, useEffect, useRef } from 'react';
-import enUS from 'date-fns/locale/en-US';
-import format from 'date-fns/format';
-import endOfMonth from 'date-fns/endOfMonth';
-import startOfDay from 'date-fns/startOfDay';
-import startOfMonth from 'date-fns/startOfMonth';
-import isSameYear from 'date-fns/isSameYear';
-import setMonth from 'date-fns/setMonth';
-import setYear from 'date-fns/setYear';
-import startOfYear from 'date-fns/startOfYear';
-import addMonths from 'date-fns/addMonths';
-import isBefore from 'date-fns/isBefore';
-import isSameMonth from 'date-fns/isSameMonth';
-import differenceInCalendarMonths from 'date-fns/differenceInCalendarMonths';
-import addDays from 'date-fns/addDays';
-import startOfISOWeek from 'date-fns/startOfISOWeek';
-import startOfWeek from 'date-fns/startOfWeek';
-import getUnixTime from 'date-fns/getUnixTime';
-import isSameDay from 'date-fns/isSameDay';
-import { isSameDay as isSameDay$1, isAfter as isAfter$1 } from 'date-fns';
-import differenceInCalendarDays from 'date-fns/differenceInCalendarDays';
-import subDays from 'date-fns/subDays';
-import isAfter from 'date-fns/isAfter';
-import isDate from 'date-fns/isDate';
-import addWeeks from 'date-fns/addWeeks';
-import addYears from 'date-fns/addYears';
-import endOfISOWeek from 'date-fns/endOfISOWeek';
-import endOfWeek from 'date-fns/endOfWeek';
-import max from 'date-fns/max';
-import min from 'date-fns/min';
-import getWeeksInMonth from 'date-fns/getWeeksInMonth';
-import getISOWeek from 'date-fns/getISOWeek';
-import getWeek from 'date-fns/getWeek';
-import parse from 'date-fns/parse';
+import { enUS } from 'date-fns/locale';
+import { format, startOfMonth, endOfMonth, startOfDay, isSameYear, setMonth, setYear, startOfYear, differenceInCalendarMonths, addMonths, isSameMonth, isBefore, startOfISOWeek, startOfWeek, addDays, isSameDay, isAfter, subDays, differenceInCalendarDays, isDate, max, min, addWeeks, addYears, endOfISOWeek, endOfWeek, getUnixTime, getISOWeek, getWeek, getWeeksInMonth, parse } from 'date-fns';
 
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
@@ -176,7 +145,7 @@ function formatWeekNumber(weekNumber) {
  * The default formatter for the name of the weekday.
  */
 function formatWeekdayName(weekday, options) {
-    return format(weekday, 'cccccc', options);
+    return format(weekday, 'cccccc', options).toUpperCase();
 }
 
 /**
@@ -251,8 +220,8 @@ var labels = /*#__PURE__*/Object.freeze({
     labelMonthDropdown: labelMonthDropdown,
     labelNext: labelNext,
     labelPrevious: labelPrevious,
-    labelWeekday: labelWeekday,
     labelWeekNumber: labelWeekNumber,
+    labelWeekday: labelWeekday,
     labelYearDropdown: labelYearDropdown
 });
 
@@ -354,7 +323,7 @@ function useDayPicker() {
 /** Render the caption for the displayed month. This component is used when `captionLayout="buttons"`. */
 function CaptionLabel(props) {
     var _a = useDayPicker(), locale = _a.locale, classNames = _a.classNames, styles = _a.styles, formatCaption = _a.formatters.formatCaption;
-    return (React__default.createElement("h2", { className: classNames.caption_label, style: styles.caption_label, "aria-live": "polite", "aria-atomic": "true", id: props.id }, formatCaption(props.displayMonth, { locale: locale })));
+    return (React__default.createElement("div", { className: classNames.caption_label, style: styles.caption_label, "aria-live": "polite", role: "presentation", id: props.id }, formatCaption(props.displayMonth, { locale: locale })));
 }
 
 /**
@@ -788,9 +757,7 @@ function HeadRow() {
     var weekdays = getWeekdays(locale, weekStartsOn, ISOWeek);
     return (React__default.createElement("tr", { style: styles.head_row, className: classNames.head_row },
         showWeekNumber && (React__default.createElement("th", { scope: "col", style: styles.head_cell, className: classNames.head_cell })),
-        weekdays.map(function (weekday, i) { return (React__default.createElement("th", { key: i, scope: "col", className: classNames.head_cell, style: styles.head_cell },
-            React__default.createElement("span", { "aria-hidden": true }, formatWeekdayName(weekday, { locale: locale })),
-            React__default.createElement("span", { className: classNames.vhidden }, labelWeekday(weekday, { locale: locale })))); })));
+        weekdays.map(function (weekday, i) { return (React__default.createElement("th", { key: i, scope: "col", className: classNames.head_cell, style: styles.head_cell, "aria-label": labelWeekday(weekday, { locale: locale }) }, formatWeekdayName(weekday, { locale: locale }))); })));
 }
 
 /** Render the table head. */
@@ -969,7 +936,7 @@ function SelectRangeProviderInternal(_a) {
         }
         else {
             modifiers.range_end = [selectedTo];
-            if (!isSameDay$1(selectedFrom, selectedTo)) {
+            if (!isSameDay(selectedFrom, selectedTo)) {
                 modifiers.range_middle = [
                     {
                         after: selectedFrom,
@@ -1223,7 +1190,7 @@ function isMatch(day, matchers) {
             var diffAfter = differenceInCalendarDays(matcher.after, day);
             var isDayBefore = diffBefore > 0;
             var isDayAfter = diffAfter < 0;
-            var isClosedInterval = isAfter$1(matcher.before, matcher.after);
+            var isClosedInterval = isAfter(matcher.before, matcher.after);
             if (isClosedInterval) {
                 return isDayAfter && isDayBefore;
             }
@@ -1745,9 +1712,6 @@ buttonRef) {
     ]);
     var className = getDayClassNames(dayPicker, activeModifiers).join(' ');
     var style = getDayStyle(dayPicker, activeModifiers);
-    var ariaLabel = dayPicker.labels.labelDay(day, activeModifiers, {
-        locale: dayPicker.locale
-    });
     var isHidden = Boolean((activeModifiers.outside && !dayPicker.showOutsideDays) ||
         activeModifiers.hidden);
     var DayContentComponent = (_c = (_b = dayPicker.components) === null || _b === void 0 ? void 0 : _b.DayContent) !== null && _c !== void 0 ? _c : DayContent;
@@ -1756,13 +1720,13 @@ buttonRef) {
         style: style,
         className: className,
         children: children,
-        'aria-label': ariaLabel
+        role: 'gridcell'
     };
     var isFocusTarget = focusContext.focusTarget &&
         isSameDay(focusContext.focusTarget, day) &&
         !activeModifiers.outside;
     var isFocused = focusContext.focusedDay && isSameDay(focusContext.focusedDay, day);
-    var buttonProps = __assign(__assign(__assign({}, divProps), (_a = { disabled: activeModifiers.disabled }, _a['aria-pressed'] = activeModifiers.selected, _a['aria-label'] = ariaLabel, _a.tabIndex = isFocused || isFocusTarget ? 0 : -1, _a)), eventHandlers);
+    var buttonProps = __assign(__assign(__assign({}, divProps), (_a = { disabled: activeModifiers.disabled, role: 'gridcell' }, _a['aria-selected'] = activeModifiers.selected, _a.tabIndex = isFocused || isFocusTarget ? 0 : -1, _a)), eventHandlers);
     var dayRender = {
         isButton: isButton,
         isHidden: isHidden,
@@ -1782,7 +1746,7 @@ function Day(props) {
     var buttonRef = useRef(null);
     var dayRender = useDayRender(props.date, props.displayMonth, buttonRef);
     if (dayRender.isHidden) {
-        return React__default.createElement(React__default.Fragment, null);
+        return React__default.createElement("div", { role: "gridcell" });
     }
     if (!dayRender.isButton) {
         return React__default.createElement("div", __assign({}, dayRender.divProps));
@@ -1821,7 +1785,7 @@ function Row(props) {
     }
     return (React__default.createElement("tr", { className: classNames.row, style: styles.row },
         weekNumberCell,
-        props.dates.map(function (date) { return (React__default.createElement("td", { className: classNames.cell, style: styles.cell, key: getUnixTime(date) },
+        props.dates.map(function (date) { return (React__default.createElement("td", { className: classNames.cell, style: styles.cell, key: getUnixTime(date), role: "presentation" },
             React__default.createElement(DayComponent, { displayMonth: props.displayMonth, date: date }))); })));
 }
 
@@ -1892,7 +1856,7 @@ function Table(props) {
     var FooterComponent = (_c = components === null || components === void 0 ? void 0 : components.Footer) !== null && _c !== void 0 ? _c : Footer;
     return (React__default.createElement("table", { className: classNames.table, style: styles.table, role: "grid", "aria-labelledby": props['aria-labelledby'] },
         !hideHead && React__default.createElement(HeadComponent, null),
-        React__default.createElement("tbody", { className: classNames.tbody, style: styles.tbody }, weeks.map(function (week) { return (React__default.createElement(RowComponent, { displayMonth: props.displayMonth, key: week.weekNumber, dates: week.dates, weekNumber: week.weekNumber })); })),
+        React__default.createElement("tbody", { className: classNames.tbody, style: styles.tbody, role: "rowgroup" }, weeks.map(function (week) { return (React__default.createElement(RowComponent, { displayMonth: props.displayMonth, key: week.weekNumber, dates: week.dates, weekNumber: week.weekNumber })); })),
         React__default.createElement(FooterComponent, null)));
 }
 
@@ -2138,7 +2102,7 @@ function RootProvider(props) {
  * For example, to use Spanish locale:
  *
  * ```
- * import es from 'date-fns/locale/es';
+ * import { es } from 'date-fns/locale';
  * <DayPicker locale={es} />
  * ```
  */