@cloudscape-design/components-themeable 3.0.1328 → 3.0.1329

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "726348bdaf8f9b4887987c410c61b3c8efe1a8d7"
+  "commit": "4668872c714a83436d34c8917fc68b017e13ed94"
 }

package/lib/internal/scss/anchor-navigation/styles.scss

@@ -9,6 +9,7 @@
 
 $guide-line-width: 2px;
 $guide-line-offset: -2px; // Negative to expand 2px beyond the element
+$anchor-nav-inset-inline: 6px;
 
 .root {
   @include styles.styles-reset;
@@ -35,6 +36,7 @@ $guide-line-offset: -2px; // Negative to expand 2px beyond the element
     position: absolute;
     inset-block-start: $guide-line-offset;
     inline-size: $guide-line-width;
+    inset-inline-start: $anchor-nav-inset-inline;
   }
 }
 
@@ -66,6 +68,7 @@ $guide-line-offset: -2px; // Negative to expand 2px beyond the element
       position: absolute;
       inset-block-start: $guide-line-offset;
       inline-size: $guide-line-width;
+      inset-inline-start: $anchor-nav-inset-inline;
     }
   }
 }

package/lib/internal/scss/expandable-section/styles.scss

@@ -18,7 +18,7 @@ $icon-margin-right-small: calc(awsui.$space-xs - awsui.$space-xxxs);
 $icon-margin-right-medium: awsui.$space-xs;
 $icon-offset-inline: awsui.$space-xxs;
 $icon-offset-block: awsui.$space-xxxs;
-$icon-offset-container: 3px;
+$icon-offset-container: awsui.$space-xxs;
 
 // Total space occupied by the expand icon on the left and its margins.
 // Useful to keep elements correctly aligned.

package/lib/internal/scss/header/styles.scss

@@ -5,6 +5,7 @@
 
 @use '../internal/styles/tokens' as awsui;
 @use '../internal/styles' as styles;
+@use '../internal/styles/utils/theming';
 @use '@cloudscape-design/component-toolkit/internal/focus-visible' as focus-visible;
 
 @function space-heading-button-diff($heading-height) {
@@ -166,6 +167,16 @@
   }
 }
 
+// Inside an expandable section (one-theme), tighten the heading's top padding by the button's
+// top and bottom border widths so it aligns with the button content box.
+.title-variant-h2.title-in-expandable-section {
+  @include theming.one-theme-only {
+    padding-block-start: calc(
+      #{space-heading-button-diff(awsui.$line-height-heading-l)} - 2 * #{awsui.$border-width-button}
+    );
+  }
+}
+
 .root-no-actions.root-has-description > .main > :not(.refresh) {
   &.title-variant-h2,
   &.title-variant-h3 {

package/lib/internal/scss/internal/components/option/styles.scss

@@ -6,6 +6,7 @@
 @use '../../styles' as styles;
 @use '../../styles/tokens' as awsui;
 @use './constants' as constants;
+@use '../../generated/custom-css-properties/index' as custom-props;
 
 .option {
   @include styles.styles-reset;
@@ -100,8 +101,11 @@
 }
 
 .filtering-match-highlight {
-  background-color: awsui.$color-background-dropdown-item-filter-match;
-  color: awsui.$color-text-dropdown-item-filter-match;
+  background-color: var(
+    #{custom-props.$optionFilterMatchBackground},
+    #{awsui.$color-background-dropdown-item-filter-match}
+  );
+  color: var(#{custom-props.$optionFilterMatchColor}, #{awsui.$color-text-dropdown-item-filter-match});
   font-weight: styles.$font-weight-bold;
 }
 

package/lib/internal/scss/internal/components/selectable-item/styles.scss

@@ -5,6 +5,7 @@
 
 @use '../../styles' as styles;
 @use '../../styles/tokens' as awsui;
+@use '../../generated/custom-css-properties/index' as custom-props;
 
 // Box-shadow spread values for simulating borders without layout shifts
 $border-offset: awsui.$border-width-item-selected;
@@ -85,8 +86,8 @@ $neg-divider-w: calc(-1 * #{$divider-w});
   z-index: 1;
 
   border-width: 0;
-  background-color: awsui.$color-background-dropdown-item-default;
-  color: awsui.$color-text-dropdown-item-default;
+  background-color: var(#{custom-props.$optionBackgroundDefault}, #{awsui.$color-background-dropdown-item-default});
+  color: var(#{custom-props.$optionColorDefault}, #{awsui.$color-text-dropdown-item-default});
 
   @include content-pad(awsui.$border-item-width, awsui.$border-item-width);
 
@@ -116,7 +117,7 @@ $neg-divider-w: calc(-1 * #{$divider-w});
   }
 
   &.has-background {
-    background-color: awsui.$color-background-dropdown-item-hover;
+    background-color: var(#{custom-props.$optionBackgroundHighlighted}, #{awsui.$color-background-dropdown-item-hover});
   }
   &.child {
     padding-inline-start: awsui.$border-item-width;
@@ -126,18 +127,18 @@ $neg-divider-w: calc(-1 * #{$divider-w});
   }
 
   &.disabled > .selectable-item-content {
-    color: awsui.$color-text-dropdown-item-disabled;
+    color: var(#{custom-props.$optionColorDisabled}, #{awsui.$color-text-dropdown-item-disabled});
   }
 
   &.highlighted,
   &.selected {
-    color: awsui.$color-text-dropdown-item-highlighted;
+    color: var(#{custom-props.$optionColorHighlighted}, #{awsui.$color-text-dropdown-item-highlighted});
     @include logical-radius(awsui.$border-radius-item);
   }
 
   &.highlighted {
     z-index: 3;
-    background-color: awsui.$color-background-dropdown-item-hover;
+    background-color: var(#{custom-props.$optionBackgroundHighlighted}, #{awsui.$color-background-dropdown-item-hover});
     @include highlighted-shadow;
     &.disabled {
       box-shadow: inset 0 0 0 $border-offset awsui.$color-border-dropdown-item-dimmed-hover;
@@ -153,7 +154,7 @@ $neg-divider-w: calc(-1 * #{$divider-w});
 
   &.selected {
     z-index: 2;
-    background-color: awsui.$color-background-dropdown-item-selected;
+    background-color: var(#{custom-props.$optionBackgroundSelected}, #{awsui.$color-background-dropdown-item-selected});
     @include selected-shadow;
     &.next-item-selected {
       border-end-start-radius: 0;
@@ -176,7 +177,7 @@ $neg-divider-w: calc(-1 * #{$divider-w});
   &.parent {
     &:not(.disabled) {
       > .selectable-item-content {
-        color: awsui.$color-text-dropdown-group-label;
+        color: var(#{custom-props.$optionGroupLabelColor}, #{awsui.$color-text-dropdown-group-label});
       }
     }
     &:not(.interactiveGroups) {

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

@@ -1,164 +1,177 @@
 
     // Build environment
-    $awsui-commit-hash: "726348bd";
+    $awsui-commit-hash: "4668872c";
     // Manually managed CSS-variables
-    $maxContentWidth: --awsui-max-content-width-6b9ypa;
-$minContentWidth: --awsui-min-content-width-6b9ypa;
-$breadcrumbsGap: --awsui-breadcrumbs-gap-6b9ypa;
-$contentGapLeft: --awsui-content-gap-left-6b9ypa;
-$contentGapRight: --awsui-content-gap-right-6b9ypa;
-$contentHeight: --awsui-content-height-6b9ypa;
-$contentLayoutDefaultHorizontalPadding: --awsui-content-layout-default-horizontal-padding-6b9ypa;
-$contentLayoutMaxContentWidth: --awsui-content-layout-max-content-width-6b9ypa;
-$contentLayoutMainGap: --awsui-content-layout-main-gap-6b9ypa;
-$defaultMaxContentWidth: --awsui-default-max-content-width-6b9ypa;
-$defaultMinContentWidth: --awsui-default-min-content-width-6b9ypa;
-$drawerSize: --awsui-drawer-size-6b9ypa;
-$drawerMinSize: --awsui-drawer-min-size-6b9ypa;
-$bottomDrawerSize: --awsui-bottom-drawer-size-6b9ypa;
-$footerHeight: --awsui-footer-height-6b9ypa;
-$headerGap: --awsui-header-gap-6b9ypa;
-$headerHeight: --awsui-header-height-6b9ypa;
-$layoutWidth: --awsui-layout-width-6b9ypa;
-$mainGap: --awsui-main-gap-6b9ypa;
-$mainOffsetLeft: --awsui-main-offset-left-6b9ypa;
-$mainTemplateRows: --awsui-main-template-rows-6b9ypa;
-$mobileBarHeight: --awsui-mobile-bar-height-6b9ypa;
-$notificationsHeight: --awsui-notifications-height-6b9ypa;
-$offsetTop: --awsui-offset-top-6b9ypa;
-$overlapHeight: --awsui-overlap-height-6b9ypa;
-$navigationWidth: --awsui-navigation-width-6b9ypa;
-$splitPanelReportedHeaderSize: --awsui-split-panel-reported-header-size-6b9ypa;
-$splitPanelReportedSize: --awsui-split-panel-reported-size-6b9ypa;
-$splitPanelHeight: --awsui-split-panel-height-6b9ypa;
-$splitPanelMinWidth: --awsui-split-panel-min-width-6b9ypa;
-$splitPanelMaxWidth: --awsui-split-panel-max-width-6b9ypa;
-$toolsMaxWidth: --awsui-tools-max-width-6b9ypa;
-$toolsWidth: --awsui-tools-width-6b9ypa;
-$toolsAnimationStartingOpacity: --awsui-tools-animation-starting-opacity-6b9ypa;
-$contentScrollMargin: --awsui-content-scroll-margin-6b9ypa;
-$flashbarStackDepth: --awsui-flashbar-stack-depth-6b9ypa;
-$flashbarStackIndex: --awsui-flashbar-stack-index-6b9ypa;
-$flashbarStickyBottomMargin: --awsui-flashbar-sticky-bottom-margin-6b9ypa;
-$stackedNotificationsBottomMargin: --awsui-stacked-notifications-bottom-margin-6b9ypa;
-$stackedNotificationsDefaultBottomMargin: --awsui-stacked-notifications-default-bottom-margin-6b9ypa;
-$dropdownDefaultMaxWidth: --awsui-dropdown-default-max-width-6b9ypa;
-$dropdownDefaultMinWidth: --awsui-dropdown-default-min-width-6b9ypa;
-$dropdownContentBorderColor: --awsui-dropdown-content-border-color-6b9ypa;
-$dropdownContentBorderWidth: --awsui-dropdown-content-border-width-6b9ypa;
-$dropdownContentBorderRadius: --awsui-dropdown-content-border-radius-6b9ypa;
-$modalCustomWidth: --awsui-modal-custom-width-6b9ypa;
-$modalCustomHeight: --awsui-modal-custom-height-6b9ypa;
-$spinnerRotatorFrom: --awsui-spinner-rotator-from-6b9ypa;
-$spinnerRotatorTo: --awsui-spinner-rotator-to-6b9ypa;
-$spinnerLineLeftFrom: --awsui-spinner-line-left-from-6b9ypa;
-$spinnerLineLeftTo: --awsui-spinner-line-left-to-6b9ypa;
-$spinnerLineRightFrom: --awsui-spinner-line-right-from-6b9ypa;
-$spinnerLineRightTo: --awsui-spinner-line-right-to-6b9ypa;
-$sliderLabelCount: --awsui-slider-label-count-6b9ypa;
-$sliderTickCount: --awsui-slider-tick-count-6b9ypa;
-$sliderReferenceColumn: --awsui-slider-reference-column-6b9ypa;
-$sliderNextReferenceColumn: --awsui-slider-next-reference-column-6b9ypa;
-$sliderMaxStart: --awsui-slider-max-start-6b9ypa;
-$sliderMinEnd: --awsui-slider-min-end-6b9ypa;
-$sliderRangeInlineSize: --awsui-slider-range-inline-size-6b9ypa;
-$sliderTooltipPosition: --awsui-slider-tooltip-position-6b9ypa;
-$togglesLeftWidth: --awsui-toggles-left-width-6b9ypa;
-$togglesRightWidth: --awsui-toggles-right-width-6b9ypa;
-$promptInputMaxRows: --awsui-prompt-input-max-rows-6b9ypa;
-$promptInputScrollHeight: --awsui-prompt-input-scroll-height-6b9ypa;
-$dragHandleAnimationInlineOffset: --awsui-drag-handle-animation-inline-offset-6b9ypa;
-$dragHandleAnimationBlockOffset: --awsui-drag-handle-animation-block-offset-6b9ypa;
-$styleBackgroundActive: --awsui-style-background-active-6b9ypa;
-$styleBackgroundDefault: --awsui-style-background-default-6b9ypa;
-$styleBackgroundDisabled: --awsui-style-background-disabled-6b9ypa;
-$styleBackgroundHover: --awsui-style-background-hover-6b9ypa;
-$styleBorderColorActive: --awsui-style-border-color-active-6b9ypa;
-$styleBorderColorDefault: --awsui-style-border-color-default-6b9ypa;
-$styleBorderColorDisabled: --awsui-style-border-color-disabled-6b9ypa;
-$styleBorderColorHover: --awsui-style-border-color-hover-6b9ypa;
-$styleColorActive: --awsui-style-color-active-6b9ypa;
-$styleColorDefault: --awsui-style-color-default-6b9ypa;
-$styleColorDisabled: --awsui-style-color-disabled-6b9ypa;
-$styleColorHover: --awsui-style-color-hover-6b9ypa;
-$styleFocusRingBorderColor: --awsui-style-focus-ring-border-color-6b9ypa;
-$styleFocusRingBorderRadius: --awsui-style-focus-ring-border-radius-6b9ypa;
-$styleFocusRingBorderWidth: --awsui-style-focus-ring-border-width-6b9ypa;
-$styleFocusRingBoxShadow: --awsui-style-focus-ring-box-shadow-6b9ypa;
-$styleBoxShadowActive: --awsui-style-box-shadow-active-6b9ypa;
-$styleBoxShadowDefault: --awsui-style-box-shadow-default-6b9ypa;
-$styleBoxShadowDisabled: --awsui-style-box-shadow-disabled-6b9ypa;
-$styleBoxShadowHover: --awsui-style-box-shadow-hover-6b9ypa;
-$styleBackgroundReadonly: --awsui-style-background-readonly-6b9ypa;
-$styleBorderColorReadonly: --awsui-style-border-color-readonly-6b9ypa;
-$styleBoxShadowReadonly: --awsui-style-box-shadow-readonly-6b9ypa;
-$styleColorReadonly: --awsui-style-color-readonly-6b9ypa;
-$styleBackgroundFocus: --awsui-style-background-focus-6b9ypa;
-$styleBorderColorFocus: --awsui-style-border-color-focus-6b9ypa;
-$styleBoxShadowFocus: --awsui-style-box-shadow-focus-6b9ypa;
-$styleColorFocus: --awsui-style-color-focus-6b9ypa;
-$stylePlaceholderColor: --awsui-style-placeholder-color-6b9ypa;
-$stylePlaceholderFontSize: --awsui-style-placeholder-font-size-6b9ypa;
-$stylePlaceholderFontStyle: --awsui-style-placeholder-font-style-6b9ypa;
-$stylePlaceholderFontWeight: --awsui-style-placeholder-font-weight-6b9ypa;
-$styleTabsActiveIndicatorColor: --awsui-style-tabs-active-indicator-color-6b9ypa;
-$styleTabsActiveIndicatorWidth: --awsui-style-tabs-active-indicator-width-6b9ypa;
-$styleTabsActiveIndicatorBorderRadius: --awsui-style-tabs-active-indicator-border-radius-6b9ypa;
-$styleTabsSeparatorColor: --awsui-style-tabs-separator-color-6b9ypa;
-$styleTabsSeparatorWidth: --awsui-style-tabs-separator-width-6b9ypa;
-$alertFocusRingBorderColor: --awsui-alert-focus-ring-border-color-6b9ypa;
-$alertFocusRingBorderRadius: --awsui-alert-focus-ring-border-radius-6b9ypa;
-$alertFocusRingBorderWidth: --awsui-alert-focus-ring-border-width-6b9ypa;
-$alertFocusRingBoxShadow: --awsui-alert-focus-ring-box-shadow-6b9ypa;
-$alertIconColor: --awsui-alert-icon-color-6b9ypa;
-$promptInputStyleBackgroundDefault: --awsui-prompt-input-style-background-default-6b9ypa;
-$promptInputStyleBackgroundDisabled: --awsui-prompt-input-style-background-disabled-6b9ypa;
-$promptInputStyleBackgroundFocus: --awsui-prompt-input-style-background-focus-6b9ypa;
-$promptInputStyleBackgroundHover: --awsui-prompt-input-style-background-hover-6b9ypa;
-$promptInputStyleBackgroundReadonly: --awsui-prompt-input-style-background-readonly-6b9ypa;
-$promptInputStyleBorderColorDefault: --awsui-prompt-input-style-border-color-default-6b9ypa;
-$promptInputStyleBorderColorDisabled: --awsui-prompt-input-style-border-color-disabled-6b9ypa;
-$promptInputStyleBorderColorFocus: --awsui-prompt-input-style-border-color-focus-6b9ypa;
-$promptInputStyleBorderColorHover: --awsui-prompt-input-style-border-color-hover-6b9ypa;
-$promptInputStyleBorderColorReadonly: --awsui-prompt-input-style-border-color-readonly-6b9ypa;
-$promptInputStyleBoxShadowDefault: --awsui-prompt-input-style-box-shadow-default-6b9ypa;
-$promptInputStyleBoxShadowDisabled: --awsui-prompt-input-style-box-shadow-disabled-6b9ypa;
-$promptInputStyleBoxShadowFocus: --awsui-prompt-input-style-box-shadow-focus-6b9ypa;
-$promptInputStyleBoxShadowHover: --awsui-prompt-input-style-box-shadow-hover-6b9ypa;
-$promptInputStyleBoxShadowReadonly: --awsui-prompt-input-style-box-shadow-readonly-6b9ypa;
-$promptInputStyleColorDefault: --awsui-prompt-input-style-color-default-6b9ypa;
-$promptInputStyleColorDisabled: --awsui-prompt-input-style-color-disabled-6b9ypa;
-$promptInputStyleColorFocus: --awsui-prompt-input-style-color-focus-6b9ypa;
-$promptInputStyleColorHover: --awsui-prompt-input-style-color-hover-6b9ypa;
-$promptInputStyleColorReadonly: --awsui-prompt-input-style-color-readonly-6b9ypa;
-$promptInputStylePlaceholderColor: --awsui-prompt-input-style-placeholder-color-6b9ypa;
-$promptInputStylePlaceholderFontSize: --awsui-prompt-input-style-placeholder-font-size-6b9ypa;
-$promptInputStylePlaceholderFontStyle: --awsui-prompt-input-style-placeholder-font-style-6b9ypa;
-$promptInputStylePlaceholderFontWeight: --awsui-prompt-input-style-placeholder-font-weight-6b9ypa;
-$progressBarBackgroundColor: --awsui-progress-bar-background-color-6b9ypa;
-$progressBarBorderRadius: --awsui-progress-bar-border-radius-6b9ypa;
-$progressBarHeight: --awsui-progress-bar-height-6b9ypa;
-$progressValueBackgroundColor: --awsui-progress-value-background-color-6b9ypa;
-$styleSliderTrackBackgroundColor: --awsui-style-slider-track-background-color-6b9ypa;
-$styleSliderRangeBackgroundDefault: --awsui-style-slider-range-background-default-6b9ypa;
-$styleSliderRangeBackgroundActive: --awsui-style-slider-range-background-active-6b9ypa;
-$styleSliderHandleBackgroundDefault: --awsui-style-slider-handle-background-default-6b9ypa;
-$styleSliderHandleBackgroundHover: --awsui-style-slider-handle-background-hover-6b9ypa;
-$styleSliderHandleBackgroundActive: --awsui-style-slider-handle-background-active-6b9ypa;
-$styleSliderHandleBorderRadius: --awsui-style-slider-handle-border-radius-6b9ypa;
-$tokenStyleBackgroundDefault: --awsui-token-style-background-default-6b9ypa;
-$tokenStyleBackgroundDisabled: --awsui-token-style-background-disabled-6b9ypa;
-$tokenStyleBackgroundReadOnly: --awsui-token-style-background-read-only-6b9ypa;
-$tokenStyleBorderColorDefault: --awsui-token-style-border-color-default-6b9ypa;
-$tokenStyleBorderColorDisabled: --awsui-token-style-border-color-disabled-6b9ypa;
-$tokenStyleBorderColorReadOnly: --awsui-token-style-border-color-read-only-6b9ypa;
-$tokenStyleDismissColorDefault: --awsui-token-style-dismiss-color-default-6b9ypa;
-$tokenStyleDismissColorDisabled: --awsui-token-style-dismiss-color-disabled-6b9ypa;
-$tokenStyleDismissColorHover: --awsui-token-style-dismiss-color-hover-6b9ypa;
-$tokenStyleDismissColorReadOnly: --awsui-token-style-dismiss-color-read-only-6b9ypa;
-$styleItemCardBackgroundDefault: --awsui-style-item-card-background-default-6b9ypa;
-$styleItemCardBorderColorDefault: --awsui-style-item-card-border-color-default-6b9ypa;
-$styleItemCardBorderRadius: --awsui-style-item-card-border-radius-6b9ypa;
-$styleItemCardBorderWidthDefault: --awsui-style-item-card-border-width-default-6b9ypa;
-$styleItemCardBoxShadowDefault: --awsui-style-item-card-box-shadow-default-6b9ypa;
+    $maxContentWidth: --awsui-max-content-width-z17rmd;
+$minContentWidth: --awsui-min-content-width-z17rmd;
+$breadcrumbsGap: --awsui-breadcrumbs-gap-z17rmd;
+$contentGapLeft: --awsui-content-gap-left-z17rmd;
+$contentGapRight: --awsui-content-gap-right-z17rmd;
+$contentHeight: --awsui-content-height-z17rmd;
+$contentLayoutDefaultHorizontalPadding: --awsui-content-layout-default-horizontal-padding-z17rmd;
+$contentLayoutMaxContentWidth: --awsui-content-layout-max-content-width-z17rmd;
+$contentLayoutMainGap: --awsui-content-layout-main-gap-z17rmd;
+$defaultMaxContentWidth: --awsui-default-max-content-width-z17rmd;
+$defaultMinContentWidth: --awsui-default-min-content-width-z17rmd;
+$drawerSize: --awsui-drawer-size-z17rmd;
+$drawerMinSize: --awsui-drawer-min-size-z17rmd;
+$bottomDrawerSize: --awsui-bottom-drawer-size-z17rmd;
+$footerHeight: --awsui-footer-height-z17rmd;
+$headerGap: --awsui-header-gap-z17rmd;
+$headerHeight: --awsui-header-height-z17rmd;
+$layoutWidth: --awsui-layout-width-z17rmd;
+$mainGap: --awsui-main-gap-z17rmd;
+$mainOffsetLeft: --awsui-main-offset-left-z17rmd;
+$mainTemplateRows: --awsui-main-template-rows-z17rmd;
+$mobileBarHeight: --awsui-mobile-bar-height-z17rmd;
+$notificationsHeight: --awsui-notifications-height-z17rmd;
+$offsetTop: --awsui-offset-top-z17rmd;
+$overlapHeight: --awsui-overlap-height-z17rmd;
+$navigationWidth: --awsui-navigation-width-z17rmd;
+$splitPanelReportedHeaderSize: --awsui-split-panel-reported-header-size-z17rmd;
+$splitPanelReportedSize: --awsui-split-panel-reported-size-z17rmd;
+$splitPanelHeight: --awsui-split-panel-height-z17rmd;
+$splitPanelMinWidth: --awsui-split-panel-min-width-z17rmd;
+$splitPanelMaxWidth: --awsui-split-panel-max-width-z17rmd;
+$toolsMaxWidth: --awsui-tools-max-width-z17rmd;
+$toolsWidth: --awsui-tools-width-z17rmd;
+$toolsAnimationStartingOpacity: --awsui-tools-animation-starting-opacity-z17rmd;
+$contentScrollMargin: --awsui-content-scroll-margin-z17rmd;
+$flashbarStackDepth: --awsui-flashbar-stack-depth-z17rmd;
+$flashbarStackIndex: --awsui-flashbar-stack-index-z17rmd;
+$flashbarStickyBottomMargin: --awsui-flashbar-sticky-bottom-margin-z17rmd;
+$stackedNotificationsBottomMargin: --awsui-stacked-notifications-bottom-margin-z17rmd;
+$stackedNotificationsDefaultBottomMargin: --awsui-stacked-notifications-default-bottom-margin-z17rmd;
+$dropdownDefaultMaxWidth: --awsui-dropdown-default-max-width-z17rmd;
+$dropdownDefaultMinWidth: --awsui-dropdown-default-min-width-z17rmd;
+$dropdownContentBorderColor: --awsui-dropdown-content-border-color-z17rmd;
+$dropdownContentBorderWidth: --awsui-dropdown-content-border-width-z17rmd;
+$dropdownContentBorderRadius: --awsui-dropdown-content-border-radius-z17rmd;
+$modalCustomWidth: --awsui-modal-custom-width-z17rmd;
+$modalCustomHeight: --awsui-modal-custom-height-z17rmd;
+$spinnerRotatorFrom: --awsui-spinner-rotator-from-z17rmd;
+$spinnerRotatorTo: --awsui-spinner-rotator-to-z17rmd;
+$spinnerLineLeftFrom: --awsui-spinner-line-left-from-z17rmd;
+$spinnerLineLeftTo: --awsui-spinner-line-left-to-z17rmd;
+$spinnerLineRightFrom: --awsui-spinner-line-right-from-z17rmd;
+$spinnerLineRightTo: --awsui-spinner-line-right-to-z17rmd;
+$sliderLabelCount: --awsui-slider-label-count-z17rmd;
+$sliderTickCount: --awsui-slider-tick-count-z17rmd;
+$sliderReferenceColumn: --awsui-slider-reference-column-z17rmd;
+$sliderNextReferenceColumn: --awsui-slider-next-reference-column-z17rmd;
+$sliderMaxStart: --awsui-slider-max-start-z17rmd;
+$sliderMinEnd: --awsui-slider-min-end-z17rmd;
+$sliderRangeInlineSize: --awsui-slider-range-inline-size-z17rmd;
+$sliderTooltipPosition: --awsui-slider-tooltip-position-z17rmd;
+$togglesLeftWidth: --awsui-toggles-left-width-z17rmd;
+$togglesRightWidth: --awsui-toggles-right-width-z17rmd;
+$promptInputMaxRows: --awsui-prompt-input-max-rows-z17rmd;
+$promptInputScrollHeight: --awsui-prompt-input-scroll-height-z17rmd;
+$dragHandleAnimationInlineOffset: --awsui-drag-handle-animation-inline-offset-z17rmd;
+$dragHandleAnimationBlockOffset: --awsui-drag-handle-animation-block-offset-z17rmd;
+$styleBackgroundActive: --awsui-style-background-active-z17rmd;
+$styleBackgroundDefault: --awsui-style-background-default-z17rmd;
+$styleBackgroundDisabled: --awsui-style-background-disabled-z17rmd;
+$styleBackgroundHover: --awsui-style-background-hover-z17rmd;
+$styleBorderColorActive: --awsui-style-border-color-active-z17rmd;
+$styleBorderColorDefault: --awsui-style-border-color-default-z17rmd;
+$styleBorderColorDisabled: --awsui-style-border-color-disabled-z17rmd;
+$styleBorderColorHover: --awsui-style-border-color-hover-z17rmd;
+$styleColorActive: --awsui-style-color-active-z17rmd;
+$styleColorDefault: --awsui-style-color-default-z17rmd;
+$styleColorDisabled: --awsui-style-color-disabled-z17rmd;
+$styleColorHover: --awsui-style-color-hover-z17rmd;
+$styleFocusRingBorderColor: --awsui-style-focus-ring-border-color-z17rmd;
+$styleFocusRingBorderRadius: --awsui-style-focus-ring-border-radius-z17rmd;
+$styleFocusRingBorderWidth: --awsui-style-focus-ring-border-width-z17rmd;
+$styleFocusRingBoxShadow: --awsui-style-focus-ring-box-shadow-z17rmd;
+$styleBoxShadowActive: --awsui-style-box-shadow-active-z17rmd;
+$styleBoxShadowDefault: --awsui-style-box-shadow-default-z17rmd;
+$styleBoxShadowDisabled: --awsui-style-box-shadow-disabled-z17rmd;
+$styleBoxShadowHover: --awsui-style-box-shadow-hover-z17rmd;
+$styleBackgroundReadonly: --awsui-style-background-readonly-z17rmd;
+$styleBorderColorReadonly: --awsui-style-border-color-readonly-z17rmd;
+$styleBoxShadowReadonly: --awsui-style-box-shadow-readonly-z17rmd;
+$styleColorReadonly: --awsui-style-color-readonly-z17rmd;
+$styleBackgroundFocus: --awsui-style-background-focus-z17rmd;
+$styleBorderColorFocus: --awsui-style-border-color-focus-z17rmd;
+$styleBoxShadowFocus: --awsui-style-box-shadow-focus-z17rmd;
+$styleColorFocus: --awsui-style-color-focus-z17rmd;
+$stylePlaceholderColor: --awsui-style-placeholder-color-z17rmd;
+$stylePlaceholderFontSize: --awsui-style-placeholder-font-size-z17rmd;
+$stylePlaceholderFontStyle: --awsui-style-placeholder-font-style-z17rmd;
+$stylePlaceholderFontWeight: --awsui-style-placeholder-font-weight-z17rmd;
+$styleTabsActiveIndicatorColor: --awsui-style-tabs-active-indicator-color-z17rmd;
+$styleTabsActiveIndicatorWidth: --awsui-style-tabs-active-indicator-width-z17rmd;
+$styleTabsActiveIndicatorBorderRadius: --awsui-style-tabs-active-indicator-border-radius-z17rmd;
+$styleTabsSeparatorColor: --awsui-style-tabs-separator-color-z17rmd;
+$styleTabsSeparatorWidth: --awsui-style-tabs-separator-width-z17rmd;
+$alertFocusRingBorderColor: --awsui-alert-focus-ring-border-color-z17rmd;
+$alertFocusRingBorderRadius: --awsui-alert-focus-ring-border-radius-z17rmd;
+$alertFocusRingBorderWidth: --awsui-alert-focus-ring-border-width-z17rmd;
+$alertFocusRingBoxShadow: --awsui-alert-focus-ring-box-shadow-z17rmd;
+$alertIconColor: --awsui-alert-icon-color-z17rmd;
+$promptInputStyleBackgroundDefault: --awsui-prompt-input-style-background-default-z17rmd;
+$promptInputStyleBackgroundDisabled: --awsui-prompt-input-style-background-disabled-z17rmd;
+$promptInputStyleBackgroundFocus: --awsui-prompt-input-style-background-focus-z17rmd;
+$promptInputStyleBackgroundHover: --awsui-prompt-input-style-background-hover-z17rmd;
+$promptInputStyleBackgroundReadonly: --awsui-prompt-input-style-background-readonly-z17rmd;
+$promptInputStyleBorderColorDefault: --awsui-prompt-input-style-border-color-default-z17rmd;
+$promptInputStyleBorderColorDisabled: --awsui-prompt-input-style-border-color-disabled-z17rmd;
+$promptInputStyleBorderColorFocus: --awsui-prompt-input-style-border-color-focus-z17rmd;
+$promptInputStyleBorderColorHover: --awsui-prompt-input-style-border-color-hover-z17rmd;
+$promptInputStyleBorderColorReadonly: --awsui-prompt-input-style-border-color-readonly-z17rmd;
+$promptInputStyleBoxShadowDefault: --awsui-prompt-input-style-box-shadow-default-z17rmd;
+$promptInputStyleBoxShadowDisabled: --awsui-prompt-input-style-box-shadow-disabled-z17rmd;
+$promptInputStyleBoxShadowFocus: --awsui-prompt-input-style-box-shadow-focus-z17rmd;
+$promptInputStyleBoxShadowHover: --awsui-prompt-input-style-box-shadow-hover-z17rmd;
+$promptInputStyleBoxShadowReadonly: --awsui-prompt-input-style-box-shadow-readonly-z17rmd;
+$promptInputStyleColorDefault: --awsui-prompt-input-style-color-default-z17rmd;
+$promptInputStyleColorDisabled: --awsui-prompt-input-style-color-disabled-z17rmd;
+$promptInputStyleColorFocus: --awsui-prompt-input-style-color-focus-z17rmd;
+$promptInputStyleColorHover: --awsui-prompt-input-style-color-hover-z17rmd;
+$promptInputStyleColorReadonly: --awsui-prompt-input-style-color-readonly-z17rmd;
+$promptInputStylePlaceholderColor: --awsui-prompt-input-style-placeholder-color-z17rmd;
+$promptInputStylePlaceholderFontSize: --awsui-prompt-input-style-placeholder-font-size-z17rmd;
+$promptInputStylePlaceholderFontStyle: --awsui-prompt-input-style-placeholder-font-style-z17rmd;
+$promptInputStylePlaceholderFontWeight: --awsui-prompt-input-style-placeholder-font-weight-z17rmd;
+$promptInputMenuStyleBackgroundColor: --awsui-prompt-input-menu-style-background-color-z17rmd;
+$promptInputMenuStyleBorderColor: --awsui-prompt-input-menu-style-border-color-z17rmd;
+$promptInputMenuStyleBorderRadius: --awsui-prompt-input-menu-style-border-radius-z17rmd;
+$promptInputMenuStyleBorderWidth: --awsui-prompt-input-menu-style-border-width-z17rmd;
+$optionBackgroundDefault: --awsui-option-background-default-z17rmd;
+$optionBackgroundHighlighted: --awsui-option-background-highlighted-z17rmd;
+$optionBackgroundSelected: --awsui-option-background-selected-z17rmd;
+$optionColorDefault: --awsui-option-color-default-z17rmd;
+$optionColorHighlighted: --awsui-option-color-highlighted-z17rmd;
+$optionColorDisabled: --awsui-option-color-disabled-z17rmd;
+$optionGroupLabelColor: --awsui-option-group-label-color-z17rmd;
+$optionFilterMatchBackground: --awsui-option-filter-match-background-z17rmd;
+$optionFilterMatchColor: --awsui-option-filter-match-color-z17rmd;
+$progressBarBackgroundColor: --awsui-progress-bar-background-color-z17rmd;
+$progressBarBorderRadius: --awsui-progress-bar-border-radius-z17rmd;
+$progressBarHeight: --awsui-progress-bar-height-z17rmd;
+$progressValueBackgroundColor: --awsui-progress-value-background-color-z17rmd;
+$styleSliderTrackBackgroundColor: --awsui-style-slider-track-background-color-z17rmd;
+$styleSliderRangeBackgroundDefault: --awsui-style-slider-range-background-default-z17rmd;
+$styleSliderRangeBackgroundActive: --awsui-style-slider-range-background-active-z17rmd;
+$styleSliderHandleBackgroundDefault: --awsui-style-slider-handle-background-default-z17rmd;
+$styleSliderHandleBackgroundHover: --awsui-style-slider-handle-background-hover-z17rmd;
+$styleSliderHandleBackgroundActive: --awsui-style-slider-handle-background-active-z17rmd;
+$styleSliderHandleBorderRadius: --awsui-style-slider-handle-border-radius-z17rmd;
+$tokenStyleBackgroundDefault: --awsui-token-style-background-default-z17rmd;
+$tokenStyleBackgroundDisabled: --awsui-token-style-background-disabled-z17rmd;
+$tokenStyleBackgroundReadOnly: --awsui-token-style-background-read-only-z17rmd;
+$tokenStyleBorderColorDefault: --awsui-token-style-border-color-default-z17rmd;
+$tokenStyleBorderColorDisabled: --awsui-token-style-border-color-disabled-z17rmd;
+$tokenStyleBorderColorReadOnly: --awsui-token-style-border-color-read-only-z17rmd;
+$tokenStyleDismissColorDefault: --awsui-token-style-dismiss-color-default-z17rmd;
+$tokenStyleDismissColorDisabled: --awsui-token-style-dismiss-color-disabled-z17rmd;
+$tokenStyleDismissColorHover: --awsui-token-style-dismiss-color-hover-z17rmd;
+$tokenStyleDismissColorReadOnly: --awsui-token-style-dismiss-color-read-only-z17rmd;
+$styleItemCardBackgroundDefault: --awsui-style-item-card-background-default-z17rmd;
+$styleItemCardBorderColorDefault: --awsui-style-item-card-border-color-default-z17rmd;
+$styleItemCardBorderRadius: --awsui-style-item-card-border-radius-z17rmd;
+$styleItemCardBorderWidthDefault: --awsui-style-item-card-border-width-default-z17rmd;
+$styleItemCardBoxShadowDefault: --awsui-style-item-card-box-shadow-default-z17rmd;
     

package/lib/internal/scss/tree-view/tree-item/styles.scss

@@ -52,10 +52,15 @@ $item-toggle-column-width: 28px;
 
     @include theming.one-theme-only {
       align-items: center;
-      > .expand-toggle-wrapper {
-        > .toggle {
-          inset-inline-start: 0px;
-          inset-block-start: 3px;
+      > .expand-toggle-wrapper > .toggle {
+        inset-inline-start: 0px;
+        inset-block-start: 3px;
+      }
+
+      &.with-icon {
+        align-items: baseline;
+        > .expand-toggle-wrapper > .toggle {
+          inset-block-start: 2px;
         }
       }
     }

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

@@ -1,32 +1,32 @@
 
     import './styles.scoped.css';
     export default {
-  "alert": "awsui_alert_mx3cw_1a9ra_193",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1a9ra_1",
-  "root": "awsui_root_mx3cw_1a9ra_215",
-  "hidden": "awsui_hidden_mx3cw_1a9ra_250",
-  "alert-wrapper": "awsui_alert-wrapper_mx3cw_1a9ra_301",
-  "initial-hidden": "awsui_initial-hidden_mx3cw_1a9ra_313",
-  "header": "awsui_header_mx3cw_1a9ra_318",
-  "header-replacement": "awsui_header-replacement_mx3cw_1a9ra_319",
-  "action": "awsui_action_mx3cw_1a9ra_323",
-  "action-slot": "awsui_action-slot_mx3cw_1a9ra_327",
-  "action-button": "awsui_action-button_mx3cw_1a9ra_328",
-  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1a9ra_332",
-  "text": "awsui_text_mx3cw_1a9ra_363",
-  "icon": "awsui_icon_mx3cw_1a9ra_370",
-  "message": "awsui_message_mx3cw_1a9ra_373",
-  "action-wrapped": "awsui_action-wrapped_mx3cw_1a9ra_377",
-  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1a9ra_381",
-  "icon-size-big": "awsui_icon-size-big_mx3cw_1a9ra_385",
-  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1a9ra_389",
-  "content": "awsui_content_mx3cw_1a9ra_393",
-  "content-replacement": "awsui_content-replacement_mx3cw_1a9ra_394",
-  "dismiss": "awsui_dismiss_mx3cw_1a9ra_398",
-  "dismiss-button": "awsui_dismiss-button_mx3cw_1a9ra_403",
-  "type-error": "awsui_type-error_mx3cw_1a9ra_407",
-  "type-warning": "awsui_type-warning_mx3cw_1a9ra_415",
-  "type-success": "awsui_type-success_mx3cw_1a9ra_423",
-  "type-info": "awsui_type-info_mx3cw_1a9ra_431"
+  "alert": "awsui_alert_mx3cw_1ffbv_193",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1ffbv_1",
+  "root": "awsui_root_mx3cw_1ffbv_215",
+  "hidden": "awsui_hidden_mx3cw_1ffbv_250",
+  "alert-wrapper": "awsui_alert-wrapper_mx3cw_1ffbv_301",
+  "initial-hidden": "awsui_initial-hidden_mx3cw_1ffbv_313",
+  "header": "awsui_header_mx3cw_1ffbv_318",
+  "header-replacement": "awsui_header-replacement_mx3cw_1ffbv_319",
+  "action": "awsui_action_mx3cw_1ffbv_323",
+  "action-slot": "awsui_action-slot_mx3cw_1ffbv_327",
+  "action-button": "awsui_action-button_mx3cw_1ffbv_328",
+  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1ffbv_332",
+  "text": "awsui_text_mx3cw_1ffbv_363",
+  "icon": "awsui_icon_mx3cw_1ffbv_370",
+  "message": "awsui_message_mx3cw_1ffbv_373",
+  "action-wrapped": "awsui_action-wrapped_mx3cw_1ffbv_377",
+  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1ffbv_381",
+  "icon-size-big": "awsui_icon-size-big_mx3cw_1ffbv_385",
+  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1ffbv_389",
+  "content": "awsui_content_mx3cw_1ffbv_393",
+  "content-replacement": "awsui_content-replacement_mx3cw_1ffbv_394",
+  "dismiss": "awsui_dismiss_mx3cw_1ffbv_398",
+  "dismiss-button": "awsui_dismiss-button_mx3cw_1ffbv_403",
+  "type-error": "awsui_type-error_mx3cw_1ffbv_407",
+  "type-warning": "awsui_type-warning_mx3cw_1ffbv_415",
+  "type-success": "awsui_type-success_mx3cw_1ffbv_423",
+  "type-info": "awsui_type-info_mx3cw_1ffbv_431"
 };