npm - @cloudscape-design/components-themeable - Versions diffs - 3.0.1352 → 3.0.1353 - Mend

@cloudscape-design/components-themeable 3.0.1352 → 3.0.1353

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (40) hide show

package/lib/internal/scss/icon/hover-motion.scss CHANGED Viewed

@@ -7,6 +7,9 @@
 // expressive motion via the `$expressive-motion-themes` list in
 // internal/styles/utils/theming.scss.
+@use 'sass:list';
+@use 'sass:map';
+@use 'sass:meta';
 @use '../internal/styles/utils/theming' as theming;
 // Descendant combinators and type selectors are unavoidable here since the trigger
@@ -14,8 +17,10 @@
 // stylelint-disable selector-combinator-disallowed-list, selector-max-type, selector-class-pattern
 // stylelint-disable @cloudscape-design/no-implicit-descendant
-$_duration-generic: 250ms;
-$_ease-decelerate: cubic-bezier(0, 0, 0, 1);
+$_ease-out: ease-out;
+$_ease-symmetric: cubic-bezier(0.33, 0, 0.67, 1);
+$_ease-decelerate: cubic-bezier(0.4, 0, 0.2, 1);
+$_ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
 // A disabled control must not react to hover.
 $_enabled-only: ':not(:disabled):not([aria-disabled="true"])';
@@ -35,10 +40,6 @@ $_hover-trigger: '[#{$_trigger-attribute}~="hover"]#{$_enabled-only}';
 $_target-attribute: 'data-awsui-motion-target';
 $_animating-icon: ':is([#{$_target-attribute}], :where([#{$_target-attribute}] *))';
-$_ease-out: ease-out;
-$_ease-symmetric: cubic-bezier(0.33, 0, 0.67, 1);
-$_ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
 $icon-hover-motion: (
   'announcement': (
     (
@@ -723,6 +724,151 @@ $icon-hover-motion: (
   ),
 );
+// Motion declarations must sit under a mixin named *with-motion, with at most sass
+// control flow in between, per the no-motion-outside-of-mixin stylelint rule. This is
+// that mixin: it scopes @content to opted-in themes and adds the runtime motion gate
+// ($_motion-on).
+@mixin with-motion {
+  @include theming.expressive-motion-only($_motion-on) {
+    @content;
+  }
+}
+// Also fires on :focus-visible, covering a focus owner nested inside the trigger.
+@mixin _on-hover-trigger($suffix) {
+  #{'#{$_hover-trigger}:hover #{$suffix}'},
+  #{'#{$_hover-trigger}:is(:focus-visible, :has([#{$_trigger-attribute}~="focus"]:focus-visible)) #{$suffix}'} {
+    @content;
+  }
+}
+@function _target($part) {
+  @if not $part {
+    @return '> :global(#{$_opted-in})';
+  }
+  @return '> :global(#{$_opted-in} .#{$part})';
+}
+// A single-spec entry needs a trailing comma or Prettier turns the list back into a bare map.
+@function _specs($value) {
+  @if meta.type-of($value) == 'map' {
+    @return list.append((), $value);
+  }
+  @return $value;
+}
+@mixin generic-hover-motion {
+  .icon > :global(#{$_opted-in}) {
+    @include with-motion {
+      transition-property: transform;
+      transition-duration: 250ms;
+      transition-timing-function: $_ease-decelerate;
+    }
+  }
+  @include _on-hover-trigger('.icon#{$_animating-icon} > :global(#{$_opted-in})') {
+    @include with-motion {
+      transform: scale(0.94);
+    }
+  }
+}
+// Icons with BOTH a whole-icon spec and a part spec are excluded — the cancel would out-specify the whole-icon rule and reset it to none.
+@mixin _cancel-floor-under-hover-parts {
+  $names: ();
+  $parts: ();
+  @each $name, $specs in $icon-hover-motion {
+    $whole-icon: false;
+    @each $spec in _specs($specs) {
+      @if not map.get($spec, part) {
+        $whole-icon: true;
+      }
+    }
+    @if not $whole-icon {
+      $names: list.append($names, '.name-#{$name}', comma);
+      @each $spec in _specs($specs) {
+        $part: '.#{map.get($spec, part)}';
+        @if not list.index($parts, $part) {
+          $parts: list.append($parts, $part, comma);
+        }
+      }
+    }
+  }
+  @if list.length($names) > 0 {
+    @include _on-hover-trigger('.icon#{$_animating-icon}:is(#{$names}) > :global(#{$_opted-in}:has(:is(#{$parts})))') {
+      @include with-motion {
+        transform: none;
+      }
+    }
+  }
+}
+@mixin per-icon-hover-motion {
+  @each $name, $specs in $icon-hover-motion {
+    @each $spec in _specs($specs) {
+      $part: map.get($spec, part);
+      $target: _target($part);
+      $to: map.get($spec, to);
+      $animation: map.get($spec, animation);
+      $duration: map.get($spec, duration);
+      $easing: map.get($spec, easing);
+      $base: map.get($spec, base);
+      $origin: map.get($spec, origin);
+      $property: map.get($spec, property) or transform;
+      $iterations: map.get($spec, iterations) or 1;
+      $fill: map.get($spec, fill) or none;
+      $delay: map.get($spec, delay) or 0s;
+      @if $to or $base or $origin {
+        .icon.name-#{$name} #{$target} {
+          @include with-motion {
+            @if $to {
+              transition-property: #{$property};
+              transition-duration: $duration;
+              transition-timing-function: $easing;
+            }
+            @if $base {
+              @each $property, $value in $base {
+                #{$property}: #{$value};
+              }
+            }
+            @if $origin {
+              transform-origin: $origin;
+            }
+          }
+        }
+      }
+      @include _on-hover-trigger('.icon#{$_animating-icon}.name-#{$name} #{$target}') {
+        @include with-motion {
+          @if $animation {
+            animation-name: $animation;
+            animation-duration: $duration;
+            animation-timing-function: $easing;
+            @if $iterations != 1 {
+              animation-iteration-count: $iterations;
+            }
+            @if $fill != none {
+              animation-fill-mode: $fill;
+            }
+            @if $delay != 0s {
+              animation-delay: $delay;
+            }
+          } @else if $to {
+            @each $property, $value in $to {
+              #{$property}: #{$value};
+            }
+          }
+        }
+      }
+    }
+  }
+}
 // @keyframes cannot nest under a class, so they're gated on the artefact instead of the selector.
 @mixin keyframes {
   @if theming.has-expressive-motion() {
@@ -1005,40 +1151,39 @@ $icon-hover-motion: (
   }
 }
-// Named with-motion so the no-motion-outside-of-mixin stylelint rule can find callers.
-@mixin with-motion {
-  @include theming.expressive-motion-only($_motion-on) {
-    @content;
-  }
-}
+$_spec-keys: (part, animation, to, base, origin, duration, easing, delay, iterations, fill, property);
-// Also fires on :focus-visible, covering a focus owner nested inside the trigger.
-@mixin _on-hover-trigger($suffix) {
-  #{'#{$_hover-trigger}:hover #{$suffix}'},
-  #{'#{$_hover-trigger}:is(:focus-visible, :has([#{$_trigger-attribute}~="focus"]:focus-visible)) #{$suffix}'} {
-    @content;
-  }
-}
+@mixin _validate-specs {
+  @each $name, $specs in $icon-hover-motion {
+    @each $spec in _specs($specs) {
+      @each $key, $value in $spec {
+        @if not list.index($_spec-keys, $key) {
+          @error 'Unknown key `#{$key}` in the $icon-hover-motion spec for `#{$name}`. ' +
+            'Known keys: #{$_spec-keys}.';
+        }
+      }
-@mixin generic-hover-motion {
-  .icon > :global(#{$_opted-in}) {
-    @include with-motion {
-      transition-property: transform;
-      transition-duration: $_duration-generic;
-      transition-timing-function: $_ease-decelerate;
-    }
-  }
+      @if map.get($spec, animation) and map.get($spec, to) {
+        @error 'The $icon-hover-motion spec for `#{$name}` sets both `animation` and `to`. ' +
+          'Use `animation` for keyframe-driven motion or `to` for a transition, not both.';
+      }
-  @include _on-hover-trigger('.icon#{$_animating-icon} > :global(#{$_opted-in})') {
-    @include with-motion {
-      transform: scale(0.94);
+      @if (map.get($spec, animation) or map.get($spec, to)) and not
+        (map.get($spec, duration) and map.get($spec, easing))
+      {
+        @error 'The $icon-hover-motion spec for `#{$name}` sets motion but is missing `duration` or `easing`.';
+      }
     }
   }
 }
 @mixin icon-hover-motion {
+  @include _validate-specs; // checks if per-icon motion definitions are properly defined
+  @include keyframes;
   @media (prefers-reduced-motion: no-preference) {
     @include generic-hover-motion;
+    @include _cancel-floor-under-hover-parts; // ensures generic motion does not apply to icons with bespoke motion
+    @include per-icon-hover-motion;
   }
 }

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

@@ -1,6 +1,6 @@
     // Build environment
-    $awsui-commit-hash: "189b5ce7";
+    $awsui-commit-hash: "4194984b";
     // Manually managed CSS-variables
     $maxContentWidth: --awsui-max-content-width-esndbs;
 $minContentWidth: --awsui-min-content-width-esndbs;

package/lib/internal/scss/internal/styles/style-api.scss ADDED Viewed

@@ -0,0 +1,45 @@
+/*
+ Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.
+ SPDX-License-Identifier: Apache-2.0
+*/
+@forward '@cloudscape-design/component-toolkit/internal/style-api';
+@use '@cloudscape-design/component-toolkit/internal/style-api' as toolkit;
+@use './tokens' as awsui;
+@use './foundation' as foundation;
+@use './forms/mixins' as forms;
+// Shared, component-agnostic Style API v2 token groups + the helpers that consume them. Components
+// combine these groups (see combine()), register() the public tokens, and re-anchor them with
+// carriers() on their boundary element so descendants / pseudo-elements read them per instance.
+// Common surface tokens (background / text / border / border-radius / border-width), shared by
+// badge, alert, button, etc.
+$surface: (color, background-color, border-color, border-width, border-radius);
+// Focus-outline tokens, shared by every focusable component (button, alert dismiss, ...).
+$focus-ring: (focus-ring-color, focus-ring-width, focus-ring-radius, focus-ring-gutter-block, focus-ring-gutter-inline);
+// Carrier map for the focus-outline group: reads resolve to the inherited --awsui-internal-style-*
+// carriers (re-anchored by carriers() on the component root), so the ring below reaches ::before.
+$_focus-ring-carriers: toolkit.resolve($focus-ring, carrier);
+// A wrapper for forms.focus-highlight with style API integration.
+@mixin focus-highlight(
+  $gutter-block: awsui.$space-button-focus-outline-gutter,
+  $gutter-inline: awsui.$space-button-focus-outline-gutter,
+  $radius: awsui.$border-radius-control-default-focus-ring,
+  $width: foundation.$box-shadow-focused-width,
+  $color: awsui.$color-border-item-focused
+) {
+  @include forms.focus-highlight(
+    $gutter: (
+      'vertical': var(#{toolkit.read($_focus-ring-carriers, focus-ring-gutter-block)}, #{$gutter-block}),
+      'horizontal': var(#{toolkit.read($_focus-ring-carriers, focus-ring-gutter-inline)}, #{$gutter-inline}),
+    ),
+    $border-radius: var(#{toolkit.read($_focus-ring-carriers, focus-ring-radius)}, #{$radius}),
+    $box-shadow: 0 0 0 var(#{toolkit.read($_focus-ring-carriers, focus-ring-width)}, #{$width})
+      var(#{toolkit.read($_focus-ring-carriers, focus-ring-color)}, #{$color})
+  );
+}

package/lib/internal/template/alert/internal.d.ts CHANGED Viewed

@@ -1,11 +1,17 @@
 import React from 'react';
 import { InternalBaseComponentProps } from '../internal/hooks/use-base-component';
 import { AlertProps } from './interfaces';
+interface StyleClassNames {
+    root?: string;
+    icon?: string;
+    dismissButton?: string;
+}
 declare const InternalAlert: React.ForwardRefExoticComponent<AlertProps & {
     type: AlertProps.Type;
 } & InternalBaseComponentProps & {
     messageSlotId?: string;
     style?: AlertProps["style"];
+    styleClassNames?: StyleClassNames;
 } & React.RefAttributes<AlertProps.Ref>>;
 export default InternalAlert;
 //# sourceMappingURL=internal.d.ts.map

package/lib/internal/template/alert/internal.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/alert/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAehF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AASlF,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;~~AAsB1C~~,QAAA,MAAM,aAAa;;;~~oBAPC~~,MAAM;YACd,UAAU,CAAC,OAAO,CAAC;~~wCA8N9B~~,CAAC;AAEF,eAAe,aAAa,CAAC"}
1	+ {"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/alert/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA2D,MAAM,OAAO,CAAC;AAehF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AASlF,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAqB1C,UAAU,eAAe;IACvB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,MAAM,CAAC;CACxB;AAKD,QAAA,MAAM,aAAa;;;oBAfC,MAAM;YACd,UAAU,CAAC,OAAO,CAAC;sBACT,eAAe;wCAwOpC,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/internal/template/alert/internal.js CHANGED Viewed

@@ -29,7 +29,7 @@ const typeToIcon = {
 };
 const useDiscoveredAction = createUseDiscoveredAction(awsuiPluginsInternal.alert.onActionRegistered);
 const useDiscoveredContent = createUseDiscoveredContent('alert', awsuiPluginsInternal.alertContent);
-const InternalAlert = React.forwardRef(({ type, i18nStrings, visible = true, dismissible, children, header, buttonText, action, onDismiss, onButtonClick, __internalRootRef, statusIconAriaLabel: deprecatedStatusIconAriaLabel, dismissAriaLabel: deprecatedDismissAriaLabel, messageSlotId, style, persistenceConfig, ...rest }, ref) => {
+const InternalAlert = React.forwardRef(({ type, i18nStrings, visible = true, dismissible, children, header, buttonText, action, onDismiss, onButtonClick, __internalRootRef, statusIconAriaLabel: deprecatedStatusIconAriaLabel, dismissAriaLabel: deprecatedDismissAriaLabel, messageSlotId, style, persistenceConfig, styleClassNames, ...rest }, ref) => {
     var _a, _b;
     const baseProps = getBaseProps(rest);
     const i18n = useInternalI18n('alert');
@@ -99,10 +99,10 @@ const InternalAlert = React.forwardRef(({ type, i18nStrings, visible = true, dis
     return (React.createElement("div", { ...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']), style: getAlertStyles(style) },
+                React.createElement("div", { className: clsx(styleClassNames === null || styleClassNames === void 0 ? void 0 : styleClassNames.root, styles.alert, styles[`type-${type}`], styles[`icon-size-${size}`], hasAction && styles['with-action'], dismissible && styles['with-dismiss']), style: getAlertStyles(style) },
                     React.createElement("div", { className: styles['alert-wrapper'] },
                         React.createElement("div", { className: styles['alert-focus-wrapper'], ref: focusRef, role: "group", onBlur: handleBlur },
-                            React.createElement("div", { className: clsx(styles.icon, styles.text), style: getIconStyles(style) },
+                            React.createElement("div", { className: clsx(styleClassNames === null || styleClassNames === void 0 ? void 0 : styleClassNames.icon, styles.icon, styles.text), style: getIconStyles(style) },
                                 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),
@@ -116,7 +116,7 @@ const InternalAlert = React.forwardRef(({ type, i18nStrings, visible = true, dis
                     dismissible && (React.createElement("div", { className: styles.dismiss, ...getAnalyticsMetadataAttribute({
                             action: 'dismiss',
                         }) },
-                        React.createElement(InternalButton, { className: styles['dismiss-button'], variant: "icon", iconName: "close", formAction: "none", ariaLabel: dismissAriaLabel, onClick: dismiss, style: getDismissButtonStyles(style) }))))))));
+                        React.createElement(InternalButton, { className: styles['dismiss-button'], variant: "icon", iconName: "close", formAction: "none", ariaLabel: dismissAriaLabel, onClick: dismiss, style: getDismissButtonStyles(style), styleClassNames: { root: styleClassNames === null || styleClassNames === void 0 ? void 0 : styleClassNames.dismissButton } }))))))));
 });
 export default InternalAlert;
 //# sourceMappingURL=internal.js.map

package/lib/internal/template/alert/internal.js.map CHANGED Viewed

	@@ -1 +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, { useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\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 { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { persistAlertDismiss, retrieveAlertDismiss } from '../internal/persistence';\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';\nimport { getAlertStyles, getDismissButtonStyles, getIconStyles } from './style';\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 & {\n messageSlotId?: string;\n style?: AlertProps['style'];\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,\n statusIconAriaLabel: deprecatedStatusIconAriaLabel,\n dismissAriaLabel: deprecatedDismissAriaLabel,\n messageSlotId,\n style,\n persistenceConfig,\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 useImperativeHandle(ref, () => ({\n focus: () => {\n if (focusRef.current) {\n focusRef.current.tabIndex = -1;\n focusRef.current.focus();\n }\n },\n }));\n const handleBlur = () => {\n if (focusRef.current) {\n focusRef.current.removeAttribute('tabindex');\n }\n };\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 const [isPersistentlyDismissed, setIsPersistentlyDismissed] = useState(\n !!(persistenceConfig && persistenceConfig.uniqueKey)\n );\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 useEffect(() => {\n let isMounted = true;\n if (persistenceConfig?.uniqueKey) {\n retrieveAlertDismiss(persistenceConfig)\n .then(dismissed => {\n if (isMounted) {\n setIsPersistentlyDismissed(!!dismissed);\n }\n })\n .catch(() => {\n if (isMounted) {\n setIsPersistentlyDismissed(false);\n }\n });\n }\n return () => {\n isMounted = false;\n };\n\n // Only track specific properties to avoid re-running when persistenceConfig object reference changes\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [persistenceConfig?.uniqueKey, persistenceConfig?.crossServicePersistence]);\n\n const dismiss = () => {\n fireNonCancelableEvent(onDismiss);\n if (persistenceConfig?.uniqueKey) {\n persistAlertDismiss(persistenceConfig);\n }\n };\n\n if (isPersistentlyDismissed) {\n return null;\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 style={getAlertStyles(style)}\n >\n <div className={styles['alert-wrapper']}>\n <div className={styles['alert-focus-wrapper']} ref={focusRef} role=\"group\" onBlur={handleBlur}>\n <div className={clsx(styles.icon, styles.text)} style={getIconStyles(style)}>\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={dismiss}\n style={getDismissButtonStyles(style)}\n />\n </div>\n )}\n </div>\n </VisualContext>\n </LinkDefaultVariantContext.Provider>\n </div>\n );\n }\n);\n\nexport default InternalAlert;\n"]}
1	+ {"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/alert/internal.tsx"],"names":[],"mappings":"AAAA,qEAAqE;AACrE,sCAAsC;AACtC,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,mBAAmB,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAChF,OAAO,IAAI,MAAM,MAAM,CAAC;AAExB,OAAO,EAAE,YAAY,EAAE,MAAM,+CAA+C,CAAC;AAC7E,OAAO,EAAE,6BAA6B,EAAE,MAAM,kEAAkE,CAAC;AAEjH,OAAO,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAElD,OAAO,YAAY,MAAM,kBAAkB,CAAC;AAC5C,OAAO,EAAE,yBAAyB,EAAE,MAAM,iCAAiC,CAAC;AAC5E,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAC1D,OAAO,aAAa,MAAM,uCAAuC,CAAC;AAClE,OAAO,EAAE,yBAAyB,EAAE,MAAM,kDAAkD,CAAC;AAC7F,OAAO,EAAE,sBAAsB,EAAE,MAAM,oBAAoB,CAAC;AAE5D,OAAO,EAAE,gBAAgB,EAAE,MAAM,mCAAmC,CAAC;AACrE,OAAO,EAAE,mBAAmB,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AACpF,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,yBAAyB,EAAE,0BAA0B,EAAE,MAAM,6BAA6B,CAAC;AAEpG,OAAO,iBAAiB,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAGnD,OAAO,EAAE,cAAc,EAAE,sBAAsB,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAEhF,OAAO,kBAAkB,MAAM,oCAAoC,CAAC;AACpE,OAAO,MAAM,MAAM,iBAAiB,CAAC;AAErC,MAAM,UAAU,GAA+C;IAC7D,KAAK,EAAE,iBAAiB;IACxB,OAAO,EAAE,gBAAgB;IACzB,OAAO,EAAE,iBAAiB;IAC1B,IAAI,EAAE,aAAa;CACpB,CAAC;AAgBF,MAAM,mBAAmB,GAAG,yBAAyB,CAAC,oBAAoB,CAAC,KAAK,CAAC,kBAAkB,CAAC,CAAC;AACrG,MAAM,oBAAoB,GAAG,0BAA0B,CAAC,OAAO,EAAE,oBAAoB,CAAC,YAAY,CAAC,CAAC;AAEpG,MAAM,aAAa,GAAG,KAAK,CAAC,UAAU,CACpC,CACE,EACE,IAAI,EACJ,WAAW,EACX,OAAO,GAAG,IAAI,EACd,WAAW,EACX,QAAQ,EACR,MAAM,EACN,UAAU,EACV,MAAM,EACN,SAAS,EACT,aAAa,EACb,iBAAiB,EACjB,mBAAmB,EAAE,6BAA6B,EAClD,gBAAgB,EAAE,0BAA0B,EAC5C,aAAa,EACb,KAAK,EACL,iBAAiB,EACjB,eAAe,EACf,GAAG,IAAI,EACY,EACrB,GAA8B,EAC9B,EAAE;;IACF,MAAM,SAAS,GAAG,YAAY,CAAC,IAAI,CAAC,CAAC;IACrC,MAAM,IAAI,GAAG,eAAe,CAAC,OAAO,CAAC,CAAC;IAEtC,MAAM,QAAQ,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAC9C,mBAAmB,CAAC,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;QAC9B,KAAK,EAAE,GAAG,EAAE;YACV,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;gBACrB,QAAQ,CAAC,OAAO,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;gBAC/B,QAAQ,CAAC,OAAO,CAAC,KAAK,EAAE,CAAC;YAC3B,CAAC;QACH,CAAC;KACF,CAAC,CAAC,CAAC;IACJ,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,IAAI,QAAQ,CAAC,OAAO,EAAE,CAAC;YACrB,QAAQ,CAAC,OAAO,CAAC,eAAe,CAAC,UAAU,CAAC,CAAC;QAC/C,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,EAAE,iBAAiB,EAAE,SAAS,EAAE,eAAe,EAAE,UAAU,EAAE,gBAAgB,EAAE,GAAG,mBAAmB,CAAC,IAAI,CAAC,CAAC;IAClH,MAAM,EACJ,aAAa,EACb,qBAAqB,EACrB,sBAAsB,EACtB,SAAS,EAAE,gBAAgB,EAC3B,UAAU,EAAE,iBAAiB,EAC7B,oBAAoB,EACpB,qBAAqB,GACtB,GAAG,oBAAoB,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC;IAErD,MAAM,CAAC,cAAc,EAAE,mBAAmB,CAAC,GAAG,iBAAiB,EAAE,CAAC;IAClE,MAAM,YAAY,GAAG,YAAY,CAAC,mBAAmB,EAAE,iBAAiB,CAAC,CAAC;IAC1E,MAAM,SAAS,GAAG,YAAY,CAAC,eAAe,EAAE,gBAAgB,CAAC,CAAC;IAClE,MAAM,UAAU,GAAG,YAAY,CAAC,gBAAgB,EAAE,iBAAiB,CAAC,CAAC;IACrE,MAAM,CAAC,uBAAuB,EAAE,0BAA0B,CAAC,GAAG,QAAQ,CACpE,CAAC,CAAC,CAAC,iBAAiB,IAAI,iBAAiB,CAAC,SAAS,CAAC,CACrD,CAAC;IAEF,MAAM,SAAS,GAAG,gBAAgB,EAAE,CAAC;IACrC,MAAM,IAAI,GAAG,SAAS;QACpB,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,qBAAqB,KAAK,QAAQ,IAAI,MAAM,IAAI,sBAAsB,KAAK,QAAQ,IAAI,QAAQ;YAC/F,CAAC,CAAC,KAAK;YACP,CAAC,CAAC,QAAQ,CAAC;IAEf,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,IAAI,UAAU,IAAI,iBAAiB,CAAC,MAAM,CAAC,CAAC;IAE5E,MAAM,mBAAmB,GAAG;QAC1B,CAAC,yBAAyB,CAAC,EAAE,IAAI;KAClC,CAAC;IAEF,MAAM,mBAAmB,GAAG,IAAI,CAC9B,eAAe,IAAI,eAAe,EAClC,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,GAAG,IAAI,eAAe,CAAC,mCAAI,6BAA6B,CACvE,CAAC;IAEF,MAAM,gBAAgB,GAAG,IAAI,CAC3B,8BAA8B,EAC9B,MAAA,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,gBAAgB,mCAAI,IAAI,CAAC,kBAAkB,EAAE,0BAA0B,CAAC,CACtF,CAAC;IAEF,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,SAAS,GAAG,IAAI,CAAC;QACrB,IAAI,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,SAAS,EAAE,CAAC;YACjC,oBAAoB,CAAC,iBAAiB,CAAC;iBACpC,IAAI,CAAC,SAAS,CAAC,EAAE;gBAChB,IAAI,SAAS,EAAE,CAAC;oBACd,0BAA0B,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;gBAC1C,CAAC;YACH,CAAC,CAAC;iBACD,KAAK,CAAC,GAAG,EAAE;gBACV,IAAI,SAAS,EAAE,CAAC;oBACd,0BAA0B,CAAC,KAAK,CAAC,CAAC;gBACpC,CAAC;YACH,CAAC,CAAC,CAAC;QACP,CAAC;QACD,OAAO,GAAG,EAAE;YACV,SAAS,GAAG,KAAK,CAAC;QACpB,CAAC,CAAC;QAEF,qGAAqG;QACrG,uDAAuD;IACzD,CAAC,EAAE,CAAC,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,SAAS,EAAE,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,uBAAuB,CAAC,CAAC,CAAC;IAE/E,MAAM,OAAO,GAAG,GAAG,EAAE;QACnB,sBAAsB,CAAC,SAAS,CAAC,CAAC;QAClC,IAAI,iBAAiB,aAAjB,iBAAiB,uBAAjB,iBAAiB,CAAE,SAAS,EAAE,CAAC;YACjC,mBAAmB,CAAC,iBAAiB,CAAC,CAAC;QACzC,CAAC;IACH,CAAC,CAAC;IAEF,IAAI,uBAAuB,EAAE,CAAC;QAC5B,OAAO,IAAI,CAAC;IACd,CAAC;IAED,OAAO,CACL,gCACM,SAAS,KACT,mBAAmB,iBACV,CAAC,OAAO,EACrB,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,IAAI,EACX,EAAE,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,OAAO,EAAE,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC,EAAE,aAAa,EAAE,EACxE,SAAS,CAAC,SAAS,CACpB,EACD,GAAG,EAAE,YAAY;QAEjB,oBAAC,yBAAyB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,cAAc,EAAE,SAAS,EAAE;YACtE,oBAAC,aAAa,IAAC,WAAW,EAAC,OAAO;gBAChC,6BACE,SAAS,EAAE,IAAI,CACb,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,IAAI,EACrB,MAAM,CAAC,KAAK,EACZ,MAAM,CAAC,QAAQ,IAAI,EAAE,CAAC,EACtB,MAAM,CAAC,aAAa,IAAI,EAAE,CAAC,EAC3B,SAAS,IAAI,MAAM,CAAC,aAAa,CAAC,EAClC,WAAW,IAAI,MAAM,CAAC,cAAc,CAAC,CACtC,EACD,KAAK,EAAE,cAAc,CAAC,KAAK,CAAC;oBAE5B,6BAAK,SAAS,EAAE,MAAM,CAAC,eAAe,CAAC;wBACrC,6BAAK,SAAS,EAAE,MAAM,CAAC,qBAAqB,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAC,OAAO,EAAC,MAAM,EAAE,UAAU;4BAC3F,6BAAK,SAAS,EAAE,IAAI,CAAC,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,IAAI,EAAE,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC;gCAChG,oBAAC,YAAY,IAAC,IAAI,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,SAAS,EAAE,mBAAmB,GAAI,CAChF;4BACN,6BAAK,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,EAAE,EAAE,EAAE,aAAa;gCAClE,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,IAAI,MAAM,CAAC,MAAM,EACvB,qBAAqB,KAAK,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,MAAM,CACjF,EACD,GAAG,EAAE,SAAS,IAEb,MAAM,CACH;gCACN,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,oBAAoB,CAAC,EAC5B,qBAAqB,KAAK,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,kBAAkB,CAAC,MAAM,CACjF,EACD,GAAG,EAAE,oBAAoB,GACpB;gCACP,6BACE,SAAS,EAAE,IAAI,CAAC,MAAM,CAAC,OAAO,EAAE,sBAAsB,KAAK,UAAU,IAAI,MAAM,CAAC,MAAM,CAAC,EACvF,GAAG,EAAE,UAAU,IAEd,QAAQ,CACL;gCACN,6BACE,SAAS,EAAE,IAAI,CACb,MAAM,CAAC,qBAAqB,CAAC,EAC7B,sBAAsB,KAAK,UAAU,IAAI,MAAM,CAAC,MAAM,CACvD,EACD,GAAG,EAAE,qBAAqB,GACrB,CACH,CACF;wBACN,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,MAAM,EACxB,eAAe,EAAE;gCACf,UAAU,EAAE,MAAM,CAAC,aAAa,CAAC;gCACjC,YAAY,EAAE,MAAM,CAAC,eAAe,CAAC;6BACtC,EACD,MAAM,EAAE,MAAM,EACd,iBAAiB,EAAE,iBAAiB,EACpC,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,GAAG,EAAE,CAAC,sBAAsB,CAAC,aAAa,CAAC,EAC1D,cAAc,EAAE,cAAc,EAC9B,YAAY,EAAE,MAAM,CAAC,gBAAgB,CAAC,GACtC,CACE;oBACL,WAAW,IAAI,CACd,6BACE,SAAS,EAAE,MAAM,CAAC,OAAO,KACrB,6BAA6B,CAAC;4BAChC,MAAM,EAAE,SAAS;yBACiC,CAAC;wBAErD,oBAAC,cAAc,IACb,SAAS,EAAE,MAAM,CAAC,gBAAgB,CAAC,EACnC,OAAO,EAAC,MAAM,EACd,QAAQ,EAAC,OAAO,EAChB,UAAU,EAAC,MAAM,EACjB,SAAS,EAAE,gBAAgB,EAC3B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,sBAAsB,CAAC,KAAK,CAAC,EACpC,eAAe,EAAE,EAAE,IAAI,EAAE,eAAe,aAAf,eAAe,uBAAf,eAAe,CAAE,aAAa,EAAE,GACzD,CACE,CACP,CACG,CACQ,CACmB,CACjC,CACP,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,aAAa,CAAC","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { useEffect, useImperativeHandle, useRef, useState } from 'react';\nimport clsx from 'clsx';\n\nimport { useMergeRefs } from '@cloudscape-design/component-toolkit/internal';\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 { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { persistAlertDismiss, retrieveAlertDismiss } from '../internal/persistence';\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';\nimport { getAlertStyles, getDismissButtonStyles, getIconStyles } from './style';\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 & {\n messageSlotId?: string;\n style?: AlertProps['style'];\n styleClassNames?: StyleClassNames;\n };\n\n// Style API v2\ninterface StyleClassNames {\n root?: string;\n icon?: string;\n dismissButton?: 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,\n statusIconAriaLabel: deprecatedStatusIconAriaLabel,\n dismissAriaLabel: deprecatedDismissAriaLabel,\n messageSlotId,\n style,\n persistenceConfig,\n styleClassNames,\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 useImperativeHandle(ref, () => ({\n focus: () => {\n if (focusRef.current) {\n focusRef.current.tabIndex = -1;\n focusRef.current.focus();\n }\n },\n }));\n const handleBlur = () => {\n if (focusRef.current) {\n focusRef.current.removeAttribute('tabindex');\n }\n };\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 const [isPersistentlyDismissed, setIsPersistentlyDismissed] = useState(\n !!(persistenceConfig && persistenceConfig.uniqueKey)\n );\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 useEffect(() => {\n let isMounted = true;\n if (persistenceConfig?.uniqueKey) {\n retrieveAlertDismiss(persistenceConfig)\n .then(dismissed => {\n if (isMounted) {\n setIsPersistentlyDismissed(!!dismissed);\n }\n })\n .catch(() => {\n if (isMounted) {\n setIsPersistentlyDismissed(false);\n }\n });\n }\n return () => {\n isMounted = false;\n };\n\n // Only track specific properties to avoid re-running when persistenceConfig object reference changes\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [persistenceConfig?.uniqueKey, persistenceConfig?.crossServicePersistence]);\n\n const dismiss = () => {\n fireNonCancelableEvent(onDismiss);\n if (persistenceConfig?.uniqueKey) {\n persistAlertDismiss(persistenceConfig);\n }\n };\n\n if (isPersistentlyDismissed) {\n return null;\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 styleClassNames?.root,\n styles.alert,\n styles[`type-${type}`],\n styles[`icon-size-${size}`],\n hasAction && styles['with-action'],\n dismissible && styles['with-dismiss']\n )}\n style={getAlertStyles(style)}\n >\n <div className={styles['alert-wrapper']}>\n <div className={styles['alert-focus-wrapper']} ref={focusRef} role=\"group\" onBlur={handleBlur}>\n <div className={clsx(styleClassNames?.icon, styles.icon, styles.text)} style={getIconStyles(style)}>\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={dismiss}\n style={getDismissButtonStyles(style)}\n styleClassNames={{ root: styleClassNames?.dismissButton }}\n />\n </div>\n )}\n </div>\n </VisualContext>\n </LinkDefaultVariantContext.Provider>\n </div>\n );\n }\n);\n\nexport default InternalAlert;\n"]}

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

@@ -1,32 +1,32 @@
     import './styles.scoped.css';
     export default {
-  "alert": "awsui_alert_mx3cw_3c8y4_189",
-  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_3c8y4_1",
-  "root": "awsui_root_mx3cw_3c8y4_211",
-  "hidden": "awsui_hidden_mx3cw_3c8y4_246",
-  "alert-wrapper": "awsui_alert-wrapper_mx3cw_3c8y4_298",
-  "initial-hidden": "awsui_initial-hidden_mx3cw_3c8y4_310",
-  "header": "awsui_header_mx3cw_3c8y4_315",
-  "header-replacement": "awsui_header-replacement_mx3cw_3c8y4_316",
-  "action": "awsui_action_mx3cw_3c8y4_320",
-  "action-slot": "awsui_action-slot_mx3cw_3c8y4_324",
-  "action-button": "awsui_action-button_mx3cw_3c8y4_325",
-  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_3c8y4_329",
-  "text": "awsui_text_mx3cw_3c8y4_360",
-  "icon": "awsui_icon_mx3cw_3c8y4_367",
-  "message": "awsui_message_mx3cw_3c8y4_370",
-  "action-wrapped": "awsui_action-wrapped_mx3cw_3c8y4_374",
-  "icon-size-medium": "awsui_icon-size-medium_mx3cw_3c8y4_378",
-  "icon-size-big": "awsui_icon-size-big_mx3cw_3c8y4_382",
-  "icon-size-normal": "awsui_icon-size-normal_mx3cw_3c8y4_386",
-  "content": "awsui_content_mx3cw_3c8y4_390",
-  "content-replacement": "awsui_content-replacement_mx3cw_3c8y4_391",
-  "dismiss": "awsui_dismiss_mx3cw_3c8y4_395",
-  "dismiss-button": "awsui_dismiss-button_mx3cw_3c8y4_400",
-  "type-error": "awsui_type-error_mx3cw_3c8y4_404",
-  "type-warning": "awsui_type-warning_mx3cw_3c8y4_412",
-  "type-success": "awsui_type-success_mx3cw_3c8y4_420",
-  "type-info": "awsui_type-info_mx3cw_3c8y4_428"
+  "alert": "awsui_alert_mx3cw_1x3zi_201",
+  "awsui-motion-fade-in": "awsui_awsui-motion-fade-in_mx3cw_1x3zi_1",
+  "root": "awsui_root_mx3cw_1x3zi_272",
+  "hidden": "awsui_hidden_mx3cw_1x3zi_307",
+  "alert-wrapper": "awsui_alert-wrapper_mx3cw_1x3zi_370",
+  "initial-hidden": "awsui_initial-hidden_mx3cw_1x3zi_382",
+  "header": "awsui_header_mx3cw_1x3zi_387",
+  "header-replacement": "awsui_header-replacement_mx3cw_1x3zi_388",
+  "action": "awsui_action_mx3cw_1x3zi_392",
+  "action-slot": "awsui_action-slot_mx3cw_1x3zi_396",
+  "action-button": "awsui_action-button_mx3cw_1x3zi_397",
+  "alert-focus-wrapper": "awsui_alert-focus-wrapper_mx3cw_1x3zi_401",
+  "icon": "awsui_icon_mx3cw_1x3zi_433",
+  "text": "awsui_text_mx3cw_1x3zi_437",
+  "message": "awsui_message_mx3cw_1x3zi_447",
+  "action-wrapped": "awsui_action-wrapped_mx3cw_1x3zi_451",
+  "icon-size-medium": "awsui_icon-size-medium_mx3cw_1x3zi_455",
+  "icon-size-big": "awsui_icon-size-big_mx3cw_1x3zi_459",
+  "icon-size-normal": "awsui_icon-size-normal_mx3cw_1x3zi_463",
+  "content": "awsui_content_mx3cw_1x3zi_467",
+  "content-replacement": "awsui_content-replacement_mx3cw_1x3zi_468",
+  "dismiss": "awsui_dismiss_mx3cw_1x3zi_472",
+  "dismiss-button": "awsui_dismiss-button_mx3cw_1x3zi_478",
+  "type-error": "awsui_type-error_mx3cw_1x3zi_482",
+  "type-warning": "awsui_type-warning_mx3cw_1x3zi_490",
+  "type-success": "awsui_type-success_mx3cw_1x3zi_498",
+  "type-info": "awsui_type-info_mx3cw_1x3zi_506"
 };