@cloudscape-design/components-themeable 3.0.52 → 3.0.55

package/lib/internal/scss/collection-preferences/visible-content.scss

@@ -38,7 +38,6 @@ $border: awsui.$border-divider-list-width solid awsui.$color-border-divider-defa
 }
 
 .visible-content-option-label {
-  white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   padding-right: awsui.$space-l;

package/lib/internal/scss/date-input/styles.scss

@@ -0,0 +1,8 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+
+.root {
+  /* used in test-utils */
+}

package/lib/internal/scss/property-filter/styles.scss

@@ -43,23 +43,52 @@
   display: flex;
   flex-direction: column;
   justify-content: space-between;
-  &-line {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
+  &-form {
+    display: grid;
+    grid-template-columns: max-content minmax(awsui.$space-xl, 1fr) minmax(200px, min-content);
+    grid-row-gap: awsui.$space-scaled-l;
+    margin-bottom: awsui.$space-scaled-l;
   }
   &-label {
-    @include styles.text-flex-wrapping;
+    max-width: 200px;
+    align-self: center;
+    &-text {
+      @include styles.text-flex-wrapping;
+    }
+  }
+  &-label-property {
+    grid-row: 1;
+    grid-column: 1;
+  }
+  &-label-operator {
+    grid-row: 2;
+    grid-column: 1;
+  }
+  &-label-value {
+    grid-row: 3;
+    grid-column: 1;
+  }
+  &-field-property {
+    grid-row: 1;
+    grid-column: 3;
+  }
+  &-field-operator {
+    grid-row: 2;
+    grid-column: 3;
   }
-  &-field {
-    width: 200px;
-    flex-shrink: 0;
-    margin-left: awsui.$space-xl;
+  &-field-value {
+    grid-row: 3;
+    grid-column: 3;
   }
   &-actions {
     display: flex;
     justify-content: flex-end;
-    margin-top: awsui.$space-scaled-xl;
+    padding-top: awsui.$space-s;
+    border-top: 1px solid #{awsui.$color-border-dropdown-item-default};
+    // The below code cancels horizontal padding of the popover and horizontal margin of the token-editor.
+    padding-right: calc(#{awsui.$space-m} + #{awsui.$space-xxs});
+    margin-left: calc(-1 * #{awsui.$space-m} + -1 * #{awsui.$space-xxs});
+    margin-right: calc(-1 * #{awsui.$space-m} + -1 * #{awsui.$space-xxs});
   }
   &-commit {
     margin-left: awsui.$space-xs;
@@ -107,9 +136,6 @@
 .remove-all,
 .token-label,
 .join-operation,
-.property-selector,
-.operator-selector,
-.value-selector,
 .token-editor-submit {
   /* used in test-utils */
 }

package/lib/internal/template/collection-preferences/styles.css.js

@@ -1,24 +1,24 @@
 
     import './styles.scoped.css';
     export default {
-  "visible-content": "awsui_visible-content_tc96w_muv71_185",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_muv71_186",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_muv71_187",
-  "visible-content-group": "awsui_visible-content-group_tc96w_muv71_187",
-  "visible-content-title": "awsui_visible-content-title_tc96w_muv71_192",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_muv71_200",
-  "visible-content-option": "awsui_visible-content-option_tc96w_muv71_206",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_muv71_217",
-  "root": "awsui_root_tc96w_muv71_225",
-  "modal-root": "awsui_modal-root_tc96w_muv71_226",
-  "trigger-button": "awsui_trigger-button_tc96w_muv71_227",
-  "cancel-button": "awsui_cancel-button_tc96w_muv71_228",
-  "confirm-button": "awsui_confirm-button_tc96w_muv71_229",
-  "custom": "awsui_custom_tc96w_muv71_230",
-  "second-column-small": "awsui_second-column-small_tc96w_muv71_234",
-  "wrap-lines": "awsui_wrap-lines_tc96w_muv71_238",
-  "page-size": "awsui_page-size_tc96w_muv71_239",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_muv71_240",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_muv71_241"
+  "visible-content": "awsui_visible-content_tc96w_mj68r_185",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_mj68r_186",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_mj68r_187",
+  "visible-content-group": "awsui_visible-content-group_tc96w_mj68r_187",
+  "visible-content-title": "awsui_visible-content-title_tc96w_mj68r_192",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_mj68r_200",
+  "visible-content-option": "awsui_visible-content-option_tc96w_mj68r_206",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_mj68r_217",
+  "root": "awsui_root_tc96w_mj68r_224",
+  "modal-root": "awsui_modal-root_tc96w_mj68r_225",
+  "trigger-button": "awsui_trigger-button_tc96w_mj68r_226",
+  "cancel-button": "awsui_cancel-button_tc96w_mj68r_227",
+  "confirm-button": "awsui_confirm-button_tc96w_mj68r_228",
+  "custom": "awsui_custom_tc96w_mj68r_229",
+  "second-column-small": "awsui_second-column-small_tc96w_mj68r_233",
+  "wrap-lines": "awsui_wrap-lines_tc96w_mj68r_237",
+  "page-size": "awsui_page-size_tc96w_mj68r_238",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_mj68r_239",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_mj68r_240"
 };
   

package/lib/internal/template/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_muv71_185:not(#\9),
-.awsui_visible-content-toggle_tc96w_muv71_186:not(#\9),
-.awsui_visible-content-groups_tc96w_muv71_187:not(#\9),
-.awsui_visible-content-group_tc96w_muv71_187:not(#\9) {
+.awsui_visible-content_tc96w_mj68r_185:not(#\9),
+.awsui_visible-content-toggle_tc96w_mj68r_186:not(#\9),
+.awsui_visible-content-groups_tc96w_mj68r_187:not(#\9),
+.awsui_visible-content-group_tc96w_mj68r_187:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_visible-content-title_tc96w_muv71_192:not(#\9) {
+.awsui_visible-content-title_tc96w_mj68r_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-tjy9e4, 400);
@@ -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_muv71_200:not(#\9) {
+.awsui_visible-content-group-label_tc96w_mj68r_200:not(#\9) {
   color: var(--color-text-group-label-5rxtyp, #545b64);
   padding-bottom: var(--space-xs-rsr2qu, 8px);
   border-bottom: var(--border-divider-list-width-hacikr, 1px) solid var(--color-border-divider-default-k96bks, #eaeded);
 }
 
-.awsui_visible-content-option_tc96w_muv71_206:not(#\9) {
+.awsui_visible-content-option_tc96w_mj68r_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-k96bks, #eaeded);
 }
-.awsui_visible-content-option_tc96w_muv71_206:not(#\9):last-child {
+.awsui_visible-content-option_tc96w_mj68r_206:not(#\9):last-child {
   border-bottom: none;
 }
 
-.awsui_visible-content-option-label_tc96w_muv71_217:not(#\9) {
-  white-space: nowrap;
+.awsui_visible-content-option-label_tc96w_mj68r_217:not(#\9) {
   overflow: hidden;
   text-overflow: ellipsis;
   padding-right: var(--space-l-4vl6xu, 20px);
   flex-grow: 1;
 }
 
-.awsui_root_tc96w_muv71_225:not(#\9),
-.awsui_modal-root_tc96w_muv71_226:not(#\9),
-.awsui_trigger-button_tc96w_muv71_227:not(#\9),
-.awsui_cancel-button_tc96w_muv71_228:not(#\9),
-.awsui_confirm-button_tc96w_muv71_229:not(#\9),
-.awsui_custom_tc96w_muv71_230:not(#\9) {
+.awsui_root_tc96w_mj68r_224:not(#\9),
+.awsui_modal-root_tc96w_mj68r_225:not(#\9),
+.awsui_trigger-button_tc96w_mj68r_226:not(#\9),
+.awsui_cancel-button_tc96w_mj68r_227:not(#\9),
+.awsui_confirm-button_tc96w_mj68r_228:not(#\9),
+.awsui_custom_tc96w_mj68r_229:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_second-column-small_tc96w_muv71_234:not(#\9) {
+.awsui_second-column-small_tc96w_mj68r_233:not(#\9) {
   padding-top: calc(2 * var(--space-scaled-l-t03y3z, 20px));
 }
 
-.awsui_wrap-lines_tc96w_muv71_238:not(#\9),
-.awsui_page-size_tc96w_muv71_239:not(#\9),
-.awsui_page-size-form-field_tc96w_muv71_240:not(#\9),
-.awsui_page-size-radio-group_tc96w_muv71_241:not(#\9) {
+.awsui_wrap-lines_tc96w_mj68r_237:not(#\9),
+.awsui_page-size_tc96w_mj68r_238:not(#\9),
+.awsui_page-size-form-field_tc96w_mj68r_239:not(#\9),
+.awsui_page-size-radio-group_tc96w_mj68r_240:not(#\9) {
   /* used in test-utils */
 }

package/lib/internal/template/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_muv71_185",
-  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_muv71_186",
-  "visible-content-groups": "awsui_visible-content-groups_tc96w_muv71_187",
-  "visible-content-group": "awsui_visible-content-group_tc96w_muv71_187",
-  "visible-content-title": "awsui_visible-content-title_tc96w_muv71_192",
-  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_muv71_200",
-  "visible-content-option": "awsui_visible-content-option_tc96w_muv71_206",
-  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_muv71_217",
-  "root": "awsui_root_tc96w_muv71_225",
-  "modal-root": "awsui_modal-root_tc96w_muv71_226",
-  "trigger-button": "awsui_trigger-button_tc96w_muv71_227",
-  "cancel-button": "awsui_cancel-button_tc96w_muv71_228",
-  "confirm-button": "awsui_confirm-button_tc96w_muv71_229",
-  "custom": "awsui_custom_tc96w_muv71_230",
-  "second-column-small": "awsui_second-column-small_tc96w_muv71_234",
-  "wrap-lines": "awsui_wrap-lines_tc96w_muv71_238",
-  "page-size": "awsui_page-size_tc96w_muv71_239",
-  "page-size-form-field": "awsui_page-size-form-field_tc96w_muv71_240",
-  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_muv71_241"
+  "visible-content": "awsui_visible-content_tc96w_mj68r_185",
+  "visible-content-toggle": "awsui_visible-content-toggle_tc96w_mj68r_186",
+  "visible-content-groups": "awsui_visible-content-groups_tc96w_mj68r_187",
+  "visible-content-group": "awsui_visible-content-group_tc96w_mj68r_187",
+  "visible-content-title": "awsui_visible-content-title_tc96w_mj68r_192",
+  "visible-content-group-label": "awsui_visible-content-group-label_tc96w_mj68r_200",
+  "visible-content-option": "awsui_visible-content-option_tc96w_mj68r_206",
+  "visible-content-option-label": "awsui_visible-content-option-label_tc96w_mj68r_217",
+  "root": "awsui_root_tc96w_mj68r_224",
+  "modal-root": "awsui_modal-root_tc96w_mj68r_225",
+  "trigger-button": "awsui_trigger-button_tc96w_mj68r_226",
+  "cancel-button": "awsui_cancel-button_tc96w_mj68r_227",
+  "confirm-button": "awsui_confirm-button_tc96w_mj68r_228",
+  "custom": "awsui_custom_tc96w_mj68r_229",
+  "second-column-small": "awsui_second-column-small_tc96w_mj68r_233",
+  "wrap-lines": "awsui_wrap-lines_tc96w_mj68r_237",
+  "page-size": "awsui_page-size_tc96w_mj68r_238",
+  "page-size-form-field": "awsui_page-size-form-field_tc96w_mj68r_239",
+  "page-size-radio-group": "awsui_page-size-radio-group_tc96w_mj68r_240"
 };
   

package/lib/internal/template/{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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/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/lib/internal/template/date-input/styles.css.js

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

package/lib/internal/template/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/lib/internal/template/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/lib/internal/template/date-picker/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAsB/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,QAAA,MAAM,UAAU,6FAiKf,CAAC;AAGF,eAAe,UAAU,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/date-picker/index.tsx"],"names":[],"mappings":"AAGA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAElE,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAC;AAsB/C,OAAO,EAAE,eAAe,EAAE,CAAC;AAE3B,QAAA,MAAM,UAAU,6FA8Jf,CAAC;AAGF,eAAe,UAAU,CAAC"}

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

@@ -11,7 +11,7 @@ import { memoizedDate } from './calendar/utils/memoized-date';
 import { KeyCode } from '../internal/keycode';
 import { fireNonCancelableEvent } from '../internal/events';
 import Dropdown from '../internal/components/dropdown';
-import DateInput from '../internal/components/date-input';
+import InternalDateInput from '../date-input/internal';
 import { getBaseProps } from '../internal/base-component';
 import { applyDisplayName } from '../internal/utils/apply-display-name.js';
 import checkControlled from '../internal/hooks/check-controlled';
@@ -60,7 +60,7 @@ var DatePicker = React.forwardRef(function (_a, ref) {
     var memoizedValue = memoizedDate('value', value);
     var DateInputElement = (React.createElement("div", { className: styles['date-picker-trigger'] },
         React.createElement("div", { className: styles['date-picker-input'] },
-            React.createElement(DateInput, { name: name, invalid: invalid, controlId: controlId, ariaLabelledby: ariaLabelledby, ariaDescribedby: ariaDescribedby, ariaLabel: ariaLabel, ariaRequired: ariaRequired, value: value, autoComplete: false, disableBrowserAutocorrect: true, disableAutocompleteOnBlur: isDropDownOpen, disabled: disabled, readOnly: readOnly, onChange: onInputChangeHandler, onBlur: onInputBlurHandler, placeholder: placeholder, ref: internalInputRef, autoFocus: autoFocus })),
+            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 })),
         React.createElement("div", null,
             React.createElement(InternalButton, { iconName: "calendar", className: styles['open-calendar-button'], onClick: onButtonClickHandler, ref: buttonRef, ariaLabel: openCalendarAriaLabel &&
                     openCalendarAriaLabel(value.length === 10 ? getDateLabel(normalizedLocale, memoizedValue) : null), disabled: disabled || readOnly, formAction: "none" }))));

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 DateInput from '../internal/components/date-input';\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          <DateInput\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            autoComplete={false}\n            disableBrowserAutocorrect={true}\n            disableAutocompleteOnBlur={isDropDownOpen}\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 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"]}

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

@@ -8,7 +8,7 @@ import { Grids, selectFocusedDate } from './grids';
 import moveFocusHandler from '../../date-picker/calendar/utils/move-focus-handler';
 import InternalSpaceBetween from '../../space-between/internal';
 import InternalFormField from '../../form-field/internal';
-import DateInput from '../../internal/components/date-input';
+import InternalDateInput from '../../date-input/internal';
 import InternalTimeInput from '../../time-input/internal';
 import clsx from 'clsx';
 import { getBaseDate } from './get-base-date.js';
@@ -206,14 +206,14 @@ function Calendar(_a, ref) {
                     React.createElement("div", { className: styles['date-and-time-wrapper'] },
                         React.createElement("div", { className: styles['date-and-time-wrapper__date'] },
                             React.createElement(InternalFormField, { label: i18nStrings.startDateLabel, stretch: true },
-                                React.createElement(DateInput, { value: startDateString, autoComplete: false, disableBrowserAutocorrect: true, disableAutocompleteOnBlur: false, className: styles['start-date-input'], onChange: onChangeStartDate, placeholder: "YYYY/MM/DD", ariaDescribedby: constrainttextId }))),
+                                React.createElement(InternalDateInput, { value: startDateString, className: styles['start-date-input'], onChange: onChangeStartDate, placeholder: "YYYY/MM/DD", ariaDescribedby: constrainttextId }))),
                         !dateOnly && (React.createElement("div", { className: styles['date-and-time-wrapper__time'] },
                             React.createElement(InternalFormField, { label: i18nStrings.startTimeLabel, stretch: true },
                                 React.createElement(InternalTimeInput, { value: startTimeString, onChange: function (e) { return setStartTimeString(e.detail.value); }, format: timeInputFormat, placeholder: timeInputFormat, className: styles['start-time-input'], ariaDescribedby: constrainttextId }))))),
                     React.createElement("div", { className: styles['date-and-time-wrapper'] },
                         React.createElement("div", { className: styles['date-and-time-wrapper__date'] },
                             React.createElement(InternalFormField, { label: i18nStrings.endDateLabel, stretch: true },
-                                React.createElement(DateInput, { value: endDateString, autoComplete: false, disableBrowserAutocorrect: true, disableAutocompleteOnBlur: false, className: styles['end-date-input'], onChange: onChangeEndDate, placeholder: "YYYY/MM/DD", ariaDescribedby: constrainttextId }))),
+                                React.createElement(InternalDateInput, { value: endDateString, className: styles['end-date-input'], onChange: onChangeEndDate, placeholder: "YYYY/MM/DD", ariaDescribedby: constrainttextId }))),
                         !dateOnly && (React.createElement("div", { className: styles['date-and-time-wrapper__time'] },
                             React.createElement(InternalFormField, { label: i18nStrings.endTimeLabel, stretch: true },
                                 React.createElement(InternalTimeInput, { value: endTimeString, onChange: function (e) { return setEndTimeString(e.detail.value); }, format: timeInputFormat, placeholder: timeInputFormat, className: styles['end-time-input'], ariaDescribedby: constrainttextId })))))),