@cloudscape-design/components 3.0.937 → 3.0.939

package/alert/actions-wrapper/index.d.ts

@@ -9,8 +9,10 @@ interface ActionsWrapperProps {
     action: React.ReactNode;
     discoveredActions: Array<React.ReactNode>;
     buttonText: React.ReactNode;
+    wrappedClass?: string;
+    containerWidth?: number;
     onButtonClick: InternalButtonProps['onClick'];
 }
-export declare const ActionsWrapper: ({ className, testUtilClasses, action, discoveredActions, buttonText, onButtonClick, }: ActionsWrapperProps) => JSX.Element | null;
+export declare const ActionsWrapper: ({ className, testUtilClasses, action, discoveredActions, buttonText, wrappedClass, containerWidth, onButtonClick, }: ActionsWrapperProps) => JSX.Element | null;
 export {};
 //# sourceMappingURL=index.d.ts.map

package/alert/actions-wrapper/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/alert/actions-wrapper/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAuB,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AA2B5E,UAAU,mBAAmB;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9D,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,iBAAiB,EAAE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1C,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,aAAa,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;CAC/C;AAED,eAAO,MAAM,cAAc,0FAOxB,mBAAmB,uBAYrB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/alert/actions-wrapper/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAMzD,OAAuB,EAAE,mBAAmB,EAAE,MAAM,uBAAuB,CAAC;AA2B5E,UAAU,mBAAmB;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,eAAe,EAAE;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,YAAY,EAAE,MAAM,CAAA;KAAE,CAAC;IAC9D,MAAM,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,iBAAiB,EAAE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IAC1C,UAAU,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAC;CAC/C;AAED,eAAO,MAAM,cAAc,wHASxB,mBAAmB,uBAiCrB,CAAC"}

package/alert/actions-wrapper/index.js

@@ -1,7 +1,8 @@
 // Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
 // SPDX-License-Identifier: Apache-2.0
-import React from 'react';
+import React, { useLayoutEffect, useState } from 'react';
 import clsx from 'clsx';
+import { getIsRtl } from '@cloudscape-design/component-toolkit/internal';
 import { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';
 import InternalButton from '../../button/internal';
 import styles from './styles.css.js';
@@ -14,12 +15,32 @@ function createActionButton(testUtilClasses, action, buttonText, onButtonClick)
     }
     return action ? React.createElement("div", { className: testUtilClasses.actionSlot }, action) : null;
 }
-export const ActionsWrapper = ({ className, testUtilClasses, action, discoveredActions, buttonText, onButtonClick, }) => {
+export const ActionsWrapper = ({ className, testUtilClasses, action, discoveredActions, buttonText, wrappedClass, containerWidth, onButtonClick, }) => {
+    const [wrapped, setWrapped] = useState(false);
+    const ref = React.useRef(null);
+    useLayoutEffect(() => {
+        if (!ref.current || !containerWidth || !wrappedClass) {
+            return;
+        }
+        function check() {
+            const isRtl = getIsRtl(ref.current);
+            const { offsetWidth, offsetLeft } = ref.current;
+            const start = isRtl ? containerWidth - offsetWidth - offsetLeft : offsetLeft;
+            // if the action slot is towards the left (right in RTL) of its container
+            setWrapped(start < 100);
+        }
+        // Discovered actions are rendered by their plugin, so don't cause a
+        // re-render of our React tree. So we observe for changes.
+        const observer = new MutationObserver(check);
+        observer.observe(ref.current, { attributes: false, childList: true, subtree: true });
+        check();
+        return () => observer.disconnect();
+    });
     const actionButton = createActionButton(testUtilClasses, action, buttonText, onButtonClick);
     if (!actionButton && discoveredActions.length === 0) {
         return null;
     }
-    return (React.createElement("div", { className: clsx(styles.root, className) },
+    return (React.createElement("div", { ref: ref, className: clsx(styles.root, className, wrapped && wrappedClass) },
         actionButton,
         discoveredActions));
 };

package/alert/actions-wrapper/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/alert/actions-wrapper/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,cAAuC,MAAM,uBAAuB,CAAC;AAG5E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,SAAS,kBAAkB,CACzB,eAAuD,EACvD,MAAuB,EACvB,UAA2B,EAC3B,aAA6C;IAE7C,IAAI,CAAC,MAAM,IAAI,UAAU,EAAE;QACzB,MAAM,GAAG,CACP,8CACM,6BAA6B,CAAC;YAChC,MAAM,EAAE,aAAa;SACiC,CAAC;YAEzD,oBAAC,cAAc,IAAC,SAAS,EAAE,eAAe,CAAC,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAC,MAAM,IAC/F,UAAU,CACI,CACZ,CACR,CAAC;KACH;IACD,OAAO,MAAM,CAAC,CAAC,CAAC,6BAAK,SAAS,EAAE,eAAe,CAAC,UAAU,IAAG,MAAM,CAAO,CAAC,CAAC,CAAC,IAAI,CAAC;AACpF,CAAC;AAWD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,SAAS,EACT,eAAe,EACf,MAAM,EACN,iBAAiB,EACjB,UAAU,EACV,aAAa,GACO,EAAE,EAAE;IACxB,MAAM,YAAY,GAAG,kBAAkB,CAAC,eAAe,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;IAC5F,IAAI,CAAC,YAAY,IAAI,iBAAiB,CAAC,MAAM,KAAK,CAAC,EAAE;QACnD,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC;QACzC,YAAY;QACZ,iBAAiB,CACd,CACP,CAAC;AACJ,CAAC,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 { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalButton, { InternalButtonProps } from '../../button/internal';\nimport { GeneratedAnalyticsMetadataAlertButtonClick } from '../analytics-metadata/interfaces';\n\nimport styles from './styles.css.js';\n\nfunction createActionButton(\n  testUtilClasses: ActionsWrapperProps['testUtilClasses'],\n  action: React.ReactNode,\n  buttonText: React.ReactNode,\n  onButtonClick: InternalButtonProps['onClick']\n) {\n  if (!action && buttonText) {\n    action = (\n      <span\n        {...getAnalyticsMetadataAttribute({\n          action: 'buttonClick',\n        } as Partial<GeneratedAnalyticsMetadataAlertButtonClick>)}\n      >\n        <InternalButton className={testUtilClasses.actionButton} onClick={onButtonClick} formAction=\"none\">\n          {buttonText}\n        </InternalButton>\n      </span>\n    );\n  }\n  return action ? <div className={testUtilClasses.actionSlot}>{action}</div> : null;\n}\n\ninterface ActionsWrapperProps {\n  className: string;\n  testUtilClasses: { actionSlot: string; actionButton: string };\n  action: React.ReactNode;\n  discoveredActions: Array<React.ReactNode>;\n  buttonText: React.ReactNode;\n  onButtonClick: InternalButtonProps['onClick'];\n}\n\nexport const ActionsWrapper = ({\n  className,\n  testUtilClasses,\n  action,\n  discoveredActions,\n  buttonText,\n  onButtonClick,\n}: ActionsWrapperProps) => {\n  const actionButton = createActionButton(testUtilClasses, action, buttonText, onButtonClick);\n  if (!actionButton && discoveredActions.length === 0) {\n    return null;\n  }\n\n  return (\n    <div className={clsx(styles.root, className)}>\n      {actionButton}\n      {discoveredActions}\n    </div>\n  );\n};\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/alert/actions-wrapper/index.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,eAAe,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,QAAQ,EAAE,MAAM,+CAA+C,CAAC;AACzE,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,cAAuC,MAAM,uBAAuB,CAAC;AAG5E,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,SAAS,kBAAkB,CACzB,eAAuD,EACvD,MAAuB,EACvB,UAA2B,EAC3B,aAA6C;IAE7C,IAAI,CAAC,MAAM,IAAI,UAAU,EAAE;QACzB,MAAM,GAAG,CACP,8CACM,6BAA6B,CAAC;YAChC,MAAM,EAAE,aAAa;SACiC,CAAC;YAEzD,oBAAC,cAAc,IAAC,SAAS,EAAE,eAAe,CAAC,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,EAAC,MAAM,IAC/F,UAAU,CACI,CACZ,CACR,CAAC;KACH;IACD,OAAO,MAAM,CAAC,CAAC,CAAC,6BAAK,SAAS,EAAE,eAAe,CAAC,UAAU,IAAG,MAAM,CAAO,CAAC,CAAC,CAAC,IAAI,CAAC;AACpF,CAAC;AAaD,MAAM,CAAC,MAAM,cAAc,GAAG,CAAC,EAC7B,SAAS,EACT,eAAe,EACf,MAAM,EACN,iBAAiB,EACjB,UAAU,EACV,YAAY,EACZ,cAAc,EACd,aAAa,GACO,EAAE,EAAE;IACxB,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC/C,eAAe,CAAC,GAAG,EAAE;QACnB,IAAI,CAAC,GAAG,CAAC,OAAO,IAAI,CAAC,cAAc,IAAI,CAAC,YAAY,EAAE;YACpD,OAAO;SACR;QACD,SAAS,KAAK;YACZ,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;YACpC,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,GAAG,GAAG,CAAC,OAAQ,CAAC;YACjD,MAAM,KAAK,GAAG,KAAK,CAAC,CAAC,CAAC,cAAe,GAAG,WAAW,GAAG,UAAU,CAAC,CAAC,CAAC,UAAU,CAAC;YAC9E,yEAAyE;YACzE,UAAU,CAAC,KAAK,GAAG,GAAG,CAAC,CAAC;QAC1B,CAAC;QAED,oEAAoE;QACpE,0DAA0D;QAC1D,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,KAAK,CAAC,CAAC;QAC7C,QAAQ,CAAC,OAAO,CAAC,GAAG,CAAC,OAAO,EAAE,EAAE,UAAU,EAAE,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,CAAC;QACrF,KAAK,EAAE,CAAC;QACR,OAAO,GAAG,EAAE,CAAC,QAAQ,CAAC,UAAU,EAAE,CAAC;IACrC,CAAC,CAAC,CAAC;IACH,MAAM,YAAY,GAAG,kBAAkB,CAAC,eAAe,EAAE,MAAM,EAAE,UAAU,EAAE,aAAa,CAAC,CAAC;IAC5F,IAAI,CAAC,YAAY,IAAI,iBAAiB,CAAC,MAAM,KAAK,CAAC,EAAE;QACnD,OAAO,IAAI,CAAC;KACb;IAED,OAAO,CACL,6BAAK,GAAG,EAAE,GAAG,EAAE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,EAAE,OAAO,IAAI,YAAY,CAAC;QAC5E,YAAY;QACZ,iBAAiB,CACd,CACP,CAAC;AACJ,CAAC,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useLayoutEffect, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { getIsRtl } from '@cloudscape-design/component-toolkit/internal';\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport InternalButton, { InternalButtonProps } from '../../button/internal';\nimport { GeneratedAnalyticsMetadataAlertButtonClick } from '../analytics-metadata/interfaces';\n\nimport styles from './styles.css.js';\n\nfunction createActionButton(\n  testUtilClasses: ActionsWrapperProps['testUtilClasses'],\n  action: React.ReactNode,\n  buttonText: React.ReactNode,\n  onButtonClick: InternalButtonProps['onClick']\n) {\n  if (!action && buttonText) {\n    action = (\n      <span\n        {...getAnalyticsMetadataAttribute({\n          action: 'buttonClick',\n        } as Partial<GeneratedAnalyticsMetadataAlertButtonClick>)}\n      >\n        <InternalButton className={testUtilClasses.actionButton} onClick={onButtonClick} formAction=\"none\">\n          {buttonText}\n        </InternalButton>\n      </span>\n    );\n  }\n  return action ? <div className={testUtilClasses.actionSlot}>{action}</div> : null;\n}\n\ninterface ActionsWrapperProps {\n  className: string;\n  testUtilClasses: { actionSlot: string; actionButton: string };\n  action: React.ReactNode;\n  discoveredActions: Array<React.ReactNode>;\n  buttonText: React.ReactNode;\n  wrappedClass?: string;\n  containerWidth?: number;\n  onButtonClick: InternalButtonProps['onClick'];\n}\n\nexport const ActionsWrapper = ({\n  className,\n  testUtilClasses,\n  action,\n  discoveredActions,\n  buttonText,\n  wrappedClass,\n  containerWidth,\n  onButtonClick,\n}: ActionsWrapperProps) => {\n  const [wrapped, setWrapped] = useState(false);\n  const ref = React.useRef<HTMLDivElement>(null);\n  useLayoutEffect(() => {\n    if (!ref.current || !containerWidth || !wrappedClass) {\n      return;\n    }\n    function check() {\n      const isRtl = getIsRtl(ref.current);\n      const { offsetWidth, offsetLeft } = ref.current!;\n      const start = isRtl ? containerWidth! - offsetWidth - offsetLeft : offsetLeft;\n      // if the action slot is towards the left (right in RTL) of its container\n      setWrapped(start < 100);\n    }\n\n    // Discovered actions are rendered by their plugin, so don't cause a\n    // re-render of our React tree. So we observe for changes.\n    const observer = new MutationObserver(check);\n    observer.observe(ref.current, { attributes: false, childList: true, subtree: true });\n    check();\n    return () => observer.disconnect();\n  });\n  const actionButton = createActionButton(testUtilClasses, action, buttonText, onButtonClick);\n  if (!actionButton && discoveredActions.length === 0) {\n    return null;\n  }\n\n  return (\n    <div ref={ref} className={clsx(styles.root, className, wrapped && wrappedClass)}>\n      {actionButton}\n      {discoveredActions}\n    </div>\n  );\n};\n"]}

package/alert/internal.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/alert/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAgBtC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAQlF,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAoB1C,QAAA,MAAM,aAAa;;;;wCAiKlB,CAAC;AAEF,eAAe,aAAa,CAAC"}
+{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/alert/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAetC,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AASlF,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAoB1C,QAAA,MAAM,aAAa;;;;wCAmKlB,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/alert/internal.js

@@ -12,12 +12,12 @@ import { getBaseProps } from '../internal/base-component';
 import VisualContext from '../internal/components/visual-context';
 import { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';
 import { fireNonCancelableEvent } from '../internal/events';
-import { useContainerBreakpoints } from '../internal/hooks/container-queries';
 import useForwardFocus from '../internal/hooks/forward-focus';
 import { useMergeRefs } from '../internal/hooks/use-merge-refs';
 import { useVisualRefresh } from '../internal/hooks/use-visual-mode';
 import { awsuiPluginsInternal } from '../internal/plugins/api';
 import { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';
+import useContainerWidth from '../internal/utils/use-container-width';
 import { ActionsWrapper } from './actions-wrapper';
 import analyticsSelectors from './analytics-metadata/styles.css.js';
 import styles from './styles.css.js';
@@ -36,10 +36,10 @@ const InternalAlert = React.forwardRef((_a, ref) => {
     const i18n = useInternalI18n('alert');
     const focusRef = useRef(null);
     useForwardFocus(ref, focusRef);
-    const [breakpoint, breakpointRef] = useContainerBreakpoints(['xs']);
-    const mergedRef = useMergeRefs(breakpointRef, __internalRootRef);
     const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);
     const { initialHidden, headerReplacementType, contentReplacementType, headerRef: headerRefContent, contentRef: contentRefContent, replacementHeaderRef, replacementContentRef, } = useDiscoveredContent({ type, header, children });
+    const [containerWidth, containerMeasureRef] = useContainerWidth();
+    const containerRef = useMergeRefs(containerMeasureRef, __internalRootRef);
     const headerRef = useMergeRefs(headerRefAction, headerRefContent);
     const contentRef = useMergeRefs(contentRefAction, contentRefContent);
     const isRefresh = useVisualRefresh();
@@ -54,22 +54,23 @@ const InternalAlert = React.forwardRef((_a, ref) => {
     };
     const statusIconAriaLabel = i18n(`i18nStrings.${type}IconAriaLabel`, (_b = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings[`${type}IconAriaLabel`]) !== null && _b !== void 0 ? _b : deprecatedStatusIconAriaLabel);
     const dismissAriaLabel = i18n('i18nStrings.dismissAriaLabel', (_c = i18nStrings === null || i18nStrings === void 0 ? void 0 : i18nStrings.dismissAriaLabel) !== null && _c !== void 0 ? _c : i18n('dismissAriaLabel', deprecatedDismissAriaLabel));
-    return (React.createElement("div", Object.assign({}, baseProps, analyticsAttributes, { "aria-hidden": !visible, className: clsx(styles.root, { [styles.hidden]: !visible, [styles['initial-hidden']]: initialHidden }, baseProps.className), ref: mergedRef }),
+    return (React.createElement("div", Object.assign({}, baseProps, analyticsAttributes, { "aria-hidden": !visible, className: clsx(styles.root, { [styles.hidden]: !visible, [styles['initial-hidden']]: initialHidden }, baseProps.className), ref: containerRef }),
         React.createElement(LinkDefaultVariantContext.Provider, { value: { defaultVariant: 'primary' } },
             React.createElement(VisualContext, { contextName: "alert" },
-                React.createElement("div", { className: clsx(styles.alert, styles[`type-${type}`], styles[`icon-size-${size}`], hasAction && styles['with-action'], dismissible && styles['with-dismiss'], styles[`breakpoint-${breakpoint}`]) },
-                    React.createElement("div", { className: styles['alert-focus-wrapper'], tabIndex: -1, ref: focusRef },
-                        React.createElement("div", { className: clsx(styles.icon, styles.text) },
-                            React.createElement(InternalIcon, { name: typeToIcon[type], size: size, ariaLabel: statusIconAriaLabel })),
-                        React.createElement("div", { className: clsx(styles.message, styles.text), id: messageSlotId },
-                            React.createElement("div", { className: clsx(header && styles.header, headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors.header), ref: headerRef }, header),
-                            React.createElement("div", { className: clsx(styles['header-replacement'], headerReplacementType !== 'replaced' ? styles.hidden : analyticsSelectors.header), ref: replacementHeaderRef }),
-                            React.createElement("div", { className: clsx(styles.content, contentReplacementType !== 'original' && styles.hidden), ref: contentRef }, children),
-                            React.createElement("div", { className: clsx(styles['content-replacement'], contentReplacementType !== 'replaced' && styles.hidden), ref: replacementContentRef }))),
-                    React.createElement(ActionsWrapper, { className: styles.action, testUtilClasses: {
-                            actionSlot: styles['action-slot'],
-                            actionButton: styles['action-button'],
-                        }, action: action, discoveredActions: discoveredActions, buttonText: buttonText, onButtonClick: () => fireNonCancelableEvent(onButtonClick) }),
+                React.createElement("div", { className: clsx(styles.alert, styles[`type-${type}`], styles[`icon-size-${size}`], hasAction && styles['with-action'], dismissible && styles['with-dismiss']) },
+                    React.createElement("div", { className: styles['alert-wrapper'] },
+                        React.createElement("div", { className: styles['alert-focus-wrapper'], tabIndex: -1, ref: focusRef },
+                            React.createElement("div", { className: clsx(styles.icon, styles.text) },
+                                React.createElement(InternalIcon, { name: typeToIcon[type], size: size, ariaLabel: statusIconAriaLabel })),
+                            React.createElement("div", { className: clsx(styles.message, styles.text), id: messageSlotId },
+                                React.createElement("div", { className: clsx(header && styles.header, headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors.header), ref: headerRef }, header),
+                                React.createElement("div", { className: clsx(styles['header-replacement'], headerReplacementType !== 'replaced' ? styles.hidden : analyticsSelectors.header), ref: replacementHeaderRef }),
+                                React.createElement("div", { className: clsx(styles.content, contentReplacementType !== 'original' && styles.hidden), ref: contentRef }, children),
+                                React.createElement("div", { className: clsx(styles['content-replacement'], contentReplacementType !== 'replaced' && styles.hidden), ref: replacementContentRef }))),
+                        React.createElement(ActionsWrapper, { className: styles.action, testUtilClasses: {
+                                actionSlot: styles['action-slot'],
+                                actionButton: styles['action-button'],
+                            }, action: action, discoveredActions: discoveredActions, buttonText: buttonText, onButtonClick: () => fireNonCancelableEvent(onButtonClick), containerWidth: containerWidth, wrappedClass: styles['action-wrapped'] })),
                     dismissible && (React.createElement("div", Object.assign({ className: styles.dismiss }, getAnalyticsMetadataAttribute({
                         action: 'dismiss',
                     })),

package/alert/internal.js.map

@@ -1 +1 @@
-{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/alert/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, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { DATA_ATTR_ANALYTICS_ALERT } from '../internal/analytics/selectors';\nimport { getBaseProps } from '../internal/base-component';\nimport VisualContext from '../internal/components/visual-context';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport { useContainerBreakpoints } from '../internal/hooks/container-queries';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { awsuiPluginsInternal } from '../internal/plugins/api';\nimport { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';\nimport { SomeRequired } from '../internal/types';\nimport { ActionsWrapper } from './actions-wrapper';\nimport { GeneratedAnalyticsMetadataAlertDismiss } from './analytics-metadata/interfaces';\nimport { AlertProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst typeToIcon: Record<AlertProps.Type, IconProps['name']> = {\n  error: 'status-negative',\n  warning: 'status-warning',\n  success: 'status-positive',\n  info: 'status-info',\n};\n\ntype InternalAlertProps = SomeRequired<AlertProps, 'type'> &\n  InternalBaseComponentProps<HTMLDivElement> & {\n    messageSlotId?: string;\n  };\n\nconst useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.alert.onActionRegistered);\nconst useDiscoveredContent = createUseDiscoveredContent('alert', awsuiPluginsInternal.alertContent);\n\nconst InternalAlert = React.forwardRef(\n  (\n    {\n      type,\n      i18nStrings,\n      visible = true,\n      dismissible,\n      children,\n      header,\n      buttonText,\n      action,\n      onDismiss,\n      onButtonClick,\n      __internalRootRef = null,\n      statusIconAriaLabel: deprecatedStatusIconAriaLabel,\n      dismissAriaLabel: deprecatedDismissAriaLabel,\n      messageSlotId,\n      ...rest\n    }: InternalAlertProps,\n    ref: React.Ref<AlertProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(rest);\n    const i18n = useInternalI18n('alert');\n\n    const focusRef = useRef<HTMLDivElement>(null);\n    useForwardFocus(ref, focusRef);\n\n    const [breakpoint, breakpointRef] = useContainerBreakpoints(['xs']);\n    const mergedRef = useMergeRefs(breakpointRef, __internalRootRef);\n\n    const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);\n    const {\n      initialHidden,\n      headerReplacementType,\n      contentReplacementType,\n      headerRef: headerRefContent,\n      contentRef: contentRefContent,\n      replacementHeaderRef,\n      replacementContentRef,\n    } = useDiscoveredContent({ type, header, children });\n\n    const headerRef = useMergeRefs(headerRefAction, headerRefContent);\n    const contentRef = useMergeRefs(contentRefAction, contentRefContent);\n\n    const isRefresh = useVisualRefresh();\n    const size = isRefresh\n      ? 'normal'\n      : headerReplacementType !== 'remove' && header && contentReplacementType !== 'remove' && children\n        ? 'big'\n        : 'normal';\n\n    const hasAction = Boolean(action || buttonText || discoveredActions.length);\n\n    const analyticsAttributes = {\n      [DATA_ATTR_ANALYTICS_ALERT]: type,\n    };\n\n    const statusIconAriaLabel = i18n(\n      `i18nStrings.${type}IconAriaLabel`,\n      i18nStrings?.[`${type}IconAriaLabel`] ?? deprecatedStatusIconAriaLabel\n    );\n\n    const dismissAriaLabel = i18n(\n      'i18nStrings.dismissAriaLabel',\n      i18nStrings?.dismissAriaLabel ?? i18n('dismissAriaLabel', deprecatedDismissAriaLabel)\n    );\n\n    return (\n      <div\n        {...baseProps}\n        {...analyticsAttributes}\n        aria-hidden={!visible}\n        className={clsx(\n          styles.root,\n          { [styles.hidden]: !visible, [styles['initial-hidden']]: initialHidden },\n          baseProps.className\n        )}\n        ref={mergedRef}\n      >\n        <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n          <VisualContext contextName=\"alert\">\n            <div\n              className={clsx(\n                styles.alert,\n                styles[`type-${type}`],\n                styles[`icon-size-${size}`],\n                hasAction && styles['with-action'],\n                dismissible && styles['with-dismiss'],\n                styles[`breakpoint-${breakpoint}`]\n              )}\n            >\n              <div className={styles['alert-focus-wrapper']} tabIndex={-1} ref={focusRef}>\n                <div className={clsx(styles.icon, styles.text)}>\n                  <InternalIcon name={typeToIcon[type]} size={size} ariaLabel={statusIconAriaLabel} />\n                </div>\n                <div className={clsx(styles.message, styles.text)} id={messageSlotId}>\n                  <div\n                    className={clsx(\n                      header && styles.header,\n                      headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors.header\n                    )}\n                    ref={headerRef}\n                  >\n                    {header}\n                  </div>\n                  <div\n                    className={clsx(\n                      styles['header-replacement'],\n                      headerReplacementType !== 'replaced' ? styles.hidden : analyticsSelectors.header\n                    )}\n                    ref={replacementHeaderRef}\n                  ></div>\n                  <div\n                    className={clsx(styles.content, contentReplacementType !== 'original' && styles.hidden)}\n                    ref={contentRef}\n                  >\n                    {children}\n                  </div>\n                  <div\n                    className={clsx(\n                      styles['content-replacement'],\n                      contentReplacementType !== 'replaced' && styles.hidden\n                    )}\n                    ref={replacementContentRef}\n                  ></div>\n                </div>\n              </div>\n              <ActionsWrapper\n                className={styles.action}\n                testUtilClasses={{\n                  actionSlot: styles['action-slot'],\n                  actionButton: styles['action-button'],\n                }}\n                action={action}\n                discoveredActions={discoveredActions}\n                buttonText={buttonText}\n                onButtonClick={() => fireNonCancelableEvent(onButtonClick)}\n              />\n              {dismissible && (\n                <div\n                  className={styles.dismiss}\n                  {...getAnalyticsMetadataAttribute({\n                    action: 'dismiss',\n                  } as Partial<GeneratedAnalyticsMetadataAlertDismiss>)}\n                >\n                  <InternalButton\n                    className={styles['dismiss-button']}\n                    variant=\"icon\"\n                    iconName=\"close\"\n                    formAction=\"none\"\n                    ariaLabel={dismissAriaLabel}\n                    onClick={() => fireNonCancelableEvent(onDismiss)}\n                  />\n                </div>\n              )}\n            </div>\n          </VisualContext>\n        </LinkDefaultVariantContext.Provider>\n      </div>\n    );\n  }\n);\n\nexport default InternalAlert;\n"]}
+{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/alert/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, { useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { getAnalyticsMetadataAttribute } from '@cloudscape-design/component-toolkit/internal/analytics-metadata';\n\nimport { InternalButton } from '../button/internal';\nimport { useInternalI18n } from '../i18n/context';\nimport { IconProps } from '../icon/interfaces';\nimport InternalIcon from '../icon/internal';\nimport { DATA_ATTR_ANALYTICS_ALERT } from '../internal/analytics/selectors';\nimport { getBaseProps } from '../internal/base-component';\nimport VisualContext from '../internal/components/visual-context';\nimport { LinkDefaultVariantContext } from '../internal/context/link-default-variant-context';\nimport { fireNonCancelableEvent } from '../internal/events';\nimport useForwardFocus from '../internal/hooks/forward-focus';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useMergeRefs } from '../internal/hooks/use-merge-refs';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { awsuiPluginsInternal } from '../internal/plugins/api';\nimport { createUseDiscoveredAction, createUseDiscoveredContent } from '../internal/plugins/helpers';\nimport { SomeRequired } from '../internal/types';\nimport useContainerWidth from '../internal/utils/use-container-width';\nimport { ActionsWrapper } from './actions-wrapper';\nimport { GeneratedAnalyticsMetadataAlertDismiss } from './analytics-metadata/interfaces';\nimport { AlertProps } from './interfaces';\n\nimport analyticsSelectors from './analytics-metadata/styles.css.js';\nimport styles from './styles.css.js';\n\nconst typeToIcon: Record<AlertProps.Type, IconProps['name']> = {\n  error: 'status-negative',\n  warning: 'status-warning',\n  success: 'status-positive',\n  info: 'status-info',\n};\n\ntype InternalAlertProps = SomeRequired<AlertProps, 'type'> &\n  InternalBaseComponentProps<HTMLDivElement> & {\n    messageSlotId?: string;\n  };\n\nconst useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.alert.onActionRegistered);\nconst useDiscoveredContent = createUseDiscoveredContent('alert', awsuiPluginsInternal.alertContent);\n\nconst InternalAlert = React.forwardRef(\n  (\n    {\n      type,\n      i18nStrings,\n      visible = true,\n      dismissible,\n      children,\n      header,\n      buttonText,\n      action,\n      onDismiss,\n      onButtonClick,\n      __internalRootRef = null,\n      statusIconAriaLabel: deprecatedStatusIconAriaLabel,\n      dismissAriaLabel: deprecatedDismissAriaLabel,\n      messageSlotId,\n      ...rest\n    }: InternalAlertProps,\n    ref: React.Ref<AlertProps.Ref>\n  ) => {\n    const baseProps = getBaseProps(rest);\n    const i18n = useInternalI18n('alert');\n\n    const focusRef = useRef<HTMLDivElement>(null);\n    useForwardFocus(ref, focusRef);\n\n    const { discoveredActions, headerRef: headerRefAction, contentRef: contentRefAction } = useDiscoveredAction(type);\n    const {\n      initialHidden,\n      headerReplacementType,\n      contentReplacementType,\n      headerRef: headerRefContent,\n      contentRef: contentRefContent,\n      replacementHeaderRef,\n      replacementContentRef,\n    } = useDiscoveredContent({ type, header, children });\n\n    const [containerWidth, containerMeasureRef] = useContainerWidth();\n    const containerRef = useMergeRefs(containerMeasureRef, __internalRootRef);\n    const headerRef = useMergeRefs(headerRefAction, headerRefContent);\n    const contentRef = useMergeRefs(contentRefAction, contentRefContent);\n\n    const isRefresh = useVisualRefresh();\n    const size = isRefresh\n      ? 'normal'\n      : headerReplacementType !== 'remove' && header && contentReplacementType !== 'remove' && children\n        ? 'big'\n        : 'normal';\n\n    const hasAction = Boolean(action || buttonText || discoveredActions.length);\n\n    const analyticsAttributes = {\n      [DATA_ATTR_ANALYTICS_ALERT]: type,\n    };\n\n    const statusIconAriaLabel = i18n(\n      `i18nStrings.${type}IconAriaLabel`,\n      i18nStrings?.[`${type}IconAriaLabel`] ?? deprecatedStatusIconAriaLabel\n    );\n\n    const dismissAriaLabel = i18n(\n      'i18nStrings.dismissAriaLabel',\n      i18nStrings?.dismissAriaLabel ?? i18n('dismissAriaLabel', deprecatedDismissAriaLabel)\n    );\n\n    return (\n      <div\n        {...baseProps}\n        {...analyticsAttributes}\n        aria-hidden={!visible}\n        className={clsx(\n          styles.root,\n          { [styles.hidden]: !visible, [styles['initial-hidden']]: initialHidden },\n          baseProps.className\n        )}\n        ref={containerRef}\n      >\n        <LinkDefaultVariantContext.Provider value={{ defaultVariant: 'primary' }}>\n          <VisualContext contextName=\"alert\">\n            <div\n              className={clsx(\n                styles.alert,\n                styles[`type-${type}`],\n                styles[`icon-size-${size}`],\n                hasAction && styles['with-action'],\n                dismissible && styles['with-dismiss']\n              )}\n            >\n              <div className={styles['alert-wrapper']}>\n                <div className={styles['alert-focus-wrapper']} tabIndex={-1} ref={focusRef}>\n                  <div className={clsx(styles.icon, styles.text)}>\n                    <InternalIcon name={typeToIcon[type]} size={size} ariaLabel={statusIconAriaLabel} />\n                  </div>\n                  <div className={clsx(styles.message, styles.text)} id={messageSlotId}>\n                    <div\n                      className={clsx(\n                        header && styles.header,\n                        headerReplacementType !== 'original' ? styles.hidden : analyticsSelectors.header\n                      )}\n                      ref={headerRef}\n                    >\n                      {header}\n                    </div>\n                    <div\n                      className={clsx(\n                        styles['header-replacement'],\n                        headerReplacementType !== 'replaced' ? styles.hidden : analyticsSelectors.header\n                      )}\n                      ref={replacementHeaderRef}\n                    ></div>\n                    <div\n                      className={clsx(styles.content, contentReplacementType !== 'original' && styles.hidden)}\n                      ref={contentRef}\n                    >\n                      {children}\n                    </div>\n                    <div\n                      className={clsx(\n                        styles['content-replacement'],\n                        contentReplacementType !== 'replaced' && styles.hidden\n                      )}\n                      ref={replacementContentRef}\n                    ></div>\n                  </div>\n                </div>\n                <ActionsWrapper\n                  className={styles.action}\n                  testUtilClasses={{\n                    actionSlot: styles['action-slot'],\n                    actionButton: styles['action-button'],\n                  }}\n                  action={action}\n                  discoveredActions={discoveredActions}\n                  buttonText={buttonText}\n                  onButtonClick={() => fireNonCancelableEvent(onButtonClick)}\n                  containerWidth={containerWidth}\n                  wrappedClass={styles['action-wrapped']}\n                />\n              </div>\n              {dismissible && (\n                <div\n                  className={styles.dismiss}\n                  {...getAnalyticsMetadataAttribute({\n                    action: 'dismiss',\n                  } as Partial<GeneratedAnalyticsMetadataAlertDismiss>)}\n                >\n                  <InternalButton\n                    className={styles['dismiss-button']}\n                    variant=\"icon\"\n                    iconName=\"close\"\n                    formAction=\"none\"\n                    ariaLabel={dismissAriaLabel}\n                    onClick={() => fireNonCancelableEvent(onDismiss)}\n                  />\n                </div>\n              )}\n            </div>\n          </VisualContext>\n        </LinkDefaultVariantContext.Provider>\n      </div>\n    );\n  }\n);\n\nexport default InternalAlert;\n"]}

package/alert/styles.css.js

@@ -1,33 +1,32 @@
 
     import './styles.scoped.css';
     export default {
-  "alert": "awsui_alert_mx3cw_1euw8_193",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1euw8_1",
-  "root": "awsui_root_mx3cw_1euw8_215",
-  "hidden": "awsui_hidden_mx3cw_1euw8_250",
-  "with-dismiss": "awsui_with-dismiss_mx3cw_1euw8_297",
-  "with-action": "awsui_with-action_mx3cw_1euw8_297",
-  "breakpoint-default": "awsui_breakpoint-default_mx3cw_1euw8_303",
-  "initial-hidden": "awsui_initial-hidden_mx3cw_1euw8_314",
-  "header": "awsui_header_mx3cw_1euw8_319",
-  "header-replacement": "awsui_header-replacement_mx3cw_1euw8_320",
-  "action": "awsui_action_mx3cw_1euw8_324",
-  "action-slot": "awsui_action-slot_mx3cw_1euw8_329",
-  "action-button": "awsui_action-button_mx3cw_1euw8_330",
-  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1euw8_334",
-  "text": "awsui_text_mx3cw_1euw8_363",
-  "icon": "awsui_icon_mx3cw_1euw8_370",
-  "message": "awsui_message_mx3cw_1euw8_373",
-  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1euw8_381",
-  "icon-size-big": "awsui_icon-size-big_mx3cw_1euw8_384",
-  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1euw8_387",
-  "content": "awsui_content_mx3cw_1euw8_391",
-  "content-replacement": "awsui_content-replacement_mx3cw_1euw8_392",
-  "dismiss": "awsui_dismiss_mx3cw_1euw8_396",
-  "dismiss-button": "awsui_dismiss-button_mx3cw_1euw8_401",
-  "type-error": "awsui_type-error_mx3cw_1euw8_405",
-  "type-warning": "awsui_type-warning_mx3cw_1euw8_413",
-  "type-success": "awsui_type-success_mx3cw_1euw8_421",
-  "type-info": "awsui_type-info_mx3cw_1euw8_429"
+  "alert": "awsui_alert_mx3cw_1r6ai_193",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1r6ai_1",
+  "root": "awsui_root_mx3cw_1r6ai_215",
+  "hidden": "awsui_hidden_mx3cw_1r6ai_250",
+  "alert-wrapper": "awsui_alert-wrapper_mx3cw_1r6ai_298",
+  "initial-hidden": "awsui_initial-hidden_mx3cw_1r6ai_310",
+  "header": "awsui_header_mx3cw_1r6ai_315",
+  "header-replacement": "awsui_header-replacement_mx3cw_1r6ai_316",
+  "action": "awsui_action_mx3cw_1r6ai_320",
+  "action-slot": "awsui_action-slot_mx3cw_1r6ai_324",
+  "action-button": "awsui_action-button_mx3cw_1r6ai_325",
+  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1r6ai_329",
+  "text": "awsui_text_mx3cw_1r6ai_360",
+  "icon": "awsui_icon_mx3cw_1r6ai_367",
+  "message": "awsui_message_mx3cw_1r6ai_370",
+  "action-wrapped": "awsui_action-wrapped_mx3cw_1r6ai_374",
+  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1r6ai_378",
+  "icon-size-big": "awsui_icon-size-big_mx3cw_1r6ai_382",
+  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1r6ai_386",
+  "content": "awsui_content_mx3cw_1r6ai_390",
+  "content-replacement": "awsui_content-replacement_mx3cw_1r6ai_391",
+  "dismiss": "awsui_dismiss_mx3cw_1r6ai_395",
+  "dismiss-button": "awsui_dismiss-button_mx3cw_1r6ai_400",
+  "type-error": "awsui_type-error_mx3cw_1r6ai_404",
+  "type-warning": "awsui_type-warning_mx3cw_1r6ai_412",
+  "type-success": "awsui_type-success_mx3cw_1r6ai_420",
+  "type-info": "awsui_type-info_mx3cw_1r6ai_428"
 };
   

package/alert/styles.scoped.css

@@ -190,10 +190,10 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
  Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
  SPDX-License-Identifier: Apache-2.0
 */
-.awsui_alert_mx3cw_1euw8_193:not(#\9) {
-  animation: awsui_awsui-motion-fade-in_mx3cw_1euw8_1 var(--motion-duration-show-paced-q2lo2h, 180ms) var(--motion-easing-show-paced-ne2o0s, ease-out);
+.awsui_alert_mx3cw_1r6ai_193:not(#\9) {
+  animation: awsui_awsui-motion-fade-in_mx3cw_1r6ai_1 var(--motion-duration-show-paced-q2lo2h, 180ms) var(--motion-easing-show-paced-ne2o0s, ease-out);
 }
-@keyframes awsui_awsui-motion-fade-in_mx3cw_1euw8_1 {
+@keyframes awsui_awsui-motion-fade-in_mx3cw_1r6ai_1 {
   from {
     opacity: 0.2;
   }
@@ -202,17 +202,17 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   }
 }
 @media (prefers-reduced-motion: reduce) {
-  .awsui_alert_mx3cw_1euw8_193:not(#\9) {
+  .awsui_alert_mx3cw_1r6ai_193:not(#\9) {
     animation: none;
     transition: none;
   }
 }
-.awsui-motion-disabled .awsui_alert_mx3cw_1euw8_193:not(#\9), .awsui-mode-entering .awsui_alert_mx3cw_1euw8_193:not(#\9) {
+.awsui-motion-disabled .awsui_alert_mx3cw_1r6ai_193:not(#\9), .awsui-mode-entering .awsui_alert_mx3cw_1r6ai_193:not(#\9) {
   animation: none;
   transition: none;
 }
 
-.awsui_root_mx3cw_1euw8_215:not(#\9) {
+.awsui_root_mx3cw_1r6ai_215:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -248,11 +248,11 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   overflow: hidden;
   display: block;
 }
-.awsui_root_mx3cw_1euw8_215.awsui_hidden_mx3cw_1euw8_250:not(#\9) {
+.awsui_root_mx3cw_1r6ai_215.awsui_hidden_mx3cw_1r6ai_250:not(#\9) {
   display: none;
 }
 
-.awsui_alert_mx3cw_1euw8_193:not(#\9) {
+.awsui_alert_mx3cw_1r6ai_193:not(#\9) {
   border-collapse: separate;
   border-spacing: 0;
   box-sizing: border-box;
@@ -284,8 +284,8 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   -webkit-font-smoothing: auto;
   -moz-osx-font-smoothing: auto;
   position: relative;
-  display: grid;
-  grid-template-columns: 1fr;
+  display: flex;
+  flex-direction: row;
   border-block: var(--border-width-alert-t0f3yn, 2px) solid;
   border-inline: var(--border-width-alert-t0f3yn, 2px) solid;
   border-start-start-radius: var(--border-radius-alert-mdtrse, 12px);
@@ -296,58 +296,55 @@ surrounding text. (WCAG F73) https://www.w3.org/WAI/WCAG21/Techniques/failures/F
   padding-inline: var(--space-alert-horizontal-eyt1xx, 16px);
   background-color: var(--color-background-container-content-z79u4u, #ffffff);
 }
-.awsui_alert_mx3cw_1euw8_193.awsui_with-dismiss_mx3cw_1euw8_297:not(#\9), .awsui_alert_mx3cw_1euw8_193.awsui_with-action_mx3cw_1euw8_297:not(#\9) {
-  grid-template-columns: 1fr auto;
-}
-.awsui_alert_mx3cw_1euw8_193.awsui_with-action_mx3cw_1euw8_297.awsui_with-dismiss_mx3cw_1euw8_297:not(#\9) {
-  grid-template-columns: 1fr auto auto;
-}
-.awsui_alert_mx3cw_1euw8_193.awsui_breakpoint-default_mx3cw_1euw8_303.awsui_with-action_mx3cw_1euw8_297:not(#\9) {
-  grid-template-columns: 1fr auto;
-}
-.awsui_alert_mx3cw_1euw8_193.awsui_breakpoint-default_mx3cw_1euw8_303:not(#\9):not(.awsui_with-dismiss_mx3cw_1euw8_297) {
-  grid-template-columns: 1fr;
+
+.awsui_alert-wrapper_mx3cw_1r6ai_298:not(#\9) {
+  flex: 1;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  column-gap: var(--space-alert-action-left-ea9czk, 12px);
 }
 
-.awsui_hidden_mx3cw_1euw8_250:not(#\9) {
+.awsui_hidden_mx3cw_1r6ai_250:not(#\9) {
   display: none;
 }
 
-.awsui_initial-hidden_mx3cw_1euw8_314:not(#\9) {
+.awsui_initial-hidden_mx3cw_1r6ai_310:not(#\9) {
   overflow: hidden;
   block-size: 0;
 }
 
-.awsui_header_mx3cw_1euw8_319:not(#\9),
-.awsui_header-replacement_mx3cw_1euw8_320:not(#\9) {
+.awsui_header_mx3cw_1r6ai_315:not(#\9),
+.awsui_header-replacement_mx3cw_1r6ai_316:not(#\9) {
   font-weight: 700;
 }
 
-.awsui_action_mx3cw_1euw8_324:not(#\9) {
+.awsui_action_mx3cw_1r6ai_320:not(#\9) {
   white-space: nowrap;
-  margin-inline-start: var(--space-alert-action-left-ea9czk, 12px);
 }
 
-.awsui_action-slot_mx3cw_1euw8_329:not(#\9),
-.awsui_action-button_mx3cw_1euw8_330:not(#\9) {
+.awsui_action-slot_mx3cw_1r6ai_324:not(#\9),
+.awsui_action-button_mx3cw_1r6ai_325:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_alert-focus-wrapper_mx3cw_1euw8_334:not(#\9) {
+.awsui_alert-focus-wrapper_mx3cw_1r6ai_329:not(#\9) {
+  flex: 1;
+  min-inline-size: 70%;
   display: grid;
   grid-template-columns: min-content auto;
 }
-.awsui_alert-focus-wrapper_mx3cw_1euw8_334:not(#\9):focus {
+.awsui_alert-focus-wrapper_mx3cw_1r6ai_329:not(#\9):focus {
   outline: none;
 }
-body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1euw8_334:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1r6ai_329:not(#\9):focus {
   position: relative;
 }
-body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1euw8_334:not(#\9):focus {
+body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1r6ai_329:not(#\9):focus {
   outline: 2px dotted transparent;
   outline-offset: calc(var(--space-button-focus-outline-gutter-cqfd0c, 4px) - 1px);
 }
-body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1euw8_334:not(#\9):focus::before {
+body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1r6ai_329:not(#\9):focus::before {
   content: " ";
   display: block;
   position: absolute;
@@ -362,76 +359,78 @@ body[data-awsui-focus-visible=true] .awsui_alert-focus-wrapper_mx3cw_1euw8_334:n
   box-shadow: 0 0 0 2px var(--color-border-item-focused-nv6mhz, #006ce0);
 }
 
-.awsui_text_mx3cw_1euw8_363:not(#\9) {
+.awsui_text_mx3cw_1r6ai_360:not(#\9) {
   min-inline-size: 0;
   padding-block: var(--border-width-alert-t0f3yn, 2px);
   padding-inline: 0;
   margin-block: var(--space-scaled-xxs-7597g1, 4px);
   margin-inline: var(--space-xxs-p8yyaw, 4px);
 }
-.awsui_text_mx3cw_1euw8_363.awsui_icon_mx3cw_1euw8_370:not(#\9) {
+.awsui_text_mx3cw_1r6ai_360.awsui_icon_mx3cw_1r6ai_367:not(#\9) {
   margin-inline-start: 0;
 }
-.awsui_text_mx3cw_1euw8_363.awsui_message_mx3cw_1euw8_373:not(#\9) {
+.awsui_text_mx3cw_1r6ai_360.awsui_message_mx3cw_1r6ai_370:not(#\9) {
   margin-inline-end: var(--space-alert-message-right-knlb6u, 4px);
 }
 
-.awsui_breakpoint-default_mx3cw_1euw8_303 > .awsui_action_mx3cw_1euw8_324:not(#\9) {
-  grid-row: 2;
+.awsui_action-wrapped_mx3cw_1r6ai_374:not(#\9) {
   margin-block-end: var(--space-xxs-p8yyaw, 4px);
 }
-.awsui_breakpoint-default_mx3cw_1euw8_303.awsui_icon-size-medium_mx3cw_1euw8_381 > .awsui_action_mx3cw_1euw8_324:not(#\9) {
+
+.awsui_icon-size-medium_mx3cw_1r6ai_378 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_action-wrapped_mx3cw_1r6ai_374:not(#\9) {
   margin-inline-start: calc(var(--size-icon-medium-y9xuoq, 20px) + var(--space-xs-zb16t3, 8px));
 }
-.awsui_breakpoint-default_mx3cw_1euw8_303.awsui_icon-size-big_mx3cw_1euw8_384 > .awsui_action_mx3cw_1euw8_324:not(#\9) {
+
+.awsui_icon-size-big_mx3cw_1r6ai_382 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_action-wrapped_mx3cw_1r6ai_374:not(#\9) {
   margin-inline-start: calc(var(--size-icon-big-zkdryd, 32px) + var(--space-xs-zb16t3, 8px));
 }
-.awsui_breakpoint-default_mx3cw_1euw8_303.awsui_icon-size-normal_mx3cw_1euw8_387 > .awsui_action_mx3cw_1euw8_324:not(#\9) {
+
+.awsui_icon-size-normal_mx3cw_1r6ai_386 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_action-wrapped_mx3cw_1r6ai_374:not(#\9) {
   margin-inline-start: calc(var(--size-icon-normal-0m1722, 16px) + var(--space-xs-zb16t3, 8px));
 }
 
-.awsui_content_mx3cw_1euw8_391:not(#\9),
-.awsui_content-replacement_mx3cw_1euw8_392:not(#\9) {
+.awsui_content_mx3cw_1r6ai_390:not(#\9),
+.awsui_content-replacement_mx3cw_1r6ai_391:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_dismiss_mx3cw_1euw8_396:not(#\9) {
+.awsui_dismiss_mx3cw_1r6ai_395:not(#\9) {
   margin-inline-end: calc(-1 * var(--space-xxs-p8yyaw, 4px));
   margin-inline-start: var(--space-s-34lx8l, 12px);
 }
 
-.awsui_dismiss-button_mx3cw_1euw8_401:not(#\9) {
+.awsui_dismiss-button_mx3cw_1r6ai_400:not(#\9) {
   /* used in test-utils */
 }
 
-.awsui_type-error_mx3cw_1euw8_405:not(#\9) {
+.awsui_type-error_mx3cw_1r6ai_404:not(#\9) {
   border-color: var(--color-border-status-error-adxa56, #db0000);
   background-color: var(--color-background-status-error-5fz45j, #fff5f5);
 }
-.awsui_type-error_mx3cw_1euw8_405 > .awsui_alert-focus-wrapper_mx3cw_1euw8_334 > .awsui_icon_mx3cw_1euw8_370:not(#\9) {
+.awsui_type-error_mx3cw_1r6ai_404 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_alert-focus-wrapper_mx3cw_1r6ai_329 > .awsui_icon_mx3cw_1r6ai_367:not(#\9) {
   color: var(--color-text-status-error-5676bj, #db0000);
 }
 
-.awsui_type-warning_mx3cw_1euw8_413:not(#\9) {
+.awsui_type-warning_mx3cw_1r6ai_412:not(#\9) {
   border-color: var(--color-border-status-warning-3feumr, #855900);
   background-color: var(--color-background-status-warning-03nxlw, #fffef0);
 }
-.awsui_type-warning_mx3cw_1euw8_413 > .awsui_alert-focus-wrapper_mx3cw_1euw8_334 > .awsui_icon_mx3cw_1euw8_370:not(#\9) {
+.awsui_type-warning_mx3cw_1r6ai_412 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_alert-focus-wrapper_mx3cw_1r6ai_329 > .awsui_icon_mx3cw_1r6ai_367:not(#\9) {
   color: var(--color-text-status-warning-csaw41, #855900);
 }
 
-.awsui_type-success_mx3cw_1euw8_421:not(#\9) {
+.awsui_type-success_mx3cw_1r6ai_420:not(#\9) {
   border-color: var(--color-border-status-success-4x6srk, #00802f);
   background-color: var(--color-background-status-success-ua29ej, #effff1);
 }
-.awsui_type-success_mx3cw_1euw8_421 > .awsui_alert-focus-wrapper_mx3cw_1euw8_334 > .awsui_icon_mx3cw_1euw8_370:not(#\9) {
+.awsui_type-success_mx3cw_1r6ai_420 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_alert-focus-wrapper_mx3cw_1r6ai_329 > .awsui_icon_mx3cw_1r6ai_367:not(#\9) {
   color: var(--color-text-status-success-gqp5xk, #00802f);
 }
 
-.awsui_type-info_mx3cw_1euw8_429:not(#\9) {
+.awsui_type-info_mx3cw_1r6ai_428:not(#\9) {
   border-color: var(--color-border-status-info-z6pwqy, #006ce0);
   background-color: var(--color-background-status-info-gflgo4, #f0fbff);
 }
-.awsui_type-info_mx3cw_1euw8_429 > .awsui_alert-focus-wrapper_mx3cw_1euw8_334 > .awsui_icon_mx3cw_1euw8_370:not(#\9) {
+.awsui_type-info_mx3cw_1r6ai_428 > .awsui_alert-wrapper_mx3cw_1r6ai_298 > .awsui_alert-focus-wrapper_mx3cw_1r6ai_329 > .awsui_icon_mx3cw_1r6ai_367:not(#\9) {
   color: var(--color-text-status-info-7rlubr, #006ce0);
 }

package/alert/styles.selectors.js

@@ -2,33 +2,32 @@
     // es-module interop with Babel and Typescript
     Object.defineProperty(exports, "__esModule", { value: true });
     module.exports.default = {
-  "alert": "awsui_alert_mx3cw_1euw8_193",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1euw8_1",
-  "root": "awsui_root_mx3cw_1euw8_215",
-  "hidden": "awsui_hidden_mx3cw_1euw8_250",
-  "with-dismiss": "awsui_with-dismiss_mx3cw_1euw8_297",
-  "with-action": "awsui_with-action_mx3cw_1euw8_297",
-  "breakpoint-default": "awsui_breakpoint-default_mx3cw_1euw8_303",
-  "initial-hidden": "awsui_initial-hidden_mx3cw_1euw8_314",
-  "header": "awsui_header_mx3cw_1euw8_319",
-  "header-replacement": "awsui_header-replacement_mx3cw_1euw8_320",
-  "action": "awsui_action_mx3cw_1euw8_324",
-  "action-slot": "awsui_action-slot_mx3cw_1euw8_329",
-  "action-button": "awsui_action-button_mx3cw_1euw8_330",
-  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1euw8_334",
-  "text": "awsui_text_mx3cw_1euw8_363",
-  "icon": "awsui_icon_mx3cw_1euw8_370",
-  "message": "awsui_message_mx3cw_1euw8_373",
-  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1euw8_381",
-  "icon-size-big": "awsui_icon-size-big_mx3cw_1euw8_384",
-  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1euw8_387",
-  "content": "awsui_content_mx3cw_1euw8_391",
-  "content-replacement": "awsui_content-replacement_mx3cw_1euw8_392",
-  "dismiss": "awsui_dismiss_mx3cw_1euw8_396",
-  "dismiss-button": "awsui_dismiss-button_mx3cw_1euw8_401",
-  "type-error": "awsui_type-error_mx3cw_1euw8_405",
-  "type-warning": "awsui_type-warning_mx3cw_1euw8_413",
-  "type-success": "awsui_type-success_mx3cw_1euw8_421",
-  "type-info": "awsui_type-info_mx3cw_1euw8_429"
+  "alert": "awsui_alert_mx3cw_1r6ai_193",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1r6ai_1",
+  "root": "awsui_root_mx3cw_1r6ai_215",
+  "hidden": "awsui_hidden_mx3cw_1r6ai_250",
+  "alert-wrapper": "awsui_alert-wrapper_mx3cw_1r6ai_298",
+  "initial-hidden": "awsui_initial-hidden_mx3cw_1r6ai_310",
+  "header": "awsui_header_mx3cw_1r6ai_315",
+  "header-replacement": "awsui_header-replacement_mx3cw_1r6ai_316",
+  "action": "awsui_action_mx3cw_1r6ai_320",
+  "action-slot": "awsui_action-slot_mx3cw_1r6ai_324",
+  "action-button": "awsui_action-button_mx3cw_1r6ai_325",
+  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1r6ai_329",
+  "text": "awsui_text_mx3cw_1r6ai_360",
+  "icon": "awsui_icon_mx3cw_1r6ai_367",
+  "message": "awsui_message_mx3cw_1r6ai_370",
+  "action-wrapped": "awsui_action-wrapped_mx3cw_1r6ai_374",
+  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1r6ai_378",
+  "icon-size-big": "awsui_icon-size-big_mx3cw_1r6ai_382",
+  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1r6ai_386",
+  "content": "awsui_content_mx3cw_1r6ai_390",
+  "content-replacement": "awsui_content-replacement_mx3cw_1r6ai_391",
+  "dismiss": "awsui_dismiss_mx3cw_1r6ai_395",
+  "dismiss-button": "awsui_dismiss-button_mx3cw_1r6ai_400",
+  "type-error": "awsui_type-error_mx3cw_1r6ai_404",
+  "type-warning": "awsui_type-warning_mx3cw_1r6ai_412",
+  "type-success": "awsui_type-success_mx3cw_1r6ai_420",
+  "type-info": "awsui_type-info_mx3cw_1r6ai_428"
 };
   

package/flashbar/collapsible-flashbar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.tsx"],"names":[],"mappings":";AAwBA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAW7C,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,eAsUjF"}
+{"version":3,"file":"collapsible-flashbar.d.ts","sourceRoot":"","sources":["../../../src/flashbar/collapsible-flashbar.tsx"],"names":[],"mappings":";AAwBA,OAAO,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAW7C,MAAM,CAAC,OAAO,UAAU,mBAAmB,CAAC,EAAE,KAAK,EAAE,GAAG,SAAS,EAAE,EAAE,aAAa,eAqUjF"}