@cloudscape-design/components-themeable 3.0.1332 → 3.0.1333

package/lib/internal/template/status-indicator/styles.scoped.css

@@ -150,11 +150,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_icon-shake_1cbgc_nlvn3_153:not(#\9) {
+.awsui_icon-shake_1cbgc_rnop3_153:not(#\9) {
   display: inline-block;
-  animation: awsui_awsui-motion-shake-horizontally_1cbgc_nlvn3_1 var(--motion-duration-refresh-only-medium-h3wrr6, 0ms);
+  animation: awsui_awsui-motion-shake-horizontally_1cbgc_rnop3_1 var(--motion-duration-refresh-only-medium-h3wrr6, 0ms);
 }
-@keyframes awsui_awsui-motion-shake-horizontally_1cbgc_nlvn3_1 {
+@keyframes awsui_awsui-motion-shake-horizontally_1cbgc_rnop3_1 {
   0% {
     transform: translateX(-5px);
     animation-timing-function: linear;
@@ -168,20 +168,20 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_icon-shake_1cbgc_nlvn3_153:not(#\9) {
+  .awsui_icon-shake_1cbgc_rnop3_153:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_icon-shake_1cbgc_nlvn3_153:not(#\9), .awsui-mode-entering .awsui_icon-shake_1cbgc_nlvn3_153:not(#\9) {
+.awsui-motion-disabled .awsui_icon-shake_1cbgc_rnop3_153:not(#\9), .awsui-mode-entering .awsui_icon-shake_1cbgc_rnop3_153:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_container-fade-in_1cbgc_nlvn3_181:not(#\9) {
-  animation: awsui_awsui-motion-fade-in-0_1cbgc_nlvn3_1 var(--motion-duration-refresh-only-medium-h3wrr6, 0ms) var(--motion-easing-refresh-only-a-8gio5w, cubic-bezier(0, 0, 0, 1));
+.awsui_container-fade-in_1cbgc_rnop3_181:not(#\9) {
+  animation: awsui_awsui-motion-fade-in-0_1cbgc_rnop3_1 var(--motion-duration-refresh-only-medium-h3wrr6, 0ms) var(--motion-easing-refresh-only-a-8gio5w, cubic-bezier(0, 0, 0, 1));
 }
-@keyframes awsui_awsui-motion-fade-in-0_1cbgc_nlvn3_1 {
+@keyframes awsui_awsui-motion-fade-in-0_1cbgc_rnop3_1 {
   from {
     opacity: 0;
   }
@@ -190,17 +190,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_container-fade-in_1cbgc_nlvn3_181:not(#\9) {
+  .awsui_container-fade-in_1cbgc_rnop3_181:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_container-fade-in_1cbgc_nlvn3_181:not(#\9), .awsui-mode-entering .awsui_container-fade-in_1cbgc_nlvn3_181:not(#\9) {
+.awsui-motion-disabled .awsui_container-fade-in_1cbgc_rnop3_181:not(#\9), .awsui-mode-entering .awsui_container-fade-in_1cbgc_rnop3_181:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_1cbgc_nlvn3_203:not(#\9) {
+.awsui_root_1cbgc_rnop3_203:not(#\9) {
   font-size: var(--font-size-body-m-vv54cm, 14px);
   line-height: var(--line-height-body-m-bedeoh, 22px);
   color: var(--color-text-body-default-5qid0u, #16191f);
@@ -209,143 +209,149 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-error_1cbgc_nlvn3_212:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-error_1cbgc_rnop3_212:not(#\9) {
   color: var(--color-text-status-error-c3at5p, #d13212);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-warning_1cbgc_nlvn3_215:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-warning_1cbgc_rnop3_215:not(#\9) {
   color: var(--color-text-status-warning-08d9ki, #906806);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-success_1cbgc_nlvn3_218:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-success_1cbgc_rnop3_218:not(#\9) {
   color: var(--color-text-status-success-ya1ikb, #1d8102);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-info_1cbgc_nlvn3_221:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-info_1cbgc_rnop3_221:not(#\9) {
   color: var(--color-text-status-info-5vpe5d, #0073bb);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-stopped_1cbgc_nlvn3_224:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-stopped_1cbgc_rnop3_224:not(#\9) {
   color: var(--color-text-status-inactive-n7p1uq, #687078);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-pending_1cbgc_nlvn3_227:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-pending_1cbgc_rnop3_227:not(#\9) {
   color: var(--color-text-status-inactive-n7p1uq, #687078);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-in-progress_1cbgc_nlvn3_230:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-in-progress_1cbgc_rnop3_230:not(#\9) {
   color: var(--color-text-status-inactive-n7p1uq, #687078);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-loading_1cbgc_nlvn3_233:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-loading_1cbgc_rnop3_233:not(#\9) {
   color: var(--color-text-status-inactive-n7p1uq, #687078);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-not-started_1cbgc_nlvn3_236:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-not-started_1cbgc_rnop3_236:not(#\9) {
   color: var(--color-text-status-inactive-n7p1uq, #687078);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-red_1cbgc_nlvn3_239:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-log_1cbgc_rnop3_239:not(#\9) {
+  color: var(--color-text-status-inactive-n7p1uq, #687078);
+}
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-red_1cbgc_rnop3_242:not(#\9) {
   color: var(--color-text-status-error-c3at5p, #d13212);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-grey_1cbgc_nlvn3_242:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-grey_1cbgc_rnop3_245:not(#\9) {
   color: var(--color-text-status-inactive-n7p1uq, #687078);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-blue_1cbgc_nlvn3_245:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-blue_1cbgc_rnop3_248:not(#\9) {
   color: var(--color-text-status-info-5vpe5d, #0073bb);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-green_1cbgc_nlvn3_248:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-green_1cbgc_rnop3_251:not(#\9) {
   color: var(--color-text-status-success-ya1ikb, #1d8102);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-yellow_1cbgc_nlvn3_251:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-yellow_1cbgc_rnop3_254:not(#\9) {
   color: var(--color-text-status-warning-08d9ki, #906806);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-error_1cbgc_nlvn3_212 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-error_1cbgc_rnop3_212 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-error-621sf8, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-warning_1cbgc_nlvn3_215 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-warning_1cbgc_rnop3_215 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-warning-3kccdi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-success_1cbgc_nlvn3_218 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-success_1cbgc_rnop3_218 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-success-9mizpw, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-info_1cbgc_nlvn3_221 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-info_1cbgc_rnop3_221 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-info-zw9ljm, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-stopped_1cbgc_nlvn3_224 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-stopped_1cbgc_rnop3_224 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
+  background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
+}
+.awsui_root_1cbgc_rnop3_203.awsui_status-pending_1cbgc_rnop3_227 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-pending_1cbgc_nlvn3_227 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-in-progress_1cbgc_rnop3_230 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-in-progress_1cbgc_nlvn3_230 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-loading_1cbgc_rnop3_233 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-loading_1cbgc_nlvn3_233 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-not-started_1cbgc_rnop3_236 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_status-not-started_1cbgc_nlvn3_236 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_status-log_1cbgc_rnop3_239 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-red_1cbgc_nlvn3_239 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-red_1cbgc_rnop3_242 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-error-621sf8, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-grey_1cbgc_nlvn3_242 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-grey_1cbgc_rnop3_245 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-neutral-50dvgi, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-blue_1cbgc_nlvn3_245 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-blue_1cbgc_rnop3_248 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-info-zw9ljm, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-green_1cbgc_nlvn3_248 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-green_1cbgc_rnop3_251 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-success-9mizpw, transparent);
 }
-.awsui_root_1cbgc_nlvn3_203.awsui_color-override-yellow_1cbgc_nlvn3_251 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_root_1cbgc_rnop3_203.awsui_color-override-yellow_1cbgc_rnop3_254 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: var(--color-background-status-indicator-warning-3kccdi, transparent);
 }
 
-.awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui_container_1cbgc_rnop3_181:not(#\9) {
   padding-inline: var(--space-status-indicator-padding-horizontal-hzqgcr, 0px);
   border-start-start-radius: var(--border-radius-status-indicator-1d9bsf, 16px);
   border-start-end-radius: var(--border-radius-status-indicator-1d9bsf, 16px);
   border-end-start-radius: var(--border-radius-status-indicator-1d9bsf, 16px);
   border-end-end-radius: var(--border-radius-status-indicator-1d9bsf, 16px);
 }
-.awsui-one-theme .awsui_root_1cbgc_nlvn3_203.awsui_status-loading_1cbgc_nlvn3_233 > .awsui_container_1cbgc_nlvn3_181:not(#\9) {
+.awsui-one-theme .awsui_root_1cbgc_rnop3_203.awsui_status-loading_1cbgc_rnop3_233 > .awsui_container_1cbgc_rnop3_181:not(#\9) {
   background: transparent;
   align-items: center;
   color: var(--color-text-body-secondary-gaft81, #545b64);
 }
-.awsui_container_1cbgc_nlvn3_181.awsui_display-inline_1cbgc_nlvn3_309:not(#\9) {
+.awsui_container_1cbgc_rnop3_181.awsui_display-inline_1cbgc_rnop3_315:not(#\9) {
   min-inline-size: 0;
   word-break: break-word;
   display: inline;
 }
-.awsui_container_1cbgc_nlvn3_181.awsui_display-inline_1cbgc_nlvn3_309 > .awsui_icon_1cbgc_nlvn3_153:not(#\9) {
+.awsui_container_1cbgc_rnop3_181.awsui_display-inline_1cbgc_rnop3_315 > .awsui_icon_1cbgc_rnop3_153:not(#\9) {
   white-space: nowrap;
 }
-.awsui-one-theme .awsui_container_1cbgc_nlvn3_181.awsui_display-inline_1cbgc_nlvn3_309 > .awsui_icon_1cbgc_nlvn3_153:not(#\9) {
+.awsui-one-theme .awsui_container_1cbgc_rnop3_181.awsui_display-inline_1cbgc_rnop3_315 > .awsui_icon_1cbgc_rnop3_153:not(#\9) {
   vertical-align: middle;
 }
-.awsui_container_1cbgc_nlvn3_181.awsui_display-inline-block_1cbgc_nlvn3_320:not(#\9) {
+.awsui_container_1cbgc_rnop3_181.awsui_display-inline-block_1cbgc_rnop3_326:not(#\9) {
   display: inline-block;
   word-wrap: break-word;
   word-break: break-all;
 }
-.awsui-one-theme .awsui_container_1cbgc_nlvn3_181.awsui_display-inline-block_1cbgc_nlvn3_320:not(#\9) {
+.awsui-one-theme .awsui_container_1cbgc_rnop3_181.awsui_display-inline-block_1cbgc_rnop3_326:not(#\9) {
   display: inline-flex;
-  align-items: flex-start;
+  vertical-align: top;
 }
-.awsui_container_1cbgc_nlvn3_181.awsui_display-inline-block_1cbgc_nlvn3_320 > .awsui_icon_1cbgc_nlvn3_153:not(#\9) {
+.awsui_container_1cbgc_rnop3_181.awsui_display-inline-block_1cbgc_rnop3_326 > .awsui_icon_1cbgc_rnop3_153:not(#\9) {
   padding-inline-end: var(--space-xxs-jnczic, 4px);
 }
-.awsui-one-theme .awsui_container_1cbgc_nlvn3_181.awsui_display-inline-block_1cbgc_nlvn3_320 > .awsui_icon_1cbgc_nlvn3_153:not(#\9) {
+.awsui-one-theme .awsui_container_1cbgc_rnop3_181.awsui_display-inline-block_1cbgc_rnop3_326 > .awsui_icon_1cbgc_rnop3_153:not(#\9) {
   display: inline-flex;
   align-items: center;
-  margin-block-start: var(--space-xxxs-3w1kr2, 2px);
+  block-size: var(--line-height-body-m-bedeoh, 22px);
 }
 
-.awsui_overflow-ellipsis_1cbgc_nlvn3_338:not(#\9) {
+.awsui_overflow-ellipsis_1cbgc_rnop3_344:not(#\9) {
   max-inline-size: 100%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
   vertical-align: text-bottom;
 }
-.awsui-one-theme .awsui_overflow-ellipsis_1cbgc_nlvn3_338:not(#\9) {
+.awsui-one-theme .awsui_overflow-ellipsis_1cbgc_rnop3_344:not(#\9) {
   text-overflow: unset;
 }
-.awsui-one-theme .awsui_overflow-ellipsis_1cbgc_nlvn3_338 > span:not(#\9):last-child {
+.awsui-one-theme .awsui_overflow-ellipsis_1cbgc_rnop3_344 > span:not(#\9):last-child {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

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

@@ -2,29 +2,30 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "icon-shake": "awsui_icon-shake_1cbgc_nlvn3_153",
-  "awsui-motion-shake-horizontally": "awsui_awsui-motion-shake-horizontally_1cbgc_nlvn3_1",
-  "container-fade-in": "awsui_container-fade-in_1cbgc_nlvn3_181",
-  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1cbgc_nlvn3_1",
-  "root": "awsui_root_1cbgc_nlvn3_203",
-  "status-error": "awsui_status-error_1cbgc_nlvn3_212",
-  "status-warning": "awsui_status-warning_1cbgc_nlvn3_215",
-  "status-success": "awsui_status-success_1cbgc_nlvn3_218",
-  "status-info": "awsui_status-info_1cbgc_nlvn3_221",
-  "status-stopped": "awsui_status-stopped_1cbgc_nlvn3_224",
-  "status-pending": "awsui_status-pending_1cbgc_nlvn3_227",
-  "status-in-progress": "awsui_status-in-progress_1cbgc_nlvn3_230",
-  "status-loading": "awsui_status-loading_1cbgc_nlvn3_233",
-  "status-not-started": "awsui_status-not-started_1cbgc_nlvn3_236",
-  "color-override-red": "awsui_color-override-red_1cbgc_nlvn3_239",
-  "color-override-grey": "awsui_color-override-grey_1cbgc_nlvn3_242",
-  "color-override-blue": "awsui_color-override-blue_1cbgc_nlvn3_245",
-  "color-override-green": "awsui_color-override-green_1cbgc_nlvn3_248",
-  "color-override-yellow": "awsui_color-override-yellow_1cbgc_nlvn3_251",
-  "container": "awsui_container_1cbgc_nlvn3_181",
-  "display-inline": "awsui_display-inline_1cbgc_nlvn3_309",
-  "icon": "awsui_icon_1cbgc_nlvn3_153",
-  "display-inline-block": "awsui_display-inline-block_1cbgc_nlvn3_320",
-  "overflow-ellipsis": "awsui_overflow-ellipsis_1cbgc_nlvn3_338"
+  "icon-shake": "awsui_icon-shake_1cbgc_rnop3_153",
+  "awsui-motion-shake-horizontally": "awsui_awsui-motion-shake-horizontally_1cbgc_rnop3_1",
+  "container-fade-in": "awsui_container-fade-in_1cbgc_rnop3_181",
+  "awsui-motion-fade-in-0": "awsui_awsui-motion-fade-in-0_1cbgc_rnop3_1",
+  "root": "awsui_root_1cbgc_rnop3_203",
+  "status-error": "awsui_status-error_1cbgc_rnop3_212",
+  "status-warning": "awsui_status-warning_1cbgc_rnop3_215",
+  "status-success": "awsui_status-success_1cbgc_rnop3_218",
+  "status-info": "awsui_status-info_1cbgc_rnop3_221",
+  "status-stopped": "awsui_status-stopped_1cbgc_rnop3_224",
+  "status-pending": "awsui_status-pending_1cbgc_rnop3_227",
+  "status-in-progress": "awsui_status-in-progress_1cbgc_rnop3_230",
+  "status-loading": "awsui_status-loading_1cbgc_rnop3_233",
+  "status-not-started": "awsui_status-not-started_1cbgc_rnop3_236",
+  "status-log": "awsui_status-log_1cbgc_rnop3_239",
+  "color-override-red": "awsui_color-override-red_1cbgc_rnop3_242",
+  "color-override-grey": "awsui_color-override-grey_1cbgc_rnop3_245",
+  "color-override-blue": "awsui_color-override-blue_1cbgc_rnop3_248",
+  "color-override-green": "awsui_color-override-green_1cbgc_rnop3_251",
+  "color-override-yellow": "awsui_color-override-yellow_1cbgc_rnop3_254",
+  "container": "awsui_container_1cbgc_rnop3_181",
+  "display-inline": "awsui_display-inline_1cbgc_rnop3_315",
+  "icon": "awsui_icon_1cbgc_rnop3_153",
+  "display-inline-block": "awsui_display-inline-block_1cbgc_rnop3_326",
+  "overflow-ellipsis": "awsui_overflow-ellipsis_1cbgc_rnop3_344"
 };
   

package/lib/internal/template/steps/interfaces.d.ts

@@ -5,7 +5,7 @@ export interface StepsProps extends BaseComponentProps {
      * An array of individual steps
      *
      * Each step definition has the following properties:
-     *  * `status` (string) - Status of the step corresponding to a status indicator.
+     *  * `status` (string) - Status of the step corresponding to a status indicator. The `log` status renders a neutral dot marker.
      *  * `statusIconAriaLabel` - (string) - (Optional) Alternative text for the status icon.
      *  * `header` (ReactNode) - Summary corresponding to the step.
      *  * `details` (ReactNode) - (Optional) Additional information corresponding to the step.
@@ -51,7 +51,7 @@ export interface StepsProps extends BaseComponentProps {
     ariaDescribedby?: string;
 }
 export declare namespace StepsProps {
-    type Status = StatusIndicatorProps.Type;
+    type Status = StatusIndicatorProps.Type | 'log';
     interface Step {
         status: Status;
         statusIconAriaLabel?: string;

package/lib/internal/template/steps/interfaces.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/steps/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,WAAW,UAAW,SAAQ,kBAAkB;IACpD;;;;;;;;OAQG;IACH,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACtC;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC;IACrC;;;;OAIG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC,qBAAqB,CAAC;IAClD;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,KAAK;QACtC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;QACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB,CAAC;IACF;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,yBAAiB,UAAU,CAAC;IAC1B,KAAY,MAAM,GAAG,oBAAoB,CAAC,IAAI,CAAC;IAE/C,UAAiB,IAAI;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;QACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KAC3B;IAED,KAAY,WAAW,GAAG,UAAU,GAAG,YAAY,CAAC;IAEpD,KAAY,qBAAqB,GAAG,SAAS,GAAG,MAAM,CAAC;CACxD"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/steps/interfaces.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AACtE,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,WAAW,UAAW,SAAQ,kBAAkB;IACpD;;;;;;;;OAQG;IACH,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACtC;;;OAGG;IACH,WAAW,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC;IACrC;;;;OAIG;IACH,cAAc,CAAC,EAAE,UAAU,CAAC,qBAAqB,CAAC;IAClD;;;;;;OAMG;IACH,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,CAAC,IAAI,KAAK;QACtC,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;QACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;QAC1B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KACxB,CAAC;IACF;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED,yBAAiB,UAAU,CAAC;IAC1B,KAAY,MAAM,GAAG,oBAAoB,CAAC,IAAI,GAAG,KAAK,CAAC;IAEvD,UAAiB,IAAI;QACnB,MAAM,EAAE,MAAM,CAAC;QACf,mBAAmB,CAAC,EAAE,MAAM,CAAC;QAC7B,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;QACxB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;KAC3B;IAED,KAAY,WAAW,GAAG,UAAU,GAAG,YAAY,CAAC;IAEpD,KAAY,qBAAqB,GAAG,SAAS,GAAG,MAAM,CAAC;CACxD"}

package/lib/internal/template/steps/interfaces.js.map

@@ -1 +1 @@
-{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/steps/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { StatusIndicatorProps } from '../status-indicator/interfaces';\nimport { BaseComponentProps } from '../types/base-component';\n\nexport interface StepsProps extends BaseComponentProps {\n  /**\n   * An array of individual steps\n   *\n   * Each step definition has the following properties:\n   *  * `status` (string) - Status of the step corresponding to a status indicator.\n   *  * `statusIconAriaLabel` - (string) - (Optional) Alternative text for the status icon.\n   *  * `header` (ReactNode) - Summary corresponding to the step.\n   *  * `details` (ReactNode) - (Optional) Additional information corresponding to the step.\n   */\n  steps: ReadonlyArray<StepsProps.Step>;\n  /**\n   * The visual orientation of the steps (vertical or horizontal).\n   * By default the orientation is vertical.\n   */\n  orientation?: StepsProps.Orientation;\n  /**\n   * Determines whether the connector lines between steps are displayed. The following variants are available:\n   * * `visible` - Shows connector lines between consecutive steps.\n   * * `none` - Hides the connector lines between steps.\n   */\n  connectorLines?: StepsProps.ConnectorLinesVariant;\n  /**\n   * Render a step. This overrides the default icon, header, and details provided by the component.\n   * The function is called for each step and should return an object with the following keys:\n   * * `header` (React.ReactNode) - Summary corresponding to the step.\n   * * `details` (React.ReactNode) - (Optional) Additional information corresponding to the step.\n   * * `icon` (React.ReactNode) - (Optional) Replaces the standard step icon from the status indicator.\n   */\n  renderStep?: (step: StepsProps.Step) => {\n    header: React.ReactNode;\n    details?: React.ReactNode;\n    icon?: React.ReactNode;\n  };\n  /**\n   * Provides an `aria-label` to the progress steps container.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabel?: string;\n  /**\n   * Sets the `aria-labelledby` property on the progress steps container.\n   * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabelledby?: string;\n  /**\n   * Sets the `aria-describedby` property on the progress steps container.\n   */\n  ariaDescribedby?: string;\n}\n\nexport namespace StepsProps {\n  export type Status = StatusIndicatorProps.Type;\n\n  export interface Step {\n    status: Status;\n    statusIconAriaLabel?: string;\n    header: React.ReactNode;\n    details?: React.ReactNode;\n  }\n\n  export type Orientation = 'vertical' | 'horizontal';\n\n  export type ConnectorLinesVariant = 'visible' | 'none';\n}\n"]}
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/steps/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { StatusIndicatorProps } from '../status-indicator/interfaces';\nimport { BaseComponentProps } from '../types/base-component';\n\nexport interface StepsProps extends BaseComponentProps {\n  /**\n   * An array of individual steps\n   *\n   * Each step definition has the following properties:\n   *  * `status` (string) - Status of the step corresponding to a status indicator. The `log` status renders a neutral dot marker.\n   *  * `statusIconAriaLabel` - (string) - (Optional) Alternative text for the status icon.\n   *  * `header` (ReactNode) - Summary corresponding to the step.\n   *  * `details` (ReactNode) - (Optional) Additional information corresponding to the step.\n   */\n  steps: ReadonlyArray<StepsProps.Step>;\n  /**\n   * The visual orientation of the steps (vertical or horizontal).\n   * By default the orientation is vertical.\n   */\n  orientation?: StepsProps.Orientation;\n  /**\n   * Determines whether the connector lines between steps are displayed. The following variants are available:\n   * * `visible` - Shows connector lines between consecutive steps.\n   * * `none` - Hides the connector lines between steps.\n   */\n  connectorLines?: StepsProps.ConnectorLinesVariant;\n  /**\n   * Render a step. This overrides the default icon, header, and details provided by the component.\n   * The function is called for each step and should return an object with the following keys:\n   * * `header` (React.ReactNode) - Summary corresponding to the step.\n   * * `details` (React.ReactNode) - (Optional) Additional information corresponding to the step.\n   * * `icon` (React.ReactNode) - (Optional) Replaces the standard step icon from the status indicator.\n   */\n  renderStep?: (step: StepsProps.Step) => {\n    header: React.ReactNode;\n    details?: React.ReactNode;\n    icon?: React.ReactNode;\n  };\n  /**\n   * Provides an `aria-label` to the progress steps container.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabel?: string;\n  /**\n   * Sets the `aria-labelledby` property on the progress steps container.\n   * If there's a visible label element that you can reference, use this instead of `ariaLabel`.\n   * Don't use `ariaLabel` and `ariaLabelledby` at the same time.\n   */\n  ariaLabelledby?: string;\n  /**\n   * Sets the `aria-describedby` property on the progress steps container.\n   */\n  ariaDescribedby?: string;\n}\n\nexport namespace StepsProps {\n  export type Status = StatusIndicatorProps.Type | 'log';\n\n  export interface Step {\n    status: Status;\n    statusIconAriaLabel?: string;\n    header: React.ReactNode;\n    details?: React.ReactNode;\n  }\n\n  export type Orientation = 'vertical' | 'horizontal';\n\n  export type ConnectorLinesVariant = 'visible' | 'none';\n}\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/steps/internal.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,KAAK,kBAAkB,GAAG,YAAY,CAAC,UAAU,EAAE,OAAO,GAAG,aAAa,GAAG,gBAAgB,CAAC,GAC5F,0BAA0B,CAAC;AAkG7B,QAAA,MAAM,aAAa,GAAI,6HAUpB,kBAAkB,gBAsCpB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/steps/internal.tsx"],"names":[],"mappings":"AAOA,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAEjD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAI1C,KAAK,kBAAkB,GAAG,YAAY,CAAC,UAAU,EAAE,OAAO,GAAG,aAAa,GAAG,gBAAgB,CAAC,GAC5F,0BAA0B,CAAC;AAmG7B,QAAA,MAAM,aAAa,GAAI,6HAUpB,kBAAkB,gBAsCpB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/internal/template/steps/internal.js

@@ -15,6 +15,7 @@ const statusToColor = {
     'in-progress': 'text-status-inactive',
     loading: 'text-status-inactive',
     'not-started': 'text-status-inactive',
+    log: 'text-status-inactive',
 };
 const CustomStep = ({ step, orientation, renderStep, hideConnectors, }) => {
     const { status, statusIconAriaLabel } = step;

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

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/steps/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 { BoxProps } from '../box/interfaces';\nimport InternalBox from '../box/internal';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\nimport InternalStatusIndicator, { InternalStatusIcon } from '../status-indicator/internal';\nimport { StepsProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ntype InternalStepsProps = SomeRequired<StepsProps, 'steps' | 'orientation' | 'connectorLines'> &\n  InternalBaseComponentProps;\n\nconst statusToColor: Record<StepsProps.Status, BoxProps.Color> = {\n  error: 'text-status-error',\n  warning: 'text-status-warning',\n  success: 'text-status-success',\n  info: 'text-status-info',\n  stopped: 'text-status-inactive',\n  pending: 'text-status-inactive',\n  'in-progress': 'text-status-inactive',\n  loading: 'text-status-inactive',\n  'not-started': 'text-status-inactive',\n};\n\nconst CustomStep = ({\n  step,\n  orientation,\n  renderStep,\n  hideConnectors,\n}: {\n  step: StepsProps.Step;\n  orientation: StepsProps.Orientation;\n  renderStep: Required<StepsProps>['renderStep'];\n  hideConnectors: boolean;\n}) => {\n  const { status, statusIconAriaLabel } = step;\n  const { header, details, icon } = renderStep(step);\n  const iconNode = icon ? icon : <InternalStatusIcon type={status} iconAriaLabel={statusIconAriaLabel} />;\n  const connectorClassName = clsx(styles.connector, hideConnectors && styles['connector-hidden']);\n\n  if (orientation === 'horizontal') {\n    return (\n      <li className={styles.container}>\n        <div className={styles.header}>\n          {iconNode}\n          <hr className={connectorClassName} role=\"none\" />\n        </div>\n        <div className={styles['horizontal-header']}>{header}</div>\n        {details && <div className={styles.details}>{details}</div>}\n      </li>\n    );\n  }\n\n  // Vertical orientation: render the icon and the connector together in a column-1 \"rail\" so the\n  // connector starts directly beneath the icon and stretches the full height of the step. Unlike\n  // placing the header in the same row as the icon, this keeps the vertical line continuous even\n  // when the custom header wraps onto multiple lines.\n  return (\n    <li className={clsx(styles.container, styles['custom-vertical'])}>\n      <div className={styles.rail}>\n        {iconNode}\n        <hr className={connectorClassName} role=\"none\" />\n      </div>\n      <div className={styles.content}>\n        <div className={styles.header}>{header}</div>\n        {details && <div className={styles.details}>{details}</div>}\n      </div>\n    </li>\n  );\n};\n\nconst InternalStep = ({\n  status,\n  statusIconAriaLabel,\n  header,\n  details,\n  orientation,\n  hideConnectors,\n}: StepsProps.Step & { orientation: StepsProps.Orientation; hideConnectors: boolean }) => {\n  const connectorClassName = clsx(styles.connector, hideConnectors && styles['connector-hidden']);\n  return (\n    <li className={styles.container}>\n      <div className={styles.header}>\n        {orientation === 'vertical' ? (\n          <InternalStatusIndicator type={status} iconAriaLabel={statusIconAriaLabel}>\n            {header}\n          </InternalStatusIndicator>\n        ) : (\n          <>\n            <InternalBox color={statusToColor[status]}>\n              <InternalStatusIcon type={status} iconAriaLabel={statusIconAriaLabel} />\n            </InternalBox>\n            <hr className={connectorClassName} role=\"none\" />\n          </>\n        )}\n      </div>\n      {orientation === 'vertical' ? (\n        <hr className={connectorClassName} role=\"none\" />\n      ) : (\n        <div className={styles['horizontal-header']}>\n          <InternalBox color={statusToColor[status]}>{header}</InternalBox>\n        </div>\n      )}\n      {details && <div className={styles.details}>{details}</div>}\n    </li>\n  );\n};\n\nconst InternalSteps = ({\n  steps,\n  orientation,\n  connectorLines,\n  renderStep,\n  ariaLabel,\n  ariaLabelledby,\n  ariaDescribedby,\n  __internalRootRef,\n  ...props\n}: InternalStepsProps) => {\n  const hideConnectors = connectorLines === 'none';\n  return (\n    <div\n      {...props}\n      className={clsx(styles.root, props.className, orientation === 'horizontal' ? styles.horizontal : styles.vertical)}\n      ref={__internalRootRef}\n    >\n      <ol\n        className={styles.list}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        aria-describedby={ariaDescribedby}\n      >\n        {steps.map((step, index) =>\n          renderStep ? (\n            <CustomStep\n              key={index}\n              orientation={orientation}\n              step={step}\n              renderStep={renderStep}\n              hideConnectors={hideConnectors}\n            />\n          ) : (\n            <InternalStep\n              key={index}\n              status={step.status}\n              statusIconAriaLabel={step.statusIconAriaLabel}\n              header={step.header}\n              details={step.details}\n              orientation={orientation}\n              hideConnectors={hideConnectors}\n            />\n          )\n        )}\n      </ol>\n    </div>\n  );\n};\n\nexport default InternalSteps;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/steps/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAGxB,OAAO,WAAW,MAAM,iBAAiB,CAAC;AAG1C,OAAO,uBAAuB,EAAE,EAAE,kBAAkB,EAAE,MAAM,8BAA8B,CAAC;AAG3F,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAKrC,MAAM,aAAa,GAA8C;IAC/D,KAAK,EAAE,mBAAmB;IAC1B,OAAO,EAAE,qBAAqB;IAC9B,OAAO,EAAE,qBAAqB;IAC9B,IAAI,EAAE,kBAAkB;IACxB,OAAO,EAAE,sBAAsB;IAC/B,OAAO,EAAE,sBAAsB;IAC/B,aAAa,EAAE,sBAAsB;IACrC,OAAO,EAAE,sBAAsB;IAC/B,aAAa,EAAE,sBAAsB;IACrC,GAAG,EAAE,sBAAsB;CAC5B,CAAC;AAEF,MAAM,UAAU,GAAG,CAAC,EAClB,IAAI,EACJ,WAAW,EACX,UAAU,EACV,cAAc,GAMf,EAAE,EAAE;IACH,MAAM,EAAE,MAAM,EAAE,mBAAmB,EAAE,GAAG,IAAI,CAAC;IAC7C,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,oBAAC,kBAAkB,IAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,mBAAmB,GAAI,CAAC;IACxG,MAAM,kBAAkB,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,cAAc,IAAI,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAEhG,IAAI,WAAW,KAAK,YAAY,EAAE,CAAC;QACjC,OAAO,CACL,4BAAI,SAAS,EAAE,MAAM,CAAC,SAAS;YAC7B,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM;gBAC1B,QAAQ;gBACT,4BAAI,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAC,MAAM,GAAG,CAC7C;YACN,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC,IAAG,MAAM,CAAO;YAC1D,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO,CACxD,CACN,CAAC;IACJ,CAAC;IAED,+FAA+F;IAC/F,+FAA+F;IAC/F,+FAA+F;IAC/F,oDAAoD;IACpD,OAAO,CACL,4BAAI,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,iBAAiB,CAAC,CAAC;QAC9D,6BAAK,SAAS,EAAE,MAAM,CAAC,IAAI;YACxB,QAAQ;YACT,4BAAI,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAC,MAAM,GAAG,CAC7C;QACN,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO;YAC5B,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAAG,MAAM,CAAO;YAC5C,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO,CACvD,CACH,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,YAAY,GAAG,CAAC,EACpB,MAAM,EACN,mBAAmB,EACnB,MAAM,EACN,OAAO,EACP,WAAW,EACX,cAAc,GACqE,EAAE,EAAE;IACvF,MAAM,kBAAkB,GAAG,IAAI,CAAC,MAAM,CAAC,SAAS,EAAE,cAAc,IAAI,MAAM,CAAC,kBAAkB,CAAC,CAAC,CAAC;IAChG,OAAO,CACL,4BAAI,SAAS,EAAE,MAAM,CAAC,SAAS;QAC7B,6BAAK,SAAS,EAAE,MAAM,CAAC,MAAM,IAC1B,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,CAC5B,oBAAC,uBAAuB,IAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,mBAAmB,IACtE,MAAM,CACiB,CAC3B,CAAC,CAAC,CAAC,CACF;YACE,oBAAC,WAAW,IAAC,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC;gBACvC,oBAAC,kBAAkB,IAAC,IAAI,EAAE,MAAM,EAAE,aAAa,EAAE,mBAAmB,GAAI,CAC5D;YACd,4BAAI,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAC,MAAM,GAAG,CAChD,CACJ,CACG;QACL,WAAW,KAAK,UAAU,CAAC,CAAC,CAAC,CAC5B,4BAAI,SAAS,EAAE,kBAAkB,EAAE,IAAI,EAAC,MAAM,GAAG,CAClD,CAAC,CAAC,CAAC,CACF,6BAAK,SAAS,EAAE,MAAM,CAAC,mBAAmB,CAAC;YACzC,oBAAC,WAAW,IAAC,KAAK,EAAE,aAAa,CAAC,MAAM,CAAC,IAAG,MAAM,CAAe,CAC7D,CACP;QACA,OAAO,IAAI,6BAAK,SAAS,EAAE,MAAM,CAAC,OAAO,IAAG,OAAO,CAAO,CACxD,CACN,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,aAAa,GAAG,CAAC,EACrB,KAAK,EACL,WAAW,EACX,cAAc,EACd,UAAU,EACV,SAAS,EACT,cAAc,EACd,eAAe,EACf,iBAAiB,EACjB,GAAG,KAAK,EACW,EAAE,EAAE;IACvB,MAAM,cAAc,GAAG,cAAc,KAAK,MAAM,CAAC;IACjD,OAAO,CACL,gCACM,KAAK,EACT,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,SAAS,EAAE,WAAW,KAAK,YAAY,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,EACjH,GAAG,EAAE,iBAAiB;QAEtB,4BACE,SAAS,EAAE,MAAM,CAAC,IAAI,gBACV,SAAS,qBACJ,cAAc,sBACb,eAAe,IAEhC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CACzB,UAAU,CAAC,CAAC,CAAC,CACX,oBAAC,UAAU,IACT,GAAG,EAAE,KAAK,EACV,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,cAAc,EAAE,cAAc,GAC9B,CACH,CAAC,CAAC,CAAC,CACF,oBAAC,YAAY,IACX,GAAG,EAAE,KAAK,EACV,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,mBAAmB,EAAE,IAAI,CAAC,mBAAmB,EAC7C,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,OAAO,EAAE,IAAI,CAAC,OAAO,EACrB,WAAW,EAAE,WAAW,EACxB,cAAc,EAAE,cAAc,GAC9B,CACH,CACF,CACE,CACD,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,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 { BoxProps } from '../box/interfaces';\nimport InternalBox from '../box/internal';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\nimport InternalStatusIndicator, { InternalStatusIcon } from '../status-indicator/internal';\nimport { StepsProps } from './interfaces';\n\nimport styles from './styles.css.js';\n\ntype InternalStepsProps = SomeRequired<StepsProps, 'steps' | 'orientation' | 'connectorLines'> &\n  InternalBaseComponentProps;\n\nconst statusToColor: Record<StepsProps.Status, BoxProps.Color> = {\n  error: 'text-status-error',\n  warning: 'text-status-warning',\n  success: 'text-status-success',\n  info: 'text-status-info',\n  stopped: 'text-status-inactive',\n  pending: 'text-status-inactive',\n  'in-progress': 'text-status-inactive',\n  loading: 'text-status-inactive',\n  'not-started': 'text-status-inactive',\n  log: 'text-status-inactive',\n};\n\nconst CustomStep = ({\n  step,\n  orientation,\n  renderStep,\n  hideConnectors,\n}: {\n  step: StepsProps.Step;\n  orientation: StepsProps.Orientation;\n  renderStep: Required<StepsProps>['renderStep'];\n  hideConnectors: boolean;\n}) => {\n  const { status, statusIconAriaLabel } = step;\n  const { header, details, icon } = renderStep(step);\n  const iconNode = icon ? icon : <InternalStatusIcon type={status} iconAriaLabel={statusIconAriaLabel} />;\n  const connectorClassName = clsx(styles.connector, hideConnectors && styles['connector-hidden']);\n\n  if (orientation === 'horizontal') {\n    return (\n      <li className={styles.container}>\n        <div className={styles.header}>\n          {iconNode}\n          <hr className={connectorClassName} role=\"none\" />\n        </div>\n        <div className={styles['horizontal-header']}>{header}</div>\n        {details && <div className={styles.details}>{details}</div>}\n      </li>\n    );\n  }\n\n  // Vertical orientation: render the icon and the connector together in a column-1 \"rail\" so the\n  // connector starts directly beneath the icon and stretches the full height of the step. Unlike\n  // placing the header in the same row as the icon, this keeps the vertical line continuous even\n  // when the custom header wraps onto multiple lines.\n  return (\n    <li className={clsx(styles.container, styles['custom-vertical'])}>\n      <div className={styles.rail}>\n        {iconNode}\n        <hr className={connectorClassName} role=\"none\" />\n      </div>\n      <div className={styles.content}>\n        <div className={styles.header}>{header}</div>\n        {details && <div className={styles.details}>{details}</div>}\n      </div>\n    </li>\n  );\n};\n\nconst InternalStep = ({\n  status,\n  statusIconAriaLabel,\n  header,\n  details,\n  orientation,\n  hideConnectors,\n}: StepsProps.Step & { orientation: StepsProps.Orientation; hideConnectors: boolean }) => {\n  const connectorClassName = clsx(styles.connector, hideConnectors && styles['connector-hidden']);\n  return (\n    <li className={styles.container}>\n      <div className={styles.header}>\n        {orientation === 'vertical' ? (\n          <InternalStatusIndicator type={status} iconAriaLabel={statusIconAriaLabel}>\n            {header}\n          </InternalStatusIndicator>\n        ) : (\n          <>\n            <InternalBox color={statusToColor[status]}>\n              <InternalStatusIcon type={status} iconAriaLabel={statusIconAriaLabel} />\n            </InternalBox>\n            <hr className={connectorClassName} role=\"none\" />\n          </>\n        )}\n      </div>\n      {orientation === 'vertical' ? (\n        <hr className={connectorClassName} role=\"none\" />\n      ) : (\n        <div className={styles['horizontal-header']}>\n          <InternalBox color={statusToColor[status]}>{header}</InternalBox>\n        </div>\n      )}\n      {details && <div className={styles.details}>{details}</div>}\n    </li>\n  );\n};\n\nconst InternalSteps = ({\n  steps,\n  orientation,\n  connectorLines,\n  renderStep,\n  ariaLabel,\n  ariaLabelledby,\n  ariaDescribedby,\n  __internalRootRef,\n  ...props\n}: InternalStepsProps) => {\n  const hideConnectors = connectorLines === 'none';\n  return (\n    <div\n      {...props}\n      className={clsx(styles.root, props.className, orientation === 'horizontal' ? styles.horizontal : styles.vertical)}\n      ref={__internalRootRef}\n    >\n      <ol\n        className={styles.list}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledby}\n        aria-describedby={ariaDescribedby}\n      >\n        {steps.map((step, index) =>\n          renderStep ? (\n            <CustomStep\n              key={index}\n              orientation={orientation}\n              step={step}\n              renderStep={renderStep}\n              hideConnectors={hideConnectors}\n            />\n          ) : (\n            <InternalStep\n              key={index}\n              status={step.status}\n              statusIconAriaLabel={step.statusIconAriaLabel}\n              header={step.header}\n              details={step.details}\n              orientation={orientation}\n              hideConnectors={hideConnectors}\n            />\n          )\n        )}\n      </ol>\n    </div>\n  );\n};\n\nexport default InternalSteps;\n"]}

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

@@ -1,35 +1,35 @@
 
     import './styles.scoped.css';
     export default {
-  "tabs-header": "awsui_tabs-header_14rmt_52h41_154",
-  "tab-header-scroll-container": "awsui_tab-header-scroll-container_14rmt_52h41_163",
-  "tabs-header-list": "awsui_tabs-header-list_14rmt_52h41_169",
-  "pagination-button": "awsui_pagination-button_14rmt_52h41_186",
-  "pagination-button-left": "awsui_pagination-button-left_14rmt_52h41_193",
-  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_52h41_196",
-  "pagination-button-right": "awsui_pagination-button-right_14rmt_52h41_200",
-  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_52h41_203",
-  "actions-container": "awsui_actions-container_14rmt_52h41_208",
-  "tabs-tab": "awsui_tabs-tab_14rmt_52h41_216",
-  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_52h41_226",
-  "tabs-tab-header-container": "awsui_tabs-tab-header-container_14rmt_52h41_237",
-  "tabs-tab-dismiss": "awsui_tabs-tab-dismiss_14rmt_52h41_245",
-  "tabs-tab-action": "awsui_tabs-tab-action_14rmt_52h41_245",
-  "refresh": "awsui_refresh_14rmt_52h41_250",
-  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_52h41_254",
-  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_52h41_296",
-  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_52h41_379",
-  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_52h41_388",
-  "tabs-tab-focusable": "awsui_tabs-tab-focusable_14rmt_52h41_392",
-  "root": "awsui_root_14rmt_52h41_396",
-  "tabs": "awsui_tabs_14rmt_52h41_154",
-  "tabs-content": "awsui_tabs-content_14rmt_52h41_434",
-  "fit-height": "awsui_fit-height_14rmt_52h41_438",
-  "tabs-content-active": "awsui_tabs-content-active_14rmt_52h41_444",
-  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_52h41_458",
-  "with-paddings": "awsui_with-paddings_14rmt_52h41_458",
-  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_52h41_469",
-  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_14rmt_52h41_480",
-  "tabs-tab-focused": "awsui_tabs-tab-focused_14rmt_52h41_484"
+  "tabs-header": "awsui_tabs-header_14rmt_1y1tz_154",
+  "tab-header-scroll-container": "awsui_tab-header-scroll-container_14rmt_1y1tz_163",
+  "tabs-header-list": "awsui_tabs-header-list_14rmt_1y1tz_169",
+  "pagination-button": "awsui_pagination-button_14rmt_1y1tz_186",
+  "pagination-button-left": "awsui_pagination-button-left_14rmt_1y1tz_193",
+  "pagination-button-left-scrollable": "awsui_pagination-button-left-scrollable_14rmt_1y1tz_196",
+  "pagination-button-right": "awsui_pagination-button-right_14rmt_1y1tz_200",
+  "pagination-button-right-scrollable": "awsui_pagination-button-right-scrollable_14rmt_1y1tz_203",
+  "actions-container": "awsui_actions-container_14rmt_1y1tz_208",
+  "tabs-tab": "awsui_tabs-tab_14rmt_1y1tz_216",
+  "tabs-tab-label": "awsui_tabs-tab-label_14rmt_1y1tz_226",
+  "tabs-tab-header-container": "awsui_tabs-tab-header-container_14rmt_1y1tz_237",
+  "tabs-tab-dismiss": "awsui_tabs-tab-dismiss_14rmt_1y1tz_245",
+  "tabs-tab-action": "awsui_tabs-tab-action_14rmt_1y1tz_245",
+  "refresh": "awsui_refresh_14rmt_1y1tz_250",
+  "tabs-tab-disabled": "awsui_tabs-tab-disabled_14rmt_1y1tz_254",
+  "tabs-tab-link": "awsui_tabs-tab-link_14rmt_1y1tz_296",
+  "tabs-tab-active": "awsui_tabs-tab-active_14rmt_1y1tz_379",
+  "tabs-header-with-divider": "awsui_tabs-header-with-divider_14rmt_1y1tz_388",
+  "tabs-tab-focusable": "awsui_tabs-tab-focusable_14rmt_1y1tz_392",
+  "root": "awsui_root_14rmt_1y1tz_396",
+  "tabs": "awsui_tabs_14rmt_1y1tz_154",
+  "tabs-content": "awsui_tabs-content_14rmt_1y1tz_434",
+  "fit-height": "awsui_fit-height_14rmt_1y1tz_438",
+  "tabs-content-active": "awsui_tabs-content-active_14rmt_1y1tz_444",
+  "tabs-content-wrapper": "awsui_tabs-content-wrapper_14rmt_1y1tz_458",
+  "with-paddings": "awsui_with-paddings_14rmt_1y1tz_458",
+  "tabs-container-content-wrapper": "awsui_tabs-container-content-wrapper_14rmt_1y1tz_469",
+  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_14rmt_1y1tz_480",
+  "tabs-tab-focused": "awsui_tabs-tab-focused_14rmt_1y1tz_484"
 };