npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.894 → 3.0.896 - Mend

@cloudscape-design/components-themeable 3.0.894 → 3.0.896

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (162) hide show

package/lib/internal/template/date-range-picker/calendar/index.js CHANGED Viewed

@@ -2,67 +2,67 @@
 // SPDX-License-Identifier: Apache-2.0
 import React, { useState } from 'react';
 import clsx from 'clsx';
-import { addMonths, endOfDay, isAfter, isBefore, isSameMonth, startOfDay, startOfMonth } from 'date-fns';
+import { addMonths, addYears, endOfDay, isAfter, isBefore, isSameMonth, isSameYear, startOfDay, startOfMonth, startOfYear, } from 'date-fns';
 import { getDateLabel, renderTimeLabel } from '../../calendar/utils/intl';
 import { getBaseDay } from '../../calendar/utils/navigation-day';
+import { getBaseMonth } from '../../calendar/utils/navigation-month';
 import { useInternalI18n } from '../../i18n/context.js';
 import { useMobile } from '../../internal/hooks/use-mobile/index.js';
 import { useUniqueId } from '../../internal/hooks/use-unique-id';
-import { formatDateTime, parseDate, splitDateTime } from '../../internal/utils/date-time';
+import { formatDate, formatDateTime, parseDate, splitDateTime } from '../../internal/utils/date-time';
 import { normalizeLocale, normalizeStartOfWeek } from '../../internal/utils/locale';
 import InternalLiveRegion from '../../live-region/internal';
 import SpaceBetween from '../../space-between/internal';
 import { Grids } from './grids';
 import CalendarHeader from './header';
 import RangeInputs from './range-inputs.js';
-import { findDateToFocus, findMonthToDisplay } from './utils';
+import { findDateToFocus, findMonthToDisplay, findMonthToFocus, findYearToDisplay } from './utils';
 import styles from '../styles.css.js';
-export default function DateRangePickerCalendar({ value, setValue, locale = '', startOfWeek, isDateEnabled = () => true, dateDisabledReason = () => '', i18nStrings, dateOnly = false, timeInputFormat = 'hh:mm:ss', customAbsoluteRangeControl, }) {
+import testutilStyles from '../test-classes/styles.css.js';
+export default function DateRangePickerCalendar({ value, setValue, locale = '', startOfWeek, isDateEnabled = () => true, dateDisabledReason = () => '', i18nStrings, dateOnly = false, timeInputFormat = 'hh:mm:ss', customAbsoluteRangeControl, granularity = 'day', }) {
+    var _a, _b;
     const isSingleGrid = useMobile();
+    const isMonthPicker = granularity === 'month';
+    const hideTime = isMonthPicker || dateOnly;
     const normalizedLocale = normalizeLocale('DateRangePicker', locale);
     const normalizedStartOfWeek = normalizeStartOfWeek(startOfWeek, normalizedLocale);
     const i18n = useInternalI18n('date-range-picker');
     const [announcement, setAnnouncement] = useState('');
-    const [currentMonth, setCurrentMonth] = useState(() => findMonthToDisplay(value, isSingleGrid));
+    const findPageToDisplay = isMonthPicker ? findYearToDisplay : findMonthToDisplay;
+    const isSamePage = isMonthPicker ? isSameYear : isSameMonth;
+    const addPage = isMonthPicker ? addYears : addMonths;
+    const startOfPage = isMonthPicker ? startOfYear : startOfMonth;
+    const findItemToFocus = isMonthPicker ? findMonthToFocus : findDateToFocus;
+    const [currentPage, setCurrentPage] = useState(() => findPageToDisplay(value, isSingleGrid));
     const [focusedDate, setFocusedDate] = useState(() => {
         if (value.start.date) {
             const startDate = parseDate(value.start.date);
-            if (isSameMonth(startDate, currentMonth)) {
+            if (isSamePage(startDate, currentPage)) {
                 return startDate;
             }
-            if (!isSingleGrid && isSameMonth(startDate, addMonths(currentMonth, -1))) {
+            if (!isSingleGrid && isSamePage(startDate, addPage(currentPage, -1))) {
                 return startDate;
             }
         }
-        return findDateToFocus(parseDate(value.start.date), currentMonth, isDateEnabled);
+        return findItemToFocus(parseDate(value.start.date), currentPage, isDateEnabled);
     });
-    const updateCurrentMonth = (startDate) => {
-        if (startDate.length >= 8) {
-            const newCurrentMonth = startOfMonth(parseDate(startDate));
-            setCurrentMonth(isSingleGrid ? newCurrentMonth : addMonths(newCurrentMonth, 1));
+    const updateCurrentPage = (startDate) => {
+        if ((isMonthPicker && startDate.length >= 4) || startDate.length >= 8) {
+            const newCurrentPage = startOfPage(parseDate(startDate));
+            setCurrentPage(isSingleGrid ? newCurrentPage : addPage(newCurrentPage, 1));
         }
     };
     // recommended to include the start/end time announced with the selection
     // because the user is not aware of the fact that a start/end time is also set as soon as they select a date
     const announceStart = (startDate) => {
-        return (i18n('i18nStrings.startDateLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startDateLabel) +
-            ', ' +
-            getDateLabel(normalizedLocale, startDate) +
-            ', ' +
-            i18n('i18nStrings.startTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startTimeLabel) +
-            ', ' +
-            renderTimeLabel(normalizedLocale, startDate, timeInputFormat) +
-            '. ');
+        return `${i18n('i18nStrings.startDateLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startDateLabel)}, ${getDateLabel(normalizedLocale, startDate)}${hideTime
+            ? ''
+            : `, ${i18n('i18nStrings.startTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startTimeLabel)}, ${renderTimeLabel(normalizedLocale, startDate, timeInputFormat)}`}. `;
     };
     const announceEnd = (endDate) => {
-        return (i18n('i18nStrings.endDateLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endDateLabel) +
-            ', ' +
-            getDateLabel(normalizedLocale, endDate) +
-            ', ' +
-            i18n('i18nStrings.endTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endTimeLabel) +
-            ', ' +
-            renderTimeLabel(normalizedLocale, endDate, timeInputFormat) +
-            '. ');
+        return `${i18n('i18nStrings.endDateLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endDateLabel)}, ${getDateLabel(normalizedLocale, endDate)}${hideTime
+            ? ''
+            : `, ${i18n('i18nStrings.endTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endTimeLabel)}, ${renderTimeLabel(normalizedLocale, endDate, timeInputFormat)}`}. `;
     };
     const renderSelectedAbsoluteRangeAriaLive = i18n('i18nStrings.renderSelectedAbsoluteRangeAriaLive', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.renderSelectedAbsoluteRangeAriaLive, format => (startDate, endDate) => format({ startDate, endDate }));
     const announceRange = (startDate, endDate) => {
@@ -115,7 +115,7 @@ export default function DateRangePickerCalendar({ value, setValue, locale = '',
                 announcement = announceStart(newStart) + announceRange(newStart, existingEndDate);
             }
         }
-        const formatValue = (date, previous) => {
+        const formatValue = (date, previous, includeTime) => {
             if (date === null) {
                 // explicitly reset to empty
                 return { date: '', time: '' };
@@ -124,28 +124,36 @@ export default function DateRangePickerCalendar({ value, setValue, locale = '',
                 // keep old value
                 return previous;
             }
+            if (!includeTime) {
+                return {
+                    date: formatDate(date),
+                    time: '',
+                };
+            }
             return splitDateTime(formatDateTime(date));
         };
         setValue({
-            start: formatValue(newStart, value.start),
-            end: formatValue(newEnd, value.end),
+            start: formatValue(newStart, value.start, !hideTime),
+            end: formatValue(newEnd, value.end, !hideTime),
         });
         setAnnouncement(announcement);
     };
-    const onHeaderChangeMonthHandler = (newCurrentMonth) => {
-        setCurrentMonth(newCurrentMonth);
-        const newBaseDateMonth = isSingleGrid ? newCurrentMonth : addMonths(newCurrentMonth, -1);
-        const newBaseDate = getBaseDay(newBaseDateMonth, isDateEnabled);
+    const onHeaderChangePageHandler = (amount) => {
+        const addPageFn = isMonthPicker ? addYears : addMonths;
+        const getBaseFn = isMonthPicker ? getBaseMonth : getBaseDay;
+        const newBasePage = addPageFn(currentPage, amount);
+        setCurrentPage(newBasePage);
+        const newBaseDate = getBaseFn(newBasePage, isDateEnabled);
         setFocusedDate(newBaseDate);
     };
     const onChangeStartDate = (value) => {
         setValue((oldValue) => (Object.assign(Object.assign({}, oldValue), { start: Object.assign(Object.assign({}, oldValue.start), { date: value }) })));
-        updateCurrentMonth(value);
+        updateCurrentPage(value);
     };
     const interceptedSetValue = newValue => {
         setValue(oldValue => {
             const updated = typeof newValue === 'function' ? newValue(oldValue) : newValue;
-            updateCurrentMonth(updated.start.date);
+            updateCurrentPage(updated.start.date);
             return updated;
         });
     };
@@ -158,10 +166,10 @@ export default function DateRangePickerCalendar({ value, setValue, locale = '',
                 React.createElement("div", { className: clsx(styles.calendar, {
                         [styles['one-grid']]: isSingleGrid,
                     }) },
-                    React.createElement(CalendarHeader, { baseDate: currentMonth, locale: normalizedLocale, onChangeMonth: onHeaderChangeMonthHandler, previousMonthLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.previousMonthAriaLabel, nextMonthLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.nextMonthAriaLabel, isSingleGrid: isSingleGrid, headingIdPrefix: headingIdPrefix }),
-                    React.createElement(Grids, { isSingleGrid: isSingleGrid, locale: normalizedLocale, baseDate: currentMonth, focusedDate: focusedDate, onFocusedDateChange: setFocusedDate, isDateEnabled: isDateEnabled, dateDisabledReason: dateDisabledReason, onSelectDate: onSelectDateHandler, onChangeMonth: setCurrentMonth, startOfWeek: normalizedStartOfWeek, todayAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.todayAriaLabel, selectedStartDate: parseDate(value.start.date, true), selectedEndDate: parseDate(value.end.date, true), headingIdPrefix: headingIdPrefix })),
-                React.createElement(RangeInputs, { startDate: value.start.date, onChangeStartDate: onChangeStartDate, startTime: value.start.time, onChangeStartTime: value => setValue(oldValue => (Object.assign(Object.assign({}, oldValue), { start: Object.assign(Object.assign({}, oldValue.start), { time: value }) }))), endDate: value.end.date, onChangeEndDate: value => setValue(oldValue => (Object.assign(Object.assign({}, oldValue), { end: Object.assign(Object.assign({}, oldValue.end), { date: value }) }))), endTime: value.end.time, onChangeEndTime: value => setValue(oldValue => (Object.assign(Object.assign({}, oldValue), { end: Object.assign(Object.assign({}, oldValue.end), { time: value }) }))), i18nStrings: i18nStrings, dateOnly: dateOnly, timeInputFormat: timeInputFormat }),
+                    React.createElement(CalendarHeader, { granularity: granularity, baseDate: currentPage, locale: normalizedLocale, onChangePage: onHeaderChangePageHandler, previousPageLabel: isMonthPicker ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.previousYearAriaLabel : i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.previousMonthAriaLabel, nextPageLabel: isMonthPicker ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.nextYearAriaLabel : i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.nextMonthAriaLabel, isSingleGrid: isSingleGrid, headingIdPrefix: headingIdPrefix }),
+                    React.createElement(Grids, { granularity: granularity, isSingleGrid: isSingleGrid, locale: normalizedLocale, baseDate: currentPage, focusedDate: focusedDate, onFocusedDateChange: setFocusedDate, isDateEnabled: isDateEnabled, dateDisabledReason: dateDisabledReason, onSelectDate: onSelectDateHandler, onPageChange: setCurrentPage, startOfWeek: normalizedStartOfWeek, todayAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.todayAriaLabel, currentMonthAriaLabel: i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.currentMonthAriaLabel, selectedStartDate: ((_a = value === null || value === void 0 ? void 0 : value.start) === null || _a === void 0 ? void 0 : _a.date) ? parseDate(value.start.date, !isMonthPicker) : null, selectedEndDate: ((_b = value === null || value === void 0 ? void 0 : value.end) === null || _b === void 0 ? void 0 : _b.date) ? parseDate(value.end.date, !isMonthPicker) : null, headingIdPrefix: headingIdPrefix })),
+                React.createElement(RangeInputs, { startDate: value.start.date, onChangeStartDate: onChangeStartDate, startTime: value.start.time, onChangeStartTime: value => setValue(oldValue => (Object.assign(Object.assign({}, oldValue), { start: Object.assign(Object.assign({}, oldValue.start), { time: value }) }))), endDate: value.end.date, onChangeEndDate: value => setValue(oldValue => (Object.assign(Object.assign({}, oldValue), { end: Object.assign(Object.assign({}, oldValue.end), { date: value }) }))), endTime: value.end.time, onChangeEndTime: value => setValue(oldValue => (Object.assign(Object.assign({}, oldValue), { end: Object.assign(Object.assign({}, oldValue.end), { time: value }) }))), i18nStrings: i18nStrings, dateOnly: dateOnly, timeInputFormat: timeInputFormat, granularity: granularity }),
                 customAbsoluteRangeControl && React.createElement("div", null, customAbsoluteRangeControl(value, interceptedSetValue)))),
-        React.createElement(InternalLiveRegion, { className: styles['calendar-aria-live'], hidden: true, tagName: "span" }, announcement)));
+        React.createElement(InternalLiveRegion, { className: testutilStyles['calendar-aria-live'], hidden: true, tagName: "span" }, announcement)));
 }
 //# sourceMappingURL=index.js.map

package/lib/internal/template/date-range-picker/calendar/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\nimport { addMonths, endOfDay, isAfter, isBefore, isSameMonth, startOfDay, startOfMonth } from 'date-fns';\n\nimport { getDateLabel, renderTimeLabel } from '../../calendar/utils/intl';\nimport { getBaseDay } from '../../calendar/utils/navigation-day';\nimport { useInternalI18n } from '../../i18n/context.js';\nimport { BaseComponentProps } from '../../internal/base-component';\nimport { useMobile } from '../../internal/hooks/use-mobile/index.js';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { formatDateTime, parseDate, splitDateTime } from '../../internal/utils/date-time';\nimport { normalizeLocale, normalizeStartOfWeek } from '../../internal/utils/locale';\nimport InternalLiveRegion from '../../live-region/internal';\nimport SpaceBetween from '../../space-between/internal';\nimport { TimeInputProps } from '../../time-input/interfaces';\nimport { DateRangePickerProps, RangeCalendarI18nStrings } from '../interfaces';\nimport { Grids } from './grids';\nimport CalendarHeader from './header';\nimport RangeInputs from './range-inputs.js';\nimport { findDateToFocus, findMonthToDisplay } from './utils';\n\nimport styles from '../styles.css.js';\n\nexport interface DateRangePickerCalendarProps extends BaseComponentProps {\n value: DateRangePickerProps.PendingAbsoluteValue;\n setValue: React.Dispatch<React.SetStateAction<DateRangePickerProps.PendingAbsoluteValue>>;\n locale?: string;\n startOfWeek?: number;\n isDateEnabled?: (date: Date) => boolean;\n dateDisabledReason?: (date: Date) => string;\n i18nStrings?: RangeCalendarI18nStrings;\n dateOnly?: boolean;\n timeInputFormat?: TimeInputProps.Format;\n customAbsoluteRangeControl: DateRangePickerProps.AbsoluteRangeControl \| undefined;\n}\n\nexport default function DateRangePickerCalendar({\n value,\n setValue,\n locale = '',\n startOfWeek,\n isDateEnabled = () => true,\n dateDisabledReason = () => '',\n i18nStrings,\n dateOnly = false,\n timeInputFormat = 'hh:mm:ss',\n customAbsoluteRangeControl,\n}: DateRangePickerCalendarProps) {\n const isSingleGrid = useMobile();\n const normalizedLocale = normalizeLocale('DateRangePicker', locale);\n const normalizedStartOfWeek = normalizeStartOfWeek(startOfWeek, normalizedLocale);\n const i18n = useInternalI18n('date-range-picker');\n\n const [announcement, setAnnouncement] = useState('');\n const [currentMonth, setCurrentMonth] = useState(() => findMonthToDisplay(value, isSingleGrid));\n const [focusedDate, setFocusedDate] = useState<Date \| null>(() => {\n if (value.start.date) {\n const startDate = parseDate(value.start.date);\n if (isSameMonth(startDate, currentMonth)) {\n return startDate;\n }\n if (!isSingleGrid && isSameMonth(startDate, addMonths(currentMonth, -1))) {\n return startDate;\n }\n }\n return findDateToFocus(parseDate(value.start.date), currentMonth, isDateEnabled);\n });\n\n const updateCurrentMonth = (startDate: string) => {\n if (startDate.length >= 8) {\n const newCurrentMonth = startOfMonth(parseDate(startDate));\n setCurrentMonth(isSingleGrid ? newCurrentMonth : addMonths(newCurrentMonth, 1));\n }\n };\n\n // recommended to include the start/end time announced with the selection\n // because the user is not aware of the fact that a start/end time is also set as soon as they select a date\n const announceStart = (startDate: Date) => {\n return (\n i18n('i18nStrings.startDateLabel', i18nStrings?.startDateLabel) +\n ', ' +\n getDateLabel(normalizedLocale, startDate) +\n ', ' +\n i18n('i18nStrings.startTimeLabel', i18nStrings?.startTimeLabel) +\n ', ' +\n renderTimeLabel(normalizedLocale, startDate, timeInputFormat) +\n '. '\n );\n };\n\n const announceEnd = (endDate: Date) => {\n return (\n i18n('i18nStrings.endDateLabel', i18nStrings?.endDateLabel) +\n ', ' +\n getDateLabel(normalizedLocale, endDate) +\n ', ' +\n i18n('i18nStrings.endTimeLabel', i18nStrings?.endTimeLabel) +\n ', ' +\n renderTimeLabel(normalizedLocale, endDate, timeInputFormat) +\n '. '\n );\n };\n\n const renderSelectedAbsoluteRangeAriaLive = i18n(\n 'i18nStrings.renderSelectedAbsoluteRangeAriaLive',\n i18nStrings?.renderSelectedAbsoluteRangeAriaLive,\n format => (startDate, endDate) => format({ startDate, endDate })\n );\n\n const announceRange = (startDate: Date, endDate: Date) => {\n if (!renderSelectedAbsoluteRangeAriaLive) {\n return `${getDateLabel(normalizedLocale, startDate)} – ${getDateLabel(normalizedLocale, endDate)}`;\n }\n return renderSelectedAbsoluteRangeAriaLive(\n getDateLabel(normalizedLocale, startDate),\n getDateLabel(normalizedLocale, endDate)\n );\n };\n\n const onSelectDateHandler = (selectedDate: Date) => {\n const { start, end } = value;\n let newStart: Date \| undefined = undefined;\n let newEnd: Date \| null \| undefined = undefined;\n let announcement = '';\n\n // If both fields are empty, we set the start date\n if (!start.date && !end.date) {\n newStart = startOfDay(selectedDate);\n announcement = announceStart(newStart);\n }\n // If both fields are set, we start new\n else if (start.date && end.date) {\n newStart = startOfDay(selectedDate);\n newEnd = null;\n announcement = announceStart(newStart);\n }\n // If only the END date is empty, we fill it (and swap dates if needed)\n else if (start.date && !end.date) {\n const parsedStartDate = parseDate(start.date);\n\n if (isBefore(selectedDate, parsedStartDate)) {\n // The user has selected the range backwards, so we swap start and end\n newStart = startOfDay(selectedDate);\n newEnd = endOfDay(parsedStartDate);\n announcement = announceStart(newStart) + announceRange(newStart, newEnd);\n } else {\n newEnd = endOfDay(selectedDate);\n announcement = announceEnd(newEnd) + announceRange(parsedStartDate, newEnd);\n }\n }\n // If only the START date is empty, we fill it (and swap dates if needed)\n else if (!start.date && end.date) {\n const existingEndDate = parseDate(end.date);\n\n if (isAfter(selectedDate, existingEndDate)) {\n // The user has selected the range backwards, so we swap start and end\n newStart = startOfDay(existingEndDate);\n newEnd = endOfDay(selectedDate);\n announcement = announceEnd(newEnd) + announceRange(newStart, newEnd);\n } else {\n newStart = startOfDay(selectedDate);\n announcement = announceStart(newStart) + announceRange(newStart, existingEndDate);\n }\n }\n\n const formatValue = (\n date: Date \| null \| undefined,\n previous: DateRangePickerProps.DateTimeStrings\n ): DateRangePickerProps.DateTimeStrings => {\n if (date === null) {\n // explicitly reset to empty\n return { date: '', time: '' };\n } else if (date === undefined) {\n // keep old value\n return previous;\n }\n return splitDateTime(formatDateTime(date));\n };\n\n setValue({\n start: formatValue(newStart, value.start),\n end: formatValue(newEnd, value.end),\n });\n setAnnouncement(announcement);\n };\n\n const onHeaderChangeMonthHandler = (newCurrentMonth: Date) => {\n setCurrentMonth(newCurrentMonth);\n\n const newBaseDateMonth = isSingleGrid ? newCurrentMonth : addMonths(newCurrentMonth, -1);\n const newBaseDate = getBaseDay(newBaseDateMonth, isDateEnabled);\n setFocusedDate(newBaseDate);\n };\n\n const onChangeStartDate = (value: string) => {\n setValue((oldValue: DateRangePickerProps.PendingAbsoluteValue) => ({\n ...oldValue,\n start: { ...oldValue.start, date: value },\n }));\n updateCurrentMonth(value);\n };\n\n const interceptedSetValue: DateRangePickerCalendarProps['setValue'] = newValue => {\n setValue(oldValue => {\n const updated = typeof newValue === 'function' ? newValue(oldValue) : newValue;\n updateCurrentMonth(updated.start.date);\n return updated;\n });\n };\n\n const headingIdPrefix = useUniqueId('date-range-picker-calendar-heading');\n return (\n <>\n <div\n className={clsx(styles['calendar-container'], {\n [styles['one-grid']]: isSingleGrid,\n })}\n >\n <SpaceBetween size=\"s\">\n <div\n className={clsx(styles.calendar, {\n [styles['one-grid']]: isSingleGrid,\n })}\n >\n <CalendarHeader\n baseDate={currentMonth}\n locale={normalizedLocale}\n onChangeMonth={onHeaderChangeMonthHandler}\n previousMonthLabel={i18nStrings?.previousMonthAriaLabel}\n nextMonthLabel={i18nStrings?.nextMonthAriaLabel}\n isSingleGrid={isSingleGrid}\n headingIdPrefix={headingIdPrefix}\n />\n\n <Grids\n isSingleGrid={isSingleGrid}\n locale={normalizedLocale}\n baseDate={currentMonth}\n focusedDate={focusedDate}\n onFocusedDateChange={setFocusedDate}\n isDateEnabled={isDateEnabled}\n dateDisabledReason={dateDisabledReason}\n onSelectDate={onSelectDateHandler}\n onChangeMonth={setCurrentMonth}\n startOfWeek={normalizedStartOfWeek}\n todayAriaLabel={i18nStrings?.todayAriaLabel}\n selectedStartDate={parseDate(value.start.date, true)}\n selectedEndDate={parseDate(value.end.date, true)}\n headingIdPrefix={headingIdPrefix}\n />\n </div>\n\n <RangeInputs\n startDate={value.start.date}\n onChangeStartDate={onChangeStartDate}\n startTime={value.start.time}\n onChangeStartTime={value =>\n setValue(oldValue => ({ ...oldValue, start: { ...oldValue.start, time: value } }))\n }\n endDate={value.end.date}\n onChangeEndDate={value => setValue(oldValue => ({ ...oldValue, end: { ...oldValue.end, date: value } }))}\n endTime={value.end.time}\n onChangeEndTime={value => setValue(oldValue => ({ ...oldValue, end: { ...oldValue.end, time: value } }))}\n i18nStrings={i18nStrings}\n dateOnly={dateOnly}\n timeInputFormat={timeInputFormat}\n />\n {customAbsoluteRangeControl && <div>{customAbsoluteRangeControl(value, interceptedSetValue)}</div>}\n </SpaceBetween>\n </div>\n {/* Can't use message here because the contents are checked in tests */}\n <InternalLiveRegion className={styles['calendar-aria-live']} hidden={true} tagName=\"span\">\n {announcement}\n </InternalLiveRegion>\n </>\n );\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/index.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { useState } from 'react';\nimport clsx from 'clsx';\nimport {\n addMonths,\n addYears,\n endOfDay,\n isAfter,\n isBefore,\n isSameMonth,\n isSameYear,\n startOfDay,\n startOfMonth,\n startOfYear,\n} from 'date-fns';\n\nimport { getDateLabel, renderTimeLabel } from '../../calendar/utils/intl';\nimport { getBaseDay } from '../../calendar/utils/navigation-day';\nimport { getBaseMonth } from '../../calendar/utils/navigation-month';\nimport { useInternalI18n } from '../../i18n/context.js';\nimport { BaseComponentProps } from '../../internal/base-component';\nimport { useMobile } from '../../internal/hooks/use-mobile/index.js';\nimport { useUniqueId } from '../../internal/hooks/use-unique-id';\nimport { formatDate, formatDateTime, parseDate, splitDateTime } from '../../internal/utils/date-time';\nimport { normalizeLocale, normalizeStartOfWeek } from '../../internal/utils/locale';\nimport InternalLiveRegion from '../../live-region/internal';\nimport SpaceBetween from '../../space-between/internal';\nimport { TimeInputProps } from '../../time-input/interfaces';\nimport { DateRangePickerProps, RangeCalendarI18nStrings } from '../interfaces';\nimport { Grids } from './grids';\nimport CalendarHeader from './header';\nimport RangeInputs from './range-inputs.js';\nimport { findDateToFocus, findMonthToDisplay, findMonthToFocus, findYearToDisplay } from './utils';\n\nimport styles from '../styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\n\nexport interface DateRangePickerCalendarProps extends BaseComponentProps {\n value: DateRangePickerProps.PendingAbsoluteValue;\n setValue: React.Dispatch<React.SetStateAction<DateRangePickerProps.PendingAbsoluteValue>>;\n locale?: string;\n startOfWeek?: number;\n isDateEnabled?: (date: Date) => boolean;\n dateDisabledReason?: (date: Date) => string;\n i18nStrings?: RangeCalendarI18nStrings;\n dateOnly?: boolean;\n timeInputFormat?: TimeInputProps.Format;\n customAbsoluteRangeControl: DateRangePickerProps.AbsoluteRangeControl \| undefined;\n granularity?: DateRangePickerProps.Granularity;\n}\n\nexport default function DateRangePickerCalendar({\n value,\n setValue,\n locale = '',\n startOfWeek,\n isDateEnabled = () => true,\n dateDisabledReason = () => '',\n i18nStrings,\n dateOnly = false,\n timeInputFormat = 'hh:mm:ss',\n customAbsoluteRangeControl,\n granularity = 'day',\n}: DateRangePickerCalendarProps) {\n const isSingleGrid = useMobile();\n const isMonthPicker = granularity === 'month';\n const hideTime = isMonthPicker \|\| dateOnly;\n const normalizedLocale = normalizeLocale('DateRangePicker', locale);\n const normalizedStartOfWeek = normalizeStartOfWeek(startOfWeek, normalizedLocale);\n const i18n = useInternalI18n('date-range-picker');\n\n const [announcement, setAnnouncement] = useState('');\n const findPageToDisplay = isMonthPicker ? findYearToDisplay : findMonthToDisplay;\n const isSamePage = isMonthPicker ? isSameYear : isSameMonth;\n const addPage = isMonthPicker ? addYears : addMonths;\n const startOfPage = isMonthPicker ? startOfYear : startOfMonth;\n const findItemToFocus = isMonthPicker ? findMonthToFocus : findDateToFocus;\n const [currentPage, setCurrentPage] = useState(() => findPageToDisplay(value, isSingleGrid));\n const [focusedDate, setFocusedDate] = useState<Date \| null>(() => {\n if (value.start.date) {\n const startDate = parseDate(value.start.date);\n if (isSamePage(startDate, currentPage)) {\n return startDate;\n }\n if (!isSingleGrid && isSamePage(startDate, addPage(currentPage, -1))) {\n return startDate;\n }\n }\n return findItemToFocus(parseDate(value.start.date), currentPage, isDateEnabled);\n });\n\n const updateCurrentPage = (startDate: string) => {\n if ((isMonthPicker && startDate.length >= 4) \|\| startDate.length >= 8) {\n const newCurrentPage = startOfPage(parseDate(startDate));\n setCurrentPage(isSingleGrid ? newCurrentPage : addPage(newCurrentPage, 1));\n }\n };\n\n // recommended to include the start/end time announced with the selection\n // because the user is not aware of the fact that a start/end time is also set as soon as they select a date\n const announceStart = (startDate: Date) => {\n return `${i18n('i18nStrings.startDateLabel', i18nStrings?.startDateLabel)}, ${getDateLabel(normalizedLocale, startDate)}${\n hideTime\n ? ''\n : `, ${i18n('i18nStrings.startTimeLabel', i18nStrings?.startTimeLabel)}, ${renderTimeLabel(\n normalizedLocale,\n startDate,\n timeInputFormat\n )}`\n }. `;\n };\n\n const announceEnd = (endDate: Date) => {\n return `${i18n('i18nStrings.endDateLabel', i18nStrings?.endDateLabel)}, ${getDateLabel(normalizedLocale, endDate)}${\n hideTime\n ? ''\n : `, ${i18n('i18nStrings.endTimeLabel', i18nStrings?.endTimeLabel)}, ${renderTimeLabel(\n normalizedLocale,\n endDate,\n timeInputFormat\n )}`\n }. `;\n };\n\n const renderSelectedAbsoluteRangeAriaLive = i18n(\n 'i18nStrings.renderSelectedAbsoluteRangeAriaLive',\n i18nStrings?.renderSelectedAbsoluteRangeAriaLive,\n format => (startDate, endDate) => format({ startDate, endDate })\n );\n\n const announceRange = (startDate: Date, endDate: Date) => {\n if (!renderSelectedAbsoluteRangeAriaLive) {\n return `${getDateLabel(normalizedLocale, startDate)} – ${getDateLabel(normalizedLocale, endDate)}`;\n }\n return renderSelectedAbsoluteRangeAriaLive(\n getDateLabel(normalizedLocale, startDate),\n getDateLabel(normalizedLocale, endDate)\n );\n };\n\n const onSelectDateHandler = (selectedDate: Date) => {\n const { start, end } = value;\n let newStart: Date \| undefined = undefined;\n let newEnd: Date \| null \| undefined = undefined;\n let announcement = '';\n\n // If both fields are empty, we set the start date\n if (!start.date && !end.date) {\n newStart = startOfDay(selectedDate);\n announcement = announceStart(newStart);\n }\n // If both fields are set, we start new\n else if (start.date && end.date) {\n newStart = startOfDay(selectedDate);\n newEnd = null;\n announcement = announceStart(newStart);\n }\n // If only the END date is empty, we fill it (and swap dates if needed)\n else if (start.date && !end.date) {\n const parsedStartDate = parseDate(start.date);\n\n if (isBefore(selectedDate, parsedStartDate)) {\n // The user has selected the range backwards, so we swap start and end\n newStart = startOfDay(selectedDate);\n newEnd = endOfDay(parsedStartDate);\n announcement = announceStart(newStart) + announceRange(newStart, newEnd);\n } else {\n newEnd = endOfDay(selectedDate);\n announcement = announceEnd(newEnd) + announceRange(parsedStartDate, newEnd);\n }\n }\n // If only the START date is empty, we fill it (and swap dates if needed)\n else if (!start.date && end.date) {\n const existingEndDate = parseDate(end.date);\n\n if (isAfter(selectedDate, existingEndDate)) {\n // The user has selected the range backwards, so we swap start and end\n newStart = startOfDay(existingEndDate);\n newEnd = endOfDay(selectedDate);\n announcement = announceEnd(newEnd) + announceRange(newStart, newEnd);\n } else {\n newStart = startOfDay(selectedDate);\n announcement = announceStart(newStart) + announceRange(newStart, existingEndDate);\n }\n }\n\n const formatValue = (\n date: Date \| null \| undefined,\n previous: DateRangePickerProps.DateTimeStrings,\n includeTime: boolean\n ): DateRangePickerProps.DateTimeStrings => {\n if (date === null) {\n // explicitly reset to empty\n return { date: '', time: '' };\n } else if (date === undefined) {\n // keep old value\n return previous;\n }\n if (!includeTime) {\n return {\n date: formatDate(date),\n time: '',\n };\n }\n return splitDateTime(formatDateTime(date));\n };\n\n setValue({\n start: formatValue(newStart, value.start, !hideTime),\n end: formatValue(newEnd, value.end, !hideTime),\n });\n setAnnouncement(announcement);\n };\n\n const onHeaderChangePageHandler = (amount: number) => {\n const addPageFn = isMonthPicker ? addYears : addMonths;\n const getBaseFn = isMonthPicker ? getBaseMonth : getBaseDay;\n const newBasePage = addPageFn(currentPage, amount);\n setCurrentPage(newBasePage);\n const newBaseDate = getBaseFn(newBasePage, isDateEnabled);\n setFocusedDate(newBaseDate);\n };\n\n const onChangeStartDate = (value: string) => {\n setValue((oldValue: DateRangePickerProps.PendingAbsoluteValue) => ({\n ...oldValue,\n start: { ...oldValue.start, date: value },\n }));\n updateCurrentPage(value);\n };\n\n const interceptedSetValue: DateRangePickerCalendarProps['setValue'] = newValue => {\n setValue(oldValue => {\n const updated = typeof newValue === 'function' ? newValue(oldValue) : newValue;\n updateCurrentPage(updated.start.date);\n return updated;\n });\n };\n\n const headingIdPrefix = useUniqueId('date-range-picker-calendar-heading');\n\n return (\n <>\n <div\n className={clsx(styles['calendar-container'], {\n [styles['one-grid']]: isSingleGrid,\n })}\n >\n <SpaceBetween size=\"s\">\n <div\n className={clsx(styles.calendar, {\n [styles['one-grid']]: isSingleGrid,\n })}\n >\n <CalendarHeader\n granularity={granularity}\n baseDate={currentPage}\n locale={normalizedLocale}\n onChangePage={onHeaderChangePageHandler}\n previousPageLabel={\n isMonthPicker ? i18nStrings?.previousYearAriaLabel : i18nStrings?.previousMonthAriaLabel\n }\n nextPageLabel={isMonthPicker ? i18nStrings?.nextYearAriaLabel : i18nStrings?.nextMonthAriaLabel}\n isSingleGrid={isSingleGrid}\n headingIdPrefix={headingIdPrefix}\n />\n\n <Grids\n granularity={granularity}\n isSingleGrid={isSingleGrid}\n locale={normalizedLocale}\n baseDate={currentPage}\n focusedDate={focusedDate}\n onFocusedDateChange={setFocusedDate}\n isDateEnabled={isDateEnabled}\n dateDisabledReason={dateDisabledReason}\n onSelectDate={onSelectDateHandler}\n onPageChange={setCurrentPage}\n startOfWeek={normalizedStartOfWeek}\n todayAriaLabel={i18nStrings?.todayAriaLabel}\n currentMonthAriaLabel={i18nStrings?.currentMonthAriaLabel}\n selectedStartDate={value?.start?.date ? parseDate(value.start.date, !isMonthPicker) : null}\n selectedEndDate={value?.end?.date ? parseDate(value.end.date, !isMonthPicker) : null}\n headingIdPrefix={headingIdPrefix}\n />\n </div>\n\n <RangeInputs\n startDate={value.start.date}\n onChangeStartDate={onChangeStartDate}\n startTime={value.start.time}\n onChangeStartTime={value =>\n setValue(oldValue => ({ ...oldValue, start: { ...oldValue.start, time: value } }))\n }\n endDate={value.end.date}\n onChangeEndDate={value => setValue(oldValue => ({ ...oldValue, end: { ...oldValue.end, date: value } }))}\n endTime={value.end.time}\n onChangeEndTime={value => setValue(oldValue => ({ ...oldValue, end: { ...oldValue.end, time: value } }))}\n i18nStrings={i18nStrings}\n dateOnly={dateOnly}\n timeInputFormat={timeInputFormat}\n granularity={granularity}\n />\n {customAbsoluteRangeControl && <div>{customAbsoluteRangeControl(value, interceptedSetValue)}</div>}\n </SpaceBetween>\n </div>\n {/* Can't use message here because the contents are checked in tests */}\n <InternalLiveRegion className={testutilStyles['calendar-aria-live']} hidden={true} tagName=\"span\">\n {announcement}\n </InternalLiveRegion>\n </>\n );\n}\n"]}

package/lib/internal/template/date-range-picker/calendar/range-inputs.d.ts CHANGED Viewed

@@ -1,8 +1,8 @@
 /// <reference types="react" />
 import { BaseComponentProps } from '../../internal/base-component';
 import { TimeInputProps } from '../../time-input/interfaces';
-import { RangeCalendarI18nStrings } from '../interfaces';
-type I18nStrings = Pick<RangeCalendarI18nStrings, 'dateTimeConstraintText' | 'startDateLabel' | 'startTimeLabel' | 'endDateLabel' | 'endTimeLabel'>;
+import { DateRangePickerProps, RangeCalendarI18nStrings } from '../interfaces';
+type I18nStrings = Pick<RangeCalendarI18nStrings, 'dateConstraintText' | 'dateTimeConstraintText' | 'monthConstraintText' | 'startMonthLabel' | 'startDateLabel' | 'startTimeLabel' | 'endMonthLabel' | 'endDateLabel' | 'endTimeLabel'>;
 interface RangeInputsProps extends BaseComponentProps {
     startDate: string;
     onChangeStartDate: (value: string) => void;
@@ -15,7 +15,8 @@ interface RangeInputsProps extends BaseComponentProps {
     i18nStrings?: I18nStrings;
     dateOnly: boolean;
     timeInputFormat: TimeInputProps.Format;
+    granularity?: DateRangePickerProps.Granularity;
 }
-export default function RangeInputs({ startDate, onChangeStartDate, startTime, onChangeStartTime, endDate, onChangeEndDate, endTime, onChangeEndTime, i18nStrings, dateOnly, timeInputFormat, }: RangeInputsProps): JSX.Element;
+export default function RangeInputs({ startDate, onChangeStartDate, startTime, onChangeStartTime, endDate, onChangeEndDate, endTime, onChangeEndTime, i18nStrings, dateOnly, timeInputFormat, granularity, }: RangeInputsProps): JSX.Element;
 export {};
 //# sourceMappingURL=range-inputs.d.ts.map

package/lib/internal/template/date-range-picker/calendar/range-inputs.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"range-inputs.d.ts","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/range-inputs.tsx"],"names":[],"mappings":";~~AAQA~~,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAE7D,OAAO,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;~~AAIzD~~,KAAK,WAAW,GAAG,IAAI,CACrB,wBAAwB,~~EACxB~~,wBAAwB,~~GAAG~~,gBAAgB,~~GAAG~~,gBAAgB,~~GAAG~~,cAAc,~~GAAG~~,cAAc,~~CACjG~~,CAAC;AAEF,UAAU,gBAAiB,SAAQ,kBAAkB;IACnD,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,cAAc,CAAC,MAAM,CAAC;~~CACxC~~;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAS,EACT,iBAAiB,EACjB,SAAS,EACT,iBAAiB,EACjB,OAAO,EACP,eAAe,EACf,OAAO,EACP,eAAe,EACf,WAAW,EACX,QAAQ,EACR,eAAe,~~GAChB~~,EAAE,gBAAgB,~~eAoDlB~~"}
1	+ {"version":3,"file":"range-inputs.d.ts","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/range-inputs.tsx"],"names":[],"mappings":";AASA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AACnE,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAE7D,OAAO,EAAE,oBAAoB,EAAE,wBAAwB,EAAE,MAAM,eAAe,CAAC;AAK/E,KAAK,WAAW,GAAG,IAAI,CACrB,wBAAwB,EACtB,oBAAoB,GACpB,wBAAwB,GACxB,qBAAqB,GACrB,iBAAiB,GACjB,gBAAgB,GAChB,gBAAgB,GAChB,eAAe,GACf,cAAc,GACd,cAAc,CACjB,CAAC;AAEF,UAAU,gBAAiB,SAAQ,kBAAkB;IACnD,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,iBAAiB,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAC3C,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,OAAO,EAAE,MAAM,CAAC;IAChB,eAAe,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;IAClB,eAAe,EAAE,cAAc,CAAC,MAAM,CAAC;IACvC,WAAW,CAAC,EAAE,oBAAoB,CAAC,WAAW,CAAC;CAChD;AAED,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAS,EACT,iBAAiB,EACjB,SAAS,EACT,iBAAiB,EACjB,OAAO,EACP,eAAe,EACf,OAAO,EACP,eAAe,EACf,WAAW,EACX,QAAQ,EACR,eAAe,EACf,WAAmB,GACpB,EAAE,gBAAgB,eAkFlB"}

package/lib/internal/template/date-range-picker/calendar/range-inputs.js CHANGED Viewed

@@ -1,24 +1,37 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React from 'react';
+import clsx from 'clsx';
 import InternalDateInput from '../../date-input/internal';
 import InternalFormField from '../../form-field/internal';
 import { useInternalI18n } from '../../i18n/context.js';
 import InternalTimeInput from '../../time-input/internal';
 import styles from '../styles.css.js';
-export default function RangeInputs({ startDate, onChangeStartDate, startTime, onChangeStartTime, endDate, onChangeEndDate, endTime, onChangeEndTime, i18nStrings, dateOnly, timeInputFormat, }) {
+import testutilStyles from '../test-classes/styles.css.js';
+export default function RangeInputs({ startDate, onChangeStartDate, startTime, onChangeStartTime, endDate, onChangeEndDate, endTime, onChangeEndTime, i18nStrings, dateOnly, timeInputFormat, granularity = 'day', }) {
     const i18n = useInternalI18n('date-range-picker');
-    return (React.createElement(InternalFormField, { constraintText: i18n('i18nStrings.dateTimeConstraintText', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.dateTimeConstraintText) },
+    const isMonthPicker = granularity === 'month';
+    const dateInputPlaceholder = isMonthPicker ? 'YYYY/MM' : 'YYYY/MM/DD';
+    const showTimeInput = !dateOnly && !isMonthPicker;
+    return (React.createElement(InternalFormField, { constraintText: i18n(isMonthPicker
+            ? 'i18nStrings.monthConstraintText'
+            : dateOnly
+                ? 'i18nStrings.dateConstraintText'
+                : 'i18nStrings.dateTimeConstraintText', isMonthPicker
+            ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.monthConstraintText
+            : dateOnly
+                ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.dateConstraintText
+                : i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.dateTimeConstraintText) },
         React.createElement("div", { className: styles['date-and-time-container'] },
             React.createElement("div", { className: styles['date-and-time-wrapper'] },
-                React.createElement(InternalFormField, { label: i18n('i18nStrings.startDateLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startDateLabel), stretch: true },
-                    React.createElement(InternalDateInput, { value: startDate, className: styles['start-date-input'], onChange: event => onChangeStartDate(event.detail.value), placeholder: "YYYY/MM/DD" })),
-                !dateOnly && (React.createElement(InternalFormField, { label: i18n('i18nStrings.startTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startTimeLabel), stretch: true },
-                    React.createElement(InternalTimeInput, { value: startTime, onChange: event => onChangeStartTime(event.detail.value), format: timeInputFormat, placeholder: timeInputFormat, className: styles['start-time-input'] })))),
+                React.createElement(InternalFormField, { stretch: true, label: i18n(isMonthPicker ? 'i18nStrings.startMonthLabel' : 'i18nStrings.startDateLabel', isMonthPicker ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startMonthLabel : i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startDateLabel) },
+                    React.createElement(InternalDateInput, { value: startDate, className: clsx(testutilStyles['start-date-input'], isMonthPicker && testutilStyles['start-month-input']), onChange: event => onChangeStartDate(event.detail.value), placeholder: dateInputPlaceholder, granularity: granularity })),
+                showTimeInput && (React.createElement(InternalFormField, { stretch: true, label: i18n('i18nStrings.startTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.startTimeLabel) },
+                    React.createElement(InternalTimeInput, { value: startTime, onChange: event => onChangeStartTime(event.detail.value), format: timeInputFormat, placeholder: timeInputFormat, className: testutilStyles['start-time-input'] })))),
             React.createElement("div", { className: styles['date-and-time-wrapper'] },
-                React.createElement(InternalFormField, { label: i18n('i18nStrings.endDateLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endDateLabel), stretch: true },
-                    React.createElement(InternalDateInput, { value: endDate, className: styles['end-date-input'], onChange: event => onChangeEndDate(event.detail.value), placeholder: "YYYY/MM/DD" })),
-                !dateOnly && (React.createElement(InternalFormField, { label: i18n('i18nStrings.endTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endTimeLabel), stretch: true },
-                    React.createElement(InternalTimeInput, { value: endTime, onChange: event => onChangeEndTime(event.detail.value), format: timeInputFormat, placeholder: timeInputFormat, className: styles['end-time-input'] })))))));
+                React.createElement(InternalFormField, { stretch: true, label: i18n(isMonthPicker ? 'i18nStrings.endMonthLabel' : 'i18nStrings.endDateLabel', isMonthPicker ? i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endMonthLabel : i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endDateLabel) },
+                    React.createElement(InternalDateInput, { value: endDate, className: clsx(testutilStyles['end-date-input'], isMonthPicker && testutilStyles['end-month-picker']), onChange: event => onChangeEndDate(event.detail.value), placeholder: dateInputPlaceholder, granularity: granularity })),
+                showTimeInput && (React.createElement(InternalFormField, { label: i18n('i18nStrings.endTimeLabel', i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.endTimeLabel), stretch: true },
+                    React.createElement(InternalTimeInput, { value: endTime, onChange: event => onChangeEndTime(event.detail.value), format: timeInputFormat, placeholder: timeInputFormat, className: testutilStyles['end-time-input'] })))))));
 }
 //# sourceMappingURL=range-inputs.js.map

package/lib/internal/template/date-range-picker/calendar/range-inputs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"range-inputs.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/range-inputs.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;~~AAE1B~~,OAAO,iBAAiB,MAAM,2BAA2B,CAAC;AAC1D,OAAO,iBAAiB,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGxD,OAAO,iBAAiB,MAAM,2BAA2B,CAAC;AAG1D,OAAO,MAAM,MAAM,kBAAkB,CAAC;~~AAqBtC~~,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAS,EACT,iBAAiB,EACjB,SAAS,EACT,iBAAiB,EACjB,OAAO,EACP,eAAe,EACf,OAAO,EACP,eAAe,EACf,WAAW,EACX,QAAQ,EACR,eAAe,~~GACE~~;IACjB,MAAM,IAAI,GAAG,eAAe,CAAC,mBAAmB,CAAC,CAAC;IAElD,OAAO,CACL,oBAAC,iBAAiB,~~IAAC~~,cAAc,EAAE,IAAI,CAAC,oCAAoC,~~EAAE~~,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,~~sBAAsB~~,CAAC;~~QAChH~~,6BAAK,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC;YAC/C,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC;gBAC7C,oBAAC,iBAAiB,~~IAAC~~,KAAK,EAAE,IAAI,CAAC,4BAA4B,~~EAAE~~,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,~~cAAc~~,CAAC,~~EAAE~~,~~OAAO~~,~~EAAE~~,~~IAAI~~;~~oBACtG~~,oBAAC,iBAAiB,IAChB,KAAK,EAAE,SAAS,EAChB,SAAS,EAAE,~~MAAM~~,CAAC,kBAAkB,CAAC,~~EACrC~~,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACxD,WAAW,~~EAAC~~,~~YAAY~~,GACxB,CACgB;gBACnB,~~CAAC~~,~~QAAQ,~~IAAI,~~CACZ~~,oBAAC,iBAAiB,IAAC,KAAK,EAAE,IAAI,CAAC,4BAA4B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC~~,EAAE,OAAO,EAAE,IAAI~~;oBACtG,oBAAC,iBAAiB,IAChB,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACxD,MAAM,EAAE,eAAe,EACvB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,~~MAAM~~,CAAC,kBAAkB,CAAC,~~GACrC~~,CACgB,CACrB,CACG;YAEN,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC;gBAC7C,oBAAC,iBAAiB,~~IAAC~~,KAAK,EAAE,IAAI,CAAC,0BAA0B,~~EAAE~~,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,~~YAAY~~,CAAC,~~EAAE~~,~~OAAO~~,~~EAAE~~,~~IAAI~~;~~oBAClG~~,oBAAC,iBAAiB,IAChB,KAAK,EAAE,OAAO,EACd,SAAS,EAAE,~~MAAM~~,CAAC,gBAAgB,CAAC,~~EACnC~~,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,WAAW,~~EAAC~~,~~YAAY~~,GACxB,CACgB;gBACnB,~~CAAC~~,~~QAAQ,~~IAAI,~~CACZ~~,oBAAC,iBAAiB,IAAC,KAAK,EAAE,IAAI,CAAC,0BAA0B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,YAAY,CAAC,EAAE,OAAO,EAAE,IAAI;oBAClG,oBAAC,iBAAiB,IAChB,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,MAAM,EAAE,eAAe,EACvB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,~~MAAM~~,CAAC,gBAAgB,CAAC,~~GACnC~~,CACgB,CACrB,CACG,CACF,CACY,CACrB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\n\nimport InternalDateInput from '../../date-input/internal';\nimport InternalFormField from '../../form-field/internal';\nimport { useInternalI18n } from '../../i18n/context.js';\nimport { BaseComponentProps } from '../../internal/base-component';\nimport { TimeInputProps } from '../../time-input/interfaces';\nimport InternalTimeInput from '../../time-input/internal';\nimport { RangeCalendarI18nStrings } from '../interfaces';\n\nimport styles from '../styles.css.js';\n\ntype I18nStrings = Pick<\n RangeCalendarI18nStrings,\n 'dateTimeConstraintText' \| 'startDateLabel' \| 'startTimeLabel' \| 'endDateLabel' \| 'endTimeLabel'\n>;\n\ninterface RangeInputsProps extends BaseComponentProps {\n startDate: string;\n onChangeStartDate: (value: string) => void;\n startTime: string;\n onChangeStartTime: (value: string) => void;\n endDate: string;\n onChangeEndDate: (value: string) => void;\n endTime: string;\n onChangeEndTime: (value: string) => void;\n i18nStrings?: I18nStrings;\n dateOnly: boolean;\n timeInputFormat: TimeInputProps.Format;\n}\n\nexport default function RangeInputs({\n startDate,\n onChangeStartDate,\n startTime,\n onChangeStartTime,\n endDate,\n onChangeEndDate,\n endTime,\n onChangeEndTime,\n i18nStrings,\n dateOnly,\n timeInputFormat,\n}: RangeInputsProps) {\n const i18n = useInternalI18n('date-range-picker');\n\n return (\n <InternalFormField constraintText={i18n('i18nStrings.dateTimeConstraintText', i18nStrings?.dateTimeConstraintText)}>\n <div className={styles['date-and-time-container']}>\n <div className={styles['date-and-time-wrapper']}>\n <InternalFormField label={i18n('i18nStrings.startDateLabel', i18nStrings?.startDateLabel)} ~~stretch={true}~~>\n <InternalDateInput\n value={startDate}\n className={~~styles~~['start-date-input']}\n onChange={event => onChangeStartDate(event.detail.value)}\n placeholder~~=\"YYYY/MM/DD~~\"\n />\n </InternalFormField>\n {~~!dateOnly~~ && (\n <InternalFormField label={i18n('i18nStrings.startTimeLabel', i18nStrings?.startTimeLabel)} ~~stretch={true}~~>\n <InternalTimeInput\n value={startTime}\n onChange={event => onChangeStartTime(event.detail.value)}\n format={timeInputFormat}\n placeholder={timeInputFormat}\n className={~~styles~~['start-time-input']}\n />\n </InternalFormField>\n )}\n </div>\n\n <div className={styles['date-and-time-wrapper']}>\n <InternalFormField label={i18n('i18nStrings.endDateLabel', i18nStrings?.endDateLabel)} ~~stretch={true}~~>\n <InternalDateInput\n value={endDate}\n className={~~styles~~['end-date-input']}\n onChange={event => onChangeEndDate(event.detail.value)}\n placeholder~~=\"YYYY/MM/DD~~\"\n />\n </InternalFormField>\n {~~!dateOnly~~ && (\n <InternalFormField label={i18n('i18nStrings.endTimeLabel', i18nStrings?.endTimeLabel)} stretch={true}>\n <InternalTimeInput\n value={endTime}\n onChange={event => onChangeEndTime(event.detail.value)}\n format={timeInputFormat}\n placeholder={timeInputFormat}\n className={~~styles~~['end-time-input']}\n />\n </InternalFormField>\n )}\n </div>\n </div>\n </InternalFormField>\n );\n}\n"]}
1	+ {"version":3,"file":"range-inputs.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/range-inputs.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AAEtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,iBAAiB,MAAM,2BAA2B,CAAC;AAC1D,OAAO,iBAAiB,MAAM,2BAA2B,CAAC;AAC1D,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGxD,OAAO,iBAAiB,MAAM,2BAA2B,CAAC;AAG1D,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,cAAc,MAAM,+BAA+B,CAAC;AA8B3D,MAAM,CAAC,OAAO,UAAU,WAAW,CAAC,EAClC,SAAS,EACT,iBAAiB,EACjB,SAAS,EACT,iBAAiB,EACjB,OAAO,EACP,eAAe,EACf,OAAO,EACP,eAAe,EACf,WAAW,EACX,QAAQ,EACR,eAAe,EACf,WAAW,GAAG,KAAK,GACF;IACjB,MAAM,IAAI,GAAG,eAAe,CAAC,mBAAmB,CAAC,CAAC;IAClD,MAAM,aAAa,GAAG,WAAW,KAAK,OAAO,CAAC;IAC9C,MAAM,oBAAoB,GAAG,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,YAAY,CAAC;IACtE,MAAM,aAAa,GAAG,CAAC,QAAQ,IAAI,CAAC,aAAa,CAAC;IAElD,OAAO,CACL,oBAAC,iBAAiB,IAChB,cAAc,EAAE,IAAI,CAClB,aAAa;YACX,CAAC,CAAC,iCAAiC;YACnC,CAAC,CAAC,QAAQ;gBACR,CAAC,CAAC,gCAAgC;gBAClC,CAAC,CAAC,oCAAoC,EAC1C,aAAa;YACX,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,mBAAmB;YAClC,CAAC,CAAC,QAAQ;gBACR,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,kBAAkB;gBACjC,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,sBAAsB,CAC1C;QAED,6BAAK,SAAS,EAAE,MAAM,CAAC,yBAAyB,CAAC;YAC/C,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC;gBAC7C,oBAAC,iBAAiB,IAChB,OAAO,EAAE,IAAI,EACb,KAAK,EAAE,IAAI,CACT,aAAa,CAAC,CAAC,CAAC,6BAA6B,CAAC,CAAC,CAAC,4BAA4B,EAC5E,aAAa,CAAC,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,eAAe,CAAC,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAC3E;oBAED,oBAAC,iBAAiB,IAChB,KAAK,EAAE,SAAS,EAChB,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,kBAAkB,CAAC,EAAE,aAAa,IAAI,cAAc,CAAC,mBAAmB,CAAC,CAAC,EACzG,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACxD,WAAW,EAAE,oBAAoB,EACjC,WAAW,EAAE,WAAW,GACxB,CACgB;gBACnB,aAAa,IAAI,CAChB,oBAAC,iBAAiB,IAAC,OAAO,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,4BAA4B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,cAAc,CAAC;oBACtG,oBAAC,iBAAiB,IAChB,KAAK,EAAE,SAAS,EAChB,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,iBAAiB,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACxD,MAAM,EAAE,eAAe,EACvB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,cAAc,CAAC,kBAAkB,CAAC,GAC7C,CACgB,CACrB,CACG;YAEN,6BAAK,SAAS,EAAE,MAAM,CAAC,uBAAuB,CAAC;gBAC7C,oBAAC,iBAAiB,IAChB,OAAO,EAAE,IAAI,EACb,KAAK,EAAE,IAAI,CACT,aAAa,CAAC,CAAC,CAAC,2BAA2B,CAAC,CAAC,CAAC,0BAA0B,EACxE,aAAa,CAAC,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,aAAa,CAAC,CAAC,CAAC,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,YAAY,CACvE;oBAED,oBAAC,iBAAiB,IAChB,KAAK,EAAE,OAAO,EACd,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,gBAAgB,CAAC,EAAE,aAAa,IAAI,cAAc,CAAC,kBAAkB,CAAC,CAAC,EACtG,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,WAAW,EAAE,oBAAoB,EACjC,WAAW,EAAE,WAAW,GACxB,CACgB;gBACnB,aAAa,IAAI,CAChB,oBAAC,iBAAiB,IAAC,KAAK,EAAE,IAAI,CAAC,0BAA0B,EAAE,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,YAAY,CAAC,EAAE,OAAO,EAAE,IAAI;oBAClG,oBAAC,iBAAiB,IAChB,KAAK,EAAE,OAAO,EACd,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EACtD,MAAM,EAAE,eAAe,EACvB,WAAW,EAAE,eAAe,EAC5B,SAAS,EAAE,cAAc,CAAC,gBAAgB,CAAC,GAC3C,CACgB,CACrB,CACG,CACF,CACY,CACrB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport InternalDateInput from '../../date-input/internal';\nimport InternalFormField from '../../form-field/internal';\nimport { useInternalI18n } from '../../i18n/context.js';\nimport { BaseComponentProps } from '../../internal/base-component';\nimport { TimeInputProps } from '../../time-input/interfaces';\nimport InternalTimeInput from '../../time-input/internal';\nimport { DateRangePickerProps, RangeCalendarI18nStrings } from '../interfaces';\n\nimport styles from '../styles.css.js';\nimport testutilStyles from '../test-classes/styles.css.js';\n\ntype I18nStrings = Pick<\n RangeCalendarI18nStrings,\n \| 'dateConstraintText'\n \| 'dateTimeConstraintText'\n \| 'monthConstraintText'\n \| 'startMonthLabel'\n \| 'startDateLabel'\n \| 'startTimeLabel'\n \| 'endMonthLabel'\n \| 'endDateLabel'\n \| 'endTimeLabel'\n>;\n\ninterface RangeInputsProps extends BaseComponentProps {\n startDate: string;\n onChangeStartDate: (value: string) => void;\n startTime: string;\n onChangeStartTime: (value: string) => void;\n endDate: string;\n onChangeEndDate: (value: string) => void;\n endTime: string;\n onChangeEndTime: (value: string) => void;\n i18nStrings?: I18nStrings;\n dateOnly: boolean;\n timeInputFormat: TimeInputProps.Format;\n granularity?: DateRangePickerProps.Granularity;\n}\n\nexport default function RangeInputs({\n startDate,\n onChangeStartDate,\n startTime,\n onChangeStartTime,\n endDate,\n onChangeEndDate,\n endTime,\n onChangeEndTime,\n i18nStrings,\n dateOnly,\n timeInputFormat,\n granularity = 'day',\n}: RangeInputsProps) {\n const i18n = useInternalI18n('date-range-picker');\n const isMonthPicker = granularity === 'month';\n const dateInputPlaceholder = isMonthPicker ? 'YYYY/MM' : 'YYYY/MM/DD';\n const showTimeInput = !dateOnly && !isMonthPicker;\n\n return (\n <InternalFormField\n constraintText={i18n(\n isMonthPicker\n ? 'i18nStrings.monthConstraintText'\n : dateOnly\n ? 'i18nStrings.dateConstraintText'\n : 'i18nStrings.dateTimeConstraintText',\n isMonthPicker\n ? i18nStrings?.monthConstraintText\n : dateOnly\n ? i18nStrings?.dateConstraintText\n : i18nStrings?.dateTimeConstraintText\n )}\n >\n <div className={styles['date-and-time-container']}>\n <div className={styles['date-and-time-wrapper']}>\n <InternalFormField\n stretch={true}\n label={i18n(\n isMonthPicker ? 'i18nStrings.startMonthLabel' : 'i18nStrings.startDateLabel',\n isMonthPicker ? i18nStrings?.startMonthLabel : i18nStrings?.startDateLabel\n )}\n >\n <InternalDateInput\n value={startDate}\n className={clsx(testutilStyles['start-date-input'], isMonthPicker && testutilStyles['start-month-input'])}\n onChange={event => onChangeStartDate(event.detail.value)}\n placeholder={dateInputPlaceholder}\n granularity={granularity}\n />\n </InternalFormField>\n {showTimeInput && (\n <InternalFormField stretch={true} label={i18n('i18nStrings.startTimeLabel', i18nStrings?.startTimeLabel)}>\n <InternalTimeInput\n value={startTime}\n onChange={event => onChangeStartTime(event.detail.value)}\n format={timeInputFormat}\n placeholder={timeInputFormat}\n className={testutilStyles['start-time-input']}\n />\n </InternalFormField>\n )}\n </div>\n\n <div className={styles['date-and-time-wrapper']}>\n <InternalFormField\n stretch={true}\n label={i18n(\n isMonthPicker ? 'i18nStrings.endMonthLabel' : 'i18nStrings.endDateLabel',\n isMonthPicker ? i18nStrings?.endMonthLabel : i18nStrings?.endDateLabel\n )}\n >\n <InternalDateInput\n value={endDate}\n className={clsx(testutilStyles['end-date-input'], isMonthPicker && testutilStyles['end-month-picker'])}\n onChange={event => onChangeEndDate(event.detail.value)}\n placeholder={dateInputPlaceholder}\n granularity={granularity}\n />\n </InternalFormField>\n {showTimeInput && (\n <InternalFormField label={i18n('i18nStrings.endTimeLabel', i18nStrings?.endTimeLabel)} stretch={true}>\n <InternalTimeInput\n value={endTime}\n onChange={event => onChangeEndTime(event.detail.value)}\n format={timeInputFormat}\n placeholder={timeInputFormat}\n className={testutilStyles['end-time-input']}\n />\n </InternalFormField>\n )}\n </div>\n </div>\n </InternalFormField>\n );\n}\n"]}

package/lib/internal/template/date-range-picker/calendar/utils.d.ts CHANGED Viewed

@@ -1,4 +1,6 @@
 import { DateRangePickerProps } from '../interfaces';
 export declare function findDateToFocus(selected: Date | null, baseDate: Date, isDateEnabled: DateRangePickerProps.IsDateEnabledFunction): Date | null;
+export declare function findMonthToFocus(selected: Date | null, baseDate: Date, isMonthEnabled: DateRangePickerProps.IsDateEnabledFunction): Date | null;
 export declare function findMonthToDisplay(value: DateRangePickerProps.PendingAbsoluteValue, isSingleGrid: boolean): Date;
+export declare function findYearToDisplay(value: DateRangePickerProps.PendingAbsoluteValue, isSingleGrid: boolean): Date;
 //# sourceMappingURL=utils.d.ts.map

package/lib/internal/template/date-range-picker/calendar/utils.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/utils.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAErD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,eAa1D;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,oBAAoB,CAAC,oBAAoB,EAAE,YAAY,EAAE,OAAO,QAYzG"}
1	+ {"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/utils.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAErD,wBAAgB,eAAe,CAC7B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,eAa1D;AAED,wBAAgB,gBAAgB,CAC9B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,cAAc,EAAE,oBAAoB,CAAC,qBAAqB,eAc3D;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,oBAAoB,CAAC,oBAAoB,EAAE,YAAY,EAAE,OAAO,QAYzG;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,oBAAoB,CAAC,oBAAoB,EAAE,YAAY,EAAE,OAAO,QAYxG"}

package/lib/internal/template/date-range-picker/calendar/utils.js CHANGED Viewed

@@ -1,6 +1,6 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import { addMonths, isSameMonth, startOfMonth } from 'date-fns';
+import { addMonths, addYears, isSameMonth, isSameYear, startOfMonth, startOfYear } from 'date-fns';
 import { parseDate } from '../../internal/utils/date-time';
 export function findDateToFocus(selected, baseDate, isDateEnabled) {
     if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {
@@ -15,6 +15,19 @@ export function findDateToFocus(selected, baseDate, isDateEnabled) {
     }
     return null;
 }
+export function findMonthToFocus(selected, baseDate, isMonthEnabled) {
+    if (selected && isMonthEnabled(selected) && isSameYear(selected, baseDate)) {
+        return selected;
+    }
+    const today = new Date();
+    if (isMonthEnabled(today) && isSameYear(today, baseDate)) {
+        return today;
+    }
+    if (isMonthEnabled(baseDate)) {
+        return baseDate;
+    }
+    return null;
+}
 export function findMonthToDisplay(value, isSingleGrid) {
     if (value.start.date) {
         const startDate = parseDate(value.start.date);
@@ -28,4 +41,17 @@ export function findMonthToDisplay(value, isSingleGrid) {
     }
     return startOfMonth(Date.now());
 }
+export function findYearToDisplay(value, isSingleGrid) {
+    if (value.start.date) {
+        const startDate = parseDate(value.start.date);
+        if (isSingleGrid) {
+            return startOfYear(startDate);
+        }
+        return startOfYear(addYears(startDate, 1));
+    }
+    if (value.end.date) {
+        return startOfYear(parseDate(value.end.date));
+    }
+    return startOfYear(Date.now());
+}
 //# sourceMappingURL=utils.js.map

package/lib/internal/template/date-range-picker/calendar/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;~~AAEhE~~,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAG3D,MAAM,UAAU,eAAe,CAC7B,QAAqB,EACrB,QAAc,EACd,aAAyD;IAEzD,IAAI,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAAE;QAC1E,OAAO,QAAQ,CAAC;KACjB;IACD,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,IAAI,aAAa,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;QACxD,OAAO,KAAK,CAAC;KACd;IACD,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE;QAC3B,OAAO,QAAQ,CAAC;KACjB;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,KAAgD,EAAE,YAAqB;IACxG,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE;QACpB,MAAM,SAAS,GAAG,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC9C,IAAI,YAAY,EAAE;YAChB,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;SAChC;QACD,OAAO,YAAY,CAAC,SAAS,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;KAC9C;IACD,IAAI,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE;QAClB,OAAO,YAAY,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;KAChD;IACD,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAClC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { addMonths, isSameMonth, startOfMonth } from 'date-fns';\n\nimport { parseDate } from '../../internal/utils/date-time';\nimport { DateRangePickerProps } from '../interfaces';\n\nexport function findDateToFocus(\n selected: Date \| null,\n baseDate: Date,\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction\n) {\n if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {\n return selected;\n }\n const today = new Date();\n if (isDateEnabled(today) && isSameMonth(today, baseDate)) {\n return today;\n }\n if (isDateEnabled(baseDate)) {\n return baseDate;\n }\n return null;\n}\n\nexport function findMonthToDisplay(value: DateRangePickerProps.PendingAbsoluteValue, isSingleGrid: boolean) {\n if (value.start.date) {\n const startDate = parseDate(value.start.date);\n if (isSingleGrid) {\n return startOfMonth(startDate);\n }\n return startOfMonth(addMonths(startDate, 1));\n }\n if (value.end.date) {\n return startOfMonth(parseDate(value.end.date));\n }\n return startOfMonth(Date.now());\n}\n"]}
1	+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/utils.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,WAAW,EAAE,UAAU,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEnG,OAAO,EAAE,SAAS,EAAE,MAAM,gCAAgC,CAAC;AAG3D,MAAM,UAAU,eAAe,CAC7B,QAAqB,EACrB,QAAc,EACd,aAAyD;IAEzD,IAAI,QAAQ,IAAI,aAAa,CAAC,QAAQ,CAAC,IAAI,WAAW,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAAE;QAC1E,OAAO,QAAQ,CAAC;KACjB;IACD,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,IAAI,aAAa,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;QACxD,OAAO,KAAK,CAAC;KACd;IACD,IAAI,aAAa,CAAC,QAAQ,CAAC,EAAE;QAC3B,OAAO,QAAQ,CAAC;KACjB;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,UAAU,gBAAgB,CAC9B,QAAqB,EACrB,QAAc,EACd,cAA0D;IAE1D,IAAI,QAAQ,IAAI,cAAc,CAAC,QAAQ,CAAC,IAAI,UAAU,CAAC,QAAQ,EAAE,QAAQ,CAAC,EAAE;QAC1E,OAAO,QAAQ,CAAC;KACjB;IAED,MAAM,KAAK,GAAG,IAAI,IAAI,EAAE,CAAC;IACzB,IAAI,cAAc,CAAC,KAAK,CAAC,IAAI,UAAU,CAAC,KAAK,EAAE,QAAQ,CAAC,EAAE;QACxD,OAAO,KAAK,CAAC;KACd;IACD,IAAI,cAAc,CAAC,QAAQ,CAAC,EAAE;QAC5B,OAAO,QAAQ,CAAC;KACjB;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAED,MAAM,UAAU,kBAAkB,CAAC,KAAgD,EAAE,YAAqB;IACxG,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE;QACpB,MAAM,SAAS,GAAG,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC9C,IAAI,YAAY,EAAE;YAChB,OAAO,YAAY,CAAC,SAAS,CAAC,CAAC;SAChC;QACD,OAAO,YAAY,CAAC,SAAS,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;KAC9C;IACD,IAAI,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE;QAClB,OAAO,YAAY,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;KAChD;IACD,OAAO,YAAY,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AAClC,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,KAAgD,EAAE,YAAqB;IACvG,IAAI,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE;QACpB,MAAM,SAAS,GAAG,SAAS,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;QAC9C,IAAI,YAAY,EAAE;YAChB,OAAO,WAAW,CAAC,SAAS,CAAC,CAAC;SAC/B;QACD,OAAO,WAAW,CAAC,QAAQ,CAAC,SAAS,EAAE,CAAC,CAAC,CAAC,CAAC;KAC5C;IACD,IAAI,KAAK,CAAC,GAAG,CAAC,IAAI,EAAE;QAClB,OAAO,WAAW,CAAC,SAAS,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC;KAC/C;IACD,OAAO,WAAW,CAAC,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;AACjC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { addMonths, addYears, isSameMonth, isSameYear, startOfMonth, startOfYear } from 'date-fns';\n\nimport { parseDate } from '../../internal/utils/date-time';\nimport { DateRangePickerProps } from '../interfaces';\n\nexport function findDateToFocus(\n selected: Date \| null,\n baseDate: Date,\n isDateEnabled: DateRangePickerProps.IsDateEnabledFunction\n) {\n if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {\n return selected;\n }\n const today = new Date();\n if (isDateEnabled(today) && isSameMonth(today, baseDate)) {\n return today;\n }\n if (isDateEnabled(baseDate)) {\n return baseDate;\n }\n return null;\n}\n\nexport function findMonthToFocus(\n selected: Date \| null,\n baseDate: Date,\n isMonthEnabled: DateRangePickerProps.IsDateEnabledFunction\n) {\n if (selected && isMonthEnabled(selected) && isSameYear(selected, baseDate)) {\n return selected;\n }\n\n const today = new Date();\n if (isMonthEnabled(today) && isSameYear(today, baseDate)) {\n return today;\n }\n if (isMonthEnabled(baseDate)) {\n return baseDate;\n }\n return null;\n}\n\nexport function findMonthToDisplay(value: DateRangePickerProps.PendingAbsoluteValue, isSingleGrid: boolean) {\n if (value.start.date) {\n const startDate = parseDate(value.start.date);\n if (isSingleGrid) {\n return startOfMonth(startDate);\n }\n return startOfMonth(addMonths(startDate, 1));\n }\n if (value.end.date) {\n return startOfMonth(parseDate(value.end.date));\n }\n return startOfMonth(Date.now());\n}\n\nexport function findYearToDisplay(value: DateRangePickerProps.PendingAbsoluteValue, isSingleGrid: boolean) {\n if (value.start.date) {\n const startDate = parseDate(value.start.date);\n if (isSingleGrid) {\n return startOfYear(startDate);\n }\n return startOfYear(addYears(startDate, 1));\n }\n if (value.end.date) {\n return startOfYear(parseDate(value.end.date));\n }\n return startOfYear(Date.now());\n}\n"]}

package/lib/internal/template/date-range-picker/dropdown.d.ts CHANGED Viewed

@@ -1,12 +1,13 @@
 /// <reference types="react" />
 import { DateRangePickerProps } from './interfaces';
-interface DateRangePickerDropdownProps extends Pick<Required<DateRangePickerProps>, 'locale' | 'isDateEnabled' | 'isValidRange' | 'value' | 'relativeOptions' | 'showClearButton' | 'dateOnly' | 'timeInputFormat' | 'rangeSelectorMode'>, Pick<DateRangePickerProps, 'startOfWeek' | 'getTimeOffset' | 'timeOffset' | 'ariaLabelledby' | 'ariaDescribedby' | 'i18nStrings' | 'customRelativeRangeUnits' | 'dateDisabledReason'> {
+interface DateRangePickerDropdownProps extends Pick<Required<DateRangePickerProps>, 'locale' | 'isDateEnabled' | 'isValidRange' | 'value' | 'relativeOptions' | 'showClearButton' | 'dateOnly' | 'rangeSelectorMode'>, Pick<DateRangePickerProps, 'startOfWeek' | 'getTimeOffset' | 'timeInputFormat' | 'timeOffset' | 'ariaLabelledby' | 'ariaDescribedby' | 'i18nStrings' | 'customRelativeRangeUnits' | 'dateDisabledReason'> {
     onClear: () => void;
     onApply: (value: null | DateRangePickerProps.Value) => DateRangePickerProps.ValidationResult;
     onDropdownClose: () => void;
     isSingleGrid: boolean;
     customAbsoluteRangeControl: DateRangePickerProps.AbsoluteRangeControl | undefined;
+    granularity?: DateRangePickerProps.Granularity;
 }
-export declare function DateRangePickerDropdown({ locale, startOfWeek, isDateEnabled, dateDisabledReason, isValidRange, value, onClear: clearValue, onApply: applyValue, getTimeOffset, timeOffset, onDropdownClose, relativeOptions, showClearButton, isSingleGrid, i18nStrings, dateOnly, timeInputFormat, rangeSelectorMode, ariaLabelledby, ariaDescribedby, customAbsoluteRangeControl, customRelativeRangeUnits, }: DateRangePickerDropdownProps): JSX.Element;
+export declare function DateRangePickerDropdown({ locale, startOfWeek, isDateEnabled, dateDisabledReason, isValidRange, value, onClear: clearValue, onApply: applyValue, getTimeOffset, timeOffset, onDropdownClose, relativeOptions, showClearButton, isSingleGrid, i18nStrings, dateOnly, timeInputFormat, rangeSelectorMode, ariaLabelledby, ariaDescribedby, customAbsoluteRangeControl, customRelativeRangeUnits, granularity, }: DateRangePickerDropdownProps): JSX.Element;
 export {};
 //# sourceMappingURL=dropdown.d.ts.map

package/lib/internal/template/date-range-picker/dropdown.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/date-range-picker/dropdown.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;~~AAUpD~~,UAAU,4BACR,SAAQ,IAAI,CACR,QAAQ,CAAC,oBAAoB,CAAC,EAC5B,QAAQ,GACR,eAAe,GACf,cAAc,GACd,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,UAAU,GACV,~~iBAAiB,GACjB,~~mBAAmB,CACtB,EACD,IAAI,CACF,oBAAoB,EAClB,aAAa,GACb,eAAe,GACf,YAAY,GACZ,gBAAgB,GAChB,iBAAiB,GACjB,aAAa,GACb,0BAA0B,GAC1B,oBAAoB,CACvB;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,oBAAoB,CAAC,KAAK,KAAK,oBAAoB,CAAC,gBAAgB,CAAC;IAC7F,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,EAAE,OAAO,CAAC;IACtB,0BAA0B,EAAE,oBAAoB,CAAC,oBAAoB,GAAG,SAAS,CAAC;~~CACnF~~;AAED,wBAAgB,uBAAuB,CAAC,EACtC,MAAW,EACX,WAAW,EACX,aAAa,EACb,kBAA6B,EAC7B,YAAY,EACZ,KAAK,EACL,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,UAAU,EACnB,aAAa,EACb,UAAU,EACV,eAAe,EACf,eAAe,EACf,eAAe,EACf,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,0BAA0B,EAC1B,wBAAwB,~~GACzB~~,EAAE,4BAA4B,~~eAsM9B~~"}
1	+ {"version":3,"file":"dropdown.d.ts","sourceRoot":"","sources":["../../../src/date-range-picker/dropdown.tsx"],"names":[],"mappings":";AAeA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAWpD,UAAU,4BACR,SAAQ,IAAI,CACR,QAAQ,CAAC,oBAAoB,CAAC,EAC5B,QAAQ,GACR,eAAe,GACf,cAAc,GACd,OAAO,GACP,iBAAiB,GACjB,iBAAiB,GACjB,UAAU,GACV,mBAAmB,CACtB,EACD,IAAI,CACF,oBAAoB,EAClB,aAAa,GACb,eAAe,GACf,iBAAiB,GACjB,YAAY,GACZ,gBAAgB,GAChB,iBAAiB,GACjB,aAAa,GACb,0BAA0B,GAC1B,oBAAoB,CACvB;IACH,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,EAAE,CAAC,KAAK,EAAE,IAAI,GAAG,oBAAoB,CAAC,KAAK,KAAK,oBAAoB,CAAC,gBAAgB,CAAC;IAC7F,eAAe,EAAE,MAAM,IAAI,CAAC;IAC5B,YAAY,EAAE,OAAO,CAAC;IACtB,0BAA0B,EAAE,oBAAoB,CAAC,oBAAoB,GAAG,SAAS,CAAC;IAClF,WAAW,CAAC,EAAE,oBAAoB,CAAC,WAAW,CAAC;CAChD;AAED,wBAAgB,uBAAuB,CAAC,EACtC,MAAW,EACX,WAAW,EACX,aAAa,EACb,kBAA6B,EAC7B,YAAY,EACZ,KAAK,EACL,OAAO,EAAE,UAAU,EACnB,OAAO,EAAE,UAAU,EACnB,aAAa,EACb,UAAU,EACV,eAAe,EACf,eAAe,EACf,eAAe,EACf,YAAY,EACZ,WAAW,EACX,QAAQ,EACR,eAAe,EACf,iBAAiB,EACjB,cAAc,EACd,eAAe,EACf,0BAA0B,EAC1B,wBAAwB,EACxB,WAAmB,GACpB,EAAE,4BAA4B,eA4M9B"}