@cloudscape-design/components-themeable 3.0.57 → 3.0.59

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

@@ -4,10 +4,10 @@ import { __assign, __rest } from "tslib";
 import clsx from 'clsx';
 import React, { useCallback, useRef, useState } from 'react';
 import styles from './styles.css.js';
-import Calendar from './calendar';
-import { normalizeLocale } from './calendar/utils/locales';
-import { getDateLabel } from './calendar/utils/intl';
-import { memoizedDate } from './calendar/utils/memoized-date';
+import InternalCalendar from '../calendar/internal';
+import { normalizeLocale } from '../calendar/utils/locales';
+import { getDateLabel, renderMonthAndYear } from '../calendar/utils/intl';
+import { memoizedDate } from '../calendar/utils/memoized-date';
 import { KeyCode } from '../internal/keycode';
 import { fireNonCancelableEvent } from '../internal/events';
 import Dropdown from '../internal/components/dropdown';
@@ -22,6 +22,7 @@ import useBaseComponent from '../internal/hooks/use-base-component';
 import { useUniqueId } from '../internal/hooks/use-unique-id';
 import { useMergeRefs } from '../internal/hooks/use-merge-refs';
 import FocusLock from '../internal/components/focus-lock';
+import useFocusVisible from '../internal/hooks/focus-visible/index.js';
 var DatePicker = React.forwardRef(function (_a, ref) {
     var _b = _a.locale, locale = _b === void 0 ? '' : _b, startOfWeek = _a.startOfWeek, isDateEnabled = _a.isDateEnabled, nextMonthAriaLabel = _a.nextMonthAriaLabel, previousMonthAriaLabel = _a.previousMonthAriaLabel, todayAriaLabel = _a.todayAriaLabel, _c = _a.placeholder, placeholder = _c === void 0 ? '' : _c, _d = _a.value, value = _d === void 0 ? '' : _d, _e = _a.readOnly, readOnly = _e === void 0 ? false : _e, _f = _a.disabled, disabled = _f === void 0 ? false : _f, onBlur = _a.onBlur, _g = _a.autoFocus, autoFocus = _g === void 0 ? false : _g, onChange = _a.onChange, onFocus = _a.onFocus, name = _a.name, ariaLabel = _a.ariaLabel, ariaRequired = _a.ariaRequired, ariaLabelledby = _a.ariaLabelledby, ariaDescribedby = _a.ariaDescribedby, controlId = _a.controlId, invalid = _a.invalid, openCalendarAriaLabel = _a.openCalendarAriaLabel, expandToViewport = _a.expandToViewport, rest = __rest(_a, ["locale", "startOfWeek", "isDateEnabled", "nextMonthAriaLabel", "previousMonthAriaLabel", "todayAriaLabel", "placeholder", "value", "readOnly", "disabled", "onBlur", "autoFocus", "onChange", "onFocus", "name", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "controlId", "invalid", "openCalendarAriaLabel", "expandToViewport"]);
     var __internalRootRef = useBaseComponent('DatePicker').__internalRootRef;
@@ -29,11 +30,13 @@ var DatePicker = React.forwardRef(function (_a, ref) {
     var baseProps = getBaseProps(rest);
     var _h = useState(false), isDropDownOpen = _h[0], setIsDropDownOpen = _h[1];
     var normalizedLocale = normalizeLocale('DatePicker', locale);
+    var focusVisible = useFocusVisible();
     var internalInputRef = useRef(null);
     var buttonRef = useRef(null);
     useForwardFocus(ref, internalInputRef);
     var rootRef = useRef(null);
     var dropdownId = useUniqueId('calender');
+    var calendarDescriptionId = useUniqueId('calendar-description-');
     var mergedRef = useMergeRefs(rootRef, __internalRootRef);
     useFocusTracker({ rootRef: rootRef, onBlur: onBlur, onFocus: onFocus, viewportId: expandToViewport ? dropdownId : '' });
     var onDropdownCloseHandler = useCallback(function () { return setIsDropDownOpen(false); }, [setIsDropDownOpen]);
@@ -58,6 +61,7 @@ var DatePicker = React.forwardRef(function (_a, ref) {
         }
     };
     var memoizedValue = memoizedDate('value', value);
+    var baseDate = memoizedValue || new Date();
     var DateInputElement = (React.createElement("div", { className: styles['date-picker-trigger'] },
         React.createElement("div", { className: styles['date-picker-input'] },
             React.createElement(InternalDateInput, { name: name, invalid: invalid, controlId: controlId, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, ariaLabel: ariaLabel, ariaRequired: ariaRequired, value: value, disabled: disabled, readOnly: readOnly, onChange: onInputChangeHandler, onBlur: onInputBlurHandler, placeholder: placeholder, ref: internalInputRef, autoFocus: autoFocus })),
@@ -74,12 +78,14 @@ var DatePicker = React.forwardRef(function (_a, ref) {
     };
     return (React.createElement("div", __assign({}, baseProps, { ref: mergedRef, onKeyDown: onWrapperKeyDownHandler }),
         React.createElement(Dropdown, { stretchWidth: true, stretchHeight: true, open: isDropDownOpen, onDropdownClose: onDropdownCloseHandler, onMouseDown: handleMouseDown, trigger: DateInputElement, expandToViewport: expandToViewport, scrollable: false, dropdownId: dropdownId }, isDropDownOpen && (React.createElement(FocusLock, { autoFocus: true },
-            React.createElement(Calendar, { value: value, onChange: function (e) {
-                    var _a;
-                    fireNonCancelableEvent(onChange, e.detail);
-                    (_a = buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
-                    setIsDropDownOpen(false);
-                }, locale: normalizedLocale, startOfWeek: startOfWeek, isDateEnabled: isDateEnabled, todayAriaLabel: todayAriaLabel, nextMonthAriaLabel: nextMonthAriaLabel, previousMonthAriaLabel: previousMonthAriaLabel }))))));
+            React.createElement("div", __assign({}, focusVisible, { tabIndex: 0, className: styles.calendar, role: "application", "aria-describedby": calendarDescriptionId }),
+                React.createElement(InternalCalendar, { value: value, onChange: function (e) {
+                        var _a;
+                        fireNonCancelableEvent(onChange, e.detail);
+                        (_a = buttonRef === null || buttonRef === void 0 ? void 0 : buttonRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                        setIsDropDownOpen(false);
+                    }, locale: normalizedLocale, startOfWeek: startOfWeek, isDateEnabled: isDateEnabled, todayAriaLabel: todayAriaLabel, nextMonthAriaLabel: nextMonthAriaLabel, previousMonthAriaLabel: previousMonthAriaLabel }),
+                React.createElement("div", { id: calendarDescriptionId, className: styles['screenreader-only'], "aria-live": "polite" }, renderMonthAndYear(normalizedLocale, baseDate))))))));
 });
 applyDisplayName(DatePicker, 'DatePicker');
 export default DatePicker;

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-picker/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 clsx from 'clsx';\nimport React, { Ref, useCallback, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { DatePickerProps } from './interfaces';\nimport Calendar from './calendar';\nimport { normalizeLocale } from './calendar/utils/locales';\nimport { getDateLabel } from './calendar/utils/intl';\nimport { memoizedDate } from './calendar/utils/memoized-date';\nimport { InputProps } from '../input/interfaces';\nimport { KeyCode } from '../internal/keycode';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport Dropdown from '../internal/components/dropdown';\nimport InternalDateInput from '../date-input/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport FocusLock from '../internal/components/focus-lock';\n\nexport { DatePickerProps };\n\nconst DatePicker = React.forwardRef(\n  (\n    {\n      locale = '',\n      startOfWeek,\n      isDateEnabled,\n      nextMonthAriaLabel,\n      previousMonthAriaLabel,\n      todayAriaLabel,\n      placeholder = '',\n      value = '',\n      readOnly = false,\n      disabled = false,\n      onBlur,\n      autoFocus = false,\n      onChange,\n      onFocus,\n      name,\n      ariaLabel,\n      ariaRequired,\n      ariaLabelledby,\n      ariaDescribedby,\n      controlId,\n      invalid,\n      openCalendarAriaLabel,\n      expandToViewport,\n      ...rest\n    }: DatePickerProps,\n    ref: Ref<DatePickerProps.Ref>\n  ) => {\n    const { __internalRootRef } = useBaseComponent('DatePicker');\n    checkControlled('DatePicker', 'value', value, 'onChange', onChange);\n\n    const baseProps = getBaseProps(rest);\n    const [isDropDownOpen, setIsDropDownOpen] = useState<boolean>(false);\n    const normalizedLocale = normalizeLocale('DatePicker', locale);\n\n    const internalInputRef = useRef<HTMLInputElement>(null);\n    const buttonRef = useRef<ButtonProps.Ref>(null);\n    useForwardFocus(ref, internalInputRef);\n\n    const rootRef = useRef<HTMLDivElement>(null);\n    const dropdownId = useUniqueId('calender');\n    const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n    useFocusTracker({ rootRef, onBlur, onFocus, viewportId: expandToViewport ? dropdownId : '' });\n\n    const onDropdownCloseHandler = useCallback(() => setIsDropDownOpen(false), [setIsDropDownOpen]);\n\n    const onButtonClickHandler = () => {\n      if (!isDropDownOpen) {\n        setIsDropDownOpen(true);\n      }\n    };\n\n    const onWrapperKeyDownHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.keyCode === KeyCode.escape && isDropDownOpen) {\n        buttonRef.current?.focus();\n        setIsDropDownOpen(false);\n      }\n    };\n\n    const onInputChangeHandler: InputProps['onChange'] = event => {\n      fireNonCancelableEvent(onChange, { value: event.detail.value });\n    };\n\n    const onInputBlurHandler: InputProps['onBlur'] = () => {\n      if (!isDropDownOpen) {\n        setIsDropDownOpen(false);\n      }\n    };\n\n    const memoizedValue = memoizedDate('value', value);\n\n    const DateInputElement = (\n      <div className={styles['date-picker-trigger']}>\n        <div className={styles['date-picker-input']}>\n          <InternalDateInput\n            name={name}\n            invalid={invalid}\n            controlId={controlId}\n            ariaLabelledby={ariaLabelledby}\n            ariaDescribedby={ariaDescribedby}\n            ariaLabel={ariaLabel}\n            ariaRequired={ariaRequired}\n            value={value}\n            disabled={disabled}\n            readOnly={readOnly}\n            onChange={onInputChangeHandler}\n            onBlur={onInputBlurHandler}\n            placeholder={placeholder}\n            ref={internalInputRef}\n            autoFocus={autoFocus}\n          />\n        </div>\n        <div>\n          <InternalButton\n            iconName=\"calendar\"\n            className={styles['open-calendar-button']}\n            onClick={onButtonClickHandler}\n            ref={buttonRef}\n            ariaLabel={\n              openCalendarAriaLabel &&\n              openCalendarAriaLabel(value.length === 10 ? getDateLabel(normalizedLocale, memoizedValue!) : null)\n            }\n            disabled={disabled || readOnly}\n            formAction=\"none\"\n          />\n        </div>\n      </div>\n    );\n\n    baseProps.className = clsx(baseProps.className, styles.root, styles['date-picker-container']);\n\n    if (readOnly || disabled) {\n      return <div {...baseProps}>{DateInputElement}</div>;\n    }\n\n    const handleMouseDown = (event: React.MouseEvent) => {\n      // prevent currently focused element from losing it\n      event.preventDefault();\n    };\n\n    return (\n      <div {...baseProps} ref={mergedRef} onKeyDown={onWrapperKeyDownHandler}>\n        <Dropdown\n          stretchWidth={true}\n          stretchHeight={true}\n          open={isDropDownOpen}\n          onDropdownClose={onDropdownCloseHandler}\n          onMouseDown={handleMouseDown}\n          trigger={DateInputElement}\n          expandToViewport={expandToViewport}\n          scrollable={false}\n          dropdownId={dropdownId}\n        >\n          {isDropDownOpen && (\n            <FocusLock autoFocus={true}>\n              <Calendar\n                value={value}\n                onChange={e => {\n                  fireNonCancelableEvent(onChange, e.detail);\n                  buttonRef?.current?.focus();\n                  setIsDropDownOpen(false);\n                }}\n                locale={normalizedLocale}\n                startOfWeek={startOfWeek}\n                isDateEnabled={isDateEnabled}\n                todayAriaLabel={todayAriaLabel}\n                nextMonthAriaLabel={nextMonthAriaLabel}\n                previousMonthAriaLabel={previousMonthAriaLabel}\n              />\n            </FocusLock>\n          )}\n        </Dropdown>\n      </div>\n    );\n  }\n);\n\napplyDisplayName(DatePicker, 'DatePicker');\nexport default DatePicker;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-picker/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 clsx from 'clsx';\nimport React, { Ref, useCallback, useRef, useState } from 'react';\nimport styles from './styles.css.js';\nimport { DatePickerProps } from './interfaces';\nimport InternalCalendar from '../calendar/internal';\nimport { normalizeLocale } from '../calendar/utils/locales';\nimport { getDateLabel, renderMonthAndYear } from '../calendar/utils/intl';\nimport { memoizedDate } from '../calendar/utils/memoized-date';\nimport { InputProps } from '../input/interfaces';\nimport { KeyCode } from '../internal/keycode';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport Dropdown from '../internal/components/dropdown';\nimport InternalDateInput from '../date-input/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name.js';\nimport checkControlled from '../internal/hooks/check-controlled';\nimport { useFocusTracker } from '../internal/hooks/use-focus-tracker.js';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { ButtonProps } from '../button/interfaces';\nimport { InternalButton } from '../button/internal';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { useUniqueId } from '../internal/hooks/use-unique-id';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport FocusLock from '../internal/components/focus-lock';\nimport useFocusVisible from '../internal/hooks/focus-visible/index.js';\n\nexport { DatePickerProps };\n\nconst DatePicker = React.forwardRef(\n  (\n    {\n      locale = '',\n      startOfWeek,\n      isDateEnabled,\n      nextMonthAriaLabel,\n      previousMonthAriaLabel,\n      todayAriaLabel,\n      placeholder = '',\n      value = '',\n      readOnly = false,\n      disabled = false,\n      onBlur,\n      autoFocus = false,\n      onChange,\n      onFocus,\n      name,\n      ariaLabel,\n      ariaRequired,\n      ariaLabelledby,\n      ariaDescribedby,\n      controlId,\n      invalid,\n      openCalendarAriaLabel,\n      expandToViewport,\n      ...rest\n    }: DatePickerProps,\n    ref: Ref<DatePickerProps.Ref>\n  ) => {\n    const { __internalRootRef } = useBaseComponent('DatePicker');\n    checkControlled('DatePicker', 'value', value, 'onChange', onChange);\n\n    const baseProps = getBaseProps(rest);\n    const [isDropDownOpen, setIsDropDownOpen] = useState<boolean>(false);\n    const normalizedLocale = normalizeLocale('DatePicker', locale);\n    const focusVisible = useFocusVisible();\n\n    const internalInputRef = useRef<HTMLInputElement>(null);\n    const buttonRef = useRef<ButtonProps.Ref>(null);\n    useForwardFocus(ref, internalInputRef);\n\n    const rootRef = useRef<HTMLDivElement>(null);\n    const dropdownId = useUniqueId('calender');\n    const calendarDescriptionId = useUniqueId('calendar-description-');\n    const mergedRef = useMergeRefs(rootRef, __internalRootRef);\n\n    useFocusTracker({ rootRef, onBlur, onFocus, viewportId: expandToViewport ? dropdownId : '' });\n\n    const onDropdownCloseHandler = useCallback(() => setIsDropDownOpen(false), [setIsDropDownOpen]);\n\n    const onButtonClickHandler = () => {\n      if (!isDropDownOpen) {\n        setIsDropDownOpen(true);\n      }\n    };\n\n    const onWrapperKeyDownHandler = (event: React.KeyboardEvent<HTMLDivElement>) => {\n      if (event.keyCode === KeyCode.escape && isDropDownOpen) {\n        buttonRef.current?.focus();\n        setIsDropDownOpen(false);\n      }\n    };\n\n    const onInputChangeHandler: InputProps['onChange'] = event => {\n      fireNonCancelableEvent(onChange, { value: event.detail.value });\n    };\n\n    const onInputBlurHandler: InputProps['onBlur'] = () => {\n      if (!isDropDownOpen) {\n        setIsDropDownOpen(false);\n      }\n    };\n\n    const memoizedValue = memoizedDate('value', value);\n    const baseDate = memoizedValue || new Date();\n\n    const DateInputElement = (\n      <div className={styles['date-picker-trigger']}>\n        <div className={styles['date-picker-input']}>\n          <InternalDateInput\n            name={name}\n            invalid={invalid}\n            controlId={controlId}\n            ariaLabelledby={ariaLabelledby}\n            ariaDescribedby={ariaDescribedby}\n            ariaLabel={ariaLabel}\n            ariaRequired={ariaRequired}\n            value={value}\n            disabled={disabled}\n            readOnly={readOnly}\n            onChange={onInputChangeHandler}\n            onBlur={onInputBlurHandler}\n            placeholder={placeholder}\n            ref={internalInputRef}\n            autoFocus={autoFocus}\n          />\n        </div>\n        <div>\n          <InternalButton\n            iconName=\"calendar\"\n            className={styles['open-calendar-button']}\n            onClick={onButtonClickHandler}\n            ref={buttonRef}\n            ariaLabel={\n              openCalendarAriaLabel &&\n              openCalendarAriaLabel(value.length === 10 ? getDateLabel(normalizedLocale, memoizedValue!) : null)\n            }\n            disabled={disabled || readOnly}\n            formAction=\"none\"\n          />\n        </div>\n      </div>\n    );\n\n    baseProps.className = clsx(baseProps.className, styles.root, styles['date-picker-container']);\n\n    if (readOnly || disabled) {\n      return <div {...baseProps}>{DateInputElement}</div>;\n    }\n\n    const handleMouseDown = (event: React.MouseEvent) => {\n      // prevent currently focused element from losing it\n      event.preventDefault();\n    };\n\n    return (\n      <div {...baseProps} ref={mergedRef} onKeyDown={onWrapperKeyDownHandler}>\n        <Dropdown\n          stretchWidth={true}\n          stretchHeight={true}\n          open={isDropDownOpen}\n          onDropdownClose={onDropdownCloseHandler}\n          onMouseDown={handleMouseDown}\n          trigger={DateInputElement}\n          expandToViewport={expandToViewport}\n          scrollable={false}\n          dropdownId={dropdownId}\n        >\n          {isDropDownOpen && (\n            <FocusLock autoFocus={true}>\n              <div\n                {...focusVisible}\n                tabIndex={0}\n                className={styles.calendar}\n                role=\"application\"\n                aria-describedby={calendarDescriptionId}\n              >\n                <InternalCalendar\n                  value={value}\n                  onChange={e => {\n                    fireNonCancelableEvent(onChange, e.detail);\n                    buttonRef?.current?.focus();\n                    setIsDropDownOpen(false);\n                  }}\n                  locale={normalizedLocale}\n                  startOfWeek={startOfWeek}\n                  isDateEnabled={isDateEnabled}\n                  todayAriaLabel={todayAriaLabel}\n                  nextMonthAriaLabel={nextMonthAriaLabel}\n                  previousMonthAriaLabel={previousMonthAriaLabel}\n                />\n                <div id={calendarDescriptionId} className={styles['screenreader-only']} aria-live=\"polite\">\n                  {renderMonthAndYear(normalizedLocale, baseDate)}\n                </div>\n              </div>\n            </FocusLock>\n          )}\n        </Dropdown>\n      </div>\n    );\n  }\n);\n\napplyDisplayName(DatePicker, 'DatePicker');\nexport default DatePicker;\n"]}

package/lib/internal/template/date-picker/interfaces.d.ts

@@ -2,50 +2,8 @@ import { BaseComponentProps } from '../internal/base-component';
 import { FormFieldValidationControlProps } from '../internal/context/form-field-context';
 import { ExpandToViewport } from '../internal/components/dropdown/interfaces';
 import { NonCancelableEventHandler } from '../internal/events';
-export interface DatePickerBaseProps {
-    /**
-     * The current input value, in YYYY-MM-DD format.
-     */
-    value: string;
-    /**
-     * Defines whether a particular date is enabled in the calendar or not.
-     * If you disable a date in the calendar, users can still enter this date using a keyboard.
-     * We recommend that you also validate these constraints on the client-side and server-side
-     * as you would for other form elements.
-     * @param date
-     */
-    isDateEnabled?: DatePickerProps.IsDateEnabledFunction;
-    /**
-     * Specifies the locale to use to render month names and determine the starting day of the week.
-     * If you don't provide this, the locale is determined by the page and browser locales.
-     * Supported values and formats are listed in the
-     * [JavaScript Intl API specification](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation).
-     */
-    locale?: string;
-    /**
-     * Determines the starting day of the week. The values 0-6 map to Sunday-Saturday.
-     * By default the starting day of the week is defined by the locale, but you can use this property to override it.
-     */
-    startOfWeek?: number;
-    /**
-     * Used as part of the `aria-label` for today's date in the calendar.
-     */
-    todayAriaLabel: string;
-    /**
-     * Specifies an `aria-label` for the 'next month' button.
-     */
-    nextMonthAriaLabel: string;
-    /**
-     * Specifies an `aria-label` for the 'previous month' button.
-     */
-    previousMonthAriaLabel: string;
-    /**
-     * Called whenever a user changes the input value (by typing, pasting, or selecting a value).
-     * The event `detail` contains the current value of the field.
-     */
-    onChange?: NonCancelableEventHandler<DatePickerProps.ChangeDetail>;
-}
-export interface DatePickerProps extends BaseComponentProps, FormFieldValidationControlProps, ExpandToViewport, DatePickerBaseProps {
+import { CalendarProps } from '../calendar/interfaces';
+export interface DatePickerProps extends BaseComponentProps, FormFieldValidationControlProps, ExpandToViewport, CalendarProps {
     /**
      * Specifies the placeholder text rendered when the value is an empty string.
      */

package/lib/internal/template/date-picker/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,mBAAmB;IAClC;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IAEtD;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,cAAc,EAAE,MAAM,CAAC;IAEvB;;OAEG;IACH,kBAAkB,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,sBAAsB,EAAE,MAAM,CAAC;IAE/B;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;CACpE;AAED,MAAM,WAAW,eACf,SAAQ,kBAAkB,EACxB,+BAA+B,EAC/B,gBAAgB,EAChB,mBAAmB;IACrB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IAE9D;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;IAE1C;;OAEG;IACH,MAAM,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;CAC1C;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,YAAY;QAC3B;;WAEG;QACH,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,qBAAqB;QACpC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;KACvB;IAED,UAAiB,qBAAqB;QACpC,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAAC;KACvC;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,gBAAgB,EAAE,MAAM,4CAA4C,CAAC;AAC9E,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAEvD,MAAM,WAAW,eACf,SAAQ,kBAAkB,EACxB,+BAA+B,EAC/B,gBAAgB,EAChB,aAAa;IACf;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,eAAe,CAAC,qBAAqB,CAAC;IAE9D;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;;;OAKG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;;;OAIG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;OAEG;IACH,OAAO,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;IAE1C;;OAEG;IACH,MAAM,CAAC,EAAE,yBAAyB,CAAC,IAAI,CAAC,CAAC;CAC1C;AAED,yBAAiB,eAAe,CAAC;IAC/B,UAAiB,YAAY;QAC3B;;WAEG;QACH,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,qBAAqB;QACpC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;KACvB;IAED,UAAiB,qBAAqB;QACpC,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,GAAG,MAAM,CAAC;KACvC;IAED,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;KACf;CACF"}

package/lib/internal/template/date-picker/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { ExpandToViewport } from '../internal/components/dropdown/interfaces';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface DatePickerBaseProps {\n  /**\n   * The current input value, in YYYY-MM-DD format.\n   */\n  value: string;\n\n  /**\n   * Defines whether a particular date is enabled in the calendar or not.\n   * If you disable a date in the calendar, users can still enter this date using a keyboard.\n   * We recommend that you also validate these constraints on the client-side and server-side\n   * as you would for other form elements.\n   * @param date\n   */\n  isDateEnabled?: DatePickerProps.IsDateEnabledFunction;\n\n  /**\n   * Specifies the locale to use to render month names and determine the starting day of the week.\n   * If you don't provide this, the locale is determined by the page and browser locales.\n   * Supported values and formats are listed in the\n   * [JavaScript Intl API specification](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Locale_identification_and_negotiation).\n   */\n  locale?: string;\n\n  /**\n   * Determines the starting day of the week. The values 0-6 map to Sunday-Saturday.\n   * By default the starting day of the week is defined by the locale, but you can use this property to override it.\n   */\n  startOfWeek?: number;\n\n  /**\n   * Used as part of the `aria-label` for today's date in the calendar.\n   */\n  todayAriaLabel: string;\n\n  /**\n   * Specifies an `aria-label` for the 'next month' button.\n   */\n  nextMonthAriaLabel: string;\n\n  /**\n   * Specifies an `aria-label` for the 'previous month' button.\n   */\n  previousMonthAriaLabel: string;\n\n  /**\n   * Called whenever a user changes the input value (by typing, pasting, or selecting a value).\n   * The event `detail` contains the current value of the field.\n   */\n  onChange?: NonCancelableEventHandler<DatePickerProps.ChangeDetail>;\n}\n\nexport interface DatePickerProps\n  extends BaseComponentProps,\n    FormFieldValidationControlProps,\n    ExpandToViewport,\n    DatePickerBaseProps {\n  /**\n   * Specifies the placeholder text rendered when the value is an empty string.\n   */\n  placeholder?: string;\n\n  /**\n   * Specifies a function that generates the `aria-label` for the 'open calendar' button. The `selectedDate` parameter is\n   * a human-readable localised string representing the current value of the input.\n   * (for example, ``selectedDate => 'Choose Date' + (selectedDate ? `, selected date is ${selectedDate}` : '')``)\n   */\n  openCalendarAriaLabel?: DatePickerProps.OpenCalendarAriaLabel;\n\n  /**\n   * Specifies the name of the control used in HTML forms.\n   */\n  name?: string;\n\n  /**\n   * Specifies if the control is disabled, which prevents the\n   * user from modifying the value and prevents the value from\n   * being included in a form submission. A disabled control can't\n   * receive focus.\n   */\n  disabled?: boolean;\n\n  /**\n   * Specifies if the control is read only, which prevents the\n   * user from modifying the value but includes it in a form\n   * submission. A read-only control can receive focus.\n   *\n   * Do not use read-only inputs outside of a form.\n   */\n  readOnly?: boolean;\n\n  /**\n   * Indicates whether the control should be focused as\n   * soon as the page loads, which enables the user to\n   * start typing without having to manually focus the control. Don't\n   * use this option on pages where the control may be\n   * scrolled out of the viewport.\n   */\n  autoFocus?: boolean;\n\n  /**\n   * Adds an `aria-label` to the native control.\n   *\n   * Use this if you don't have a visible label for this control.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Specifies whether to add `aria-required` to the native control.\n   */\n  ariaRequired?: boolean;\n\n  /**\n   * Called when input focus is moved to the UI control.\n   */\n  onFocus?: NonCancelableEventHandler<null>;\n\n  /**\n   * Called when input focus is removed from the UI control.\n   */\n  onBlur?: NonCancelableEventHandler<null>;\n}\n\nexport namespace DatePickerProps {\n  export interface ChangeDetail {\n    /**\n     * The new value of this date-picker.\n     */\n    value: string;\n  }\n\n  export interface IsDateEnabledFunction {\n    (date: Date): boolean;\n  }\n\n  export interface OpenCalendarAriaLabel {\n    (selectedDate: string | null): string;\n  }\n\n  export interface Ref {\n    /**\n     * Sets the browser focus on the UI control\n     */\n    focus(): void;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-picker/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { ExpandToViewport } from '../internal/components/dropdown/interfaces';\nimport { NonCancelableEventHandler } from '../internal/events';\nimport { CalendarProps } from '../calendar/interfaces';\n\nexport interface DatePickerProps\n  extends BaseComponentProps,\n    FormFieldValidationControlProps,\n    ExpandToViewport,\n    CalendarProps {\n  /**\n   * Specifies the placeholder text rendered when the value is an empty string.\n   */\n  placeholder?: string;\n\n  /**\n   * Specifies a function that generates the `aria-label` for the 'open calendar' button. The `selectedDate` parameter is\n   * a human-readable localised string representing the current value of the input.\n   * (for example, ``selectedDate => 'Choose Date' + (selectedDate ? `, selected date is ${selectedDate}` : '')``)\n   */\n  openCalendarAriaLabel?: DatePickerProps.OpenCalendarAriaLabel;\n\n  /**\n   * Specifies the name of the control used in HTML forms.\n   */\n  name?: string;\n\n  /**\n   * Specifies if the control is disabled, which prevents the\n   * user from modifying the value and prevents the value from\n   * being included in a form submission. A disabled control can't\n   * receive focus.\n   */\n  disabled?: boolean;\n\n  /**\n   * Specifies if the control is read only, which prevents the\n   * user from modifying the value but includes it in a form\n   * submission. A read-only control can receive focus.\n   *\n   * Do not use read-only inputs outside of a form.\n   */\n  readOnly?: boolean;\n\n  /**\n   * Indicates whether the control should be focused as\n   * soon as the page loads, which enables the user to\n   * start typing without having to manually focus the control. Don't\n   * use this option on pages where the control may be\n   * scrolled out of the viewport.\n   */\n  autoFocus?: boolean;\n\n  /**\n   * Adds an `aria-label` to the native control.\n   *\n   * Use this if you don't have a visible label for this control.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Specifies whether to add `aria-required` to the native control.\n   */\n  ariaRequired?: boolean;\n\n  /**\n   * Called when input focus is moved to the UI control.\n   */\n  onFocus?: NonCancelableEventHandler<null>;\n\n  /**\n   * Called when input focus is removed from the UI control.\n   */\n  onBlur?: NonCancelableEventHandler<null>;\n}\n\nexport namespace DatePickerProps {\n  export interface ChangeDetail {\n    /**\n     * The new value of this date-picker.\n     */\n    value: string;\n  }\n\n  export interface IsDateEnabledFunction {\n    (date: Date): boolean;\n  }\n\n  export interface OpenCalendarAriaLabel {\n    (selectedDate: string | null): string;\n  }\n\n  export interface Ref {\n    /**\n     * Sets the browser focus on the UI control\n     */\n    focus(): void;\n  }\n}\n"]}

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

@@ -1,29 +1,12 @@
 
     import './styles.scoped.css';
     export default {
-  "calendar": "awsui_calendar_145pa_hegy7_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_145pa_hegy7_1",
-  "root": "awsui_root_145pa_hegy7_120",
-  "date-picker-container": "awsui_date-picker-container_145pa_hegy7_131",
-  "date-picker-trigger": "awsui_date-picker-trigger_145pa_hegy7_136",
-  "date-picker-input": "awsui_date-picker-input_145pa_hegy7_140",
-  "open-calendar-button": "awsui_open-calendar-button_145pa_hegy7_145",
-  "calendar-inner": "awsui_calendar-inner_145pa_hegy7_165",
-  "calendar-header": "awsui_calendar-header_145pa_hegy7_168",
-  "calendar-header-month": "awsui_calendar-header-month_145pa_hegy7_173",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_145pa_hegy7_179",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_145pa_hegy7_182",
-  "calendar-day-names": "awsui_calendar-day-names_145pa_hegy7_185",
-  "calendar-day-name": "awsui_calendar-day-name_145pa_hegy7_185",
-  "calendar-dates": "awsui_calendar-dates_145pa_hegy7_200",
-  "calendar-week": "awsui_calendar-week_145pa_hegy7_203",
-  "calendar-day": "awsui_calendar-day_145pa_hegy7_185",
-  "calendar-day-in-last-week": "awsui_calendar-day-in-last-week_145pa_hegy7_222",
-  "calendar-day-focusable": "awsui_calendar-day-focusable_145pa_hegy7_225",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_145pa_hegy7_228",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_145pa_hegy7_232",
-  "calendar-day-selected": "awsui_calendar-day-selected_145pa_hegy7_239",
-  "calendar-day-today": "awsui_calendar-day-today_145pa_hegy7_243",
-  "day-inner": "awsui_day-inner_145pa_hegy7_255"
+  "root": "awsui_root_145pa_1uq9r_93",
+  "calendar": "awsui_calendar_145pa_1uq9r_104",
+  "screenreader-only": "awsui_screenreader-only_145pa_1uq9r_114",
+  "date-picker-container": "awsui_date-picker-container_145pa_1uq9r_120",
+  "date-picker-trigger": "awsui_date-picker-trigger_145pa_1uq9r_125",
+  "date-picker-input": "awsui_date-picker-input_145pa_1uq9r_129",
+  "open-calendar-button": "awsui_open-calendar-button_145pa_1uq9r_134"
 };
   

package/lib/internal/template/date-picker/styles.scoped.css

@@ -90,34 +90,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_calendar_145pa_hegy7_93:not(#\9) {
-  animation: awsui_awsui-motion-fade-in-0_145pa_hegy7_1 var(--motion-duration-show-quick-tyaalm, 135ms) var(--motion-easing-show-quick-1fcgbv, ease-out);
-  animation-fill-mode: both;
-}
-@keyframes awsui_awsui-motion-fade-in-0_145pa_hegy7_1 {
-  from {
-    opacity: 0;
-  }
-  to {
-    opacity: 1;
-  }
-}
-@media (prefers-reduced-motion: reduce) {
-  .awsui_calendar_145pa_hegy7_93:not(#\9) {
-    animation: none;
-    transition: none;
-  }
-}
-.awsui-motion-disabled .awsui_calendar_145pa_hegy7_93:not(#\9), .awsui-mode-entering .awsui_calendar_145pa_hegy7_93:not(#\9) {
-  animation: none;
-  transition: none;
-}
-
-/*
- Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
- SPDX-License-Identifier: Apache-2.0
-*/
-.awsui_root_145pa_hegy7_120:not(#\9) {
+.awsui_root_145pa_1uq9r_93:not(#\9) {
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
   border-spacing: 0;
@@ -154,198 +127,36 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   font-family: var(--font-family-base-mylvzb, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
 }
 
-.awsui_date-picker-container_145pa_hegy7_131:not(#\9) {
+.awsui_calendar_145pa_1uq9r_104:not(#\9):focus {
+  outline: none;
+}
+.awsui_calendar_145pa_1uq9r_104[data-awsui-focus-visible=true]:not(#\9):focus {
+  outline: 2px dotted transparent;
+  outline-offset: 2px;
+  border-radius: var(--border-radius-dropdown-0c284d, 0px);
+  box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
+}
+
+.awsui_screenreader-only_145pa_1uq9r_114:not(#\9) {
+  position: absolute !important;
+  top: -9999px !important;
+  left: -9999px !important;
+}
+
+.awsui_date-picker-container_145pa_1uq9r_120:not(#\9) {
   position: relative;
   max-width: 234px;
 }
 
-.awsui_date-picker-trigger_145pa_hegy7_136:not(#\9) {
+.awsui_date-picker-trigger_145pa_1uq9r_125:not(#\9) {
   display: flex;
 }
 
-.awsui_date-picker-input_145pa_hegy7_140:not(#\9) {
+.awsui_date-picker-input_145pa_1uq9r_129:not(#\9) {
   padding-right: var(--space-xs-rsr2qu, 8px);
   width: 100%;
 }
 
-.awsui_open-calendar-button_145pa_hegy7_145:not(#\9) {
+.awsui_open-calendar-button_145pa_1uq9r_134:not(#\9) {
   /* used in test-utils */
-}
-
-.awsui_calendar_145pa_hegy7_93:not(#\9) {
-  display: block;
-  width: 234px;
-  overflow: auto;
-  /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
-  border-collapse: separate;
-  border-spacing: 0;
-  caption-side: top;
-  cursor: auto;
-  direction: ltr;
-  empty-cells: show;
-  font-family: serif;
-  font-size: medium;
-  font-style: normal;
-  font-variant: normal;
-  font-weight: normal;
-  font-stretch: normal;
-  line-height: normal;
-  -webkit-hyphens: none;
-          hyphens: none;
-  letter-spacing: normal;
-  list-style: disc outside none;
-  tab-size: 8;
-  text-align: left;
-  text-align-last: auto;
-  text-indent: 0;
-  text-shadow: none;
-  text-transform: none;
-  visibility: visible;
-  white-space: normal;
-  widows: 2;
-  word-spacing: normal;
-  box-sizing: border-box;
-  font-size: var(--font-body-m-size-sregvd, 14px);
-  line-height: var(--font-body-m-line-height-i7xxvv, 22px);
-  color: var(--color-text-body-default-7m2b3r, #16191f);
-  font-weight: 400;
-  font-family: var(--font-family-base-mylvzb, "Noto Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
-}
-.awsui_calendar_145pa_hegy7_93:not(#\9):focus {
-  outline: none;
-}
-.awsui_calendar-inner_145pa_hegy7_165:not(#\9) {
-  margin: var(--space-xs-rsr2qu, 8px);
-}
-.awsui_calendar-header_145pa_hegy7_168:not(#\9) {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-.awsui_calendar-header-month_145pa_hegy7_173:not(#\9) {
-  font-size: var(--font-body-m-size-sregvd, 14px);
-  line-height: var(--font-body-m-line-height-i7xxvv, 22px);
-  font-weight: 700;
-  color: var(--color-text-dropdown-item-default-ki8ao1, #16191f);
-}
-.awsui_calendar-next-month-btn_145pa_hegy7_179:not(#\9) {
-  /* used for identifying element */
-}
-.awsui_calendar-prev-month-btn_145pa_hegy7_182:not(#\9) {
-  /* used for identifying element */
-}
-.awsui_calendar-day-names_145pa_hegy7_185:not(#\9) {
-  display: flex;
-  justify-content: stretch;
-}
-.awsui_calendar-day-name_145pa_hegy7_185:not(#\9) {
-  flex: 1 1 0%;
-  width: 0;
-  word-break: break-word;
-  text-align: center;
-  padding: var(--space-s-hv8c1d, 12px) 0 var(--space-xxs-ynfts5, 4px);
-  color: var(--color-text-calendar-month-cx7jxx, #545b64);
-  font-size: var(--font-body-s-size-ukw2p9, 12px);
-  line-height: var(--font-body-s-line-height-kdsbrl, 16px);
-  letter-spacing: var(--font-body-s-letter-spacing-p88gax, normal);
-}
-.awsui_calendar-dates_145pa_hegy7_200:not(#\9) {
-  border: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
-}
-.awsui_calendar-week_145pa_hegy7_203:not(#\9) {
-  display: flex;
-  justify-content: stretch;
-}
-.awsui_calendar-day_145pa_hegy7_185:not(#\9) {
-  flex: 1 1 0%;
-  width: 0;
-  word-break: break-word;
-  text-align: center;
-  border-bottom: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
-  border-right: 1px solid var(--color-border-calendar-grid-54zscx, #eaeded);
-  border-radius: var(--border-radius-item-wjpc1f, 0px);
-  padding: var(--space-xxs-ynfts5, 4px) 0;
-  color: var(--color-text-dropdown-item-disabled-dgi2f4, #aab7b8);
-  position: relative;
-}
-.awsui_calendar-day_145pa_hegy7_185:not(#\9):last-child {
-  border-right: none;
-}
-.awsui_calendar-day-in-last-week_145pa_hegy7_222:not(#\9) {
-  border-bottom: none;
-}
-.awsui_calendar-day-focusable_145pa_hegy7_225:not(#\9) {
-  /* used for identifying element */
-}
-.awsui_calendar-day-enabled_145pa_hegy7_228:not(#\9) {
-  cursor: pointer;
-  color: var(--color-text-dropdown-item-secondary-8hw5go, #687078);
-}
-.awsui_calendar-day-enabled_145pa_hegy7_228.awsui_calendar-day-current-month_145pa_hegy7_232:not(#\9) {
-  color: var(--color-text-dropdown-item-default-ki8ao1, #16191f);
-}
-.awsui_calendar-day-enabled_145pa_hegy7_228.awsui_calendar-day-current-month_145pa_hegy7_232:not(#\9):hover {
-  color: var(--color-text-calendar-day-hover-p7s945, #16191f);
-  background-color: var(--color-background-dropdown-item-hover-hgdj8r, #f2f3f3);
-}
-.awsui_calendar-day-enabled_145pa_hegy7_228.awsui_calendar-day-current-month_145pa_hegy7_232:not(#\9):hover:not(.awsui_calendar-day-selected_145pa_hegy7_239)::after {
-  border: var(--border-item-width-yvnixs, 1px) solid var(--color-border-dropdown-item-hover-d32f3f, #879596);
-  border-radius: var(--border-radius-item-wjpc1f, 0px);
-}
-.awsui_calendar-day-today_145pa_hegy7_243:not(#\9) {
-  background-color: var(--color-background-calendar-today-wm2baz, #f2f3f3);
-}
-.awsui_calendar-day_145pa_hegy7_185:not(#\9)::after {
-  content: "";
-  position: absolute;
-  top: -1px;
-  left: -1px;
-  bottom: -1px;
-  right: -1px;
-  background-color: transparent;
-}
-.awsui_calendar-day_145pa_hegy7_185 > .awsui_day-inner_145pa_hegy7_255:not(#\9) {
-  position: relative;
-  z-index: 1;
-}
-.awsui_calendar-day_145pa_hegy7_185:not(#\9):focus {
-  outline: none;
-  position: relative;
-}
-.awsui_calendar-day_145pa_hegy7_185:not(#\9):focus {
-  outline: 2px dotted transparent;
-  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px) - 1px);
-}
-.awsui_calendar-day_145pa_hegy7_185:not(#\9):focus::before {
-  content: " ";
-  display: block;
-  position: absolute;
-  left: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px));
-  top: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px));
-  width: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px));
-  height: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-lbmex4, 0px));
-  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_calendar-day_145pa_hegy7_185:not(#\9):focus::before {
-  z-index: 2;
-}
-.awsui_calendar-day-selected_145pa_hegy7_239:not(#\9) {
-  border-color: transparent;
-  position: relative;
-}
-.awsui_calendar-day-selected_145pa_hegy7_239:not(#\9)::after {
-  background-color: var(--color-background-dropdown-item-selected-w7iegd, #f1faff);
-  border: var(--border-item-width-yvnixs, 1px) solid var(--color-border-dropdown-item-selected-bzuxys, #00a1c9);
-  border-radius: var(--border-radius-item-wjpc1f, 0px);
-}
-.awsui_calendar-day-selected_145pa_hegy7_239 > .awsui_day-inner_145pa_hegy7_255:not(#\9) {
-  color: var(--color-text-calendar-day-selected-fr68ny, #16191f);
-  position: relative;
-}
-.awsui_calendar_145pa_hegy7_93[data-awsui-focus-visible=true]:not(#\9):focus {
-  outline: 2px dotted transparent;
-  outline-offset: 2px;
-  border-radius: var(--border-radius-dropdown-0c284d, 0px);
-  box-shadow: 0 0 0 2px var(--color-border-item-focused-n5kd8g, #0073bb);
 }

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

@@ -2,29 +2,12 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "calendar": "awsui_calendar_145pa_hegy7_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_145pa_hegy7_1",
-  "root": "awsui_root_145pa_hegy7_120",
-  "date-picker-container": "awsui_date-picker-container_145pa_hegy7_131",
-  "date-picker-trigger": "awsui_date-picker-trigger_145pa_hegy7_136",
-  "date-picker-input": "awsui_date-picker-input_145pa_hegy7_140",
-  "open-calendar-button": "awsui_open-calendar-button_145pa_hegy7_145",
-  "calendar-inner": "awsui_calendar-inner_145pa_hegy7_165",
-  "calendar-header": "awsui_calendar-header_145pa_hegy7_168",
-  "calendar-header-month": "awsui_calendar-header-month_145pa_hegy7_173",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_145pa_hegy7_179",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_145pa_hegy7_182",
-  "calendar-day-names": "awsui_calendar-day-names_145pa_hegy7_185",
-  "calendar-day-name": "awsui_calendar-day-name_145pa_hegy7_185",
-  "calendar-dates": "awsui_calendar-dates_145pa_hegy7_200",
-  "calendar-week": "awsui_calendar-week_145pa_hegy7_203",
-  "calendar-day": "awsui_calendar-day_145pa_hegy7_185",
-  "calendar-day-in-last-week": "awsui_calendar-day-in-last-week_145pa_hegy7_222",
-  "calendar-day-focusable": "awsui_calendar-day-focusable_145pa_hegy7_225",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_145pa_hegy7_228",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_145pa_hegy7_232",
-  "calendar-day-selected": "awsui_calendar-day-selected_145pa_hegy7_239",
-  "calendar-day-today": "awsui_calendar-day-today_145pa_hegy7_243",
-  "day-inner": "awsui_day-inner_145pa_hegy7_255"
+  "root": "awsui_root_145pa_1uq9r_93",
+  "calendar": "awsui_calendar_145pa_1uq9r_104",
+  "screenreader-only": "awsui_screenreader-only_145pa_1uq9r_114",
+  "date-picker-container": "awsui_date-picker-container_145pa_1uq9r_120",
+  "date-picker-trigger": "awsui_date-picker-trigger_145pa_1uq9r_125",
+  "date-picker-input": "awsui_date-picker-input_145pa_1uq9r_129",
+  "open-calendar-button": "awsui_open-calendar-button_145pa_1uq9r_134"
 };
   

package/lib/internal/template/date-range-picker/calendar/get-base-date.js

@@ -1,5 +1,5 @@
 import { startOfMonth, addDays } from 'date-fns';
-import moveFocusHandler from '../../date-picker/calendar/utils/move-focus-handler';
+import moveFocusHandler from '../../calendar/utils/move-focus-handler';
 export function getBaseDate(date, daysToMove, isDateEnabled) {
     var startDate = startOfMonth(date);
     if (isDateEnabled(startDate)) {

package/lib/internal/template/date-range-picker/calendar/get-base-date.js.map

@@ -1 +1 @@
-{"version":3,"file":"get-base-date.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/get-base-date.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,gBAAgB,MAAM,qDAAqD,CAAC;AAEnF,MAAM,UAAU,WAAW,CAAC,IAAU,EAAE,UAAkB,EAAE,aAAyD;IACnH,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,IAAI,aAAa,CAAC,SAAS,CAAC,EAAE;QAC5B,OAAO,SAAS,CAAC;KAClB;IACD,OAAO,gBAAgB,CAAC,SAAS,EAAE,aAAa,EAAE,UAAC,IAAU,IAAK,OAAA,OAAO,CAAC,IAAI,EAAE,UAAU,CAAC,EAAzB,CAAyB,CAAC,CAAC;AAC/F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DateRangePickerProps } from '../interfaces';\nimport { startOfMonth, addDays } from 'date-fns';\nimport moveFocusHandler from '../../date-picker/calendar/utils/move-focus-handler';\n\nexport function getBaseDate(date: Date, daysToMove: -1 | 1, isDateEnabled: DateRangePickerProps.IsDateEnabledFunction) {\n  const startDate = startOfMonth(date);\n  if (isDateEnabled(startDate)) {\n    return startDate;\n  }\n  return moveFocusHandler(startDate, isDateEnabled, (date: Date) => addDays(date, daysToMove));\n}\n"]}
+{"version":3,"file":"get-base-date.js","sourceRoot":"","sources":["../../../../src/date-range-picker/calendar/get-base-date.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACjD,OAAO,gBAAgB,MAAM,yCAAyC,CAAC;AAEvE,MAAM,UAAU,WAAW,CAAC,IAAU,EAAE,UAAkB,EAAE,aAAyD;IACnH,IAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,IAAI,aAAa,CAAC,SAAS,CAAC,EAAE;QAC5B,OAAO,SAAS,CAAC;KAClB;IACD,OAAO,gBAAgB,CAAC,SAAS,EAAE,aAAa,EAAE,UAAC,IAAU,IAAK,OAAA,OAAO,CAAC,IAAI,EAAE,UAAU,CAAC,EAAzB,CAAyB,CAAC,CAAC;AAC/F,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { DateRangePickerProps } from '../interfaces';\nimport { startOfMonth, addDays } from 'date-fns';\nimport moveFocusHandler from '../../calendar/utils/move-focus-handler';\n\nexport function getBaseDate(date: Date, daysToMove: -1 | 1, isDateEnabled: DateRangePickerProps.IsDateEnabledFunction) {\n  const startDate = startOfMonth(date);\n  if (isDateEnabled(startDate)) {\n    return startDate;\n  }\n  return moveFocusHandler(startDate, isDateEnabled, (date: Date) => addDays(date, daysToMove));\n}\n"]}

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

@@ -4,7 +4,7 @@ import { __assign } from "tslib";
 import React from 'react';
 import styles from './styles.css.js';
 import { getDaysInMonth, isAfter, isBefore, isLastDayOfMonth, isSameMonth, isToday as isTodayFn } from 'date-fns';
-import { getDateLabel } from '../../../../date-picker/calendar/utils/intl';
+import { getDateLabel } from '../../../../calendar/utils/intl';
 import clsx from 'clsx';
 import { KeyCode } from '../../../../internal/keycode.js';
 import useFocusVisible from '../../../../internal/hooks/focus-visible';

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/date-range-picker/calendar/grids/day/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 from 'react';\nimport styles from './styles.css.js';\nimport { DateRangePickerProps } from '../../../interfaces';\nimport { getDaysInMonth, isAfter, isBefore, isLastDayOfMonth, isSameMonth, isToday as isTodayFn } from 'date-fns';\nimport { getDateLabel } from '../../../../date-picker/calendar/utils/intl';\nimport clsx from 'clsx';\nimport { KeyCode } from '../../../../internal/keycode.js';\nimport useFocusVisible from '../../../../internal/hooks/focus-visible';\nimport { formatDate } from '../../../../internal/utils/date-time';\n\ninterface GridDayProps {\n  locale: string;\n  baseDate: Date;\n  date: Date;\n\n  isDateInFirstRow: boolean;\n  isDateInFirstColumn: boolean;\n  isDateInLastColumn: boolean;\n  isDateInSelectionStartWeek: boolean;\n  isDateInSelectionEndWeek: boolean;\n\n  isFocusedDate: boolean;\n  isDateEnabled?: DateRangePickerProps.IsDateEnabledFunction;\n  todayAriaLabel: string;\n  onSelectDate: (date: Date) => void;\n  onFocusDate: (date: Date) => void;\n  isInRange: boolean;\n  isSelected: boolean;\n\n  // these only exist for the test-utils\n  isStartDate: boolean;\n  isEndDate: boolean;\n  // used for refresh styles\n  onlyOneSelected: boolean;\n  isRangeStartDate: boolean;\n  isRangeEndDate: boolean;\n}\n\nfunction propsAreEqual(prevProps: GridDayProps, nextProps: GridDayProps): boolean {\n  return (\n    prevProps.locale === nextProps.locale &&\n    prevProps.baseDate.getTime() === nextProps.baseDate.getTime() &&\n    prevProps.date.getTime() === nextProps.date.getTime() &&\n    prevProps.isDateInFirstRow === nextProps.isDateInFirstRow &&\n    prevProps.isDateInFirstColumn === nextProps.isDateInFirstColumn &&\n    prevProps.isDateInLastColumn === nextProps.isDateInLastColumn &&\n    prevProps.isDateInSelectionStartWeek === nextProps.isDateInSelectionStartWeek &&\n    prevProps.isDateInSelectionEndWeek === nextProps.isDateInSelectionEndWeek &&\n    prevProps.isFocusedDate === nextProps.isFocusedDate &&\n    prevProps.isDateEnabled === nextProps.isDateEnabled &&\n    prevProps.todayAriaLabel === nextProps.todayAriaLabel &&\n    prevProps.onSelectDate === nextProps.onSelectDate &&\n    prevProps.onFocusDate === nextProps.onFocusDate &&\n    prevProps.isInRange === nextProps.isInRange &&\n    prevProps.isSelected === nextProps.isSelected &&\n    prevProps.isStartDate === nextProps.isStartDate &&\n    prevProps.isEndDate === nextProps.isEndDate &&\n    prevProps.onlyOneSelected === nextProps.onlyOneSelected &&\n    prevProps.isRangeStartDate === nextProps.isRangeStartDate &&\n    prevProps.isRangeEndDate === nextProps.isRangeEndDate\n  );\n}\n\nconst GridDay = React.memo(\n  React.forwardRef<HTMLDivElement, GridDayProps>(\n    (\n      {\n        locale,\n        baseDate,\n        date,\n        isSelected,\n        isStartDate,\n        isEndDate,\n        onlyOneSelected,\n        isRangeStartDate,\n        isRangeEndDate,\n        isFocusedDate,\n        isDateEnabled,\n        todayAriaLabel,\n        onSelectDate,\n        onFocusDate,\n        isDateInFirstRow,\n        isDateInFirstColumn,\n        isDateInLastColumn,\n        isDateInSelectionStartWeek,\n        isDateInSelectionEndWeek,\n        isInRange,\n      }: GridDayProps,\n      ref\n    ) => {\n      const dayLabel = getDateLabel(locale, date);\n\n      const labels = [dayLabel];\n\n      const isEnabled = !isDateEnabled || isDateEnabled(date);\n      const isFocusable = isFocusedDate && isEnabled;\n      const isToday = isTodayFn(date);\n      const computedAttributes: React.HTMLAttributes<HTMLDivElement> = {};\n\n      const focusVisible = useFocusVisible();\n\n      const baseClasses = {\n        [styles['in-first-row']]: isDateInFirstRow,\n        [styles['in-first-column']]: isDateInFirstColumn,\n      };\n\n      if (!isSameMonth(date, baseDate)) {\n        const classNames = clsx(styles.day, baseClasses, {\n          [styles['in-previous-month']]: isBefore(date, baseDate),\n          [styles['last-day-of-month']]: isLastDayOfMonth(date),\n          [styles['in-next-month']]: isAfter(date, baseDate),\n        });\n        return <div className={classNames} ref={ref}></div>;\n      }\n\n      const classNames = clsx(styles.day, baseClasses, {\n        [styles['in-current-month']]: isSameMonth(date, baseDate),\n        [styles.enabled]: isEnabled,\n        [styles.selected]: isSelected,\n        [styles['start-date']]: isStartDate,\n        [styles['end-date']]: isEndDate,\n        [styles['range-start-date']]: isRangeStartDate,\n        [styles['range-end-date']]: isRangeEndDate,\n        [styles['no-range']]: isSelected && onlyOneSelected,\n        [styles['in-range']]: isInRange,\n        [styles['in-range-border-top']]: isDateInSelectionStartWeek || date.getDate() <= 7,\n        [styles['in-range-border-bottom']]: isDateInSelectionEndWeek || date.getDate() > getDaysInMonth(date) - 7,\n        [styles['in-range-border-left']]: isDateInFirstColumn || date.getDate() === 1 || isRangeStartDate,\n        [styles['in-range-border-right']]: isDateInLastColumn || isLastDayOfMonth(date) || isRangeEndDate,\n        [styles.today]: isToday,\n      });\n\n      computedAttributes['aria-pressed'] = isSelected || isInRange;\n\n      if (isToday) {\n        labels.push(todayAriaLabel);\n        computedAttributes['aria-current'] = 'date';\n      }\n\n      if (isEnabled) {\n        computedAttributes.onClick = () => onSelectDate(date);\n        computedAttributes.onFocus = () => onFocusDate(date);\n        computedAttributes.tabIndex = -1;\n      }\n\n      if (isFocusable) {\n        computedAttributes.tabIndex = 0;\n      }\n\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.keyCode === KeyCode.space) {\n          event.preventDefault();\n          onSelectDate(date);\n        }\n      };\n\n      return (\n        <div\n          className={classNames}\n          aria-label={labels.join('. ')}\n          data-date={formatDate(date)}\n          role=\"button\"\n          {...computedAttributes}\n          ref={ref}\n          onKeyDown={onKeyDown}\n          {...focusVisible}\n        >\n          <span className={styles['day-inner']}>{date.getDate()}</span>\n        </div>\n      );\n    }\n  ),\n  propsAreEqual\n);\n\nexport default GridDay;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/date-range-picker/calendar/grids/day/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 from 'react';\nimport styles from './styles.css.js';\nimport { DateRangePickerProps } from '../../../interfaces';\nimport { getDaysInMonth, isAfter, isBefore, isLastDayOfMonth, isSameMonth, isToday as isTodayFn } from 'date-fns';\nimport { getDateLabel } from '../../../../calendar/utils/intl';\nimport clsx from 'clsx';\nimport { KeyCode } from '../../../../internal/keycode.js';\nimport useFocusVisible from '../../../../internal/hooks/focus-visible';\nimport { formatDate } from '../../../../internal/utils/date-time';\n\ninterface GridDayProps {\n  locale: string;\n  baseDate: Date;\n  date: Date;\n\n  isDateInFirstRow: boolean;\n  isDateInFirstColumn: boolean;\n  isDateInLastColumn: boolean;\n  isDateInSelectionStartWeek: boolean;\n  isDateInSelectionEndWeek: boolean;\n\n  isFocusedDate: boolean;\n  isDateEnabled?: DateRangePickerProps.IsDateEnabledFunction;\n  todayAriaLabel: string;\n  onSelectDate: (date: Date) => void;\n  onFocusDate: (date: Date) => void;\n  isInRange: boolean;\n  isSelected: boolean;\n\n  // these only exist for the test-utils\n  isStartDate: boolean;\n  isEndDate: boolean;\n  // used for refresh styles\n  onlyOneSelected: boolean;\n  isRangeStartDate: boolean;\n  isRangeEndDate: boolean;\n}\n\nfunction propsAreEqual(prevProps: GridDayProps, nextProps: GridDayProps): boolean {\n  return (\n    prevProps.locale === nextProps.locale &&\n    prevProps.baseDate.getTime() === nextProps.baseDate.getTime() &&\n    prevProps.date.getTime() === nextProps.date.getTime() &&\n    prevProps.isDateInFirstRow === nextProps.isDateInFirstRow &&\n    prevProps.isDateInFirstColumn === nextProps.isDateInFirstColumn &&\n    prevProps.isDateInLastColumn === nextProps.isDateInLastColumn &&\n    prevProps.isDateInSelectionStartWeek === nextProps.isDateInSelectionStartWeek &&\n    prevProps.isDateInSelectionEndWeek === nextProps.isDateInSelectionEndWeek &&\n    prevProps.isFocusedDate === nextProps.isFocusedDate &&\n    prevProps.isDateEnabled === nextProps.isDateEnabled &&\n    prevProps.todayAriaLabel === nextProps.todayAriaLabel &&\n    prevProps.onSelectDate === nextProps.onSelectDate &&\n    prevProps.onFocusDate === nextProps.onFocusDate &&\n    prevProps.isInRange === nextProps.isInRange &&\n    prevProps.isSelected === nextProps.isSelected &&\n    prevProps.isStartDate === nextProps.isStartDate &&\n    prevProps.isEndDate === nextProps.isEndDate &&\n    prevProps.onlyOneSelected === nextProps.onlyOneSelected &&\n    prevProps.isRangeStartDate === nextProps.isRangeStartDate &&\n    prevProps.isRangeEndDate === nextProps.isRangeEndDate\n  );\n}\n\nconst GridDay = React.memo(\n  React.forwardRef<HTMLDivElement, GridDayProps>(\n    (\n      {\n        locale,\n        baseDate,\n        date,\n        isSelected,\n        isStartDate,\n        isEndDate,\n        onlyOneSelected,\n        isRangeStartDate,\n        isRangeEndDate,\n        isFocusedDate,\n        isDateEnabled,\n        todayAriaLabel,\n        onSelectDate,\n        onFocusDate,\n        isDateInFirstRow,\n        isDateInFirstColumn,\n        isDateInLastColumn,\n        isDateInSelectionStartWeek,\n        isDateInSelectionEndWeek,\n        isInRange,\n      }: GridDayProps,\n      ref\n    ) => {\n      const dayLabel = getDateLabel(locale, date);\n\n      const labels = [dayLabel];\n\n      const isEnabled = !isDateEnabled || isDateEnabled(date);\n      const isFocusable = isFocusedDate && isEnabled;\n      const isToday = isTodayFn(date);\n      const computedAttributes: React.HTMLAttributes<HTMLDivElement> = {};\n\n      const focusVisible = useFocusVisible();\n\n      const baseClasses = {\n        [styles['in-first-row']]: isDateInFirstRow,\n        [styles['in-first-column']]: isDateInFirstColumn,\n      };\n\n      if (!isSameMonth(date, baseDate)) {\n        const classNames = clsx(styles.day, baseClasses, {\n          [styles['in-previous-month']]: isBefore(date, baseDate),\n          [styles['last-day-of-month']]: isLastDayOfMonth(date),\n          [styles['in-next-month']]: isAfter(date, baseDate),\n        });\n        return <div className={classNames} ref={ref}></div>;\n      }\n\n      const classNames = clsx(styles.day, baseClasses, {\n        [styles['in-current-month']]: isSameMonth(date, baseDate),\n        [styles.enabled]: isEnabled,\n        [styles.selected]: isSelected,\n        [styles['start-date']]: isStartDate,\n        [styles['end-date']]: isEndDate,\n        [styles['range-start-date']]: isRangeStartDate,\n        [styles['range-end-date']]: isRangeEndDate,\n        [styles['no-range']]: isSelected && onlyOneSelected,\n        [styles['in-range']]: isInRange,\n        [styles['in-range-border-top']]: isDateInSelectionStartWeek || date.getDate() <= 7,\n        [styles['in-range-border-bottom']]: isDateInSelectionEndWeek || date.getDate() > getDaysInMonth(date) - 7,\n        [styles['in-range-border-left']]: isDateInFirstColumn || date.getDate() === 1 || isRangeStartDate,\n        [styles['in-range-border-right']]: isDateInLastColumn || isLastDayOfMonth(date) || isRangeEndDate,\n        [styles.today]: isToday,\n      });\n\n      computedAttributes['aria-pressed'] = isSelected || isInRange;\n\n      if (isToday) {\n        labels.push(todayAriaLabel);\n        computedAttributes['aria-current'] = 'date';\n      }\n\n      if (isEnabled) {\n        computedAttributes.onClick = () => onSelectDate(date);\n        computedAttributes.onFocus = () => onFocusDate(date);\n        computedAttributes.tabIndex = -1;\n      }\n\n      if (isFocusable) {\n        computedAttributes.tabIndex = 0;\n      }\n\n      const onKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n        if (event.keyCode === KeyCode.space) {\n          event.preventDefault();\n          onSelectDate(date);\n        }\n      };\n\n      return (\n        <div\n          className={classNames}\n          aria-label={labels.join('. ')}\n          data-date={formatDate(date)}\n          role=\"button\"\n          {...computedAttributes}\n          ref={ref}\n          onKeyDown={onKeyDown}\n          {...focusVisible}\n        >\n          <span className={styles['day-inner']}>{date.getDate()}</span>\n        </div>\n      );\n    }\n  ),\n  propsAreEqual\n);\n\nexport default GridDay;\n"]}