@cloudscape-design/components-themeable 3.0.1137 → 3.0.1138

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "5e1e4331db4541c2761041021525d061b4873e7b"
+  "commit": "4e4cdd5b1ee27f9f383b1ea15118b39dcce1a7e6"
 }

package/lib/internal/scss/internal/generated/custom-css-properties/index.scss

@@ -1,103 +1,107 @@
 
     // Build environment
-    $awsui-commit-hash: "5e1e4331";
+    $awsui-commit-hash: "4e4cdd5b";
     // Manually managed CSS-variables
-    $maxContentWidth: --awsui-max-content-width-b75yp7;
-$minContentWidth: --awsui-min-content-width-b75yp7;
-$breadcrumbsGap: --awsui-breadcrumbs-gap-b75yp7;
-$contentGapLeft: --awsui-content-gap-left-b75yp7;
-$contentGapRight: --awsui-content-gap-right-b75yp7;
-$contentHeight: --awsui-content-height-b75yp7;
-$contentLayoutDefaultHorizontalPadding: --awsui-content-layout-default-horizontal-padding-b75yp7;
-$contentLayoutMaxContentWidth: --awsui-content-layout-max-content-width-b75yp7;
-$contentLayoutMainGap: --awsui-content-layout-main-gap-b75yp7;
-$defaultMaxContentWidth: --awsui-default-max-content-width-b75yp7;
-$defaultMinContentWidth: --awsui-default-min-content-width-b75yp7;
-$drawerSize: --awsui-drawer-size-b75yp7;
-$drawerMinSize: --awsui-drawer-min-size-b75yp7;
-$bottomDrawerSize: --awsui-bottom-drawer-size-b75yp7;
-$footerHeight: --awsui-footer-height-b75yp7;
-$headerGap: --awsui-header-gap-b75yp7;
-$headerHeight: --awsui-header-height-b75yp7;
-$layoutWidth: --awsui-layout-width-b75yp7;
-$mainGap: --awsui-main-gap-b75yp7;
-$mainOffsetLeft: --awsui-main-offset-left-b75yp7;
-$mainTemplateRows: --awsui-main-template-rows-b75yp7;
-$mobileBarHeight: --awsui-mobile-bar-height-b75yp7;
-$notificationsHeight: --awsui-notifications-height-b75yp7;
-$offsetTop: --awsui-offset-top-b75yp7;
-$overlapHeight: --awsui-overlap-height-b75yp7;
-$navigationWidth: --awsui-navigation-width-b75yp7;
-$splitPanelReportedHeaderSize: --awsui-split-panel-reported-header-size-b75yp7;
-$splitPanelReportedSize: --awsui-split-panel-reported-size-b75yp7;
-$splitPanelHeight: --awsui-split-panel-height-b75yp7;
-$splitPanelMinWidth: --awsui-split-panel-min-width-b75yp7;
-$splitPanelMaxWidth: --awsui-split-panel-max-width-b75yp7;
-$toolsMaxWidth: --awsui-tools-max-width-b75yp7;
-$toolsWidth: --awsui-tools-width-b75yp7;
-$toolsAnimationStartingOpacity: --awsui-tools-animation-starting-opacity-b75yp7;
-$contentScrollMargin: --awsui-content-scroll-margin-b75yp7;
-$flashbarStackDepth: --awsui-flashbar-stack-depth-b75yp7;
-$flashbarStackIndex: --awsui-flashbar-stack-index-b75yp7;
-$flashbarStickyBottomMargin: --awsui-flashbar-sticky-bottom-margin-b75yp7;
-$stackedNotificationsBottomMargin: --awsui-stacked-notifications-bottom-margin-b75yp7;
-$stackedNotificationsDefaultBottomMargin: --awsui-stacked-notifications-default-bottom-margin-b75yp7;
-$dropdownDefaultMaxWidth: --awsui-dropdown-default-max-width-b75yp7;
-$spinnerRotatorFrom: --awsui-spinner-rotator-from-b75yp7;
-$spinnerRotatorTo: --awsui-spinner-rotator-to-b75yp7;
-$spinnerLineLeftFrom: --awsui-spinner-line-left-from-b75yp7;
-$spinnerLineLeftTo: --awsui-spinner-line-left-to-b75yp7;
-$spinnerLineRightFrom: --awsui-spinner-line-right-from-b75yp7;
-$spinnerLineRightTo: --awsui-spinner-line-right-to-b75yp7;
-$sliderLabelCount: --awsui-slider-label-count-b75yp7;
-$sliderTickCount: --awsui-slider-tick-count-b75yp7;
-$sliderReferenceColumn: --awsui-slider-reference-column-b75yp7;
-$sliderNextReferenceColumn: --awsui-slider-next-reference-column-b75yp7;
-$sliderMaxStart: --awsui-slider-max-start-b75yp7;
-$sliderMinEnd: --awsui-slider-min-end-b75yp7;
-$sliderRangeInlineSize: --awsui-slider-range-inline-size-b75yp7;
-$sliderTooltipPosition: --awsui-slider-tooltip-position-b75yp7;
-$togglesLeftWidth: --awsui-toggles-left-width-b75yp7;
-$togglesRightWidth: --awsui-toggles-right-width-b75yp7;
-$promptInputMaxRows: --awsui-prompt-input-max-rows-b75yp7;
-$promptInputScrollHeight: --awsui-prompt-input-scroll-height-b75yp7;
-$dragHandleAnimationInlineOffset: --awsui-drag-handle-animation-inline-offset-b75yp7;
-$dragHandleAnimationBlockOffset: --awsui-drag-handle-animation-block-offset-b75yp7;
-$styleBackgroundActive: --awsui-style-background-active-b75yp7;
-$styleBackgroundDefault: --awsui-style-background-default-b75yp7;
-$styleBackgroundDisabled: --awsui-style-background-disabled-b75yp7;
-$styleBackgroundHover: --awsui-style-background-hover-b75yp7;
-$styleBorderColorActive: --awsui-style-border-color-active-b75yp7;
-$styleBorderColorDefault: --awsui-style-border-color-default-b75yp7;
-$styleBorderColorDisabled: --awsui-style-border-color-disabled-b75yp7;
-$styleBorderColorHover: --awsui-style-border-color-hover-b75yp7;
-$styleColorActive: --awsui-style-color-active-b75yp7;
-$styleColorDefault: --awsui-style-color-default-b75yp7;
-$styleColorDisabled: --awsui-style-color-disabled-b75yp7;
-$styleColorHover: --awsui-style-color-hover-b75yp7;
-$styleFocusRingBorderColor: --awsui-style-focus-ring-border-color-b75yp7;
-$styleFocusRingBorderRadius: --awsui-style-focus-ring-border-radius-b75yp7;
-$styleFocusRingBorderWidth: --awsui-style-focus-ring-border-width-b75yp7;
-$styleFocusRingBoxShadow: --awsui-style-focus-ring-box-shadow-b75yp7;
-$styleBoxShadowActive: --awsui-style-box-shadow-active-b75yp7;
-$styleBoxShadowDefault: --awsui-style-box-shadow-default-b75yp7;
-$styleBoxShadowDisabled: --awsui-style-box-shadow-disabled-b75yp7;
-$styleBoxShadowHover: --awsui-style-box-shadow-hover-b75yp7;
-$styleBackgroundReadonly: --awsui-style-background-readonly-b75yp7;
-$styleBorderColorReadonly: --awsui-style-border-color-readonly-b75yp7;
-$styleBoxShadowReadonly: --awsui-style-box-shadow-readonly-b75yp7;
-$styleColorReadonly: --awsui-style-color-readonly-b75yp7;
-$styleBackgroundFocus: --awsui-style-background-focus-b75yp7;
-$styleBorderColorFocus: --awsui-style-border-color-focus-b75yp7;
-$styleBoxShadowFocus: --awsui-style-box-shadow-focus-b75yp7;
-$styleColorFocus: --awsui-style-color-focus-b75yp7;
-$stylePlaceholderColor: --awsui-style-placeholder-color-b75yp7;
-$stylePlaceholderFontSize: --awsui-style-placeholder-font-size-b75yp7;
-$stylePlaceholderFontStyle: --awsui-style-placeholder-font-style-b75yp7;
-$stylePlaceholderFontWeight: --awsui-style-placeholder-font-weight-b75yp7;
-$alertFocusRingBorderColor: --awsui-alert-focus-ring-border-color-b75yp7;
-$alertFocusRingBorderRadius: --awsui-alert-focus-ring-border-radius-b75yp7;
-$alertFocusRingBorderWidth: --awsui-alert-focus-ring-border-width-b75yp7;
-$alertFocusRingBoxShadow: --awsui-alert-focus-ring-box-shadow-b75yp7;
-$alertIconColor: --awsui-alert-icon-color-b75yp7;
+    $maxContentWidth: --awsui-max-content-width-9t5olz;
+$minContentWidth: --awsui-min-content-width-9t5olz;
+$breadcrumbsGap: --awsui-breadcrumbs-gap-9t5olz;
+$contentGapLeft: --awsui-content-gap-left-9t5olz;
+$contentGapRight: --awsui-content-gap-right-9t5olz;
+$contentHeight: --awsui-content-height-9t5olz;
+$contentLayoutDefaultHorizontalPadding: --awsui-content-layout-default-horizontal-padding-9t5olz;
+$contentLayoutMaxContentWidth: --awsui-content-layout-max-content-width-9t5olz;
+$contentLayoutMainGap: --awsui-content-layout-main-gap-9t5olz;
+$defaultMaxContentWidth: --awsui-default-max-content-width-9t5olz;
+$defaultMinContentWidth: --awsui-default-min-content-width-9t5olz;
+$drawerSize: --awsui-drawer-size-9t5olz;
+$drawerMinSize: --awsui-drawer-min-size-9t5olz;
+$bottomDrawerSize: --awsui-bottom-drawer-size-9t5olz;
+$footerHeight: --awsui-footer-height-9t5olz;
+$headerGap: --awsui-header-gap-9t5olz;
+$headerHeight: --awsui-header-height-9t5olz;
+$layoutWidth: --awsui-layout-width-9t5olz;
+$mainGap: --awsui-main-gap-9t5olz;
+$mainOffsetLeft: --awsui-main-offset-left-9t5olz;
+$mainTemplateRows: --awsui-main-template-rows-9t5olz;
+$mobileBarHeight: --awsui-mobile-bar-height-9t5olz;
+$notificationsHeight: --awsui-notifications-height-9t5olz;
+$offsetTop: --awsui-offset-top-9t5olz;
+$overlapHeight: --awsui-overlap-height-9t5olz;
+$navigationWidth: --awsui-navigation-width-9t5olz;
+$splitPanelReportedHeaderSize: --awsui-split-panel-reported-header-size-9t5olz;
+$splitPanelReportedSize: --awsui-split-panel-reported-size-9t5olz;
+$splitPanelHeight: --awsui-split-panel-height-9t5olz;
+$splitPanelMinWidth: --awsui-split-panel-min-width-9t5olz;
+$splitPanelMaxWidth: --awsui-split-panel-max-width-9t5olz;
+$toolsMaxWidth: --awsui-tools-max-width-9t5olz;
+$toolsWidth: --awsui-tools-width-9t5olz;
+$toolsAnimationStartingOpacity: --awsui-tools-animation-starting-opacity-9t5olz;
+$contentScrollMargin: --awsui-content-scroll-margin-9t5olz;
+$flashbarStackDepth: --awsui-flashbar-stack-depth-9t5olz;
+$flashbarStackIndex: --awsui-flashbar-stack-index-9t5olz;
+$flashbarStickyBottomMargin: --awsui-flashbar-sticky-bottom-margin-9t5olz;
+$stackedNotificationsBottomMargin: --awsui-stacked-notifications-bottom-margin-9t5olz;
+$stackedNotificationsDefaultBottomMargin: --awsui-stacked-notifications-default-bottom-margin-9t5olz;
+$dropdownDefaultMaxWidth: --awsui-dropdown-default-max-width-9t5olz;
+$spinnerRotatorFrom: --awsui-spinner-rotator-from-9t5olz;
+$spinnerRotatorTo: --awsui-spinner-rotator-to-9t5olz;
+$spinnerLineLeftFrom: --awsui-spinner-line-left-from-9t5olz;
+$spinnerLineLeftTo: --awsui-spinner-line-left-to-9t5olz;
+$spinnerLineRightFrom: --awsui-spinner-line-right-from-9t5olz;
+$spinnerLineRightTo: --awsui-spinner-line-right-to-9t5olz;
+$sliderLabelCount: --awsui-slider-label-count-9t5olz;
+$sliderTickCount: --awsui-slider-tick-count-9t5olz;
+$sliderReferenceColumn: --awsui-slider-reference-column-9t5olz;
+$sliderNextReferenceColumn: --awsui-slider-next-reference-column-9t5olz;
+$sliderMaxStart: --awsui-slider-max-start-9t5olz;
+$sliderMinEnd: --awsui-slider-min-end-9t5olz;
+$sliderRangeInlineSize: --awsui-slider-range-inline-size-9t5olz;
+$sliderTooltipPosition: --awsui-slider-tooltip-position-9t5olz;
+$togglesLeftWidth: --awsui-toggles-left-width-9t5olz;
+$togglesRightWidth: --awsui-toggles-right-width-9t5olz;
+$promptInputMaxRows: --awsui-prompt-input-max-rows-9t5olz;
+$promptInputScrollHeight: --awsui-prompt-input-scroll-height-9t5olz;
+$dragHandleAnimationInlineOffset: --awsui-drag-handle-animation-inline-offset-9t5olz;
+$dragHandleAnimationBlockOffset: --awsui-drag-handle-animation-block-offset-9t5olz;
+$styleBackgroundActive: --awsui-style-background-active-9t5olz;
+$styleBackgroundDefault: --awsui-style-background-default-9t5olz;
+$styleBackgroundDisabled: --awsui-style-background-disabled-9t5olz;
+$styleBackgroundHover: --awsui-style-background-hover-9t5olz;
+$styleBorderColorActive: --awsui-style-border-color-active-9t5olz;
+$styleBorderColorDefault: --awsui-style-border-color-default-9t5olz;
+$styleBorderColorDisabled: --awsui-style-border-color-disabled-9t5olz;
+$styleBorderColorHover: --awsui-style-border-color-hover-9t5olz;
+$styleColorActive: --awsui-style-color-active-9t5olz;
+$styleColorDefault: --awsui-style-color-default-9t5olz;
+$styleColorDisabled: --awsui-style-color-disabled-9t5olz;
+$styleColorHover: --awsui-style-color-hover-9t5olz;
+$styleFocusRingBorderColor: --awsui-style-focus-ring-border-color-9t5olz;
+$styleFocusRingBorderRadius: --awsui-style-focus-ring-border-radius-9t5olz;
+$styleFocusRingBorderWidth: --awsui-style-focus-ring-border-width-9t5olz;
+$styleFocusRingBoxShadow: --awsui-style-focus-ring-box-shadow-9t5olz;
+$styleBoxShadowActive: --awsui-style-box-shadow-active-9t5olz;
+$styleBoxShadowDefault: --awsui-style-box-shadow-default-9t5olz;
+$styleBoxShadowDisabled: --awsui-style-box-shadow-disabled-9t5olz;
+$styleBoxShadowHover: --awsui-style-box-shadow-hover-9t5olz;
+$styleBackgroundReadonly: --awsui-style-background-readonly-9t5olz;
+$styleBorderColorReadonly: --awsui-style-border-color-readonly-9t5olz;
+$styleBoxShadowReadonly: --awsui-style-box-shadow-readonly-9t5olz;
+$styleColorReadonly: --awsui-style-color-readonly-9t5olz;
+$styleBackgroundFocus: --awsui-style-background-focus-9t5olz;
+$styleBorderColorFocus: --awsui-style-border-color-focus-9t5olz;
+$styleBoxShadowFocus: --awsui-style-box-shadow-focus-9t5olz;
+$styleColorFocus: --awsui-style-color-focus-9t5olz;
+$stylePlaceholderColor: --awsui-style-placeholder-color-9t5olz;
+$stylePlaceholderFontSize: --awsui-style-placeholder-font-size-9t5olz;
+$stylePlaceholderFontStyle: --awsui-style-placeholder-font-style-9t5olz;
+$stylePlaceholderFontWeight: --awsui-style-placeholder-font-weight-9t5olz;
+$alertFocusRingBorderColor: --awsui-alert-focus-ring-border-color-9t5olz;
+$alertFocusRingBorderRadius: --awsui-alert-focus-ring-border-radius-9t5olz;
+$alertFocusRingBorderWidth: --awsui-alert-focus-ring-border-width-9t5olz;
+$alertFocusRingBoxShadow: --awsui-alert-focus-ring-box-shadow-9t5olz;
+$alertIconColor: --awsui-alert-icon-color-9t5olz;
+$progressBarBackgroundColor: --awsui-progress-bar-background-color-9t5olz;
+$progressBarBorderRadius: --awsui-progress-bar-border-radius-9t5olz;
+$progressBarHeight: --awsui-progress-bar-height-9t5olz;
+$progressValueBackgroundColor: --awsui-progress-value-background-color-9t5olz;
     

package/lib/internal/scss/progress-bar/styles.scss

@@ -5,8 +5,28 @@
 
 @use '../internal/styles/tokens' as awsui;
 @use '../internal/styles' as styles;
+@use '../internal/generated/custom-css-properties/index.scss' as custom-props;
 @use './motion';
 
+$progress-height: var(#{custom-props.$progressBarHeight}, 0.4 * styles.$base-size);
+$progress-border-radius: var(#{custom-props.$progressBarBorderRadius}, 10px);
+$progress-background-color: var(
+  #{custom-props.$progressBarBackgroundColor},
+  awsui.$color-background-progress-bar-layout-default
+);
+$progress-background-color-in-flash: var(
+  #{custom-props.$progressBarBackgroundColor},
+  awsui.$color-background-progress-bar-layout-in-flash
+);
+$progress-value-background-color: var(
+  #{custom-props.$progressValueBackgroundColor},
+  awsui.$color-background-progress-bar-content-default
+);
+$progress-value-background-color-in-flash: var(
+  #{custom-props.$progressValueBackgroundColor},
+  awsui.$color-background-progress-bar-content-in-flash
+);
+
 .root {
   @include styles.styles-reset;
 }
@@ -71,70 +91,64 @@
 }
 
 @mixin general-progress-background-style {
-  block-size: 0.4 * styles.$base-size;
+  block-size: $progress-height;
   border-block: 0;
   border-inline: none;
   box-sizing: border-box;
-  border-start-start-radius: 10px;
-  border-start-end-radius: 10px;
-  border-end-start-radius: 10px;
-  border-end-end-radius: 10px;
+  border-start-start-radius: $progress-border-radius;
+  border-start-end-radius: $progress-border-radius;
+  border-end-start-radius: $progress-border-radius;
+  border-end-end-radius: $progress-border-radius;
 }
 
 @mixin general-progress-bar-style {
-  border-start-start-radius: 10px;
+  border-start-start-radius: $progress-border-radius;
   border-start-end-radius: 0;
-  border-end-start-radius: 10px;
+  border-end-start-radius: $progress-border-radius;
   border-end-end-radius: 0;
 }
 
-$background-color: awsui.$color-background-progress-bar-layout-default;
-$background-color-in-flash: awsui.$color-background-progress-bar-layout-in-flash;
-
-$bar-color: awsui.$color-background-progress-bar-content-default;
-$bar-color-in-flash: awsui.$color-background-progress-bar-content-in-flash;
-
 .progress {
   inline-size: 100%;
   margin-inline-end: awsui.$space-s;
   min-inline-size: 0;
 
   @include general-progress-background-style;
-  background-color: $background-color;
+  background-color: $progress-background-color;
 
   &::-webkit-progress-bar {
     @include general-progress-background-style;
-    background-color: $background-color;
+    background-color: $progress-background-color;
   }
 
   &::-webkit-progress-value {
     @include general-progress-bar-style;
-    background-color: $bar-color;
+    background-color: $progress-value-background-color;
   }
 
   &.complete::-webkit-progress-value {
-    border-start-start-radius: 10px;
-    border-start-end-radius: 10px;
-    border-end-start-radius: 10px;
-    border-end-end-radius: 10px;
+    border-start-start-radius: $progress-border-radius;
+    border-start-end-radius: $progress-border-radius;
+    border-end-start-radius: $progress-border-radius;
+    border-end-end-radius: $progress-border-radius;
   }
 
   &::-moz-progress-bar {
     @include general-progress-bar-style;
-    background-color: $bar-color;
+    background-color: $progress-value-background-color;
   }
 
   &.progress-in-flash {
-    background-color: $background-color-in-flash;
+    background-color: $progress-background-color-in-flash;
     &::-moz-progress-bar {
-      background-color: $bar-color-in-flash;
+      background-color: $progress-value-background-color-in-flash;
     }
 
     &::-webkit-progress-bar {
-      background-color: $background-color-in-flash;
+      background-color: $progress-background-color-in-flash;
     }
     &::-webkit-progress-value {
-      background-color: $bar-color-in-flash;
+      background-color: $progress-value-background-color-in-flash;
     }
   }
 }

package/lib/internal/scss/radio-group/analytics-metadata/styles.scss

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

package/lib/internal/template/alert/styles.css.js

@@ -1,32 +1,32 @@
 
     import './styles.scoped.css';
     export default {
-  "alert": "awsui_alert_mx3cw_1bu84_193",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1bu84_1",
-  "root": "awsui_root_mx3cw_1bu84_215",
-  "hidden": "awsui_hidden_mx3cw_1bu84_250",
-  "alert-wrapper": "awsui_alert-wrapper_mx3cw_1bu84_299",
-  "initial-hidden": "awsui_initial-hidden_mx3cw_1bu84_311",
-  "header": "awsui_header_mx3cw_1bu84_316",
-  "header-replacement": "awsui_header-replacement_mx3cw_1bu84_317",
-  "action": "awsui_action_mx3cw_1bu84_321",
-  "action-slot": "awsui_action-slot_mx3cw_1bu84_325",
-  "action-button": "awsui_action-button_mx3cw_1bu84_326",
-  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1bu84_330",
-  "text": "awsui_text_mx3cw_1bu84_361",
-  "icon": "awsui_icon_mx3cw_1bu84_368",
-  "message": "awsui_message_mx3cw_1bu84_371",
-  "action-wrapped": "awsui_action-wrapped_mx3cw_1bu84_375",
-  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1bu84_379",
-  "icon-size-big": "awsui_icon-size-big_mx3cw_1bu84_383",
-  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1bu84_387",
-  "content": "awsui_content_mx3cw_1bu84_391",
-  "content-replacement": "awsui_content-replacement_mx3cw_1bu84_392",
-  "dismiss": "awsui_dismiss_mx3cw_1bu84_396",
-  "dismiss-button": "awsui_dismiss-button_mx3cw_1bu84_401",
-  "type-error": "awsui_type-error_mx3cw_1bu84_405",
-  "type-warning": "awsui_type-warning_mx3cw_1bu84_413",
-  "type-success": "awsui_type-success_mx3cw_1bu84_421",
-  "type-info": "awsui_type-info_mx3cw_1bu84_429"
+  "alert": "awsui_alert_mx3cw_qwa12_193",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_qwa12_1",
+  "root": "awsui_root_mx3cw_qwa12_215",
+  "hidden": "awsui_hidden_mx3cw_qwa12_250",
+  "alert-wrapper": "awsui_alert-wrapper_mx3cw_qwa12_299",
+  "initial-hidden": "awsui_initial-hidden_mx3cw_qwa12_311",
+  "header": "awsui_header_mx3cw_qwa12_316",
+  "header-replacement": "awsui_header-replacement_mx3cw_qwa12_317",
+  "action": "awsui_action_mx3cw_qwa12_321",
+  "action-slot": "awsui_action-slot_mx3cw_qwa12_325",
+  "action-button": "awsui_action-button_mx3cw_qwa12_326",
+  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_qwa12_330",
+  "text": "awsui_text_mx3cw_qwa12_361",
+  "icon": "awsui_icon_mx3cw_qwa12_368",
+  "message": "awsui_message_mx3cw_qwa12_371",
+  "action-wrapped": "awsui_action-wrapped_mx3cw_qwa12_375",
+  "icon-size-medium": "awsui_icon-size-medium_mx3cw_qwa12_379",
+  "icon-size-big": "awsui_icon-size-big_mx3cw_qwa12_383",
+  "icon-size-normal": "awsui_icon-size-normal_mx3cw_qwa12_387",
+  "content": "awsui_content_mx3cw_qwa12_391",
+  "content-replacement": "awsui_content-replacement_mx3cw_qwa12_392",
+  "dismiss": "awsui_dismiss_mx3cw_qwa12_396",
+  "dismiss-button": "awsui_dismiss-button_mx3cw_qwa12_401",
+  "type-error": "awsui_type-error_mx3cw_qwa12_405",
+  "type-warning": "awsui_type-warning_mx3cw_qwa12_413",
+  "type-success": "awsui_type-success_mx3cw_qwa12_421",
+  "type-info": "awsui_type-info_mx3cw_qwa12_429"
 };
   

package/lib/internal/template/alert/styles.scoped.css

@@ -190,10 +190,10 @@ 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_alert_mx3cw_1bu84_193:not(#\9) {
-  animation: awsui_awsui-motion-fade-in_mx3cw_1bu84_1 var(--motion-duration-show-paced-agho9h, 180ms) var(--motion-easing-show-paced-vcekro, ease-out);
+.awsui_alert_mx3cw_qwa12_193:not(#\9) {
+  animation: awsui_awsui-motion-fade-in_mx3cw_qwa12_1 var(--motion-duration-show-paced-agho9h, 180ms) var(--motion-easing-show-paced-vcekro, ease-out);
 }
-@keyframes awsui_awsui-motion-fade-in_mx3cw_1bu84_1 {
+@keyframes awsui_awsui-motion-fade-in_mx3cw_qwa12_1 {
   from {
     opacity: 0.2;
   }
@@ -202,17 +202,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_alert_mx3cw_1bu84_193:not(#\9) {
+  .awsui_alert_mx3cw_qwa12_193:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_alert_mx3cw_1bu84_193:not(#\9), .awsui-mode-entering .awsui_alert_mx3cw_1bu84_193:not(#\9) {
+.awsui-motion-disabled .awsui_alert_mx3cw_qwa12_193:not(#\9), .awsui-mode-entering .awsui_alert_mx3cw_qwa12_193:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_mx3cw_1bu84_215:not(#\9) {
+.awsui_root_mx3cw_qwa12_215:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -247,11 +247,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   overflow: hidden;
   display: block;
 }
-.awsui_root_mx3cw_1bu84_215.awsui_hidden_mx3cw_1bu84_250:not(#\9) {
+.awsui_root_mx3cw_qwa12_215.awsui_hidden_mx3cw_qwa12_250:not(#\9) {
   display: none;
 }
 
-.awsui_alert_mx3cw_1bu84_193:not(#\9) {
+.awsui_alert_mx3cw_qwa12_193:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -293,10 +293,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-block: var(--space-alert-vertical-7hsinh, 12px);
   padding-inline: var(--space-alert-horizontal-vvafy5, 20px);
   background-color: var(--color-background-container-content-aemn43, #ffffff);
-  --awsui-alert-focus-ring-box-shadow-b75yp7: 0 0 0 var(--awsui-alert-focus-ring-border-width-b75yp7, 2px) var(--awsui-alert-focus-ring-border-color-b75yp7, var(--color-border-item-focused-r5f6xl, #0073bb));
+  --awsui-alert-focus-ring-box-shadow-9t5olz: 0 0 0 var(--awsui-alert-focus-ring-border-width-9t5olz, 2px) var(--awsui-alert-focus-ring-border-color-9t5olz, var(--color-border-item-focused-r5f6xl, #0073bb));
 }
 
-.awsui_alert-wrapper_mx3cw_1bu84_299:not(#\9) {
+.awsui_alert-wrapper_mx3cw_qwa12_299:not(#\9) {
   flex: 1;
   display: flex;
   flex-direction: row;
@@ -304,46 +304,46 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   column-gap: var(--space-alert-action-left-ii45xs, 20px);
 }
 
-.awsui_hidden_mx3cw_1bu84_250:not(#\9) {
+.awsui_hidden_mx3cw_qwa12_250:not(#\9) {
   display: none;
 }
 
-.awsui_initial-hidden_mx3cw_1bu84_311:not(#\9) {
+.awsui_initial-hidden_mx3cw_qwa12_311:not(#\9) {
   overflow: hidden;
   block-size: 0;
 }
 
-.awsui_header_mx3cw_1bu84_316:not(#\9),
-.awsui_header-replacement_mx3cw_1bu84_317:not(#\9) {
+.awsui_header_mx3cw_qwa12_316:not(#\9),
+.awsui_header-replacement_mx3cw_qwa12_317:not(#\9) {
   font-weight: 700;
 }
 
-.awsui_action_mx3cw_1bu84_321:not(#\9) {
+.awsui_action_mx3cw_qwa12_321:not(#\9) {
   white-space: nowrap;
 }
 
-.awsui_action-slot_mx3cw_1bu84_325:not(#\9),
-.awsui_action-button_mx3cw_1bu84_326:not(#\9) {
+.awsui_action-slot_mx3cw_qwa12_325:not(#\9),
+.awsui_action-button_mx3cw_qwa12_326:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_alert-focus-wrapper_mx3cw_1bu84_330:not(#\9) {
+.awsui_alert-focus-wrapper_mx3cw_qwa12_330:not(#\9) {
   flex: 1;
   min-inline-size: 70%;
   display: grid;
   grid-template-columns: min-content auto;
 }
-.awsui_alert-focus-wrapper_mx3cw_1bu84_330:not(#\9):focus {
+.awsui_alert-focus-wrapper_mx3cw_qwa12_330:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1bu84_330:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_qwa12_330:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1bu84_330:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_qwa12_330:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-button-focus-outline-gutter-vsdlzg, 3px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1bu84_330:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_qwa12_330:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -351,85 +351,85 @@ body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1bu84_330:n
   inset-block-start: calc(-1 * var(--space-button-focus-outline-gutter-vsdlzg, 3px));
   inline-size: calc(100% + var(--space-button-focus-outline-gutter-vsdlzg, 3px) + var(--space-button-focus-outline-gutter-vsdlzg, 3px));
   block-size: calc(100% + var(--space-button-focus-outline-gutter-vsdlzg, 3px) + var(--space-button-focus-outline-gutter-vsdlzg, 3px));
-  border-start-start-radius: var(--awsui-alert-focus-ring-border-radius-b75yp7, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
-  border-start-end-radius: var(--awsui-alert-focus-ring-border-radius-b75yp7, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
-  border-end-start-radius: var(--awsui-alert-focus-ring-border-radius-b75yp7, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
-  border-end-end-radius: var(--awsui-alert-focus-ring-border-radius-b75yp7, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
-  box-shadow: var(--awsui-alert-focus-ring-box-shadow-b75yp7);
+  border-start-start-radius: var(--awsui-alert-focus-ring-border-radius-9t5olz, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
+  border-start-end-radius: var(--awsui-alert-focus-ring-border-radius-9t5olz, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
+  border-end-start-radius: var(--awsui-alert-focus-ring-border-radius-9t5olz, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
+  border-end-end-radius: var(--awsui-alert-focus-ring-border-radius-9t5olz, var(--border-radius-control-default-focus-ring-9xsko1, 2px));
+  box-shadow: var(--awsui-alert-focus-ring-box-shadow-9t5olz);
 }
 
-.awsui_text_mx3cw_1bu84_361:not(#\9) {
+.awsui_text_mx3cw_qwa12_361:not(#\9) {
   min-inline-size: 0;
   padding-block: var(--border-width-button-40y1n5, 1px);
   padding-inline: 0;
   margin-block: var(--space-scaled-xxs-jatbiv, 4px);
   margin-inline: var(--space-xxs-jnczic, 4px);
 }
-.awsui_text_mx3cw_1bu84_361.awsui_icon_mx3cw_1bu84_368:not(#\9) {
+.awsui_text_mx3cw_qwa12_361.awsui_icon_mx3cw_qwa12_368:not(#\9) {
   margin-inline-start: 0;
 }
-.awsui_text_mx3cw_1bu84_361.awsui_message_mx3cw_1bu84_371:not(#\9) {
+.awsui_text_mx3cw_qwa12_361.awsui_message_mx3cw_qwa12_371:not(#\9) {
   margin-inline-end: var(--space-alert-message-right-ipx6aa, 0px);
 }
 
-.awsui_action-wrapped_mx3cw_1bu84_375:not(#\9) {
+.awsui_action-wrapped_mx3cw_qwa12_375:not(#\9) {
   margin-block-end: var(--space-xxs-jnczic, 4px);
 }
 
-.awsui_icon-size-medium_mx3cw_1bu84_379 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_action-wrapped_mx3cw_1bu84_375:not(#\9) {
+.awsui_icon-size-medium_mx3cw_qwa12_379 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_action-wrapped_mx3cw_qwa12_375:not(#\9) {
   margin-inline-start: calc(var(--size-icon-medium-3ovt3t, 16px) + var(--space-xs-kw7k3v, 8px));
 }
 
-.awsui_icon-size-big_mx3cw_1bu84_383 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_action-wrapped_mx3cw_1bu84_375:not(#\9) {
+.awsui_icon-size-big_mx3cw_qwa12_383 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_action-wrapped_mx3cw_qwa12_375:not(#\9) {
   margin-inline-start: calc(var(--size-icon-big-hnqj8f, 32px) + var(--space-xs-kw7k3v, 8px));
 }
 
-.awsui_icon-size-normal_mx3cw_1bu84_387 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_action-wrapped_mx3cw_1bu84_375:not(#\9) {
+.awsui_icon-size-normal_mx3cw_qwa12_387 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_action-wrapped_mx3cw_qwa12_375:not(#\9) {
   margin-inline-start: calc(var(--size-icon-normal-2f5zkr, 16px) + var(--space-xs-kw7k3v, 8px));
 }
 
-.awsui_content_mx3cw_1bu84_391:not(#\9),
-.awsui_content-replacement_mx3cw_1bu84_392:not(#\9) {
+.awsui_content_mx3cw_qwa12_391:not(#\9),
+.awsui_content-replacement_mx3cw_qwa12_392:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_dismiss_mx3cw_1bu84_396:not(#\9) {
+.awsui_dismiss_mx3cw_qwa12_396:not(#\9) {
   margin-inline-end: calc(-1 * var(--space-xxs-jnczic, 4px));
   margin-inline-start: var(--space-s-4a5hs8, 12px);
 }
 
-.awsui_dismiss-button_mx3cw_1bu84_401:not(#\9) {
+.awsui_dismiss-button_mx3cw_qwa12_401:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_type-error_mx3cw_1bu84_405:not(#\9) {
+.awsui_type-error_mx3cw_qwa12_405:not(#\9) {
   border-color: var(--color-border-status-error-jybbdz, #d13212);
   background-color: var(--color-background-status-error-5i5ikf, #fdf3f1);
 }
-.awsui_type-error_mx3cw_1bu84_405 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_alert-focus-wrapper_mx3cw_1bu84_330 > .awsui_icon_mx3cw_1bu84_368:not(#\9) {
-  color: var(--awsui-alert-icon-color-b75yp7, var(--color-text-status-error-aknuvu, #d13212));
+.awsui_type-error_mx3cw_qwa12_405 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_alert-focus-wrapper_mx3cw_qwa12_330 > .awsui_icon_mx3cw_qwa12_368:not(#\9) {
+  color: var(--awsui-alert-icon-color-9t5olz, var(--color-text-status-error-aknuvu, #d13212));
 }
 
-.awsui_type-warning_mx3cw_1bu84_413:not(#\9) {
+.awsui_type-warning_mx3cw_qwa12_413:not(#\9) {
   border-color: var(--color-border-status-warning-qmz1c4, #906806);
   background-color: var(--color-background-status-warning-mvw8w7, #fffef0);
 }
-.awsui_type-warning_mx3cw_1bu84_413 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_alert-focus-wrapper_mx3cw_1bu84_330 > .awsui_icon_mx3cw_1bu84_368:not(#\9) {
-  color: var(--awsui-alert-icon-color-b75yp7, var(--color-text-status-warning-9b45qh, #906806));
+.awsui_type-warning_mx3cw_qwa12_413 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_alert-focus-wrapper_mx3cw_qwa12_330 > .awsui_icon_mx3cw_qwa12_368:not(#\9) {
+  color: var(--awsui-alert-icon-color-9t5olz, var(--color-text-status-warning-9b45qh, #906806));
 }
 
-.awsui_type-success_mx3cw_1bu84_421:not(#\9) {
+.awsui_type-success_mx3cw_qwa12_421:not(#\9) {
   border-color: var(--color-border-status-success-e61wev, #1d8102);
   background-color: var(--color-background-status-success-tkxjye, #f2f8f0);
 }
-.awsui_type-success_mx3cw_1bu84_421 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_alert-focus-wrapper_mx3cw_1bu84_330 > .awsui_icon_mx3cw_1bu84_368:not(#\9) {
-  color: var(--awsui-alert-icon-color-b75yp7, var(--color-text-status-success-yodf3z, #1d8102));
+.awsui_type-success_mx3cw_qwa12_421 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_alert-focus-wrapper_mx3cw_qwa12_330 > .awsui_icon_mx3cw_qwa12_368:not(#\9) {
+  color: var(--awsui-alert-icon-color-9t5olz, var(--color-text-status-success-yodf3z, #1d8102));
 }
 
-.awsui_type-info_mx3cw_1bu84_429:not(#\9) {
+.awsui_type-info_mx3cw_qwa12_429:not(#\9) {
   border-color: var(--color-border-status-info-kp0iif, #0073bb);
   background-color: var(--color-background-status-info-nzp1n3, #f1faff);
 }
-.awsui_type-info_mx3cw_1bu84_429 > .awsui_alert-wrapper_mx3cw_1bu84_299 > .awsui_alert-focus-wrapper_mx3cw_1bu84_330 > .awsui_icon_mx3cw_1bu84_368:not(#\9) {
-  color: var(--awsui-alert-icon-color-b75yp7, var(--color-text-status-info-xt2ka7, #0073bb));
+.awsui_type-info_mx3cw_qwa12_429 > .awsui_alert-wrapper_mx3cw_qwa12_299 > .awsui_alert-focus-wrapper_mx3cw_qwa12_330 > .awsui_icon_mx3cw_qwa12_368:not(#\9) {
+  color: var(--awsui-alert-icon-color-9t5olz, var(--color-text-status-info-xt2ka7, #0073bb));
 }