@cloudscape-design/components-themeable 3.0.71 → 3.0.73

package/lib/internal/template/calendar/styles.selectors.js

@@ -2,25 +2,23 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "calendar": "awsui_calendar_1ykar_16ssf_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_16ssf_1",
-  "root": "awsui_root_1ykar_16ssf_124",
-  "calendar-inner": "awsui_calendar-inner_1ykar_16ssf_141",
-  "calendar-header": "awsui_calendar-header_1ykar_16ssf_144",
-  "calendar-header-month": "awsui_calendar-header-month_1ykar_16ssf_149",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_16ssf_155",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_16ssf_158",
-  "calendar-day-names": "awsui_calendar-day-names_1ykar_16ssf_161",
-  "calendar-day-name": "awsui_calendar-day-name_1ykar_16ssf_161",
-  "calendar-dates": "awsui_calendar-dates_1ykar_16ssf_176",
-  "calendar-week": "awsui_calendar-week_1ykar_16ssf_179",
-  "calendar-day": "awsui_calendar-day_1ykar_16ssf_161",
-  "calendar-day-in-last-week": "awsui_calendar-day-in-last-week_1ykar_16ssf_197",
-  "calendar-day-focusable": "awsui_calendar-day-focusable_1ykar_16ssf_200",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_16ssf_203",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_16ssf_210",
-  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_16ssf_217",
-  "calendar-day-today": "awsui_calendar-day-today_1ykar_16ssf_220",
-  "day-inner": "awsui_day-inner_1ykar_16ssf_234"
+  "calendar": "awsui_calendar_1ykar_1y06z_93",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_1y06z_1",
+  "root": "awsui_root_1ykar_1y06z_124",
+  "calendar-inner": "awsui_calendar-inner_1ykar_1y06z_141",
+  "calendar-header": "awsui_calendar-header_1ykar_1y06z_144",
+  "calendar-header-month": "awsui_calendar-header-month_1ykar_1y06z_149",
+  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_1y06z_155",
+  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_1y06z_158",
+  "calendar-grid": "awsui_calendar-grid_1ykar_1y06z_161",
+  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_1y06z_165",
+  "calendar-day-header": "awsui_calendar-day-header_1ykar_1y06z_171",
+  "calendar-day": "awsui_calendar-day_1ykar_1y06z_171",
+  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_1y06z_188",
+  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_1y06z_195",
+  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_1y06z_202",
+  "calendar-day-today": "awsui_calendar-day-today_1ykar_1y06z_205",
+  "day-inner": "awsui_day-inner_1ykar_1y06z_219",
+  "calendar-week": "awsui_calendar-week_1ykar_1y06z_283"
 };
   

package/lib/internal/template/date-range-picker/calendar/grids/grid.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAKvC,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAKxD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,cAAc,EAAE,IAAI,GAAG,IAAI,CAAC;IAC5B,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAE1B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAEhD,YAAY,EAAE,iBAAiB,CAAC;IAChC,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAE1D,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IAEvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,iBAAiB,EACjB,eAAe,EACf,cAAc,EACd,YAAY,EACZ,WAAW,EAEX,cAAc,EAEd,YAAY,EACZ,oBAAoB,EACpB,mBAAmB,EAEnB,aAAa,EAEb,MAAM,EACN,WAAW,EACX,cAAc,EAEd,SAAS,GACV,EAAE,SAAS,eA0EX"}
+{"version":3,"file":"grid.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAkB,MAAM,OAAO,CAAC;AAevC,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACvD,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAOxD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,cAAc,EAAE,IAAI,GAAG,IAAI,CAAC;IAC5B,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAE1B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAC;IAEhD,YAAY,EAAE,iBAAiB,CAAC;IAChC,oBAAoB,EAAE,CAAC,CAAC,EAAE,KAAK,CAAC,aAAa,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAE1D,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IAEvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,IAAI,CAAC,EACnB,QAAQ,EACR,iBAAiB,EACjB,eAAe,EACf,cAAc,EACd,YAAY,EACZ,WAAW,EAEX,cAAc,EAEd,YAAY,EACZ,oBAAoB,EACpB,mBAAmB,EAEnB,aAAa,EAEb,MAAM,EACN,WAAW,EACX,cAAc,EAEd,SAAS,GACV,EAAE,SAAS,eAiIX"}

package/lib/internal/template/date-range-picker/calendar/grids/grid.js

@@ -1,13 +1,16 @@
+import { __assign } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
 import React, { useMemo } from 'react';
 import styles from '../../styles.css.js';
-import GridDay from './day';
-import { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays } from 'date-fns';
+import dayStyles from './styles.css.js';
+import { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays, isLastDayOfMonth, getDaysInMonth, isToday, } from 'date-fns';
 import { getCalendarMonth } from 'mnth';
 import rotateDayIndexes from '../../../calendar/utils/rotate-day-indexes';
-import { renderDayName } from '../../../calendar/utils/intl';
+import { getDateLabel, renderDayName } from '../../../calendar/utils/intl';
 import clsx from 'clsx';
+import { formatDate } from '../../../internal/utils/date-time';
+import useFocusVisible from '../../../internal/hooks/focus-visible/index.js';
 export function Grid(_a) {
     var baseDate = _a.baseDate, selectedStartDate = _a.selectedStartDate, selectedEndDate = _a.selectedEndDate, rangeStartDate = _a.rangeStartDate, rangeEndDate = _a.rangeEndDate, focusedDate = _a.focusedDate, focusedDateRef = _a.focusedDateRef, onSelectDate = _a.onSelectDate, onGridKeyDownHandler = _a.onGridKeyDownHandler, onFocusedDateChange = _a.onFocusedDateChange, isDateEnabled = _a.isDateEnabled, locale = _a.locale, startOfWeek = _a.startOfWeek, todayAriaLabel = _a.todayAriaLabel, className = _a.className;
     var baseDateTime = baseDate === null || baseDate === void 0 ? void 0 : baseDate.getTime();
@@ -15,10 +18,12 @@ export function Grid(_a) {
     var weeks = useMemo(function () { return getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }); }, 
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [baseDateTime, startOfWeek]);
+    var focusVisible = useFocusVisible();
     return (React.createElement("div", { className: clsx(styles.grid, className) },
-        React.createElement("div", { className: styles['calendar-day-names'] }, rotateDayIndexes(startOfWeek).map(function (i) { return (React.createElement("div", { key: "day-name-".concat(i), className: styles['calendar-day-name'] }, renderDayName(locale, i))); })),
+        React.createElement("div", { className: styles['calendar-day-names'] }, rotateDayIndexes(startOfWeek).map(function (dayIndex) { return (React.createElement("div", { key: dayIndex, className: styles['calendar-day-name'] }, renderDayName(locale, dayIndex))); })),
         React.createElement("div", { className: styles['calendar-dates'], onKeyDown: onGridKeyDownHandler }, weeks.map(function (week, weekIndex) {
-            return (React.createElement("div", { key: "week-".concat(weekIndex), className: styles['calendar-week'] }, week.map(function (date, dateIndex) {
+            return (React.createElement("div", { key: weekIndex, className: styles['calendar-week'] }, week.map(function (date, dateIndex) {
+                var _a, _b, _c;
                 var isStartDate = !!selectedStartDate && isSameDay(date, selectedStartDate);
                 var isEndDate = !!selectedEndDate && isSameDay(date, selectedEndDate);
                 var isSelected = isStartDate || isEndDate;
@@ -31,7 +36,57 @@ export function Grid(_a) {
                 var onlyOneSelected = !!rangeStartDate && !!rangeEndDate
                     ? isSameDay(rangeStartDate, rangeEndDate)
                     : !selectedStartDate || !selectedEndDate;
-                return (React.createElement(GridDay, { key: "date-".concat(weekIndex, "-").concat(dateIndex), locale: locale, baseDate: baseDate, isSelected: isSelected, isStartDate: isStartDate, isEndDate: isEndDate, onlyOneSelected: onlyOneSelected, isRangeStartDate: isRangeStartDate, isRangeEndDate: isRangeEndDate, date: date, isFocusedDate: isFocused, ref: isFocused ? focusedDateRef : undefined, todayAriaLabel: todayAriaLabel, onSelectDate: onSelectDate, onFocusDate: onFocusedDateChange, isInRange: dateIsInRange, isDateEnabled: isDateEnabled, isDateInFirstRow: weekIndex === 0, isDateInFirstColumn: dateIndex === 0, isDateInLastColumn: dateIndex === week.length - 1, isDateInSelectionStartWeek: !!inRangeStartWeek, isDateInSelectionEndWeek: !!inRangeEndWeek }));
+                var isEnabled = !isDateEnabled || isDateEnabled(date);
+                var isFocusable = isFocused && isEnabled;
+                var computedAttributes = {};
+                var baseClasses = (_a = {},
+                    _a[dayStyles.day] = true,
+                    _a[dayStyles['in-first-row']] = weekIndex === 0,
+                    _a[dayStyles['in-first-column']] = dateIndex === 0,
+                    _a);
+                if (!isSameMonth(date, baseDate)) {
+                    return (React.createElement("div", { key: "".concat(weekIndex, ":").concat(dateIndex), className: clsx(baseClasses, (_b = {},
+                            _b[dayStyles['in-previous-month']] = isBefore(date, baseDate),
+                            _b[dayStyles['last-day-of-month']] = isLastDayOfMonth(date),
+                            _b[dayStyles['in-next-month']] = isAfter(date, baseDate),
+                            _b)), ref: isFocused ? focusedDateRef : undefined }));
+                }
+                if (isEnabled) {
+                    computedAttributes.onClick = function () { return onSelectDate(date); };
+                    computedAttributes.onFocus = function () { return onFocusedDateChange(date); };
+                }
+                // Can't be focused.
+                var tabIndex = undefined;
+                if (isFocusable && isEnabled) {
+                    // Next focus target.
+                    tabIndex = 0;
+                }
+                else if (isEnabled) {
+                    // Can be focused programmatically.
+                    tabIndex = -1;
+                }
+                // Screen-reader announcement for the focused day.
+                var dayAnnouncement = getDateLabel(locale, date);
+                if (isToday(date)) {
+                    dayAnnouncement += '. ' + todayAriaLabel;
+                }
+                return (React.createElement("div", __assign({ key: "".concat(weekIndex, ":").concat(dateIndex), className: clsx(baseClasses, (_c = {},
+                        _c[dayStyles['in-current-month']] = isSameMonth(date, baseDate),
+                        _c[dayStyles.enabled] = isEnabled,
+                        _c[dayStyles.selected] = isSelected,
+                        _c[dayStyles['start-date']] = isStartDate,
+                        _c[dayStyles['end-date']] = isEndDate,
+                        _c[dayStyles['range-start-date']] = isRangeStartDate,
+                        _c[dayStyles['range-end-date']] = isRangeEndDate,
+                        _c[dayStyles['no-range']] = isSelected && onlyOneSelected,
+                        _c[dayStyles['in-range']] = dateIsInRange,
+                        _c[dayStyles['in-range-border-top']] = !!inRangeStartWeek || date.getDate() <= 7,
+                        _c[dayStyles['in-range-border-bottom']] = !!inRangeEndWeek || date.getDate() > getDaysInMonth(date) - 7,
+                        _c[dayStyles['in-range-border-left']] = dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,
+                        _c[dayStyles['in-range-border-right']] = dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,
+                        _c[dayStyles.today] = isToday(date),
+                        _c)), "aria-label": dayAnnouncement, "aria-pressed": isSelected || dateIsInRange, "aria-current": isToday(date) ? 'date' : undefined, "data-date": formatDate(date), role: "button", tabIndex: tabIndex }, computedAttributes, { ref: isFocused ? focusedDateRef : undefined }, focusVisible),
+                    React.createElement("span", { className: dayStyles['day-inner'] }, date.getDate())));
             })));
         }))));
 }

package/lib/internal/template/date-range-picker/calendar/grids/grid.js.map

@@ -1 +1 @@
-{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.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\nimport React, { useMemo } from 'react';\nimport styles from '../../styles.css.js';\nimport GridDay from './day';\nimport { isSameMonth, isAfter, isBefore, isSameDay, addWeeks, addDays } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DateChangeHandler, DayIndex } from '../index';\nimport { DateRangePickerProps } from '../../interfaces';\nimport rotateDayIndexes from '../../../calendar/utils/rotate-day-indexes';\nimport { renderDayName } from '../../../calendar/utils/intl';\nimport clsx from 'clsx';\n\nexport interface GridProps {\n  baseDate: Date;\n  selectedStartDate: Date | null;\n  selectedEndDate: Date | null;\n\n  rangeStartDate: Date | null;\n  rangeEndDate: Date | null;\n\n  focusedDate: Date | null;\n  focusedDateRef: React.RefObject<HTMLDivElement>;\n\n  onSelectDate: DateChangeHandler;\n  onGridKeyDownHandler: (e: React.KeyboardEvent) => void;\n  onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n  isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n\n  locale: string;\n  startOfWeek: DayIndex;\n  todayAriaLabel: string;\n\n  className?: string;\n}\n\nexport function Grid({\n  baseDate,\n  selectedStartDate,\n  selectedEndDate,\n  rangeStartDate,\n  rangeEndDate,\n  focusedDate,\n\n  focusedDateRef,\n\n  onSelectDate,\n  onGridKeyDownHandler,\n  onFocusedDateChange,\n\n  isDateEnabled,\n\n  locale,\n  startOfWeek,\n  todayAriaLabel,\n\n  className,\n}: GridProps) {\n  const baseDateTime = baseDate?.getTime();\n  // `baseDateTime` is used as a more stable replacement for baseDate\n  const weeks = useMemo<Date[][]>(\n    () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [baseDateTime, startOfWeek]\n  );\n\n  return (\n    <div className={clsx(styles.grid, className)}>\n      <div className={styles['calendar-day-names']}>\n        {rotateDayIndexes(startOfWeek).map(i => (\n          <div key={`day-name-${i}`} className={styles['calendar-day-name']}>\n            {renderDayName(locale, i)}\n          </div>\n        ))}\n      </div>\n      <div className={styles['calendar-dates']} onKeyDown={onGridKeyDownHandler}>\n        {weeks.map((week, weekIndex) => {\n          return (\n            <div key={`week-${weekIndex}`} className={styles['calendar-week']}>\n              {week.map((date, dateIndex) => {\n                const isStartDate = !!selectedStartDate && isSameDay(date, selectedStartDate);\n                const isEndDate = !!selectedEndDate && isSameDay(date, selectedEndDate);\n                const isSelected = isStartDate || isEndDate;\n                const isRangeStartDate = !!rangeStartDate && isSameDay(date, rangeStartDate);\n                const isRangeEndDate = !!rangeEndDate && isSameDay(date, rangeEndDate);\n\n                const isFocused = !!focusedDate && isSameDay(date, focusedDate) && isSameMonth(date, baseDate);\n\n                const dateIsInRange = isStartDate || isEndDate || isInRange(date, rangeStartDate, rangeEndDate);\n                const inRangeStartWeek =\n                  rangeStartDate && isInRange(date, rangeStartDate, addDays(addWeeks(rangeStartDate, 1), -1));\n                const inRangeEndWeek =\n                  rangeEndDate && isInRange(date, rangeEndDate, addDays(addWeeks(rangeEndDate, -1), 1));\n                const onlyOneSelected =\n                  !!rangeStartDate && !!rangeEndDate\n                    ? isSameDay(rangeStartDate, rangeEndDate)\n                    : !selectedStartDate || !selectedEndDate;\n\n                return (\n                  <GridDay\n                    key={`date-${weekIndex}-${dateIndex}`}\n                    locale={locale}\n                    baseDate={baseDate}\n                    isSelected={isSelected}\n                    isStartDate={isStartDate}\n                    isEndDate={isEndDate}\n                    onlyOneSelected={onlyOneSelected}\n                    isRangeStartDate={isRangeStartDate}\n                    isRangeEndDate={isRangeEndDate}\n                    date={date}\n                    isFocusedDate={isFocused}\n                    ref={isFocused ? focusedDateRef : undefined}\n                    todayAriaLabel={todayAriaLabel}\n                    onSelectDate={onSelectDate}\n                    onFocusDate={onFocusedDateChange}\n                    isInRange={dateIsInRange}\n                    isDateEnabled={isDateEnabled}\n                    isDateInFirstRow={weekIndex === 0}\n                    isDateInFirstColumn={dateIndex === 0}\n                    isDateInLastColumn={dateIndex === week.length - 1}\n                    isDateInSelectionStartWeek={!!inRangeStartWeek}\n                    isDateInSelectionEndWeek={!!inRangeEndWeek}\n                  />\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nfunction isInRange(date: Date, dateOne: Date | null, dateTwo: Date | null) {\n  if (!dateOne || !dateTwo || isSameDay(dateOne, dateTwo)) {\n    return false;\n  }\n\n  const inRange =\n    (isAfter(date, dateOne) && isBefore(date, dateTwo)) || (isAfter(date, dateTwo) && isBefore(date, dateOne));\n\n  return inRange || isSameDay(date, dateOne) || isSameDay(date, dateTwo);\n}\n"]}
+{"version":3,"file":"grid.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/grid.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\nimport React, { useMemo } from 'react';\nimport styles from '../../styles.css.js';\nimport dayStyles from './styles.css.js';\nimport {\n  isSameMonth,\n  isAfter,\n  isBefore,\n  isSameDay,\n  addWeeks,\n  addDays,\n  isLastDayOfMonth,\n  getDaysInMonth,\n  isToday,\n} from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DateChangeHandler, DayIndex } from '../index';\nimport { DateRangePickerProps } from '../../interfaces';\nimport rotateDayIndexes from '../../../calendar/utils/rotate-day-indexes';\nimport { getDateLabel, renderDayName } from '../../../calendar/utils/intl';\nimport clsx from 'clsx';\nimport { formatDate } from '../../../internal/utils/date-time';\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index.js';\n\nexport interface GridProps {\n  baseDate: Date;\n  selectedStartDate: Date | null;\n  selectedEndDate: Date | null;\n\n  rangeStartDate: Date | null;\n  rangeEndDate: Date | null;\n\n  focusedDate: Date | null;\n  focusedDateRef: React.RefObject<HTMLDivElement>;\n\n  onSelectDate: DateChangeHandler;\n  onGridKeyDownHandler: (e: React.KeyboardEvent) => void;\n  onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n  isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n\n  locale: string;\n  startOfWeek: DayIndex;\n  todayAriaLabel: string;\n\n  className?: string;\n}\n\nexport function Grid({\n  baseDate,\n  selectedStartDate,\n  selectedEndDate,\n  rangeStartDate,\n  rangeEndDate,\n  focusedDate,\n\n  focusedDateRef,\n\n  onSelectDate,\n  onGridKeyDownHandler,\n  onFocusedDateChange,\n\n  isDateEnabled,\n\n  locale,\n  startOfWeek,\n  todayAriaLabel,\n\n  className,\n}: GridProps) {\n  const baseDateTime = baseDate?.getTime();\n  // `baseDateTime` is used as a more stable replacement for baseDate\n  const weeks = useMemo<Date[][]>(\n    () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [baseDateTime, startOfWeek]\n  );\n\n  const focusVisible = useFocusVisible();\n\n  return (\n    <div className={clsx(styles.grid, className)}>\n      <div className={styles['calendar-day-names']}>\n        {rotateDayIndexes(startOfWeek).map(dayIndex => (\n          <div key={dayIndex} className={styles['calendar-day-name']}>\n            {renderDayName(locale, dayIndex)}\n          </div>\n        ))}\n      </div>\n      <div className={styles['calendar-dates']} onKeyDown={onGridKeyDownHandler}>\n        {weeks.map((week, weekIndex) => {\n          return (\n            <div key={weekIndex} className={styles['calendar-week']}>\n              {week.map((date, dateIndex) => {\n                const isStartDate = !!selectedStartDate && isSameDay(date, selectedStartDate);\n                const isEndDate = !!selectedEndDate && isSameDay(date, selectedEndDate);\n                const isSelected = isStartDate || isEndDate;\n                const isRangeStartDate = !!rangeStartDate && isSameDay(date, rangeStartDate);\n                const isRangeEndDate = !!rangeEndDate && isSameDay(date, rangeEndDate);\n\n                const isFocused = !!focusedDate && isSameDay(date, focusedDate) && isSameMonth(date, baseDate);\n\n                const dateIsInRange = isStartDate || isEndDate || isInRange(date, rangeStartDate, rangeEndDate);\n                const inRangeStartWeek =\n                  rangeStartDate && isInRange(date, rangeStartDate, addDays(addWeeks(rangeStartDate, 1), -1));\n                const inRangeEndWeek =\n                  rangeEndDate && isInRange(date, rangeEndDate, addDays(addWeeks(rangeEndDate, -1), 1));\n                const onlyOneSelected =\n                  !!rangeStartDate && !!rangeEndDate\n                    ? isSameDay(rangeStartDate, rangeEndDate)\n                    : !selectedStartDate || !selectedEndDate;\n\n                const isEnabled = !isDateEnabled || isDateEnabled(date);\n                const isFocusable = isFocused && isEnabled;\n                const computedAttributes: React.HTMLAttributes<HTMLDivElement> = {};\n\n                const baseClasses = {\n                  [dayStyles.day]: true,\n                  [dayStyles['in-first-row']]: weekIndex === 0,\n                  [dayStyles['in-first-column']]: dateIndex === 0,\n                };\n\n                if (!isSameMonth(date, baseDate)) {\n                  return (\n                    <div\n                      key={`${weekIndex}:${dateIndex}`}\n                      className={clsx(baseClasses, {\n                        [dayStyles['in-previous-month']]: isBefore(date, baseDate),\n                        [dayStyles['last-day-of-month']]: isLastDayOfMonth(date),\n                        [dayStyles['in-next-month']]: isAfter(date, baseDate),\n                      })}\n                      ref={isFocused ? focusedDateRef : undefined}\n                    ></div>\n                  );\n                }\n\n                if (isEnabled) {\n                  computedAttributes.onClick = () => onSelectDate(date);\n                  computedAttributes.onFocus = () => onFocusedDateChange(date);\n                }\n\n                // Can't be focused.\n                let tabIndex = undefined;\n                if (isFocusable && isEnabled) {\n                  // Next focus target.\n                  tabIndex = 0;\n                } else if (isEnabled) {\n                  // Can be focused programmatically.\n                  tabIndex = -1;\n                }\n\n                // Screen-reader announcement for the focused day.\n                let dayAnnouncement = getDateLabel(locale, date);\n                if (isToday(date)) {\n                  dayAnnouncement += '. ' + todayAriaLabel;\n                }\n\n                return (\n                  <div\n                    key={`${weekIndex}:${dateIndex}`}\n                    className={clsx(baseClasses, {\n                      [dayStyles['in-current-month']]: isSameMonth(date, baseDate),\n                      [dayStyles.enabled]: isEnabled,\n                      [dayStyles.selected]: isSelected,\n                      [dayStyles['start-date']]: isStartDate,\n                      [dayStyles['end-date']]: isEndDate,\n                      [dayStyles['range-start-date']]: isRangeStartDate,\n                      [dayStyles['range-end-date']]: isRangeEndDate,\n                      [dayStyles['no-range']]: isSelected && onlyOneSelected,\n                      [dayStyles['in-range']]: dateIsInRange,\n                      [dayStyles['in-range-border-top']]: !!inRangeStartWeek || date.getDate() <= 7,\n                      [dayStyles['in-range-border-bottom']]:\n                        !!inRangeEndWeek || date.getDate() > getDaysInMonth(date) - 7,\n                      [dayStyles['in-range-border-left']]: dateIndex === 0 || date.getDate() === 1 || isRangeStartDate,\n                      [dayStyles['in-range-border-right']]:\n                        dateIndex === week.length - 1 || isLastDayOfMonth(date) || isRangeEndDate,\n                      [dayStyles.today]: isToday(date),\n                    })}\n                    aria-label={dayAnnouncement}\n                    aria-pressed={isSelected || dateIsInRange}\n                    aria-current={isToday(date) ? 'date' : undefined}\n                    data-date={formatDate(date)}\n                    role=\"button\"\n                    tabIndex={tabIndex}\n                    {...computedAttributes}\n                    ref={isFocused ? focusedDateRef : undefined}\n                    {...focusVisible}\n                  >\n                    <span className={dayStyles['day-inner']}>{date.getDate()}</span>\n                  </div>\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n}\n\nfunction isInRange(date: Date, dateOne: Date | null, dateTwo: Date | null) {\n  if (!dateOne || !dateTwo || isSameDay(dateOne, dateTwo)) {\n    return false;\n  }\n\n  const inRange =\n    (isAfter(date, dateOne) && isBefore(date, dateTwo)) || (isAfter(date, dateTwo) && isBefore(date, dateOne));\n\n  return inRange || isSameDay(date, dateOne) || isSameDay(date, dateTwo);\n}\n"]}

package/lib/internal/template/date-range-picker/calendar/grids/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAmBxD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAC1D,YAAY,EAAE,OAAO,CAAC;IAEtB,YAAY,EAAE,iBAAiB,CAAC;IAChC,aAAa,EAAE,kBAAkB,CAAC;IAClC,eAAe,EAAE,gBAAgB,CAAC;IAElC,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,eAa1D;AAED,eAAO,MAAM,KAAK,wMAkBf,SAAS,gBA0JX,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAsC,MAAM,OAAO,CAAC;AAI3D,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,oBAAoB,EAAE,MAAM,kBAAkB,CAAC;AAmBxD,MAAM,WAAW,SAAS;IACxB,QAAQ,EAAE,IAAI,CAAC;IACf,iBAAiB,EAAE,IAAI,GAAG,IAAI,CAAC;IAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,CAAC;IAE7B,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,mBAAmB,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,IAAI,GAAG,IAAI,CAAC,CAAC,CAAC;IAEvE,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,CAAC;IAC1D,YAAY,EAAE,OAAO,CAAC;IAEtB,YAAY,EAAE,iBAAiB,CAAC;IAChC,aAAa,EAAE,kBAAkB,CAAC;IAClC,eAAe,EAAE,gBAAgB,CAAC;IAElC,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;CACxB;AAED,wBAAgB,iBAAiB,CAC/B,QAAQ,EAAE,IAAI,GAAG,IAAI,EACrB,QAAQ,EAAE,IAAI,EACd,aAAa,EAAE,oBAAoB,CAAC,qBAAqB,eAa1D;AAED,eAAO,MAAM,KAAK,wMAkBf,SAAS,gBA2JX,CAAC"}

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

@@ -54,6 +54,7 @@ export var Grids = function (_a) {
             return;
         }
         switch (e.keyCode) {
+            case KeyCode.space:
             case KeyCode.enter:
                 e.preventDefault();
                 if (focusedDate) {

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/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\nimport React, { useEffect, useRef, useState } from 'react';\nimport { KeyCode } from '../../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth, isAfter, isBefore, addMonths, min, max } from 'date-fns';\n\nimport { DateChangeHandler, DayIndex, MonthChangeHandler } from '../index';\nimport { MoveFocusHandler } from '../../../calendar/utils/move-focus-handler';\nimport { DateRangePickerProps } from '../../interfaces';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport { Grid } from './grid';\nimport styles from '../../styles.css.js';\n\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index';\nimport { getBaseDate } from '../get-base-date';\nimport { hasValue } from '../../../internal/utils/has-value';\n\nfunction isVisible(date: Date, baseDate: Date, isSingleGrid: boolean) {\n  if (isSingleGrid) {\n    return isSameMonth(date, baseDate);\n  }\n\n  const previousMonth = addMonths(baseDate, -1);\n\n  return isSameMonth(date, previousMonth) || isSameMonth(date, baseDate);\n}\n\nexport interface GridProps {\n  baseDate: Date;\n  selectedStartDate: Date | null;\n  selectedEndDate: Date | null;\n\n  focusedDate: Date | null;\n  onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n  isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n  isSingleGrid: boolean;\n\n  onSelectDate: DateChangeHandler;\n  onChangeMonth: MonthChangeHandler;\n  handleFocusMove: MoveFocusHandler;\n\n  locale: string;\n  startOfWeek: DayIndex;\n  todayAriaLabel: string;\n}\n\nexport function selectFocusedDate(\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 const Grids = ({\n  baseDate,\n  selectedStartDate,\n  selectedEndDate,\n\n  focusedDate,\n  onFocusedDateChange,\n\n  isDateEnabled,\n  isSingleGrid,\n\n  onSelectDate,\n  onChangeMonth,\n  handleFocusMove,\n\n  locale,\n  startOfWeek,\n  todayAriaLabel,\n}: GridProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [gridHasFocus, setGridHasFocus] = useState(false);\n\n  const focusedDateRef = useRef<HTMLDivElement>(null);\n\n  const baseDateTime = baseDate?.getTime();\n  const focusedDateTime = focusedDate?.getTime();\n\n  useEffect(() => {\n    if (focusedDate && !isVisible(focusedDate, baseDate, isSingleGrid)) {\n      // The nearestBaseDate depends on the direction of the month change\n      const direction = isAfter(focusedDate, baseDate) ? 'backwards' : 'forwards';\n\n      const newMonth = !isSingleGrid && direction === 'backwards' ? addMonths(baseDate, -1) : baseDate;\n      const nearestBaseDate = getBaseDate(newMonth, direction === 'backwards' ? -1 : 1, isDateEnabled);\n\n      const newFocusedDate = selectFocusedDate(focusedDate, nearestBaseDate, isDateEnabled);\n\n      onFocusedDateChange(newFocusedDate);\n    }\n    // `baseDateTime` and `focusedDateTime` are used as more stable replacements for baseDate and focusedDate\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [focusedDateTime, baseDateTime, isSingleGrid, isDateEnabled, onFocusedDateChange]);\n\n  const onGridKeyDownHandler = (e: React.KeyboardEvent) => {\n    let updatedFocusDate;\n\n    if (focusedDate === null) {\n      return;\n    }\n\n    switch (e.keyCode) {\n      case KeyCode.enter:\n        e.preventDefault();\n        if (focusedDate) {\n          onSelectDate(focusedDate);\n        }\n        return;\n      case KeyCode.right:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n        break;\n      case KeyCode.left:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n        break;\n      case KeyCode.up:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n        break;\n      case KeyCode.down:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n        break;\n      default:\n        return;\n    }\n\n    const updatedDateIsVisible = isVisible(updatedFocusDate, baseDate, isSingleGrid);\n\n    if (!updatedDateIsVisible) {\n      const newMonthIsOnLeftSide = !isSingleGrid && isBefore(updatedFocusDate, baseDate);\n\n      onChangeMonth(newMonthIsOnLeftSide ? addMonths(updatedFocusDate, 1) : updatedFocusDate);\n    }\n    onFocusedDateChange(updatedFocusDate);\n  };\n\n  useEffect(() => {\n    // focus current date if the focus is already inside the calendar\n    if (focusedDate !== null && gridHasFocus) {\n      if (focusedDateRef.current && focusedDateRef.current !== document.activeElement) {\n        focusedDateRef.current.focus();\n      }\n    }\n    // `focusedDateTime` is used as a more stable replacement for focusedDate\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [focusedDateTime, gridHasFocus]);\n\n  const onGridBlur = (event: React.FocusEvent) => {\n    /*\n     IE11 does not support event.relatedTarget, but sets document.activeElement to the newly\n     focused element before the onBlur handler is called.\n\n     However, other browsers do not make any guarantees for the value of document.activeElement\n     during the execution of an onBlur handler. Therefore, we have to use event.relatedTarget\n     instead.\n     */\n    const newFocusTarget = event.relatedTarget || document.activeElement;\n    const newFocusTargetIsInGrid = containerRef.current?.contains(newFocusTarget as Node);\n    if (newFocusTarget && !newFocusTargetIsInGrid && gridHasFocus) {\n      setGridHasFocus(false);\n    }\n  };\n\n  const onGridFocus = () => {\n    if (!gridHasFocus) {\n      setGridHasFocus(true);\n    }\n  };\n\n  const focusVisible = useFocusVisible();\n\n  const isRangeVisible =\n    (selectedStartDate && selectedEndDate) || (gridHasFocus && !!focusVisible['data-awsui-focus-visible']);\n\n  const rangeEnds: Date[] = [selectedStartDate ?? focusedDate, selectedEndDate ?? focusedDate].filter(hasValue);\n\n  const rangeStartDate = min(rangeEnds);\n  const rangeEndDate = max(rangeEnds);\n\n  return (\n    <div ref={containerRef} onFocus={onGridFocus} onBlur={onGridBlur}>\n      <InternalSpaceBetween size=\"xs\" direction=\"horizontal\">\n        {!isSingleGrid && (\n          <Grid\n            className={styles['first-grid']}\n            baseDate={addMonths(baseDate, -1)}\n            selectedEndDate={selectedEndDate}\n            selectedStartDate={selectedStartDate}\n            rangeStartDate={isRangeVisible ? rangeStartDate : null}\n            rangeEndDate={isRangeVisible ? rangeEndDate : null}\n            focusedDate={focusedDate}\n            focusedDateRef={focusedDateRef}\n            isDateEnabled={isDateEnabled}\n            onSelectDate={onSelectDate}\n            onGridKeyDownHandler={onGridKeyDownHandler}\n            onFocusedDateChange={onFocusedDateChange}\n            locale={locale}\n            startOfWeek={startOfWeek}\n            todayAriaLabel={todayAriaLabel}\n          />\n        )}\n        <Grid\n          className={styles['second-grid']}\n          baseDate={baseDate}\n          selectedEndDate={selectedEndDate}\n          selectedStartDate={selectedStartDate}\n          rangeStartDate={isRangeVisible ? rangeStartDate : null}\n          rangeEndDate={isRangeVisible ? rangeEndDate : null}\n          focusedDate={focusedDate}\n          focusedDateRef={focusedDateRef}\n          isDateEnabled={isDateEnabled}\n          onSelectDate={onSelectDate}\n          onGridKeyDownHandler={onGridKeyDownHandler}\n          onFocusedDateChange={onFocusedDateChange}\n          locale={locale}\n          startOfWeek={startOfWeek}\n          todayAriaLabel={todayAriaLabel}\n        />\n      </InternalSpaceBetween>\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/date-range-picker/calendar/grids/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\nimport React, { useEffect, useRef, useState } from 'react';\nimport { KeyCode } from '../../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth, isAfter, isBefore, addMonths, min, max } from 'date-fns';\n\nimport { DateChangeHandler, DayIndex, MonthChangeHandler } from '../index';\nimport { MoveFocusHandler } from '../../../calendar/utils/move-focus-handler';\nimport { DateRangePickerProps } from '../../interfaces';\nimport InternalSpaceBetween from '../../../space-between/internal';\nimport { Grid } from './grid';\nimport styles from '../../styles.css.js';\n\nimport useFocusVisible from '../../../internal/hooks/focus-visible/index';\nimport { getBaseDate } from '../get-base-date';\nimport { hasValue } from '../../../internal/utils/has-value';\n\nfunction isVisible(date: Date, baseDate: Date, isSingleGrid: boolean) {\n  if (isSingleGrid) {\n    return isSameMonth(date, baseDate);\n  }\n\n  const previousMonth = addMonths(baseDate, -1);\n\n  return isSameMonth(date, previousMonth) || isSameMonth(date, baseDate);\n}\n\nexport interface GridProps {\n  baseDate: Date;\n  selectedStartDate: Date | null;\n  selectedEndDate: Date | null;\n\n  focusedDate: Date | null;\n  onFocusedDateChange: React.Dispatch<React.SetStateAction<Date | null>>;\n\n  isDateEnabled: DateRangePickerProps.IsDateEnabledFunction;\n  isSingleGrid: boolean;\n\n  onSelectDate: DateChangeHandler;\n  onChangeMonth: MonthChangeHandler;\n  handleFocusMove: MoveFocusHandler;\n\n  locale: string;\n  startOfWeek: DayIndex;\n  todayAriaLabel: string;\n}\n\nexport function selectFocusedDate(\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 const Grids = ({\n  baseDate,\n  selectedStartDate,\n  selectedEndDate,\n\n  focusedDate,\n  onFocusedDateChange,\n\n  isDateEnabled,\n  isSingleGrid,\n\n  onSelectDate,\n  onChangeMonth,\n  handleFocusMove,\n\n  locale,\n  startOfWeek,\n  todayAriaLabel,\n}: GridProps) => {\n  const containerRef = useRef<HTMLDivElement>(null);\n  const [gridHasFocus, setGridHasFocus] = useState(false);\n\n  const focusedDateRef = useRef<HTMLDivElement>(null);\n\n  const baseDateTime = baseDate?.getTime();\n  const focusedDateTime = focusedDate?.getTime();\n\n  useEffect(() => {\n    if (focusedDate && !isVisible(focusedDate, baseDate, isSingleGrid)) {\n      // The nearestBaseDate depends on the direction of the month change\n      const direction = isAfter(focusedDate, baseDate) ? 'backwards' : 'forwards';\n\n      const newMonth = !isSingleGrid && direction === 'backwards' ? addMonths(baseDate, -1) : baseDate;\n      const nearestBaseDate = getBaseDate(newMonth, direction === 'backwards' ? -1 : 1, isDateEnabled);\n\n      const newFocusedDate = selectFocusedDate(focusedDate, nearestBaseDate, isDateEnabled);\n\n      onFocusedDateChange(newFocusedDate);\n    }\n    // `baseDateTime` and `focusedDateTime` are used as more stable replacements for baseDate and focusedDate\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [focusedDateTime, baseDateTime, isSingleGrid, isDateEnabled, onFocusedDateChange]);\n\n  const onGridKeyDownHandler = (e: React.KeyboardEvent) => {\n    let updatedFocusDate;\n\n    if (focusedDate === null) {\n      return;\n    }\n\n    switch (e.keyCode) {\n      case KeyCode.space:\n      case KeyCode.enter:\n        e.preventDefault();\n        if (focusedDate) {\n          onSelectDate(focusedDate);\n        }\n        return;\n      case KeyCode.right:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n        break;\n      case KeyCode.left:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n        break;\n      case KeyCode.up:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n        break;\n      case KeyCode.down:\n        e.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n        break;\n      default:\n        return;\n    }\n\n    const updatedDateIsVisible = isVisible(updatedFocusDate, baseDate, isSingleGrid);\n\n    if (!updatedDateIsVisible) {\n      const newMonthIsOnLeftSide = !isSingleGrid && isBefore(updatedFocusDate, baseDate);\n\n      onChangeMonth(newMonthIsOnLeftSide ? addMonths(updatedFocusDate, 1) : updatedFocusDate);\n    }\n    onFocusedDateChange(updatedFocusDate);\n  };\n\n  useEffect(() => {\n    // focus current date if the focus is already inside the calendar\n    if (focusedDate !== null && gridHasFocus) {\n      if (focusedDateRef.current && focusedDateRef.current !== document.activeElement) {\n        focusedDateRef.current.focus();\n      }\n    }\n    // `focusedDateTime` is used as a more stable replacement for focusedDate\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [focusedDateTime, gridHasFocus]);\n\n  const onGridBlur = (event: React.FocusEvent) => {\n    /*\n     IE11 does not support event.relatedTarget, but sets document.activeElement to the newly\n     focused element before the onBlur handler is called.\n\n     However, other browsers do not make any guarantees for the value of document.activeElement\n     during the execution of an onBlur handler. Therefore, we have to use event.relatedTarget\n     instead.\n     */\n    const newFocusTarget = event.relatedTarget || document.activeElement;\n    const newFocusTargetIsInGrid = containerRef.current?.contains(newFocusTarget as Node);\n    if (newFocusTarget && !newFocusTargetIsInGrid && gridHasFocus) {\n      setGridHasFocus(false);\n    }\n  };\n\n  const onGridFocus = () => {\n    if (!gridHasFocus) {\n      setGridHasFocus(true);\n    }\n  };\n\n  const focusVisible = useFocusVisible();\n\n  const isRangeVisible =\n    (selectedStartDate && selectedEndDate) || (gridHasFocus && !!focusVisible['data-awsui-focus-visible']);\n\n  const rangeEnds: Date[] = [selectedStartDate ?? focusedDate, selectedEndDate ?? focusedDate].filter(hasValue);\n\n  const rangeStartDate = min(rangeEnds);\n  const rangeEndDate = max(rangeEnds);\n\n  return (\n    <div ref={containerRef} onFocus={onGridFocus} onBlur={onGridBlur}>\n      <InternalSpaceBetween size=\"xs\" direction=\"horizontal\">\n        {!isSingleGrid && (\n          <Grid\n            className={styles['first-grid']}\n            baseDate={addMonths(baseDate, -1)}\n            selectedEndDate={selectedEndDate}\n            selectedStartDate={selectedStartDate}\n            rangeStartDate={isRangeVisible ? rangeStartDate : null}\n            rangeEndDate={isRangeVisible ? rangeEndDate : null}\n            focusedDate={focusedDate}\n            focusedDateRef={focusedDateRef}\n            isDateEnabled={isDateEnabled}\n            onSelectDate={onSelectDate}\n            onGridKeyDownHandler={onGridKeyDownHandler}\n            onFocusedDateChange={onFocusedDateChange}\n            locale={locale}\n            startOfWeek={startOfWeek}\n            todayAriaLabel={todayAriaLabel}\n          />\n        )}\n        <Grid\n          className={styles['second-grid']}\n          baseDate={baseDate}\n          selectedEndDate={selectedEndDate}\n          selectedStartDate={selectedStartDate}\n          rangeStartDate={isRangeVisible ? rangeStartDate : null}\n          rangeEndDate={isRangeVisible ? rangeEndDate : null}\n          focusedDate={focusedDate}\n          focusedDateRef={focusedDateRef}\n          isDateEnabled={isDateEnabled}\n          onSelectDate={onSelectDate}\n          onGridKeyDownHandler={onGridKeyDownHandler}\n          onFocusedDateChange={onFocusedDateChange}\n          locale={locale}\n          startOfWeek={startOfWeek}\n          todayAriaLabel={todayAriaLabel}\n        />\n      </InternalSpaceBetween>\n    </div>\n  );\n};\n"]}

package/lib/internal/template/date-range-picker/calendar/grids/styles.css.js

@@ -0,0 +1,26 @@
+
+    import './styles.scoped.css';
+    export default {
+  "day": "awsui_day_1mfbn_14p9n_97",
+  "day-inner": "awsui_day-inner_1mfbn_14p9n_140",
+  "in-first-row": "awsui_in-first-row_1mfbn_14p9n_145",
+  "in-previous-month": "awsui_in-previous-month_1mfbn_14p9n_145",
+  "last-day-of-month": "awsui_last-day-of-month_1mfbn_14p9n_149",
+  "in-next-month": "awsui_in-next-month_1mfbn_14p9n_153",
+  "in-first-column": "awsui_in-first-column_1mfbn_14p9n_157",
+  "in-current-month": "awsui_in-current-month_1mfbn_14p9n_160",
+  "enabled": "awsui_enabled_1mfbn_14p9n_164",
+  "in-range": "awsui_in-range_1mfbn_14p9n_170",
+  "end-date": "awsui_end-date_1mfbn_14p9n_170",
+  "start-date": "awsui_start-date_1mfbn_14p9n_170",
+  "no-range": "awsui_no-range_1mfbn_14p9n_170",
+  "selected": "awsui_selected_1mfbn_14p9n_177",
+  "today": "awsui_today_1mfbn_14p9n_181",
+  "range-start-date": "awsui_range-start-date_1mfbn_14p9n_217",
+  "in-range-border-bottom": "awsui_in-range-border-bottom_1mfbn_14p9n_220",
+  "range-end-date": "awsui_range-end-date_1mfbn_14p9n_223",
+  "in-range-border-top": "awsui_in-range-border-top_1mfbn_14p9n_226",
+  "in-range-border-right": "awsui_in-range-border-right_1mfbn_14p9n_241",
+  "in-range-border-left": "awsui_in-range-border-left_1mfbn_14p9n_247"
+};
+  

package/lib/internal/template/date-range-picker/calendar/grids/{day/styles.scoped.css → styles.scoped.css}

@@ -94,7 +94,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_day_vci2l_14p9n_97:not(#\9) {
+.awsui_day_1mfbn_14p9n_97:not(#\9) {
   flex: 1 1 0%;
   width: 0;
   word-break: break-word;
@@ -105,10 +105,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-dropdown-item-disabled-dgi2f4, #aab7b8);
   position: relative;
 }
-.awsui_day_vci2l_14p9n_97:not(#\9):focus {
+.awsui_day_1mfbn_14p9n_97:not(#\9):focus {
   outline: none;
 }
-.awsui_day_vci2l_14p9n_97:not(#\9)::after {
+.awsui_day_1mfbn_14p9n_97:not(#\9)::after {
   content: "";
   position: absolute;
   z-index: 1;
@@ -118,15 +118,15 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   right: calc(-1 * var(--border-item-width-yvnixs, 1px));
   background-color: transparent;
 }
-.awsui_day_vci2l_14p9n_97[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_day_1mfbn_14p9n_97[data-awsui-focus-visible=true]:not(#\9):focus {
   z-index: 2;
   position: relative;
 }
-.awsui_day_vci2l_14p9n_97[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_day_1mfbn_14p9n_97[data-awsui-focus-visible=true]:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px) - 1px);
 }
-.awsui_day_vci2l_14p9n_97[data-awsui-focus-visible=true]:not(#\9):focus::before {
+.awsui_day_1mfbn_14p9n_97[data-awsui-focus-visible=true]:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -137,65 +137,65 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-calendar-day-focus-ring-16ha5s, 2px);
   box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
 }
-.awsui_day_vci2l_14p9n_97 > .awsui_day-inner_vci2l_14p9n_140:not(#\9) {
+.awsui_day_1mfbn_14p9n_97 > .awsui_day-inner_1mfbn_14p9n_140:not(#\9) {
   position: relative;
   z-index: 1;
 }
 
-.awsui_in-first-row_vci2l_14p9n_145:not(#\9):not(.awsui_in-previous-month_vci2l_14p9n_145) {
+.awsui_in-first-row_1mfbn_14p9n_145:not(#\9):not(.awsui_in-previous-month_1mfbn_14p9n_145) {
   border-top: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
 }
 
-.awsui_in-previous-month_vci2l_14p9n_145:not(#\9):not(.awsui_last-day-of-month_vci2l_14p9n_149) {
+.awsui_in-previous-month_1mfbn_14p9n_145:not(#\9):not(.awsui_last-day-of-month_1mfbn_14p9n_149) {
   border-right-color: transparent;
 }
 
-.awsui_in-next-month_vci2l_14p9n_153:not(#\9) {
+.awsui_in-next-month_1mfbn_14p9n_153:not(#\9) {
   border-color: transparent;
 }
 
-.awsui_in-first-column_vci2l_14p9n_157:not(#\9) {
+.awsui_in-first-column_1mfbn_14p9n_157:not(#\9) {
   border-left: 1px solid transparent;
 }
-.awsui_in-first-column_vci2l_14p9n_157.awsui_in-current-month_vci2l_14p9n_160:not(#\9) {
+.awsui_in-first-column_1mfbn_14p9n_157.awsui_in-current-month_1mfbn_14p9n_160:not(#\9) {
   border-left: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
 }
 
-.awsui_enabled_vci2l_14p9n_164:not(#\9) {
+.awsui_enabled_1mfbn_14p9n_164:not(#\9) {
   cursor: pointer;
 }
-.awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160:not(#\9) {
+.awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160:not(#\9) {
   color: var(--color-text-dropdown-item-default-ki8ao1, #16191f);
 }
-.awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160:not(#\9):not(.awsui_in-range_vci2l_14p9n_170), .awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160:not(#\9):not(.awsui_in-range_vci2l_14p9n_170)::after, .awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160.awsui_end-date_vci2l_14p9n_170.awsui_start-date_vci2l_14p9n_170:not(#\9), .awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160.awsui_end-date_vci2l_14p9n_170.awsui_start-date_vci2l_14p9n_170:not(#\9)::after, .awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160.awsui_no-range_vci2l_14p9n_170:not(#\9), .awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160.awsui_no-range_vci2l_14p9n_170:not(#\9)::after {
+.awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160:not(#\9):not(.awsui_in-range_1mfbn_14p9n_170), .awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160:not(#\9):not(.awsui_in-range_1mfbn_14p9n_170)::after, .awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160.awsui_end-date_1mfbn_14p9n_170.awsui_start-date_1mfbn_14p9n_170:not(#\9), .awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160.awsui_end-date_1mfbn_14p9n_170.awsui_start-date_1mfbn_14p9n_170:not(#\9)::after, .awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160.awsui_no-range_1mfbn_14p9n_170:not(#\9), .awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160.awsui_no-range_1mfbn_14p9n_170:not(#\9)::after {
   border-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160:not(#\9):hover {
+.awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160:not(#\9):hover {
   color: var(--color-text-calendar-day-hover-p7s945, #16191f);
   background-color: var(--color-background-dropdown-item-hover-hgdj8r, #f2f3f3);
 }
-.awsui_enabled_vci2l_14p9n_164.awsui_in-current-month_vci2l_14p9n_160:not(#\9):hover:not(.awsui_selected_vci2l_14p9n_177)::after {
+.awsui_enabled_1mfbn_14p9n_164.awsui_in-current-month_1mfbn_14p9n_160:not(#\9):hover:not(.awsui_selected_1mfbn_14p9n_177)::after {
   border: var(--border-item-width-yvnixs, 1px) solid var(--color-border-dropdown-item-hover-d32f3f, #879596);
 }
 
-.awsui_today_vci2l_14p9n_181:not(#\9):not(.awsui_in-range_vci2l_14p9n_170) {
+.awsui_today_1mfbn_14p9n_181:not(#\9):not(.awsui_in-range_1mfbn_14p9n_170) {
   background-color: var(--color-background-calendar-today-wm2baz, #f2f3f3);
   border-radius: var(--border-radius-item-wjpc1f, 0px);
 }
 
-.awsui_selected_vci2l_14p9n_177:not(#\9) {
+.awsui_selected_1mfbn_14p9n_177:not(#\9) {
   border-color: transparent;
   position: relative;
   z-index: 2;
 }
-.awsui_selected_vci2l_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_selected_1mfbn_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus {
   position: relative;
 }
-.awsui_selected_vci2l_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus {
+.awsui_selected_1mfbn_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-calendar-grid-selected-focus-outline-gutter-s5ollf, 2px) - 1px);
 }
-.awsui_selected_vci2l_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus::before {
+.awsui_selected_1mfbn_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -206,56 +206,56 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-radius: var(--border-radius-calendar-day-focus-ring-16ha5s, 2px);
   box-shadow: 0 0 0 2px var(--color-border-calendar-grid-selected-focus-ring-vzbqhb, #0073bb);
 }
-.awsui_selected_vci2l_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus::before {
+.awsui_selected_1mfbn_14p9n_177[data-awsui-focus-visible=true]:not(#\9):focus::before {
   z-index: 1;
 }
-.awsui_selected_vci2l_14p9n_177:not(#\9)::after {
+.awsui_selected_1mfbn_14p9n_177:not(#\9)::after {
   background-color: var(--color-background-control-checked-dyuc53, #0073bb);
   border: var(--border-item-width-yvnixs, 1px) solid var(--color-background-control-checked-dyuc53, #0073bb);
   z-index: 0;
 }
-.awsui_selected_vci2l_14p9n_177.awsui_start-date_vci2l_14p9n_170:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_start-date_vci2l_14p9n_170:not(#\9)::after, .awsui_selected_vci2l_14p9n_177.awsui_range-start-date_vci2l_14p9n_217:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_range-start-date_vci2l_14p9n_217:not(#\9)::after {
+.awsui_selected_1mfbn_14p9n_177.awsui_start-date_1mfbn_14p9n_170:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_start-date_1mfbn_14p9n_170:not(#\9)::after, .awsui_selected_1mfbn_14p9n_177.awsui_range-start-date_1mfbn_14p9n_217:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_range-start-date_1mfbn_14p9n_217:not(#\9)::after {
   border-top-left-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_selected_vci2l_14p9n_177.awsui_start-date_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_start-date_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220:not(#\9)::after, .awsui_selected_vci2l_14p9n_177.awsui_range-start-date_vci2l_14p9n_217.awsui_in-range-border-bottom_vci2l_14p9n_220:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_range-start-date_vci2l_14p9n_217.awsui_in-range-border-bottom_vci2l_14p9n_220:not(#\9)::after {
+.awsui_selected_1mfbn_14p9n_177.awsui_start-date_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_start-date_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220:not(#\9)::after, .awsui_selected_1mfbn_14p9n_177.awsui_range-start-date_1mfbn_14p9n_217.awsui_in-range-border-bottom_1mfbn_14p9n_220:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_range-start-date_1mfbn_14p9n_217.awsui_in-range-border-bottom_1mfbn_14p9n_220:not(#\9)::after {
   border-bottom-left-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_selected_vci2l_14p9n_177.awsui_end-date_vci2l_14p9n_170:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_end-date_vci2l_14p9n_170:not(#\9)::after, .awsui_selected_vci2l_14p9n_177.awsui_range-end-date_vci2l_14p9n_223:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_range-end-date_vci2l_14p9n_223:not(#\9)::after {
+.awsui_selected_1mfbn_14p9n_177.awsui_end-date_1mfbn_14p9n_170:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_end-date_1mfbn_14p9n_170:not(#\9)::after, .awsui_selected_1mfbn_14p9n_177.awsui_range-end-date_1mfbn_14p9n_223:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_range-end-date_1mfbn_14p9n_223:not(#\9)::after {
   border-bottom-right-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_selected_vci2l_14p9n_177.awsui_end-date_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_end-date_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226:not(#\9)::after, .awsui_selected_vci2l_14p9n_177.awsui_range-end-date_vci2l_14p9n_223.awsui_in-range-border-top_vci2l_14p9n_226:not(#\9), .awsui_selected_vci2l_14p9n_177.awsui_range-end-date_vci2l_14p9n_223.awsui_in-range-border-top_vci2l_14p9n_226:not(#\9)::after {
+.awsui_selected_1mfbn_14p9n_177.awsui_end-date_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_end-date_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226:not(#\9)::after, .awsui_selected_1mfbn_14p9n_177.awsui_range-end-date_1mfbn_14p9n_223.awsui_in-range-border-top_1mfbn_14p9n_226:not(#\9), .awsui_selected_1mfbn_14p9n_177.awsui_range-end-date_1mfbn_14p9n_223.awsui_in-range-border-top_1mfbn_14p9n_226:not(#\9)::after {
   border-top-right-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_selected_vci2l_14p9n_177 > .awsui_day-inner_vci2l_14p9n_140:not(#\9) {
+.awsui_selected_1mfbn_14p9n_177 > .awsui_day-inner_1mfbn_14p9n_140:not(#\9) {
   color: var(--color-background-control-default-8xmy94, #ffffff);
   position: relative;
   z-index: 2;
 }
 
-.awsui_in-range_vci2l_14p9n_170:not(#\9) {
+.awsui_in-range_1mfbn_14p9n_170:not(#\9) {
   background-color: var(--color-background-dropdown-item-selected-w7iegd, #f1faff);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226:not(#\9)::after {
   border-top: var(--border-item-width-yvnixs, 1px) solid var(--color-background-control-checked-dyuc53, #0073bb);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-right_vci2l_14p9n_241:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-right_1mfbn_14p9n_241:not(#\9)::after {
   border-right: var(--border-item-width-yvnixs, 1px) solid var(--color-background-control-checked-dyuc53, #0073bb);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220:not(#\9)::after {
   border-bottom: var(--border-item-width-yvnixs, 1px) solid var(--color-background-control-checked-dyuc53, #0073bb);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-left_vci2l_14p9n_247:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-left_1mfbn_14p9n_247:not(#\9)::after {
   border-left: var(--border-item-width-yvnixs, 1px) solid var(--color-background-control-checked-dyuc53, #0073bb);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226.awsui_in-range-border-right_vci2l_14p9n_241:not(#\9), .awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226.awsui_in-range-border-right_vci2l_14p9n_241:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226.awsui_in-range-border-right_1mfbn_14p9n_241:not(#\9), .awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226.awsui_in-range-border-right_1mfbn_14p9n_241:not(#\9)::after {
   border-top-right-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220.awsui_in-range-border-right_vci2l_14p9n_241:not(#\9), .awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220.awsui_in-range-border-right_vci2l_14p9n_241:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220.awsui_in-range-border-right_1mfbn_14p9n_241:not(#\9), .awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220.awsui_in-range-border-right_1mfbn_14p9n_241:not(#\9)::after {
   border-bottom-right-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220.awsui_in-range-border-left_vci2l_14p9n_247:not(#\9), .awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-bottom_vci2l_14p9n_220.awsui_in-range-border-left_vci2l_14p9n_247:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220.awsui_in-range-border-left_1mfbn_14p9n_247:not(#\9), .awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-bottom_1mfbn_14p9n_220.awsui_in-range-border-left_1mfbn_14p9n_247:not(#\9)::after {
   border-bottom-left-radius: var(--border-radius-item-wjpc1f, 0px);
 }
-.awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226.awsui_in-range-border-left_vci2l_14p9n_247:not(#\9), .awsui_in-range_vci2l_14p9n_170.awsui_in-range-border-top_vci2l_14p9n_226.awsui_in-range-border-left_vci2l_14p9n_247:not(#\9)::after {
+.awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226.awsui_in-range-border-left_1mfbn_14p9n_247:not(#\9), .awsui_in-range_1mfbn_14p9n_170.awsui_in-range-border-top_1mfbn_14p9n_226.awsui_in-range-border-left_1mfbn_14p9n_247:not(#\9)::after {
   border-top-left-radius: var(--border-radius-item-wjpc1f, 0px);
 }

package/lib/internal/template/date-range-picker/calendar/grids/styles.selectors.js

@@ -0,0 +1,27 @@
+
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "day": "awsui_day_1mfbn_14p9n_97",
+  "day-inner": "awsui_day-inner_1mfbn_14p9n_140",
+  "in-first-row": "awsui_in-first-row_1mfbn_14p9n_145",
+  "in-previous-month": "awsui_in-previous-month_1mfbn_14p9n_145",
+  "last-day-of-month": "awsui_last-day-of-month_1mfbn_14p9n_149",
+  "in-next-month": "awsui_in-next-month_1mfbn_14p9n_153",
+  "in-first-column": "awsui_in-first-column_1mfbn_14p9n_157",
+  "in-current-month": "awsui_in-current-month_1mfbn_14p9n_160",
+  "enabled": "awsui_enabled_1mfbn_14p9n_164",
+  "in-range": "awsui_in-range_1mfbn_14p9n_170",
+  "end-date": "awsui_end-date_1mfbn_14p9n_170",
+  "start-date": "awsui_start-date_1mfbn_14p9n_170",
+  "no-range": "awsui_no-range_1mfbn_14p9n_170",
+  "selected": "awsui_selected_1mfbn_14p9n_177",
+  "today": "awsui_today_1mfbn_14p9n_181",
+  "range-start-date": "awsui_range-start-date_1mfbn_14p9n_217",
+  "in-range-border-bottom": "awsui_in-range-border-bottom_1mfbn_14p9n_220",
+  "range-end-date": "awsui_range-end-date_1mfbn_14p9n_223",
+  "in-range-border-top": "awsui_in-range-border-top_1mfbn_14p9n_226",
+  "in-range-border-right": "awsui_in-range-border-right_1mfbn_14p9n_241",
+  "in-range-border-left": "awsui_in-range-border-left_1mfbn_14p9n_247"
+};
+  

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

@@ -38,8 +38,8 @@ function renderDateRange(range, placeholder, formatRelativeRange, timeOffset) {
 function BreakSpaces(_a) {
     var text = _a.text;
     var tokens = text.split(/( )/);
-    return (React.createElement("div", { style: { whiteSpace: 'nowrap' } }, tokens.map(function (token, index) { return (React.createElement(React.Fragment, { key: index },
-        token,
+    return (React.createElement(React.Fragment, null, tokens.map(function (token, index) { return (React.createElement(React.Fragment, { key: index },
+        token.length > 1 ? React.createElement("span", { className: styles['label-token-nowrap'] }, token) : token,
         token === ' ' && React.createElement("wbr", null))); })));
 }
 function isDateOnly(value) {