@transferwise/components 0.0.0-experimental-c7da7db → 0.0.0-experimental-b03ca75

package/build/prompt/ActionPrompt/ActionPrompt.mjs

@@ -1,6 +1,5 @@
 import { useId } from 'react';
 import { clsx } from 'clsx';
-import StatusIcon from '../../statusIcon/StatusIcon.mjs';
 import Body from '../../body/Body.mjs';
 import Button from '../../button/Button.resolver.mjs';
 import '../../common/theme.mjs';
@@ -22,15 +21,13 @@ import '../../common/propsValues/variant.mjs';
 import '../../common/propsValues/scroll.mjs';
 import '../../common/propsValues/markdownNodeType.mjs';
 import '../../common/fileType.mjs';
-import '@transferwise/formatting';
-import { GiftBox } from '@transferwise/icons';
+import '@transferwise/icons';
 import 'react-intl';
 import '../../common/closeButton/CloseButton.messages.mjs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import AvatarView from '../../avatarView/AvatarView.mjs';
-import Image from '../../image/Image.mjs';
 import { PrimitivePrompt } from '../PrimitivePrompt/PrimitivePrompt.mjs';
 import { useScreenSize } from '../../common/hooks/useScreenSize.mjs';
+import { renderPromptMedia } from '../helpers/promptMedia.mjs';
 
 const ActionPrompt = ({
   sentiment = 'neutral',
@@ -50,42 +47,12 @@ const ActionPrompt = ({
   const titleId = useId();
   const descId = useId();
   const ariaLabelledByIds = [media['aria-hidden'] ? undefined : mediaId, ariaLabel ? undefined : titleId].filter(Boolean).join(' ');
-  const renderMedia = () => {
-    if (media?.imgSrc) {
-      return /*#__PURE__*/jsx(Image, {
-        id: mediaId,
-        src: media.imgSrc,
-        className: "wds-action-prompt--media-image",
-        alt: media['aria-label'] ?? ''
-      });
-    }
-    if (media?.avatar) {
-      const badge = media.avatar.badge ? media.avatar.badge : sentiment === 'proposition' ? {} : {
-        status: sentiment
-      };
-      return /*#__PURE__*/jsx(AvatarView, {
-        ...media.avatar,
-        badge: badge,
-        "aria-label": media['aria-label'],
-        "aria-hidden": media['aria-hidden'],
-        id: mediaId,
-        size: 48,
-        children: media.avatar.asset
-      });
-    }
-    return sentiment === 'proposition' ? /*#__PURE__*/jsx(AvatarView, {
-      id: mediaId,
-      size: 48,
-      "aria-label": media['aria-label'],
-      "aria-hidden": media['aria-hidden'],
-      children: /*#__PURE__*/jsx(GiftBox, {})
-    }) : /*#__PURE__*/jsx(StatusIcon, {
-      id: mediaId,
-      size: 48,
-      sentiment: sentiment,
-      iconLabel: media['aria-hidden'] ? null : media['aria-label']
-    });
-  };
+  const renderMedia = () => renderPromptMedia({
+    media,
+    sentiment,
+    mediaId,
+    imgClassName: 'wds-action-prompt--media-image'
+  });
   return /*#__PURE__*/jsx(PrimitivePrompt, {
     id: id,
     sentiment: sentiment,

package/build/prompt/ActionPrompt/ActionPrompt.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ActionPrompt.mjs","sources":["../../../src/prompt/ActionPrompt/ActionPrompt.tsx"],"sourcesContent":["import { AriaAttributes, ReactNode, useId } from 'react';\nimport { clsx } from 'clsx';\n\nimport StatusIcon from '../../statusIcon';\nimport Body from '../../body';\nimport Button from '../../button';\nimport { Breakpoint, Typography } from '../../common';\nimport AvatarView, { AvatarViewProps } from '../../avatarView';\nimport Image from '../../image';\nimport { ButtonProps } from '../../button/Button.types';\nimport { PrimitivePrompt, PrimitivePromptProps } from '../PrimitivePrompt';\nimport { BadgeAssetsProps } from '../../badge';\nimport { GiftBox } from '@transferwise/icons';\nimport { useScreenSize } from '../../common/hooks/useScreenSize';\n\nexport type ActionPromptProps = {\n  title: ReactNode;\n  description?: ReactNode;\n  /** @default {} */\n  media?: {\n    imgSrc?: string;\n    avatar?: Pick<AvatarViewProps, 'imgSrc' | 'profileName' | 'profileType'> & {\n      asset?: AvatarViewProps['children'];\n      badge?: Pick<BadgeAssetsProps, 'flagCode'>;\n    };\n    'aria-label'?: string;\n    'aria-hidden'?: boolean;\n  };\n  action: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  actionSecondary?: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  'aria-label'?: AriaAttributes['aria-label'];\n} & Pick<PrimitivePromptProps, 'id' | 'className' | 'data-testid' | 'onDismiss'> & {\n    /**\n     * The sentiment determines the colour scheme\n     * @default 'neutral'\n     */\n    sentiment?: PrimitivePromptProps['sentiment'];\n  };\n\n/**\n * Use an action prompt for optional feedback that doesn't require immediate action, such as feature upsells, warnings, or suggestions. These prompts are typically used outside of core product flows (e.g., Launchpad, Recipient, or Transaction screens) and can be addressed at the user's convenience.\n *\n * If your message is about immediate user feedback (e.g., form submission errors, download failures, missing data warnings), use an [info prompt](https://storybook.wise.design/?path=/docs/prompts-infoprompt--docs) instead.\n *\n * Guidance can be found in the [design system](https://wise.design/components/action-prompt).\n */\nexport const ActionPrompt = ({\n  sentiment = 'neutral',\n  title,\n  description,\n  onDismiss,\n  media = {},\n  action,\n  actionSecondary,\n  id,\n  className,\n  'data-testid': testId,\n  'aria-label': ariaLabel,\n}: ActionPromptProps) => {\n  const isMobile = !useScreenSize(Breakpoint.MEDIUM);\n\n  const mediaId = useId();\n  const titleId = useId();\n  const descId = useId();\n\n  const ariaLabelledByIds = [\n    media['aria-hidden'] ? undefined : mediaId,\n    ariaLabel ? undefined : titleId,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const renderMedia = () => {\n    if (media?.imgSrc) {\n      return (\n        <Image\n          id={mediaId}\n          src={media.imgSrc}\n          className=\"wds-action-prompt--media-image\"\n          alt={media['aria-label'] ?? ''}\n        />\n      );\n    }\n    if (media?.avatar) {\n      const badge = media.avatar.badge\n        ? media.avatar.badge\n        : sentiment === 'proposition'\n          ? {}\n          : { status: sentiment };\n      return (\n        <AvatarView\n          {...media.avatar}\n          badge={badge}\n          aria-label={media['aria-label']}\n          aria-hidden={media['aria-hidden']}\n          id={mediaId}\n          size={48}\n        >\n          {media.avatar.asset}\n        </AvatarView>\n      );\n    }\n    return sentiment === 'proposition' ? (\n      <AvatarView\n        id={mediaId}\n        size={48}\n        aria-label={media['aria-label']}\n        aria-hidden={media['aria-hidden']}\n      >\n        <GiftBox />\n      </AvatarView>\n    ) : (\n      <StatusIcon\n        id={mediaId}\n        size={48}\n        sentiment={sentiment}\n        iconLabel={media['aria-hidden'] ? null : media['aria-label']}\n      />\n    );\n  };\n\n  return (\n    <PrimitivePrompt\n      id={id}\n      sentiment={sentiment}\n      data-testid={testId}\n      className={clsx(\n        'wds-action-prompt',\n        { 'wds-action-prompt--with-two-actions': !!actionSecondary },\n        className,\n      )}\n      media={renderMedia()}\n      actions={\n        <>\n          {actionSecondary && (\n            // @ts-expect-error onClick type mismatch\n            <Button\n              v2\n              size=\"md\"\n              priority=\"secondary\"\n              href={actionSecondary.href}\n              block={isMobile}\n              onClick={actionSecondary?.onClick}\n            >\n              {actionSecondary.label}\n            </Button>\n          )}\n          {/* @ts-expect-error onClick type mismatch */}\n          <Button\n            v2\n            size=\"md\"\n            priority=\"primary\"\n            href={action.href}\n            block={isMobile}\n            onClick={action.onClick}\n          >\n            {action.label}\n          </Button>\n        </>\n      }\n      role=\"region\"\n      onDismiss={onDismiss}\n      {...(ariaLabel\n        ? { 'aria-label': ariaLabel }\n        : {\n            'aria-labelledby': ariaLabelledByIds,\n            'aria-describedby': descId,\n          })}\n    >\n      <div className={clsx('d-flex', 'flex-column', 'justify-content-center')}>\n        <Body id={titleId} type={Typography.BODY_LARGE_BOLD} className=\"wds-action-prompt__content\">\n          {title}\n        </Body>\n        {description && (\n          <Body id={descId} className=\"wds-action-prompt__content\">\n            {description}\n          </Body>\n        )}\n      </div>\n    </PrimitivePrompt>\n  );\n};\n\nexport default ActionPrompt;\n"],"names":["ActionPrompt","sentiment","title","description","onDismiss","media","action","actionSecondary","id","className","testId","ariaLabel","isMobile","useScreenSize","Breakpoint","MEDIUM","mediaId","useId","titleId","descId","ariaLabelledByIds","undefined","filter","Boolean","join","renderMedia","imgSrc","_jsx","Image","src","alt","avatar","badge","status","AvatarView","size","children","asset","GiftBox","StatusIcon","iconLabel","PrimitivePrompt","clsx","actions","_jsxs","_Fragment","Button","v2","priority","href","block","onClick","label","role","Body","type","Typography","BODY_LARGE_BOLD"],"mappings":"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"}
+{"version":3,"file":"ActionPrompt.mjs","sources":["../../../src/prompt/ActionPrompt/ActionPrompt.tsx"],"sourcesContent":["import { AriaAttributes, ReactNode, useId } from 'react';\nimport { clsx } from 'clsx';\n\nimport Body from '../../body';\nimport Button from '../../button';\nimport { Breakpoint, Typography } from '../../common';\nimport { ButtonProps } from '../../button/Button.types';\nimport { PrimitivePrompt, PrimitivePromptProps } from '../PrimitivePrompt';\nimport { useScreenSize } from '../../common/hooks/useScreenSize';\nimport { renderPromptMedia, PromptMedia } from '../helpers/promptMedia';\n\nexport type ActionPromptProps = {\n  title: ReactNode;\n  description?: ReactNode;\n  /** @default {} */\n  media?: PromptMedia;\n  action: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  actionSecondary?: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  'aria-label'?: AriaAttributes['aria-label'];\n} & Pick<PrimitivePromptProps, 'id' | 'className' | 'data-testid' | 'onDismiss'> & {\n    /**\n     * The sentiment determines the colour scheme\n     * @default 'neutral'\n     */\n    sentiment?: PrimitivePromptProps['sentiment'];\n  };\n\n/**\n * Use an action prompt for optional feedback that doesn't require immediate action, such as feature upsells, warnings, or suggestions. These prompts are typically used outside of core product flows (e.g., Launchpad, Recipient, or Transaction screens) and can be addressed at the user's convenience.\n *\n * If your message is about immediate user feedback (e.g., form submission errors, download failures, missing data warnings), use an [info prompt](https://storybook.wise.design/?path=/docs/prompts-infoprompt--docs) instead.\n *\n * Guidance can be found in the [design system](https://wise.design/components/action-prompt).\n */\nexport const ActionPrompt = ({\n  sentiment = 'neutral',\n  title,\n  description,\n  onDismiss,\n  media = {},\n  action,\n  actionSecondary,\n  id,\n  className,\n  'data-testid': testId,\n  'aria-label': ariaLabel,\n}: ActionPromptProps) => {\n  const isMobile = !useScreenSize(Breakpoint.MEDIUM);\n\n  const mediaId = useId();\n  const titleId = useId();\n  const descId = useId();\n\n  const ariaLabelledByIds = [\n    media['aria-hidden'] ? undefined : mediaId,\n    ariaLabel ? undefined : titleId,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  const renderMedia = () =>\n    renderPromptMedia({\n      media,\n      sentiment,\n      mediaId,\n      imgClassName: 'wds-action-prompt--media-image',\n    });\n\n  return (\n    <PrimitivePrompt\n      id={id}\n      sentiment={sentiment}\n      data-testid={testId}\n      className={clsx(\n        'wds-action-prompt',\n        { 'wds-action-prompt--with-two-actions': !!actionSecondary },\n        className,\n      )}\n      media={renderMedia()}\n      actions={\n        <>\n          {actionSecondary && (\n            // @ts-expect-error onClick type mismatch\n            <Button\n              v2\n              size=\"md\"\n              priority=\"secondary\"\n              href={actionSecondary.href}\n              block={isMobile}\n              onClick={actionSecondary?.onClick}\n            >\n              {actionSecondary.label}\n            </Button>\n          )}\n          {/* @ts-expect-error onClick type mismatch */}\n          <Button\n            v2\n            size=\"md\"\n            priority=\"primary\"\n            href={action.href}\n            block={isMobile}\n            onClick={action.onClick}\n          >\n            {action.label}\n          </Button>\n        </>\n      }\n      role=\"region\"\n      onDismiss={onDismiss}\n      {...(ariaLabel\n        ? { 'aria-label': ariaLabel }\n        : {\n            'aria-labelledby': ariaLabelledByIds,\n            'aria-describedby': descId,\n          })}\n    >\n      <div className={clsx('d-flex', 'flex-column', 'justify-content-center')}>\n        <Body id={titleId} type={Typography.BODY_LARGE_BOLD} className=\"wds-action-prompt__content\">\n          {title}\n        </Body>\n        {description && (\n          <Body id={descId} className=\"wds-action-prompt__content\">\n            {description}\n          </Body>\n        )}\n      </div>\n    </PrimitivePrompt>\n  );\n};\n\nexport default ActionPrompt;\n"],"names":["ActionPrompt","sentiment","title","description","onDismiss","media","action","actionSecondary","id","className","testId","ariaLabel","isMobile","useScreenSize","Breakpoint","MEDIUM","mediaId","useId","titleId","descId","ariaLabelledByIds","undefined","filter","Boolean","join","renderMedia","renderPromptMedia","imgClassName","_jsx","PrimitivePrompt","clsx","actions","_jsxs","_Fragment","children","Button","v2","size","priority","href","block","onClick","label","role","Body","type","Typography","BODY_LARGE_BOLD"],"mappings":"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"}

package/build/prompt/CriticalBanner/CriticalBanner.js

@@ -0,0 +1,148 @@
+'use strict';
+
+var React = require('react');
+var clsx = require('clsx');
+var Body = require('../../body/Body.js');
+var Button_resolver = require('../../button/Button.resolver.js');
+require('../../common/theme.js');
+require('../../common/direction.js');
+require('../../common/propsValues/control.js');
+var breakpoint = require('../../common/propsValues/breakpoint.js');
+require('../../common/propsValues/size.js');
+var typography = require('../../common/propsValues/typography.js');
+require('../../common/propsValues/width.js');
+require('../../common/propsValues/type.js');
+require('../../common/propsValues/dateMode.js');
+require('../../common/propsValues/monthFormat.js');
+require('../../common/propsValues/position.js');
+require('../../common/propsValues/layouts.js');
+require('../../common/propsValues/status.js');
+require('../../common/propsValues/sentiment.js');
+require('../../common/propsValues/profileType.js');
+require('../../common/propsValues/variant.js');
+require('../../common/propsValues/scroll.js');
+require('../../common/propsValues/markdownNodeType.js');
+require('../../common/fileType.js');
+require('@transferwise/icons');
+require('react-intl');
+require('../../common/closeButton/CloseButton.messages.js');
+var jsxRuntime = require('react/jsx-runtime');
+var LiveRegion = require('../../common/liveRegion/LiveRegion.js');
+var PrimitivePrompt = require('../PrimitivePrompt/PrimitivePrompt.js');
+var useScreenSize = require('../../common/hooks/useScreenSize.js');
+var promptMedia = require('../helpers/promptMedia.js');
+var Expander = require('../common/Expander/Expander.js');
+var helpers = require('./helpers.js');
+
+const CriticalBanner = ({
+  sentiment = 'negative',
+  title,
+  description,
+  media = {},
+  action,
+  actionSecondary,
+  expanded = true,
+  onToggle,
+  id,
+  className,
+  'data-testid': testId,
+  'aria-label': ariaLabel
+}) => {
+  const isMobile = !useScreenSize.useScreenSize(breakpoint.Breakpoint.EXTRA_SMALL);
+  const resolvedExpanded = !isMobile || expanded;
+  const hasActions = action ?? actionSecondary;
+  const mediaId = React.useId();
+  const titleId = React.useId();
+  const descId = React.useId();
+  const ariaLabelledByIds = [media['aria-hidden'] ? undefined : mediaId, ariaLabel || !title ? undefined : titleId].filter(Boolean).join(' ');
+  return /*#__PURE__*/jsxRuntime.jsx(LiveRegion.LiveRegion, {
+    "aria-live": "assertive",
+    announceOnChange: helpers.buildAnnouncementString({
+      title,
+      description,
+      expanded: resolvedExpanded,
+      actionLabel: action?.label,
+      actionSecondaryLabel: actionSecondary?.label
+    }),
+    children: /*#__PURE__*/jsxRuntime.jsxs(PrimitivePrompt.PrimitivePrompt, {
+      id: id,
+      sentiment: sentiment,
+      emphasis: sentiment === 'neutral' ? 'base' : 'elevated',
+      "data-testid": testId,
+      className: clsx.clsx('wds-critical-banner', {
+        'wds-critical-banner__mobile--collapsed': !resolvedExpanded,
+        'wds-critical-banner--with-two-actions': !!actionSecondary
+      }, className),
+      media: promptMedia.renderPromptMedia({
+        media,
+        sentiment,
+        mediaId,
+        imgClassName: 'wds-critical-banner--media-image'
+      }),
+      actions: Expander.shouldShowWhenExpanded({
+        expanded: resolvedExpanded,
+        hasContent: !!hasActions
+      }) ? /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+        children: [actionSecondary &&
+        /*#__PURE__*/
+        // @ts-expect-error onClick type mismatch
+        jsxRuntime.jsx(Button_resolver.default, {
+          v2: true,
+          size: "md",
+          priority: "secondary",
+          href: actionSecondary.href,
+          block: isMobile,
+          onClick: actionSecondary?.onClick,
+          children: actionSecondary.label
+        }), action &&
+        /*#__PURE__*/
+        // @ts-expect-error onClick type mismatch
+        jsxRuntime.jsx(Button_resolver.default, {
+          v2: true,
+          size: "md",
+          priority: "primary",
+          href: action.href,
+          block: isMobile,
+          onClick: action.onClick,
+          children: action.label
+        })]
+      }) : undefined,
+      role: "region",
+      ...(ariaLabel ? {
+        'aria-label': ariaLabel
+      } : {
+        'aria-labelledby': ariaLabelledByIds,
+        'aria-describedby': descId
+      }),
+      children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: clsx.clsx('d-flex', 'flex-column', 'justify-content-center', 'wds-critical-banner__text-wrapper'),
+        children: [title && /*#__PURE__*/jsxRuntime.jsx(Body.default, {
+          id: titleId,
+          type: typography.Typography.BODY_LARGE_BOLD,
+          className: clsx.clsx('wds-critical-banner__content', {
+            'wds-critical-banner__title--collapsed': !resolvedExpanded
+          }),
+          children: title
+        }), Expander.shouldShowWhenExpanded({
+          expanded: resolvedExpanded,
+          hasContent: !!description,
+          alwaysShow: !title
+        }) && /*#__PURE__*/jsxRuntime.jsx(Body.default, {
+          id: descId,
+          className: clsx.clsx('wds-critical-banner__content', {
+            'wds-critical-banner__description--collapsed': !resolvedExpanded && !title
+          }),
+          children: description
+        })]
+      }), isMobile && /*#__PURE__*/jsxRuntime.jsx(Expander.ExpanderToggle, {
+        expanded: expanded,
+        size: 24,
+        className: "wds-critical-banner__toggle",
+        onToggle: onToggle
+      })]
+    })
+  });
+};
+
+exports.CriticalBanner = CriticalBanner;
+//# sourceMappingURL=CriticalBanner.js.map

package/build/prompt/CriticalBanner/CriticalBanner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CriticalBanner.js","sources":["../../../src/prompt/CriticalBanner/CriticalBanner.tsx"],"sourcesContent":["import { AriaAttributes, ReactNode, useId } from 'react';\nimport { clsx } from 'clsx';\n\nimport Body from '../../body';\nimport Button from '../../button';\nimport { Breakpoint, LiveRegion, Typography } from '../../common';\nimport { ButtonProps } from '../../button/Button.types';\nimport { PrimitivePrompt, PrimitivePromptProps } from '../PrimitivePrompt';\nimport { useScreenSize } from '../../common/hooks/useScreenSize';\n\nimport { renderPromptMedia, PromptMedia } from '../helpers/promptMedia';\nimport { shouldShowWhenExpanded, ExpanderToggle } from '../common/Expander/Expander';\nimport { buildAnnouncementString } from './helpers';\n\nexport type CriticalBannerProps = {\n  title?: ReactNode;\n  description?: ReactNode;\n  media?: PromptMedia;\n  action?: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  actionSecondary?: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  sentiment?: Exclude<PrimitivePromptProps['sentiment'], 'proposition'>;\n  /**\n   * Controls whether the description and actions are visible.\n   * When collapsed with a title, only the title is shown.\n   * When collapsed without a title, the description is trimmed to 2 lines.\n   */\n  expanded?: boolean;\n  /** Called when the user clicks the chevron toggle. */\n  onToggle?: () => void;\n  /**\n   * Overrides the default labelling derived from `title` and `description`.\n   *\n   * **NB:** When provided, the default `aria-labelledby` / `aria-describedby`\n   * attributes are removed — include all necessary context in the label.\n   */\n  'aria-label'?: AriaAttributes['aria-label'];\n} & Pick<PrimitivePromptProps, 'id' | 'className' | 'data-testid'>;\n\n/**\n * A full-width, non-dismissible banner for critical messages such as account blocks or\n * time-sensitive actions that require immediate user attention.\n\n * @see {@link https://wise.design/components/critical-banner Design Spec}\n */\nexport const CriticalBanner = ({\n  sentiment = 'negative',\n  title,\n  description,\n  media = {},\n  action,\n  actionSecondary,\n  expanded = true,\n  onToggle,\n  id,\n  className,\n  'data-testid': testId,\n  'aria-label': ariaLabel,\n}: CriticalBannerProps) => {\n  const isMobile = !useScreenSize(Breakpoint.EXTRA_SMALL);\n  const resolvedExpanded = !isMobile || expanded;\n  const hasActions = action ?? actionSecondary;\n  const mediaId = useId();\n  const titleId = useId();\n  const descId = useId();\n\n  const ariaLabelledByIds = [\n    media['aria-hidden'] ? undefined : mediaId,\n    ariaLabel || !title ? undefined : titleId,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <LiveRegion\n      aria-live=\"assertive\"\n      announceOnChange={buildAnnouncementString({\n        title,\n        description,\n        expanded: resolvedExpanded,\n        actionLabel: action?.label,\n        actionSecondaryLabel: actionSecondary?.label,\n      })}\n    >\n      <PrimitivePrompt\n        id={id}\n        sentiment={sentiment}\n        emphasis={sentiment === 'neutral' ? 'base' : 'elevated'}\n        data-testid={testId}\n        className={clsx(\n          'wds-critical-banner',\n          {\n            'wds-critical-banner__mobile--collapsed': !resolvedExpanded,\n            'wds-critical-banner--with-two-actions': !!actionSecondary,\n          },\n          className,\n        )}\n        media={renderPromptMedia({\n          media,\n          sentiment,\n          mediaId,\n          imgClassName: 'wds-critical-banner--media-image',\n        })}\n        actions={\n          shouldShowWhenExpanded({ expanded: resolvedExpanded, hasContent: !!hasActions }) ? (\n            <>\n              {actionSecondary && (\n                // @ts-expect-error onClick type mismatch\n                <Button\n                  v2\n                  size=\"md\"\n                  priority=\"secondary\"\n                  href={actionSecondary.href}\n                  block={isMobile}\n                  onClick={actionSecondary?.onClick}\n                >\n                  {actionSecondary.label}\n                </Button>\n              )}\n              {action && (\n                // @ts-expect-error onClick type mismatch\n                <Button\n                  v2\n                  size=\"md\"\n                  priority=\"primary\"\n                  href={action.href}\n                  block={isMobile}\n                  onClick={action.onClick}\n                >\n                  {action.label}\n                </Button>\n              )}\n            </>\n          ) : undefined\n        }\n        role=\"region\"\n        {...(ariaLabel\n          ? { 'aria-label': ariaLabel }\n          : {\n              'aria-labelledby': ariaLabelledByIds,\n              'aria-describedby': descId,\n            })}\n      >\n        <div\n          className={clsx(\n            'd-flex',\n            'flex-column',\n            'justify-content-center',\n            'wds-critical-banner__text-wrapper',\n          )}\n        >\n          {title && (\n            <Body\n              id={titleId}\n              type={Typography.BODY_LARGE_BOLD}\n              className={clsx('wds-critical-banner__content', {\n                'wds-critical-banner__title--collapsed': !resolvedExpanded,\n              })}\n            >\n              {title}\n            </Body>\n          )}\n          {shouldShowWhenExpanded({\n            expanded: resolvedExpanded,\n            hasContent: !!description,\n            alwaysShow: !title,\n          }) && (\n            <Body\n              id={descId}\n              className={clsx('wds-critical-banner__content', {\n                'wds-critical-banner__description--collapsed': !resolvedExpanded && !title,\n              })}\n            >\n              {description}\n            </Body>\n          )}\n        </div>\n        {isMobile && (\n          <ExpanderToggle\n            expanded={expanded}\n            size={24}\n            className=\"wds-critical-banner__toggle\"\n            onToggle={onToggle}\n          />\n        )}\n      </PrimitivePrompt>\n    </LiveRegion>\n  );\n};\n\nexport default CriticalBanner;\n"],"names":["CriticalBanner","sentiment","title","description","media","action","actionSecondary","expanded","onToggle","id","className","testId","ariaLabel","isMobile","useScreenSize","Breakpoint","EXTRA_SMALL","resolvedExpanded","hasActions","mediaId","useId","titleId","descId","ariaLabelledByIds","undefined","filter","Boolean","join","_jsx","LiveRegion","announceOnChange","buildAnnouncementString","actionLabel","label","actionSecondaryLabel","children","_jsxs","PrimitivePrompt","emphasis","clsx","renderPromptMedia","imgClassName","actions","shouldShowWhenExpanded","hasContent","_Fragment","Button","v2","size","priority","href","block","onClick","role","Body","type","Typography","BODY_LARGE_BOLD","alwaysShow","ExpanderToggle"],"mappings":"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"}

package/build/prompt/CriticalBanner/CriticalBanner.mjs

@@ -0,0 +1,146 @@
+import { useId } from 'react';
+import { clsx } from 'clsx';
+import Body from '../../body/Body.mjs';
+import Button from '../../button/Button.resolver.mjs';
+import '../../common/theme.mjs';
+import '../../common/direction.mjs';
+import '../../common/propsValues/control.mjs';
+import { Breakpoint } from '../../common/propsValues/breakpoint.mjs';
+import '../../common/propsValues/size.mjs';
+import { Typography } from '../../common/propsValues/typography.mjs';
+import '../../common/propsValues/width.mjs';
+import '../../common/propsValues/type.mjs';
+import '../../common/propsValues/dateMode.mjs';
+import '../../common/propsValues/monthFormat.mjs';
+import '../../common/propsValues/position.mjs';
+import '../../common/propsValues/layouts.mjs';
+import '../../common/propsValues/status.mjs';
+import '../../common/propsValues/sentiment.mjs';
+import '../../common/propsValues/profileType.mjs';
+import '../../common/propsValues/variant.mjs';
+import '../../common/propsValues/scroll.mjs';
+import '../../common/propsValues/markdownNodeType.mjs';
+import '../../common/fileType.mjs';
+import '@transferwise/icons';
+import 'react-intl';
+import '../../common/closeButton/CloseButton.messages.mjs';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { LiveRegion } from '../../common/liveRegion/LiveRegion.mjs';
+import { PrimitivePrompt } from '../PrimitivePrompt/PrimitivePrompt.mjs';
+import { useScreenSize } from '../../common/hooks/useScreenSize.mjs';
+import { renderPromptMedia } from '../helpers/promptMedia.mjs';
+import { shouldShowWhenExpanded, ExpanderToggle } from '../common/Expander/Expander.mjs';
+import { buildAnnouncementString } from './helpers.mjs';
+
+const CriticalBanner = ({
+  sentiment = 'negative',
+  title,
+  description,
+  media = {},
+  action,
+  actionSecondary,
+  expanded = true,
+  onToggle,
+  id,
+  className,
+  'data-testid': testId,
+  'aria-label': ariaLabel
+}) => {
+  const isMobile = !useScreenSize(Breakpoint.EXTRA_SMALL);
+  const resolvedExpanded = !isMobile || expanded;
+  const hasActions = action ?? actionSecondary;
+  const mediaId = useId();
+  const titleId = useId();
+  const descId = useId();
+  const ariaLabelledByIds = [media['aria-hidden'] ? undefined : mediaId, ariaLabel || !title ? undefined : titleId].filter(Boolean).join(' ');
+  return /*#__PURE__*/jsx(LiveRegion, {
+    "aria-live": "assertive",
+    announceOnChange: buildAnnouncementString({
+      title,
+      description,
+      expanded: resolvedExpanded,
+      actionLabel: action?.label,
+      actionSecondaryLabel: actionSecondary?.label
+    }),
+    children: /*#__PURE__*/jsxs(PrimitivePrompt, {
+      id: id,
+      sentiment: sentiment,
+      emphasis: sentiment === 'neutral' ? 'base' : 'elevated',
+      "data-testid": testId,
+      className: clsx('wds-critical-banner', {
+        'wds-critical-banner__mobile--collapsed': !resolvedExpanded,
+        'wds-critical-banner--with-two-actions': !!actionSecondary
+      }, className),
+      media: renderPromptMedia({
+        media,
+        sentiment,
+        mediaId,
+        imgClassName: 'wds-critical-banner--media-image'
+      }),
+      actions: shouldShowWhenExpanded({
+        expanded: resolvedExpanded,
+        hasContent: !!hasActions
+      }) ? /*#__PURE__*/jsxs(Fragment, {
+        children: [actionSecondary &&
+        /*#__PURE__*/
+        // @ts-expect-error onClick type mismatch
+        jsx(Button, {
+          v2: true,
+          size: "md",
+          priority: "secondary",
+          href: actionSecondary.href,
+          block: isMobile,
+          onClick: actionSecondary?.onClick,
+          children: actionSecondary.label
+        }), action &&
+        /*#__PURE__*/
+        // @ts-expect-error onClick type mismatch
+        jsx(Button, {
+          v2: true,
+          size: "md",
+          priority: "primary",
+          href: action.href,
+          block: isMobile,
+          onClick: action.onClick,
+          children: action.label
+        })]
+      }) : undefined,
+      role: "region",
+      ...(ariaLabel ? {
+        'aria-label': ariaLabel
+      } : {
+        'aria-labelledby': ariaLabelledByIds,
+        'aria-describedby': descId
+      }),
+      children: [/*#__PURE__*/jsxs("div", {
+        className: clsx('d-flex', 'flex-column', 'justify-content-center', 'wds-critical-banner__text-wrapper'),
+        children: [title && /*#__PURE__*/jsx(Body, {
+          id: titleId,
+          type: Typography.BODY_LARGE_BOLD,
+          className: clsx('wds-critical-banner__content', {
+            'wds-critical-banner__title--collapsed': !resolvedExpanded
+          }),
+          children: title
+        }), shouldShowWhenExpanded({
+          expanded: resolvedExpanded,
+          hasContent: !!description,
+          alwaysShow: !title
+        }) && /*#__PURE__*/jsx(Body, {
+          id: descId,
+          className: clsx('wds-critical-banner__content', {
+            'wds-critical-banner__description--collapsed': !resolvedExpanded && !title
+          }),
+          children: description
+        })]
+      }), isMobile && /*#__PURE__*/jsx(ExpanderToggle, {
+        expanded: expanded,
+        size: 24,
+        className: "wds-critical-banner__toggle",
+        onToggle: onToggle
+      })]
+    })
+  });
+};
+
+export { CriticalBanner };
+//# sourceMappingURL=CriticalBanner.mjs.map

package/build/prompt/CriticalBanner/CriticalBanner.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"CriticalBanner.mjs","sources":["../../../src/prompt/CriticalBanner/CriticalBanner.tsx"],"sourcesContent":["import { AriaAttributes, ReactNode, useId } from 'react';\nimport { clsx } from 'clsx';\n\nimport Body from '../../body';\nimport Button from '../../button';\nimport { Breakpoint, LiveRegion, Typography } from '../../common';\nimport { ButtonProps } from '../../button/Button.types';\nimport { PrimitivePrompt, PrimitivePromptProps } from '../PrimitivePrompt';\nimport { useScreenSize } from '../../common/hooks/useScreenSize';\n\nimport { renderPromptMedia, PromptMedia } from '../helpers/promptMedia';\nimport { shouldShowWhenExpanded, ExpanderToggle } from '../common/Expander/Expander';\nimport { buildAnnouncementString } from './helpers';\n\nexport type CriticalBannerProps = {\n  title?: ReactNode;\n  description?: ReactNode;\n  media?: PromptMedia;\n  action?: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  actionSecondary?: Pick<ButtonProps, 'onClick' | 'href' | 'target'> & {\n    label: ButtonProps['children'];\n  };\n  sentiment?: Exclude<PrimitivePromptProps['sentiment'], 'proposition'>;\n  /**\n   * Controls whether the description and actions are visible.\n   * When collapsed with a title, only the title is shown.\n   * When collapsed without a title, the description is trimmed to 2 lines.\n   */\n  expanded?: boolean;\n  /** Called when the user clicks the chevron toggle. */\n  onToggle?: () => void;\n  /**\n   * Overrides the default labelling derived from `title` and `description`.\n   *\n   * **NB:** When provided, the default `aria-labelledby` / `aria-describedby`\n   * attributes are removed — include all necessary context in the label.\n   */\n  'aria-label'?: AriaAttributes['aria-label'];\n} & Pick<PrimitivePromptProps, 'id' | 'className' | 'data-testid'>;\n\n/**\n * A full-width, non-dismissible banner for critical messages such as account blocks or\n * time-sensitive actions that require immediate user attention.\n\n * @see {@link https://wise.design/components/critical-banner Design Spec}\n */\nexport const CriticalBanner = ({\n  sentiment = 'negative',\n  title,\n  description,\n  media = {},\n  action,\n  actionSecondary,\n  expanded = true,\n  onToggle,\n  id,\n  className,\n  'data-testid': testId,\n  'aria-label': ariaLabel,\n}: CriticalBannerProps) => {\n  const isMobile = !useScreenSize(Breakpoint.EXTRA_SMALL);\n  const resolvedExpanded = !isMobile || expanded;\n  const hasActions = action ?? actionSecondary;\n  const mediaId = useId();\n  const titleId = useId();\n  const descId = useId();\n\n  const ariaLabelledByIds = [\n    media['aria-hidden'] ? undefined : mediaId,\n    ariaLabel || !title ? undefined : titleId,\n  ]\n    .filter(Boolean)\n    .join(' ');\n\n  return (\n    <LiveRegion\n      aria-live=\"assertive\"\n      announceOnChange={buildAnnouncementString({\n        title,\n        description,\n        expanded: resolvedExpanded,\n        actionLabel: action?.label,\n        actionSecondaryLabel: actionSecondary?.label,\n      })}\n    >\n      <PrimitivePrompt\n        id={id}\n        sentiment={sentiment}\n        emphasis={sentiment === 'neutral' ? 'base' : 'elevated'}\n        data-testid={testId}\n        className={clsx(\n          'wds-critical-banner',\n          {\n            'wds-critical-banner__mobile--collapsed': !resolvedExpanded,\n            'wds-critical-banner--with-two-actions': !!actionSecondary,\n          },\n          className,\n        )}\n        media={renderPromptMedia({\n          media,\n          sentiment,\n          mediaId,\n          imgClassName: 'wds-critical-banner--media-image',\n        })}\n        actions={\n          shouldShowWhenExpanded({ expanded: resolvedExpanded, hasContent: !!hasActions }) ? (\n            <>\n              {actionSecondary && (\n                // @ts-expect-error onClick type mismatch\n                <Button\n                  v2\n                  size=\"md\"\n                  priority=\"secondary\"\n                  href={actionSecondary.href}\n                  block={isMobile}\n                  onClick={actionSecondary?.onClick}\n                >\n                  {actionSecondary.label}\n                </Button>\n              )}\n              {action && (\n                // @ts-expect-error onClick type mismatch\n                <Button\n                  v2\n                  size=\"md\"\n                  priority=\"primary\"\n                  href={action.href}\n                  block={isMobile}\n                  onClick={action.onClick}\n                >\n                  {action.label}\n                </Button>\n              )}\n            </>\n          ) : undefined\n        }\n        role=\"region\"\n        {...(ariaLabel\n          ? { 'aria-label': ariaLabel }\n          : {\n              'aria-labelledby': ariaLabelledByIds,\n              'aria-describedby': descId,\n            })}\n      >\n        <div\n          className={clsx(\n            'd-flex',\n            'flex-column',\n            'justify-content-center',\n            'wds-critical-banner__text-wrapper',\n          )}\n        >\n          {title && (\n            <Body\n              id={titleId}\n              type={Typography.BODY_LARGE_BOLD}\n              className={clsx('wds-critical-banner__content', {\n                'wds-critical-banner__title--collapsed': !resolvedExpanded,\n              })}\n            >\n              {title}\n            </Body>\n          )}\n          {shouldShowWhenExpanded({\n            expanded: resolvedExpanded,\n            hasContent: !!description,\n            alwaysShow: !title,\n          }) && (\n            <Body\n              id={descId}\n              className={clsx('wds-critical-banner__content', {\n                'wds-critical-banner__description--collapsed': !resolvedExpanded && !title,\n              })}\n            >\n              {description}\n            </Body>\n          )}\n        </div>\n        {isMobile && (\n          <ExpanderToggle\n            expanded={expanded}\n            size={24}\n            className=\"wds-critical-banner__toggle\"\n            onToggle={onToggle}\n          />\n        )}\n      </PrimitivePrompt>\n    </LiveRegion>\n  );\n};\n\nexport default CriticalBanner;\n"],"names":["CriticalBanner","sentiment","title","description","media","action","actionSecondary","expanded","onToggle","id","className","testId","ariaLabel","isMobile","useScreenSize","Breakpoint","EXTRA_SMALL","resolvedExpanded","hasActions","mediaId","useId","titleId","descId","ariaLabelledByIds","undefined","filter","Boolean","join","_jsx","LiveRegion","announceOnChange","buildAnnouncementString","actionLabel","label","actionSecondaryLabel","children","_jsxs","PrimitivePrompt","emphasis","clsx","renderPromptMedia","imgClassName","actions","shouldShowWhenExpanded","hasContent","_Fragment","Button","v2","size","priority","href","block","onClick","role","Body","type","Typography","BODY_LARGE_BOLD","alwaysShow","ExpanderToggle"],"mappings":"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"}

package/build/prompt/CriticalBanner/helpers.js

@@ -0,0 +1,29 @@
+'use strict';
+
+/**
+ * Helper to extract string from ReactNode for announcements.
+ * Complex ReactNodes (JSX elements) return empty string.
+ */
+const getStringValue = node => {
+  if (typeof node === 'string' || typeof node === 'number') {
+    return String(node);
+  }
+  return '';
+};
+/**
+ * Builds the announcement string from visible content only.
+ * Content visibility depends on expanded state and presence of title.
+ */
+const buildAnnouncementString = ({
+  title,
+  description,
+  expanded,
+  actionLabel,
+  actionSecondaryLabel
+}) => {
+  return [title ? getStringValue(title) : undefined, description && (expanded || !title) ? getStringValue(description) : undefined, expanded && actionLabel ? getStringValue(actionLabel) : undefined, expanded && actionSecondaryLabel ? getStringValue(actionSecondaryLabel) : undefined].filter(Boolean).join('|');
+};
+
+exports.buildAnnouncementString = buildAnnouncementString;
+exports.getStringValue = getStringValue;
+//# sourceMappingURL=helpers.js.map

package/build/prompt/CriticalBanner/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","sources":["../../../src/prompt/CriticalBanner/helpers.ts"],"sourcesContent":["import { ReactNode } from 'react';\n\n/**\n * Helper to extract string from ReactNode for announcements.\n * Complex ReactNodes (JSX elements) return empty string.\n */\nexport const getStringValue = (node: ReactNode): string => {\n  if (typeof node === 'string' || typeof node === 'number') {\n    return String(node);\n  }\n  return '';\n};\n\n/**\n * Builds the announcement string from visible content only.\n * Content visibility depends on expanded state and presence of title.\n */\nexport const buildAnnouncementString = ({\n  title,\n  description,\n  expanded,\n  actionLabel,\n  actionSecondaryLabel,\n}: {\n  title?: ReactNode;\n  description?: ReactNode;\n  expanded: boolean;\n  actionLabel?: ReactNode;\n  actionSecondaryLabel?: ReactNode;\n}): string => {\n  return [\n    title ? getStringValue(title) : undefined,\n    description && (expanded || !title) ? getStringValue(description) : undefined,\n    expanded && actionLabel ? getStringValue(actionLabel) : undefined,\n    expanded && actionSecondaryLabel ? getStringValue(actionSecondaryLabel) : undefined,\n  ]\n    .filter(Boolean)\n    .join('|');\n};\n"],"names":["getStringValue","node","String","buildAnnouncementString","title","description","expanded","actionLabel","actionSecondaryLabel","undefined","filter","Boolean","join"],"mappings":";;AAEA;;;AAGG;AACI,MAAMA,cAAc,GAAIC,IAAe,IAAY;EACxD,IAAI,OAAOA,IAAI,KAAK,QAAQ,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAE;IACxD,OAAOC,MAAM,CAACD,IAAI,CAAC;AACrB,EAAA;AACA,EAAA,OAAO,EAAE;AACX;AAEA;;;AAGG;AACI,MAAME,uBAAuB,GAAGA,CAAC;EACtCC,KAAK;EACLC,WAAW;EACXC,QAAQ;EACRC,WAAW;AACXC,EAAAA;AAAoB,CAOrB,KAAY;EACX,OAAO,CACLJ,KAAK,GAAGJ,cAAc,CAACI,KAAK,CAAC,GAAGK,SAAS,EACzCJ,WAAW,KAAKC,QAAQ,IAAI,CAACF,KAAK,CAAC,GAAGJ,cAAc,CAACK,WAAW,CAAC,GAAGI,SAAS,EAC7EH,QAAQ,IAAIC,WAAW,GAAGP,cAAc,CAACO,WAAW,CAAC,GAAGE,SAAS,EACjEH,QAAQ,IAAIE,oBAAoB,GAAGR,cAAc,CAACQ,oBAAoB,CAAC,GAAGC,SAAS,CACpF,CACEC,MAAM,CAACC,OAAO,CAAC,CACfC,IAAI,CAAC,GAAG,CAAC;AACd;;;;;"}

package/build/prompt/CriticalBanner/helpers.mjs

@@ -0,0 +1,26 @@
+/**
+ * Helper to extract string from ReactNode for announcements.
+ * Complex ReactNodes (JSX elements) return empty string.
+ */
+const getStringValue = node => {
+  if (typeof node === 'string' || typeof node === 'number') {
+    return String(node);
+  }
+  return '';
+};
+/**
+ * Builds the announcement string from visible content only.
+ * Content visibility depends on expanded state and presence of title.
+ */
+const buildAnnouncementString = ({
+  title,
+  description,
+  expanded,
+  actionLabel,
+  actionSecondaryLabel
+}) => {
+  return [title ? getStringValue(title) : undefined, description && (expanded || !title) ? getStringValue(description) : undefined, expanded && actionLabel ? getStringValue(actionLabel) : undefined, expanded && actionSecondaryLabel ? getStringValue(actionSecondaryLabel) : undefined].filter(Boolean).join('|');
+};
+
+export { buildAnnouncementString, getStringValue };
+//# sourceMappingURL=helpers.mjs.map

package/build/prompt/CriticalBanner/helpers.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.mjs","sources":["../../../src/prompt/CriticalBanner/helpers.ts"],"sourcesContent":["import { ReactNode } from 'react';\n\n/**\n * Helper to extract string from ReactNode for announcements.\n * Complex ReactNodes (JSX elements) return empty string.\n */\nexport const getStringValue = (node: ReactNode): string => {\n  if (typeof node === 'string' || typeof node === 'number') {\n    return String(node);\n  }\n  return '';\n};\n\n/**\n * Builds the announcement string from visible content only.\n * Content visibility depends on expanded state and presence of title.\n */\nexport const buildAnnouncementString = ({\n  title,\n  description,\n  expanded,\n  actionLabel,\n  actionSecondaryLabel,\n}: {\n  title?: ReactNode;\n  description?: ReactNode;\n  expanded: boolean;\n  actionLabel?: ReactNode;\n  actionSecondaryLabel?: ReactNode;\n}): string => {\n  return [\n    title ? getStringValue(title) : undefined,\n    description && (expanded || !title) ? getStringValue(description) : undefined,\n    expanded && actionLabel ? getStringValue(actionLabel) : undefined,\n    expanded && actionSecondaryLabel ? getStringValue(actionSecondaryLabel) : undefined,\n  ]\n    .filter(Boolean)\n    .join('|');\n};\n"],"names":["getStringValue","node","String","buildAnnouncementString","title","description","expanded","actionLabel","actionSecondaryLabel","undefined","filter","Boolean","join"],"mappings":"AAEA;;;AAGG;AACI,MAAMA,cAAc,GAAIC,IAAe,IAAY;EACxD,IAAI,OAAOA,IAAI,KAAK,QAAQ,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAE;IACxD,OAAOC,MAAM,CAACD,IAAI,CAAC;AACrB,EAAA;AACA,EAAA,OAAO,EAAE;AACX;AAEA;;;AAGG;AACI,MAAME,uBAAuB,GAAGA,CAAC;EACtCC,KAAK;EACLC,WAAW;EACXC,QAAQ;EACRC,WAAW;AACXC,EAAAA;AAAoB,CAOrB,KAAY;EACX,OAAO,CACLJ,KAAK,GAAGJ,cAAc,CAACI,KAAK,CAAC,GAAGK,SAAS,EACzCJ,WAAW,KAAKC,QAAQ,IAAI,CAACF,KAAK,CAAC,GAAGJ,cAAc,CAACK,WAAW,CAAC,GAAGI,SAAS,EAC7EH,QAAQ,IAAIC,WAAW,GAAGP,cAAc,CAACO,WAAW,CAAC,GAAGE,SAAS,EACjEH,QAAQ,IAAIE,oBAAoB,GAAGR,cAAc,CAACQ,oBAAoB,CAAC,GAAGC,SAAS,CACpF,CACEC,MAAM,CAACC,OAAO,CAAC,CACfC,IAAI,CAAC,GAAG,CAAC;AACd;;;;"}

package/build/prompt/InfoPrompt/InfoPrompt.js

@@ -20,7 +20,6 @@ require('../../common/propsValues/variant.js');
 require('../../common/propsValues/scroll.js');
 require('../../common/propsValues/markdownNodeType.js');
 require('../../common/fileType.js');
-require('@transferwise/formatting');
 var icons = require('@transferwise/icons');
 var clsx = require('clsx');
 require('react-intl');

package/build/prompt/InfoPrompt/InfoPrompt.js.map

@@ -1 +1 @@
-{"version":3,"file":"InfoPrompt.js","sources":["../../../src/prompt/InfoPrompt/InfoPrompt.tsx"],"sourcesContent":["import { HTMLAttributes, ReactNode, useState } from 'react';\nimport { LiveRegion, Sentiment, Typography } from '../../common';\nimport type { AriaLive } from '../../common';\nimport { GiftBox } from '@transferwise/icons';\nimport type { Sentiment as SurfaceSentiment } from '../../sentimentSurface';\nimport StatusIcon from '../../statusIcon';\nimport { clsx } from 'clsx';\nimport Body from '../../body';\nimport Link, { LinkProps } from '../../link';\nimport { PrimitivePrompt, PrimitivePromptProps } from '../PrimitivePrompt';\n\nexport type InfoPromptAction = Pick<LinkProps, 'href' | 'target' | 'onClick'> & {\n  /**\n   * The label text for the action link\n   */\n  label: string;\n};\n\nexport type InfoPromptMedia = {\n  /**\n   * The icon/image asset to display.\n   * The asset should include its own accessibility attributes (e.g. title, aria-label) if it conveys meaning.\n   */\n  asset: ReactNode;\n};\n\nexport type InfoPromptProps = Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'aria-live' | 'role'> &\n  Pick<PrimitivePromptProps, 'data-testid'> & {\n    /**\n     * The sentiment determines the colour scheme\n     * @default 'neutral'\n     */\n    sentiment?: SurfaceSentiment;\n    /**\n     * Handler called when the close button is clicked.\n     * If not provided, the close button is hidden.\n     */\n    onDismiss?: () => void;\n    /**\n     * Custom media to override the default status icon.\n     * Success and proposition sentiments support 2 status variations: standard checkmark & confetti.\n     */\n    media?: InfoPromptMedia;\n    /**\n     * Action link to be displayed below the description\n     */\n    action?: InfoPromptAction;\n    /**\n     * Title content for the prompt\n     */\n    title?: string;\n    /**\n     * Description text for the prompt (required)\n     */\n    description: string;\n    className?: string;\n    /**\n     * Sets the ARIA live region politeness level.\n     * - `'polite'` — announced after the current speech (default)\n     * - `'assertive'` — interrupts the current speech immediately\n     * - `'off'` — disables the live region entirely\n     * @default 'polite'\n     */\n    'aria-live'?: AriaLive;\n  };\n\n/**\n * `InfoPrompt` displays important contextual messages to users within a screen.\n * It provides a visually distinct way to communicate information, warnings, errors,\n * or positive feedback with optional actions and dismissal capabilities.\n *\n * Use this component to replace the deprecated `Alert` component (run codemod to migrate: **`npx \\@wise/wds-codemods@latest info-prompt`**).\n *\n * Guidance can be found in the [design system](https://wise.design/components/info-prompt).\n */\nexport const InfoPrompt = ({\n  sentiment = 'neutral',\n  onDismiss,\n  media,\n  action,\n  title,\n  description,\n  className,\n  'aria-live': ariaLive = 'polite',\n  'data-testid': dataTestId,\n  ...restProps\n}: InfoPromptProps) => {\n  const [shouldFire, setShouldFire] = useState<boolean>();\n  const announceOnChange = [title, description, action?.label].filter(Boolean).join('|');\n  const statusIconSentiment =\n    sentiment === 'success'\n      ? Sentiment.POSITIVE\n      : (sentiment as Exclude<SurfaceSentiment, 'proposition'>);\n\n  const handleTouchStart = () => {\n    setShouldFire(true);\n  };\n\n  const handleTouchEnd = () => {\n    if (shouldFire && action?.href) {\n      if (action.target === '_blank') {\n        window.top?.open(action.href, '_blank', 'noopener, noreferrer');\n      } else {\n        window.top?.location.assign(action.href);\n      }\n    }\n    setShouldFire(false);\n  };\n\n  const handleTouchMove = () => {\n    setShouldFire(false);\n  };\n\n  const renderMedia = () => {\n    if (media) {\n      return <span className=\"wds-info-prompt__media\">{media.asset}</span>;\n    }\n\n    if (sentiment === 'proposition') {\n      return <GiftBox size={24} />;\n    }\n\n    return <StatusIcon size={24} sentiment={statusIconSentiment} />;\n  };\n\n  // Render content directly in LiveRegion\n  return (\n    <LiveRegion aria-live={ariaLive} announceOnChange={announceOnChange}>\n      <PrimitivePrompt\n        sentiment={sentiment}\n        media={renderMedia()}\n        data-testid={dataTestId}\n        className={clsx('wds-info-prompt', className)}\n        {...restProps}\n        onTouchStart={handleTouchStart}\n        onTouchEnd={handleTouchEnd}\n        onTouchMove={handleTouchMove}\n        onDismiss={onDismiss}\n      >\n        <div className=\"wds-info-prompt__content\">\n          {title && (\n            <Body className=\"wds-info-prompt__title\" type={Typography.BODY_LARGE_BOLD} as=\"span\">\n              {title}\n            </Body>\n          )}\n          <Body as=\"span\" className=\"wds-info-prompt__description\">\n            {description}\n          </Body>\n          {action && (\n            <Link\n              href={action.href}\n              target={action.target}\n              type={Typography.LINK_DEFAULT}\n              className=\"wds-info-prompt__action\"\n              onClick={action.onClick}\n            >\n              {action.label}\n            </Link>\n          )}\n        </div>\n      </PrimitivePrompt>\n    </LiveRegion>\n  );\n};\n"],"names":["InfoPrompt","sentiment","onDismiss","media","action","title","description","className","ariaLive","dataTestId","restProps","shouldFire","setShouldFire","useState","announceOnChange","label","filter","Boolean","join","statusIconSentiment","Sentiment","POSITIVE","handleTouchStart","handleTouchEnd","href","target","window","top","open","location","assign","handleTouchMove","renderMedia","_jsx","children","asset","GiftBox","size","StatusIcon","LiveRegion","PrimitivePrompt","clsx","onTouchStart","onTouchEnd","onTouchMove","_jsxs","Body","type","Typography","BODY_LARGE_BOLD","as","Link","LINK_DEFAULT","onClick"],"mappings":"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"}
+{"version":3,"file":"InfoPrompt.js","sources":["../../../src/prompt/InfoPrompt/InfoPrompt.tsx"],"sourcesContent":["import { HTMLAttributes, ReactNode, useState } from 'react';\nimport { LiveRegion, Sentiment, Typography } from '../../common';\nimport type { AriaLive } from '../../common';\nimport { GiftBox } from '@transferwise/icons';\nimport type { Sentiment as SurfaceSentiment } from '../../sentimentSurface';\nimport StatusIcon from '../../statusIcon';\nimport { clsx } from 'clsx';\nimport Body from '../../body';\nimport Link, { LinkProps } from '../../link';\nimport { PrimitivePrompt, PrimitivePromptProps } from '../PrimitivePrompt';\n\nexport type InfoPromptAction = Pick<LinkProps, 'href' | 'target' | 'onClick'> & {\n  /**\n   * The label text for the action link\n   */\n  label: string;\n};\n\nexport type InfoPromptMedia = {\n  /**\n   * The icon/image asset to display.\n   * The asset should include its own accessibility attributes (e.g. title, aria-label) if it conveys meaning.\n   */\n  asset: ReactNode;\n};\n\nexport type InfoPromptProps = Omit<HTMLAttributes<HTMLDivElement>, 'title' | 'aria-live' | 'role'> &\n  Pick<PrimitivePromptProps, 'data-testid'> & {\n    /**\n     * The sentiment determines the colour scheme\n     * @default 'neutral'\n     */\n    sentiment?: SurfaceSentiment;\n    /**\n     * Handler called when the close button is clicked.\n     * If not provided, the close button is hidden.\n     */\n    onDismiss?: () => void;\n    /**\n     * Custom media to override the default status icon.\n     * Success and proposition sentiments support 2 status variations: standard checkmark & confetti.\n     */\n    media?: InfoPromptMedia;\n    /**\n     * Action link to be displayed below the description\n     */\n    action?: InfoPromptAction;\n    /**\n     * Title content for the prompt\n     */\n    title?: string;\n    /**\n     * Description text for the prompt (required)\n     */\n    description: string;\n    className?: string;\n    /**\n     * Sets the ARIA live region politeness level.\n     * - `'polite'` — announced after the current speech (default)\n     * - `'assertive'` — interrupts the current speech immediately\n     * - `'off'` — disables the live region entirely\n     * @default 'polite'\n     */\n    'aria-live'?: AriaLive;\n  };\n\n/**\n * `InfoPrompt` displays important contextual messages to users within a screen.\n * It provides a visually distinct way to communicate information, warnings, errors,\n * or positive feedback with optional actions and dismissal capabilities.\n *\n * Use this component to replace the deprecated `Alert` component (run codemod to migrate: **`npx \\@wise/wds-codemods@latest info-prompt`**).\n *\n * Guidance can be found in the [design system](https://wise.design/components/info-prompt).\n */\nexport const InfoPrompt = ({\n  sentiment = 'neutral',\n  onDismiss,\n  media,\n  action,\n  title,\n  description,\n  className,\n  'aria-live': ariaLive = 'polite',\n  'data-testid': dataTestId,\n  ...restProps\n}: InfoPromptProps) => {\n  const [shouldFire, setShouldFire] = useState<boolean>();\n  const announceOnChange = [title, description, action?.label].filter(Boolean).join('|');\n  const statusIconSentiment =\n    sentiment === 'success'\n      ? Sentiment.POSITIVE\n      : (sentiment as Exclude<SurfaceSentiment, 'proposition'>);\n\n  const handleTouchStart = () => {\n    setShouldFire(true);\n  };\n\n  const handleTouchEnd = () => {\n    if (shouldFire && action?.href) {\n      if (action.target === '_blank') {\n        window.top?.open(action.href, '_blank', 'noopener, noreferrer');\n      } else {\n        window.top?.location.assign(action.href);\n      }\n    }\n    setShouldFire(false);\n  };\n\n  const handleTouchMove = () => {\n    setShouldFire(false);\n  };\n\n  const renderMedia = () => {\n    if (media) {\n      return <span className=\"wds-info-prompt__media\">{media.asset}</span>;\n    }\n\n    if (sentiment === 'proposition') {\n      return <GiftBox size={24} />;\n    }\n\n    return <StatusIcon size={24} sentiment={statusIconSentiment} />;\n  };\n\n  // Render content directly in LiveRegion\n  return (\n    <LiveRegion aria-live={ariaLive} announceOnChange={announceOnChange}>\n      <PrimitivePrompt\n        sentiment={sentiment}\n        media={renderMedia()}\n        data-testid={dataTestId}\n        className={clsx('wds-info-prompt', className)}\n        {...restProps}\n        onTouchStart={handleTouchStart}\n        onTouchEnd={handleTouchEnd}\n        onTouchMove={handleTouchMove}\n        onDismiss={onDismiss}\n      >\n        <div className=\"wds-info-prompt__content\">\n          {title && (\n            <Body className=\"wds-info-prompt__title\" type={Typography.BODY_LARGE_BOLD} as=\"span\">\n              {title}\n            </Body>\n          )}\n          <Body as=\"span\" className=\"wds-info-prompt__description\">\n            {description}\n          </Body>\n          {action && (\n            <Link\n              href={action.href}\n              target={action.target}\n              type={Typography.LINK_DEFAULT}\n              className=\"wds-info-prompt__action\"\n              onClick={action.onClick}\n            >\n              {action.label}\n            </Link>\n          )}\n        </div>\n      </PrimitivePrompt>\n    </LiveRegion>\n  );\n};\n"],"names":["InfoPrompt","sentiment","onDismiss","media","action","title","description","className","ariaLive","dataTestId","restProps","shouldFire","setShouldFire","useState","announceOnChange","label","filter","Boolean","join","statusIconSentiment","Sentiment","POSITIVE","handleTouchStart","handleTouchEnd","href","target","window","top","open","location","assign","handleTouchMove","renderMedia","_jsx","children","asset","GiftBox","size","StatusIcon","LiveRegion","PrimitivePrompt","clsx","onTouchStart","onTouchEnd","onTouchMove","_jsxs","Body","type","Typography","BODY_LARGE_BOLD","as","Link","LINK_DEFAULT","onClick"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2EO,MAAMA,UAAU,GAAGA,CAAC;AACzBC,aAAAA,WAAS,GAAG,SAAS;EACrBC,SAAS;EACTC,KAAK;EACLC,MAAM;EACNC,KAAK;EACLC,WAAW;EACXC,SAAS;EACT,WAAW,EAAEC,QAAQ,GAAG,QAAQ;AAChC,EAAA,aAAa,EAAEC,UAAU;EACzB,GAAGC;AAAS,CACI,KAAI;EACpB,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAGC,cAAQ,EAAW;EACvD,MAAMC,gBAAgB,GAAG,CAACT,KAAK,EAAEC,WAAW,EAAEF,MAAM,EAAEW,KAAK,CAAC,CAACC,MAAM,CAACC,OAAO,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC;EACtF,MAAMC,mBAAmB,GACvBlB,WAAS,KAAK,SAAS,GACnBmB,mBAAS,CAACC,QAAQ,GACjBpB,WAAsD;EAE7D,MAAMqB,gBAAgB,GAAGA,MAAK;IAC5BV,aAAa,CAAC,IAAI,CAAC;EACrB,CAAC;EAED,MAAMW,cAAc,GAAGA,MAAK;AAC1B,IAAA,IAAIZ,UAAU,IAAIP,MAAM,EAAEoB,IAAI,EAAE;AAC9B,MAAA,IAAIpB,MAAM,CAACqB,MAAM,KAAK,QAAQ,EAAE;AAC9BC,QAAAA,MAAM,CAACC,GAAG,EAAEC,IAAI,CAACxB,MAAM,CAACoB,IAAI,EAAE,QAAQ,EAAE,sBAAsB,CAAC;AACjE,MAAA,CAAC,MAAM;QACLE,MAAM,CAACC,GAAG,EAAEE,QAAQ,CAACC,MAAM,CAAC1B,MAAM,CAACoB,IAAI,CAAC;AAC1C,MAAA;AACF,IAAA;IACAZ,aAAa,CAAC,KAAK,CAAC;EACtB,CAAC;EAED,MAAMmB,eAAe,GAAGA,MAAK;IAC3BnB,aAAa,CAAC,KAAK,CAAC;EACtB,CAAC;EAED,MAAMoB,WAAW,GAAGA,MAAK;AACvB,IAAA,IAAI7B,KAAK,EAAE;AACT,MAAA,oBAAO8B,cAAA,CAAA,MAAA,EAAA;AAAM1B,QAAAA,SAAS,EAAC,wBAAwB;QAAA2B,QAAA,EAAE/B,KAAK,CAACgC;AAAK,OAAO,CAAC;AACtE,IAAA;IAEA,IAAIlC,WAAS,KAAK,aAAa,EAAE;MAC/B,oBAAOgC,cAAA,CAACG,aAAO,EAAA;AAACC,QAAAA,IAAI,EAAE;AAAG,OAAA,CAAG;AAC9B,IAAA;IAEA,oBAAOJ,cAAA,CAACK,kBAAU,EAAA;AAACD,MAAAA,IAAI,EAAE,EAAG;AAACpC,MAAAA,SAAS,EAAEkB;AAAoB,MAAG;EACjE,CAAC;AAED;EACA,oBACEc,cAAA,CAACM,qBAAU,EAAA;AAAC,IAAA,WAAA,EAAW/B,QAAS;AAACM,IAAAA,gBAAgB,EAAEA,gBAAiB;IAAAoB,QAAA,eAClED,cAAA,CAACO,+BAAe,EAAA;AACdvC,MAAAA,SAAS,EAAEA,WAAU;MACrBE,KAAK,EAAE6B,WAAW,EAAG;AACrB,MAAA,aAAA,EAAavB,UAAW;AACxBF,MAAAA,SAAS,EAAEkC,SAAI,CAAC,iBAAiB,EAAElC,SAAS,CAAE;AAAA,MAAA,GAC1CG,SAAS;AACbgC,MAAAA,YAAY,EAAEpB,gBAAiB;AAC/BqB,MAAAA,UAAU,EAAEpB,cAAe;AAC3BqB,MAAAA,WAAW,EAAEb,eAAgB;AAC7B7B,MAAAA,SAAS,EAAEA,SAAU;AAAAgC,MAAAA,QAAA,eAErBW,eAAA,CAAA,KAAA,EAAA;AAAKtC,QAAAA,SAAS,EAAC,0BAA0B;AAAA2B,QAAAA,QAAA,EAAA,CACtC7B,KAAK,iBACJ4B,cAAA,CAACa,YAAI,EAAA;AAACvC,UAAAA,SAAS,EAAC,wBAAwB;UAACwC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACC,UAAAA,EAAE,EAAC,MAAM;AAAAhB,UAAAA,QAAA,EACjF7B;AAAK,SACF,CACP,eACD4B,cAAA,CAACa,YAAI,EAAA;AAACI,UAAAA,EAAE,EAAC,MAAM;AAAC3C,UAAAA,SAAS,EAAC,8BAA8B;AAAA2B,UAAAA,QAAA,EACrD5B;AAAW,SACR,CACN,EAACF,MAAM,iBACL6B,cAAA,CAACkB,YAAI,EAAA;UACH3B,IAAI,EAAEpB,MAAM,CAACoB,IAAK;UAClBC,MAAM,EAAErB,MAAM,CAACqB,MAAO;UACtBsB,IAAI,EAAEC,qBAAU,CAACI,YAAa;AAC9B7C,UAAAA,SAAS,EAAC,yBAAyB;UACnC8C,OAAO,EAAEjD,MAAM,CAACiD,OAAQ;UAAAnB,QAAA,EAEvB9B,MAAM,CAACW;AAAK,SACT,CACP;OACE;KACU;AACnB,GAAY,CAAC;AAEjB;;;;"}

package/build/prompt/InfoPrompt/InfoPrompt.mjs

@@ -18,7 +18,6 @@ import '../../common/propsValues/variant.mjs';
 import '../../common/propsValues/scroll.mjs';
 import '../../common/propsValues/markdownNodeType.mjs';
 import '../../common/fileType.mjs';
-import '@transferwise/formatting';
 import { GiftBox } from '@transferwise/icons';
 import { clsx } from 'clsx';
 import 'react-intl';