@cloudscape-design/components 3.0.301 → 3.0.303

package/button-dropdown/styles.scoped.css

@@ -90,67 +90,67 @@ 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_button-dropdown_sne0l_1jdy2_93:not(#\9) {
+.awsui_button-dropdown_sne0l_14ox4_93:not(#\9) {
   display: inline-block;
 }
 
-.awsui_items-list-container_sne0l_1jdy2_97:not(#\9) {
+.awsui_items-list-container_sne0l_14ox4_97:not(#\9) {
   padding: 0;
   margin: 0;
-  animation: awsui_awsui-motion-fade-in-0_sne0l_1jdy2_1 500ms var(--motion-easing-show-quick-vlcbqf, ease-out);
+  animation: awsui_awsui-motion-fade-in-0_sne0l_14ox4_1 500ms var(--motion-easing-show-quick-17va6f, ease-out);
   animation-fill-mode: none;
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_items-list-container_sne0l_1jdy2_97:not(#\9) {
+  .awsui_items-list-container_sne0l_14ox4_97:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_items-list-container_sne0l_1jdy2_97:not(#\9), .awsui-mode-entering .awsui_items-list-container_sne0l_1jdy2_97:not(#\9) {
+.awsui-motion-disabled .awsui_items-list-container_sne0l_14ox4_97:not(#\9), .awsui-mode-entering .awsui_items-list-container_sne0l_14ox4_97:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_rotate-up_sne0l_1jdy2_114:not(#\9) {
+.awsui_rotate-up_sne0l_14ox4_114:not(#\9) {
   transform: rotate(-180deg);
-  transition: transform var(--motion-duration-rotate-180-i3ygzg, 135ms) var(--motion-easing-rotate-180-qx5hdf, cubic-bezier(0.165, 0.84, 0.44, 1));
+  transition: transform var(--motion-duration-rotate-180-m9g4a9, 135ms) var(--motion-easing-rotate-180-h4cyjx, cubic-bezier(0.165, 0.84, 0.44, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_rotate-up_sne0l_1jdy2_114:not(#\9) {
+  .awsui_rotate-up_sne0l_14ox4_114:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_rotate-up_sne0l_1jdy2_114:not(#\9), .awsui-mode-entering .awsui_rotate-up_sne0l_1jdy2_114:not(#\9) {
+.awsui-motion-disabled .awsui_rotate-up_sne0l_14ox4_114:not(#\9), .awsui-mode-entering .awsui_rotate-up_sne0l_14ox4_114:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_rotate-down_sne0l_1jdy2_129:not(#\9) {
+.awsui_rotate-down_sne0l_14ox4_129:not(#\9) {
   transform: rotate(0deg);
-  transition: transform var(--motion-duration-rotate-180-i3ygzg, 135ms) var(--motion-easing-rotate-180-qx5hdf, cubic-bezier(0.165, 0.84, 0.44, 1));
+  transition: transform var(--motion-duration-rotate-180-m9g4a9, 135ms) var(--motion-easing-rotate-180-h4cyjx, cubic-bezier(0.165, 0.84, 0.44, 1));
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_rotate-down_sne0l_1jdy2_129:not(#\9) {
+  .awsui_rotate-down_sne0l_14ox4_129:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_rotate-down_sne0l_1jdy2_129:not(#\9), .awsui-mode-entering .awsui_rotate-down_sne0l_1jdy2_129:not(#\9) {
+.awsui-motion-disabled .awsui_rotate-down_sne0l_14ox4_129:not(#\9), .awsui-mode-entering .awsui_rotate-down_sne0l_14ox4_129:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_header_sne0l_1jdy2_144:not(#\9) {
+.awsui_header_sne0l_14ox4_144:not(#\9) {
   display: flex;
   flex-direction: column;
   list-style: none;
-  padding: var(--space-s-rd607g, 12px) var(--space-l-ds615y, 20px);
-  border: var(--border-field-width-egrqih, 2px) solid transparent;
-  border-bottom: var(--border-field-width-egrqih, 2px) solid var(--color-border-dropdown-group-l3q7ne, #e9ebed);
+  padding: var(--space-s-hdd878, 12px) var(--space-l-f4l5gr, 20px);
+  border: var(--border-field-width-riro62, 2px) solid transparent;
+  border-bottom: var(--border-field-width-riro62, 2px) solid var(--color-border-dropdown-group-qb493x, #e9ebed);
 }
 
-.awsui_title_sne0l_1jdy2_153:not(#\9),
-.awsui_description_sne0l_1jdy2_154:not(#\9) {
-  color: var(--color-text-dropdown-header-892ghs, #000716);
+.awsui_title_sne0l_14ox4_153:not(#\9),
+.awsui_description_sne0l_14ox4_154:not(#\9) {
+  color: var(--color-text-dropdown-header-mdcup0, #000716);
 }

package/button-dropdown/styles.selectors.js

@@ -2,13 +2,13 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "button-dropdown": "awsui_button-dropdown_sne0l_1jdy2_93",
-  "items-list-container": "awsui_items-list-container_sne0l_1jdy2_97",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_sne0l_1jdy2_1",
-  "rotate-up": "awsui_rotate-up_sne0l_1jdy2_114",
-  "rotate-down": "awsui_rotate-down_sne0l_1jdy2_129",
-  "header": "awsui_header_sne0l_1jdy2_144",
-  "title": "awsui_title_sne0l_1jdy2_153",
-  "description": "awsui_description_sne0l_1jdy2_154"
+  "button-dropdown": "awsui_button-dropdown_sne0l_14ox4_93",
+  "items-list-container": "awsui_items-list-container_sne0l_14ox4_97",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_sne0l_14ox4_1",
+  "rotate-up": "awsui_rotate-up_sne0l_14ox4_114",
+  "rotate-down": "awsui_rotate-down_sne0l_14ox4_129",
+  "header": "awsui_header_sne0l_14ox4_144",
+  "title": "awsui_title_sne0l_14ox4_153",
+  "description": "awsui_description_sne0l_14ox4_154"
 };
   

package/calendar/interfaces.d.ts

@@ -39,14 +39,17 @@ export interface CalendarProps extends BaseComponentProps {
     ariaDescribedby?: string;
     /**
      * Used as part of the `aria-label` for today's date in the calendar.
+     * @i18n
      */
     todayAriaLabel?: string;
     /**
      * Specifies an `aria-label` for the 'next month' button.
+     * @i18n
      */
     nextMonthAriaLabel?: string;
     /**
      * Specifies an `aria-label` for the 'previous month' button.
+     * @i18n
      */
     previousMonthAriaLabel?: string;
     /**

package/calendar/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["calendar/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,aAAc,SAAQ,kBAAkB;IACvD;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC;IAEpD;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;OAEG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,yBAAiB,aAAa,CAAC;IAC7B,UAAiB,YAAY;QAC3B;;WAEG;QACH,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,qBAAqB;QACpC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;KACvB;CACF"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["calendar/interfaces.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE/D,MAAM,WAAW,aAAc,SAAQ,kBAAkB;IACvD;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IAEd;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,aAAa,CAAC,qBAAqB,CAAC;IAEpD;;;;;OAKG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;OAGG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;OAGG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;OAGG;IACH,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAEhC;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,aAAa,CAAC,YAAY,CAAC,CAAC;CAClE;AAED,yBAAiB,aAAa,CAAC;IAC7B,UAAiB,YAAY;QAC3B;;WAEG;QACH,KAAK,EAAE,MAAM,CAAC;KACf;IAED,UAAiB,qBAAqB;QACpC,CAAC,IAAI,EAAE,IAAI,GAAG,OAAO,CAAC;KACvB;CACF"}

package/calendar/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["calendar/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 { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface CalendarProps extends BaseComponentProps {\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?: CalendarProps.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   * Adds an `aria-label` to the calendar.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Adds `aria-labelledby` to the calendar.\n   */\n  ariaLabelledby?: string;\n\n  /**\n   * Adds `aria-describedby` to the calendar.\n   */\n  ariaDescribedby?: string;\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<CalendarProps.ChangeDetail>;\n}\n\nexport namespace CalendarProps {\n  export interface ChangeDetail {\n    /**\n     * The new value of this component.\n     */\n    value: string;\n  }\n\n  export interface IsDateEnabledFunction {\n    (date: Date): boolean;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["calendar/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 { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\nexport interface CalendarProps extends BaseComponentProps {\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?: CalendarProps.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   * Adds an `aria-label` to the calendar.\n   */\n  ariaLabel?: string;\n\n  /**\n   * Adds `aria-labelledby` to the calendar.\n   */\n  ariaLabelledby?: string;\n\n  /**\n   * Adds `aria-describedby` to the calendar.\n   */\n  ariaDescribedby?: string;\n\n  /**\n   * Used as part of the `aria-label` for today's date in the calendar.\n   * @i18n\n   */\n  todayAriaLabel?: string;\n\n  /**\n   * Specifies an `aria-label` for the 'next month' button.\n   * @i18n\n   */\n  nextMonthAriaLabel?: string;\n\n  /**\n   * Specifies an `aria-label` for the 'previous month' button.\n   * @i18n\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<CalendarProps.ChangeDetail>;\n}\n\nexport namespace CalendarProps {\n  export interface ChangeDetail {\n    /**\n     * The new value of this component.\n     */\n    value: string;\n  }\n\n  export interface IsDateEnabledFunction {\n    (date: Date): boolean;\n  }\n}\n"]}

package/calendar/styles.css.js

@@ -1,23 +1,23 @@
 
     import './styles.scoped.css';
     export default {
-  "calendar": "awsui_calendar_1ykar_bzka2_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_bzka2_1",
-  "root": "awsui_root_1ykar_bzka2_124",
-  "calendar-inner": "awsui_calendar-inner_1ykar_bzka2_143",
-  "calendar-header": "awsui_calendar-header_1ykar_bzka2_146",
-  "calendar-header-month": "awsui_calendar-header-month_1ykar_bzka2_151",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_bzka2_158",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_bzka2_161",
-  "calendar-grid": "awsui_calendar-grid_1ykar_bzka2_164",
-  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_bzka2_168",
-  "calendar-day-header": "awsui_calendar-day-header_1ykar_bzka2_174",
-  "calendar-day": "awsui_calendar-day_1ykar_bzka2_174",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_bzka2_191",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_bzka2_198",
-  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_bzka2_205",
-  "calendar-day-today": "awsui_calendar-day-today_1ykar_bzka2_208",
-  "day-inner": "awsui_day-inner_1ykar_bzka2_223",
-  "calendar-week": "awsui_calendar-week_1ykar_bzka2_288"
+  "calendar": "awsui_calendar_1ykar_1mzwv_93",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_1mzwv_1",
+  "root": "awsui_root_1ykar_1mzwv_124",
+  "calendar-inner": "awsui_calendar-inner_1ykar_1mzwv_143",
+  "calendar-header": "awsui_calendar-header_1ykar_1mzwv_146",
+  "calendar-header-month": "awsui_calendar-header-month_1ykar_1mzwv_151",
+  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_1mzwv_158",
+  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_1mzwv_161",
+  "calendar-grid": "awsui_calendar-grid_1ykar_1mzwv_164",
+  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_1mzwv_168",
+  "calendar-day-header": "awsui_calendar-day-header_1ykar_1mzwv_174",
+  "calendar-day": "awsui_calendar-day_1ykar_1mzwv_174",
+  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_1mzwv_191",
+  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_1mzwv_198",
+  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_1mzwv_205",
+  "calendar-day-today": "awsui_calendar-day-today_1ykar_1mzwv_208",
+  "day-inner": "awsui_day-inner_1ykar_1mzwv_223",
+  "calendar-week": "awsui_calendar-week_1ykar_1mzwv_288"
 };
   

package/calendar/styles.scoped.css

@@ -90,11 +90,11 @@ 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_1ykar_bzka2_93:not(#\9) {
-  animation: awsui_awsui-motion-fade-in-0_1ykar_bzka2_1 var(--motion-duration-show-quick-b6n9lb, 135ms) var(--motion-easing-show-quick-vlcbqf, ease-out);
+.awsui_calendar_1ykar_1mzwv_93:not(#\9) {
+  animation: awsui_awsui-motion-fade-in-0_1ykar_1mzwv_1 var(--motion-duration-show-quick-fkbsov, 135ms) var(--motion-easing-show-quick-17va6f, ease-out);
   animation-fill-mode: both;
 }
-@keyframes awsui_awsui-motion-fade-in-0_1ykar_bzka2_1 {
+@keyframes awsui_awsui-motion-fade-in-0_1ykar_1mzwv_1 {
   from {
     opacity: 0;
   }
@@ -103,12 +103,12 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_calendar_1ykar_bzka2_93:not(#\9) {
+  .awsui_calendar_1ykar_1mzwv_93:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_calendar_1ykar_bzka2_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_bzka2_93:not(#\9) {
+.awsui-motion-disabled .awsui_calendar_1ykar_1mzwv_93:not(#\9), .awsui-mode-entering .awsui_calendar_1ykar_1mzwv_93:not(#\9) {
   animation: none;
   transition: none;
 }
@@ -121,13 +121,13 @@ 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_root_1ykar_bzka2_124:not(#\9) {
+.awsui_root_1ykar_1mzwv_124:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_calendar_1ykar_bzka2_93:not(#\9) {
+.awsui_calendar_1ykar_1mzwv_93:not(#\9) {
   display: block;
-  width: var(--size-calendar-grid-width-fvnn65, 238px);
+  width: var(--size-calendar-grid-width-5g8y2e, 238px);
   overflow: auto;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
   border-collapse: separate;
@@ -158,159 +158,159 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   widows: 2;
   word-spacing: normal;
   box-sizing: border-box;
-  font-size: var(--font-body-m-size-cqtcam, 14px);
-  line-height: var(--font-body-m-line-height-83azrc, 22px);
-  color: var(--color-text-body-default-01bwmw, #000716);
+  font-size: var(--font-body-m-size-7dign1, 14px);
+  line-height: var(--font-body-m-line-height-rfgrp9, 22px);
+  color: var(--color-text-body-default-mmvcvg, #000716);
   font-weight: 400;
-  font-family: var(--font-family-base-kd6hgy, "Open Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
+  font-family: var(--font-family-base-wn913o, "Open Sans", "Helvetica Neue", Roboto, Arial, sans-serif);
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
 }
-.awsui_calendar-inner_1ykar_bzka2_143:not(#\9) {
-  margin: var(--space-xs-inub5w, 8px);
+.awsui_calendar-inner_1ykar_1mzwv_143:not(#\9) {
+  margin: var(--space-xs-edba2s, 8px);
 }
-.awsui_calendar-header_1ykar_bzka2_146:not(#\9) {
+.awsui_calendar-header_1ykar_1mzwv_146:not(#\9) {
   display: flex;
   justify-content: space-between;
   align-items: center;
 }
-.awsui_calendar-header-month_1ykar_bzka2_151:not(#\9) {
-  font-size: var(--font-body-m-size-cqtcam, 14px);
-  line-height: var(--font-body-m-line-height-83azrc, 22px);
+.awsui_calendar-header-month_1ykar_1mzwv_151:not(#\9) {
+  font-size: var(--font-body-m-size-7dign1, 14px);
+  line-height: var(--font-body-m-line-height-rfgrp9, 22px);
   font-weight: 700;
-  color: var(--color-text-dropdown-item-default-23eojq, #000716);
+  color: var(--color-text-dropdown-item-default-dyep5n, #000716);
   margin: 0;
 }
-.awsui_calendar-next-month-btn_1ykar_bzka2_158:not(#\9) {
+.awsui_calendar-next-month-btn_1ykar_1mzwv_158:not(#\9) {
   /* used for identifying element */
 }
-.awsui_calendar-prev-month-btn_1ykar_bzka2_161:not(#\9) {
+.awsui_calendar-prev-month-btn_1ykar_1mzwv_161:not(#\9) {
   /* used for identifying element */
 }
-.awsui_calendar-grid_1ykar_bzka2_164:not(#\9) {
+.awsui_calendar-grid_1ykar_1mzwv_164:not(#\9) {
   width: 100%;
   border-spacing: 0;
 }
-.awsui_calendar-grid-cell_1ykar_bzka2_168:not(#\9) {
+.awsui_calendar-grid-cell_1ykar_1mzwv_168:not(#\9) {
   width: 14.2857142857%;
   word-break: break-word;
   text-align: center;
   font-weight: unset;
 }
-.awsui_calendar-day-header_1ykar_bzka2_174:not(#\9) {
-  padding: var(--space-s-rd607g, 12px) 0 var(--space-xxs-a6783b, 4px);
-  color: var(--color-text-calendar-month-a9ogmz, #5f6b7a);
-  font-size: var(--font-body-s-size-zu142i, 12px);
-  line-height: var(--font-body-s-line-height-yd7nw5, 16px);
-  letter-spacing: var(--font-body-s-letter-spacing-26nwxv, 0.005em);
-}
-.awsui_calendar-day_1ykar_bzka2_174:not(#\9) {
-  border-bottom: 1px solid var(--color-border-calendar-grid-24tkkl, transparent);
-  border-right: 1px solid var(--color-border-calendar-grid-24tkkl, transparent);
-  padding: var(--space-xxs-a6783b, 4px) 0;
-  color: var(--color-text-dropdown-item-disabled-9e6ykc, #9ba7b6);
+.awsui_calendar-day-header_1ykar_1mzwv_174:not(#\9) {
+  padding: var(--space-s-hdd878, 12px) 0 var(--space-xxs-ja5cp8, 4px);
+  color: var(--color-text-calendar-month-tvowxv, #5f6b7a);
+  font-size: var(--font-body-s-size-6jmxer, 12px);
+  line-height: var(--font-body-s-line-height-ga8tt7, 16px);
+  letter-spacing: var(--font-body-s-letter-spacing-v8bwhi, 0.005em);
+}
+.awsui_calendar-day_1ykar_1mzwv_174:not(#\9) {
+  border-bottom: 1px solid var(--color-border-calendar-grid-kpox7s, transparent);
+  border-right: 1px solid var(--color-border-calendar-grid-kpox7s, transparent);
+  padding: var(--space-xxs-ja5cp8, 4px) 0;
+  color: var(--color-text-dropdown-item-disabled-p5eewj, #9ba7b6);
   position: relative;
 }
-.awsui_calendar-day_1ykar_bzka2_174:not(#\9):first-child {
-  border-left: 1px solid var(--color-border-calendar-grid-24tkkl, transparent);
+.awsui_calendar-day_1ykar_1mzwv_174:not(#\9):first-child {
+  border-left: 1px solid var(--color-border-calendar-grid-kpox7s, transparent);
 }
-.awsui_calendar-day-enabled_1ykar_bzka2_191:not(#\9) {
+.awsui_calendar-day-enabled_1ykar_1mzwv_191:not(#\9) {
   cursor: pointer;
-  color: var(--color-text-dropdown-item-secondary-d2dxdn, #5f6b7a);
+  color: var(--color-text-dropdown-item-secondary-c4unu9, #5f6b7a);
 }
-.awsui_calendar-day-enabled_1ykar_bzka2_191:not(#\9)::after {
-  border-radius: var(--border-radius-item-5rz9ov, 8px);
+.awsui_calendar-day-enabled_1ykar_1mzwv_191:not(#\9)::after {
+  border-radius: var(--border-radius-item-gyl0qr, 8px);
 }
-.awsui_calendar-day-enabled_1ykar_bzka2_191.awsui_calendar-day-current-month_1ykar_bzka2_198:not(#\9) {
-  color: var(--color-text-dropdown-item-default-23eojq, #000716);
+.awsui_calendar-day-enabled_1ykar_1mzwv_191.awsui_calendar-day-current-month_1ykar_1mzwv_198:not(#\9) {
+  color: var(--color-text-dropdown-item-default-dyep5n, #000716);
 }
-.awsui_calendar-day-enabled_1ykar_bzka2_191.awsui_calendar-day-current-month_1ykar_bzka2_198:not(#\9):hover {
-  color: var(--color-text-calendar-day-hover-a8ka2o, #000716);
-  background-color: var(--color-background-dropdown-item-hover-mqv311, #f4f4f4);
+.awsui_calendar-day-enabled_1ykar_1mzwv_191.awsui_calendar-day-current-month_1ykar_1mzwv_198:not(#\9):hover {
+  color: var(--color-text-calendar-day-hover-ail3l7, #000716);
+  background-color: var(--color-background-dropdown-item-hover-gvdk4u, #f4f4f4);
 }
-.awsui_calendar-day-enabled_1ykar_bzka2_191.awsui_calendar-day-current-month_1ykar_bzka2_198:not(#\9):hover:not(.awsui_calendar-day-selected_1ykar_bzka2_205)::after {
-  border: var(--border-item-width-4pi0dw, 2px) solid var(--color-border-dropdown-item-hover-r32qaz, #7d8998);
+.awsui_calendar-day-enabled_1ykar_1mzwv_191.awsui_calendar-day-current-month_1ykar_1mzwv_198:not(#\9):hover:not(.awsui_calendar-day-selected_1ykar_1mzwv_205)::after {
+  border: var(--border-item-width-y36svo, 2px) solid var(--color-border-dropdown-item-hover-me98vk, #7d8998);
 }
-.awsui_calendar-day-today_1ykar_bzka2_208:not(#\9) {
-  background-color: var(--color-background-calendar-today-9kadgk, #f4f4f4);
-  border-radius: var(--border-radius-item-5rz9ov, 8px);
+.awsui_calendar-day-today_1ykar_1mzwv_208:not(#\9) {
+  background-color: var(--color-background-calendar-today-yk2tnj, #f4f4f4);
+  border-radius: var(--border-radius-item-gyl0qr, 8px);
   font-weight: 700;
 }
-.awsui_calendar-day_1ykar_bzka2_174:not(#\9)::after {
+.awsui_calendar-day_1ykar_1mzwv_174:not(#\9)::after {
   content: "";
   position: absolute;
   z-index: 1;
-  top: calc(-1 * var(--border-item-width-4pi0dw, 2px));
+  top: calc(-1 * var(--border-item-width-y36svo, 2px));
   left: -1px;
   bottom: -1px;
-  right: calc(-1 * var(--border-item-width-4pi0dw, 2px));
+  right: calc(-1 * var(--border-item-width-y36svo, 2px));
   background-color: transparent;
 }
-.awsui_calendar-day_1ykar_bzka2_174 > .awsui_day-inner_1ykar_bzka2_223:not(#\9) {
+.awsui_calendar-day_1ykar_1mzwv_174 > .awsui_day-inner_1ykar_1mzwv_223:not(#\9) {
   position: relative;
   z-index: 1;
 }
-.awsui_calendar-day_1ykar_bzka2_174:not(#\9):focus {
+.awsui_calendar-day_1ykar_1mzwv_174:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_bzka2_174:not(#\9):focus:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_1mzwv_174:not(#\9):focus:focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_bzka2_174:not(#\9):focus:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_1mzwv_174:not(#\9):focus:focus {
   outline: 2px dotted transparent;
-  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px) - 1px);
+  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_bzka2_174:not(#\9):focus:focus::before {
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_1mzwv_174:not(#\9):focus:focus::before {
   content: " ";
   display: block;
   position: absolute;
-  left: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  top: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  width: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  height: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  border-radius: var(--border-radius-calendar-day-focus-ring-onnbsk, 3px);
-  box-shadow: 0 0 0 2px var(--color-border-item-focused-nwfxo7, #0972d3);
-}
-body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_bzka2_174:not(#\9):focus:focus::before {
+  left: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  top: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  width: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  height: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  border-radius: var(--border-radius-calendar-day-focus-ring-p4dxcv, 3px);
+  box-shadow: 0 0 0 2px var(--color-border-item-focused-4t19h5, #0972d3);
+}
+body[data-awsui-focus-visible=true] .awsui_calendar-day_1ykar_1mzwv_174:not(#\9):focus:focus::before {
   z-index: 2;
 }
-.awsui_calendar-day-selected_1ykar_bzka2_205:not(#\9) {
+.awsui_calendar-day-selected_1ykar_1mzwv_205:not(#\9) {
   border-color: transparent;
   position: relative;
   z-index: 2;
   font-weight: 700;
 }
-body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_bzka2_205:not(#\9):focus:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_1mzwv_205:not(#\9):focus:focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_bzka2_205:not(#\9):focus:focus {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_1mzwv_205:not(#\9):focus:focus {
   outline: 2px dotted transparent;
-  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px) - 1px);
+  outline-offset: calc(var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_bzka2_205:not(#\9):focus:focus::before {
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_1mzwv_205:not(#\9):focus:focus::before {
   content: " ";
   display: block;
   position: absolute;
-  left: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  top: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  width: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  height: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-2i29hf, -5px));
-  border-radius: var(--border-radius-calendar-day-focus-ring-onnbsk, 3px);
-  box-shadow: 0 0 0 2px var(--color-border-calendar-grid-selected-focus-ring-kuyfu4, #fbfbfb);
-}
-body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_bzka2_205:not(#\9):focus:focus::before {
+  left: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  top: calc(-1 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  width: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  height: calc(100% + 2 * var(--space-calendar-grid-focus-outline-gutter-reev1c, -5px));
+  border-radius: var(--border-radius-calendar-day-focus-ring-p4dxcv, 3px);
+  box-shadow: 0 0 0 2px var(--color-border-calendar-grid-selected-focus-ring-ns1ga1, #fbfbfb);
+}
+body[data-awsui-focus-visible=true] .awsui_calendar-day-selected_1ykar_1mzwv_205:not(#\9):focus:focus::before {
   z-index: 2;
 }
-.awsui_calendar-day-selected_1ykar_bzka2_205:not(#\9)::after {
-  background-color: var(--color-background-control-checked-6eqeqa, #0972d3);
-  border: var(--border-item-width-4pi0dw, 2px) solid var(--color-background-control-checked-6eqeqa, #0972d3);
-  border-radius: var(--border-radius-item-5rz9ov, 8px);
+.awsui_calendar-day-selected_1ykar_1mzwv_205:not(#\9)::after {
+  background-color: var(--color-background-control-checked-k2dd8u, #0972d3);
+  border: var(--border-item-width-y36svo, 2px) solid var(--color-background-control-checked-k2dd8u, #0972d3);
+  border-radius: var(--border-radius-item-gyl0qr, 8px);
 }
-.awsui_calendar-day-selected_1ykar_bzka2_205 > .awsui_day-inner_1ykar_bzka2_223:not(#\9) {
+.awsui_calendar-day-selected_1ykar_1mzwv_205 > .awsui_day-inner_1ykar_1mzwv_223:not(#\9) {
   z-index: 2;
-  color: var(--color-background-control-default-ndb7qp, #ffffff);
+  color: var(--color-background-control-default-19p6ht, #ffffff);
   position: relative;
 }
-.awsui_calendar-week_1ykar_bzka2_288:not(#\9):first-child > .awsui_calendar-day_1ykar_bzka2_174 {
-  border-top: 1px solid var(--color-border-calendar-grid-24tkkl, transparent);
+.awsui_calendar-week_1ykar_1mzwv_288:not(#\9):first-child > .awsui_calendar-day_1ykar_1mzwv_174 {
+  border-top: 1px solid var(--color-border-calendar-grid-kpox7s, transparent);
 }

package/calendar/styles.selectors.js

@@ -2,23 +2,23 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "calendar": "awsui_calendar_1ykar_bzka2_93",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_bzka2_1",
-  "root": "awsui_root_1ykar_bzka2_124",
-  "calendar-inner": "awsui_calendar-inner_1ykar_bzka2_143",
-  "calendar-header": "awsui_calendar-header_1ykar_bzka2_146",
-  "calendar-header-month": "awsui_calendar-header-month_1ykar_bzka2_151",
-  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_bzka2_158",
-  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_bzka2_161",
-  "calendar-grid": "awsui_calendar-grid_1ykar_bzka2_164",
-  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_bzka2_168",
-  "calendar-day-header": "awsui_calendar-day-header_1ykar_bzka2_174",
-  "calendar-day": "awsui_calendar-day_1ykar_bzka2_174",
-  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_bzka2_191",
-  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_bzka2_198",
-  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_bzka2_205",
-  "calendar-day-today": "awsui_calendar-day-today_1ykar_bzka2_208",
-  "day-inner": "awsui_day-inner_1ykar_bzka2_223",
-  "calendar-week": "awsui_calendar-week_1ykar_bzka2_288"
+  "calendar": "awsui_calendar_1ykar_1mzwv_93",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1ykar_1mzwv_1",
+  "root": "awsui_root_1ykar_1mzwv_124",
+  "calendar-inner": "awsui_calendar-inner_1ykar_1mzwv_143",
+  "calendar-header": "awsui_calendar-header_1ykar_1mzwv_146",
+  "calendar-header-month": "awsui_calendar-header-month_1ykar_1mzwv_151",
+  "calendar-next-month-btn": "awsui_calendar-next-month-btn_1ykar_1mzwv_158",
+  "calendar-prev-month-btn": "awsui_calendar-prev-month-btn_1ykar_1mzwv_161",
+  "calendar-grid": "awsui_calendar-grid_1ykar_1mzwv_164",
+  "calendar-grid-cell": "awsui_calendar-grid-cell_1ykar_1mzwv_168",
+  "calendar-day-header": "awsui_calendar-day-header_1ykar_1mzwv_174",
+  "calendar-day": "awsui_calendar-day_1ykar_1mzwv_174",
+  "calendar-day-enabled": "awsui_calendar-day-enabled_1ykar_1mzwv_191",
+  "calendar-day-current-month": "awsui_calendar-day-current-month_1ykar_1mzwv_198",
+  "calendar-day-selected": "awsui_calendar-day-selected_1ykar_1mzwv_205",
+  "calendar-day-today": "awsui_calendar-day-today_1ykar_1mzwv_208",
+  "day-inner": "awsui_day-inner_1ykar_1mzwv_223",
+  "calendar-week": "awsui_calendar-week_1ykar_1mzwv_288"
 };
   

package/cards/interfaces.d.ts

@@ -137,6 +137,7 @@ export interface CardsProps<T = any> extends BaseComponentProps {
      * state of the component (for example, the `selectedItems` list). The label function for individual
      * items also receives the corresponding  `Item` object. You can use the group label to
      * add a meaningful description to the whole selection.
+     * @i18n
      */
     ariaLabels?: CardsProps.AriaLabels<T>;
     /**

package/cards/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"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"}

package/cards/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\n/*\n * HACK: Cast the component to a named parametrized interface.\n *\n * This lets us use React.forwardRef and still let the component have type\n * parameters, and the naming convention lets the documenter know that this is\n * a forwardRef-wrapped component.\n *\n * We don't need to expose this type to customers because it's just a simple\n * function type.\n */\nexport interface CardsForwardRefType {\n  <T>(props: CardsProps<T> & { ref?: React.Ref<CardsProps.Ref> }): JSX.Element;\n}\n\nexport interface CardsProps<T = any> extends BaseComponentProps {\n  /**\n   * Displayed only when the list of items is empty.\n   */\n  empty?: React.ReactNode;\n\n  /**\n   * Heading element of the table container. Use the [header component](/components/header/).\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Use this slot to add filtering controls to the component.\n   */\n  filter?: React.ReactNode;\n\n  /**\n   * Use this slot to add the [pagination component](/components/pagination/) to the component.\n   */\n  pagination?: React.ReactNode;\n\n  /**\n   * Use this slot to add [collection preferences](/components/collection-preferences/) to the component.\n   */\n  preferences?: React.ReactNode;\n\n  /**\n   * Specifies the items that serve as data source for a card.\n   *\n   * The `cardDefinition` property handles the display of this data.\n   */\n  items: ReadonlyArray<T>;\n\n  /**\n   * Renders the cards in a loading state. We recommend that you also set a `loadingText`.\n   */\n  loading?: boolean;\n\n  /**\n   * Specifies the text to display when in loading state.\n   */\n  loadingText?: string;\n\n  /**\n   *  Defines what to display in each card. It has the following properties:\n   *  * `header` ((item) => ReactNode) - Responsible for displaying the card header. You receive the current item as an argument.\n   *      Use `fontSize=\"heading-m\"` on [link](/components/link/) components inside card header.\n   *  * `sections` (array) - Responsible for displaying the card content. Cards can have many sections in their\n   *    body. Each entry in the array is responsible for displaying a section. An entry has the following properties:\n   *    * `id`: (string) - A unique identifier for the section. The property is used as a [keys](https://reactjs.org/docs/lists-and-keys.html#keys)\n   *   source for React rendering, and to match entries in the `visibleSections` property (if it's defined).\n   *    * `header`: (ReactNode) - Responsible for displaying the section header.\n   *    * `content`: ((item) => ReactNode) - Responsible for displaying the section content. You receive the current item as an argument.\n   *    * `width`: (number) - Specifies the width of the card section in percent. Use this to display multiple sections in\n   *    the same row. The default value is 100%.\n   *\n   *  All of the above properties are optional.\n   */\n  cardDefinition: CardsProps.CardDefinition<T>;\n  /**\n   * Determines the number of cards per row for any interval of container width.\n   * It's an array whose entries are objects containing the following:\n   * - `cards` (number) - Specifies the number of cards per row.\n   * - `minWidth` (number) - Specifies the minimum container width (in pixels) for which this configuration object should apply.\n   *\n   * For example, with this configuration:\n   * ```\n   * [{\n   *   cards: 1\n   * }, {\n   *   minWidth: 500,\n   *   cards: 2\n   * }, {\n   *   minWidth: 800,\n   *   cards: 3\n   * }]\n   * ```\n   *\n   * the cards component displays:\n   * * 1 card per row when the container width is below 500px.\n   * * 2 cards per row when the container width is between 500px and 799px.\n   * * 3 cards per row when the container width is 800px or wider.\n   *\n   * The number of cards per row can't be greater than 20.\n   *\n   * Default value:\n   * ```\n   * [{\n   *   cards: 1\n   * }, {\n   *   minWidth: 768,\n   *   cards: 2\n   * }, {\n   *   minWidth: 992,\n   *   cards: 3\n   * }, {\n   *   minWidth: 1200,\n   *   cards: 4\n   * }, {\n   *   minWidth: 1400,\n   *   cards: 5\n   * }, {\n   *   minWidth: 1920,\n   *   cards: 6\n   * }]\n   * ```\n   */\n  cardsPerRow?: ReadonlyArray<CardsProps.CardsLayout>;\n  /**\n   * Specifies the property inside items that uniquely identifies them.\n   * When it's set, it's used to provide [keys for React](https://reactjs.org/docs/lists-and-keys.html#keys)\n   * for performance optimizations.\n   *\n   * It's also used for connecting `items` and `selectedItems` values when they don't reference the same object.\n   */\n  trackBy?: CardsProps.TrackBy<T>;\n  /**\n   * Specifies the selection mode. It can be either `single` or `multi`.\n   */\n  selectionType?: CardsProps.SelectionType;\n  /**\n   * Specifies the list of selected items.\n   */\n  selectedItems?: ReadonlyArray<T>;\n  /**\n   * Determines which items are disabled. If an item is disabled, users can't select it.\n   */\n  isItemDisabled?: CardsProps.IsItemDisabled<T>;\n  /**\n   * Adds labels to the selection components (checkboxes and radio buttons) as follows:\n   * * `itemSelectionLabel` ((SelectionState, Item) => string) - Determines the label for an item.\n   * * `selectionGroupLabel` (string) - Specifies the label for the group selection control.\n   * * `cardsLabel` (string) - Provides alternative text for the cards list.\n   *                            By default the contents of the `header` are used.\n   *\n   * You can use the first arguments of type `SelectionState` to access the current selection\n   * state of the component (for example, the `selectedItems` list). The label function for individual\n   * items also receives the corresponding  `Item` object. You can use the group label to\n   * add a meaningful description to the whole selection.\n   */\n  ariaLabels?: CardsProps.AriaLabels<T>;\n  /**\n   * Specifies an array containing the `id` of each visible section. If not set, all sections are displayed.\n   *\n   * Use it in conjunction with the visible content preference of the [collection preferences](/components/collection-preferences/) component.\n   *\n   * The order of `id`s doesn't influence the order of display of sections, which is controlled by the `cardDefinition` property.\n   */\n  visibleSections?: ReadonlyArray<string>;\n  /**\n   * Called when a user interaction causes a change in the list of selected items.\n   * The event `detail` contains the current list of `selectedItems`.\n   */\n  onSelectionChange?: NonCancelableEventHandler<CardsProps.SelectionChangeDetail<T>>;\n  /**\n   * If set to true, the cards header remains visible when the user scrolls down.\n   */\n  stickyHeader?: boolean;\n  /**\n   * Optionally provide a vertical offset (in pixels) for the sticky header, for example if you\n   * need to position the sticky header below other fixed position elements on the page.\n   */\n  stickyHeaderVerticalOffset?: number;\n\n  /**\n   * Use this property to inform screen readers how many cards there are.\n   * It specifies the total number of cards.\n   * If there is an unknown total number of cards, leave this property undefined.   */\n  totalItemsCount?: number;\n  /**\n   *  Use this property to inform screen readers which range of cards is currently displayed.\n   *  It specifies the index (1-based) of the first card.\n   *  If the cards list has no pagination, leave this property undefined.   */\n  firstIndex?: number;\n  /**\n   * Use this function to announce page changes to screen reader users.\n   * Requires the properties firstIndex and totalItemsCount to be set correctly.\n   */\n  renderAriaLive?: (data: CardsProps.LiveAnnouncement) => string;\n\n  /**\n   * Specify a cards variant with one of the following:\n   * * `container` - Use this variant to have the cards displayed as a container.\n   * * `full-page` – Use this variant when cards are the entire content of a page. Full page variants\n   *                 implement the high contrast header and content behavior automatically.\n   * @visualrefresh `full-page` variant\n   */\n  variant?: 'container' | 'full-page';\n}\n\nexport namespace CardsProps {\n  export interface CardDefinition<T> {\n    header?(item: T): React.ReactNode;\n    sections?: ReadonlyArray<SectionDefinition<T>>;\n  }\n\n  export interface SectionDefinition<T> {\n    id?: string;\n    header?: React.ReactNode;\n    content?(item: T): React.ReactNode;\n    width?: number;\n  }\n\n  export interface CardsLayout {\n    cards: number;\n    minWidth?: number;\n  }\n\n  export type TrackBy<T> = string | ((item: T) => string);\n\n  export type SelectionType = 'single' | 'multi';\n\n  export interface SelectionState<T> {\n    selectedItems: ReadonlyArray<T>;\n  }\n\n  export interface SelectionChangeDetail<T> {\n    selectedItems: T[];\n  }\n\n  export type IsItemDisabled<T> = (item: T) => boolean;\n\n  export interface AriaLabels<T> {\n    itemSelectionLabel: (data: CardsProps.SelectionState<T>, row: T) => string;\n    selectionGroupLabel: string;\n    cardsLabel?: string;\n  }\n\n  export interface LiveAnnouncement {\n    totalItemsCount?: number;\n    firstIndex: number;\n    lastIndex: number;\n  }\n\n  export interface Ref {\n    /**\n     * When the sticky header is enabled, calling this function scrolls cards's\n     * scroll parent up to reveal the first card or row of cards.\n     */\n    scrollToTop(): void;\n  }\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"lib/default/","sources":["cards/interfaces.tsx"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { NonCancelableEventHandler } from '../internal/events';\n\n/*\n * HACK: Cast the component to a named parametrized interface.\n *\n * This lets us use React.forwardRef and still let the component have type\n * parameters, and the naming convention lets the documenter know that this is\n * a forwardRef-wrapped component.\n *\n * We don't need to expose this type to customers because it's just a simple\n * function type.\n */\nexport interface CardsForwardRefType {\n  <T>(props: CardsProps<T> & { ref?: React.Ref<CardsProps.Ref> }): JSX.Element;\n}\n\nexport interface CardsProps<T = any> extends BaseComponentProps {\n  /**\n   * Displayed only when the list of items is empty.\n   */\n  empty?: React.ReactNode;\n\n  /**\n   * Heading element of the table container. Use the [header component](/components/header/).\n   */\n  header?: React.ReactNode;\n\n  /**\n   * Use this slot to add filtering controls to the component.\n   */\n  filter?: React.ReactNode;\n\n  /**\n   * Use this slot to add the [pagination component](/components/pagination/) to the component.\n   */\n  pagination?: React.ReactNode;\n\n  /**\n   * Use this slot to add [collection preferences](/components/collection-preferences/) to the component.\n   */\n  preferences?: React.ReactNode;\n\n  /**\n   * Specifies the items that serve as data source for a card.\n   *\n   * The `cardDefinition` property handles the display of this data.\n   */\n  items: ReadonlyArray<T>;\n\n  /**\n   * Renders the cards in a loading state. We recommend that you also set a `loadingText`.\n   */\n  loading?: boolean;\n\n  /**\n   * Specifies the text to display when in loading state.\n   */\n  loadingText?: string;\n\n  /**\n   *  Defines what to display in each card. It has the following properties:\n   *  * `header` ((item) => ReactNode) - Responsible for displaying the card header. You receive the current item as an argument.\n   *      Use `fontSize=\"heading-m\"` on [link](/components/link/) components inside card header.\n   *  * `sections` (array) - Responsible for displaying the card content. Cards can have many sections in their\n   *    body. Each entry in the array is responsible for displaying a section. An entry has the following properties:\n   *    * `id`: (string) - A unique identifier for the section. The property is used as a [keys](https://reactjs.org/docs/lists-and-keys.html#keys)\n   *   source for React rendering, and to match entries in the `visibleSections` property (if it's defined).\n   *    * `header`: (ReactNode) - Responsible for displaying the section header.\n   *    * `content`: ((item) => ReactNode) - Responsible for displaying the section content. You receive the current item as an argument.\n   *    * `width`: (number) - Specifies the width of the card section in percent. Use this to display multiple sections in\n   *    the same row. The default value is 100%.\n   *\n   *  All of the above properties are optional.\n   */\n  cardDefinition: CardsProps.CardDefinition<T>;\n  /**\n   * Determines the number of cards per row for any interval of container width.\n   * It's an array whose entries are objects containing the following:\n   * - `cards` (number) - Specifies the number of cards per row.\n   * - `minWidth` (number) - Specifies the minimum container width (in pixels) for which this configuration object should apply.\n   *\n   * For example, with this configuration:\n   * ```\n   * [{\n   *   cards: 1\n   * }, {\n   *   minWidth: 500,\n   *   cards: 2\n   * }, {\n   *   minWidth: 800,\n   *   cards: 3\n   * }]\n   * ```\n   *\n   * the cards component displays:\n   * * 1 card per row when the container width is below 500px.\n   * * 2 cards per row when the container width is between 500px and 799px.\n   * * 3 cards per row when the container width is 800px or wider.\n   *\n   * The number of cards per row can't be greater than 20.\n   *\n   * Default value:\n   * ```\n   * [{\n   *   cards: 1\n   * }, {\n   *   minWidth: 768,\n   *   cards: 2\n   * }, {\n   *   minWidth: 992,\n   *   cards: 3\n   * }, {\n   *   minWidth: 1200,\n   *   cards: 4\n   * }, {\n   *   minWidth: 1400,\n   *   cards: 5\n   * }, {\n   *   minWidth: 1920,\n   *   cards: 6\n   * }]\n   * ```\n   */\n  cardsPerRow?: ReadonlyArray<CardsProps.CardsLayout>;\n  /**\n   * Specifies the property inside items that uniquely identifies them.\n   * When it's set, it's used to provide [keys for React](https://reactjs.org/docs/lists-and-keys.html#keys)\n   * for performance optimizations.\n   *\n   * It's also used for connecting `items` and `selectedItems` values when they don't reference the same object.\n   */\n  trackBy?: CardsProps.TrackBy<T>;\n  /**\n   * Specifies the selection mode. It can be either `single` or `multi`.\n   */\n  selectionType?: CardsProps.SelectionType;\n  /**\n   * Specifies the list of selected items.\n   */\n  selectedItems?: ReadonlyArray<T>;\n  /**\n   * Determines which items are disabled. If an item is disabled, users can't select it.\n   */\n  isItemDisabled?: CardsProps.IsItemDisabled<T>;\n  /**\n   * Adds labels to the selection components (checkboxes and radio buttons) as follows:\n   * * `itemSelectionLabel` ((SelectionState, Item) => string) - Determines the label for an item.\n   * * `selectionGroupLabel` (string) - Specifies the label for the group selection control.\n   * * `cardsLabel` (string) - Provides alternative text for the cards list.\n   *                            By default the contents of the `header` are used.\n   *\n   * You can use the first arguments of type `SelectionState` to access the current selection\n   * state of the component (for example, the `selectedItems` list). The label function for individual\n   * items also receives the corresponding  `Item` object. You can use the group label to\n   * add a meaningful description to the whole selection.\n   * @i18n\n   */\n  ariaLabels?: CardsProps.AriaLabels<T>;\n  /**\n   * Specifies an array containing the `id` of each visible section. If not set, all sections are displayed.\n   *\n   * Use it in conjunction with the visible content preference of the [collection preferences](/components/collection-preferences/) component.\n   *\n   * The order of `id`s doesn't influence the order of display of sections, which is controlled by the `cardDefinition` property.\n   */\n  visibleSections?: ReadonlyArray<string>;\n  /**\n   * Called when a user interaction causes a change in the list of selected items.\n   * The event `detail` contains the current list of `selectedItems`.\n   */\n  onSelectionChange?: NonCancelableEventHandler<CardsProps.SelectionChangeDetail<T>>;\n  /**\n   * If set to true, the cards header remains visible when the user scrolls down.\n   */\n  stickyHeader?: boolean;\n  /**\n   * Optionally provide a vertical offset (in pixels) for the sticky header, for example if you\n   * need to position the sticky header below other fixed position elements on the page.\n   */\n  stickyHeaderVerticalOffset?: number;\n\n  /**\n   * Use this property to inform screen readers how many cards there are.\n   * It specifies the total number of cards.\n   * If there is an unknown total number of cards, leave this property undefined.   */\n  totalItemsCount?: number;\n  /**\n   *  Use this property to inform screen readers which range of cards is currently displayed.\n   *  It specifies the index (1-based) of the first card.\n   *  If the cards list has no pagination, leave this property undefined.   */\n  firstIndex?: number;\n  /**\n   * Use this function to announce page changes to screen reader users.\n   * Requires the properties firstIndex and totalItemsCount to be set correctly.\n   */\n  renderAriaLive?: (data: CardsProps.LiveAnnouncement) => string;\n\n  /**\n   * Specify a cards variant with one of the following:\n   * * `container` - Use this variant to have the cards displayed as a container.\n   * * `full-page` – Use this variant when cards are the entire content of a page. Full page variants\n   *                 implement the high contrast header and content behavior automatically.\n   * @visualrefresh `full-page` variant\n   */\n  variant?: 'container' | 'full-page';\n}\n\nexport namespace CardsProps {\n  export interface CardDefinition<T> {\n    header?(item: T): React.ReactNode;\n    sections?: ReadonlyArray<SectionDefinition<T>>;\n  }\n\n  export interface SectionDefinition<T> {\n    id?: string;\n    header?: React.ReactNode;\n    content?(item: T): React.ReactNode;\n    width?: number;\n  }\n\n  export interface CardsLayout {\n    cards: number;\n    minWidth?: number;\n  }\n\n  export type TrackBy<T> = string | ((item: T) => string);\n\n  export type SelectionType = 'single' | 'multi';\n\n  export interface SelectionState<T> {\n    selectedItems: ReadonlyArray<T>;\n  }\n\n  export interface SelectionChangeDetail<T> {\n    selectedItems: T[];\n  }\n\n  export type IsItemDisabled<T> = (item: T) => boolean;\n\n  export interface AriaLabels<T> {\n    itemSelectionLabel: (data: CardsProps.SelectionState<T>, row: T) => string;\n    selectionGroupLabel: string;\n    cardsLabel?: string;\n  }\n\n  export interface LiveAnnouncement {\n    totalItemsCount?: number;\n    firstIndex: number;\n    lastIndex: number;\n  }\n\n  export interface Ref {\n    /**\n     * When the sticky header is enabled, calling this function scrolls cards's\n     * scroll parent up to reveal the first card or row of cards.\n     */\n    scrollToTop(): void;\n  }\n}\n"]}