@cloudscape-design/components-themeable 3.0.1102 → 3.0.1104

package/lib/internal/template/select/parts/styles.css.js

@@ -1,27 +1,27 @@
 
     import './styles.scoped.css';
     export default {
-  "placeholder": "awsui_placeholder_dwuol_pay5s_145",
-  "item": "awsui_item_dwuol_pay5s_150",
-  "checkbox": "awsui_checkbox_dwuol_pay5s_154",
-  "option-group": "awsui_option-group_dwuol_pay5s_163",
-  "filter": "awsui_filter_dwuol_pay5s_167",
-  "trigger": "awsui_trigger_dwuol_pay5s_172",
-  "layout-strut": "awsui_layout-strut_dwuol_pay5s_178",
-  "list-bottom": "awsui_list-bottom_dwuol_pay5s_184",
-  "selected-icon": "awsui_selected-icon_dwuol_pay5s_188",
-  "show-label-tag": "awsui_show-label-tag_dwuol_pay5s_192",
-  "inline-token-trigger": "awsui_inline-token-trigger_dwuol_pay5s_196",
-  "inline-token-list": "awsui_inline-token-list_dwuol_pay5s_203",
-  "inline-token": "awsui_inline-token_dwuol_pay5s_196",
-  "visual-refresh": "awsui_visual-refresh_dwuol_pay5s_233",
-  "inline-token-hidden-placeholder": "awsui_inline-token-hidden-placeholder_dwuol_pay5s_240",
-  "inline-token-counter": "awsui_inline-token-counter_dwuol_pay5s_246",
-  "inline-token-trigger--disabled": "awsui_inline-token-trigger--disabled_dwuol_pay5s_250",
-  "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_dwuol_pay5s_256",
-  "inline-label-wrapper": "awsui_inline-label-wrapper_dwuol_pay5s_260",
-  "inline-label": "awsui_inline-label_dwuol_pay5s_256",
-  "inline-label-inline-tokens": "awsui_inline-label-inline-tokens_dwuol_pay5s_286",
-  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_dwuol_pay5s_291"
+  "placeholder": "awsui_placeholder_dwuol_12web_145",
+  "item": "awsui_item_dwuol_12web_150",
+  "checkbox": "awsui_checkbox_dwuol_12web_154",
+  "option-group": "awsui_option-group_dwuol_12web_163",
+  "filter": "awsui_filter_dwuol_12web_167",
+  "trigger": "awsui_trigger_dwuol_12web_172",
+  "layout-strut": "awsui_layout-strut_dwuol_12web_178",
+  "list-bottom": "awsui_list-bottom_dwuol_12web_184",
+  "selected-icon": "awsui_selected-icon_dwuol_12web_188",
+  "show-label-tag": "awsui_show-label-tag_dwuol_12web_192",
+  "inline-token-trigger": "awsui_inline-token-trigger_dwuol_12web_196",
+  "inline-token-list": "awsui_inline-token-list_dwuol_12web_203",
+  "inline-token": "awsui_inline-token_dwuol_12web_196",
+  "visual-refresh": "awsui_visual-refresh_dwuol_12web_233",
+  "inline-token-hidden-placeholder": "awsui_inline-token-hidden-placeholder_dwuol_12web_240",
+  "inline-token-counter": "awsui_inline-token-counter_dwuol_12web_246",
+  "inline-token-trigger--disabled": "awsui_inline-token-trigger--disabled_dwuol_12web_250",
+  "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_dwuol_12web_256",
+  "inline-label-wrapper": "awsui_inline-label-wrapper_dwuol_12web_260",
+  "inline-label": "awsui_inline-label_dwuol_12web_256",
+  "inline-label-inline-tokens": "awsui_inline-label-inline-tokens_dwuol_12web_286",
+  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_dwuol_12web_291"
 };
   

package/lib/internal/template/select/parts/styles.scoped.css

@@ -142,16 +142,16 @@
 */
 /* Style used for links in slots/components that are text heavy, to help links stand out among
 surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F73#description */
-.awsui_placeholder_dwuol_pay5s_145:not(#\9) {
+.awsui_placeholder_dwuol_12web_145:not(#\9) {
   color: var(--color-text-input-placeholder-hvcry0, #687078);
   font-style: italic;
 }
 
-.awsui_item_dwuol_pay5s_150:not(#\9) {
+.awsui_item_dwuol_12web_150:not(#\9) {
   display: flex;
   align-items: center;
 }
-.awsui_item_dwuol_pay5s_150 > .awsui_checkbox_dwuol_pay5s_154:not(#\9) {
+.awsui_item_dwuol_12web_150 > .awsui_checkbox_dwuol_12web_154:not(#\9) {
   position: relative;
   min-block-size: var(--size-control-lkpwjy, 14px);
   min-inline-size: var(--size-control-lkpwjy, 14px);
@@ -160,47 +160,47 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   margin-inline-end: var(--space-field-horizontal-n5peob, 8px);
 }
 
-.awsui_option-group_dwuol_pay5s_163:not(#\9):not(:first-child) {
+.awsui_option-group_dwuol_12web_163:not(#\9):not(:first-child) {
   margin-block-start: calc(-1 * var(--border-item-width-acvlhx, 1px));
 }
 
-.awsui_filter_dwuol_pay5s_167:not(#\9) {
+.awsui_filter_dwuol_12web_167:not(#\9) {
   z-index: 4;
   flex-shrink: 0;
 }
 
-.awsui_trigger_dwuol_pay5s_172:not(#\9) {
+.awsui_trigger_dwuol_12web_172:not(#\9) {
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
 
-.awsui_layout-strut_dwuol_pay5s_178:not(#\9) {
+.awsui_layout-strut_dwuol_12web_178:not(#\9) {
   inline-size: 100%;
   position: relative;
   transform: translate3d(0, 0, 0);
 }
 
-.awsui_list-bottom_dwuol_pay5s_184:not(#\9) {
+.awsui_list-bottom_dwuol_12web_184:not(#\9) {
   /* used in unit-tests */
 }
 
-.awsui_selected-icon_dwuol_pay5s_188:not(#\9) {
-  color: var(--color-border-item-focused-r5f6xl, #0073bb);
+.awsui_selected-icon_dwuol_12web_188:not(#\9) {
+  color: var(--color-item-selected-2dv7ug, #0073bb);
 }
 
-.awsui_show-label-tag_dwuol_pay5s_192 > .awsui_selected-icon_dwuol_pay5s_188:not(#\9) {
+.awsui_show-label-tag_dwuol_12web_192 > .awsui_selected-icon_dwuol_12web_188:not(#\9) {
   padding-inline-start: var(--space-scaled-s-gjhvjd, 12px);
 }
 
-.awsui_inline-token-trigger_dwuol_pay5s_196:not(#\9) {
+.awsui_inline-token-trigger_dwuol_12web_196:not(#\9) {
   display: flex;
   flex-wrap: nowrap;
   column-gap: var(--space-xxs-jnczic, 4px);
   inline-size: 100%;
 }
 
-.awsui_inline-token-list_dwuol_pay5s_203:not(#\9) {
+.awsui_inline-token-list_dwuol_12web_203:not(#\9) {
   display: flex;
   flex-wrap: nowrap;
   align-items: center;
@@ -210,10 +210,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   mask-image: linear-gradient(270deg, transparent, white 20px, white);
   /* stylelint-disable-next-line plugin/no-unsupported-browser-features */
 }
-.awsui_inline-token-list_dwuol_pay5s_203:not(#\9):dir(rtl) {
+.awsui_inline-token-list_dwuol_12web_203:not(#\9):dir(rtl) {
   mask-image: linear-gradient(-270deg, transparent, white 20px, white);
 }
-.awsui_inline-token-list_dwuol_pay5s_203 > .awsui_inline-token_dwuol_pay5s_196:not(#\9) {
+.awsui_inline-token-list_dwuol_12web_203 > .awsui_inline-token_dwuol_12web_196:not(#\9) {
   display: flex;
   align-items: center;
   min-inline-size: max-content;
@@ -230,38 +230,38 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   color: var(--color-text-body-default-5qid0u, #16191f);
 }
 
-.awsui_visual-refresh_dwuol_pay5s_233 > .awsui_inline-token-list_dwuol_pay5s_203 > .awsui_inline-token_dwuol_pay5s_196:not(#\9) {
+.awsui_visual-refresh_dwuol_12web_233 > .awsui_inline-token-list_dwuol_12web_203 > .awsui_inline-token_dwuol_12web_196:not(#\9) {
   border-start-start-radius: var(--border-radius-badge-o70tla, 16px);
   border-start-end-radius: var(--border-radius-badge-o70tla, 16px);
   border-end-start-radius: var(--border-radius-badge-o70tla, 16px);
   border-end-end-radius: var(--border-radius-badge-o70tla, 16px);
 }
 
-.awsui_inline-token-hidden-placeholder_dwuol_pay5s_240:not(#\9) {
+.awsui_inline-token-hidden-placeholder_dwuol_12web_240:not(#\9) {
   position: absolute !important;
   inset-block-start: -9999px !important;
   inset-inline-start: -9999px !important;
 }
 
-.awsui_inline-token-counter_dwuol_pay5s_246:not(#\9) {
+.awsui_inline-token-counter_dwuol_12web_246:not(#\9) {
   white-space: nowrap;
 }
 
-.awsui_inline-token-trigger--disabled_dwuol_pay5s_250 > .awsui_inline-token-list_dwuol_pay5s_203 > .awsui_inline-token_dwuol_pay5s_196:not(#\9) {
+.awsui_inline-token-trigger--disabled_dwuol_12web_250 > .awsui_inline-token-list_dwuol_12web_203 > .awsui_inline-token_dwuol_12web_196:not(#\9) {
   border-color: var(--color-border-control-disabled-c9dn39, #d5dbdb);
   background-color: var(--color-background-container-content-aemn43, #ffffff);
   color: var(--color-text-disabled-bhrk1i, #aab7b8);
 }
 
-.awsui_inline-label-trigger-wrapper_dwuol_pay5s_256:not(#\9) {
+.awsui_inline-label-trigger-wrapper_dwuol_12web_256:not(#\9) {
   margin-block-start: -7px;
 }
 
-.awsui_inline-label-wrapper_dwuol_pay5s_260:not(#\9) {
+.awsui_inline-label-wrapper_dwuol_12web_260:not(#\9) {
   margin-block-start: calc(var(--space-scaled-xs-sppte9, 8px) * -1);
 }
 
-.awsui_inline-label_dwuol_pay5s_256:not(#\9) {
+.awsui_inline-label_dwuol_12web_256:not(#\9) {
   background: linear-gradient(to bottom, var(--color-background-layout-main-05m5y6, #f2f3f3), var(--color-background-input-default-1z2buq, #ffffff));
   border-start-start-radius: 2px;
   border-start-end-radius: 2px;
@@ -283,11 +283,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   z-index: 1;
 }
 
-.awsui_inline-label-inline-tokens_dwuol_pay5s_286:not(#\9) {
+.awsui_inline-label-inline-tokens_dwuol_12web_286:not(#\9) {
   padding-block-end: 0;
   transform: translateY(-1.5px);
 }
 
-.awsui_disabled-reason-tooltip_dwuol_pay5s_291:not(#\9) {
+.awsui_disabled-reason-tooltip_dwuol_12web_291:not(#\9) {
   /* used in test-utils or tests */
 }

package/lib/internal/template/select/parts/styles.selectors.js

@@ -2,27 +2,27 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "placeholder": "awsui_placeholder_dwuol_pay5s_145",
-  "item": "awsui_item_dwuol_pay5s_150",
-  "checkbox": "awsui_checkbox_dwuol_pay5s_154",
-  "option-group": "awsui_option-group_dwuol_pay5s_163",
-  "filter": "awsui_filter_dwuol_pay5s_167",
-  "trigger": "awsui_trigger_dwuol_pay5s_172",
-  "layout-strut": "awsui_layout-strut_dwuol_pay5s_178",
-  "list-bottom": "awsui_list-bottom_dwuol_pay5s_184",
-  "selected-icon": "awsui_selected-icon_dwuol_pay5s_188",
-  "show-label-tag": "awsui_show-label-tag_dwuol_pay5s_192",
-  "inline-token-trigger": "awsui_inline-token-trigger_dwuol_pay5s_196",
-  "inline-token-list": "awsui_inline-token-list_dwuol_pay5s_203",
-  "inline-token": "awsui_inline-token_dwuol_pay5s_196",
-  "visual-refresh": "awsui_visual-refresh_dwuol_pay5s_233",
-  "inline-token-hidden-placeholder": "awsui_inline-token-hidden-placeholder_dwuol_pay5s_240",
-  "inline-token-counter": "awsui_inline-token-counter_dwuol_pay5s_246",
-  "inline-token-trigger--disabled": "awsui_inline-token-trigger--disabled_dwuol_pay5s_250",
-  "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_dwuol_pay5s_256",
-  "inline-label-wrapper": "awsui_inline-label-wrapper_dwuol_pay5s_260",
-  "inline-label": "awsui_inline-label_dwuol_pay5s_256",
-  "inline-label-inline-tokens": "awsui_inline-label-inline-tokens_dwuol_pay5s_286",
-  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_dwuol_pay5s_291"
+  "placeholder": "awsui_placeholder_dwuol_12web_145",
+  "item": "awsui_item_dwuol_12web_150",
+  "checkbox": "awsui_checkbox_dwuol_12web_154",
+  "option-group": "awsui_option-group_dwuol_12web_163",
+  "filter": "awsui_filter_dwuol_12web_167",
+  "trigger": "awsui_trigger_dwuol_12web_172",
+  "layout-strut": "awsui_layout-strut_dwuol_12web_178",
+  "list-bottom": "awsui_list-bottom_dwuol_12web_184",
+  "selected-icon": "awsui_selected-icon_dwuol_12web_188",
+  "show-label-tag": "awsui_show-label-tag_dwuol_12web_192",
+  "inline-token-trigger": "awsui_inline-token-trigger_dwuol_12web_196",
+  "inline-token-list": "awsui_inline-token-list_dwuol_12web_203",
+  "inline-token": "awsui_inline-token_dwuol_12web_196",
+  "visual-refresh": "awsui_visual-refresh_dwuol_12web_233",
+  "inline-token-hidden-placeholder": "awsui_inline-token-hidden-placeholder_dwuol_12web_240",
+  "inline-token-counter": "awsui_inline-token-counter_dwuol_12web_246",
+  "inline-token-trigger--disabled": "awsui_inline-token-trigger--disabled_dwuol_12web_250",
+  "inline-label-trigger-wrapper": "awsui_inline-label-trigger-wrapper_dwuol_12web_256",
+  "inline-label-wrapper": "awsui_inline-label-wrapper_dwuol_12web_260",
+  "inline-label": "awsui_inline-label_dwuol_12web_256",
+  "inline-label-inline-tokens": "awsui_inline-label-inline-tokens_dwuol_12web_286",
+  "disabled-reason-tooltip": "awsui_disabled-reason-tooltip_dwuol_12web_291"
 };
   

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

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-import { StatusIndicatorProps } from './internal';
+import { StatusIndicatorProps } from './interfaces';
 export { StatusIndicatorProps };
 export default function StatusIndicator({ type, wrapText, ...props }: StatusIndicatorProps): JSX.Element;
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/status-indicator/index.tsx"],"names":[],"mappings":";AAOA,OAAgC,EAAE,oBAAoB,EAAE,MAAM,YAAY,CAAC;AAE3E,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAEhC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAE,IAAgB,EAAE,QAAe,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,eAK5G"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/status-indicator/index.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAGpD,OAAO,EAAE,oBAAoB,EAAE,CAAC;AAEhC,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAE,IAAgB,EAAE,QAAe,EAAE,GAAG,KAAK,EAAE,EAAE,oBAAoB,eAK5G"}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/status-indicator/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AACxE,OAAO,uBAAiD,MAAM,YAAY,CAAC;AAI3E,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAqE;QAArE,EAAE,IAAI,GAAG,SAAS,EAAE,QAAQ,GAAG,IAAI,OAAkC,EAA7B,KAAK,cAA7C,oBAA+C,CAAF;IACnF,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,iBAAiB,EAAE;QAC7D,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,CAAC,aAAa,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC9D,CAAC,CAAC;IACH,OAAO,oBAAC,uBAAuB,kBAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,IAAM,KAAK,EAAM,kBAAkB,EAAI,CAAC;AACxG,CAAC;AAED,gBAAgB,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport InternalStatusIndicator, { StatusIndicatorProps } from './internal';\n\nexport { StatusIndicatorProps };\n\nexport default function StatusIndicator({ type = 'success', wrapText = true, ...props }: StatusIndicatorProps) {\n  const baseComponentProps = useBaseComponent('StatusIndicator', {\n    props: { colorOverride: props.colorOverride, type, wrapText },\n  });\n  return <InternalStatusIndicator type={type} wrapText={wrapText} {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(StatusIndicator, 'StatusIndicator');\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/status-indicator/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,YAAY,CAAC;;AACb,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,sCAAsC,CAAC;AAExE,OAAO,uBAAuB,MAAM,YAAY,CAAC;AAIjD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAAqE;QAArE,EAAE,IAAI,GAAG,SAAS,EAAE,QAAQ,GAAG,IAAI,OAAkC,EAA7B,KAAK,cAA7C,oBAA+C,CAAF;IACnF,MAAM,kBAAkB,GAAG,gBAAgB,CAAC,iBAAiB,EAAE;QAC7D,KAAK,EAAE,EAAE,aAAa,EAAE,KAAK,CAAC,aAAa,EAAE,IAAI,EAAE,QAAQ,EAAE;KAC9D,CAAC,CAAC;IACH,OAAO,oBAAC,uBAAuB,kBAAC,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,IAAM,KAAK,EAAM,kBAAkB,EAAI,CAAC;AACxG,CAAC;AAED,gBAAgB,CAAC,eAAe,EAAE,iBAAiB,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\n'use client';\nimport React from 'react';\n\nimport useBaseComponent from '../internal/hooks/use-base-component';\nimport { applyDisplayName } from '../internal/utils/apply-display-name';\nimport { StatusIndicatorProps } from './interfaces';\nimport InternalStatusIndicator from './internal';\n\nexport { StatusIndicatorProps };\n\nexport default function StatusIndicator({ type = 'success', wrapText = true, ...props }: StatusIndicatorProps) {\n  const baseComponentProps = useBaseComponent('StatusIndicator', {\n    props: { colorOverride: props.colorOverride, type, wrapText },\n  });\n  return <InternalStatusIndicator type={type} wrapText={wrapText} {...props} {...baseComponentProps} />;\n}\n\napplyDisplayName(StatusIndicator, 'StatusIndicator');\n"]}

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

@@ -0,0 +1,46 @@
+/// <reference types="react" />
+import { BaseComponentProps } from '../internal/base-component';
+/**
+ * @awsuiSystem core
+ */
+import { NativeAttributes } from '../internal/utils/with-native-attributes';
+export interface StatusIndicatorProps extends BaseComponentProps {
+    /**
+     * Specifies the status type.
+     */
+    type?: StatusIndicatorProps.Type;
+    /**
+     * A text fragment that communicates the status.
+     */
+    children?: React.ReactNode;
+    /**
+     * Specifies an `aria-label` for the icon. If the status text alone does not fully describe the status,
+     * use this to communicate additional context.
+     */
+    iconAriaLabel?: string;
+    /**
+     * Specifies an override for the status indicator color.
+     */
+    colorOverride?: StatusIndicatorProps.Color;
+    /**
+     * Specifies if the text content should wrap. If you set it to false, it prevents the text from wrapping
+     * and truncates it with an ellipsis.
+     */
+    wrapText?: boolean;
+    /**
+     * Attributes to add to the native element.
+     * Some attributes will be automatically combined with internal attribute values:
+     * - `className` will be appended.
+     * - Event handlers will be chained, unless the default is prevented.
+     *
+     * We do not support using this attribute to apply custom styling.
+     *
+     * @awsuiSystem core
+     */
+    nativeAttributes?: NativeAttributes<React.HTMLAttributes<HTMLElement>>;
+}
+export declare namespace StatusIndicatorProps {
+    type Type = 'error' | 'warning' | 'success' | 'info' | 'stopped' | 'pending' | 'in-progress' | 'loading';
+    type Color = 'blue' | 'grey' | 'green' | 'red' | 'yellow';
+}
+//# sourceMappingURL=interfaces.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/status-indicator/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE;;GAEG;AACH,OAAO,EAAE,gBAAgB,EAAE,MAAM,0CAA0C,CAAC;AAE5E,MAAM,WAAW,oBAAqB,SAAQ,kBAAkB;IAC9D;;OAEG;IACH,IAAI,CAAC,EAAE,oBAAoB,CAAC,IAAI,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,oBAAoB,CAAC,KAAK,CAAC;IAC3C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;;;;;;OASG;IACH,gBAAgB,CAAC,EAAE,gBAAgB,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC,CAAC;CACxE;AAED,yBAAiB,oBAAoB,CAAC;IAGpC,KAAY,IAAI,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,aAAa,GAAG,SAAS,CAAC;IAChH,KAAY,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;CAClE"}

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

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=interfaces.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/status-indicator/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { BaseComponentProps } from '../internal/base-component';\n/**\n * @awsuiSystem core\n */\nimport { NativeAttributes } from '../internal/utils/with-native-attributes';\n\nexport interface StatusIndicatorProps extends BaseComponentProps {\n  /**\n   * Specifies the status type.\n   */\n  type?: StatusIndicatorProps.Type;\n  /**\n   * A text fragment that communicates the status.\n   */\n  children?: React.ReactNode;\n  /**\n   * Specifies an `aria-label` for the icon. If the status text alone does not fully describe the status,\n   * use this to communicate additional context.\n   */\n  iconAriaLabel?: string;\n  /**\n   * Specifies an override for the status indicator color.\n   */\n  colorOverride?: StatusIndicatorProps.Color;\n  /**\n   * Specifies if the text content should wrap. If you set it to false, it prevents the text from wrapping\n   * and truncates it with an ellipsis.\n   */\n  wrapText?: boolean;\n  /**\n   * Attributes to add to the native element.\n   * Some attributes will be automatically combined with internal attribute values:\n   * - `className` will be appended.\n   * - Event handlers will be chained, unless the default is prevented.\n   *\n   * We do not support using this attribute to apply custom styling.\n   *\n   * @awsuiSystem core\n   */\n  nativeAttributes?: NativeAttributes<React.HTMLAttributes<HTMLElement>>;\n}\n\nexport namespace StatusIndicatorProps {\n  // Why not enums? Explained there\n  // https://stackoverflow.com/questions/52393730/typescript-string-literal-union-type-from-enum\n  export type Type = 'error' | 'warning' | 'success' | 'info' | 'stopped' | 'pending' | 'in-progress' | 'loading';\n  export type Color = 'blue' | 'grey' | 'green' | 'red' | 'yellow';\n}\n"]}

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

@@ -1,32 +1,8 @@
-import React from 'react';
+/// <reference types="react" />
 import { IconProps } from '../icon/interfaces';
-import { BaseComponentProps } from '../internal/base-component';
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { SomeRequired } from '../internal/types';
-export interface StatusIndicatorProps extends BaseComponentProps {
-    /**
-     * Specifies the status type.
-     */
-    type?: StatusIndicatorProps.Type;
-    /**
-     * A text fragment that communicates the status.
-     */
-    children?: React.ReactNode;
-    /**
-     * Specifies an `aria-label` for the icon. If the status text alone does not fully describe the status,
-     * use this to communicate additional context.
-     */
-    iconAriaLabel?: string;
-    /**
-     * Specifies an override for the status indicator color.
-     */
-    colorOverride?: StatusIndicatorProps.Color;
-    /**
-     * Specifies if the text content should wrap. If you set it to false, it prevents the text from wrapping
-     * and truncates it with an ellipsis.
-     */
-    wrapText?: boolean;
-}
+import { StatusIndicatorProps } from './interfaces';
 export interface InternalStatusIndicatorProps extends SomeRequired<StatusIndicatorProps, 'type'>, InternalBaseComponentProps {
     /**
      * Play an animation on the error icon when first rendered
@@ -41,9 +17,5 @@ export interface InternalStatusIndicatorProps extends SomeRequired<StatusIndicat
      */
     __display?: 'inline' | 'inline-block';
 }
-export declare namespace StatusIndicatorProps {
-    type Type = 'error' | 'warning' | 'success' | 'info' | 'stopped' | 'pending' | 'in-progress' | 'loading';
-    type Color = 'blue' | 'grey' | 'green' | 'red' | 'yellow';
-}
-export default function StatusIndicator({ type, children, iconAriaLabel, colorOverride, wrapText, __animate, __internalRootRef, __size, __display, ...rest }: InternalStatusIndicatorProps): JSX.Element;
+export default function StatusIndicator({ type, children, iconAriaLabel, colorOverride, wrapText, nativeAttributes, __animate, __internalRootRef, __size, __display, ...rest }: InternalStatusIndicatorProps): JSX.Element;
 //# sourceMappingURL=internal.d.ts.map

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":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,OAAO,EAAE,kBAAkB,EAAgB,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAClF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAgBjD,MAAM,WAAW,oBAAqB,SAAQ,kBAAkB;IAC9D;;OAEG;IACH,IAAI,CAAC,EAAE,oBAAoB,CAAC,IAAI,CAAC;IACjC;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB;;OAEG;IACH,aAAa,CAAC,EAAE,oBAAoB,CAAC,KAAK,CAAC;IAC3C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,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,yBAAiB,oBAAoB,CAAC;IAGpC,KAAY,IAAI,GAAG,OAAO,GAAG,SAAS,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,aAAa,GAAG,SAAS,CAAC;IAChH,KAAY,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,GAAG,KAAK,GAAG,QAAQ,CAAC;CAClE;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAe,EACf,SAAiB,EACjB,iBAAiB,EACjB,MAAiB,EACjB,SAA0B,EAC1B,GAAG,IAAI,EACR,EAAE,4BAA4B,eAmC9B"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/status-indicator/internal.tsx"],"names":[],"mappings":";AAKA,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;AAaD,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAe,EACf,gBAAgB,EAChB,SAAiB,EACjB,iBAAiB,EACjB,MAAiB,EACjB,SAA0B,EAC1B,GAAG,IAAI,EACR,EAAE,4BAA4B,eAsC9B"}

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

@@ -5,6 +5,10 @@ import React from 'react';
 import clsx from 'clsx';
 import InternalIcon from '../icon/internal';
 import { getBaseProps } from '../internal/base-component';
+/**
+ * @awsuiSystem core
+ */
+import WithNativeAttributes from '../internal/utils/with-native-attributes';
 import InternalSpinner from '../spinner/internal';
 import styles from './styles.css.js';
 const typeToIcon = size => ({
@@ -18,9 +22,9 @@ const typeToIcon = size => ({
     loading: React.createElement(InternalSpinner, null),
 });
 export default function StatusIndicator(_a) {
-    var { type, children, iconAriaLabel, colorOverride, wrapText = true, __animate = false, __internalRootRef, __size = 'normal', __display = 'inline-block' } = _a, rest = __rest(_a, ["type", "children", "iconAriaLabel", "colorOverride", "wrapText", "__animate", "__internalRootRef", "__size", "__display"]);
+    var { type, children, iconAriaLabel, colorOverride, wrapText = true, nativeAttributes, __animate = false, __internalRootRef, __size = 'normal', __display = 'inline-block' } = _a, rest = __rest(_a, ["type", "children", "iconAriaLabel", "colorOverride", "wrapText", "nativeAttributes", "__animate", "__internalRootRef", "__size", "__display"]);
     const baseProps = getBaseProps(rest);
-    return (React.createElement("span", Object.assign({}, baseProps, { className: clsx(styles.root, styles[`status-${type}`], {
+    return (React.createElement(WithNativeAttributes, Object.assign({}, baseProps, { tag: "span", componentName: "StatusIndicator", nativeAttributes: nativeAttributes, className: clsx(styles.root, styles[`status-${type}`], {
             [styles[`color-override-${colorOverride}`]]: colorOverride,
         }, baseProps.className), ref: __internalRootRef }),
         React.createElement("span", { className: clsx(styles.container, styles[`display-${__display}`], wrapText === false && styles['overflow-ellipsis'], __animate && styles['container-fade-in']) },

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;AAGxB,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAsB,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAG9E,OAAO,eAAe,MAAM,qBAAqB,CAAC;AAElD,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,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;CAC7B,CAAC,CAAC;AAqDH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAWT;QAXS,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAQ,GAAG,IAAI,EACf,SAAS,GAAG,KAAK,EACjB,iBAAiB,EACjB,MAAM,GAAG,QAAQ,EACjB,SAAS,GAAG,cAAc,OAEG,EAD1B,IAAI,cAV+B,2HAWvC,CADQ;IAEP,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,OAAO,CACL,8CACM,SAAS,IACb,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,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,CAAC,gBACnD,aAAa,EACzB,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;gBAEtC,UAAU,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC;gBACxB,SAAS,KAAK,QAAQ,IAAI,mDAAW,CACjC;YACN,QAAQ,CACJ,CACF,CACR,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 { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { BaseComponentProps, getBaseProps } from '../internal/base-component';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { SomeRequired } from '../internal/types';\nimport InternalSpinner from '../spinner/internal';\n\nimport styles from './styles.css.js';\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});\n\nexport interface StatusIndicatorProps extends BaseComponentProps {\n  /**\n   * Specifies the status type.\n   */\n  type?: StatusIndicatorProps.Type;\n  /**\n   * A text fragment that communicates the status.\n   */\n  children?: React.ReactNode;\n  /**\n   * Specifies an `aria-label` for the icon. If the status text alone does not fully describe the status,\n   * use this to communicate additional context.\n   */\n  iconAriaLabel?: string;\n  /**\n   * Specifies an override for the status indicator color.\n   */\n  colorOverride?: StatusIndicatorProps.Color;\n  /**\n   * Specifies if the text content should wrap. If you set it to false, it prevents the text from wrapping\n   * and truncates it with an ellipsis.\n   */\n  wrapText?: boolean;\n}\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\nexport namespace StatusIndicatorProps {\n  // Why not enums? Explained there\n  // https://stackoverflow.com/questions/52393730/typescript-string-literal-union-type-from-enum\n  export type Type = 'error' | 'warning' | 'success' | 'info' | 'stopped' | 'pending' | 'in-progress' | 'loading';\n  export type Color = 'blue' | 'grey' | 'green' | 'red' | 'yellow';\n}\n\nexport default function StatusIndicator({\n  type,\n  children,\n  iconAriaLabel,\n  colorOverride,\n  wrapText = true,\n  __animate = false,\n  __internalRootRef,\n  __size = 'normal',\n  __display = 'inline-block',\n  ...rest\n}: InternalStatusIndicatorProps) {\n  const baseProps = getBaseProps(rest);\n  return (\n    <span\n      {...baseProps}\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        <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        {children}\n      </span>\n    </span>\n  );\n}\n"]}
+{"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;AAGxB,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;CAC7B,CAAC,CAAC;AAEH,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EAYT;QAZS,EACtC,IAAI,EACJ,QAAQ,EACR,aAAa,EACb,aAAa,EACb,QAAQ,GAAG,IAAI,EACf,gBAAgB,EAChB,SAAS,GAAG,KAAK,EACjB,iBAAiB,EACjB,MAAM,GAAG,QAAQ,EACjB,SAAS,GAAG,cAAc,OAEG,EAD1B,IAAI,cAX+B,+IAYvC,CADQ;IAEP,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,OAAO,CACL,oBAAC,oBAAoB,oBACf,SAAS,IACb,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,8BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,IAAI,MAAM,CAAC,YAAY,CAAC,CAAC,gBACnD,aAAa,EACzB,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS;gBAEtC,UAAU,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC;gBACxB,SAAS,KAAK,QAAQ,IAAI,mDAAW,CACjC;YACN,QAAQ,CACJ,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 { 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});\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 = '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        <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        {children}\n      </span>\n    </WithNativeAttributes>\n  );\n}\n"]}

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

@@ -1,6 +1,6 @@
 /// <reference types="react" />
 import { BaseComponentProps } from '../internal/base-component';
-import { StatusIndicatorProps } from '../status-indicator/internal';
+import { StatusIndicatorProps } from '../status-indicator/interfaces';
 export interface StepsProps extends BaseComponentProps {
     /**
      * An array of individual steps

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,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,8BAA8B,CAAC;AAEpE,MAAM,WAAW,UAAW,SAAQ,kBAAkB;IACpD;;;;;;;;OAQG;IACH,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACtC;;;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;CACF"}
+{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/steps/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,oBAAoB,EAAE,MAAM,gCAAgC,CAAC;AAEtE,MAAM,WAAW,UAAW,SAAQ,kBAAkB;IACpD;;;;;;;;OAQG;IACH,KAAK,EAAE,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACtC;;;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;CACF"}

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 { BaseComponentProps } from '../internal/base-component';\nimport { StatusIndicatorProps } from '../status-indicator/internal';\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   * 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"]}
+{"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 { BaseComponentProps } from '../internal/base-component';\nimport { StatusIndicatorProps } from '../status-indicator/interfaces';\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   * 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"]}

package/lib/internal/template/table/internal.js

@@ -80,10 +80,10 @@ const InternalTable = React.forwardRef((_a, ref) => {
         getLoadingStatus,
         getExpandableItemProps,
     });
-    const [containerWidth, wrapperMeasureRef] = useContainerQuery(rect => rect.contentBoxWidth);
+    const [containerWidth, wrapperMeasureRef] = useContainerQuery(rect => rect.borderBoxWidth);
     const wrapperMeasureRefObject = useRef(null);
     const wrapperMeasureMergedRef = useMergeRefs(wrapperMeasureRef, wrapperMeasureRefObject);
-    const [tableWidth, tableMeasureRef] = useContainerQuery(rect => rect.contentBoxWidth);
+    const [tableWidth, tableMeasureRef] = useContainerQuery(rect => rect.borderBoxWidth);
     const tableRefObject = useRef(null);
     const secondaryWrapperRef = React.useRef(null);
     const theadRef = useRef(null);