@transferwise/components 46.95.2 → 46.96.1

package/build/nudge/Nudge.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Nudge.mjs","sources":["../../src/nudge/Nudge.tsx"],"sourcesContent":["import { Illustration, Assets, IllustrationNames } from '@wise/art';\nimport { clsx } from 'clsx';\nimport { ReactNode, useEffect, useState, MouseEvent } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport Link from '../link';\nimport { Action, ActionOptions } from '../common/action/Action';\n\n// WARNING: Changing this will cause nudges to reappear wherever persist nudge is used and privacy team will need to be updated too\nexport const STORAGE_NAME = 'dismissedNudges';\n\nconst getLocalStorage = (): string[] => {\n  try {\n    const storageItem = localStorage.getItem(STORAGE_NAME);\n\n    if (storageItem) {\n      const storage: unknown = JSON.parse(storageItem);\n\n      if (Array.isArray(storage)) {\n        return storage.map((item) => String(item));\n      }\n    }\n  } catch (error) {}\n\n  return [];\n};\n\ntype MediaNameType =\n  | `${Assets.GLOBE}`\n  | `${Assets.LOCK}`\n  | `${Assets.WALLET}`\n  | `${Assets.GEAR}`\n  | `${Assets.INVITE_LETTER}`\n  | `${Assets.PERSONAL_CARD}`\n  | `${Assets.BUSINESS_CARD}`\n  | `${Assets.HEART}`\n  | `${Assets.MULTI_CURRENCY}`\n  | `${Assets.SHOPPING_BAG}`\n  | `${Assets.FLOWER}`;\n\ntype BaseProps = {\n  /** @deprecated use `mediaName` property instead */\n  media?: ReactNode;\n  /** Media name  */\n  mediaName?: MediaNameType;\n  title: ReactNode;\n  link?: ReactNode;\n  href?: string;\n  onClick?: (event?: MouseEvent<HTMLSpanElement>) => void;\n  /** Fired when the user clicks on close button */\n  onDismiss?: () => void;\n  /** An optional call to action to sit under the main body of the nudge. If your label is short, use aria-label to provide more context */\n  action?: ActionOptions;\n  className?: string;\n};\n\nexport interface OptionalId extends BaseProps {\n  id?: string;\n  persistDismissal?: false;\n  isPreviouslyDismissed?: undefined;\n}\n\nexport interface RequiredPersistProps extends BaseProps {\n  /** This ID should be completely unique to the page and feature as it uses a shared array which could conflict with other nudges in Wise */\n  id: string;\n  /** Use persist dismissal to keep the nudge dismissed using the browser's localStorage */\n  persistDismissal: true;\n  /**\n   * Fired on mount for determining if nudge has been dismissed before\n   *\n   * @param {boolean}  value - set to true if dismissed previously\n   */\n  isPreviouslyDismissed?: (value: boolean) => void;\n}\n\nexport type Props = OptionalId | RequiredPersistProps;\n\nconst Nudge = ({\n  media,\n  mediaName,\n  title,\n  link,\n  href,\n  onClick,\n  onDismiss,\n  persistDismissal,\n  isPreviouslyDismissed,\n  id,\n  className,\n  action,\n}: Props) => {\n  const [isDismissed, setIsDismissed] = useState(false);\n  const [isMounted, setIsMounted] = useState(false);\n\n  const handleOnDismiss = () => {\n    const dismissedNudgesStorage = getLocalStorage();\n\n    if (persistDismissal && id) {\n      try {\n        localStorage.setItem(STORAGE_NAME, JSON.stringify([...dismissedNudgesStorage, id]));\n      } catch (error) {}\n\n      setIsDismissed(true);\n    }\n\n    if (onDismiss) {\n      onDismiss();\n    }\n  };\n\n  useEffect(() => {\n    if (persistDismissal && id) {\n      const dismissedNudgesStorage = getLocalStorage();\n      let isDismissed = false;\n\n      if (dismissedNudgesStorage?.find((item) => item === id)) {\n        setIsDismissed(true);\n        isDismissed = true;\n      }\n\n      if (isPreviouslyDismissed) {\n        isPreviouslyDismissed(isDismissed);\n      }\n    }\n\n    setIsMounted(true);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [id, persistDismissal]);\n\n  if (persistDismissal && (isDismissed || !isMounted)) {\n    return null;\n  }\n\n  return (\n    <div className={clsx('wds-nudge', className)} id={id}>\n      {!!mediaName && (\n        <div className=\"wds-nudge-media\">\n          <Illustration\n            name={mediaName as IllustrationNames}\n            className={clsx(`wds-nudge-media-${mediaName}`)}\n            size=\"small\"\n            disablePadding\n            alt=\"\"\n          />\n        </div>\n      )}\n      <div className=\"wds-nudge-container\">\n        <div className=\"wds-nudge-content\">\n          <Body type={Typography.BODY_LARGE} className={clsx('wds-nudge-body')}>\n            {title}\n          </Body>\n          {link && (\n            <Link\n              href={href}\n              type={Typography.LINK_LARGE}\n              className=\"wds-nudge-link\"\n              onClick={onClick}\n            >\n              {link}\n            </Link>\n          )}\n          {action && <Action action={action} className=\"m-t-1\" />}\n        </div>\n        {onDismiss || persistDismissal ? (\n          <CloseButton className=\"wds-nudge-control\" size=\"sm\" onClick={handleOnDismiss} />\n        ) : null}\n      </div>\n    </div>\n  );\n};\n\nexport default Nudge;\n"],"names":["STORAGE_NAME","getLocalStorage","storageItem","localStorage","getItem","storage","JSON","parse","Array","isArray","map","item","String","error","Nudge","media","mediaName","title","link","href","onClick","onDismiss","persistDismissal","isPreviouslyDismissed","id","className","action","isDismissed","setIsDismissed","useState","isMounted","setIsMounted","handleOnDismiss","dismissedNudgesStorage","setItem","stringify","useEffect","find","_jsxs","clsx","children","_jsx","Illustration","name","size","disablePadding","alt","Body","type","Typography","BODY_LARGE","Link","LINK_LARGE","Action","CloseButton"],"mappings":"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"}
+{"version":3,"file":"Nudge.mjs","sources":["../../src/nudge/Nudge.tsx"],"sourcesContent":["import { Illustration, Assets, IllustrationNames } from '@wise/art';\nimport { clsx } from 'clsx';\nimport { ReactNode, useEffect, useState, MouseEvent } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport Link from '../link';\nimport type { AlertAction } from '../alert';\n\n// WARNING: Changing this will cause nudges to reappear wherever persist nudge is used and privacy team will need to be updated too\nexport const STORAGE_NAME = 'dismissedNudges';\n\nconst getLocalStorage = (): string[] => {\n  try {\n    const storageItem = localStorage.getItem(STORAGE_NAME);\n\n    if (storageItem) {\n      const storage: unknown = JSON.parse(storageItem);\n\n      if (Array.isArray(storage)) {\n        return storage.map((item) => String(item));\n      }\n    }\n  } catch (error) {}\n\n  return [];\n};\n\ntype MediaNameType =\n  | `${Assets.GLOBE}`\n  | `${Assets.LOCK}`\n  | `${Assets.WALLET}`\n  | `${Assets.GEAR}`\n  | `${Assets.INVITE_LETTER}`\n  | `${Assets.PERSONAL_CARD}`\n  | `${Assets.BUSINESS_CARD}`\n  | `${Assets.HEART}`\n  | `${Assets.MULTI_CURRENCY}`\n  | `${Assets.SHOPPING_BAG}`\n  | `${Assets.FLOWER}`;\n\ntype BaseProps = {\n  /** @deprecated use `mediaName` property instead */\n  media?: ReactNode;\n  /** Media name  */\n  mediaName?: MediaNameType;\n  title: ReactNode;\n  link?: ReactNode;\n  href?: string;\n  onClick?: (event?: MouseEvent<HTMLSpanElement>) => void;\n  /** Fired when the user clicks on close button */\n  onDismiss?: () => void;\n  /** An optional call to action to sit under the main body of the nudge. If your label is short, use aria-label to provide more context */\n  action?: AlertAction;\n  className?: string;\n};\n\nexport interface OptionalId extends BaseProps {\n  id?: string;\n  persistDismissal?: false;\n  isPreviouslyDismissed?: undefined;\n}\n\nexport interface RequiredPersistProps extends BaseProps {\n  /** This ID should be completely unique to the page and feature as it uses a shared array which could conflict with other nudges in Wise */\n  id: string;\n  /** Use persist dismissal to keep the nudge dismissed using the browser's localStorage */\n  persistDismissal: true;\n  /**\n   * Fired on mount for determining if nudge has been dismissed before\n   *\n   * @param {boolean}  value - set to true if dismissed previously\n   */\n  isPreviouslyDismissed?: (value: boolean) => void;\n}\n\nexport type Props = OptionalId | RequiredPersistProps;\n\nconst Nudge = ({\n  media,\n  mediaName,\n  title,\n  link,\n  href,\n  onClick,\n  onDismiss,\n  persistDismissal,\n  isPreviouslyDismissed,\n  id,\n  className,\n  action,\n}: Props) => {\n  const [isDismissed, setIsDismissed] = useState(false);\n  const [isMounted, setIsMounted] = useState(false);\n\n  const handleOnDismiss = () => {\n    const dismissedNudgesStorage = getLocalStorage();\n\n    if (persistDismissal && id) {\n      try {\n        localStorage.setItem(STORAGE_NAME, JSON.stringify([...dismissedNudgesStorage, id]));\n      } catch (error) {}\n\n      setIsDismissed(true);\n    }\n\n    if (onDismiss) {\n      onDismiss();\n    }\n  };\n\n  useEffect(() => {\n    if (persistDismissal && id) {\n      const dismissedNudgesStorage = getLocalStorage();\n      let isDismissed = false;\n\n      if (dismissedNudgesStorage?.find((item) => item === id)) {\n        setIsDismissed(true);\n        isDismissed = true;\n      }\n\n      if (isPreviouslyDismissed) {\n        isPreviouslyDismissed(isDismissed);\n      }\n    }\n\n    setIsMounted(true);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [id, persistDismissal]);\n\n  if (persistDismissal && (isDismissed || !isMounted)) {\n    return null;\n  }\n\n  return (\n    <div className={clsx('wds-nudge', className)} id={id}>\n      {!!mediaName && (\n        <div className=\"wds-nudge-media\">\n          <Illustration\n            name={mediaName as IllustrationNames}\n            className={clsx(`wds-nudge-media-${mediaName}`)}\n            size=\"small\"\n            disablePadding\n            alt=\"\"\n          />\n        </div>\n      )}\n      <div className=\"wds-nudge-container\">\n        <div className=\"wds-nudge-content\">\n          <Body type={Typography.BODY_LARGE} className={clsx('wds-nudge-body')}>\n            {title}\n          </Body>\n          {/* Merge these two Link instances into one */}\n          {link && (\n            <Link\n              href={href}\n              type={Typography.LINK_LARGE}\n              className=\"wds-nudge-link\"\n              onClick={onClick}\n            >\n              {link}\n            </Link>\n          )}\n          {action && (\n            <Link\n              href={action.href}\n              target={action.target}\n              className=\"m-t-1\"\n              aria-label={action['aria-label']}\n              type={Typography.LINK_LARGE}\n              onClick={action.onClick}\n            >\n              {action.text}\n            </Link>\n          )}\n        </div>\n        {onDismiss || persistDismissal ? (\n          <CloseButton className=\"wds-nudge-control\" size=\"sm\" onClick={handleOnDismiss} />\n        ) : null}\n      </div>\n    </div>\n  );\n};\n\nexport default Nudge;\n"],"names":["STORAGE_NAME","getLocalStorage","storageItem","localStorage","getItem","storage","JSON","parse","Array","isArray","map","item","String","error","Nudge","media","mediaName","title","link","href","onClick","onDismiss","persistDismissal","isPreviouslyDismissed","id","className","action","isDismissed","setIsDismissed","useState","isMounted","setIsMounted","handleOnDismiss","dismissedNudgesStorage","setItem","stringify","useEffect","find","_jsxs","clsx","children","_jsx","Illustration","name","size","disablePadding","alt","Body","type","Typography","BODY_LARGE","Link","LINK_LARGE","target","text","CloseButton"],"mappings":"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"}

package/build/promoCard/PromoCardIndicator.js

@@ -4,8 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var icons = require('@transferwise/icons');
 var clsx = require('clsx');
-var avatarTypes = require('../avatar/avatarTypes.js');
-var Avatar = require('../avatar/Avatar.js');
 var Body = require('../body/Body.js');
 require('../common/theme.js');
 require('../common/direction.js');
@@ -30,6 +28,7 @@ require('react');
 require('react-intl');
 require('../common/closeButton/CloseButton.messages.js');
 var jsxRuntime = require('react/jsx-runtime');
+var AvatarView = require('../avatarView/AvatarView.js');
 
 const PromoCardIndicator = ({
   className,
@@ -55,10 +54,12 @@ const PromoCardIndicator = ({
       type: typography.Typography.BODY_LARGE_BOLD,
       className: "np-Card-indicatorText",
       children: label
-    }), icon && /*#__PURE__*/jsxRuntime.jsx(Avatar.default, {
-      type: avatarTypes.AvatarType.ICON,
+    }), icon && /*#__PURE__*/jsxRuntime.jsx(AvatarView.default, {
+      interactive: true,
       size: isSmall ? 40 : 56,
-      backgroundColor: "var(--Card-indicator-icon-background-color)",
+      style: {
+        backgroundColor: 'var(--Card-indicator-icon-background-color)'
+      },
       className: "np-Card-indicatorIcon",
       children: IconComponent ? /*#__PURE__*/jsxRuntime.jsx(IconComponent, {
         size: 24,

package/build/promoCard/PromoCardIndicator.js.map

@@ -1 +1 @@
-{"version":3,"file":"PromoCardIndicator.js","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Avatar, { AvatarType } from '../avatar';\nimport Body from '../body';\nimport { Typography } from '../common';\n\nexport type PromoCardIndicatorProps = {\n  /** Optional class name(s) to add to the indicator container. */\n  className?: string;\n\n  /** Optional label to display next to the indicator. */\n  label?: string;\n\n  /** Optional icon to display in the indicator. */\n  icon?: 'check' | 'arrow' | 'download' | ReactElement;\n\n  /** Optional prop to specify whether the indicator is sized small or not. */\n  isSmall?: boolean;\n\n  /** Optional ID to add to the indicator container for testing purposes. */\n  testid?: string;\n\n  /** Optional children to display inside the indicator. */\n  children?: ReactNode;\n};\n\n/**\n * PromoCardIndicator component.\n *\n * A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n *\n * @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string | ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n  className,\n  children,\n  label,\n  icon,\n  isSmall = false,\n  testid,\n  ...rest\n}) => {\n  const isIconString = icon && typeof icon === 'string';\n\n  const IconComponent =\n    isIconString &&\n    {\n      check: Check,\n      arrow: ArrowRight,\n      download: Download,\n    }[icon];\n\n  return (\n    <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n      {label && (\n        <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n          {label}\n        </Body>\n      )}\n      {icon && (\n        <Avatar\n          type={AvatarType.ICON}\n          size={isSmall ? 40 : 56}\n          backgroundColor=\"var(--Card-indicator-icon-background-color)\"\n          className=\"np-Card-indicatorIcon\"\n        >\n          {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n        </Avatar>\n      )}\n      {children}\n    </div>\n  );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","Avatar","AvatarType","ICON","size","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CMA,MAAAA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC,IAAAA;AACJ,CAAA,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,CAAA;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,WAAK;AACZC,IAAAA,KAAK,EAAEC,gBAAU;AACjBC,IAAAA,QAAQ,EAAEC,cAAAA;GACX,CAACX,IAAI,CAAC,CAAA;AAET,EAAA,oBACEY,eAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,SAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAChFC,CAAAA,KAAK,iBACJe,cAAA,CAACC,YAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC,KAAAA;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,cAAA,CAACM,cAAM,EAAA;MACLH,IAAI,EAAEI,sBAAU,CAACC,IAAK;AACtBC,MAAAA,IAAI,EAAEtB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBuB,MAAAA,eAAe,EAAC,6CAA6C;AAC7D3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,cAAA,CAACT,aAAa,EAAA;AAACkB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAY,EAAA,MAAA;AAAM,QAAG,GAAGvB,IAAAA;KAC5D,CACT,EACAF,QAAQ,CAAA;AAAA,GACN,CAAC,CAAA;AAEV;;;;"}
+{"version":3,"file":"PromoCardIndicator.js","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport AvatarView from '../avatarView';\n\nexport type PromoCardIndicatorProps = {\n  /** Optional class name(s) to add to the indicator container. */\n  className?: string;\n\n  /** Optional label to display next to the indicator. */\n  label?: string;\n\n  /** Optional icon to display in the indicator. */\n  icon?: 'check' | 'arrow' | 'download' | ReactElement;\n\n  /** Optional prop to specify whether the indicator is sized small or not. */\n  isSmall?: boolean;\n\n  /** Optional ID to add to the indicator container for testing purposes. */\n  testid?: string;\n\n  /** Optional children to display inside the indicator. */\n  children?: ReactNode;\n};\n\n/**\n * PromoCardIndicator component.\n *\n * A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n *\n * @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string | ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n  className,\n  children,\n  label,\n  icon,\n  isSmall = false,\n  testid,\n  ...rest\n}) => {\n  const isIconString = icon && typeof icon === 'string';\n\n  const IconComponent =\n    isIconString &&\n    {\n      check: Check,\n      arrow: ArrowRight,\n      download: Download,\n    }[icon];\n\n  return (\n    <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n      {label && (\n        <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n          {label}\n        </Body>\n      )}\n      {icon && (\n        <AvatarView\n          interactive\n          size={isSmall ? 40 : 56}\n          style={{ backgroundColor: 'var(--Card-indicator-icon-background-color)' }}\n          className=\"np-Card-indicatorIcon\"\n        >\n          {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n        </AvatarView>\n      )}\n      {children}\n    </div>\n  );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","AvatarView","interactive","size","style","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CMA,MAAAA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC,IAAAA;AACJ,CAAA,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,CAAA;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,WAAK;AACZC,IAAAA,KAAK,EAAEC,gBAAU;AACjBC,IAAAA,QAAQ,EAAEC,cAAAA;GACX,CAACX,IAAI,CAAC,CAAA;AAET,EAAA,oBACEY,eAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,SAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAChFC,CAAAA,KAAK,iBACJe,cAAA,CAACC,YAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC,KAAAA;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,cAAA,CAACM,kBAAU,EAAA;MACTC,WAAW,EAAA,IAAA;AACXC,MAAAA,IAAI,EAAErB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBsB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAE,6CAAA;OAAgD;AAC1E3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,cAAA,CAACT,aAAa,EAAA;AAACiB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAY,EAAA,MAAA;AAAM,QAAG,GAAGtB,IAAAA;KACxD,CACb,EACAF,QAAQ,CAAA;AAAA,GACN,CAAC,CAAA;AAEV;;;;"}

package/build/promoCard/PromoCardIndicator.mjs

@@ -1,7 +1,5 @@
 import { Check, ArrowRight, Download } from '@transferwise/icons';
 import { clsx } from 'clsx';
-import { AvatarType } from '../avatar/avatarTypes.mjs';
-import Avatar from '../avatar/Avatar.mjs';
 import Body from '../body/Body.mjs';
 import '../common/theme.mjs';
 import '../common/direction.mjs';
@@ -26,6 +24,7 @@ import 'react';
 import 'react-intl';
 import '../common/closeButton/CloseButton.messages.mjs';
 import { jsxs, jsx } from 'react/jsx-runtime';
+import AvatarView from '../avatarView/AvatarView.mjs';
 
 const PromoCardIndicator = ({
   className,
@@ -51,10 +50,12 @@ const PromoCardIndicator = ({
       type: Typography.BODY_LARGE_BOLD,
       className: "np-Card-indicatorText",
       children: label
-    }), icon && /*#__PURE__*/jsx(Avatar, {
-      type: AvatarType.ICON,
+    }), icon && /*#__PURE__*/jsx(AvatarView, {
+      interactive: true,
       size: isSmall ? 40 : 56,
-      backgroundColor: "var(--Card-indicator-icon-background-color)",
+      style: {
+        backgroundColor: 'var(--Card-indicator-icon-background-color)'
+      },
       className: "np-Card-indicatorIcon",
       children: IconComponent ? /*#__PURE__*/jsx(IconComponent, {
         size: 24,

package/build/promoCard/PromoCardIndicator.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"PromoCardIndicator.mjs","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Avatar, { AvatarType } from '../avatar';\nimport Body from '../body';\nimport { Typography } from '../common';\n\nexport type PromoCardIndicatorProps = {\n  /** Optional class name(s) to add to the indicator container. */\n  className?: string;\n\n  /** Optional label to display next to the indicator. */\n  label?: string;\n\n  /** Optional icon to display in the indicator. */\n  icon?: 'check' | 'arrow' | 'download' | ReactElement;\n\n  /** Optional prop to specify whether the indicator is sized small or not. */\n  isSmall?: boolean;\n\n  /** Optional ID to add to the indicator container for testing purposes. */\n  testid?: string;\n\n  /** Optional children to display inside the indicator. */\n  children?: ReactNode;\n};\n\n/**\n * PromoCardIndicator component.\n *\n * A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n *\n * @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string | ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n  className,\n  children,\n  label,\n  icon,\n  isSmall = false,\n  testid,\n  ...rest\n}) => {\n  const isIconString = icon && typeof icon === 'string';\n\n  const IconComponent =\n    isIconString &&\n    {\n      check: Check,\n      arrow: ArrowRight,\n      download: Download,\n    }[icon];\n\n  return (\n    <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n      {label && (\n        <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n          {label}\n        </Body>\n      )}\n      {icon && (\n        <Avatar\n          type={AvatarType.ICON}\n          size={isSmall ? 40 : 56}\n          backgroundColor=\"var(--Card-indicator-icon-background-color)\"\n          className=\"np-Card-indicatorIcon\"\n        >\n          {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n        </Avatar>\n      )}\n      {children}\n    </div>\n  );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","Avatar","AvatarType","ICON","size","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CMA,MAAAA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC,IAAAA;AACJ,CAAA,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,CAAA;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,KAAK;AACZC,IAAAA,KAAK,EAAEC,UAAU;AACjBC,IAAAA,QAAQ,EAAEC,QAAAA;GACX,CAACX,IAAI,CAAC,CAAA;AAET,EAAA,oBACEY,IAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,IAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAChFC,CAAAA,KAAK,iBACJe,GAAA,CAACC,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,UAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC,KAAAA;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,GAAA,CAACM,MAAM,EAAA;MACLH,IAAI,EAAEI,UAAU,CAACC,IAAK;AACtBC,MAAAA,IAAI,EAAEtB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBuB,MAAAA,eAAe,EAAC,6CAA6C;AAC7D3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,GAAA,CAACT,aAAa,EAAA;AAACkB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAY,EAAA,MAAA;AAAM,QAAG,GAAGvB,IAAAA;KAC5D,CACT,EACAF,QAAQ,CAAA;AAAA,GACN,CAAC,CAAA;AAEV;;;;"}
+{"version":3,"file":"PromoCardIndicator.mjs","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport AvatarView from '../avatarView';\n\nexport type PromoCardIndicatorProps = {\n  /** Optional class name(s) to add to the indicator container. */\n  className?: string;\n\n  /** Optional label to display next to the indicator. */\n  label?: string;\n\n  /** Optional icon to display in the indicator. */\n  icon?: 'check' | 'arrow' | 'download' | ReactElement;\n\n  /** Optional prop to specify whether the indicator is sized small or not. */\n  isSmall?: boolean;\n\n  /** Optional ID to add to the indicator container for testing purposes. */\n  testid?: string;\n\n  /** Optional children to display inside the indicator. */\n  children?: ReactNode;\n};\n\n/**\n * PromoCardIndicator component.\n *\n * A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n *\n * @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string | ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n  className,\n  children,\n  label,\n  icon,\n  isSmall = false,\n  testid,\n  ...rest\n}) => {\n  const isIconString = icon && typeof icon === 'string';\n\n  const IconComponent =\n    isIconString &&\n    {\n      check: Check,\n      arrow: ArrowRight,\n      download: Download,\n    }[icon];\n\n  return (\n    <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n      {label && (\n        <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n          {label}\n        </Body>\n      )}\n      {icon && (\n        <AvatarView\n          interactive\n          size={isSmall ? 40 : 56}\n          style={{ backgroundColor: 'var(--Card-indicator-icon-background-color)' }}\n          className=\"np-Card-indicatorIcon\"\n        >\n          {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n        </AvatarView>\n      )}\n      {children}\n    </div>\n  );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","AvatarView","interactive","size","style","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CMA,MAAAA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC,IAAAA;AACJ,CAAA,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,CAAA;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,KAAK;AACZC,IAAAA,KAAK,EAAEC,UAAU;AACjBC,IAAAA,QAAQ,EAAEC,QAAAA;GACX,CAACX,IAAI,CAAC,CAAA;AAET,EAAA,oBACEY,IAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,IAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAChFC,CAAAA,KAAK,iBACJe,GAAA,CAACC,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,UAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC,KAAAA;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,GAAA,CAACM,UAAU,EAAA;MACTC,WAAW,EAAA,IAAA;AACXC,MAAAA,IAAI,EAAErB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBsB,MAAAA,KAAK,EAAE;AAAEC,QAAAA,eAAe,EAAE,6CAAA;OAAgD;AAC1E3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,GAAA,CAACT,aAAa,EAAA;AAACiB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAY,EAAA,MAAA;AAAM,QAAG,GAAGtB,IAAAA;KACxD,CACb,EACAF,QAAQ,CAAA;AAAA,GACN,CAAC,CAAA;AAEV;;;;"}

package/build/styles/inputs/Input.css

@@ -71,6 +71,8 @@
   line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
+  -webkit-hyphens: auto;
+          hyphens: auto;
   margin-bottom: 0;
   margin-bottom: initial;
   font-size: 1.375rem;

package/build/styles/inputs/TextArea.css

@@ -71,6 +71,8 @@
   line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
+  -webkit-hyphens: auto;
+          hyphens: auto;
   margin-bottom: 0;
   margin-bottom: initial;
   font-size: 1.375rem;

package/build/styles/link/Link.css

@@ -1,4 +1,5 @@
-a {
+a,
+button.np-link {
   border-radius: 2px;
 }
 .np-link .tw-icon {

package/build/styles/main.css

@@ -34,10 +34,6 @@
     margin-left: var(--padding-small);
   }
 }
-.tw-date-lookup-calendar > tbody > tr > td.weekend button {
-  font-size: 0.875rem;
-  font-size: var(--font-size-14);line-height: 155%;letter-spacing: -0.006em;font-weight: 400;font-weight: var(--font-weight-regular);
-}
 @media (min-width: 768px) {
 }
 @media (min-width: 768px) {
@@ -2589,6 +2585,8 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
   line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
+  -webkit-hyphens: auto;
+          hyphens: auto;
   margin-bottom: 0;
   margin-bottom: initial;
   font-size: 1.375rem;
@@ -3106,7 +3104,8 @@ html:not([dir="rtl"]) .np-flow-navigation--sm .np-flow-navigation__stepper {
 .tw-instructions .instruction .dont {
   color: var(--color-sentiment-negative);
 }
-a {
+a,
+button.np-link {
   border-radius: 2px;
 }
 .np-link .tw-icon {
@@ -4024,6 +4023,8 @@ html:not([dir="rtl"]) .np-navigation-option {
   line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
+  -webkit-hyphens: auto;
+          hyphens: auto;
   margin-bottom: 0;
   margin-bottom: initial;
   font-weight: 600;
@@ -4438,7 +4439,10 @@ html:not([dir="rtl"]) .np-navigation-option {
   }
 }
 .status-circle .light {
-  color: var(--color-contrast);
+  color: var(--color-contrast-overlay);
+}
+.np-theme-personal--bright-green .status-circle .light {
+  color: var(--color-white);
 }
 .status-circle .dark {
   color: #37517e;
@@ -4456,6 +4460,10 @@ html:not([dir="rtl"]) .np-navigation-option {
 .status-circle.error {
   background-color: var(--color-sentiment-negative);
 }
+.status-circle.negative .status-icon,
+.status-circle.error .status-icon {
+  color: var(--color-sentiment-negative-secondary);
+}
 .status-circle.neutral {
   background-color: #5d7079;
   background-color: var(--color-content-secondary);
@@ -4464,6 +4472,10 @@ html:not([dir="rtl"]) .np-navigation-option {
 .status-circle.success {
   background-color: var(--color-sentiment-positive);
 }
+.status-circle.positive .status-icon,
+.status-circle.success .status-icon {
+  color: var(--color-sentiment-positive-secondary);
+}
 .tw-stepper {
   padding-bottom: 24px;
   width: 100%;
@@ -4541,13 +4553,6 @@ html:not([dir="rtl"]) .np-navigation-option {
   transition: width 0.6s ease-in-out;
   will-change: width;
 }
-.btn-unstyled {
-  background: none;
-  border: none;
-  margin: 0;
-  padding: 0;
-  display: block;
-}
 .np-select .np-dropdown-toggle {
   background-color: #ffffff;
   background-color: var(--color-background-screen);
@@ -5093,10 +5098,6 @@ html:not([dir="rtl"]) .np-navigation-option {
 .np-summary__action {
   margin-top: 4px;
   margin-top: var(--size-4);
-  font-size: 0.875rem;
-  font-size: var(--font-size-14);
-  font-weight: 600;
-  font-weight: var(--font-weight-semi-bold);
 }
 .np-summary + .np-summary {
   margin-top: 24px;

package/build/styles/popover/Popover.css

@@ -24,6 +24,8 @@
   line-height: 1.2;
   line-height: var(--line-height-title);
   letter-spacing: 0;
+  -webkit-hyphens: auto;
+          hyphens: auto;
   margin-bottom: 0;
   margin-bottom: initial;
   font-weight: 600;

package/build/styles/statusIcon/StatusIcon.css

@@ -1,5 +1,8 @@
 .status-circle .light {
-  color: var(--color-contrast);
+  color: var(--color-contrast-overlay);
+}
+.np-theme-personal--bright-green .status-circle .light {
+  color: var(--color-white);
 }
 .status-circle .dark {
   color: #37517e;
@@ -17,6 +20,10 @@
 .status-circle.error {
   background-color: var(--color-sentiment-negative);
 }
+.status-circle.negative .status-icon,
+.status-circle.error .status-icon {
+  color: var(--color-sentiment-negative-secondary);
+}
 .status-circle.neutral {
   background-color: #5d7079;
   background-color: var(--color-content-secondary);
@@ -25,3 +32,7 @@
 .status-circle.success {
   background-color: var(--color-sentiment-positive);
 }
+.status-circle.positive .status-icon,
+.status-circle.success .status-icon {
+  color: var(--color-sentiment-positive-secondary);
+}

package/build/styles/stepper/Stepper.css

@@ -75,10 +75,3 @@
   transition: width 0.6s ease-in-out;
   will-change: width;
 }
-.btn-unstyled {
-  background: none;
-  border: none;
-  margin: 0;
-  padding: 0;
-  display: block;
-}

package/build/styles/summary/Summary.css

@@ -74,10 +74,6 @@
 .np-summary__action {
   margin-top: 4px;
   margin-top: var(--size-4);
-  font-size: 0.875rem;
-  font-size: var(--font-size-14);
-  font-weight: 600;
-  font-weight: var(--font-weight-semi-bold);
 }
 .np-summary + .np-summary {
   margin-top: 24px;

package/build/summary/Summary.js

@@ -32,7 +32,7 @@ require('../info/infoPresentations.js');
 var Info = require('../info/Info.js');
 var StatusIcon = require('../statusIcon/StatusIcon.js');
 var Summary_messages = require('./Summary.messages.js');
-var Action = require('../common/action/Action.js');
+var Link = require('../link/Link.js');
 
 /* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */
 const BadgeIcons = {
@@ -113,9 +113,13 @@ const Summary = ({
         type: typography.Typography.BODY_DEFAULT,
         className: `d-block text-overflow-wrap ${icon ? 'np-summary__description' : 'np-summary__description-icon'}`,
         children: description
-      }), action && /*#__PURE__*/jsxRuntime.jsx(Action.Action, {
-        action: action,
-        className: "np-summary__action"
+      }), action && /*#__PURE__*/jsxRuntime.jsx(Link.default, {
+        href: action.href,
+        target: action.target,
+        className: "np-summary__action",
+        "aria-label": action['aria-label'],
+        onClick: action.onClick,
+        children: action.text
       })]
     }), info && /*#__PURE__*/jsxRuntime.jsx(Info.default, {
       "aria-label": info['aria-label'],

package/build/summary/Summary.js.map

@@ -1 +1 @@
-{"version":3,"file":"Summary.js","sources":["../../src/summary/Summary.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */\nimport {\n  CheckCircleFill as CheckCircleIcon,\n  ClockFill as PendingCircleIcon,\n} from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ElementType, cloneElement, ReactNode } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../body';\nimport {\n  Status,\n  StatusDone,\n  StatusNotDone,\n  StatusPending,\n  Size,\n  Typography,\n  Sentiment,\n} from '../common';\nimport Info, { InfoProps } from '../info';\nimport StatusIcon from '../statusIcon';\n\nimport messages from './Summary.messages';\nimport { Action, ActionOptions } from '../common/action/Action';\n\nconst BadgeIcons = {\n  [Status.DONE]: CheckCircleIcon,\n  [Status.PENDING]: PendingCircleIcon,\n};\n\nconst statusLabels = {\n  [Status.NOT_DONE]: 'statusNotDone',\n  [Status.DONE]: 'statusDone',\n  [Status.PENDING]: 'statusPending',\n};\n\nconst statusMapping = {\n  [Status.DONE]: Sentiment.POSITIVE,\n  [Status.PENDING]: Sentiment.PENDING,\n};\n\nexport interface Props {\n  /**\n   * Action displayed at the bottom of the Summary\n   */\n  action?: ActionOptions;\n  /**\n   * Decides which html element should wrap the Summary\n   */\n  as?: ElementType;\n  /**\n   * Extra classes applied to Summary\n   */\n  className?: string;\n  /**\n   * @deprecated please use description instead\n   */\n  content?: ReactNode;\n  /**\n   * Summary description\n   */\n  description?: ReactNode;\n  /**\n   * @deprecated please use info instead\n   */\n  help?: {\n    content: ReactNode;\n    title?: ReactNode;\n  };\n  /**\n   * Infos displayed on help Icon click inside Popover or Modal\n   */\n  info?: Pick<InfoProps, 'aria-label' | 'content' | 'onClick' | 'presentation' | 'title'>;\n  /**\n   * @deprecated please use icon instead\n   */\n  illustration?: ReactNode;\n  /**\n   * Main Summary Icon\n   */\n  icon?: ReactNode;\n  /**\n   * Decides the badge applied to Icon\n   */\n  status?: StatusNotDone | StatusDone | StatusPending;\n  /**\n   * Summary title\n   */\n  title: ReactNode;\n}\n\nconst Summary = ({\n  action,\n  as: Element = 'div',\n  className,\n  content = null,\n  description = content,\n  help,\n  icon,\n  illustration = null,\n  info = help,\n  status,\n  title,\n}: Props) => {\n  const intl = useIntl();\n\n  let media = illustration;\n  if (icon) {\n    // @ts-expect-error if icon is present it has props and size prop\n    const iconSize = icon?.props?.size as number;\n\n    media =\n      iconSize !== 24\n        ? // @ts-expect-error we need icon to adjust it's size\n          cloneElement(icon, { size: 24 })\n        : icon;\n  }\n  // @ts-expect-error Badge can be null, this is handled in code\n  const Badge = status && BadgeIcons[status];\n\n  return (\n    <Element\n      className={clsx('np-summary d-flex align-items-start', className)}\n      // @ts-expect-error we check whether `status` is not null before index `statusLabels` and `messages`\n      aria-label={status && intl.formatMessage(messages[statusLabels[status]])}\n    >\n      {icon && (\n        <div className=\"np-summary__icon\">\n          {media}\n          {Badge && (\n            <div>\n              {/* @ts-expect-error it's okey to pass `undefined` into `sentiment` prop */}\n              <StatusIcon size={Size.SMALL} sentiment={statusMapping[status]} />\n            </div>\n          )}\n        </div>\n      )}\n      <div className={`np-summary__body ${icon ? 'm-l-2' : ''}`}>\n        <div className=\"np-summary__title d-flex\">\n          <Body\n            as=\"span\"\n            role=\"heading\"\n            aria-level={6}\n            type={Typography.BODY_LARGE_BOLD}\n            className=\"text-primary text-overflow-wrap m-b-1\"\n          >\n            {title}\n          </Body>\n          {info && (\n            <Info\n              aria-label={info['aria-label']}\n              className=\"m-l-1 hidden-xs\"\n              content={info.content}\n              presentation={info.presentation}\n              size={Size.LARGE}\n              title={info.title}\n              onClick={info.onClick}\n            />\n          )}\n        </div>\n\n        {description && (\n          <Body\n            as=\"span\"\n            type={Typography.BODY_DEFAULT}\n            className={`d-block text-overflow-wrap ${icon ? 'np-summary__description' : 'np-summary__description-icon'}`}\n          >\n            {description}\n          </Body>\n        )}\n        {action && <Action action={action} className=\"np-summary__action\" />}\n      </div>\n      {info && (\n        <Info\n          aria-label={info['aria-label']}\n          className=\"m-l-2 hidden-sm hidden-md hidden-lg hidden-xl\"\n          content={info.content}\n          presentation={info.presentation}\n          size={Size.LARGE}\n          title={info.title}\n          onClick={info.onClick}\n        />\n      )}\n    </Element>\n  );\n};\n\nexport default Summary;\n"],"names":["BadgeIcons","Status","DONE","CheckCircleIcon","PENDING","PendingCircleIcon","statusLabels","NOT_DONE","statusMapping","Sentiment","POSITIVE","Summary","action","as","Element","className","content","description","help","icon","illustration","info","status","title","intl","useIntl","media","iconSize","props","size","cloneElement","Badge","_jsxs","clsx","formatMessage","messages","children","_jsx","StatusIcon","Size","SMALL","sentiment","Body","role","type","Typography","BODY_LARGE_BOLD","Info","presentation","LARGE","onClick","BODY_DEFAULT","Action"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAyBA,MAAMA,UAAU,GAAG;AACjB,EAAA,CAACC,aAAM,CAACC,IAAI,GAAGC,qBAAe;EAC9B,CAACF,aAAM,CAACG,OAAO,GAAGC,eAAAA;CACnB,CAAA;AAED,MAAMC,YAAY,GAAG;AACnB,EAAA,CAACL,aAAM,CAACM,QAAQ,GAAG,eAAe;AAClC,EAAA,CAACN,aAAM,CAACC,IAAI,GAAG,YAAY;EAC3B,CAACD,aAAM,CAACG,OAAO,GAAG,eAAA;CACnB,CAAA;AAED,MAAMI,aAAa,GAAG;AACpB,EAAA,CAACP,aAAM,CAACC,IAAI,GAAGO,mBAAS,CAACC,QAAQ;AACjC,EAAA,CAACT,aAAM,CAACG,OAAO,GAAGK,mBAAS,CAACL,OAAAA;CAC7B,CAAA;AAoDKO,MAAAA,OAAO,GAAGA,CAAC;EACfC,MAAM;EACNC,EAAE,EAAEC,OAAO,GAAG,KAAK;EACnBC,SAAS;AACTC,EAAAA,OAAO,GAAG,IAAI;AACdC,EAAAA,WAAW,GAAGD,OAAO;EACrBE,IAAI;EACJC,IAAI;AACJC,EAAAA,YAAY,GAAG,IAAI;AACnBC,EAAAA,IAAI,GAAGH,IAAI;EACXI,MAAM;AACNC,EAAAA,KAAAA;AAAK,CACC,KAAI;AACV,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE,CAAA;EAEtB,IAAIC,KAAK,GAAGN,YAAY,CAAA;AACxB,EAAA,IAAID,IAAI,EAAE;AACR;AACA,IAAA,MAAMQ,QAAQ,GAAGR,IAAI,EAAES,KAAK,EAAEC,IAAc,CAAA;IAE5CH,KAAK,GACHC,QAAQ,KAAK,EAAE;AAAA;AACX;IACAG,kBAAY,CAACX,IAAI,EAAE;AAAEU,MAAAA,IAAI,EAAE,EAAA;KAAI,CAAC,GAChCV,IAAI,CAAA;AACZ,GAAA;AACA;AACA,EAAA,MAAMY,KAAK,GAAGT,MAAM,IAAItB,UAAU,CAACsB,MAAM,CAAC,CAAA;EAE1C,oBACEU,eAAA,CAAClB,OAAO,EAAA;AACNC,IAAAA,SAAS,EAAEkB,SAAI,CAAC,qCAAqC,EAAElB,SAAS,CAAA;AAChE;AAAA;AACA,IAAA,YAAA,EAAYO,MAAM,IAAIE,IAAI,CAACU,aAAa,CAACC,wBAAQ,CAAC7B,YAAY,CAACgB,MAAM,CAAC,CAAC,CAAE;IAAAc,QAAA,EAAA,CAExEjB,IAAI,iBACHa,eAAA,CAAA,KAAA,EAAA;AAAKjB,MAAAA,SAAS,EAAC,kBAAkB;AAAAqB,MAAAA,QAAA,EAC9BV,CAAAA,KAAK,EACLK,KAAK,iBACJM,cAAA,CAAA,KAAA,EAAA;QAAAD,QAAA,eAEEC,cAAA,CAACC,kBAAU,EAAA;UAACT,IAAI,EAAEU,SAAI,CAACC,KAAM;UAACC,SAAS,EAAEjC,aAAa,CAACc,MAAM,CAAA;SAC/D,CAAA;AAAA,OAAK,CACN,CAAA;KACE,CACN,eACDU,eAAA,CAAA,KAAA,EAAA;AAAKjB,MAAAA,SAAS,EAAE,CAAoBI,iBAAAA,EAAAA,IAAI,GAAG,OAAO,GAAG,EAAE,CAAG,CAAA;AAAAiB,MAAAA,QAAA,gBACxDJ,eAAA,CAAA,KAAA,EAAA;AAAKjB,QAAAA,SAAS,EAAC,0BAA0B;QAAAqB,QAAA,EAAA,cACvCC,cAAA,CAACK,YAAI,EAAA;AACH7B,UAAAA,EAAE,EAAC,MAAM;AACT8B,UAAAA,IAAI,EAAC,SAAS;AACd,UAAA,YAAA,EAAY,CAAE;UACdC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AACjC/B,UAAAA,SAAS,EAAC,uCAAuC;AAAAqB,UAAAA,QAAA,EAEhDb,KAAAA;AAAK,SACF,CACN,EAACF,IAAI,iBACHgB,cAAA,CAACU,YAAI,EAAA;UACH,YAAY1B,EAAAA,IAAI,CAAC,YAAY,CAAE;AAC/BN,UAAAA,SAAS,EAAC,iBAAiB;UAC3BC,OAAO,EAAEK,IAAI,CAACL,OAAQ;UACtBgC,YAAY,EAAE3B,IAAI,CAAC2B,YAAa;UAChCnB,IAAI,EAAEU,SAAI,CAACU,KAAM;UACjB1B,KAAK,EAAEF,IAAI,CAACE,KAAM;UAClB2B,OAAO,EAAE7B,IAAI,CAAC6B,OAAAA;AAAQ,SACtB,CACH,CAAA;AAAA,OACE,CAEL,EAACjC,WAAW,iBACVoB,cAAA,CAACK,YAAI,EAAA;AACH7B,QAAAA,EAAE,EAAC,MAAM;QACT+B,IAAI,EAAEC,qBAAU,CAACM,YAAa;AAC9BpC,QAAAA,SAAS,EAAE,CAA8BI,2BAAAA,EAAAA,IAAI,GAAG,yBAAyB,GAAG,8BAA8B,CAAG,CAAA;AAAAiB,QAAAA,QAAA,EAE5GnB,WAAAA;AAAW,OACR,CACP,EACAL,MAAM,iBAAIyB,cAAA,CAACe,aAAM,EAAA;AAACxC,QAAAA,MAAM,EAAEA,MAAO;AAACG,QAAAA,SAAS,EAAC,oBAAA;AAAoB,QAAG,CAAA;AAAA,KACjE,CACL,EAACM,IAAI,iBACHgB,cAAA,CAACU,YAAI,EAAA;MACH,YAAY1B,EAAAA,IAAI,CAAC,YAAY,CAAE;AAC/BN,MAAAA,SAAS,EAAC,+CAA+C;MACzDC,OAAO,EAAEK,IAAI,CAACL,OAAQ;MACtBgC,YAAY,EAAE3B,IAAI,CAAC2B,YAAa;MAChCnB,IAAI,EAAEU,SAAI,CAACU,KAAM;MACjB1B,KAAK,EAAEF,IAAI,CAACE,KAAM;MAClB2B,OAAO,EAAE7B,IAAI,CAAC6B,OAAAA;AAAQ,KACtB,CACH,CAAA;AAAA,GACM,CAAC,CAAA;AAEd;;;;"}
+{"version":3,"file":"Summary.js","sources":["../../src/summary/Summary.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */\nimport {\n  CheckCircleFill as CheckCircleIcon,\n  ClockFill as PendingCircleIcon,\n} from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ElementType, cloneElement, ReactNode } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../body';\nimport {\n  Status,\n  StatusDone,\n  StatusNotDone,\n  StatusPending,\n  Size,\n  Typography,\n  Sentiment,\n} from '../common';\nimport Info, { InfoProps } from '../info';\nimport StatusIcon from '../statusIcon';\n\nimport messages from './Summary.messages';\nimport Link from '../link';\nimport type { AlertAction } from '../alert';\n\nconst BadgeIcons = {\n  [Status.DONE]: CheckCircleIcon,\n  [Status.PENDING]: PendingCircleIcon,\n};\n\nconst statusLabels = {\n  [Status.NOT_DONE]: 'statusNotDone',\n  [Status.DONE]: 'statusDone',\n  [Status.PENDING]: 'statusPending',\n};\n\nconst statusMapping = {\n  [Status.DONE]: Sentiment.POSITIVE,\n  [Status.PENDING]: Sentiment.PENDING,\n};\n\nexport interface Props {\n  /**\n   * Action displayed at the bottom of the Summary\n   */\n  action?: AlertAction;\n  /**\n   * Decides which html element should wrap the Summary\n   */\n  as?: ElementType;\n  /**\n   * Extra classes applied to Summary\n   */\n  className?: string;\n  /**\n   * @deprecated please use description instead\n   */\n  content?: ReactNode;\n  /**\n   * Summary description\n   */\n  description?: ReactNode;\n  /**\n   * @deprecated please use info instead\n   */\n  help?: {\n    content: ReactNode;\n    title?: ReactNode;\n  };\n  /**\n   * Infos displayed on help Icon click inside Popover or Modal\n   */\n  info?: Pick<InfoProps, 'aria-label' | 'content' | 'onClick' | 'presentation' | 'title'>;\n  /**\n   * @deprecated please use icon instead\n   */\n  illustration?: ReactNode;\n  /**\n   * Main Summary Icon\n   */\n  icon?: ReactNode;\n  /**\n   * Decides the badge applied to Icon\n   */\n  status?: StatusNotDone | StatusDone | StatusPending;\n  /**\n   * Summary title\n   */\n  title: ReactNode;\n}\n\nconst Summary = ({\n  action,\n  as: Element = 'div',\n  className,\n  content = null,\n  description = content,\n  help,\n  icon,\n  illustration = null,\n  info = help,\n  status,\n  title,\n}: Props) => {\n  const intl = useIntl();\n\n  let media = illustration;\n  if (icon) {\n    // @ts-expect-error if icon is present it has props and size prop\n    const iconSize = icon?.props?.size as number;\n\n    media =\n      iconSize !== 24\n        ? // @ts-expect-error we need icon to adjust it's size\n          cloneElement(icon, { size: 24 })\n        : icon;\n  }\n  // @ts-expect-error Badge can be null, this is handled in code\n  const Badge = status && BadgeIcons[status];\n\n  return (\n    <Element\n      className={clsx('np-summary d-flex align-items-start', className)}\n      // @ts-expect-error we check whether `status` is not null before index `statusLabels` and `messages`\n      aria-label={status && intl.formatMessage(messages[statusLabels[status]])}\n    >\n      {icon && (\n        <div className=\"np-summary__icon\">\n          {media}\n          {Badge && (\n            <div>\n              {/* @ts-expect-error it's okey to pass `undefined` into `sentiment` prop */}\n              <StatusIcon size={Size.SMALL} sentiment={statusMapping[status]} />\n            </div>\n          )}\n        </div>\n      )}\n      <div className={`np-summary__body ${icon ? 'm-l-2' : ''}`}>\n        <div className=\"np-summary__title d-flex\">\n          <Body\n            as=\"span\"\n            role=\"heading\"\n            aria-level={6}\n            type={Typography.BODY_LARGE_BOLD}\n            className=\"text-primary text-overflow-wrap m-b-1\"\n          >\n            {title}\n          </Body>\n          {info && (\n            <Info\n              aria-label={info['aria-label']}\n              className=\"m-l-1 hidden-xs\"\n              content={info.content}\n              presentation={info.presentation}\n              size={Size.LARGE}\n              title={info.title}\n              onClick={info.onClick}\n            />\n          )}\n        </div>\n\n        {description && (\n          <Body\n            as=\"span\"\n            type={Typography.BODY_DEFAULT}\n            className={`d-block text-overflow-wrap ${icon ? 'np-summary__description' : 'np-summary__description-icon'}`}\n          >\n            {description}\n          </Body>\n        )}\n        {action && (\n          <Link\n            href={action.href}\n            target={action.target}\n            className=\"np-summary__action\"\n            aria-label={action['aria-label']}\n            onClick={action.onClick}\n          >\n            {action.text}\n          </Link>\n        )}\n      </div>\n      {info && (\n        <Info\n          aria-label={info['aria-label']}\n          className=\"m-l-2 hidden-sm hidden-md hidden-lg hidden-xl\"\n          content={info.content}\n          presentation={info.presentation}\n          size={Size.LARGE}\n          title={info.title}\n          onClick={info.onClick}\n        />\n      )}\n    </Element>\n  );\n};\n\nexport default Summary;\n"],"names":["BadgeIcons","Status","DONE","CheckCircleIcon","PENDING","PendingCircleIcon","statusLabels","NOT_DONE","statusMapping","Sentiment","POSITIVE","Summary","action","as","Element","className","content","description","help","icon","illustration","info","status","title","intl","useIntl","media","iconSize","props","size","cloneElement","Badge","_jsxs","clsx","formatMessage","messages","children","_jsx","StatusIcon","Size","SMALL","sentiment","Body","role","type","Typography","BODY_LARGE_BOLD","Info","presentation","LARGE","onClick","BODY_DEFAULT","Link","href","target","text"],"mappings":"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"}

package/build/summary/Summary.mjs

@@ -28,7 +28,7 @@ import '../info/infoPresentations.mjs';
 import Info from '../info/Info.mjs';
 import StatusIcon from '../statusIcon/StatusIcon.mjs';
 import messages from './Summary.messages.mjs';
-import { Action } from '../common/action/Action.mjs';
+import Link from '../link/Link.mjs';
 
 /* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */
 const BadgeIcons = {
@@ -109,9 +109,13 @@ const Summary = ({
         type: Typography.BODY_DEFAULT,
         className: `d-block text-overflow-wrap ${icon ? 'np-summary__description' : 'np-summary__description-icon'}`,
         children: description
-      }), action && /*#__PURE__*/jsx(Action, {
-        action: action,
-        className: "np-summary__action"
+      }), action && /*#__PURE__*/jsx(Link, {
+        href: action.href,
+        target: action.target,
+        className: "np-summary__action",
+        "aria-label": action['aria-label'],
+        onClick: action.onClick,
+        children: action.text
       })]
     }), info && /*#__PURE__*/jsx(Info, {
       "aria-label": info['aria-label'],

package/build/summary/Summary.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Summary.mjs","sources":["../../src/summary/Summary.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */\nimport {\n  CheckCircleFill as CheckCircleIcon,\n  ClockFill as PendingCircleIcon,\n} from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ElementType, cloneElement, ReactNode } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../body';\nimport {\n  Status,\n  StatusDone,\n  StatusNotDone,\n  StatusPending,\n  Size,\n  Typography,\n  Sentiment,\n} from '../common';\nimport Info, { InfoProps } from '../info';\nimport StatusIcon from '../statusIcon';\n\nimport messages from './Summary.messages';\nimport { Action, ActionOptions } from '../common/action/Action';\n\nconst BadgeIcons = {\n  [Status.DONE]: CheckCircleIcon,\n  [Status.PENDING]: PendingCircleIcon,\n};\n\nconst statusLabels = {\n  [Status.NOT_DONE]: 'statusNotDone',\n  [Status.DONE]: 'statusDone',\n  [Status.PENDING]: 'statusPending',\n};\n\nconst statusMapping = {\n  [Status.DONE]: Sentiment.POSITIVE,\n  [Status.PENDING]: Sentiment.PENDING,\n};\n\nexport interface Props {\n  /**\n   * Action displayed at the bottom of the Summary\n   */\n  action?: ActionOptions;\n  /**\n   * Decides which html element should wrap the Summary\n   */\n  as?: ElementType;\n  /**\n   * Extra classes applied to Summary\n   */\n  className?: string;\n  /**\n   * @deprecated please use description instead\n   */\n  content?: ReactNode;\n  /**\n   * Summary description\n   */\n  description?: ReactNode;\n  /**\n   * @deprecated please use info instead\n   */\n  help?: {\n    content: ReactNode;\n    title?: ReactNode;\n  };\n  /**\n   * Infos displayed on help Icon click inside Popover or Modal\n   */\n  info?: Pick<InfoProps, 'aria-label' | 'content' | 'onClick' | 'presentation' | 'title'>;\n  /**\n   * @deprecated please use icon instead\n   */\n  illustration?: ReactNode;\n  /**\n   * Main Summary Icon\n   */\n  icon?: ReactNode;\n  /**\n   * Decides the badge applied to Icon\n   */\n  status?: StatusNotDone | StatusDone | StatusPending;\n  /**\n   * Summary title\n   */\n  title: ReactNode;\n}\n\nconst Summary = ({\n  action,\n  as: Element = 'div',\n  className,\n  content = null,\n  description = content,\n  help,\n  icon,\n  illustration = null,\n  info = help,\n  status,\n  title,\n}: Props) => {\n  const intl = useIntl();\n\n  let media = illustration;\n  if (icon) {\n    // @ts-expect-error if icon is present it has props and size prop\n    const iconSize = icon?.props?.size as number;\n\n    media =\n      iconSize !== 24\n        ? // @ts-expect-error we need icon to adjust it's size\n          cloneElement(icon, { size: 24 })\n        : icon;\n  }\n  // @ts-expect-error Badge can be null, this is handled in code\n  const Badge = status && BadgeIcons[status];\n\n  return (\n    <Element\n      className={clsx('np-summary d-flex align-items-start', className)}\n      // @ts-expect-error we check whether `status` is not null before index `statusLabels` and `messages`\n      aria-label={status && intl.formatMessage(messages[statusLabels[status]])}\n    >\n      {icon && (\n        <div className=\"np-summary__icon\">\n          {media}\n          {Badge && (\n            <div>\n              {/* @ts-expect-error it's okey to pass `undefined` into `sentiment` prop */}\n              <StatusIcon size={Size.SMALL} sentiment={statusMapping[status]} />\n            </div>\n          )}\n        </div>\n      )}\n      <div className={`np-summary__body ${icon ? 'm-l-2' : ''}`}>\n        <div className=\"np-summary__title d-flex\">\n          <Body\n            as=\"span\"\n            role=\"heading\"\n            aria-level={6}\n            type={Typography.BODY_LARGE_BOLD}\n            className=\"text-primary text-overflow-wrap m-b-1\"\n          >\n            {title}\n          </Body>\n          {info && (\n            <Info\n              aria-label={info['aria-label']}\n              className=\"m-l-1 hidden-xs\"\n              content={info.content}\n              presentation={info.presentation}\n              size={Size.LARGE}\n              title={info.title}\n              onClick={info.onClick}\n            />\n          )}\n        </div>\n\n        {description && (\n          <Body\n            as=\"span\"\n            type={Typography.BODY_DEFAULT}\n            className={`d-block text-overflow-wrap ${icon ? 'np-summary__description' : 'np-summary__description-icon'}`}\n          >\n            {description}\n          </Body>\n        )}\n        {action && <Action action={action} className=\"np-summary__action\" />}\n      </div>\n      {info && (\n        <Info\n          aria-label={info['aria-label']}\n          className=\"m-l-2 hidden-sm hidden-md hidden-lg hidden-xl\"\n          content={info.content}\n          presentation={info.presentation}\n          size={Size.LARGE}\n          title={info.title}\n          onClick={info.onClick}\n        />\n      )}\n    </Element>\n  );\n};\n\nexport default Summary;\n"],"names":["BadgeIcons","Status","DONE","CheckCircleIcon","PENDING","PendingCircleIcon","statusLabels","NOT_DONE","statusMapping","Sentiment","POSITIVE","Summary","action","as","Element","className","content","description","help","icon","illustration","info","status","title","intl","useIntl","media","iconSize","props","size","cloneElement","Badge","_jsxs","clsx","formatMessage","messages","children","_jsx","StatusIcon","Size","SMALL","sentiment","Body","role","type","Typography","BODY_LARGE_BOLD","Info","presentation","LARGE","onClick","BODY_DEFAULT","Action"],"mappings":"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"}
+{"version":3,"file":"Summary.mjs","sources":["../../src/summary/Summary.tsx"],"sourcesContent":["/* eslint-disable @typescript-eslint/no-unsafe-member-access, @typescript-eslint/no-unsafe-assignment */\nimport {\n  CheckCircleFill as CheckCircleIcon,\n  ClockFill as PendingCircleIcon,\n} from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ElementType, cloneElement, ReactNode } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport Body from '../body';\nimport {\n  Status,\n  StatusDone,\n  StatusNotDone,\n  StatusPending,\n  Size,\n  Typography,\n  Sentiment,\n} from '../common';\nimport Info, { InfoProps } from '../info';\nimport StatusIcon from '../statusIcon';\n\nimport messages from './Summary.messages';\nimport Link from '../link';\nimport type { AlertAction } from '../alert';\n\nconst BadgeIcons = {\n  [Status.DONE]: CheckCircleIcon,\n  [Status.PENDING]: PendingCircleIcon,\n};\n\nconst statusLabels = {\n  [Status.NOT_DONE]: 'statusNotDone',\n  [Status.DONE]: 'statusDone',\n  [Status.PENDING]: 'statusPending',\n};\n\nconst statusMapping = {\n  [Status.DONE]: Sentiment.POSITIVE,\n  [Status.PENDING]: Sentiment.PENDING,\n};\n\nexport interface Props {\n  /**\n   * Action displayed at the bottom of the Summary\n   */\n  action?: AlertAction;\n  /**\n   * Decides which html element should wrap the Summary\n   */\n  as?: ElementType;\n  /**\n   * Extra classes applied to Summary\n   */\n  className?: string;\n  /**\n   * @deprecated please use description instead\n   */\n  content?: ReactNode;\n  /**\n   * Summary description\n   */\n  description?: ReactNode;\n  /**\n   * @deprecated please use info instead\n   */\n  help?: {\n    content: ReactNode;\n    title?: ReactNode;\n  };\n  /**\n   * Infos displayed on help Icon click inside Popover or Modal\n   */\n  info?: Pick<InfoProps, 'aria-label' | 'content' | 'onClick' | 'presentation' | 'title'>;\n  /**\n   * @deprecated please use icon instead\n   */\n  illustration?: ReactNode;\n  /**\n   * Main Summary Icon\n   */\n  icon?: ReactNode;\n  /**\n   * Decides the badge applied to Icon\n   */\n  status?: StatusNotDone | StatusDone | StatusPending;\n  /**\n   * Summary title\n   */\n  title: ReactNode;\n}\n\nconst Summary = ({\n  action,\n  as: Element = 'div',\n  className,\n  content = null,\n  description = content,\n  help,\n  icon,\n  illustration = null,\n  info = help,\n  status,\n  title,\n}: Props) => {\n  const intl = useIntl();\n\n  let media = illustration;\n  if (icon) {\n    // @ts-expect-error if icon is present it has props and size prop\n    const iconSize = icon?.props?.size as number;\n\n    media =\n      iconSize !== 24\n        ? // @ts-expect-error we need icon to adjust it's size\n          cloneElement(icon, { size: 24 })\n        : icon;\n  }\n  // @ts-expect-error Badge can be null, this is handled in code\n  const Badge = status && BadgeIcons[status];\n\n  return (\n    <Element\n      className={clsx('np-summary d-flex align-items-start', className)}\n      // @ts-expect-error we check whether `status` is not null before index `statusLabels` and `messages`\n      aria-label={status && intl.formatMessage(messages[statusLabels[status]])}\n    >\n      {icon && (\n        <div className=\"np-summary__icon\">\n          {media}\n          {Badge && (\n            <div>\n              {/* @ts-expect-error it's okey to pass `undefined` into `sentiment` prop */}\n              <StatusIcon size={Size.SMALL} sentiment={statusMapping[status]} />\n            </div>\n          )}\n        </div>\n      )}\n      <div className={`np-summary__body ${icon ? 'm-l-2' : ''}`}>\n        <div className=\"np-summary__title d-flex\">\n          <Body\n            as=\"span\"\n            role=\"heading\"\n            aria-level={6}\n            type={Typography.BODY_LARGE_BOLD}\n            className=\"text-primary text-overflow-wrap m-b-1\"\n          >\n            {title}\n          </Body>\n          {info && (\n            <Info\n              aria-label={info['aria-label']}\n              className=\"m-l-1 hidden-xs\"\n              content={info.content}\n              presentation={info.presentation}\n              size={Size.LARGE}\n              title={info.title}\n              onClick={info.onClick}\n            />\n          )}\n        </div>\n\n        {description && (\n          <Body\n            as=\"span\"\n            type={Typography.BODY_DEFAULT}\n            className={`d-block text-overflow-wrap ${icon ? 'np-summary__description' : 'np-summary__description-icon'}`}\n          >\n            {description}\n          </Body>\n        )}\n        {action && (\n          <Link\n            href={action.href}\n            target={action.target}\n            className=\"np-summary__action\"\n            aria-label={action['aria-label']}\n            onClick={action.onClick}\n          >\n            {action.text}\n          </Link>\n        )}\n      </div>\n      {info && (\n        <Info\n          aria-label={info['aria-label']}\n          className=\"m-l-2 hidden-sm hidden-md hidden-lg hidden-xl\"\n          content={info.content}\n          presentation={info.presentation}\n          size={Size.LARGE}\n          title={info.title}\n          onClick={info.onClick}\n        />\n      )}\n    </Element>\n  );\n};\n\nexport default Summary;\n"],"names":["BadgeIcons","Status","DONE","CheckCircleIcon","PENDING","PendingCircleIcon","statusLabels","NOT_DONE","statusMapping","Sentiment","POSITIVE","Summary","action","as","Element","className","content","description","help","icon","illustration","info","status","title","intl","useIntl","media","iconSize","props","size","cloneElement","Badge","_jsxs","clsx","formatMessage","messages","children","_jsx","StatusIcon","Size","SMALL","sentiment","Body","role","type","Typography","BODY_LARGE_BOLD","Info","presentation","LARGE","onClick","BODY_DEFAULT","Link","href","target","text"],"mappings":"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"}

package/build/types/alert/Alert.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/alert/Alert.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAe,SAAS,EAAE,IAAI,EAAwC,MAAM,WAAW,CAAC;AAS/F,MAAM,MAAM,WAAW,GAAG;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,kDAAkD;AAClD,KAAK,mBAAmB,GAAG,GAAG,SAAS,CAAC,OAAO,GAAG,SAAS,CAAC,IAAI,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC;AACrF,KAAK,iBAAiB,GAAG,GACrB,SAAS,CAAC,QAAQ,GAClB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,QAAQ,EAAE,CAAC;AACzB,MAAM,MAAM,SAAS,GAAG,iBAAiB,GAAG,mBAAmB,CAAC;AAEhE,oBAAY,kBAAkB;IAC5B,QAAQ,YAAY;IACpB,GAAG,cAAc;IACjB,SAAS,aAAa;IACtB,WAAW,cAAc;IACzB,MAAM,gBAAgB;IACtB,YAAY,eAAe;CAC5B;AAED,MAAM,WAAW,UAAU;IACzB,yIAAyI;IACzI,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wGAAwG;IACxG,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;SAGK;IACL,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kGAAkG;IAClG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACvD,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAChC,oHAAoH;IACpH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,2CAA2C;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC;CAClB;AAeD,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,MAAM,EACN,SAAS,EACT,IAAI,EACJ,eAAe,EACf,SAAS,EACT,OAAO,EACP,KAAK,EACL,IAAgB,EAChB,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,WAAW,GACZ,EAAE,UAAU,+BAuHZ"}
+{"version":3,"file":"Alert.d.ts","sourceRoot":"","sources":["../../../src/alert/Alert.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAe,SAAS,EAAE,IAAI,EAAwC,MAAM,WAAW,CAAC;AAU/F,MAAM,MAAM,WAAW,GAAG;IACxB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,KAAK,CAAC,SAAS,CAAC;IACtB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,kDAAkD;AAClD,KAAK,mBAAmB,GAAG,GAAG,SAAS,CAAC,OAAO,GAAG,SAAS,CAAC,IAAI,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC;AACrF,KAAK,iBAAiB,GAAG,GACrB,SAAS,CAAC,QAAQ,GAClB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,OAAO,GACjB,SAAS,CAAC,QAAQ,EAAE,CAAC;AACzB,MAAM,MAAM,SAAS,GAAG,iBAAiB,GAAG,mBAAmB,CAAC;AAEhE,oBAAY,kBAAkB;IAC5B,QAAQ,YAAY;IACpB,GAAG,cAAc;IACjB,SAAS,aAAa;IACtB,WAAW,cAAc;IACzB,MAAM,gBAAgB;IACtB,YAAY,eAAe;CAC5B;AAED,MAAM,WAAW,UAAU;IACzB,yIAAyI;IACzI,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wGAAwG;IACxG,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB;;;SAGK;IACL,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,oCAAoC;IACpC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kGAAkG;IAClG,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,4FAA4F;IAC5F,SAAS,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;IACvD,2DAA2D;IAC3D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,GAAG,kBAAkB,EAAE,CAAC;IAChC,oHAAoH;IACpH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,2CAA2C;IAC3C,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,2FAA2F;IAC3F,IAAI,CAAC,EAAE,GAAG,IAAI,EAAE,CAAC;CAClB;AAeD,MAAM,CAAC,OAAO,UAAU,KAAK,CAAC,EAC5B,MAAM,EACN,SAAS,EACT,IAAI,EACJ,eAAe,EACf,SAAS,EACT,OAAO,EACP,KAAK,EACL,IAAgB,EAChB,KAAK,EACL,QAAQ,EACR,IAAI,EACJ,WAAW,GACZ,EAAE,UAAU,+BAuIZ"}

package/build/types/link/Link.d.ts

@@ -1,6 +1,6 @@
-import type { PrimitiveAnchorProps } from '../primitives';
+import type { PrimitiveAnchorProps, PrimitiveButtonProps } from '../primitives';
 import { LinkLarge, LinkDefault } from '../common';
-export type Props = PrimitiveAnchorProps & {
+export type Props = PrimitiveAnchorProps & Pick<PrimitiveButtonProps, 'onClick'> & {
     type?: LinkLarge | LinkDefault;
 };
 /**

package/build/types/link/Link.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/link/Link.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAE1D,OAAO,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAInD,MAAM,MAAM,KAAK,GAAG,oBAAoB,GAAG;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;CAAE,CAAC;AAE9E;;;;GAIG;AACH,QAAA,MAAM,IAAI,4FASP,KAAK,gCA0BP,CAAC;AAEF,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Link.d.ts","sourceRoot":"","sources":["../../../src/link/Link.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,oBAAoB,EAAE,oBAAoB,EAAE,MAAM,eAAe,CAAC;AAEhF,OAAO,EAAE,SAAS,EAAE,WAAW,EAAc,MAAM,WAAW,CAAC;AAI/D,MAAM,MAAM,KAAK,GAAG,oBAAoB,GACtC,IAAI,CAAC,oBAAoB,EAAE,SAAS,CAAC,GAAG;IAAE,IAAI,CAAC,EAAE,SAAS,GAAG,WAAW,CAAA;CAAE,CAAC;AAE7E;;;;GAIG;AACH,QAAA,MAAM,IAAI,4FASP,KAAK,gCAoCP,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/build/types/nudge/Nudge.d.ts

@@ -1,6 +1,6 @@
 import { Assets } from '@wise/art';
 import { ReactNode, MouseEvent } from 'react';
-import { ActionOptions } from '../common/action/Action';
+import type { AlertAction } from '../alert';
 export declare const STORAGE_NAME = "dismissedNudges";
 type MediaNameType = `${Assets.GLOBE}` | `${Assets.LOCK}` | `${Assets.WALLET}` | `${Assets.GEAR}` | `${Assets.INVITE_LETTER}` | `${Assets.PERSONAL_CARD}` | `${Assets.BUSINESS_CARD}` | `${Assets.HEART}` | `${Assets.MULTI_CURRENCY}` | `${Assets.SHOPPING_BAG}` | `${Assets.FLOWER}`;
 type BaseProps = {
@@ -15,7 +15,7 @@ type BaseProps = {
     /** Fired when the user clicks on close button */
     onDismiss?: () => void;
     /** An optional call to action to sit under the main body of the nudge. If your label is short, use aria-label to provide more context */
-    action?: ActionOptions;
+    action?: AlertAction;
     className?: string;
 };
 export interface OptionalId extends BaseProps {

package/build/types/nudge/Nudge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Nudge.d.ts","sourceRoot":"","sources":["../../../src/nudge/Nudge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,MAAM,EAAqB,MAAM,WAAW,CAAC;AAEpE,OAAO,EAAE,SAAS,EAAuB,UAAU,EAAE,MAAM,OAAO,CAAC;AAMnE,OAAO,EAAU,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAGhE,eAAO,MAAM,YAAY,oBAAoB,CAAC;AAkB9C,KAAK,aAAa,GACd,GAAG,MAAM,CAAC,KAAK,EAAE,GACjB,GAAG,MAAM,CAAC,IAAI,EAAE,GAChB,GAAG,MAAM,CAAC,MAAM,EAAE,GAClB,GAAG,MAAM,CAAC,IAAI,EAAE,GAChB,GAAG,MAAM,CAAC,aAAa,EAAE,GACzB,GAAG,MAAM,CAAC,aAAa,EAAE,GACzB,GAAG,MAAM,CAAC,aAAa,EAAE,GACzB,GAAG,MAAM,CAAC,KAAK,EAAE,GACjB,GAAG,MAAM,CAAC,cAAc,EAAE,GAC1B,GAAG,MAAM,CAAC,YAAY,EAAE,GACxB,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC;AAEvB,KAAK,SAAS,GAAG;IACf,mDAAmD;IACnD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB;IAClB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IACxD,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,yIAAyI;IACzI,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,gBAAgB,CAAC,EAAE,KAAK,CAAC;IACzB,qBAAqB,CAAC,EAAE,SAAS,CAAC;CACnC;AAED,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,2IAA2I;IAC3I,EAAE,EAAE,MAAM,CAAC;IACX,yFAAyF;IACzF,gBAAgB,EAAE,IAAI,CAAC;IACvB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD;AAED,MAAM,MAAM,KAAK,GAAG,UAAU,GAAG,oBAAoB,CAAC;AAEtD,QAAA,MAAM,KAAK,iIAaR,KAAK,uCA+EP,CAAC;AAEF,eAAe,KAAK,CAAC"}
+{"version":3,"file":"Nudge.d.ts","sourceRoot":"","sources":["../../../src/nudge/Nudge.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAgB,MAAM,EAAqB,MAAM,WAAW,CAAC;AAEpE,OAAO,EAAE,SAAS,EAAuB,UAAU,EAAE,MAAM,OAAO,CAAC;AAMnE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAG5C,eAAO,MAAM,YAAY,oBAAoB,CAAC;AAkB9C,KAAK,aAAa,GACd,GAAG,MAAM,CAAC,KAAK,EAAE,GACjB,GAAG,MAAM,CAAC,IAAI,EAAE,GAChB,GAAG,MAAM,CAAC,MAAM,EAAE,GAClB,GAAG,MAAM,CAAC,IAAI,EAAE,GAChB,GAAG,MAAM,CAAC,aAAa,EAAE,GACzB,GAAG,MAAM,CAAC,aAAa,EAAE,GACzB,GAAG,MAAM,CAAC,aAAa,EAAE,GACzB,GAAG,MAAM,CAAC,KAAK,EAAE,GACjB,GAAG,MAAM,CAAC,cAAc,EAAE,GAC1B,GAAG,MAAM,CAAC,YAAY,EAAE,GACxB,GAAG,MAAM,CAAC,MAAM,EAAE,CAAC;AAEvB,KAAK,SAAS,GAAG;IACf,mDAAmD;IACnD,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kBAAkB;IAClB,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B,KAAK,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC,eAAe,CAAC,KAAK,IAAI,CAAC;IACxD,iDAAiD;IACjD,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,yIAAyI;IACzI,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,WAAW,UAAW,SAAQ,SAAS;IAC3C,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,gBAAgB,CAAC,EAAE,KAAK,CAAC;IACzB,qBAAqB,CAAC,EAAE,SAAS,CAAC;CACnC;AAED,MAAM,WAAW,oBAAqB,SAAQ,SAAS;IACrD,2IAA2I;IAC3I,EAAE,EAAE,MAAM,CAAC;IACX,yFAAyF;IACzF,gBAAgB,EAAE,IAAI,CAAC;IACvB;;;;OAIG;IACH,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD;AAED,MAAM,MAAM,KAAK,GAAG,UAAU,GAAG,oBAAoB,CAAC;AAEtD,QAAA,MAAM,KAAK,iIAaR,KAAK,uCA2FP,CAAC;AAEF,eAAe,KAAK,CAAC"}

package/build/types/summary/Summary.d.ts

@@ -1,12 +1,12 @@
 import { ElementType, ReactNode } from 'react';
 import { StatusDone, StatusNotDone, StatusPending } from '../common';
 import { InfoProps } from '../info';
-import { ActionOptions } from '../common/action/Action';
+import type { AlertAction } from '../alert';
 export interface Props {
     /**
      * Action displayed at the bottom of the Summary
      */
-    action?: ActionOptions;
+    action?: AlertAction;
     /**
      * Decides which html element should wrap the Summary
      */

package/build/types/summary/Summary.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Summary.d.ts","sourceRoot":"","sources":["../../../src/summary/Summary.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,OAAO,EAEL,UAAU,EACV,aAAa,EACb,aAAa,EAId,MAAM,WAAW,CAAC;AACnB,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAI1C,OAAO,EAAU,aAAa,EAAE,MAAM,yBAAyB,CAAC;AAkBhE,MAAM,WAAW,KAAK;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB;;OAEG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE;QACL,OAAO,EAAE,SAAS,CAAC;QACnB,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,OAAO,CAAC,CAAC;IACxF;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,GAAG,UAAU,GAAG,aAAa,CAAC;IACpD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,QAAA,MAAM,OAAO,6GAYV,KAAK,gCAkFP,CAAC;AAEF,eAAe,OAAO,CAAC"}
+{"version":3,"file":"Summary.d.ts","sourceRoot":"","sources":["../../../src/summary/Summary.tsx"],"names":[],"mappings":"AAMA,OAAO,EAAE,WAAW,EAAgB,SAAS,EAAE,MAAM,OAAO,CAAC;AAI7D,OAAO,EAEL,UAAU,EACV,aAAa,EACb,aAAa,EAId,MAAM,WAAW,CAAC;AACnB,OAAa,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;AAK1C,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAkB5C,MAAM,WAAW,KAAK;IACpB;;OAEG;IACH,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB;;OAEG;IACH,EAAE,CAAC,EAAE,WAAW,CAAC;IACjB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,IAAI,CAAC,EAAE;QACL,OAAO,EAAE,SAAS,CAAC;QACnB,KAAK,CAAC,EAAE,SAAS,CAAC;KACnB,CAAC;IACF;;OAEG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,OAAO,CAAC,CAAC;IACxF;;OAEG;IACH,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB;;OAEG;IACH,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,MAAM,CAAC,EAAE,aAAa,GAAG,UAAU,GAAG,aAAa,CAAC;IACpD;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;CAClB;AAED,QAAA,MAAM,OAAO,6GAYV,KAAK,gCA4FP,CAAC;AAEF,eAAe,OAAO,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@transferwise/components",
-  "version": "46.95.2",
+  "version": "46.96.1",
   "description": "Neptune React components",
   "license": "Apache-2.0",
   "repository": {
@@ -95,13 +95,13 @@
     "rollup-preserve-directives": "^1.1.1",
     "storybook": "^8.2.2",
     "@transferwise/less-config": "3.1.1",
-    "@transferwise/neptune-css": "14.24.1",
+    "@transferwise/neptune-css": "14.24.3",
     "@wise/components-theming": "1.6.2",
     "@wise/wds-configs": "0.0.0"
   },
   "peerDependencies": {
     "@transferwise/icons": "^3.20.0",
-    "@transferwise/neptune-css": "^14.9.6",
+    "@transferwise/neptune-css": "^14.24",
     "@wise/art": "^2.16",
     "@wise/components-theming": "^1.0.0",
     "react": ">=18",