@cloudscape-design/components-themeable 3.0.1354 → 3.0.1355

package/lib/internal/manifest.json

@@ -1,3 +1,3 @@
 {
-  "commit": "d5642f702352b9da2d63b6f40a6c60ebb6f76c33"
+  "commit": "8ca13603c7f891ce74d343a0caffd6cff0bcab00"
 }

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

@@ -1,6 +1,6 @@
 
     // Build environment
-    $awsui-commit-hash: "d5642f70";
+    $awsui-commit-hash: "8ca13603";
     // Manually managed CSS-variables
     $maxContentWidth: --awsui-max-content-width-esndbs;
 $minContentWidth: --awsui-min-content-width-esndbs;

package/lib/internal/scss/segmented-control/segment.scss

@@ -21,7 +21,7 @@ $selected-background: var(#{custom-props.$styleBackgroundActive}, awsui.$color-b
 $selected-color: var(#{custom-props.$styleColorActive}, awsui.$color-text-segment-active);
 $segment-gap: awsui.$space-static-xxs;
 $segment-divider-width: 1px;
-$segment-radius: calc(awsui.$border-radius-button - 3px);
+$segment-radius: calc(awsui.$border-radius-button - (#{awsui.$border-width-field} + #{awsui.$border-width-button}));
 
 .segment {
   @include styles.font-body-m;

package/lib/internal/scss/spinner/mixins.scss

@@ -8,6 +8,12 @@
 @use '../internal/styles/tokens' as awsui;
 
 $_spinner-sizes: (
+  (
+    name: 'x-small',
+    size: styles.$base-size,
+    iconSizeMap: 12px,
+    supportedLineHeight: awsui.$line-height-body-s,
+  ),
   (
     name: 'normal',
     size: 1.2 * styles.$base-size,

package/lib/internal/scss/spinner/styles.scss

@@ -7,6 +7,7 @@
 @use './mixins' as mixins;
 @use '../internal/styles/tokens' as awsui;
 @use '../internal/generated/custom-css-properties/index' as custom-props;
+@use '../internal/styles/utils/theming' as theming;
 
 @keyframes spinner-rotator {
   0% {
@@ -115,3 +116,15 @@
     animation-name: spinner-line-right;
   }
 }
+
+// One Theme renders x-small/normal status icons with a 1.5px stroke.
+// Match the spinner ring for those sizes only; big/large keep 2px.
+.root.size-x-small,
+.root.size-normal {
+  @include theming.one-theme-only {
+    & > .circle::after {
+      border-block-width: awsui.$border-width-icon-x-small;
+      border-inline-width: awsui.$border-width-icon-x-small;
+    }
+  }
+}

package/lib/internal/template/internal/base-component/styles.scoped.css

@@ -64,5 +64,5 @@
   }
 }
 :root {
-  --awsui-version-info-d5642f70: true;
+  --awsui-version-info-8ca13603: true;
 }

package/lib/internal/template/internal/environment.js

@@ -1,6 +1,6 @@
 export var PACKAGE_SOURCE = "components";
-export var PACKAGE_VERSION = "3.0.0 (d5642f70)";
-export var GIT_SHA = "d5642f70";
+export var PACKAGE_VERSION = "3.0.0 (8ca13603)";
+export var GIT_SHA = "8ca13603";
 export var THEME = "open-source-visual-refresh";
 export var SYSTEM = "core";
 export var ALWAYS_VISUAL_REFRESH = true;

package/lib/internal/template/internal/environment.json

@@ -1,7 +1,7 @@
 {
   "PACKAGE_SOURCE": "components",
-  "PACKAGE_VERSION": "3.0.0 (d5642f70)",
-  "GIT_SHA": "d5642f70",
+  "PACKAGE_VERSION": "3.0.0 (8ca13603)",
+  "GIT_SHA": "8ca13603",
   "THEME": "default",
   "SYSTEM": "core",
   "ALWAYS_VISUAL_REFRESH": false,

package/lib/internal/template/segmented-control/styles.css.js

@@ -1,21 +1,21 @@
 
     import './styles.scoped.css';
     export default {
-  "segment": "awsui_segment_8cbea_18mx2_157",
-  "refresh": "awsui_refresh_8cbea_18mx2_184",
-  "disabled": "awsui_disabled_8cbea_18mx2_190",
-  "selected": "awsui_selected_8cbea_18mx2_247",
-  "icon": "awsui_icon_8cbea_18mx2_257",
-  "with-text": "awsui_with-text_8cbea_18mx2_261",
-  "with-no-text": "awsui_with-no-text_8cbea_18mx2_267",
-  "root": "awsui_root_8cbea_18mx2_272",
-  "segment-part": "awsui_segment-part_8cbea_18mx2_304",
-  "select": "awsui_select_8cbea_18mx2_247",
-  "segment-count-2": "awsui_segment-count-2_8cbea_18mx2_339",
-  "segment-count-3": "awsui_segment-count-3_8cbea_18mx2_343",
-  "segment-count-4": "awsui_segment-count-4_8cbea_18mx2_347",
-  "segment-count-5": "awsui_segment-count-5_8cbea_18mx2_351",
-  "segment-count-6": "awsui_segment-count-6_8cbea_18mx2_355",
-  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_8cbea_18mx2_359"
+  "segment": "awsui_segment_8cbea_10amm_157",
+  "refresh": "awsui_refresh_8cbea_10amm_184",
+  "disabled": "awsui_disabled_8cbea_10amm_190",
+  "selected": "awsui_selected_8cbea_10amm_247",
+  "icon": "awsui_icon_8cbea_10amm_257",
+  "with-text": "awsui_with-text_8cbea_10amm_261",
+  "with-no-text": "awsui_with-no-text_8cbea_10amm_267",
+  "root": "awsui_root_8cbea_10amm_272",
+  "segment-part": "awsui_segment-part_8cbea_10amm_304",
+  "select": "awsui_select_8cbea_10amm_247",
+  "segment-count-2": "awsui_segment-count-2_8cbea_10amm_339",
+  "segment-count-3": "awsui_segment-count-3_8cbea_10amm_343",
+  "segment-count-4": "awsui_segment-count-4_8cbea_10amm_347",
+  "segment-count-5": "awsui_segment-count-5_8cbea_10amm_351",
+  "segment-count-6": "awsui_segment-count-6_8cbea_10amm_355",
+  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_8cbea_10amm_359"
 };
   

package/lib/internal/template/segmented-control/styles.scoped.css

@@ -154,7 +154,7 @@ 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_segment_8cbea_18mx2_157:not(#\9) {
+.awsui_segment_8cbea_10amm_157:not(#\9) {
   font-size: var(--font-size-body-m-tq5a14, 14px);
   line-height: var(--line-height-body-m-5xw6xo, 22px);
   word-wrap: break-word;
@@ -169,10 +169,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   background: var(--awsui-style-background-default-esndbs, var(--color-background-segment-default-6rgn11, #ffffff));
   color: var(--awsui-style-color-default-esndbs, var(--color-text-segment-default-nk7mbi, #545b64));
   overflow: visible;
-  border-start-start-radius: calc(var(--border-radius-button-9k0hrl, 2px) - 3px);
-  border-start-end-radius: calc(var(--border-radius-button-9k0hrl, 2px) - 3px);
-  border-end-start-radius: calc(var(--border-radius-button-9k0hrl, 2px) - 3px);
-  border-end-end-radius: calc(var(--border-radius-button-9k0hrl, 2px) - 3px);
+  border-start-start-radius: calc(var(--border-radius-button-9k0hrl, 2px) - (var(--border-width-field-2365x3, 1px) + var(--border-width-button-lffd4t, 1px)));
+  border-start-end-radius: calc(var(--border-radius-button-9k0hrl, 2px) - (var(--border-width-field-2365x3, 1px) + var(--border-width-button-lffd4t, 1px)));
+  border-end-start-radius: calc(var(--border-radius-button-9k0hrl, 2px) - (var(--border-width-field-2365x3, 1px) + var(--border-width-button-lffd4t, 1px)));
+  border-end-end-radius: calc(var(--border-radius-button-9k0hrl, 2px) - (var(--border-width-field-2365x3, 1px) + var(--border-width-button-lffd4t, 1px)));
   position: relative;
   block-size: calc(100% - var(--space-static-xxs-vzto3j, 4px));
   display: flex;
@@ -181,24 +181,24 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-block: none;
   --awsui-style-focus-ring-box-shadow-esndbs: 0 0 0 var(--awsui-style-focus-ring-border-width-esndbs, 2px) var(--awsui-style-focus-ring-border-color-esndbs, var(--color-border-item-focused-sewkzn, #0073bb));
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):not(.awsui_refresh_8cbea_18mx2_184) {
+.awsui_segment_8cbea_10amm_157:not(#\9):not(.awsui_refresh_8cbea_10amm_184) {
   block-size: calc(100% - var(--space-static-xxs-vzto3j, 4px) - 2 * var(--border-width-field-2365x3, 1px));
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):focus {
+.awsui_segment_8cbea_10amm_157:not(#\9):focus {
   outline: none;
 }
-.awsui_segment_8cbea_18mx2_157.awsui_disabled_8cbea_18mx2_190:not(#\9) {
+.awsui_segment_8cbea_10amm_157.awsui_disabled_8cbea_10amm_190:not(#\9) {
   background: var(--awsui-style-background-disabled-esndbs, var(--color-background-segment-disabled-mjubn7, #ffffff));
   color: var(--awsui-style-color-disabled-esndbs, var(--color-text-interactive-disabled-tuxgxq, #aab7b8));
 }
-body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_segment_8cbea_10amm_157:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_segment_8cbea_10amm_157:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-segmented-control-focus-outline-gutter-sz9jgo, 3px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_segment_8cbea_10amm_157:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -213,7 +213,7 @@ body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focu
   box-shadow: var(--awsui-style-focus-ring-box-shadow-esndbs);
   z-index: 1;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):not(:last-child)::after {
+.awsui_segment_8cbea_10amm_157:not(#\9):not(:last-child)::after {
   content: "";
   position: absolute;
   inset-inline-end: calc(-1 * (var(--space-static-xxs-vzto3j, 4px) + 1px));
@@ -223,53 +223,53 @@ body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focu
   background: var(--color-border-segment-divider-mq01bu, #687078);
   z-index: 1;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):not(.awsui_refresh_8cbea_18mx2_184):not(:last-child)::after {
+.awsui_segment_8cbea_10amm_157:not(#\9):not(.awsui_refresh_8cbea_10amm_184):not(:last-child)::after {
   inset-inline-end: calc(-1 * var(--space-static-xxs-vzto3j, 4px));
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):nth-child(1) {
+.awsui_segment_8cbea_10amm_157:not(#\9):nth-child(1) {
   grid-column: 1;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):nth-child(2) {
+.awsui_segment_8cbea_10amm_157:not(#\9):nth-child(2) {
   grid-column: 2;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):nth-child(3) {
+.awsui_segment_8cbea_10amm_157:not(#\9):nth-child(3) {
   grid-column: 3;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):nth-child(4) {
+.awsui_segment_8cbea_10amm_157:not(#\9):nth-child(4) {
   grid-column: 4;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):nth-child(5) {
+.awsui_segment_8cbea_10amm_157:not(#\9):nth-child(5) {
   grid-column: 5;
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):nth-child(6) {
+.awsui_segment_8cbea_10amm_157:not(#\9):nth-child(6) {
   grid-column: 6;
 }
-.awsui_segment_8cbea_18mx2_157.awsui_selected_8cbea_18mx2_247:not(#\9) {
+.awsui_segment_8cbea_10amm_157.awsui_selected_8cbea_10amm_247:not(#\9) {
   background: var(--awsui-style-background-active-esndbs, var(--color-background-segment-active-ns5rt6, #0073bb));
   color: var(--awsui-style-color-active-esndbs, var(--color-text-segment-active-hbbf1h, #ffffff));
 }
-.awsui_segment_8cbea_18mx2_157:not(#\9):hover:not(.awsui_selected_8cbea_18mx2_247):not(.awsui_disabled_8cbea_18mx2_190):not(:focus) {
+.awsui_segment_8cbea_10amm_157:not(#\9):hover:not(.awsui_selected_8cbea_10amm_247):not(.awsui_disabled_8cbea_10amm_190):not(:focus) {
   background: var(--awsui-style-background-hover-esndbs, var(--color-background-segment-hover-el4hte, #fafafa));
   color: var(--awsui-style-color-hover-esndbs, var(--color-text-segment-hover-qq2b2e, #16191f));
   cursor: pointer;
 }
 
-.awsui_icon_8cbea_18mx2_257:not(#\9) {
+.awsui_icon_8cbea_10amm_257:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_with-text_8cbea_18mx2_261:not(#\9) {
+.awsui_with-text_8cbea_10amm_261:not(#\9) {
   position: relative;
   inset-inline-start: calc(-1 * var(--space-xxs-3o1yoq, 4px));
   margin-inline-end: var(--space-xxs-3o1yoq, 4px);
 }
 
-.awsui_with-no-text_8cbea_18mx2_267:not(#\9) {
+.awsui_with-no-text_8cbea_10amm_267:not(#\9) {
   margin-inline: auto;
   inset-inline: 0;
 }
 
-.awsui_root_8cbea_18mx2_272:not(#\9) {
+.awsui_root_8cbea_10amm_272:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -301,7 +301,7 @@ body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focu
   -moz-osx-font-smoothing: auto;
 }
 
-.awsui_segment-part_8cbea_18mx2_304:not(#\9) {
+.awsui_segment-part_8cbea_10amm_304:not(#\9) {
   display: inline-grid;
   border-inline: solid var(--border-width-field-2365x3, 1px) var(--color-border-segment-wrapper-ofstpm, #687078);
   border-block: solid var(--border-width-field-2365x3, 1px) var(--color-border-segment-wrapper-ofstpm, #687078);
@@ -316,46 +316,46 @@ body[data-awsui-focus-visible=true] .awsui_segment_8cbea_18mx2_157:not(#\9):focu
   padding-inline: calc(var(--space-static-xxs-vzto3j, 4px) - var(--border-width-field-2365x3, 1px));
   gap: calc(var(--space-static-xxs-vzto3j, 4px) * 2 + 1px);
 }
-.awsui_segment-part_8cbea_18mx2_304:not(#\9):not(.awsui_refresh_8cbea_18mx2_184) {
+.awsui_segment-part_8cbea_10amm_304:not(#\9):not(.awsui_refresh_8cbea_10amm_184) {
   padding-inline: calc(var(--space-static-xxxs-opeihl, 2px) + var(--border-width-field-2365x3, 1px));
   padding-block: 0;
   gap: calc(var(--space-static-xxs-vzto3j, 4px) * 2 - 1px);
 }
 @media (max-width: 688px) {
-  .awsui_segment-part_8cbea_18mx2_304:not(#\9) {
+  .awsui_segment-part_8cbea_10amm_304:not(#\9) {
     display: none;
   }
 }
 
-.awsui_select_8cbea_18mx2_247:not(#\9) {
+.awsui_select_8cbea_10amm_247:not(#\9) {
   display: none;
 }
 @media (max-width: 688px) {
-  .awsui_select_8cbea_18mx2_247:not(#\9) {
+  .awsui_select_8cbea_10amm_247:not(#\9) {
     display: block;
   }
 }
 
-.awsui_segment-count-2_8cbea_18mx2_339:not(#\9) {
+.awsui_segment-count-2_8cbea_10amm_339:not(#\9) {
   grid-template-columns: repeat(2, auto);
 }
 
-.awsui_segment-count-3_8cbea_18mx2_343:not(#\9) {
+.awsui_segment-count-3_8cbea_10amm_343:not(#\9) {
   grid-template-columns: repeat(3, auto);
 }
 
-.awsui_segment-count-4_8cbea_18mx2_347:not(#\9) {
+.awsui_segment-count-4_8cbea_10amm_347:not(#\9) {
   grid-template-columns: repeat(4, auto);
 }
 
-.awsui_segment-count-5_8cbea_18mx2_351:not(#\9) {
+.awsui_segment-count-5_8cbea_10amm_351:not(#\9) {
   grid-template-columns: repeat(5, auto);
 }
 
-.awsui_segment-count-6_8cbea_18mx2_355:not(#\9) {
+.awsui_segment-count-6_8cbea_10amm_355:not(#\9) {
   grid-template-columns: repeat(6, auto);
 }
 
-.awsui_disabled-reason-tooltip_8cbea_18mx2_359:not(#\9) {
+.awsui_disabled-reason-tooltip_8cbea_10amm_359:not(#\9) {
   /* used in test-utils or tests */
 }

package/lib/internal/template/segmented-control/styles.selectors.js

@@ -2,21 +2,21 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "segment": "awsui_segment_8cbea_18mx2_157",
-  "refresh": "awsui_refresh_8cbea_18mx2_184",
-  "disabled": "awsui_disabled_8cbea_18mx2_190",
-  "selected": "awsui_selected_8cbea_18mx2_247",
-  "icon": "awsui_icon_8cbea_18mx2_257",
-  "with-text": "awsui_with-text_8cbea_18mx2_261",
-  "with-no-text": "awsui_with-no-text_8cbea_18mx2_267",
-  "root": "awsui_root_8cbea_18mx2_272",
-  "segment-part": "awsui_segment-part_8cbea_18mx2_304",
-  "select": "awsui_select_8cbea_18mx2_247",
-  "segment-count-2": "awsui_segment-count-2_8cbea_18mx2_339",
-  "segment-count-3": "awsui_segment-count-3_8cbea_18mx2_343",
-  "segment-count-4": "awsui_segment-count-4_8cbea_18mx2_347",
-  "segment-count-5": "awsui_segment-count-5_8cbea_18mx2_351",
-  "segment-count-6": "awsui_segment-count-6_8cbea_18mx2_355",
-  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_8cbea_18mx2_359"
+  "segment": "awsui_segment_8cbea_10amm_157",
+  "refresh": "awsui_refresh_8cbea_10amm_184",
+  "disabled": "awsui_disabled_8cbea_10amm_190",
+  "selected": "awsui_selected_8cbea_10amm_247",
+  "icon": "awsui_icon_8cbea_10amm_257",
+  "with-text": "awsui_with-text_8cbea_10amm_261",
+  "with-no-text": "awsui_with-no-text_8cbea_10amm_267",
+  "root": "awsui_root_8cbea_10amm_272",
+  "segment-part": "awsui_segment-part_8cbea_10amm_304",
+  "select": "awsui_select_8cbea_10amm_247",
+  "segment-count-2": "awsui_segment-count-2_8cbea_10amm_339",
+  "segment-count-3": "awsui_segment-count-3_8cbea_10amm_343",
+  "segment-count-4": "awsui_segment-count-4_8cbea_10amm_347",
+  "segment-count-5": "awsui_segment-count-5_8cbea_10amm_351",
+  "segment-count-6": "awsui_segment-count-6_8cbea_10amm_355",
+  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_8cbea_10amm_359"
 };
   

package/lib/internal/template/spinner/internal.d.ts

@@ -1,6 +1,8 @@
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { SpinnerProps } from './interfaces';
-interface InternalSpinnerProps extends SpinnerProps, InternalBaseComponentProps {
+type InternalSpinnerSize = SpinnerProps.Size | 'x-small';
+interface InternalSpinnerProps extends Omit<SpinnerProps, 'size'>, InternalBaseComponentProps {
+    size?: InternalSpinnerSize;
 }
 export default function InternalSpinner({ size, variant, nativeAttributes, __internalRootRef, ...props }: InternalSpinnerProps): JSX.Element;
 export {};

package/lib/internal/template/spinner/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/spinner/internal.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAI5C,UAAU,oBAAqB,SAAQ,YAAY,EAAE,0BAA0B;CAAG;AAElF,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAe,EACf,OAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,oBAAoB,eAgBtB"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/spinner/internal.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAGlF,OAAO,EAAE,YAAY,EAAE,MAAM,cAAc,CAAC;AAK5C,KAAK,mBAAmB,GAAG,YAAY,CAAC,IAAI,GAAG,SAAS,CAAC;AAEzD,UAAU,oBAAqB,SAAQ,IAAI,CAAC,YAAY,EAAE,MAAM,CAAC,EAAE,0BAA0B;IAC3F,IAAI,CAAC,EAAE,mBAAmB,CAAC;CAC5B;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAe,EACf,OAAkB,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,GAAG,KAAK,EACT,EAAE,oBAAoB,eAgBtB"}

package/lib/internal/template/spinner/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/spinner/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,+BAA+B,EAAE,MAAM,iDAAiD,CAAC;AAClG,OAAO,oBAAoB,MAAM,0CAA0C,CAAC;AAG5E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAIrC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,QAAQ,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,GAAG,KAAK,EACa;IACrB,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,+BAA+B,EAAE,CAAC;IAClC,OAAO,CACL,oBAAC,oBAAoB,OACf,SAAS,EACb,GAAG,EAAC,MAAM,EACV,aAAa,EAAC,SAAS,EACvB,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,QAAQ,IAAI,EAAE,CAAC,EAAE,MAAM,CAAC,WAAW,OAAO,EAAE,CAAC,CAAC,EACvG,GAAG,EAAE,iBAAiB;QAEtB,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC,GAAI;QAC/D,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC,GAAI,CAC3C,CACxB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useModalContextLoadingComponent } from '../internal/hooks/use-modal-component-analytics';\nimport WithNativeAttributes from '../internal/utils/with-native-attributes';\nimport { SpinnerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ninterface InternalSpinnerProps extends SpinnerProps, InternalBaseComponentProps {}\n\nexport default function InternalSpinner({\n  size = 'normal',\n  variant = 'normal',\n  nativeAttributes,\n  __internalRootRef,\n  ...props\n}: InternalSpinnerProps) {\n  const baseProps = getBaseProps(props);\n  useModalContextLoadingComponent();\n  return (\n    <WithNativeAttributes\n      {...baseProps}\n      tag=\"span\"\n      componentName=\"Spinner\"\n      nativeAttributes={nativeAttributes}\n      className={clsx(baseProps.className, styles.root, styles[`size-${size}`], styles[`variant-${variant}`])}\n      ref={__internalRootRef}\n    >\n      <span className={clsx(styles.circle, styles['circle-left'])} />\n      <span className={clsx(styles.circle, styles['circle-right'])} />\n    </WithNativeAttributes>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/spinner/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D,OAAO,EAAE,+BAA+B,EAAE,MAAM,iDAAiD,CAAC;AAClG,OAAO,oBAAoB,MAAM,0CAA0C,CAAC;AAG5E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AASrC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,GAAG,QAAQ,EACf,OAAO,GAAG,QAAQ,EAClB,gBAAgB,EAChB,iBAAiB,EACjB,GAAG,KAAK,EACa;IACrB,MAAM,SAAS,GAAG,YAAY,CAAC,KAAK,CAAC,CAAC;IACtC,+BAA+B,EAAE,CAAC;IAClC,OAAO,CACL,oBAAC,oBAAoB,OACf,SAAS,EACb,GAAG,EAAC,MAAM,EACV,aAAa,EAAC,SAAS,EACvB,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,IAAI,CAAC,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,QAAQ,IAAI,EAAE,CAAC,EAAE,MAAM,CAAC,WAAW,OAAO,EAAE,CAAC,CAAC,EACvG,GAAG,EAAE,iBAAiB;QAEtB,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,aAAa,CAAC,CAAC,GAAI;QAC/D,8BAAM,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,cAAc,CAAC,CAAC,GAAI,CAC3C,CACxB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useModalContextLoadingComponent } from '../internal/hooks/use-modal-component-analytics';\nimport WithNativeAttributes from '../internal/utils/with-native-attributes';\nimport { SpinnerProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\n// `x-small` is intentionally internal-only: it matches One Theme's x-small status icons and is not part of the public Spinner API\ntype InternalSpinnerSize = SpinnerProps.Size | 'x-small';\n\ninterface InternalSpinnerProps extends Omit<SpinnerProps, 'size'>, InternalBaseComponentProps {\n  size?: InternalSpinnerSize;\n}\n\nexport default function InternalSpinner({\n  size = 'normal',\n  variant = 'normal',\n  nativeAttributes,\n  __internalRootRef,\n  ...props\n}: InternalSpinnerProps) {\n  const baseProps = getBaseProps(props);\n  useModalContextLoadingComponent();\n  return (\n    <WithNativeAttributes\n      {...baseProps}\n      tag=\"span\"\n      componentName=\"Spinner\"\n      nativeAttributes={nativeAttributes}\n      className={clsx(baseProps.className, styles.root, styles[`size-${size}`], styles[`variant-${variant}`])}\n      ref={__internalRootRef}\n    >\n      <span className={clsx(styles.circle, styles['circle-left'])} />\n      <span className={clsx(styles.circle, styles['circle-right'])} />\n    </WithNativeAttributes>\n  );\n}\n"]}

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

@@ -1,18 +1,19 @@
 
     import './styles.scoped.css';
     export default {
-  "root": "awsui_root_1612d_1h9m8_179",
-  "spinner-rotator": "awsui_spinner-rotator_1612d_1h9m8_1",
-  "size-normal": "awsui_size-normal_1612d_1h9m8_194",
-  "size-big": "awsui_size-big_1612d_1h9m8_202",
-  "size-large": "awsui_size-large_1612d_1h9m8_210",
-  "variant-normal": "awsui_variant-normal_1612d_1h9m8_218",
-  "variant-disabled": "awsui_variant-disabled_1612d_1h9m8_221",
-  "variant-inverted": "awsui_variant-inverted_1612d_1h9m8_224",
-  "circle": "awsui_circle_1612d_1h9m8_236",
-  "circle-left": "awsui_circle-left_1612d_1h9m8_264",
-  "spinner-line-left": "awsui_spinner-line-left_1612d_1h9m8_1",
-  "circle-right": "awsui_circle-right_1612d_1h9m8_269",
-  "spinner-line-right": "awsui_spinner-line-right_1612d_1h9m8_1"
+  "root": "awsui_root_1612d_w14dj_179",
+  "spinner-rotator": "awsui_spinner-rotator_1612d_w14dj_1",
+  "size-x-small": "awsui_size-x-small_1612d_w14dj_194",
+  "size-normal": "awsui_size-normal_1612d_w14dj_202",
+  "size-big": "awsui_size-big_1612d_w14dj_210",
+  "size-large": "awsui_size-large_1612d_w14dj_218",
+  "variant-normal": "awsui_variant-normal_1612d_w14dj_226",
+  "variant-disabled": "awsui_variant-disabled_1612d_w14dj_229",
+  "variant-inverted": "awsui_variant-inverted_1612d_w14dj_232",
+  "circle": "awsui_circle_1612d_w14dj_244",
+  "circle-left": "awsui_circle-left_1612d_w14dj_272",
+  "spinner-line-left": "awsui_spinner-line-left_1612d_w14dj_1",
+  "circle-right": "awsui_circle-right_1612d_w14dj_277",
+  "spinner-line-right": "awsui_spinner-line-right_1612d_w14dj_1"
 };
   

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

@@ -146,7 +146,7 @@ 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
 */
-@keyframes awsui_spinner-rotator_1612d_1h9m8_1 {
+@keyframes awsui_spinner-rotator_1612d_w14dj_1 {
   0% {
     transform: rotate(var(--awsui-spinner-rotator-from-esndbs));
   }
@@ -154,7 +154,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
     transform: rotate(var(--awsui-spinner-rotator-to-esndbs));
   }
 }
-@keyframes awsui_spinner-line-left_1612d_1h9m8_1 {
+@keyframes awsui_spinner-line-left_1612d_w14dj_1 {
   0% {
     transform: rotate(var(--awsui-spinner-line-left-from-esndbs));
   }
@@ -165,7 +165,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
     transform: rotate(var(--awsui-spinner-line-left-from-esndbs));
   }
 }
-@keyframes awsui_spinner-line-right_1612d_1h9m8_1 {
+@keyframes awsui_spinner-line-right_1612d_w14dj_1 {
   0% {
     transform: rotate(var(--awsui-spinner-line-right-from-esndbs));
   }
@@ -176,7 +176,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
     transform: rotate(var(--awsui-spinner-line-right-from-esndbs));
   }
 }
-.awsui_root_1612d_1h9m8_179:not(#\9) {
+.awsui_root_1612d_w14dj_179:not(#\9) {
   --awsui-spinner-rotator-from-esndbs: 0deg;
   --awsui-spinner-rotator-to-esndbs: 360deg;
   --awsui-spinner-line-left-from-esndbs: 0deg;
@@ -186,12 +186,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   display: inline-block;
   vertical-align: top;
   /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
-  animation: awsui_spinner-rotator_1612d_1h9m8_1 0.7s linear infinite;
+  animation: awsui_spinner-rotator_1612d_w14dj_1 0.7s linear infinite;
   box-sizing: border-box;
   line-height: 0;
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
 }
-.awsui_root_1612d_1h9m8_179.awsui_size-normal_1612d_1h9m8_194:not(#\9) {
+.awsui_root_1612d_w14dj_179.awsui_size-x-small_1612d_w14dj_194:not(#\9) {
+  inline-size: 12px;
+  block-size: 12px;
+  padding-block: calc((12px - 10px) / 2);
+  padding-inline: calc((12px - 10px) / 2);
+  margin-block: calc((var(--line-height-body-s-gako33, 16px) - 12px) / 2);
+  box-sizing: border-box;
+}
+.awsui_root_1612d_w14dj_179.awsui_size-normal_1612d_w14dj_202:not(#\9) {
   inline-size: var(--size-icon-normal-311gry, 16px);
   block-size: var(--size-icon-normal-311gry, 16px);
   padding-block: calc((var(--size-icon-normal-311gry, 16px) - 12px) / 2);
@@ -199,7 +207,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block: calc((var(--line-height-body-m-5xw6xo, 22px) - var(--size-icon-normal-311gry, 16px)) / 2);
   box-sizing: border-box;
 }
-.awsui_root_1612d_1h9m8_179.awsui_size-big_1612d_1h9m8_202:not(#\9) {
+.awsui_root_1612d_w14dj_179.awsui_size-big_1612d_w14dj_210:not(#\9) {
   inline-size: var(--size-icon-big-z6z1yl, 32px);
   block-size: var(--size-icon-big-z6z1yl, 32px);
   padding-block: calc((var(--size-icon-big-z6z1yl, 32px) - 24px) / 2);
@@ -207,7 +215,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block: calc((var(--line-height-heading-xl-pi61pg, 36px) - var(--size-icon-big-z6z1yl, 32px)) / 2);
   box-sizing: border-box;
 }
-.awsui_root_1612d_1h9m8_179.awsui_size-large_1612d_1h9m8_210:not(#\9) {
+.awsui_root_1612d_w14dj_179.awsui_size-large_1612d_w14dj_218:not(#\9) {
   inline-size: var(--size-icon-large-uba15s, 48px);
   block-size: var(--size-icon-large-uba15s, 48px);
   padding-block: calc((var(--size-icon-large-uba15s, 48px) - 36px) / 2);
@@ -215,16 +223,16 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-block: calc((var(--line-height-display-l-tjudur, 56px) - var(--size-icon-large-uba15s, 48px)) / 2);
   box-sizing: border-box;
 }
-.awsui_root_1612d_1h9m8_179.awsui_variant-normal_1612d_1h9m8_218:not(#\9) {
+.awsui_root_1612d_w14dj_179.awsui_variant-normal_1612d_w14dj_226:not(#\9) {
   color: currentColor;
 }
-.awsui_root_1612d_1h9m8_179.awsui_variant-disabled_1612d_1h9m8_221:not(#\9) {
+.awsui_root_1612d_w14dj_179.awsui_variant-disabled_1612d_w14dj_229:not(#\9) {
   color: var(--color-text-status-inactive-fqjc97, #687078);
 }
-.awsui_root_1612d_1h9m8_179.awsui_variant-inverted_1612d_1h9m8_224:not(#\9) {
+.awsui_root_1612d_w14dj_179.awsui_variant-inverted_1612d_w14dj_232:not(#\9) {
   color: var(--color-text-inverted-fflnsl, #ffffff);
 }
-.awsui_root_1612d_1h9m8_179:not(#\9):dir(rtl) {
+.awsui_root_1612d_w14dj_179:not(#\9):dir(rtl) {
   --awsui-spinner-rotator-from-esndbs: 360deg;
   --awsui-spinner-rotator-to-esndbs: 0deg;
   --awsui-spinner-line-left-from-esndbs: 0deg;
@@ -233,14 +241,14 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   --awsui-spinner-line-right-to-esndbs: 30deg;
 }
 
-.awsui_circle_1612d_1h9m8_236:not(#\9) {
+.awsui_circle_1612d_w14dj_244:not(#\9) {
   display: inline-block;
   inline-size: 50%;
   block-size: 100%;
   overflow: hidden;
   position: relative;
 }
-.awsui_circle_1612d_1h9m8_236:not(#\9):after {
+.awsui_circle_1612d_w14dj_244:not(#\9):after {
   position: absolute;
   box-sizing: border-box;
   content: "";
@@ -253,7 +261,7 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   border-inline-end-color: transparent;
   border-block-end-color: transparent;
 }
-.awsui_circle_1612d_1h9m8_236:not(#\9):after {
+.awsui_circle_1612d_w14dj_244:not(#\9):after {
   /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
   animation: 1.5s ease-in-out infinite;
   inset-block-start: 0;
@@ -261,13 +269,13 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   block-size: 100%;
   inline-size: 200%;
 }
-.awsui_circle_1612d_1h9m8_236.awsui_circle-left_1612d_1h9m8_264:not(#\9):after {
+.awsui_circle_1612d_w14dj_244.awsui_circle-left_1612d_w14dj_272:not(#\9):after {
   inset-inline-start: 0;
   /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
-  animation-name: awsui_spinner-line-left_1612d_1h9m8_1;
+  animation-name: awsui_spinner-line-left_1612d_w14dj_1;
 }
-.awsui_circle_1612d_1h9m8_236.awsui_circle-right_1612d_1h9m8_269:not(#\9):after {
+.awsui_circle_1612d_w14dj_244.awsui_circle-right_1612d_w14dj_277:not(#\9):after {
   inset-inline-start: -100%;
   /*stylelint-disable-next-line @cloudscape-design/no-motion-outside-of-mixin */
-  animation-name: awsui_spinner-line-right_1612d_1h9m8_1;
+  animation-name: awsui_spinner-line-right_1612d_w14dj_1;
 }

package/lib/internal/template/spinner/styles.selectors.js

@@ -2,18 +2,19 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "root": "awsui_root_1612d_1h9m8_179",
-  "spinner-rotator": "awsui_spinner-rotator_1612d_1h9m8_1",
-  "size-normal": "awsui_size-normal_1612d_1h9m8_194",
-  "size-big": "awsui_size-big_1612d_1h9m8_202",
-  "size-large": "awsui_size-large_1612d_1h9m8_210",
-  "variant-normal": "awsui_variant-normal_1612d_1h9m8_218",
-  "variant-disabled": "awsui_variant-disabled_1612d_1h9m8_221",
-  "variant-inverted": "awsui_variant-inverted_1612d_1h9m8_224",
-  "circle": "awsui_circle_1612d_1h9m8_236",
-  "circle-left": "awsui_circle-left_1612d_1h9m8_264",
-  "spinner-line-left": "awsui_spinner-line-left_1612d_1h9m8_1",
-  "circle-right": "awsui_circle-right_1612d_1h9m8_269",
-  "spinner-line-right": "awsui_spinner-line-right_1612d_1h9m8_1"
+  "root": "awsui_root_1612d_w14dj_179",
+  "spinner-rotator": "awsui_spinner-rotator_1612d_w14dj_1",
+  "size-x-small": "awsui_size-x-small_1612d_w14dj_194",
+  "size-normal": "awsui_size-normal_1612d_w14dj_202",
+  "size-big": "awsui_size-big_1612d_w14dj_210",
+  "size-large": "awsui_size-large_1612d_w14dj_218",
+  "variant-normal": "awsui_variant-normal_1612d_w14dj_226",
+  "variant-disabled": "awsui_variant-disabled_1612d_w14dj_229",
+  "variant-inverted": "awsui_variant-inverted_1612d_w14dj_232",
+  "circle": "awsui_circle_1612d_w14dj_244",
+  "circle-left": "awsui_circle-left_1612d_w14dj_272",
+  "spinner-line-left": "awsui_spinner-line-left_1612d_w14dj_1",
+  "circle-right": "awsui_circle-right_1612d_w14dj_277",
+  "spinner-line-right": "awsui_spinner-line-right_1612d_w14dj_1"
 };
   

package/lib/internal/template/status-indicator/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/status-indicator/internal.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG/C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,WAAW,4BACf,SAAQ,YAAY,CAAC,oBAAoB,EAAE,MAAM,CAAC,EAChD,0BAA0B;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAExB;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,GAAG,cAAc,CAAC;CACvC;AAeD,UAAU,uBAAwB,SAAQ,IAAI,CAAC,4BAA4B,EAAE,MAAM,GAAG,eAAe,CAAC;IACpG,OAAO,CAAC,EAAE,4BAA4B,CAAC,WAAW,CAAC,CAAC;IACpD,IAAI,CAAC,EAAE,4BAA4B,CAAC,QAAQ,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,4BAA4B,CAAC,WAAW,CAAC,CAAC;CACrD;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,aAAa,EACb,OAAO,EACP,OAAO,EACP,IAAe,GAChB,EAAE,uBAAuB,eAWzB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAe,EACf,gBAAgB,EAChB,SAAiB,EACjB,iBAAiB,EACjB,MAA6D,EAC7D,SAA0B,EAC1B,GAAG,IAAI,EACR,EAAE,4BAA4B,eAqC9B"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/status-indicator/internal.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAG/C,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAMjD,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAIpD,MAAM,WAAW,4BACf,SAAQ,YAAY,CAAC,oBAAoB,EAAE,MAAM,CAAC,EAChD,0BAA0B;IAC5B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,MAAM,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IAExB;;OAEG;IACH,SAAS,CAAC,EAAE,QAAQ,GAAG,cAAc,CAAC;CACvC;AAoBD,UAAU,uBAAwB,SAAQ,IAAI,CAAC,4BAA4B,EAAE,MAAM,GAAG,eAAe,CAAC;IACpG,OAAO,CAAC,EAAE,4BAA4B,CAAC,WAAW,CAAC,CAAC;IACpD,IAAI,CAAC,EAAE,4BAA4B,CAAC,QAAQ,CAAC,CAAC;IAC9C,OAAO,CAAC,EAAE,4BAA4B,CAAC,WAAW,CAAC,CAAC;CACrD;AAED,wBAAgB,kBAAkB,CAAC,EACjC,IAAI,EACJ,aAAa,EACb,OAAO,EACP,OAAO,EACP,IAAe,GAChB,EAAE,uBAAuB,eAWzB;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAe,EACf,gBAAgB,EAChB,SAAiB,EACjB,iBAAiB,EACjB,MAA6D,EAC7D,SAA0B,EAC1B,GAAG,IAAI,EACR,EAAE,4BAA4B,eAqC9B"}

package/lib/internal/template/status-indicator/internal.js

@@ -11,18 +11,23 @@ import { getBaseProps } from '../internal/base-component';
 import WithNativeAttributes from '../internal/utils/with-native-attributes';
 import InternalSpinner from '../spinner/internal';
 import styles from './styles.css.js';
-const typeToIcon = size => ({
-    error: React.createElement(InternalIcon, { name: "status-negative", size: size }),
-    warning: React.createElement(InternalIcon, { name: "status-warning", size: size }),
-    success: React.createElement(InternalIcon, { name: "status-positive", size: size }),
-    info: React.createElement(InternalIcon, { name: "status-info", size: size }),
-    stopped: React.createElement(InternalIcon, { name: "status-stopped", size: size }),
-    pending: React.createElement(InternalIcon, { name: "status-pending", size: size }),
-    'in-progress': React.createElement(InternalIcon, { name: "status-in-progress", size: size }),
-    loading: React.createElement(InternalSpinner, null),
-    'not-started': React.createElement(InternalIcon, { name: "status-not-started", size: size }),
-    log: React.createElement(InternalIcon, { name: "dot", size: size }),
-});
+const typeToIcon = size => {
+    // Spinner supports a narrower size set than icons (no 'small'/'medium'/'inherit'); map to a valid
+    // spinner size so the loading spinner matches the sibling status icons.
+    const spinnerSize = size === 'x-small' ? 'x-small' : 'normal';
+    return {
+        error: React.createElement(InternalIcon, { name: "status-negative", size: size }),
+        warning: React.createElement(InternalIcon, { name: "status-warning", size: size }),
+        success: React.createElement(InternalIcon, { name: "status-positive", size: size }),
+        info: React.createElement(InternalIcon, { name: "status-info", size: size }),
+        stopped: React.createElement(InternalIcon, { name: "status-stopped", size: size }),
+        pending: React.createElement(InternalIcon, { name: "status-pending", size: size }),
+        'in-progress': React.createElement(InternalIcon, { name: "status-in-progress", size: size }),
+        loading: React.createElement(InternalSpinner, { size: spinnerSize }),
+        'not-started': React.createElement(InternalIcon, { name: "status-not-started", size: size }),
+        log: React.createElement(InternalIcon, { name: "dot", size: size }),
+    };
+};
 export function InternalStatusIcon({ type, iconAriaLabel, animate, display, size = 'normal', }) {
     return (React.createElement("span", { className: clsx(styles.icon, animate && styles['icon-shake']), "aria-label": iconAriaLabel, role: iconAriaLabel ? 'img' : undefined },
         typeToIcon(size)[type],

package/lib/internal/template/status-indicator/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/status-indicator/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,aAAa,EAAE,KAAK,EAAE,MAAM,+CAA+C,CAAC;AAGrF,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAG1D;;GAEG;AACH,OAAO,oBAAoB,MAAM,0CAA0C,CAAC;AAC5E,OAAO,eAAe,MAAM,qBAAqB,CAAC;AAGlD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAqBrC,MAAM,UAAU,GAA6E,IAAI,CAAC,EAAE,CAAC,CAAC;IACpG,KAAK,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,iBAAiB,EAAC,IAAI,EAAE,IAAI,GAAI;IAC1D,OAAO,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAE,IAAI,GAAI;IAC3D,OAAO,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,iBAAiB,EAAC,IAAI,EAAE,IAAI,GAAI;IAC5D,IAAI,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,aAAa,EAAC,IAAI,EAAE,IAAI,GAAI;IACrD,OAAO,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAE,IAAI,GAAI;IAC3D,OAAO,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,gBAAgB,EAAC,IAAI,EAAE,IAAI,GAAI;IAC3D,aAAa,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,oBAAoB,EAAC,IAAI,EAAE,IAAI,GAAI;IACrE,OAAO,EAAE,oBAAC,eAAe,OAAG;IAC5B,aAAa,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,oBAAoB,EAAC,IAAI,EAAE,IAAI,GAAI;IACrE,GAAG,EAAE,oBAAC,YAAY,IAAC,IAAI,EAAC,KAAK,EAAC,IAAI,EAAE,IAAI,GAAI;CAC7C,CAAC,CAAC;AAQH,MAAM,UAAU,kBAAkB,CAAC,EACjC,IAAI,EACJ,aAAa,EACb,OAAO,EACP,OAAO,EACP,IAAI,GAAG,QAAQ,GACS;IACxB,OAAO,CACL,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,OAAO,IAAI,MAAM,CAAC,YAAY,CAAC,CAAC,gBACjD,aAAa,EACzB,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;QAEtC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CAAC;QACtB,OAAO,KAAK,QAAQ,IAAI,mDAAW,CAC/B,CACR,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAQ,GAAG,IAAI,EACf,gBAAgB,EAChB,SAAS,GAAG,KAAK,EACjB,iBAAiB,EACjB,MAAM,GAAG,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,QAAQ,EAC7D,SAAS,GAAG,cAAc,EAC1B,GAAG,IAAI,EACsB;IAC7B,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,OAAO,CACL,oBAAC,oBAAoB,OACf,SAAS,EACb,GAAG,EAAC,MAAM,EACV,aAAa,EAAC,iBAAiB,EAC/B,gBAAgB,EAAE,gBAAgB,EAClC,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,IAAI,EACX,MAAM,CAAC,UAAU,IAAI,EAAE,CAAC,EACxB;YACE,CAAC,MAAM,CAAC,kBAAkB,aAAa,EAAE,CAAC,CAAC,EAAE,aAAa;SAC3D,EACD,SAAS,CAAC,SAAS,CACpB,EACD,GAAG,EAAE,iBAAiB;QAEtB,8BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,SAAS,EAChB,MAAM,CAAC,WAAW,SAAS,EAAE,CAAC,EAC9B,QAAQ,KAAK,KAAK,IAAI,MAAM,CAAC,mBAAmB,CAAC,EACjD,SAAS,IAAI,MAAM,CAAC,mBAAmB,CAAC,CACzC;YAED,oBAAC,kBAAkB,IACjB,IAAI,EAAE,IAAI,EACV,aAAa,EAAE,aAAa,EAC5B,OAAO,EAAE,SAAS,EAClB,OAAO,EAAE,SAAS,EAClB,IAAI,EAAE,MAAM,GACZ;YACF,kCAAO,QAAQ,CAAQ,CAClB,CACc,CACxB,CAAC;AACJ,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { isThemeActive, Theme } from '@cloudscape-design/component-toolkit/internal';\n\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\n/**\n * @awsuiSystem core\n */\nimport WithNativeAttributes from '../internal/utils/with-native-attributes';\nimport InternalSpinner from '../spinner/internal';\nimport { StatusIndicatorProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface InternalStatusIndicatorProps\n  extends SomeRequired<StatusIndicatorProps, 'type'>,\n    InternalBaseComponentProps {\n  /**\n   * Play an animation on the error icon when first rendered\n   */\n  __animate?: boolean;\n\n  /**\n   * Size of icon.\n   */\n  __size?: IconProps.Size;\n\n  /**\n   * The CSS behavior of the status indicator container element.\n   */\n  __display?: 'inline' | 'inline-block';\n}\n\nconst typeToIcon: (size: IconProps.Size) => Record<StatusIndicatorProps.Type, JSX.Element> = size => ({\n  error: <InternalIcon name=\"status-negative\" size={size} />,\n  warning: <InternalIcon name=\"status-warning\" size={size} />,\n  success: <InternalIcon name=\"status-positive\" size={size} />,\n  info: <InternalIcon name=\"status-info\" size={size} />,\n  stopped: <InternalIcon name=\"status-stopped\" size={size} />,\n  pending: <InternalIcon name=\"status-pending\" size={size} />,\n  'in-progress': <InternalIcon name=\"status-in-progress\" size={size} />,\n  loading: <InternalSpinner />,\n  'not-started': <InternalIcon name=\"status-not-started\" size={size} />,\n  log: <InternalIcon name=\"dot\" size={size} />,\n});\n\ninterface InternalStatusIconProps extends Pick<InternalStatusIndicatorProps, 'type' | 'iconAriaLabel'> {\n  animate?: InternalStatusIndicatorProps['__animate'];\n  size?: InternalStatusIndicatorProps['__size'];\n  display?: InternalStatusIndicatorProps['__display'];\n}\n\nexport function InternalStatusIcon({\n  type,\n  iconAriaLabel,\n  animate,\n  display,\n  size = 'normal',\n}: InternalStatusIconProps) {\n  return (\n    <span\n      className={clsx(styles.icon, animate && styles['icon-shake'])}\n      aria-label={iconAriaLabel}\n      role={iconAriaLabel ? 'img' : undefined}\n    >\n      {typeToIcon(size)[type]}\n      {display === 'inline' && <>&nbsp;</>}\n    </span>\n  );\n}\n\nexport default function StatusIndicator({\n  type,\n  children,\n  iconAriaLabel,\n  colorOverride,\n  wrapText = true,\n  nativeAttributes,\n  __animate = false,\n  __internalRootRef,\n  __size = isThemeActive(Theme.OneTheme) ? 'x-small' : 'normal',\n  __display = 'inline-block',\n  ...rest\n}: InternalStatusIndicatorProps) {\n  const baseProps = getBaseProps(rest);\n  return (\n    <WithNativeAttributes\n      {...baseProps}\n      tag=\"span\"\n      componentName=\"StatusIndicator\"\n      nativeAttributes={nativeAttributes}\n      className={clsx(\n        styles.root,\n        styles[`status-${type}`],\n        {\n          [styles[`color-override-${colorOverride}`]]: colorOverride,\n        },\n        baseProps.className\n      )}\n      ref={__internalRootRef}\n    >\n      <span\n        className={clsx(\n          styles.container,\n          styles[`display-${__display}`],\n          wrapText === false && styles['overflow-ellipsis'],\n          __animate && styles['container-fade-in']\n        )}\n      >\n        <InternalStatusIcon\n          type={type}\n          iconAriaLabel={iconAriaLabel}\n          animate={__animate}\n          display={__display}\n          size={__size}\n        />\n        <span>{children}</span>\n      </span>\n    </WithNativeAttributes>\n  );\n}\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/status-indicator/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React from 'react';\nimport clsx from 'clsx';\n\nimport { isThemeActive, Theme } from '@cloudscape-design/component-toolkit/internal';\n\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\n/**\n * @awsuiSystem core\n */\nimport WithNativeAttributes from '../internal/utils/with-native-attributes';\nimport InternalSpinner from '../spinner/internal';\nimport { StatusIndicatorProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\nexport interface InternalStatusIndicatorProps\n  extends SomeRequired<StatusIndicatorProps, 'type'>,\n    InternalBaseComponentProps {\n  /**\n   * Play an animation on the error icon when first rendered\n   */\n  __animate?: boolean;\n\n  /**\n   * Size of icon.\n   */\n  __size?: IconProps.Size;\n\n  /**\n   * The CSS behavior of the status indicator container element.\n   */\n  __display?: 'inline' | 'inline-block';\n}\n\nconst typeToIcon: (size: IconProps.Size) => Record<StatusIndicatorProps.Type, JSX.Element> = size => {\n  // Spinner supports a narrower size set than icons (no 'small'/'medium'/'inherit'); map to a valid\n  // spinner size so the loading spinner matches the sibling status icons.\n  const spinnerSize = size === 'x-small' ? 'x-small' : 'normal';\n  return {\n    error: <InternalIcon name=\"status-negative\" size={size} />,\n    warning: <InternalIcon name=\"status-warning\" size={size} />,\n    success: <InternalIcon name=\"status-positive\" size={size} />,\n    info: <InternalIcon name=\"status-info\" size={size} />,\n    stopped: <InternalIcon name=\"status-stopped\" size={size} />,\n    pending: <InternalIcon name=\"status-pending\" size={size} />,\n    'in-progress': <InternalIcon name=\"status-in-progress\" size={size} />,\n    loading: <InternalSpinner size={spinnerSize} />,\n    'not-started': <InternalIcon name=\"status-not-started\" size={size} />,\n    log: <InternalIcon name=\"dot\" size={size} />,\n  };\n};\n\ninterface InternalStatusIconProps extends Pick<InternalStatusIndicatorProps, 'type' | 'iconAriaLabel'> {\n  animate?: InternalStatusIndicatorProps['__animate'];\n  size?: InternalStatusIndicatorProps['__size'];\n  display?: InternalStatusIndicatorProps['__display'];\n}\n\nexport function InternalStatusIcon({\n  type,\n  iconAriaLabel,\n  animate,\n  display,\n  size = 'normal',\n}: InternalStatusIconProps) {\n  return (\n    <span\n      className={clsx(styles.icon, animate && styles['icon-shake'])}\n      aria-label={iconAriaLabel}\n      role={iconAriaLabel ? 'img' : undefined}\n    >\n      {typeToIcon(size)[type]}\n      {display === 'inline' && <>&nbsp;</>}\n    </span>\n  );\n}\n\nexport default function StatusIndicator({\n  type,\n  children,\n  iconAriaLabel,\n  colorOverride,\n  wrapText = true,\n  nativeAttributes,\n  __animate = false,\n  __internalRootRef,\n  __size = isThemeActive(Theme.OneTheme) ? 'x-small' : 'normal',\n  __display = 'inline-block',\n  ...rest\n}: InternalStatusIndicatorProps) {\n  const baseProps = getBaseProps(rest);\n  return (\n    <WithNativeAttributes\n      {...baseProps}\n      tag=\"span\"\n      componentName=\"StatusIndicator\"\n      nativeAttributes={nativeAttributes}\n      className={clsx(\n        styles.root,\n        styles[`status-${type}`],\n        {\n          [styles[`color-override-${colorOverride}`]]: colorOverride,\n        },\n        baseProps.className\n      )}\n      ref={__internalRootRef}\n    >\n      <span\n        className={clsx(\n          styles.container,\n          styles[`display-${__display}`],\n          wrapText === false && styles['overflow-ellipsis'],\n          __animate && styles['container-fade-in']\n        )}\n      >\n        <InternalStatusIcon\n          type={type}\n          iconAriaLabel={iconAriaLabel}\n          animate={__animate}\n          display={__display}\n          size={__size}\n        />\n        <span>{children}</span>\n      </span>\n    </WithNativeAttributes>\n  );\n}\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cloudscape-design/components-themeable",
-  "version": "3.0.1354",
+  "version": "3.0.1355",
   "files": [
     "lib"
   ],