@cloudscape-design/components 3.0.51 → 3.0.54

package/collection-preferences/styles.css.js

@@ -1,24 +1,24 @@
 
     import './styles.scoped.css';
     export default {
-  "visible-content": "awsui_visible-content_tc96w_d6ntf_185",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_d6ntf_186",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_d6ntf_187",
-  "visible-content-group": "awsui_visible-content-group_tc96w_d6ntf_187",
-  "visible-content-title": "awsui_visible-content-title_tc96w_d6ntf_192",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_d6ntf_200",
-  "visible-content-option": "awsui_visible-content-option_tc96w_d6ntf_206",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_d6ntf_217",
-  "root": "awsui_root_tc96w_d6ntf_225",
-  "modal-root": "awsui_modal-root_tc96w_d6ntf_226",
-  "trigger-button": "awsui_trigger-button_tc96w_d6ntf_227",
-  "cancel-button": "awsui_cancel-button_tc96w_d6ntf_228",
-  "confirm-button": "awsui_confirm-button_tc96w_d6ntf_229",
-  "custom": "awsui_custom_tc96w_d6ntf_230",
-  "second-column-small": "awsui_second-column-small_tc96w_d6ntf_234",
-  "wrap-lines": "awsui_wrap-lines_tc96w_d6ntf_238",
-  "page-size": "awsui_page-size_tc96w_d6ntf_239",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_d6ntf_240",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_d6ntf_241"
+  "visible-content": "awsui_visible-content_tc96w_1qp7a_185",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_1qp7a_186",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_1qp7a_187",
+  "visible-content-group": "awsui_visible-content-group_tc96w_1qp7a_187",
+  "visible-content-title": "awsui_visible-content-title_tc96w_1qp7a_192",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_1qp7a_200",
+  "visible-content-option": "awsui_visible-content-option_tc96w_1qp7a_206",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_1qp7a_217",
+  "root": "awsui_root_tc96w_1qp7a_224",
+  "modal-root": "awsui_modal-root_tc96w_1qp7a_225",
+  "trigger-button": "awsui_trigger-button_tc96w_1qp7a_226",
+  "cancel-button": "awsui_cancel-button_tc96w_1qp7a_227",
+  "confirm-button": "awsui_confirm-button_tc96w_1qp7a_228",
+  "custom": "awsui_custom_tc96w_1qp7a_229",
+  "second-column-small": "awsui_second-column-small_tc96w_1qp7a_233",
+  "wrap-lines": "awsui_wrap-lines_tc96w_1qp7a_237",
+  "page-size": "awsui_page-size_tc96w_1qp7a_238",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_1qp7a_239",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_1qp7a_240"
 };
   

package/collection-preferences/styles.scoped.css

@@ -182,14 +182,14 @@ 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_visible-content_tc96w_d6ntf_185:not(#\9),
-.awsui_visible-content-toggle_tc96w_d6ntf_186:not(#\9),
-.awsui_visible-content-groups_tc96w_d6ntf_187:not(#\9),
-.awsui_visible-content-group_tc96w_d6ntf_187:not(#\9) {
+.awsui_visible-content_tc96w_1qp7a_185:not(#\9),
+.awsui_visible-content-toggle_tc96w_1qp7a_186:not(#\9),
+.awsui_visible-content-groups_tc96w_1qp7a_187:not(#\9),
+.awsui_visible-content-group_tc96w_1qp7a_187:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_visible-content-title_tc96w_d6ntf_192:not(#\9) {
+.awsui_visible-content-title_tc96w_1qp7a_192:not(#\9) {
   font-size: var(--font-body-m-size-sregvd, 14px);
   line-height: var(--font-body-m-line-height-i7xxvv, 22px);
   font-weight: var(--font-display-label-weight-m18hjh, 700);
@@ -197,47 +197,46 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-bottom: var(--space-scaled-l-t03y3z, 20px);
 }
 
-.awsui_visible-content-group-label_tc96w_d6ntf_200:not(#\9) {
+.awsui_visible-content-group-label_tc96w_1qp7a_200:not(#\9) {
   color: var(--color-text-group-label-w9to2i, #414d5c);
   padding-bottom: var(--space-xs-rsr2qu, 8px);
   border-bottom: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
 }
 
-.awsui_visible-content-option_tc96w_d6ntf_206:not(#\9) {
+.awsui_visible-content-option_tc96w_1qp7a_206:not(#\9) {
   display: flex;
   flex-wrap: nowrap;
   justify-content: space-between;
   padding: var(--space-xs-rsr2qu, 8px) 0px var(--space-xs-rsr2qu, 8px) var(--space-scaled-l-t03y3z, 20px);
   border-bottom: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-7s2wjw, #e9ebed);
 }
-.awsui_visible-content-option_tc96w_d6ntf_206:not(#\9):last-child {
+.awsui_visible-content-option_tc96w_1qp7a_206:not(#\9):last-child {
   border-bottom: none;
 }
 
-.awsui_visible-content-option-label_tc96w_d6ntf_217:not(#\9) {
-  white-space: nowrap;
+.awsui_visible-content-option-label_tc96w_1qp7a_217:not(#\9) {
   overflow: hidden;
   text-overflow: ellipsis;
   padding-right: var(--space-l-4vl6xu, 20px);
   flex-grow: 1;
 }
 
-.awsui_root_tc96w_d6ntf_225:not(#\9),
-.awsui_modal-root_tc96w_d6ntf_226:not(#\9),
-.awsui_trigger-button_tc96w_d6ntf_227:not(#\9),
-.awsui_cancel-button_tc96w_d6ntf_228:not(#\9),
-.awsui_confirm-button_tc96w_d6ntf_229:not(#\9),
-.awsui_custom_tc96w_d6ntf_230:not(#\9) {
+.awsui_root_tc96w_1qp7a_224:not(#\9),
+.awsui_modal-root_tc96w_1qp7a_225:not(#\9),
+.awsui_trigger-button_tc96w_1qp7a_226:not(#\9),
+.awsui_cancel-button_tc96w_1qp7a_227:not(#\9),
+.awsui_confirm-button_tc96w_1qp7a_228:not(#\9),
+.awsui_custom_tc96w_1qp7a_229:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_second-column-small_tc96w_d6ntf_234:not(#\9) {
+.awsui_second-column-small_tc96w_1qp7a_233:not(#\9) {
   padding-top: calc(2 * var(--space-scaled-l-t03y3z, 20px));
 }
 
-.awsui_wrap-lines_tc96w_d6ntf_238:not(#\9),
-.awsui_page-size_tc96w_d6ntf_239:not(#\9),
-.awsui_page-size-form-field_tc96w_d6ntf_240:not(#\9),
-.awsui_page-size-radio-group_tc96w_d6ntf_241:not(#\9) {
+.awsui_wrap-lines_tc96w_1qp7a_237:not(#\9),
+.awsui_page-size_tc96w_1qp7a_238:not(#\9),
+.awsui_page-size-form-field_tc96w_1qp7a_239:not(#\9),
+.awsui_page-size-radio-group_tc96w_1qp7a_240:not(#\9) {
   /* used in test-utils */
 }

package/collection-preferences/styles.selectors.js

@@ -2,24 +2,24 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "visible-content": "awsui_visible-content_tc96w_d6ntf_185",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_d6ntf_186",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_d6ntf_187",
-  "visible-content-group": "awsui_visible-content-group_tc96w_d6ntf_187",
-  "visible-content-title": "awsui_visible-content-title_tc96w_d6ntf_192",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_d6ntf_200",
-  "visible-content-option": "awsui_visible-content-option_tc96w_d6ntf_206",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_d6ntf_217",
-  "root": "awsui_root_tc96w_d6ntf_225",
-  "modal-root": "awsui_modal-root_tc96w_d6ntf_226",
-  "trigger-button": "awsui_trigger-button_tc96w_d6ntf_227",
-  "cancel-button": "awsui_cancel-button_tc96w_d6ntf_228",
-  "confirm-button": "awsui_confirm-button_tc96w_d6ntf_229",
-  "custom": "awsui_custom_tc96w_d6ntf_230",
-  "second-column-small": "awsui_second-column-small_tc96w_d6ntf_234",
-  "wrap-lines": "awsui_wrap-lines_tc96w_d6ntf_238",
-  "page-size": "awsui_page-size_tc96w_d6ntf_239",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_d6ntf_240",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_d6ntf_241"
+  "visible-content": "awsui_visible-content_tc96w_1qp7a_185",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_1qp7a_186",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_1qp7a_187",
+  "visible-content-group": "awsui_visible-content-group_tc96w_1qp7a_187",
+  "visible-content-title": "awsui_visible-content-title_tc96w_1qp7a_192",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_1qp7a_200",
+  "visible-content-option": "awsui_visible-content-option_tc96w_1qp7a_206",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_1qp7a_217",
+  "root": "awsui_root_tc96w_1qp7a_224",
+  "modal-root": "awsui_modal-root_tc96w_1qp7a_225",
+  "trigger-button": "awsui_trigger-button_tc96w_1qp7a_226",
+  "cancel-button": "awsui_cancel-button_tc96w_1qp7a_227",
+  "confirm-button": "awsui_confirm-button_tc96w_1qp7a_228",
+  "custom": "awsui_custom_tc96w_1qp7a_229",
+  "second-column-small": "awsui_second-column-small_tc96w_1qp7a_233",
+  "wrap-lines": "awsui_wrap-lines_tc96w_1qp7a_237",
+  "page-size": "awsui_page-size_tc96w_1qp7a_238",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_1qp7a_239",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_1qp7a_240"
 };
   

package/{internal/components/date-input → date-input}/index.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
 import { DateInputProps } from './interfaces';
 export { DateInputProps };
-declare const DateInput: React.ForwardRefExoticComponent<DateInputProps & React.RefAttributes<DateInputProps.Ref>>;
+declare const DateInput: React.ForwardRefExoticComponent<DateInputProps & React.RefAttributes<HTMLInputElement>>;
 export default DateInput;
 //# sourceMappingURL=index.d.ts.map

package/date-input/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-input/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAc,MAAM,OAAO,CAAC;AAEnC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAK9C,OAAO,EAAE,cAAc,EAAE,CAAC;AAE1B,QAAA,MAAM,SAAS,yFAYd,CAAC;AAIF,eAAe,SAAS,CAAC"}

package/date-input/index.js

@@ -0,0 +1,15 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { __assign, __rest } from "tslib";
+import React from 'react';
+import { applyDisplayName } from '../internal/utils/apply-display-name';
+import useBaseComponent from '../internal/hooks/use-base-component';
+import InternalDateInput from './internal';
+var DateInput = React.forwardRef(function (_a, ref) {
+    var _b = _a.disableBrowserAutocorrect, disableBrowserAutocorrect = _b === void 0 ? true : _b, props = __rest(_a, ["disableBrowserAutocorrect"]);
+    var baseComponentProps = useBaseComponent('DateInput');
+    return (React.createElement(InternalDateInput, __assign({}, props, baseComponentProps, { disableBrowserAutocorrect: disableBrowserAutocorrect, ref: ref })));
+});
+applyDisplayName(DateInput, 'DateInput');
+export default DateInput;
+//# sourceMappingURL=index.js.map

package/date-input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/date-input/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,KAAc,MAAM,OAAO,CAAC;AAGnC,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,iBAAiB,MAAM,YAAY,CAAC;AAI3C,IAAM,SAAS,GAAG,KAAK,CAAC,UAAU,CAChC,UAAC,EAA8D,EAAE,GAA0B;IAAxF,IAAA,iCAAgC,EAAhC,yBAAyB,mBAAG,IAAI,KAAA,EAAK,KAAK,cAA5C,6BAA8C,CAAF;IAC3C,IAAM,kBAAkB,GAAG,gBAAgB,CAAC,WAAW,CAAC,CAAC;IACzD,OAAO,CACL,oBAAC,iBAAiB,eACZ,KAAK,EACL,kBAAkB,IACtB,yBAAyB,EAAE,yBAAyB,EACpD,GAAG,EAAE,GAAG,IACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAEzC,eAAe,SAAS,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport React, { Ref } from 'react';\n\nimport { DateInputProps } from './interfaces';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport InternalDateInput from './internal';\n\nexport { DateInputProps };\n\nconst DateInput = React.forwardRef(\n  ({ disableBrowserAutocorrect = true, ...props }: DateInputProps, ref: Ref<HTMLInputElement>) => {\n    const baseComponentProps = useBaseComponent('DateInput');\n    return (\n      <InternalDateInput\n        {...props}\n        {...baseComponentProps}\n        disableBrowserAutocorrect={disableBrowserAutocorrect}\n        ref={ref}\n      />\n    );\n  }\n);\n\napplyDisplayName(DateInput, 'DateInput');\n\nexport default DateInput;\n"]}

package/date-input/interfaces.d.ts

@@ -0,0 +1,9 @@
+import { BaseInputProps, InputProps } from '../input/interfaces';
+import { BaseComponentProps } from '../internal/base-component';
+import { FormFieldValidationControlProps } from '../internal/context/form-field-context';
+export interface DateInputProps extends BaseInputProps, FormFieldValidationControlProps, BaseComponentProps {
+}
+export declare namespace DateInputProps {
+    type Ref = InputProps.Ref;
+}
+//# sourceMappingURL=interfaces.d.ts.map

package/date-input/interfaces.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/date-input/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjE,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AAEzF,MAAM,WAAW,cAAe,SAAQ,cAAc,EAAE,+BAA+B,EAAE,kBAAkB;CAAG;AAE9G,yBAAiB,cAAc,CAAC;IAC9B,KAAY,GAAG,GAAG,UAAU,CAAC,GAAG,CAAC;CAClC"}

package/date-input/interfaces.js

@@ -0,0 +1,4 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+export {};
+//# sourceMappingURL=interfaces.js.map

package/date-input/interfaces.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/date-input/interfaces.ts"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport { BaseInputProps, InputProps } from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\n\nexport interface DateInputProps extends BaseInputProps, FormFieldValidationControlProps, BaseComponentProps {}\n\nexport namespace DateInputProps {\n  export type Ref = InputProps.Ref;\n}\n"]}

package/date-input/internal.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { DateInputProps } from './interfaces';
+import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
+declare const InternalDateInput: React.ForwardRefExoticComponent<DateInputProps & InternalBaseComponentProps & React.RefAttributes<HTMLInputElement>>;
+export default InternalDateInput;
+//# sourceMappingURL=internal.d.ts.map

package/date-input/internal.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/date-input/internal.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAc,MAAM,OAAO,CAAC;AAQnC,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAoBlF,QAAA,MAAM,iBAAiB,sHAqBtB,CAAC;AAEF,eAAe,iBAAiB,CAAC"}

package/date-input/internal.js

@@ -0,0 +1,30 @@
+// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+// SPDX-License-Identifier: Apache-2.0
+import { __assign, __rest } from "tslib";
+import clsx from 'clsx';
+import { getDaysInMonth } from 'date-fns';
+import React from 'react';
+import { fireNonCancelableEvent } from '../internal/events';
+import { displayToIso, isoToDisplay, parseDate } from '../internal/utils/date-time';
+import MaskedInput from '../internal/components/masked-input';
+import styles from './styles.css.js';
+function daysMax(value) {
+    // force to first day in month, as new Date('2018-02-30') -> March 2nd 2018
+    var baseDate = displayToIso(value).substring(0, 7);
+    return getDaysInMonth(parseDate(baseDate));
+}
+var maskArgs = {
+    separator: '/',
+    inputSeparators: ['-', '.', ' '],
+    segments: [
+        { min: 0, max: 9999, "default": 2000, length: 4 },
+        { min: 1, max: 12, length: 2 },
+        { min: 1, max: daysMax, length: 2 },
+    ]
+};
+var InternalDateInput = React.forwardRef(function (_a, ref) {
+    var value = _a.value, onChange = _a.onChange, _b = _a.disableBrowserAutocorrect, disableBrowserAutocorrect = _b === void 0 ? true : _b, _c = _a.__internalRootRef, __internalRootRef = _c === void 0 ? null : _c, props = __rest(_a, ["value", "onChange", "disableBrowserAutocorrect", "__internalRootRef"]);
+    return (React.createElement(MaskedInput, __assign({ ref: ref }, props, { value: isoToDisplay(value), onChange: function (event) { return fireNonCancelableEvent(onChange, { value: displayToIso(event.detail.value) }); }, className: clsx(styles.root, props.className), mask: maskArgs, autofix: true, autoComplete: false, disableAutocompleteOnBlur: false, disableBrowserAutocorrect: disableBrowserAutocorrect, __internalRootRef: __internalRootRef })));
+});
+export default InternalDateInput;
+//# sourceMappingURL=internal.js.map

package/date-input/internal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/date-input/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;;AAEtC,OAAO,IAAI,MAAM,MAAM,CAAC;AACxB,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,KAAc,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAC;AAEpF,OAAO,WAAW,MAAM,qCAAqC,CAAC;AAG9D,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAMrC,SAAS,OAAO,CAAC,KAAa;IAC5B,2EAA2E;IAC3E,IAAM,QAAQ,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IACrD,OAAO,cAAc,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,CAAC;AAC7C,CAAC;AAED,IAAM,QAAQ,GAAa;IACzB,SAAS,EAAE,GAAG;IACd,eAAe,EAAE,CAAC,GAAG,EAAE,GAAG,EAAE,GAAG,CAAC;IAChC,QAAQ,EAAE;QACR,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,IAAI,EAAE,SAAO,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE;QAC/C,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,MAAM,EAAE,CAAC,EAAE;QAC9B,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,MAAM,EAAE,CAAC,EAAE;KACpC;CACF,CAAC;AAEF,IAAM,iBAAiB,GAAG,KAAK,CAAC,UAAU,CACxC,UACE,EAAiH,EACjH,GAA0B;IADxB,IAAA,KAAK,WAAA,EAAE,QAAQ,cAAA,EAAE,iCAAgC,EAAhC,yBAAyB,mBAAG,IAAI,KAAA,EAAE,yBAAwB,EAAxB,iBAAiB,mBAAG,IAAI,KAAA,EAAK,KAAK,cAAvF,uEAAyF,CAAF;IAGvF,OAAO,CACL,oBAAC,WAAW,aACV,GAAG,EAAE,GAAG,IACJ,KAAK,IACT,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,EAC1B,QAAQ,EAAE,UAAA,KAAK,IAAI,OAAA,sBAAsB,CAAC,QAAQ,EAAE,EAAE,KAAK,EAAE,YAAY,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,EAA7E,CAA6E,EAChG,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC,EAC7C,IAAI,EAAE,QAAQ,EACd,OAAO,EAAE,IAAI,EACb,YAAY,EAAE,KAAK,EACnB,yBAAyB,EAAE,KAAK,EAChC,yBAAyB,EAAE,yBAAyB,EACpD,iBAAiB,EAAE,iBAAiB,IACpC,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,iBAAiB,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n\nimport clsx from 'clsx';\nimport { getDaysInMonth } from 'date-fns';\nimport React, { Ref } from 'react';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { displayToIso, isoToDisplay, parseDate } from '../internal/utils/date-time';\n\nimport MaskedInput from '../internal/components/masked-input';\nimport { MaskArgs } from '../internal/components/masked-input/utils/mask-format';\n\nimport styles from './styles.css.js';\nimport { DateInputProps } from './interfaces';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\n\ntype InternalDateInputProps = DateInputProps & InternalBaseComponentProps;\n\nfunction daysMax(value: string): number {\n  // force to first day in month, as new Date('2018-02-30') -> March 2nd 2018\n  const baseDate = displayToIso(value).substring(0, 7);\n  return getDaysInMonth(parseDate(baseDate));\n}\n\nconst maskArgs: MaskArgs = {\n  separator: '/',\n  inputSeparators: ['-', '.', ' '],\n  segments: [\n    { min: 0, max: 9999, default: 2000, length: 4 },\n    { min: 1, max: 12, length: 2 },\n    { min: 1, max: daysMax, length: 2 },\n  ],\n};\n\nconst InternalDateInput = React.forwardRef(\n  (\n    { value, onChange, disableBrowserAutocorrect = true, __internalRootRef = null, ...props }: InternalDateInputProps,\n    ref: Ref<HTMLInputElement>\n  ) => {\n    return (\n      <MaskedInput\n        ref={ref}\n        {...props}\n        value={isoToDisplay(value)}\n        onChange={event => fireNonCancelableEvent(onChange, { value: displayToIso(event.detail.value) })}\n        className={clsx(styles.root, props.className)}\n        mask={maskArgs}\n        autofix={true}\n        autoComplete={false}\n        disableAutocompleteOnBlur={false}\n        disableBrowserAutocorrect={disableBrowserAutocorrect}\n        __internalRootRef={__internalRootRef}\n      />\n    );\n  }\n);\n\nexport default InternalDateInput;\n"]}

package/date-input/styles.css.js

@@ -0,0 +1,6 @@
+
+    import './styles.scoped.css';
+    export default {
+  "root": "awsui_root_yodkx_im8v7_5"
+};
+  

package/date-input/styles.scoped.css

@@ -0,0 +1,7 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+.awsui_root_yodkx_im8v7_5:not(#\9) {
+  /* used in test-utils */
+}

package/date-input/styles.selectors.js

@@ -0,0 +1,7 @@
+
+    // es-module interop with Babel and Typescript
+    Object.defineProperty(exports, "__esModule", { value: true });
+    module.exports.default = {
+  "root": "awsui_root_yodkx_im8v7_5"
+};
+  

package/date-picker/calendar/grid/index.d.ts

@@ -1,23 +1,19 @@
-import { DateChangeHandler, DayIndex, MonthChangeHandler } from '../index';
+import { DayIndex } from '../index';
 import { MoveFocusHandler } from '../utils/move-focus-handler';
-import { CalendarTypes } from '../definitions';
 import { DatePickerProps } from '../../interfaces';
 export interface GridProps {
     locale: string;
     baseDate: Date;
     isDateEnabled: DatePickerProps.IsDateEnabledFunction;
     focusedDate: Date | null;
-    onSelectDate: DateChangeHandler;
-    onFocusDate: DateChangeHandlerNullable;
-    onChangeMonth: MonthChangeHandler;
+    onSelectDate: (date: Date) => void;
+    onFocusDate: (date: null | Date) => void;
+    onChangeMonth: (date: Date) => void;
     startOfWeek: DayIndex;
     todayAriaLabel: string;
     selectedDate: Date | null;
     handleFocusMove: MoveFocusHandler;
 }
-export interface DateChangeHandlerNullable {
-    (detail: CalendarTypes.DateDetailNullable): void;
-}
 declare const Grid: ({ locale, baseDate, isDateEnabled, focusedDate, onSelectDate, onFocusDate, onChangeMonth, startOfWeek, todayAriaLabel, selectedDate, handleFocusMove, }: GridProps) => JSX.Element;
 export default Grid;
 //# sourceMappingURL=index.d.ts.map

package/date-picker/calendar/grid/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-picker/calendar/grid/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,iBAAiB,EAAE,QAAQ,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAC;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAInD,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,YAAY,EAAE,iBAAiB,CAAC;IAChC,WAAW,EAAE,yBAAyB,CAAC;IACvC,aAAa,EAAE,kBAAkB,CAAC;IAClC,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,eAAe,EAAE,gBAAgB,CAAC;CACnC;AAED,MAAM,WAAW,yBAAyB;IACxC,CAAC,MAAM,EAAE,aAAa,CAAC,kBAAkB,GAAG,IAAI,CAAC;CAClD;AAED,QAAA,MAAM,IAAI,4JAYP,SAAS,gBAsFX,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/date-picker/calendar/grid/index.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACpC,OAAO,EAAE,gBAAgB,EAAE,MAAM,6BAA6B,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAInD,MAAM,WAAW,SAAS;IACxB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,EAAE,IAAI,CAAC;IACf,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,WAAW,EAAE,IAAI,GAAG,IAAI,CAAC;IACzB,YAAY,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACnC,WAAW,EAAE,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,aAAa,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAC;IACpC,WAAW,EAAE,QAAQ,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,eAAe,EAAE,gBAAgB,CAAC;CACnC;AAED,QAAA,MAAM,IAAI,4JAYP,SAAS,gBAoFX,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/date-picker/calendar/grid/index.js

@@ -19,8 +19,8 @@ var Grid = function (_a) {
             case KeyCode.enter:
                 event.preventDefault();
                 if (focusedDate) {
-                    onFocusDate({ date: null });
-                    onSelectDate({ date: focusedDate });
+                    onFocusDate(null);
+                    onSelectDate(focusedDate);
                 }
                 return;
             case KeyCode.right:
@@ -45,7 +45,7 @@ var Grid = function (_a) {
         if (!isSameMonth(updatedFocusDate, baseDate)) {
             onChangeMonth(updatedFocusDate);
         }
-        onFocusDate({ date: updatedFocusDate });
+        onFocusDate(updatedFocusDate);
     };
     var weeks = useMemo(function () { return getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }); }, [baseDate, startOfWeek]);
     return (React.createElement("div", null,
@@ -53,9 +53,7 @@ var Grid = function (_a) {
         React.createElement("div", { className: styles['calendar-dates'], onKeyDown: onGridKeyDownHandler }, weeks.map(function (week, weekIndex) {
             var isDateInLastWeek = weeks.length - 1 === weekIndex;
             return (React.createElement("div", { key: "week-".concat(weekIndex), className: styles['calendar-week'] }, week.map(function (date, dateIndex) {
-                return (React.createElement(GridDay, { key: "date-".concat(weekIndex, "-").concat(dateIndex), locale: locale, baseDate: baseDate, selectedDate: selectedDate, date: date, focusedDate: focusedDate, todayAriaLabel: todayAriaLabel, onSelectDate: function (date) {
-                        onSelectDate({ date: date });
-                    }, isDateEnabled: isDateEnabled, isDateInLastWeek: isDateInLastWeek }));
+                return (React.createElement(GridDay, { key: "date-".concat(weekIndex, "-").concat(dateIndex), locale: locale, baseDate: baseDate, selectedDate: selectedDate, date: date, focusedDate: focusedDate, todayAriaLabel: todayAriaLabel, onSelectDate: function (date) { return onSelectDate(date); }, isDateEnabled: isDateEnabled, isDateInLastWeek: isDateInLastWeek }));
             })));
         }))));
 };

package/date-picker/calendar/grid/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/date-picker/calendar/grid/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, { useMemo } from 'react';\nimport styles from '../../styles.css.js';\nimport GridDay from './day';\nimport { KeyCode } from '../../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DateChangeHandler, DayIndex, MonthChangeHandler } from '../index';\nimport { MoveFocusHandler } from '../utils/move-focus-handler';\nimport { CalendarTypes } from '../definitions';\nimport { DatePickerProps } from '../../interfaces';\nimport rotateDayIndexes from '../utils/rotate-day-indexes';\nimport { renderDayName } from '../utils/intl';\n\nexport interface GridProps {\n  locale: string;\n  baseDate: Date;\n  isDateEnabled: DatePickerProps.IsDateEnabledFunction;\n  focusedDate: Date | null;\n  onSelectDate: DateChangeHandler;\n  onFocusDate: DateChangeHandlerNullable;\n  onChangeMonth: MonthChangeHandler;\n  startOfWeek: DayIndex;\n  todayAriaLabel: string;\n  selectedDate: Date | null;\n  handleFocusMove: MoveFocusHandler;\n}\n\nexport interface DateChangeHandlerNullable {\n  (detail: CalendarTypes.DateDetailNullable): void;\n}\n\nconst Grid = ({\n  locale,\n  baseDate,\n  isDateEnabled,\n  focusedDate,\n  onSelectDate,\n  onFocusDate,\n  onChangeMonth,\n  startOfWeek,\n  todayAriaLabel,\n  selectedDate,\n  handleFocusMove,\n}: GridProps) => {\n  const onGridKeyDownHandler = (event: React.KeyboardEvent) => {\n    let updatedFocusDate;\n\n    if (focusedDate === null) {\n      return;\n    }\n\n    switch (event.keyCode) {\n      case KeyCode.enter:\n        event.preventDefault();\n        if (focusedDate) {\n          onFocusDate({ date: null });\n          onSelectDate({ date: focusedDate });\n        }\n        return;\n      case KeyCode.right:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n        break;\n      case KeyCode.left:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n        break;\n      case KeyCode.up:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n        break;\n      case KeyCode.down:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n        break;\n      default:\n        return;\n    }\n\n    if (!isSameMonth(updatedFocusDate, baseDate)) {\n      onChangeMonth(updatedFocusDate);\n    }\n    onFocusDate({ date: updatedFocusDate });\n  };\n\n  const weeks = useMemo<Date[][]>(\n    () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n    [baseDate, startOfWeek]\n  );\n\n  return (\n    <div>\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          const isDateInLastWeek = weeks.length - 1 === weekIndex;\n\n          return (\n            <div key={`week-${weekIndex}`} className={styles['calendar-week']}>\n              {week.map((date, dateIndex) => {\n                return (\n                  <GridDay\n                    key={`date-${weekIndex}-${dateIndex}`}\n                    locale={locale}\n                    baseDate={baseDate}\n                    selectedDate={selectedDate}\n                    date={date}\n                    focusedDate={focusedDate}\n                    todayAriaLabel={todayAriaLabel}\n                    onSelectDate={date => {\n                      onSelectDate({ date });\n                    }}\n                    isDateEnabled={isDateEnabled}\n                    isDateInLastWeek={isDateInLastWeek}\n                  />\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default Grid;\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../src/date-picker/calendar/grid/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, { useMemo } from 'react';\nimport styles from '../../styles.css.js';\nimport GridDay from './day';\nimport { KeyCode } from '../../../internal/keycode';\nimport { addDays, addWeeks, isSameMonth } from 'date-fns';\nimport { getCalendarMonth } from 'mnth';\nimport { DayIndex } from '../index';\nimport { MoveFocusHandler } from '../utils/move-focus-handler';\nimport { DatePickerProps } from '../../interfaces';\nimport rotateDayIndexes from '../utils/rotate-day-indexes';\nimport { renderDayName } from '../utils/intl';\n\nexport interface GridProps {\n  locale: string;\n  baseDate: Date;\n  isDateEnabled: DatePickerProps.IsDateEnabledFunction;\n  focusedDate: Date | null;\n  onSelectDate: (date: Date) => void;\n  onFocusDate: (date: null | Date) => void;\n  onChangeMonth: (date: Date) => void;\n  startOfWeek: DayIndex;\n  todayAriaLabel: string;\n  selectedDate: Date | null;\n  handleFocusMove: MoveFocusHandler;\n}\n\nconst Grid = ({\n  locale,\n  baseDate,\n  isDateEnabled,\n  focusedDate,\n  onSelectDate,\n  onFocusDate,\n  onChangeMonth,\n  startOfWeek,\n  todayAriaLabel,\n  selectedDate,\n  handleFocusMove,\n}: GridProps) => {\n  const onGridKeyDownHandler = (event: React.KeyboardEvent) => {\n    let updatedFocusDate;\n\n    if (focusedDate === null) {\n      return;\n    }\n\n    switch (event.keyCode) {\n      case KeyCode.enter:\n        event.preventDefault();\n        if (focusedDate) {\n          onFocusDate(null);\n          onSelectDate(focusedDate);\n        }\n        return;\n      case KeyCode.right:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, 1));\n        break;\n      case KeyCode.left:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addDays(date, -1));\n        break;\n      case KeyCode.up:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, -1));\n        break;\n      case KeyCode.down:\n        event.preventDefault();\n        updatedFocusDate = handleFocusMove(focusedDate, isDateEnabled, date => addWeeks(date, 1));\n        break;\n      default:\n        return;\n    }\n\n    if (!isSameMonth(updatedFocusDate, baseDate)) {\n      onChangeMonth(updatedFocusDate);\n    }\n    onFocusDate(updatedFocusDate);\n  };\n\n  const weeks = useMemo<Date[][]>(\n    () => getCalendarMonth(baseDate, { firstDayOfWeek: startOfWeek }),\n    [baseDate, startOfWeek]\n  );\n\n  return (\n    <div>\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          const isDateInLastWeek = weeks.length - 1 === weekIndex;\n\n          return (\n            <div key={`week-${weekIndex}`} className={styles['calendar-week']}>\n              {week.map((date, dateIndex) => {\n                return (\n                  <GridDay\n                    key={`date-${weekIndex}-${dateIndex}`}\n                    locale={locale}\n                    baseDate={baseDate}\n                    selectedDate={selectedDate}\n                    date={date}\n                    focusedDate={focusedDate}\n                    todayAriaLabel={todayAriaLabel}\n                    onSelectDate={date => onSelectDate(date)}\n                    isDateEnabled={isDateEnabled}\n                    isDateInLastWeek={isDateInLastWeek}\n                  />\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\n\nexport default Grid;\n"]}

package/date-picker/calendar/index.d.ts

@@ -1,25 +1,17 @@
 import { BaseComponentProps } from '../../internal/base-component';
-import { DatePickerProps } from '../interfaces';
-import { CalendarTypes } from './definitions';
-export interface DateChangeHandler {
-    (detail: CalendarTypes.DateDetail): void;
-}
-export interface MonthChangeHandler {
-    (newMonth: Date): void;
-}
+import { NonCancelableEventHandler } from '../../internal/events/index.js';
+import { DatePickerProps } from '../interfaces.js';
 export declare type DayIndex = 0 | 1 | 2 | 3 | 4 | 5 | 6;
 interface CalendarProps extends BaseComponentProps {
-    locale: string;
-    startOfWeek: number | undefined;
-    selectedDate: Date | null;
-    displayedDate: Date;
-    isDateEnabled: DatePickerProps.IsDateEnabledFunction;
-    nextMonthLabel: string;
-    previousMonthLabel: string;
+    value: string;
+    onChange?: NonCancelableEventHandler<DatePickerProps.ChangeDetail>;
+    locale?: string;
+    startOfWeek?: number;
+    isDateEnabled?: (date: Date) => boolean;
     todayAriaLabel: string;
-    onChangeMonth: MonthChangeHandler;
-    onSelectDate: DateChangeHandler;
+    nextMonthAriaLabel: string;
+    previousMonthAriaLabel: string;
 }
-declare const Calendar: ({ locale, startOfWeek, displayedDate, todayAriaLabel, selectedDate, isDateEnabled, onChangeMonth, onSelectDate, previousMonthLabel, nextMonthLabel, }: CalendarProps) => JSX.Element;
-export default Calendar;
+export default function Calendar({ value, locale, startOfWeek, isDateEnabled, todayAriaLabel, nextMonthAriaLabel, previousMonthAriaLabel, onChange, }: CalendarProps): JSX.Element;
+export {};
 //# sourceMappingURL=index.d.ts.map

package/date-picker/calendar/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/calendar/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAEnE,OAAO,EAAE,eAAe,EAAE,MAAM,eAAe,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAS9C,MAAM,WAAW,iBAAiB;IAChC,CAAC,MAAM,EAAE,aAAa,CAAC,UAAU,GAAG,IAAI,CAAC;CAC1C;AAED,MAAM,WAAW,kBAAkB;IACjC,CAAC,QAAQ,EAAE,IAAI,GAAG,IAAI,CAAC;CACxB;AAED,oBAAY,QAAQ,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAMjD,UAAU,aAAc,SAAQ,kBAAkB;IAChD,MAAM,EAAE,MAAM,CAAC;IACf,WAAW,EAAE,MAAM,GAAG,SAAS,CAAC;IAChC,YAAY,EAAE,IAAI,GAAG,IAAI,CAAC;IAC1B,aAAa,EAAE,IAAI,CAAC;IACpB,aAAa,EAAE,eAAe,CAAC,qBAAqB,CAAC;IACrD,cAAc,EAAE,MAAM,CAAC;IACvB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,cAAc,EAAE,MAAM,CAAC;IAEvB,aAAa,EAAE,kBAAkB,CAAC;IAClC,YAAY,EAAE,iBAAiB,CAAC;CACjC;AAED,QAAA,MAAM,QAAQ,0JAWX,aAAa,gBA+Gf,CAAC;AAEF,eAAe,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/date-picker/calendar/index.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAUnE,OAAO,EAA0B,yBAAyB,EAAE,MAAM,gCAAgC,CAAC;AACnG,OAAO,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAGnD,oBAAY,QAAQ,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;AAEjD,UAAU,aAAc,SAAQ,kBAAkB;IAChD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,yBAAyB,CAAC,eAAe,CAAC,YAAY,CAAC,CAAC;IACnE,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO,CAAC;IACxC,cAAc,EAAE,MAAM,CAAC;IACvB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,sBAAsB,EAAE,MAAM,CAAC;CAChC;AAED,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAC/B,KAAK,EACL,MAAW,EACX,WAAW,EACX,aAA0B,EAC1B,cAAc,EACd,kBAAkB,EAClB,sBAAsB,EACtB,QAAQ,GACT,EAAE,aAAa,eA4Hf"}

package/date-picker/calendar/index.js

@@ -1,7 +1,7 @@
 import { __assign } from "tslib";
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React, { useRef, useState } from 'react';
+import React, { useEffect, useRef, useState } from 'react';
 import { addDays, addMonths, getDaysInMonth, isSameMonth, startOfMonth } from 'date-fns';
 import styles from '../styles.css.js';
 import useFocusVisible from '../../internal/hooks/focus-visible/index.js';
@@ -11,16 +11,28 @@ import moveFocusHandler from './utils/move-focus-handler';
 import { useUniqueId } from '../../internal/hooks/use-unique-id/index.js';
 import { memoizedDate } from './utils/memoized-date.js';
 import { useEffectOnUpdate } from '../../internal/hooks/use-effect-on-update.js';
-import { normalizeStartOfWeek } from './utils/locales.js';
+import { normalizeLocale, normalizeStartOfWeek } from './utils/locales.js';
 import { formatDate } from '../../internal/utils/date-time';
-var Calendar = function (_a) {
-    var locale = _a.locale, startOfWeek = _a.startOfWeek, displayedDate = _a.displayedDate, todayAriaLabel = _a.todayAriaLabel, selectedDate = _a.selectedDate, isDateEnabled = _a.isDateEnabled, onChangeMonth = _a.onChangeMonth, onSelectDate = _a.onSelectDate, previousMonthLabel = _a.previousMonthLabel, nextMonthLabel = _a.nextMonthLabel;
+import { fireNonCancelableEvent } from '../../internal/events/index.js';
+import checkControlled from '../../internal/hooks/check-controlled/index.js';
+export default function Calendar(_a) {
+    var value = _a.value, _b = _a.locale, locale = _b === void 0 ? '' : _b, startOfWeek = _a.startOfWeek, _c = _a.isDateEnabled, isDateEnabled = _c === void 0 ? function () { return true; } : _c, todayAriaLabel = _a.todayAriaLabel, nextMonthAriaLabel = _a.nextMonthAriaLabel, previousMonthAriaLabel = _a.previousMonthAriaLabel, onChange = _a.onChange;
+    checkControlled('Calendar', 'value', value, 'onChange', onChange);
+    var normalizedLocale = normalizeLocale('Calendar', locale);
     var normalizedStartOfWeek = normalizeStartOfWeek(startOfWeek, locale);
     var focusVisible = useFocusVisible();
     var headerId = useUniqueId('calendar-dialog-title-');
     var elementRef = useRef(null);
     var gridWrapperRef = useRef(null);
-    var _b = useState(null), focusedDate = _b[0], setFocusedDate = _b[1];
+    var _d = useState(null), focusedDate = _d[0], setFocusedDate = _d[1];
+    // Set displayed date to value if defined or to current date otherwise.
+    var memoizedValue = memoizedDate('value', value);
+    var defaultDisplayedDate = memoizedValue !== null && memoizedValue !== void 0 ? memoizedValue : new Date();
+    var _e = useState(defaultDisplayedDate), displayedDate = _e[0], setDisplayedDate = _e[1];
+    // Update displayed date if value changes.
+    useEffect(function () {
+        memoizedValue && setDisplayedDate(function (prev) { return (prev.getTime() !== memoizedValue.getTime() ? memoizedValue : prev); });
+    }, [memoizedValue]);
     var selectFocusedDate = function (selected, baseDate) {
         if (selected && isDateEnabled(selected) && isSameMonth(selected, baseDate)) {
             return selected;
@@ -47,24 +59,23 @@ var Calendar = function (_a) {
         return startDate;
     };
     var baseDate = getBaseDate(displayedDate);
-    var focusedOrSelectedDate = focusedDate || selectFocusedDate(selectedDate, baseDate);
-    var onHeaderChangeMonthHandler = function (isPrevious) {
-        onChangeMonth(addMonths(baseDate, isPrevious ? -1 : 1));
+    var focusedOrSelectedDate = focusedDate || selectFocusedDate(memoizedValue, baseDate);
+    var onHeaderChangeMonthHandler = function (isPreviousButtonClick) {
+        setDisplayedDate(addMonths(baseDate, isPreviousButtonClick ? -1 : 1));
         setFocusedDate(null);
     };
     var onGridChangeMonthHandler = function (newMonth) {
-        onChangeMonth(newMonth);
+        setDisplayedDate(newMonth);
         setFocusedDate(null);
     };
-    var onGridFocusDateHandler = function (_a) {
-        var date = _a.date;
+    var onGridFocusDateHandler = function (date) {
         if (date) {
-            var value = memoizedDate('focused', formatDate(date));
-            setFocusedDate(value);
+            var value_1 = memoizedDate('focused', formatDate(date));
+            setFocusedDate(value_1);
         }
     };
-    var onGridSelectDateHandler = function (detail) {
-        onSelectDate(detail);
+    var onGridSelectDateHandler = function (date) {
+        fireNonCancelableEvent(onChange, { value: formatDate(date) });
         setFocusedDate(null);
     };
     // The focused date changes as a feedback to keyboard navigation in the grid.
@@ -84,9 +95,8 @@ var Calendar = function (_a) {
     };
     return (React.createElement("div", __assign({}, focusVisible, { className: styles.calendar, tabIndex: 0, role: "application", "aria-describedby": headerId, ref: elementRef }),
         React.createElement("div", { className: styles['calendar-inner'] },
-            React.createElement(CalendarHeader, { headerId: headerId, baseDate: baseDate, locale: locale, onChangeMonth: onHeaderChangeMonthHandler, previousMonthLabel: previousMonthLabel, nextMonthLabel: nextMonthLabel }),
+            React.createElement(CalendarHeader, { headerId: headerId, baseDate: baseDate, locale: normalizedLocale, onChangeMonth: onHeaderChangeMonthHandler, previousMonthLabel: previousMonthAriaLabel, nextMonthLabel: nextMonthAriaLabel }),
             React.createElement("div", { onBlur: onGridBlur, ref: gridWrapperRef },
-                React.createElement(Grid, { locale: locale, baseDate: baseDate, isDateEnabled: isDateEnabled, focusedDate: focusedOrSelectedDate, onSelectDate: onGridSelectDateHandler, onFocusDate: onGridFocusDateHandler, onChangeMonth: onGridChangeMonthHandler, startOfWeek: normalizedStartOfWeek, todayAriaLabel: todayAriaLabel, selectedDate: selectedDate, handleFocusMove: moveFocusHandler })))));
-};
-export default Calendar;
+                React.createElement(Grid, { locale: normalizedLocale, baseDate: baseDate, isDateEnabled: isDateEnabled, focusedDate: focusedOrSelectedDate, onSelectDate: onGridSelectDateHandler, onFocusDate: onGridFocusDateHandler, onChangeMonth: onGridChangeMonthHandler, startOfWeek: normalizedStartOfWeek, todayAriaLabel: todayAriaLabel, selectedDate: memoizedValue, handleFocusMove: moveFocusHandler })))));
+}
 //# sourceMappingURL=index.js.map