@transferwise/components 46.133.1 → 46.135.0

package/build/flowNavigation/FlowNavigation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"FlowNavigation.mjs","sources":["../../src/flowNavigation/FlowNavigation.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\n\nimport { Breakpoint, Layout } from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport FlowHeader from '../common/flowHeader/FlowHeader';\nimport Logo from '../logo';\nimport Stepper, { type Step } from '../stepper/Stepper';\n\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport messages from './FlowNavigation.messages';\nimport AnimatedLabel from './animatedLabel';\nimport IconButton from '../iconButton';\nimport { ArrowLeft } from '@transferwise/icons';\n\nexport interface FlowNavigationProps {\n  /** @default 0 */\n  activeStep?: number;\n  avatar?: React.ReactNode;\n  /** @default <Logo /> */\n  logo?: React.ReactNode;\n  /** @default false */\n  done?: boolean;\n  /** Called when the close button is clicked. If not provided the close button won't show */\n  onClose?: () => void;\n  /** Called when the back button is clicked. If not provided the back button won't show. The back button only shows on small screens */\n  onGoBack?: () => void;\n  /** Steps to be displayed in stepper. If you don't need the stepper, please use OverlayHeader instead */\n  steps: readonly Step[];\n}\n\nconst FlowNavigation = ({\n  activeStep = 0,\n  avatar,\n  logo = <Logo />,\n  done = false,\n  onClose,\n  onGoBack,\n  steps,\n}: FlowNavigationProps) => {\n  const intl = useIntl();\n\n  const closeButton = onClose != null && <CloseButton size=\"lg\" onClick={onClose} />;\n\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n  const screenLg = useScreenSize(Breakpoint.LARGE);\n\n  const newAvatar = done ? null : avatar;\n\n  const displayGoBack = onGoBack != null && activeStep > 0;\n\n  return (\n    <div\n      className={clsx('np-flow-navigation d-flex align-items-center justify-content-center p-y-3', {\n        'np-flow-navigation--border-bottom': !done,\n      })}\n    >\n      <FlowHeader\n        className={clsx(\n          'np-flow-navigation__content p-x-3',\n          screenSm == null\n            ? 'np-flow-navigation--hidden'\n            : {\n                'np-flow-navigation--xs-max': !screenSm,\n                // Size switches on parent container which may or may not have the same size as the window.\n                'np-flow-navigation--sm': screenSm,\n                'np-flow-navigation--lg': screenLg,\n              },\n        )}\n        leftContent={\n          <>\n            {!screenSm && displayGoBack ? (\n              <IconButton\n                size={40}\n                priority=\"tertiary\"\n                type=\"default\"\n                aria-label={intl.formatMessage(messages.back)}\n                onClick={onGoBack}\n              >\n                <ArrowLeft />\n              </IconButton>\n            ) : (\n              <div className=\"np-flow-header__left\">{logo}</div>\n            )}\n            {!screenSm && !done && (\n              <AnimatedLabel className=\"m-x-1\" steps={steps} activeLabel={activeStep} />\n            )}\n          </>\n        }\n        rightContent={\n          <div className=\"np-flow-header__right d-flex align-items-center justify-content-end order-2--lg\">\n            {newAvatar}\n            {newAvatar && closeButton && <span className=\"m-x-1\" />}\n            {closeButton}\n          </div>\n        }\n        bottomContent={\n          !done &&\n          (steps.length > 0 ? (\n            <Stepper\n              activeStep={activeStep}\n              steps={steps}\n              className={clsx('np-flow-navigation__stepper')}\n            />\n          ) : (\n            <div className=\"np-flow-navigation__stepper\" />\n          ))\n        }\n        layout={!screenLg ? Layout.VERTICAL : Layout.HORIZONTAL}\n      />\n    </div>\n  );\n};\n\nexport default FlowNavigation;\n"],"names":["FlowNavigation","activeStep","avatar","logo","_jsx","Logo","done","onClose","onGoBack","steps","intl","useIntl","closeButton","CloseButton","size","onClick","screenSm","useScreenSize","Breakpoint","SMALL","screenLg","LARGE","newAvatar","displayGoBack","className","clsx","children","FlowHeader","leftContent","_jsxs","_Fragment","IconButton","priority","type","formatMessage","messages","back","ArrowLeft","AnimatedLabel","activeLabel","rightContent","bottomContent","length","Stepper","layout","Layout","VERTICAL","HORIZONTAL"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+BA,MAAMA,cAAc,GAAGA,CAAC;AACtBC,EAAAA,UAAU,GAAG,CAAC;EACdC,MAAM;AACNC,EAAAA,IAAI,gBAAGC,GAAA,CAACC,IAAI,IAAA,CAAG;AACfC,EAAAA,IAAI,GAAG,KAAK;EACZC,OAAO;EACPC,QAAQ;AACRC,EAAAA;AAAK,CACe,KAAI;AACxB,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;EAEtB,MAAMC,WAAW,GAAGL,OAAO,IAAI,IAAI,iBAAIH,GAAA,CAACS,WAAW,EAAA;AAACC,IAAAA,IAAI,EAAC,IAAI;AAACC,IAAAA,OAAO,EAAER;AAAQ,IAAG;AAElF,EAAA,MAAMS,QAAQ,GAAGC,aAAa,CAACC,UAAU,CAACC,KAAK,CAAC;AAChD,EAAA,MAAMC,QAAQ,GAAGH,aAAa,CAACC,UAAU,CAACG,KAAK,CAAC;AAEhD,EAAA,MAAMC,SAAS,GAAGhB,IAAI,GAAG,IAAI,GAAGJ,MAAM;EAEtC,MAAMqB,aAAa,GAAGf,QAAQ,IAAI,IAAI,IAAIP,UAAU,GAAG,CAAC;AAExD,EAAA,oBACEG,GAAA,CAAA,KAAA,EAAA;AACEoB,IAAAA,SAAS,EAAEC,IAAI,CAAC,2EAA2E,EAAE;AAC3F,MAAA,mCAAmC,EAAE,CAACnB;AACvC,KAAA,CAAE;IAAAoB,QAAA,eAEHtB,GAAA,CAACuB,UAAU,EAAA;MACTH,SAAS,EAAEC,IAAI,CACb,mCAAmC,EACnCT,QAAQ,IAAI,IAAI,GACZ,4BAA4B,GAC5B;QACE,4BAA4B,EAAE,CAACA,QAAQ;AACvC;AACA,QAAA,wBAAwB,EAAEA,QAAQ;AAClC,QAAA,wBAAwB,EAAEI;AAC3B,OAAA,CACL;MACFQ,WAAW,eACTC,IAAA,CAAAC,QAAA,EAAA;QAAAJ,QAAA,EAAA,CACG,CAACV,QAAQ,IAAIO,aAAa,gBACzBnB,GAAA,CAAC2B,UAAU,EAAA;AACTjB,UAAAA,IAAI,EAAE,EAAG;AACTkB,UAAAA,QAAQ,EAAC,UAAU;AACnBC,UAAAA,IAAI,EAAC,SAAS;AACd,UAAA,YAAA,EAAYvB,IAAI,CAACwB,aAAa,CAACC,QAAQ,CAACC,IAAI,CAAE;AAC9CrB,UAAAA,OAAO,EAAEP,QAAS;AAAAkB,UAAAA,QAAA,eAElBtB,GAAA,CAACiC,SAAS,EAAA,EAAA;SACA,CAAC,gBAEbjC,GAAA,CAAA,KAAA,EAAA;AAAKoB,UAAAA,SAAS,EAAC,sBAAsB;AAAAE,UAAAA,QAAA,EAAEvB;SAAU,CAClD,EACA,CAACa,QAAQ,IAAI,CAACV,IAAI,iBACjBF,GAAA,CAACkC,aAAa,EAAA;AAACd,UAAAA,SAAS,EAAC,OAAO;AAACf,UAAAA,KAAK,EAAEA,KAAM;AAAC8B,UAAAA,WAAW,EAAEtC;AAAW,SAAA,CACxE;AAAA,OACH,CACD;AACDuC,MAAAA,YAAY,eACVX,IAAA,CAAA,KAAA,EAAA;AAAKL,QAAAA,SAAS,EAAC,iFAAiF;AAAAE,QAAAA,QAAA,GAC7FJ,SAAS,EACTA,SAAS,IAAIV,WAAW,iBAAIR,GAAA,CAAA,MAAA,EAAA;AAAMoB,UAAAA,SAAS,EAAC;SAAO,CAAG,EACtDZ,WAAW;AAAA,OACT,CACN;AACD6B,MAAAA,aAAa,EACX,CAACnC,IAAI,KACJG,KAAK,CAACiC,MAAM,GAAG,CAAC,gBACftC,GAAA,CAACuC,OAAO,EAAA;AACN1C,QAAAA,UAAU,EAAEA,UAAW;AACvBQ,QAAAA,KAAK,EAAEA,KAAM;QACbe,SAAS,EAAEC,IAAI,CAAC,6BAA6B;OAAE,CAC/C,gBAEFrB,GAAA,CAAA,KAAA,EAAA;AAAKoB,QAAAA,SAAS,EAAC;AAA6B,OAAA,CAC7C,CACF;MACDoB,MAAM,EAAE,CAACxB,QAAQ,GAAGyB,MAAM,CAACC,QAAQ,GAAGD,MAAM,CAACE;KAAW;AAE5D,GAAK,CAAC;AAEV;;;;"}
+{"version":3,"file":"FlowNavigation.mjs","sources":["../../src/flowNavigation/FlowNavigation.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\n\nimport { Breakpoint, Layout } from '../common';\nimport { CloseButton } from '../common/closeButton';\nimport FlowHeader from '../common/flowHeader/FlowHeader';\nimport Logo from '../logo';\nimport Stepper, { type Step } from '../stepper/Stepper';\n\nimport { useScreenSize } from '../common/hooks/useScreenSize';\nimport messages from './FlowNavigation.messages';\nimport AnimatedLabel from './animatedLabel';\nimport IconButton from '../iconButton';\nimport { ArrowLeft } from '@transferwise/icons';\n\nexport interface FlowNavigationProps {\n  /** @default 0 */\n  activeStep?: number;\n  avatar?: React.ReactNode;\n  /** @default <Logo /> */\n  logo?: React.ReactNode;\n  /** @default false */\n  done?: boolean;\n  /** Called when the close button is clicked. If not provided the close button won't show */\n  onClose?: () => void;\n  /** Called when the back button is clicked. If not provided the back button won't show. The back button only shows on small screens */\n  onGoBack?: () => void;\n  /** Steps to be displayed in stepper. If you don't need the stepper, please use OverlayHeader instead */\n  steps: readonly Step[];\n}\n\nconst FlowNavigation = ({\n  activeStep = 0,\n  avatar,\n  logo = <Logo />,\n  done = false,\n  onClose,\n  onGoBack,\n  steps,\n}: FlowNavigationProps) => {\n  const intl = useIntl();\n\n  const closeButton = onClose != null && <CloseButton size=\"lg\" onClick={onClose} />;\n\n  const screenSm = useScreenSize(Breakpoint.SMALL);\n  const screenLg = useScreenSize(Breakpoint.LARGE);\n\n  const newAvatar = done ? null : avatar;\n\n  const displayGoBack = onGoBack != null && activeStep > 0;\n\n  return (\n    <div\n      className={clsx('np-flow-navigation d-flex align-items-center justify-content-center p-y-3', {\n        'np-flow-navigation--border-bottom': !done,\n      })}\n    >\n      <FlowHeader\n        className={clsx(\n          'np-flow-navigation__content p-x-3',\n          screenSm == null\n            ? 'np-flow-navigation--hidden'\n            : {\n                'np-flow-navigation--xs-max': !screenSm,\n                // Size switches on parent container which may or may not have the same size as the window.\n                'np-flow-navigation--sm': screenSm,\n                'np-flow-navigation--lg': screenLg,\n              },\n        )}\n        leftContent={\n          <>\n            {!screenSm && displayGoBack ? (\n              <IconButton\n                size={40}\n                priority=\"tertiary\"\n                type=\"default\"\n                aria-label={intl.formatMessage(messages.back)}\n                onClick={onGoBack}\n              >\n                <ArrowLeft />\n              </IconButton>\n            ) : (\n              <div className=\"np-flow-header__left\">{logo}</div>\n            )}\n            {!screenSm && !done && (\n              <AnimatedLabel className=\"m-x-1\" steps={steps} activeLabel={activeStep} />\n            )}\n          </>\n        }\n        rightContent={\n          <div className=\"np-flow-header__right d-flex align-items-center justify-content-end order-2--lg\">\n            {newAvatar}\n            {newAvatar && closeButton && <span className=\"m-x-1\" />}\n            {closeButton}\n          </div>\n        }\n        bottomContent={\n          !done &&\n          (steps.length > 0 ? (\n            <Stepper\n              activeStep={activeStep}\n              steps={steps}\n              className={clsx('np-flow-navigation__stepper')}\n            />\n          ) : (\n            <div className=\"np-flow-navigation__stepper\" />\n          ))\n        }\n        layout={!screenLg ? Layout.VERTICAL : Layout.HORIZONTAL}\n      />\n    </div>\n  );\n};\n\nexport default FlowNavigation;\n"],"names":["FlowNavigation","activeStep","avatar","logo","_jsx","Logo","done","onClose","onGoBack","steps","intl","useIntl","closeButton","CloseButton","size","onClick","screenSm","useScreenSize","Breakpoint","SMALL","screenLg","LARGE","newAvatar","displayGoBack","className","clsx","children","FlowHeader","leftContent","_jsxs","_Fragment","IconButton","priority","type","formatMessage","messages","back","ArrowLeft","AnimatedLabel","activeLabel","rightContent","bottomContent","length","Stepper","layout","Layout","VERTICAL","HORIZONTAL"],"mappings":"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"}

package/build/header/Header.js

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

package/build/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../src/header/Header.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { AriaLabelProperty, CommonProps, Heading, LinkProps, Typography } from '../common';\nimport Link from '../link';\nimport Title from '../title';\nimport React, { useEffect, useRef, FunctionComponent, ReactNode } from 'react';\n\ntype ActionProps = AriaLabelProperty & {\n  text: string;\n  onClick?: (event: React.MouseEvent) => void;\n  disabled?: boolean;\n};\n\ntype ButtonActionProps = ActionProps;\ntype LinkActionProps = ActionProps & LinkProps;\n\nexport interface HeaderProps extends CommonProps {\n  /**\n   * Optional prop to define the action for the header. If the `href` property\n   * is provided, a `Link` will be rendered instead of a `Button`.\n   */\n  action?: ButtonActionProps | LinkActionProps;\n\n  /**\n   * Option prop to specify DOM render element of the title\n   *\n   * - When `as=\"legend\"`, the `Header` will render as a `<legend>` element.\n   *   **Note:** `<legend>` elements must be the first child of a `<fieldset>` to comply with HTML semantics.\n   *   If this condition is not met, a warning will be logged to the console.\n   *\n   * - Other valid values include standard heading tags (`h1` to `h6`) or `header`.\n   * @default 'h5'\n   */\n  as?: Heading | 'legend' | 'header';\n\n  /** Required prop to set the title of the Header. */\n  title: ReactNode;\n\n  /**\n   * Optional prop to specify the level of the Header\n   * @default 'group'\n   */\n  level?: 'section' | 'group';\n\n  className?: string;\n  testId?: string;\n}\n\n/**\n * Renders a header action which can be either a button or a link.\n *\n * @param {Object} props - The properties object.\n * @param {ButtonActionProps | LinkActionProps} props.action - The action object which can be either a button or a link.\n * @returns {JSX.Element} The rendered header action component.\n */\nconst HeaderAction = React.forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  { action: ButtonActionProps | LinkActionProps }\n>(({ action }, ref) => {\n  return (\n    <Link\n      className=\"np-header__action-button\"\n      aria-label={action['aria-label']}\n      href={'href' in action ? action.href : undefined}\n      target={'target' in action ? action.target : undefined}\n      disabled={action.disabled}\n      onClick={action.onClick}\n    >\n      {action.text}\n    </Link>\n  );\n});\n\nHeaderAction.displayName = 'HeaderAction';\n\n/**\n * @param {ButtonActionProps | LinkActionProps} [action] - Optional prop to specify the action button or link.\n * @param {Heading | 'legend'} [as='h5'] - Optional prop to override the heading element rendered for the title.\n * @param {string} title - Required prop to set the title of the section header.\n * @param {'group' | 'section'} [level='group'] - Optional prop to specify the level of the section header.\n * @param {string} [className]\n * @param {string} [testId]\n *\n * @see {@link Header } for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/typography-header--docs|Storybook Wise Design}\n */\nconst Header: FunctionComponent<HeaderProps> = React.forwardRef(\n  (\n    { as = 'h5', action, className, testId, title, level = 'group', ...props },\n    ref: React.Ref<HTMLDivElement | HTMLHeadingElement | HTMLLegendElement>,\n  ) => {\n    const internalRef = useRef<HTMLLegendElement>(null);\n    const levelTypography =\n      level === 'group' ? Typography.TITLE_GROUP : Typography.TITLE_SUBSECTION;\n    const headerClasses = clsx('np-header', className, {\n      'np-header--group': level === 'group',\n    });\n\n    const commonProps = {\n      className: headerClasses,\n      'data-testid': testId,\n    };\n\n    useEffect(() => {\n      if (as === 'legend' && internalRef.current) {\n        const { parentElement } = internalRef.current;\n        if (!parentElement || parentElement.tagName.toLowerCase() !== 'fieldset') {\n          console.warn(\n            'Legends should be the first child in a fieldset, and this is not possible when including an action',\n          );\n        }\n      }\n    }, [as]);\n\n    if (!action) {\n      return (\n        <Title ref={internalRef} as={as} type={levelTypography} {...commonProps} {...props}>\n          {title}\n        </Title>\n      );\n    }\n\n    return (\n      <div {...commonProps} {...props} ref={ref as React.Ref<HTMLDivElement>}>\n        <Title as={as} type={levelTypography} className=\"np-header__title\">\n          {title}\n        </Title>\n        <HeaderAction action={action} />\n      </div>\n    );\n  },\n);\n\nHeader.displayName = 'Header';\n\nexport default Header;\n"],"names":["HeaderAction","React","forwardRef","action","ref","_jsx","Link","className","href","undefined","target","disabled","onClick","children","text","displayName","Header","as","testId","title","level","props","internalRef","useRef","levelTypography","Typography","TITLE_GROUP","TITLE_SUBSECTION","headerClasses","clsx","commonProps","useEffect","current","parentElement","tagName","toLowerCase","console","warn","Title","type","_jsxs"],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../src/header/Header.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { AriaLabelProperty, CommonProps, Heading, LinkProps, Typography } from '../common';\nimport Link from '../link';\nimport Title from '../title';\nimport React, { useEffect, useRef, FunctionComponent, ReactNode } from 'react';\n\ntype ActionProps = AriaLabelProperty & {\n  text: string;\n  onClick?: (event: React.MouseEvent) => void;\n  disabled?: boolean;\n};\n\ntype ButtonActionProps = ActionProps;\ntype LinkActionProps = ActionProps & LinkProps;\n\nexport interface HeaderProps extends CommonProps {\n  /**\n   * Optional prop to define the action for the header. If the `href` property\n   * is provided, a `Link` will be rendered instead of a `Button`.\n   */\n  action?: ButtonActionProps | LinkActionProps;\n\n  /**\n   * Option prop to specify DOM render element of the title\n   *\n   * - When `as=\"legend\"`, the `Header` will render as a `<legend>` element.\n   *   **Note:** `<legend>` elements must be the first child of a `<fieldset>` to comply with HTML semantics.\n   *   If this condition is not met, a warning will be logged to the console.\n   *\n   * - Other valid values include standard heading tags (`h1` to `h6`) or `header`.\n   * @default 'h5'\n   */\n  as?: Heading | 'legend' | 'header';\n\n  /** Required prop to set the title of the Header. */\n  title: ReactNode;\n\n  /**\n   * Optional prop to specify the level of the Header\n   * @default 'group'\n   */\n  level?: 'section' | 'group';\n\n  className?: string;\n  testId?: string;\n}\n\n/**\n * Renders a header action which can be either a button or a link.\n *\n * @param {Object} props - The properties object.\n * @param {ButtonActionProps | LinkActionProps} props.action - The action object which can be either a button or a link.\n * @returns {JSX.Element} The rendered header action component.\n */\nconst HeaderAction = React.forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  { action: ButtonActionProps | LinkActionProps }\n>(({ action }, ref) => {\n  return (\n    <Link\n      className=\"np-header__action-button\"\n      aria-label={action['aria-label']}\n      href={'href' in action ? action.href : undefined}\n      target={'target' in action ? action.target : undefined}\n      disabled={action.disabled}\n      onClick={action.onClick}\n    >\n      {action.text}\n    </Link>\n  );\n});\n\nHeaderAction.displayName = 'HeaderAction';\n\n/**\n * @param {ButtonActionProps | LinkActionProps} [action] - Optional prop to specify the action button or link.\n * @param {Heading | 'legend'} [as='h5'] - Optional prop to override the heading element rendered for the title.\n * @param {string} title - Required prop to set the title of the section header.\n * @param {'group' | 'section'} [level='group'] - Optional prop to specify the level of the section header.\n * @param {string} [className]\n * @param {string} [testId]\n *\n * @see {@link Header } for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/typography-header--docs|Storybook Wise Design}\n */\nconst Header: FunctionComponent<HeaderProps> = React.forwardRef(\n  (\n    { as = 'h5', action, className, testId, title, level = 'group', ...props },\n    ref: React.Ref<HTMLDivElement | HTMLHeadingElement | HTMLLegendElement>,\n  ) => {\n    const internalRef = useRef<HTMLLegendElement>(null);\n    const levelTypography =\n      level === 'group' ? Typography.TITLE_GROUP : Typography.TITLE_SUBSECTION;\n    const headerClasses = clsx('np-header', className, {\n      'np-header--group': level === 'group',\n    });\n\n    const commonProps = {\n      className: headerClasses,\n      'data-testid': testId,\n    };\n\n    useEffect(() => {\n      if (as === 'legend' && internalRef.current) {\n        const { parentElement } = internalRef.current;\n        if (!parentElement || parentElement.tagName.toLowerCase() !== 'fieldset') {\n          console.warn(\n            'Legends should be the first child in a fieldset, and this is not possible when including an action',\n          );\n        }\n      }\n    }, [as]);\n\n    if (!action) {\n      return (\n        <Title ref={internalRef} as={as} type={levelTypography} {...commonProps} {...props}>\n          {title}\n        </Title>\n      );\n    }\n\n    return (\n      <div {...commonProps} {...props} ref={ref as React.Ref<HTMLDivElement>}>\n        <Title as={as} type={levelTypography} className=\"np-header__title\">\n          {title}\n        </Title>\n        <HeaderAction action={action} />\n      </div>\n    );\n  },\n);\n\nHeader.displayName = 'Header';\n\nexport default Header;\n"],"names":["HeaderAction","React","forwardRef","action","ref","_jsx","Link","className","href","undefined","target","disabled","onClick","children","text","displayName","Header","as","testId","title","level","props","internalRef","useRef","levelTypography","Typography","TITLE_GROUP","TITLE_SUBSECTION","headerClasses","clsx","commonProps","useEffect","current","parentElement","tagName","toLowerCase","console","warn","Title","type","_jsxs"],"mappings":"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"}

package/build/header/Header.mjs

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

package/build/header/Header.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Header.mjs","sources":["../../src/header/Header.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { AriaLabelProperty, CommonProps, Heading, LinkProps, Typography } from '../common';\nimport Link from '../link';\nimport Title from '../title';\nimport React, { useEffect, useRef, FunctionComponent, ReactNode } from 'react';\n\ntype ActionProps = AriaLabelProperty & {\n  text: string;\n  onClick?: (event: React.MouseEvent) => void;\n  disabled?: boolean;\n};\n\ntype ButtonActionProps = ActionProps;\ntype LinkActionProps = ActionProps & LinkProps;\n\nexport interface HeaderProps extends CommonProps {\n  /**\n   * Optional prop to define the action for the header. If the `href` property\n   * is provided, a `Link` will be rendered instead of a `Button`.\n   */\n  action?: ButtonActionProps | LinkActionProps;\n\n  /**\n   * Option prop to specify DOM render element of the title\n   *\n   * - When `as=\"legend\"`, the `Header` will render as a `<legend>` element.\n   *   **Note:** `<legend>` elements must be the first child of a `<fieldset>` to comply with HTML semantics.\n   *   If this condition is not met, a warning will be logged to the console.\n   *\n   * - Other valid values include standard heading tags (`h1` to `h6`) or `header`.\n   * @default 'h5'\n   */\n  as?: Heading | 'legend' | 'header';\n\n  /** Required prop to set the title of the Header. */\n  title: ReactNode;\n\n  /**\n   * Optional prop to specify the level of the Header\n   * @default 'group'\n   */\n  level?: 'section' | 'group';\n\n  className?: string;\n  testId?: string;\n}\n\n/**\n * Renders a header action which can be either a button or a link.\n *\n * @param {Object} props - The properties object.\n * @param {ButtonActionProps | LinkActionProps} props.action - The action object which can be either a button or a link.\n * @returns {JSX.Element} The rendered header action component.\n */\nconst HeaderAction = React.forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  { action: ButtonActionProps | LinkActionProps }\n>(({ action }, ref) => {\n  return (\n    <Link\n      className=\"np-header__action-button\"\n      aria-label={action['aria-label']}\n      href={'href' in action ? action.href : undefined}\n      target={'target' in action ? action.target : undefined}\n      disabled={action.disabled}\n      onClick={action.onClick}\n    >\n      {action.text}\n    </Link>\n  );\n});\n\nHeaderAction.displayName = 'HeaderAction';\n\n/**\n * @param {ButtonActionProps | LinkActionProps} [action] - Optional prop to specify the action button or link.\n * @param {Heading | 'legend'} [as='h5'] - Optional prop to override the heading element rendered for the title.\n * @param {string} title - Required prop to set the title of the section header.\n * @param {'group' | 'section'} [level='group'] - Optional prop to specify the level of the section header.\n * @param {string} [className]\n * @param {string} [testId]\n *\n * @see {@link Header } for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/typography-header--docs|Storybook Wise Design}\n */\nconst Header: FunctionComponent<HeaderProps> = React.forwardRef(\n  (\n    { as = 'h5', action, className, testId, title, level = 'group', ...props },\n    ref: React.Ref<HTMLDivElement | HTMLHeadingElement | HTMLLegendElement>,\n  ) => {\n    const internalRef = useRef<HTMLLegendElement>(null);\n    const levelTypography =\n      level === 'group' ? Typography.TITLE_GROUP : Typography.TITLE_SUBSECTION;\n    const headerClasses = clsx('np-header', className, {\n      'np-header--group': level === 'group',\n    });\n\n    const commonProps = {\n      className: headerClasses,\n      'data-testid': testId,\n    };\n\n    useEffect(() => {\n      if (as === 'legend' && internalRef.current) {\n        const { parentElement } = internalRef.current;\n        if (!parentElement || parentElement.tagName.toLowerCase() !== 'fieldset') {\n          console.warn(\n            'Legends should be the first child in a fieldset, and this is not possible when including an action',\n          );\n        }\n      }\n    }, [as]);\n\n    if (!action) {\n      return (\n        <Title ref={internalRef} as={as} type={levelTypography} {...commonProps} {...props}>\n          {title}\n        </Title>\n      );\n    }\n\n    return (\n      <div {...commonProps} {...props} ref={ref as React.Ref<HTMLDivElement>}>\n        <Title as={as} type={levelTypography} className=\"np-header__title\">\n          {title}\n        </Title>\n        <HeaderAction action={action} />\n      </div>\n    );\n  },\n);\n\nHeader.displayName = 'Header';\n\nexport default Header;\n"],"names":["HeaderAction","React","forwardRef","action","ref","_jsx","Link","className","href","undefined","target","disabled","onClick","children","text","displayName","Header","as","testId","title","level","props","internalRef","useRef","levelTypography","Typography","TITLE_GROUP","TITLE_SUBSECTION","headerClasses","clsx","commonProps","useEffect","current","parentElement","tagName","toLowerCase","console","warn","Title","type","_jsxs"],"mappings":"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"}
+{"version":3,"file":"Header.mjs","sources":["../../src/header/Header.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { AriaLabelProperty, CommonProps, Heading, LinkProps, Typography } from '../common';\nimport Link from '../link';\nimport Title from '../title';\nimport React, { useEffect, useRef, FunctionComponent, ReactNode } from 'react';\n\ntype ActionProps = AriaLabelProperty & {\n  text: string;\n  onClick?: (event: React.MouseEvent) => void;\n  disabled?: boolean;\n};\n\ntype ButtonActionProps = ActionProps;\ntype LinkActionProps = ActionProps & LinkProps;\n\nexport interface HeaderProps extends CommonProps {\n  /**\n   * Optional prop to define the action for the header. If the `href` property\n   * is provided, a `Link` will be rendered instead of a `Button`.\n   */\n  action?: ButtonActionProps | LinkActionProps;\n\n  /**\n   * Option prop to specify DOM render element of the title\n   *\n   * - When `as=\"legend\"`, the `Header` will render as a `<legend>` element.\n   *   **Note:** `<legend>` elements must be the first child of a `<fieldset>` to comply with HTML semantics.\n   *   If this condition is not met, a warning will be logged to the console.\n   *\n   * - Other valid values include standard heading tags (`h1` to `h6`) or `header`.\n   * @default 'h5'\n   */\n  as?: Heading | 'legend' | 'header';\n\n  /** Required prop to set the title of the Header. */\n  title: ReactNode;\n\n  /**\n   * Optional prop to specify the level of the Header\n   * @default 'group'\n   */\n  level?: 'section' | 'group';\n\n  className?: string;\n  testId?: string;\n}\n\n/**\n * Renders a header action which can be either a button or a link.\n *\n * @param {Object} props - The properties object.\n * @param {ButtonActionProps | LinkActionProps} props.action - The action object which can be either a button or a link.\n * @returns {JSX.Element} The rendered header action component.\n */\nconst HeaderAction = React.forwardRef<\n  HTMLButtonElement | HTMLAnchorElement,\n  { action: ButtonActionProps | LinkActionProps }\n>(({ action }, ref) => {\n  return (\n    <Link\n      className=\"np-header__action-button\"\n      aria-label={action['aria-label']}\n      href={'href' in action ? action.href : undefined}\n      target={'target' in action ? action.target : undefined}\n      disabled={action.disabled}\n      onClick={action.onClick}\n    >\n      {action.text}\n    </Link>\n  );\n});\n\nHeaderAction.displayName = 'HeaderAction';\n\n/**\n * @param {ButtonActionProps | LinkActionProps} [action] - Optional prop to specify the action button or link.\n * @param {Heading | 'legend'} [as='h5'] - Optional prop to override the heading element rendered for the title.\n * @param {string} title - Required prop to set the title of the section header.\n * @param {'group' | 'section'} [level='group'] - Optional prop to specify the level of the section header.\n * @param {string} [className]\n * @param {string} [testId]\n *\n * @see {@link Header } for further information.\n * @see {@link https://storybook.wise.design/?path=/docs/typography-header--docs|Storybook Wise Design}\n */\nconst Header: FunctionComponent<HeaderProps> = React.forwardRef(\n  (\n    { as = 'h5', action, className, testId, title, level = 'group', ...props },\n    ref: React.Ref<HTMLDivElement | HTMLHeadingElement | HTMLLegendElement>,\n  ) => {\n    const internalRef = useRef<HTMLLegendElement>(null);\n    const levelTypography =\n      level === 'group' ? Typography.TITLE_GROUP : Typography.TITLE_SUBSECTION;\n    const headerClasses = clsx('np-header', className, {\n      'np-header--group': level === 'group',\n    });\n\n    const commonProps = {\n      className: headerClasses,\n      'data-testid': testId,\n    };\n\n    useEffect(() => {\n      if (as === 'legend' && internalRef.current) {\n        const { parentElement } = internalRef.current;\n        if (!parentElement || parentElement.tagName.toLowerCase() !== 'fieldset') {\n          console.warn(\n            'Legends should be the first child in a fieldset, and this is not possible when including an action',\n          );\n        }\n      }\n    }, [as]);\n\n    if (!action) {\n      return (\n        <Title ref={internalRef} as={as} type={levelTypography} {...commonProps} {...props}>\n          {title}\n        </Title>\n      );\n    }\n\n    return (\n      <div {...commonProps} {...props} ref={ref as React.Ref<HTMLDivElement>}>\n        <Title as={as} type={levelTypography} className=\"np-header__title\">\n          {title}\n        </Title>\n        <HeaderAction action={action} />\n      </div>\n    );\n  },\n);\n\nHeader.displayName = 'Header';\n\nexport default Header;\n"],"names":["HeaderAction","React","forwardRef","action","ref","_jsx","Link","className","href","undefined","target","disabled","onClick","children","text","displayName","Header","as","testId","title","level","props","internalRef","useRef","levelTypography","Typography","TITLE_GROUP","TITLE_SUBSECTION","headerClasses","clsx","commonProps","useEffect","current","parentElement","tagName","toLowerCase","console","warn","Title","type","_jsxs"],"mappings":"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"}

package/build/info/Info.js

@@ -25,6 +25,7 @@ require('../common/propsValues/variant.js');
 require('../common/propsValues/scroll.js');
 require('../common/propsValues/markdownNodeType.js');
 require('../common/fileType.js');
+require('@transferwise/formatting');
 require('../common/closeButton/CloseButton.messages.js');
 var jsxRuntime = require('react/jsx-runtime');
 var Modal = require('../modal/Modal.js');

package/build/info/Info.js.map

@@ -1 +1 @@
-{"version":3,"file":"Info.js","sources":["../../src/info/Info.tsx"],"sourcesContent":["import { QuestionMarkCircle as HelpCircleIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { Size, Position, SizeSmall, SizeLarge } from '../common';\nimport Modal from '../modal';\nimport Popover, { PopoverPreferredPlacement } from '../popover';\n\nimport messages from './Info.messages';\nimport { InfoPresentation } from './infoPresentations';\nimport IconButton, { IconButtonProps } from '../iconButton';\n\nexport interface InfoProps {\n  'aria-label'?: string;\n  /**\n   * Extra classes applied to Info\n   */\n  className?: string;\n  /**\n   * Content displayed inside a Popover a Modal\n   */\n  content?: React.ReactNode;\n  onClick?: () => void;\n  /**\n   * Decides whether to display content in a Popover or a Modal\n   */\n  presentation?: 'MODAL' | 'POPOVER';\n  /**\n   * Decides the size of help Icon\n   */\n  size?: SizeSmall | SizeLarge;\n  /**\n   * Title displayed inside a Popover a Modal\n   */\n  title?: React.ReactNode;\n  /**\n   * Prferred placement of the Popover, does not apply to Modal\n   */\n  preferredPlacement?: PopoverPreferredPlacement;\n}\n\nconst Info = ({\n  className = undefined,\n  content = undefined,\n  onClick = undefined,\n  presentation = InfoPresentation.POPOVER,\n  size = Size.SMALL,\n  title = undefined,\n  'aria-label': ariaLabel,\n  preferredPlacement = Position.BOTTOM,\n}: InfoProps) => {\n  const intl = useIntl();\n  const [open, setOpen] = useState(false);\n  ariaLabel ??= intl.formatMessage(messages.ariaLabel);\n  const isModal = presentation === InfoPresentation.MODAL;\n\n  const buttonProps: IconButtonProps = {\n    'aria-label': ariaLabel,\n    priority: 'minimal',\n    size: 24,\n    children: <HelpCircleIcon />,\n  };\n\n  return (\n    <span className={clsx(className, 'np-info')}>\n      {isModal ? (\n        <>\n          <IconButton\n            onClick={() => {\n              setOpen(!open);\n              if (onClick) {\n                onClick();\n              }\n            }}\n            {...buttonProps}\n          />\n          <Modal body={content} open={open} title={title} onClose={() => setOpen(false)} />\n        </>\n      ) : (\n        <Popover content={content} preferredPlacement={preferredPlacement} title={title}>\n          <IconButton\n            {...buttonProps}\n            onClick={() => {\n              if (onClick) {\n                onClick();\n              }\n            }}\n          />\n        </Popover>\n      )}\n    </span>\n  );\n};\n\nexport default Info;\n"],"names":["Info","className","undefined","content","onClick","presentation","InfoPresentation","POPOVER","size","Size","SMALL","title","ariaLabel","preferredPlacement","Position","BOTTOM","intl","useIntl","open","setOpen","useState","formatMessage","messages","isModal","MODAL","buttonProps","priority","children","_jsx","HelpCircleIcon","clsx","_jsxs","_Fragment","IconButton","Modal","body","onClose","Popover"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAMA,IAAI,GAAGA,CAAC;AACZC,EAAAA,SAAS,GAAGC,SAAS;AACrBC,EAAAA,OAAO,GAAGD,SAAS;AACnBE,EAAAA,OAAO,GAAGF,SAAS;EACnBG,YAAY,GAAGC,kCAAgB,CAACC,OAAO;QACvCC,MAAI,GAAGC,SAAI,CAACC,KAAK;AACjBC,EAAAA,KAAK,GAAGT,SAAS;AACjB,EAAA,YAAY,EAAEU,SAAS;EACvBC,kBAAkB,GAAGC,iBAAQ,CAACC;AAAM,CAC1B,KAAI;AACd,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE;EACtB,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;EACvCR,SAAS,KAAKI,IAAI,CAACK,aAAa,CAACC,qBAAQ,CAACV,SAAS,CAAC;AACpD,EAAA,MAAMW,OAAO,GAAGlB,YAAY,KAAKC,kCAAgB,CAACkB,KAAK;AAEvD,EAAA,MAAMC,WAAW,GAAoB;AACnC,IAAA,YAAY,EAAEb,SAAS;AACvBc,IAAAA,QAAQ,EAAE,SAAS;AACnBlB,IAAAA,IAAI,EAAE,EAAE;AACRmB,IAAAA,QAAQ,eAAEC,cAAA,CAACC,wBAAc,EAAA,EAAA;GAC1B;AAED,EAAA,oBACED,cAAA,CAAA,MAAA,EAAA;AAAM3B,IAAAA,SAAS,EAAE6B,SAAI,CAAC7B,SAAS,EAAE,SAAS,CAAE;AAAA0B,IAAAA,QAAA,EACzCJ,OAAO,gBACNQ,eAAA,CAAAC,mBAAA,EAAA;MAAAL,QAAA,EAAA,cACEC,cAAA,CAACK,kBAAU,EAAA;QACT7B,OAAO,EAAEA,MAAK;UACZe,OAAO,CAAC,CAACD,IAAI,CAAC;AACd,UAAA,IAAId,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;QACF,CAAE;QAAA,GACEqB;AAAW,OAAC,CAElB,eAAAG,cAAA,CAACM,aAAK,EAAA;AAACC,QAAAA,IAAI,EAAEhC,OAAQ;AAACe,QAAAA,IAAI,EAAEA,IAAK;AAACP,QAAAA,KAAK,EAAEA,KAAM;AAACyB,QAAAA,OAAO,EAAEA,MAAMjB,OAAO,CAAC,KAAK;AAAE,OAAA,CAChF;AAAA,KAAA,CAAG,gBAEHS,cAAA,CAACS,eAAO,EAAA;AAAClC,MAAAA,OAAO,EAAEA,OAAQ;AAACU,MAAAA,kBAAkB,EAAEA,kBAAmB;AAACF,MAAAA,KAAK,EAAEA,KAAM;MAAAgB,QAAA,eAC9EC,cAAA,CAACK,kBAAU,EAAA;AAAA,QAAA,GACLR,WAAW;QACfrB,OAAO,EAAEA,MAAK;AACZ,UAAA,IAAIA,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;AACF,QAAA;OAAE;KAEG;AACV,GACG,CAAC;AAEX;;;;"}
+{"version":3,"file":"Info.js","sources":["../../src/info/Info.tsx"],"sourcesContent":["import { QuestionMarkCircle as HelpCircleIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { Size, Position, SizeSmall, SizeLarge } from '../common';\nimport Modal from '../modal';\nimport Popover, { PopoverPreferredPlacement } from '../popover';\n\nimport messages from './Info.messages';\nimport { InfoPresentation } from './infoPresentations';\nimport IconButton, { IconButtonProps } from '../iconButton';\n\nexport interface InfoProps {\n  'aria-label'?: string;\n  /**\n   * Extra classes applied to Info\n   */\n  className?: string;\n  /**\n   * Content displayed inside a Popover a Modal\n   */\n  content?: React.ReactNode;\n  onClick?: () => void;\n  /**\n   * Decides whether to display content in a Popover or a Modal\n   */\n  presentation?: 'MODAL' | 'POPOVER';\n  /**\n   * Decides the size of help Icon\n   */\n  size?: SizeSmall | SizeLarge;\n  /**\n   * Title displayed inside a Popover a Modal\n   */\n  title?: React.ReactNode;\n  /**\n   * Prferred placement of the Popover, does not apply to Modal\n   */\n  preferredPlacement?: PopoverPreferredPlacement;\n}\n\nconst Info = ({\n  className = undefined,\n  content = undefined,\n  onClick = undefined,\n  presentation = InfoPresentation.POPOVER,\n  size = Size.SMALL,\n  title = undefined,\n  'aria-label': ariaLabel,\n  preferredPlacement = Position.BOTTOM,\n}: InfoProps) => {\n  const intl = useIntl();\n  const [open, setOpen] = useState(false);\n  ariaLabel ??= intl.formatMessage(messages.ariaLabel);\n  const isModal = presentation === InfoPresentation.MODAL;\n\n  const buttonProps: IconButtonProps = {\n    'aria-label': ariaLabel,\n    priority: 'minimal',\n    size: 24,\n    children: <HelpCircleIcon />,\n  };\n\n  return (\n    <span className={clsx(className, 'np-info')}>\n      {isModal ? (\n        <>\n          <IconButton\n            onClick={() => {\n              setOpen(!open);\n              if (onClick) {\n                onClick();\n              }\n            }}\n            {...buttonProps}\n          />\n          <Modal body={content} open={open} title={title} onClose={() => setOpen(false)} />\n        </>\n      ) : (\n        <Popover content={content} preferredPlacement={preferredPlacement} title={title}>\n          <IconButton\n            {...buttonProps}\n            onClick={() => {\n              if (onClick) {\n                onClick();\n              }\n            }}\n          />\n        </Popover>\n      )}\n    </span>\n  );\n};\n\nexport default Info;\n"],"names":["Info","className","undefined","content","onClick","presentation","InfoPresentation","POPOVER","size","Size","SMALL","title","ariaLabel","preferredPlacement","Position","BOTTOM","intl","useIntl","open","setOpen","useState","formatMessage","messages","isModal","MODAL","buttonProps","priority","children","_jsx","HelpCircleIcon","clsx","_jsxs","_Fragment","IconButton","Modal","body","onClose","Popover"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAMA,IAAI,GAAGA,CAAC;AACZC,EAAAA,SAAS,GAAGC,SAAS;AACrBC,EAAAA,OAAO,GAAGD,SAAS;AACnBE,EAAAA,OAAO,GAAGF,SAAS;EACnBG,YAAY,GAAGC,kCAAgB,CAACC,OAAO;QACvCC,MAAI,GAAGC,SAAI,CAACC,KAAK;AACjBC,EAAAA,KAAK,GAAGT,SAAS;AACjB,EAAA,YAAY,EAAEU,SAAS;EACvBC,kBAAkB,GAAGC,iBAAQ,CAACC;AAAM,CAC1B,KAAI;AACd,EAAA,MAAMC,IAAI,GAAGC,iBAAO,EAAE;EACtB,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGC,cAAQ,CAAC,KAAK,CAAC;EACvCR,SAAS,KAAKI,IAAI,CAACK,aAAa,CAACC,qBAAQ,CAACV,SAAS,CAAC;AACpD,EAAA,MAAMW,OAAO,GAAGlB,YAAY,KAAKC,kCAAgB,CAACkB,KAAK;AAEvD,EAAA,MAAMC,WAAW,GAAoB;AACnC,IAAA,YAAY,EAAEb,SAAS;AACvBc,IAAAA,QAAQ,EAAE,SAAS;AACnBlB,IAAAA,IAAI,EAAE,EAAE;AACRmB,IAAAA,QAAQ,eAAEC,cAAA,CAACC,wBAAc,EAAA,EAAA;GAC1B;AAED,EAAA,oBACED,cAAA,CAAA,MAAA,EAAA;AAAM3B,IAAAA,SAAS,EAAE6B,SAAI,CAAC7B,SAAS,EAAE,SAAS,CAAE;AAAA0B,IAAAA,QAAA,EACzCJ,OAAO,gBACNQ,eAAA,CAAAC,mBAAA,EAAA;MAAAL,QAAA,EAAA,cACEC,cAAA,CAACK,kBAAU,EAAA;QACT7B,OAAO,EAAEA,MAAK;UACZe,OAAO,CAAC,CAACD,IAAI,CAAC;AACd,UAAA,IAAId,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;QACF,CAAE;QAAA,GACEqB;AAAW,OAAC,CAElB,eAAAG,cAAA,CAACM,aAAK,EAAA;AAACC,QAAAA,IAAI,EAAEhC,OAAQ;AAACe,QAAAA,IAAI,EAAEA,IAAK;AAACP,QAAAA,KAAK,EAAEA,KAAM;AAACyB,QAAAA,OAAO,EAAEA,MAAMjB,OAAO,CAAC,KAAK;AAAE,OAAA,CAChF;AAAA,KAAA,CAAG,gBAEHS,cAAA,CAACS,eAAO,EAAA;AAAClC,MAAAA,OAAO,EAAEA,OAAQ;AAACU,MAAAA,kBAAkB,EAAEA,kBAAmB;AAACF,MAAAA,KAAK,EAAEA,KAAM;MAAAgB,QAAA,eAC9EC,cAAA,CAACK,kBAAU,EAAA;AAAA,QAAA,GACLR,WAAW;QACfrB,OAAO,EAAEA,MAAK;AACZ,UAAA,IAAIA,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;AACF,QAAA;OAAE;KAEG;AACV,GACG,CAAC;AAEX;;;;"}

package/build/info/Info.mjs

@@ -21,6 +21,7 @@ import '../common/propsValues/variant.mjs';
 import '../common/propsValues/scroll.mjs';
 import '../common/propsValues/markdownNodeType.mjs';
 import '../common/fileType.mjs';
+import '@transferwise/formatting';
 import '../common/closeButton/CloseButton.messages.mjs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import Modal from '../modal/Modal.mjs';

package/build/info/Info.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Info.mjs","sources":["../../src/info/Info.tsx"],"sourcesContent":["import { QuestionMarkCircle as HelpCircleIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { Size, Position, SizeSmall, SizeLarge } from '../common';\nimport Modal from '../modal';\nimport Popover, { PopoverPreferredPlacement } from '../popover';\n\nimport messages from './Info.messages';\nimport { InfoPresentation } from './infoPresentations';\nimport IconButton, { IconButtonProps } from '../iconButton';\n\nexport interface InfoProps {\n  'aria-label'?: string;\n  /**\n   * Extra classes applied to Info\n   */\n  className?: string;\n  /**\n   * Content displayed inside a Popover a Modal\n   */\n  content?: React.ReactNode;\n  onClick?: () => void;\n  /**\n   * Decides whether to display content in a Popover or a Modal\n   */\n  presentation?: 'MODAL' | 'POPOVER';\n  /**\n   * Decides the size of help Icon\n   */\n  size?: SizeSmall | SizeLarge;\n  /**\n   * Title displayed inside a Popover a Modal\n   */\n  title?: React.ReactNode;\n  /**\n   * Prferred placement of the Popover, does not apply to Modal\n   */\n  preferredPlacement?: PopoverPreferredPlacement;\n}\n\nconst Info = ({\n  className = undefined,\n  content = undefined,\n  onClick = undefined,\n  presentation = InfoPresentation.POPOVER,\n  size = Size.SMALL,\n  title = undefined,\n  'aria-label': ariaLabel,\n  preferredPlacement = Position.BOTTOM,\n}: InfoProps) => {\n  const intl = useIntl();\n  const [open, setOpen] = useState(false);\n  ariaLabel ??= intl.formatMessage(messages.ariaLabel);\n  const isModal = presentation === InfoPresentation.MODAL;\n\n  const buttonProps: IconButtonProps = {\n    'aria-label': ariaLabel,\n    priority: 'minimal',\n    size: 24,\n    children: <HelpCircleIcon />,\n  };\n\n  return (\n    <span className={clsx(className, 'np-info')}>\n      {isModal ? (\n        <>\n          <IconButton\n            onClick={() => {\n              setOpen(!open);\n              if (onClick) {\n                onClick();\n              }\n            }}\n            {...buttonProps}\n          />\n          <Modal body={content} open={open} title={title} onClose={() => setOpen(false)} />\n        </>\n      ) : (\n        <Popover content={content} preferredPlacement={preferredPlacement} title={title}>\n          <IconButton\n            {...buttonProps}\n            onClick={() => {\n              if (onClick) {\n                onClick();\n              }\n            }}\n          />\n        </Popover>\n      )}\n    </span>\n  );\n};\n\nexport default Info;\n"],"names":["Info","className","undefined","content","onClick","presentation","InfoPresentation","POPOVER","size","Size","SMALL","title","ariaLabel","preferredPlacement","Position","BOTTOM","intl","useIntl","open","setOpen","useState","formatMessage","messages","isModal","MODAL","buttonProps","priority","children","_jsx","HelpCircleIcon","clsx","_jsxs","_Fragment","IconButton","Modal","body","onClose","Popover"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAMA,IAAI,GAAGA,CAAC;AACZC,EAAAA,SAAS,GAAGC,SAAS;AACrBC,EAAAA,OAAO,GAAGD,SAAS;AACnBE,EAAAA,OAAO,GAAGF,SAAS;EACnBG,YAAY,GAAGC,gBAAgB,CAACC,OAAO;EACvCC,IAAI,GAAGC,IAAI,CAACC,KAAK;AACjBC,EAAAA,KAAK,GAAGT,SAAS;AACjB,EAAA,YAAY,EAAEU,SAAS;EACvBC,kBAAkB,GAAGC,QAAQ,CAACC;AAAM,CAC1B,KAAI;AACd,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;EACtB,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;EACvCR,SAAS,KAAKI,IAAI,CAACK,aAAa,CAACC,QAAQ,CAACV,SAAS,CAAC;AACpD,EAAA,MAAMW,OAAO,GAAGlB,YAAY,KAAKC,gBAAgB,CAACkB,KAAK;AAEvD,EAAA,MAAMC,WAAW,GAAoB;AACnC,IAAA,YAAY,EAAEb,SAAS;AACvBc,IAAAA,QAAQ,EAAE,SAAS;AACnBlB,IAAAA,IAAI,EAAE,EAAE;AACRmB,IAAAA,QAAQ,eAAEC,GAAA,CAACC,kBAAc,EAAA,EAAA;GAC1B;AAED,EAAA,oBACED,GAAA,CAAA,MAAA,EAAA;AAAM3B,IAAAA,SAAS,EAAE6B,IAAI,CAAC7B,SAAS,EAAE,SAAS,CAAE;AAAA0B,IAAAA,QAAA,EACzCJ,OAAO,gBACNQ,IAAA,CAAAC,QAAA,EAAA;MAAAL,QAAA,EAAA,cACEC,GAAA,CAACK,UAAU,EAAA;QACT7B,OAAO,EAAEA,MAAK;UACZe,OAAO,CAAC,CAACD,IAAI,CAAC;AACd,UAAA,IAAId,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;QACF,CAAE;QAAA,GACEqB;AAAW,OAAC,CAElB,eAAAG,GAAA,CAACM,KAAK,EAAA;AAACC,QAAAA,IAAI,EAAEhC,OAAQ;AAACe,QAAAA,IAAI,EAAEA,IAAK;AAACP,QAAAA,KAAK,EAAEA,KAAM;AAACyB,QAAAA,OAAO,EAAEA,MAAMjB,OAAO,CAAC,KAAK;AAAE,OAAA,CAChF;AAAA,KAAA,CAAG,gBAEHS,GAAA,CAACS,OAAO,EAAA;AAAClC,MAAAA,OAAO,EAAEA,OAAQ;AAACU,MAAAA,kBAAkB,EAAEA,kBAAmB;AAACF,MAAAA,KAAK,EAAEA,KAAM;MAAAgB,QAAA,eAC9EC,GAAA,CAACK,UAAU,EAAA;AAAA,QAAA,GACLR,WAAW;QACfrB,OAAO,EAAEA,MAAK;AACZ,UAAA,IAAIA,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;AACF,QAAA;OAAE;KAEG;AACV,GACG,CAAC;AAEX;;;;"}
+{"version":3,"file":"Info.mjs","sources":["../../src/info/Info.tsx"],"sourcesContent":["import { QuestionMarkCircle as HelpCircleIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useState } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { Size, Position, SizeSmall, SizeLarge } from '../common';\nimport Modal from '../modal';\nimport Popover, { PopoverPreferredPlacement } from '../popover';\n\nimport messages from './Info.messages';\nimport { InfoPresentation } from './infoPresentations';\nimport IconButton, { IconButtonProps } from '../iconButton';\n\nexport interface InfoProps {\n  'aria-label'?: string;\n  /**\n   * Extra classes applied to Info\n   */\n  className?: string;\n  /**\n   * Content displayed inside a Popover a Modal\n   */\n  content?: React.ReactNode;\n  onClick?: () => void;\n  /**\n   * Decides whether to display content in a Popover or a Modal\n   */\n  presentation?: 'MODAL' | 'POPOVER';\n  /**\n   * Decides the size of help Icon\n   */\n  size?: SizeSmall | SizeLarge;\n  /**\n   * Title displayed inside a Popover a Modal\n   */\n  title?: React.ReactNode;\n  /**\n   * Prferred placement of the Popover, does not apply to Modal\n   */\n  preferredPlacement?: PopoverPreferredPlacement;\n}\n\nconst Info = ({\n  className = undefined,\n  content = undefined,\n  onClick = undefined,\n  presentation = InfoPresentation.POPOVER,\n  size = Size.SMALL,\n  title = undefined,\n  'aria-label': ariaLabel,\n  preferredPlacement = Position.BOTTOM,\n}: InfoProps) => {\n  const intl = useIntl();\n  const [open, setOpen] = useState(false);\n  ariaLabel ??= intl.formatMessage(messages.ariaLabel);\n  const isModal = presentation === InfoPresentation.MODAL;\n\n  const buttonProps: IconButtonProps = {\n    'aria-label': ariaLabel,\n    priority: 'minimal',\n    size: 24,\n    children: <HelpCircleIcon />,\n  };\n\n  return (\n    <span className={clsx(className, 'np-info')}>\n      {isModal ? (\n        <>\n          <IconButton\n            onClick={() => {\n              setOpen(!open);\n              if (onClick) {\n                onClick();\n              }\n            }}\n            {...buttonProps}\n          />\n          <Modal body={content} open={open} title={title} onClose={() => setOpen(false)} />\n        </>\n      ) : (\n        <Popover content={content} preferredPlacement={preferredPlacement} title={title}>\n          <IconButton\n            {...buttonProps}\n            onClick={() => {\n              if (onClick) {\n                onClick();\n              }\n            }}\n          />\n        </Popover>\n      )}\n    </span>\n  );\n};\n\nexport default Info;\n"],"names":["Info","className","undefined","content","onClick","presentation","InfoPresentation","POPOVER","size","Size","SMALL","title","ariaLabel","preferredPlacement","Position","BOTTOM","intl","useIntl","open","setOpen","useState","formatMessage","messages","isModal","MODAL","buttonProps","priority","children","_jsx","HelpCircleIcon","clsx","_jsxs","_Fragment","IconButton","Modal","body","onClose","Popover"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0CA,MAAMA,IAAI,GAAGA,CAAC;AACZC,EAAAA,SAAS,GAAGC,SAAS;AACrBC,EAAAA,OAAO,GAAGD,SAAS;AACnBE,EAAAA,OAAO,GAAGF,SAAS;EACnBG,YAAY,GAAGC,gBAAgB,CAACC,OAAO;EACvCC,IAAI,GAAGC,IAAI,CAACC,KAAK;AACjBC,EAAAA,KAAK,GAAGT,SAAS;AACjB,EAAA,YAAY,EAAEU,SAAS;EACvBC,kBAAkB,GAAGC,QAAQ,CAACC;AAAM,CAC1B,KAAI;AACd,EAAA,MAAMC,IAAI,GAAGC,OAAO,EAAE;EACtB,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGC,QAAQ,CAAC,KAAK,CAAC;EACvCR,SAAS,KAAKI,IAAI,CAACK,aAAa,CAACC,QAAQ,CAACV,SAAS,CAAC;AACpD,EAAA,MAAMW,OAAO,GAAGlB,YAAY,KAAKC,gBAAgB,CAACkB,KAAK;AAEvD,EAAA,MAAMC,WAAW,GAAoB;AACnC,IAAA,YAAY,EAAEb,SAAS;AACvBc,IAAAA,QAAQ,EAAE,SAAS;AACnBlB,IAAAA,IAAI,EAAE,EAAE;AACRmB,IAAAA,QAAQ,eAAEC,GAAA,CAACC,kBAAc,EAAA,EAAA;GAC1B;AAED,EAAA,oBACED,GAAA,CAAA,MAAA,EAAA;AAAM3B,IAAAA,SAAS,EAAE6B,IAAI,CAAC7B,SAAS,EAAE,SAAS,CAAE;AAAA0B,IAAAA,QAAA,EACzCJ,OAAO,gBACNQ,IAAA,CAAAC,QAAA,EAAA;MAAAL,QAAA,EAAA,cACEC,GAAA,CAACK,UAAU,EAAA;QACT7B,OAAO,EAAEA,MAAK;UACZe,OAAO,CAAC,CAACD,IAAI,CAAC;AACd,UAAA,IAAId,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;QACF,CAAE;QAAA,GACEqB;AAAW,OAAC,CAElB,eAAAG,GAAA,CAACM,KAAK,EAAA;AAACC,QAAAA,IAAI,EAAEhC,OAAQ;AAACe,QAAAA,IAAI,EAAEA,IAAK;AAACP,QAAAA,KAAK,EAAEA,KAAM;AAACyB,QAAAA,OAAO,EAAEA,MAAMjB,OAAO,CAAC,KAAK;AAAE,OAAA,CAChF;AAAA,KAAA,CAAG,gBAEHS,GAAA,CAACS,OAAO,EAAA;AAAClC,MAAAA,OAAO,EAAEA,OAAQ;AAACU,MAAAA,kBAAkB,EAAEA,kBAAmB;AAACF,MAAAA,KAAK,EAAEA,KAAM;MAAAgB,QAAA,eAC9EC,GAAA,CAACK,UAAU,EAAA;AAAA,QAAA,GACLR,WAAW;QACfrB,OAAO,EAAEA,MAAK;AACZ,UAAA,IAAIA,OAAO,EAAE;AACXA,YAAAA,OAAO,EAAE;AACX,UAAA;AACF,QAAA;OAAE;KAEG;AACV,GACG,CAAC;AAEX;;;;"}

package/build/inlineAlert/InlineAlert.js

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

package/build/inlineAlert/InlineAlert.js.map

@@ -1 +1 @@
-{"version":3,"file":"InlineAlert.js","sources":["../../src/inlineAlert/InlineAlert.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport { Sentiment, Size } from '../common';\nimport StatusIcon from '../statusIcon';\nimport Body from '../body';\n\nexport interface InlineAlertProps {\n  id?: string;\n  type?: `${Sentiment}`;\n  iconLabel?: string;\n  className?: string;\n  children: ReactNode;\n}\n\nconst iconTypes = new Set<NonNullable<InlineAlertProps['type']>>([\n  Sentiment.NEGATIVE,\n  Sentiment.ERROR,\n  Sentiment.POSITIVE,\n  Sentiment.SUCCESS,\n  Sentiment.WARNING,\n]);\n\n/**\n * @deprecated Use [<InlinePrompt />](https://storybook.wise.design/?path=/docs/prompts-inlineprompt--docs) or [<Field />](https://storybook.wise.design/?path=/docs/forms-field--docs) instead.\n */\nexport default function InlineAlert({\n  id,\n  type = 'neutral',\n  iconLabel,\n  className,\n  children,\n}: InlineAlertProps) {\n  return (\n    <Body\n      role=\"alert\"\n      id={id}\n      className={clsx(\n        'alert alert-detach',\n        `alert-${type === Sentiment.NEGATIVE || type === Sentiment.ERROR ? 'danger' : type}`,\n        'd-flex',\n        className,\n      )}\n    >\n      {iconTypes.has(type) && (\n        <StatusIcon sentiment={type} size={Size.SMALL} iconLabel={iconLabel} />\n      )}\n      <div>{children}</div>\n    </Body>\n  );\n}\n"],"names":["iconTypes","Set","Sentiment","NEGATIVE","ERROR","POSITIVE","SUCCESS","WARNING","InlineAlert","id","type","iconLabel","className","children","_jsxs","Body","role","clsx","has","_jsx","StatusIcon","sentiment","size","Size","SMALL"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAMA,SAAS,GAAG,IAAIC,GAAG,CAAwC,CAC/DC,mBAAS,CAACC,QAAQ,EAClBD,mBAAS,CAACE,KAAK,EACfF,mBAAS,CAACG,QAAQ,EAClBH,mBAAS,CAACI,OAAO,EACjBJ,mBAAS,CAACK,OAAO,CAClB,CAAC;AAEF;;AAEG;AACW,SAAUC,WAAWA,CAAC;EAClCC,EAAE;AACFC,EAAAA,IAAI,GAAG,SAAS;EAChBC,SAAS;EACTC,SAAS;AACTC,EAAAA;AAAQ,CACS,EAAA;EACjB,oBACEC,eAAA,CAACC,YAAI,EAAA;AACHC,IAAAA,IAAI,EAAC,OAAO;AACZP,IAAAA,EAAE,EAAEA,EAAG;IACPG,SAAS,EAAEK,SAAI,CACb,oBAAoB,EACpB,CAAA,MAAA,EAASP,IAAI,KAAKR,mBAAS,CAACC,QAAQ,IAAIO,IAAI,KAAKR,mBAAS,CAACE,KAAK,GAAG,QAAQ,GAAGM,IAAI,CAAA,CAAE,EACpF,QAAQ,EACRE,SAAS,CACT;IAAAC,QAAA,EAAA,CAEDb,SAAS,CAACkB,GAAG,CAACR,IAAI,CAAC,iBAClBS,cAAA,CAACC,kBAAU,EAAA;AAACC,MAAAA,SAAS,EAAEX,IAAK;MAACY,IAAI,EAAEC,SAAI,CAACC,KAAM;AAACb,MAAAA,SAAS,EAAEA;KAAU,CACrE,eACDQ,cAAA,CAAA,KAAA,EAAA;AAAAN,MAAAA,QAAA,EAAMA;AAAQ,KAAM,CACtB;AAAA,GAAM,CAAC;AAEX;;;;"}
+{"version":3,"file":"InlineAlert.js","sources":["../../src/inlineAlert/InlineAlert.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport { Sentiment, Size } from '../common';\nimport StatusIcon from '../statusIcon';\nimport Body from '../body';\n\nexport interface InlineAlertProps {\n  id?: string;\n  type?: `${Sentiment}`;\n  iconLabel?: string;\n  className?: string;\n  children: ReactNode;\n}\n\nconst iconTypes = new Set<NonNullable<InlineAlertProps['type']>>([\n  Sentiment.NEGATIVE,\n  Sentiment.ERROR,\n  Sentiment.POSITIVE,\n  Sentiment.SUCCESS,\n  Sentiment.WARNING,\n]);\n\n/**\n * @deprecated Use [<InlinePrompt />](https://storybook.wise.design/?path=/docs/prompts-inlineprompt--docs) or [<Field />](https://storybook.wise.design/?path=/docs/forms-field--docs) instead.\n */\nexport default function InlineAlert({\n  id,\n  type = 'neutral',\n  iconLabel,\n  className,\n  children,\n}: InlineAlertProps) {\n  return (\n    <Body\n      role=\"alert\"\n      id={id}\n      className={clsx(\n        'alert alert-detach',\n        `alert-${type === Sentiment.NEGATIVE || type === Sentiment.ERROR ? 'danger' : type}`,\n        'd-flex',\n        className,\n      )}\n    >\n      {iconTypes.has(type) && (\n        <StatusIcon sentiment={type} size={Size.SMALL} iconLabel={iconLabel} />\n      )}\n      <div>{children}</div>\n    </Body>\n  );\n}\n"],"names":["iconTypes","Set","Sentiment","NEGATIVE","ERROR","POSITIVE","SUCCESS","WARNING","InlineAlert","id","type","iconLabel","className","children","_jsxs","Body","role","clsx","has","_jsx","StatusIcon","sentiment","size","Size","SMALL"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAMA,SAAS,GAAG,IAAIC,GAAG,CAAwC,CAC/DC,mBAAS,CAACC,QAAQ,EAClBD,mBAAS,CAACE,KAAK,EACfF,mBAAS,CAACG,QAAQ,EAClBH,mBAAS,CAACI,OAAO,EACjBJ,mBAAS,CAACK,OAAO,CAClB,CAAC;AAEF;;AAEG;AACW,SAAUC,WAAWA,CAAC;EAClCC,EAAE;AACFC,EAAAA,IAAI,GAAG,SAAS;EAChBC,SAAS;EACTC,SAAS;AACTC,EAAAA;AAAQ,CACS,EAAA;EACjB,oBACEC,eAAA,CAACC,YAAI,EAAA;AACHC,IAAAA,IAAI,EAAC,OAAO;AACZP,IAAAA,EAAE,EAAEA,EAAG;IACPG,SAAS,EAAEK,SAAI,CACb,oBAAoB,EACpB,CAAA,MAAA,EAASP,IAAI,KAAKR,mBAAS,CAACC,QAAQ,IAAIO,IAAI,KAAKR,mBAAS,CAACE,KAAK,GAAG,QAAQ,GAAGM,IAAI,CAAA,CAAE,EACpF,QAAQ,EACRE,SAAS,CACT;IAAAC,QAAA,EAAA,CAEDb,SAAS,CAACkB,GAAG,CAACR,IAAI,CAAC,iBAClBS,cAAA,CAACC,kBAAU,EAAA;AAACC,MAAAA,SAAS,EAAEX,IAAK;MAACY,IAAI,EAAEC,SAAI,CAACC,KAAM;AAACb,MAAAA,SAAS,EAAEA;KAAU,CACrE,eACDQ,cAAA,CAAA,KAAA,EAAA;AAAAN,MAAAA,QAAA,EAAMA;AAAQ,KAAM,CACtB;AAAA,GAAM,CAAC;AAEX;;;;"}

package/build/inlineAlert/InlineAlert.mjs

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

package/build/inlineAlert/InlineAlert.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InlineAlert.mjs","sources":["../../src/inlineAlert/InlineAlert.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport { Sentiment, Size } from '../common';\nimport StatusIcon from '../statusIcon';\nimport Body from '../body';\n\nexport interface InlineAlertProps {\n  id?: string;\n  type?: `${Sentiment}`;\n  iconLabel?: string;\n  className?: string;\n  children: ReactNode;\n}\n\nconst iconTypes = new Set<NonNullable<InlineAlertProps['type']>>([\n  Sentiment.NEGATIVE,\n  Sentiment.ERROR,\n  Sentiment.POSITIVE,\n  Sentiment.SUCCESS,\n  Sentiment.WARNING,\n]);\n\n/**\n * @deprecated Use [<InlinePrompt />](https://storybook.wise.design/?path=/docs/prompts-inlineprompt--docs) or [<Field />](https://storybook.wise.design/?path=/docs/forms-field--docs) instead.\n */\nexport default function InlineAlert({\n  id,\n  type = 'neutral',\n  iconLabel,\n  className,\n  children,\n}: InlineAlertProps) {\n  return (\n    <Body\n      role=\"alert\"\n      id={id}\n      className={clsx(\n        'alert alert-detach',\n        `alert-${type === Sentiment.NEGATIVE || type === Sentiment.ERROR ? 'danger' : type}`,\n        'd-flex',\n        className,\n      )}\n    >\n      {iconTypes.has(type) && (\n        <StatusIcon sentiment={type} size={Size.SMALL} iconLabel={iconLabel} />\n      )}\n      <div>{children}</div>\n    </Body>\n  );\n}\n"],"names":["iconTypes","Set","Sentiment","NEGATIVE","ERROR","POSITIVE","SUCCESS","WARNING","InlineAlert","id","type","iconLabel","className","children","_jsxs","Body","role","clsx","has","_jsx","StatusIcon","sentiment","size","Size","SMALL"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAMA,SAAS,GAAG,IAAIC,GAAG,CAAwC,CAC/DC,SAAS,CAACC,QAAQ,EAClBD,SAAS,CAACE,KAAK,EACfF,SAAS,CAACG,QAAQ,EAClBH,SAAS,CAACI,OAAO,EACjBJ,SAAS,CAACK,OAAO,CAClB,CAAC;AAEF;;AAEG;AACW,SAAUC,WAAWA,CAAC;EAClCC,EAAE;AACFC,EAAAA,IAAI,GAAG,SAAS;EAChBC,SAAS;EACTC,SAAS;AACTC,EAAAA;AAAQ,CACS,EAAA;EACjB,oBACEC,IAAA,CAACC,IAAI,EAAA;AACHC,IAAAA,IAAI,EAAC,OAAO;AACZP,IAAAA,EAAE,EAAEA,EAAG;IACPG,SAAS,EAAEK,IAAI,CACb,oBAAoB,EACpB,CAAA,MAAA,EAASP,IAAI,KAAKR,SAAS,CAACC,QAAQ,IAAIO,IAAI,KAAKR,SAAS,CAACE,KAAK,GAAG,QAAQ,GAAGM,IAAI,CAAA,CAAE,EACpF,QAAQ,EACRE,SAAS,CACT;IAAAC,QAAA,EAAA,CAEDb,SAAS,CAACkB,GAAG,CAACR,IAAI,CAAC,iBAClBS,GAAA,CAACC,UAAU,EAAA;AAACC,MAAAA,SAAS,EAAEX,IAAK;MAACY,IAAI,EAAEC,IAAI,CAACC,KAAM;AAACb,MAAAA,SAAS,EAAEA;KAAU,CACrE,eACDQ,GAAA,CAAA,KAAA,EAAA;AAAAN,MAAAA,QAAA,EAAMA;AAAQ,KAAM,CACtB;AAAA,GAAM,CAAC;AAEX;;;;"}
+{"version":3,"file":"InlineAlert.mjs","sources":["../../src/inlineAlert/InlineAlert.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport { Sentiment, Size } from '../common';\nimport StatusIcon from '../statusIcon';\nimport Body from '../body';\n\nexport interface InlineAlertProps {\n  id?: string;\n  type?: `${Sentiment}`;\n  iconLabel?: string;\n  className?: string;\n  children: ReactNode;\n}\n\nconst iconTypes = new Set<NonNullable<InlineAlertProps['type']>>([\n  Sentiment.NEGATIVE,\n  Sentiment.ERROR,\n  Sentiment.POSITIVE,\n  Sentiment.SUCCESS,\n  Sentiment.WARNING,\n]);\n\n/**\n * @deprecated Use [<InlinePrompt />](https://storybook.wise.design/?path=/docs/prompts-inlineprompt--docs) or [<Field />](https://storybook.wise.design/?path=/docs/forms-field--docs) instead.\n */\nexport default function InlineAlert({\n  id,\n  type = 'neutral',\n  iconLabel,\n  className,\n  children,\n}: InlineAlertProps) {\n  return (\n    <Body\n      role=\"alert\"\n      id={id}\n      className={clsx(\n        'alert alert-detach',\n        `alert-${type === Sentiment.NEGATIVE || type === Sentiment.ERROR ? 'danger' : type}`,\n        'd-flex',\n        className,\n      )}\n    >\n      {iconTypes.has(type) && (\n        <StatusIcon sentiment={type} size={Size.SMALL} iconLabel={iconLabel} />\n      )}\n      <div>{children}</div>\n    </Body>\n  );\n}\n"],"names":["iconTypes","Set","Sentiment","NEGATIVE","ERROR","POSITIVE","SUCCESS","WARNING","InlineAlert","id","type","iconLabel","className","children","_jsxs","Body","role","clsx","has","_jsx","StatusIcon","sentiment","size","Size","SMALL"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAMA,SAAS,GAAG,IAAIC,GAAG,CAAwC,CAC/DC,SAAS,CAACC,QAAQ,EAClBD,SAAS,CAACE,KAAK,EACfF,SAAS,CAACG,QAAQ,EAClBH,SAAS,CAACI,OAAO,EACjBJ,SAAS,CAACK,OAAO,CAClB,CAAC;AAEF;;AAEG;AACW,SAAUC,WAAWA,CAAC;EAClCC,EAAE;AACFC,EAAAA,IAAI,GAAG,SAAS;EAChBC,SAAS;EACTC,SAAS;AACTC,EAAAA;AAAQ,CACS,EAAA;EACjB,oBACEC,IAAA,CAACC,IAAI,EAAA;AACHC,IAAAA,IAAI,EAAC,OAAO;AACZP,IAAAA,EAAE,EAAEA,EAAG;IACPG,SAAS,EAAEK,IAAI,CACb,oBAAoB,EACpB,CAAA,MAAA,EAASP,IAAI,KAAKR,SAAS,CAACC,QAAQ,IAAIO,IAAI,KAAKR,SAAS,CAACE,KAAK,GAAG,QAAQ,GAAGM,IAAI,CAAA,CAAE,EACpF,QAAQ,EACRE,SAAS,CACT;IAAAC,QAAA,EAAA,CAEDb,SAAS,CAACkB,GAAG,CAACR,IAAI,CAAC,iBAClBS,GAAA,CAACC,UAAU,EAAA;AAACC,MAAAA,SAAS,EAAEX,IAAK;MAACY,IAAI,EAAEC,IAAI,CAACC,KAAM;AAACb,MAAAA,SAAS,EAAEA;KAAU,CACrE,eACDQ,GAAA,CAAA,KAAA,EAAA;AAAAN,MAAAA,QAAA,EAAMA;AAAQ,KAAM,CACtB;AAAA,GAAM,CAAC;AAEX;;;;"}

package/build/inputs/SearchInput.js

@@ -21,6 +21,7 @@ require('../common/propsValues/variant.js');
 require('../common/propsValues/scroll.js');
 require('../common/propsValues/markdownNodeType.js');
 require('../common/fileType.js');
+require('@transferwise/formatting');
 require('clsx');
 require('react-intl');
 require('../common/closeButton/CloseButton.messages.js');

package/build/inputs/SearchInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.js","sources":["../../src/inputs/SearchInput.tsx"],"sourcesContent":["import { Search } from '@transferwise/icons';\nimport { forwardRef } from 'react';\n\nimport { Size } from '../common';\nimport { Merge } from '../utils';\n\nimport { Input } from './Input';\nimport { InputGroup } from './InputGroup';\n\nexport interface SearchInputProps extends Merge<\n  React.ComponentPropsWithRef<'input'>,\n  {\n    size?: Size.SMALL | Size.MEDIUM;\n    shape?: 'rectangle' | 'pill';\n    'aria-invalid'?: boolean;\n  }\n> {}\n\nexport const SearchInput = forwardRef(function SearchInput(\n  { shape = 'pill', size = Size.MEDIUM, disabled, className, ...restProps }: SearchInputProps,\n  ref: React.ForwardedRef<HTMLInputElement | null>,\n) {\n  return (\n    <InputGroup\n      addonStart={{\n        content: <Search size={size === Size.SMALL ? 16 : 24} />,\n        initialContentWidth: size === Size.SMALL ? 16 : 24,\n      }}\n      disabled={disabled}\n      className={className}\n    >\n      <Input\n        ref={ref}\n        role=\"searchbox\"\n        inputMode=\"search\"\n        shape={shape}\n        size={size}\n        {...restProps}\n      />\n    </InputGroup>\n  );\n});\n"],"names":["SearchInput","forwardRef","shape","size","Size","MEDIUM","disabled","className","restProps","ref","_jsx","InputGroup","addonStart","content","Search","SMALL","initialContentWidth","children","Input","role","inputMode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAkBaA,WAAW,gBAAGC,gBAAU,CAAC,SAASD,WAAWA,CACxD;AAAEE,EAAAA,KAAK,GAAG,MAAM;QAAEC,MAAI,GAAGC,SAAI,CAACC,MAAM;EAAEC,QAAQ;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAoB,EAC3FC,GAAgD,EAAA;EAEhD,oBACEC,cAAA,CAACC,qBAAU,EAAA;AACTC,IAAAA,UAAU,EAAE;MACVC,OAAO,eAAEH,cAAA,CAACI,YAAM,EAAA;QAACX,IAAI,EAAEA,MAAI,KAAKC,SAAI,CAACW,KAAK,GAAG,EAAE,GAAG;AAAG,OAAA,CAAG;MACxDC,mBAAmB,EAAEb,MAAI,KAAKC,SAAI,CAACW,KAAK,GAAG,EAAE,GAAG;KAChD;AACFT,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,SAAS,EAAEA,SAAU;IAAAU,QAAA,eAErBP,cAAA,CAACQ,WAAK,EAAA;AACJT,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAC,WAAW;AAChBC,MAAAA,SAAS,EAAC,QAAQ;AAClBlB,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,IAAI,EAAEA,MAAK;MAAA,GACPK;KAAU;AAElB,GAAY,CAAC;AAEjB,CAAC;;;;"}
+{"version":3,"file":"SearchInput.js","sources":["../../src/inputs/SearchInput.tsx"],"sourcesContent":["import { Search } from '@transferwise/icons';\nimport { forwardRef } from 'react';\n\nimport { Size } from '../common';\nimport { Merge } from '../utils';\n\nimport { Input } from './Input';\nimport { InputGroup } from './InputGroup';\n\nexport interface SearchInputProps extends Merge<\n  React.ComponentPropsWithRef<'input'>,\n  {\n    size?: Size.SMALL | Size.MEDIUM;\n    shape?: 'rectangle' | 'pill';\n    'aria-invalid'?: boolean;\n  }\n> {}\n\nexport const SearchInput = forwardRef(function SearchInput(\n  { shape = 'pill', size = Size.MEDIUM, disabled, className, ...restProps }: SearchInputProps,\n  ref: React.ForwardedRef<HTMLInputElement | null>,\n) {\n  return (\n    <InputGroup\n      addonStart={{\n        content: <Search size={size === Size.SMALL ? 16 : 24} />,\n        initialContentWidth: size === Size.SMALL ? 16 : 24,\n      }}\n      disabled={disabled}\n      className={className}\n    >\n      <Input\n        ref={ref}\n        role=\"searchbox\"\n        inputMode=\"search\"\n        shape={shape}\n        size={size}\n        {...restProps}\n      />\n    </InputGroup>\n  );\n});\n"],"names":["SearchInput","forwardRef","shape","size","Size","MEDIUM","disabled","className","restProps","ref","_jsx","InputGroup","addonStart","content","Search","SMALL","initialContentWidth","children","Input","role","inputMode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAkBaA,WAAW,gBAAGC,gBAAU,CAAC,SAASD,WAAWA,CACxD;AAAEE,EAAAA,KAAK,GAAG,MAAM;QAAEC,MAAI,GAAGC,SAAI,CAACC,MAAM;EAAEC,QAAQ;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAoB,EAC3FC,GAAgD,EAAA;EAEhD,oBACEC,cAAA,CAACC,qBAAU,EAAA;AACTC,IAAAA,UAAU,EAAE;MACVC,OAAO,eAAEH,cAAA,CAACI,YAAM,EAAA;QAACX,IAAI,EAAEA,MAAI,KAAKC,SAAI,CAACW,KAAK,GAAG,EAAE,GAAG;AAAG,OAAA,CAAG;MACxDC,mBAAmB,EAAEb,MAAI,KAAKC,SAAI,CAACW,KAAK,GAAG,EAAE,GAAG;KAChD;AACFT,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,SAAS,EAAEA,SAAU;IAAAU,QAAA,eAErBP,cAAA,CAACQ,WAAK,EAAA;AACJT,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAC,WAAW;AAChBC,MAAAA,SAAS,EAAC,QAAQ;AAClBlB,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,IAAI,EAAEA,MAAK;MAAA,GACPK;KAAU;AAElB,GAAY,CAAC;AAEjB,CAAC;;;;"}

package/build/inputs/SearchInput.mjs

@@ -19,6 +19,7 @@ import '../common/propsValues/variant.mjs';
 import '../common/propsValues/scroll.mjs';
 import '../common/propsValues/markdownNodeType.mjs';
 import '../common/fileType.mjs';
+import '@transferwise/formatting';
 import 'clsx';
 import 'react-intl';
 import '../common/closeButton/CloseButton.messages.mjs';

package/build/inputs/SearchInput.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"SearchInput.mjs","sources":["../../src/inputs/SearchInput.tsx"],"sourcesContent":["import { Search } from '@transferwise/icons';\nimport { forwardRef } from 'react';\n\nimport { Size } from '../common';\nimport { Merge } from '../utils';\n\nimport { Input } from './Input';\nimport { InputGroup } from './InputGroup';\n\nexport interface SearchInputProps extends Merge<\n  React.ComponentPropsWithRef<'input'>,\n  {\n    size?: Size.SMALL | Size.MEDIUM;\n    shape?: 'rectangle' | 'pill';\n    'aria-invalid'?: boolean;\n  }\n> {}\n\nexport const SearchInput = forwardRef(function SearchInput(\n  { shape = 'pill', size = Size.MEDIUM, disabled, className, ...restProps }: SearchInputProps,\n  ref: React.ForwardedRef<HTMLInputElement | null>,\n) {\n  return (\n    <InputGroup\n      addonStart={{\n        content: <Search size={size === Size.SMALL ? 16 : 24} />,\n        initialContentWidth: size === Size.SMALL ? 16 : 24,\n      }}\n      disabled={disabled}\n      className={className}\n    >\n      <Input\n        ref={ref}\n        role=\"searchbox\"\n        inputMode=\"search\"\n        shape={shape}\n        size={size}\n        {...restProps}\n      />\n    </InputGroup>\n  );\n});\n"],"names":["SearchInput","forwardRef","shape","size","Size","MEDIUM","disabled","className","restProps","ref","_jsx","InputGroup","addonStart","content","Search","SMALL","initialContentWidth","children","Input","role","inputMode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;MAkBaA,WAAW,gBAAGC,UAAU,CAAC,SAASD,WAAWA,CACxD;AAAEE,EAAAA,KAAK,GAAG,MAAM;EAAEC,IAAI,GAAGC,IAAI,CAACC,MAAM;EAAEC,QAAQ;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAoB,EAC3FC,GAAgD,EAAA;EAEhD,oBACEC,GAAA,CAACC,UAAU,EAAA;AACTC,IAAAA,UAAU,EAAE;MACVC,OAAO,eAAEH,GAAA,CAACI,MAAM,EAAA;QAACX,IAAI,EAAEA,IAAI,KAAKC,IAAI,CAACW,KAAK,GAAG,EAAE,GAAG;AAAG,OAAA,CAAG;MACxDC,mBAAmB,EAAEb,IAAI,KAAKC,IAAI,CAACW,KAAK,GAAG,EAAE,GAAG;KAChD;AACFT,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,SAAS,EAAEA,SAAU;IAAAU,QAAA,eAErBP,GAAA,CAACQ,KAAK,EAAA;AACJT,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAC,WAAW;AAChBC,MAAAA,SAAS,EAAC,QAAQ;AAClBlB,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,IAAI,EAAEA,IAAK;MAAA,GACPK;KAAU;AAElB,GAAY,CAAC;AAEjB,CAAC;;;;"}
+{"version":3,"file":"SearchInput.mjs","sources":["../../src/inputs/SearchInput.tsx"],"sourcesContent":["import { Search } from '@transferwise/icons';\nimport { forwardRef } from 'react';\n\nimport { Size } from '../common';\nimport { Merge } from '../utils';\n\nimport { Input } from './Input';\nimport { InputGroup } from './InputGroup';\n\nexport interface SearchInputProps extends Merge<\n  React.ComponentPropsWithRef<'input'>,\n  {\n    size?: Size.SMALL | Size.MEDIUM;\n    shape?: 'rectangle' | 'pill';\n    'aria-invalid'?: boolean;\n  }\n> {}\n\nexport const SearchInput = forwardRef(function SearchInput(\n  { shape = 'pill', size = Size.MEDIUM, disabled, className, ...restProps }: SearchInputProps,\n  ref: React.ForwardedRef<HTMLInputElement | null>,\n) {\n  return (\n    <InputGroup\n      addonStart={{\n        content: <Search size={size === Size.SMALL ? 16 : 24} />,\n        initialContentWidth: size === Size.SMALL ? 16 : 24,\n      }}\n      disabled={disabled}\n      className={className}\n    >\n      <Input\n        ref={ref}\n        role=\"searchbox\"\n        inputMode=\"search\"\n        shape={shape}\n        size={size}\n        {...restProps}\n      />\n    </InputGroup>\n  );\n});\n"],"names":["SearchInput","forwardRef","shape","size","Size","MEDIUM","disabled","className","restProps","ref","_jsx","InputGroup","addonStart","content","Search","SMALL","initialContentWidth","children","Input","role","inputMode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAkBaA,WAAW,gBAAGC,UAAU,CAAC,SAASD,WAAWA,CACxD;AAAEE,EAAAA,KAAK,GAAG,MAAM;EAAEC,IAAI,GAAGC,IAAI,CAACC,MAAM;EAAEC,QAAQ;EAAEC,SAAS;EAAE,GAAGC;AAAS,CAAoB,EAC3FC,GAAgD,EAAA;EAEhD,oBACEC,GAAA,CAACC,UAAU,EAAA;AACTC,IAAAA,UAAU,EAAE;MACVC,OAAO,eAAEH,GAAA,CAACI,MAAM,EAAA;QAACX,IAAI,EAAEA,IAAI,KAAKC,IAAI,CAACW,KAAK,GAAG,EAAE,GAAG;AAAG,OAAA,CAAG;MACxDC,mBAAmB,EAAEb,IAAI,KAAKC,IAAI,CAACW,KAAK,GAAG,EAAE,GAAG;KAChD;AACFT,IAAAA,QAAQ,EAAEA,QAAS;AACnBC,IAAAA,SAAS,EAAEA,SAAU;IAAAU,QAAA,eAErBP,GAAA,CAACQ,KAAK,EAAA;AACJT,MAAAA,GAAG,EAAEA,GAAI;AACTU,MAAAA,IAAI,EAAC,WAAW;AAChBC,MAAAA,SAAS,EAAC,QAAQ;AAClBlB,MAAAA,KAAK,EAAEA,KAAM;AACbC,MAAAA,IAAI,EAAEA,IAAK;MAAA,GACPK;KAAU;AAElB,GAAY,CAAC;AAEjB,CAAC;;;;"}

package/build/instructionsList/InstructionsList.js

@@ -24,6 +24,7 @@ require('../common/propsValues/variant.js');
 require('../common/propsValues/scroll.js');
 require('../common/propsValues/markdownNodeType.js');
 require('../common/fileType.js');
+require('@transferwise/formatting');
 require('react');
 require('react-intl');
 require('../common/closeButton/CloseButton.messages.js');

package/build/instructionsList/InstructionsList.js.map

@@ -1 +1 @@
-{"version":3,"file":"InstructionsList.js","sources":["../../src/instructionsList/InstructionsList.tsx"],"sourcesContent":["import { CrossCircleFill as DontIcon, CheckCircleFill as DoIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport Body from '../body/Body';\nimport { Typography, CommonProps } from '../common';\n\ntype InstructionNode = {\n  content: ReactNode;\n  ['aria-label']: string;\n};\n\nexport type InstructionsListProps = CommonProps &\n  (\n    | {\n        dos?: readonly ReactNode[];\n        donts?: readonly ReactNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n    | {\n        dos?: readonly InstructionNode[];\n        donts?: readonly InstructionNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n  );\n\nconst InstructionsList = ({ className, dos, donts, sort = 'dosFirst' }: InstructionsListProps) => {\n  const dosInstructions =\n    dos?.map((doThis, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={doThis} type=\"do\" />\n    )) ?? null;\n\n  const dontsInstructions =\n    donts?.map((dont, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={dont} type=\"dont\" />\n    )) ?? null;\n\n  const orderedInstructions =\n    sort === 'dosFirst' ? (\n      <>\n        {dosInstructions}\n        {dontsInstructions}\n      </>\n    ) : (\n      <>\n        {dontsInstructions}\n        {dosInstructions}\n      </>\n    );\n\n  return <ul className={clsx('tw-instructions', className)}>{orderedInstructions}</ul>;\n};\n\nfunction Instruction({ item, type }: { item: ReactNode | InstructionNode; type: 'do' | 'dont' }) {\n  const isInstructionNode =\n    typeof item === 'object' && item !== null && 'content' in item && 'aria-label' in item;\n  return (\n    <li className=\"instruction\">\n      {type === 'do' ? (\n        <DoIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      ) : (\n        <DontIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      )}\n      <Body className=\"text-primary\" type={Typography.BODY_LARGE} preserveNewlines>\n        {isInstructionNode ? item.content : item}\n      </Body>\n    </li>\n  );\n}\n\nexport default InstructionsList;\n"],"names":["InstructionsList","className","dos","donts","sort","dosInstructions","map","doThis","index","_jsx","Instruction","item","type","dontsInstructions","dont","orderedInstructions","_jsxs","_Fragment","children","clsx","isInstructionNode","DoIcon","size","title","undefined","DontIcon","Body","Typography","BODY_LARGE","preserveNewlines","content"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAGA,CAAC;EAAEC,SAAS;EAAEC,GAAG;EAAEC,KAAK;AAAEC,EAAAA,IAAI,GAAG;AAAU,CAAyB,KAAI;EAC/F,MAAMC,eAAe,GACnBH,GAAG,EAAEI,GAAG,CAAC,CAACC,MAAM,EAAEC,KAAK;AAAA;AACrB;AACAC,EAAAA,cAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEJ,MAAO;AAACK,IAAAA,IAAI,EAAC;AAAI,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMK,iBAAiB,GACrBV,KAAK,EAAEG,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK;AAAA;AACrB;AACAC,EAAAA,cAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEG,IAAK;AAACF,IAAAA,IAAI,EAAC;AAAM,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMO,mBAAmB,GACvBX,IAAI,KAAK,UAAU,gBACjBY,eAAA,CAAAC,mBAAA,EAAA;IAAAC,QAAA,EAAA,CACGb,eAAe,EACfQ,iBAAiB;AAAA,GACpB,CAAG,gBAEHG,eAAA,CAAAC,mBAAA,EAAA;IAAAC,QAAA,EAAA,CACGL,iBAAiB,EACjBR,eAAe;AAAA,GAClB,CACD;AAEH,EAAA,oBAAOI,cAAA,CAAA,IAAA,EAAA;AAAIR,IAAAA,SAAS,EAAEkB,SAAI,CAAC,iBAAiB,EAAElB,SAAS,CAAE;AAAAiB,IAAAA,QAAA,EAAEH;AAAmB,GAAK,CAAC;AACtF;AAEA,SAASL,WAAWA,CAAC;EAAEC,IAAI;AAAEC,EAAAA;AAAI,CAA8D,EAAA;AAC7F,EAAA,MAAMQ,iBAAiB,GACrB,OAAOT,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,IAAI,IAAI,SAAS,IAAIA,IAAI,IAAI,YAAY,IAAIA,IAAI;AACxF,EAAA,oBACEK,eAAA,CAAA,IAAA,EAAA;AAAIf,IAAAA,SAAS,EAAC,aAAa;AAAAiB,IAAAA,QAAA,GACxBN,IAAI,KAAK,IAAI,gBACZH,cAAA,CAACY,qBAAM,EAAA;AACLC,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAC1D,gBAEFf,cAAA,CAACgB,qBAAQ,EAAA;AACPH,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAE7D,eACDf,cAAA,CAACiB,YAAI,EAAA;AAACzB,MAAAA,SAAS,EAAC,cAAc;MAACW,IAAI,EAAEe,qBAAU,CAACC,UAAW;MAACC,gBAAgB,EAAA,IAAA;AAAAX,MAAAA,QAAA,EACzEE,iBAAiB,GAAGT,IAAI,CAACmB,OAAO,GAAGnB;AAAI,KACpC,CACR;AAAA,GAAI,CAAC;AAET;;;;"}
+{"version":3,"file":"InstructionsList.js","sources":["../../src/instructionsList/InstructionsList.tsx"],"sourcesContent":["import { CrossCircleFill as DontIcon, CheckCircleFill as DoIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport Body from '../body/Body';\nimport { Typography, CommonProps } from '../common';\n\ntype InstructionNode = {\n  content: ReactNode;\n  ['aria-label']: string;\n};\n\nexport type InstructionsListProps = CommonProps &\n  (\n    | {\n        dos?: readonly ReactNode[];\n        donts?: readonly ReactNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n    | {\n        dos?: readonly InstructionNode[];\n        donts?: readonly InstructionNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n  );\n\nconst InstructionsList = ({ className, dos, donts, sort = 'dosFirst' }: InstructionsListProps) => {\n  const dosInstructions =\n    dos?.map((doThis, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={doThis} type=\"do\" />\n    )) ?? null;\n\n  const dontsInstructions =\n    donts?.map((dont, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={dont} type=\"dont\" />\n    )) ?? null;\n\n  const orderedInstructions =\n    sort === 'dosFirst' ? (\n      <>\n        {dosInstructions}\n        {dontsInstructions}\n      </>\n    ) : (\n      <>\n        {dontsInstructions}\n        {dosInstructions}\n      </>\n    );\n\n  return <ul className={clsx('tw-instructions', className)}>{orderedInstructions}</ul>;\n};\n\nfunction Instruction({ item, type }: { item: ReactNode | InstructionNode; type: 'do' | 'dont' }) {\n  const isInstructionNode =\n    typeof item === 'object' && item !== null && 'content' in item && 'aria-label' in item;\n  return (\n    <li className=\"instruction\">\n      {type === 'do' ? (\n        <DoIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      ) : (\n        <DontIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      )}\n      <Body className=\"text-primary\" type={Typography.BODY_LARGE} preserveNewlines>\n        {isInstructionNode ? item.content : item}\n      </Body>\n    </li>\n  );\n}\n\nexport default InstructionsList;\n"],"names":["InstructionsList","className","dos","donts","sort","dosInstructions","map","doThis","index","_jsx","Instruction","item","type","dontsInstructions","dont","orderedInstructions","_jsxs","_Fragment","children","clsx","isInstructionNode","DoIcon","size","title","undefined","DontIcon","Body","Typography","BODY_LARGE","preserveNewlines","content"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAGA,CAAC;EAAEC,SAAS;EAAEC,GAAG;EAAEC,KAAK;AAAEC,EAAAA,IAAI,GAAG;AAAU,CAAyB,KAAI;EAC/F,MAAMC,eAAe,GACnBH,GAAG,EAAEI,GAAG,CAAC,CAACC,MAAM,EAAEC,KAAK;AAAA;AACrB;AACAC,EAAAA,cAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEJ,MAAO;AAACK,IAAAA,IAAI,EAAC;AAAI,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMK,iBAAiB,GACrBV,KAAK,EAAEG,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK;AAAA;AACrB;AACAC,EAAAA,cAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEG,IAAK;AAACF,IAAAA,IAAI,EAAC;AAAM,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMO,mBAAmB,GACvBX,IAAI,KAAK,UAAU,gBACjBY,eAAA,CAAAC,mBAAA,EAAA;IAAAC,QAAA,EAAA,CACGb,eAAe,EACfQ,iBAAiB;AAAA,GACpB,CAAG,gBAEHG,eAAA,CAAAC,mBAAA,EAAA;IAAAC,QAAA,EAAA,CACGL,iBAAiB,EACjBR,eAAe;AAAA,GAClB,CACD;AAEH,EAAA,oBAAOI,cAAA,CAAA,IAAA,EAAA;AAAIR,IAAAA,SAAS,EAAEkB,SAAI,CAAC,iBAAiB,EAAElB,SAAS,CAAE;AAAAiB,IAAAA,QAAA,EAAEH;AAAmB,GAAK,CAAC;AACtF;AAEA,SAASL,WAAWA,CAAC;EAAEC,IAAI;AAAEC,EAAAA;AAAI,CAA8D,EAAA;AAC7F,EAAA,MAAMQ,iBAAiB,GACrB,OAAOT,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,IAAI,IAAI,SAAS,IAAIA,IAAI,IAAI,YAAY,IAAIA,IAAI;AACxF,EAAA,oBACEK,eAAA,CAAA,IAAA,EAAA;AAAIf,IAAAA,SAAS,EAAC,aAAa;AAAAiB,IAAAA,QAAA,GACxBN,IAAI,KAAK,IAAI,gBACZH,cAAA,CAACY,qBAAM,EAAA;AACLC,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAC1D,gBAEFf,cAAA,CAACgB,qBAAQ,EAAA;AACPH,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAE7D,eACDf,cAAA,CAACiB,YAAI,EAAA;AAACzB,MAAAA,SAAS,EAAC,cAAc;MAACW,IAAI,EAAEe,qBAAU,CAACC,UAAW;MAACC,gBAAgB,EAAA,IAAA;AAAAX,MAAAA,QAAA,EACzEE,iBAAiB,GAAGT,IAAI,CAACmB,OAAO,GAAGnB;AAAI,KACpC,CACR;AAAA,GAAI,CAAC;AAET;;;;"}

package/build/instructionsList/InstructionsList.mjs

@@ -20,6 +20,7 @@ import '../common/propsValues/variant.mjs';
 import '../common/propsValues/scroll.mjs';
 import '../common/propsValues/markdownNodeType.mjs';
 import '../common/fileType.mjs';
+import '@transferwise/formatting';
 import 'react';
 import 'react-intl';
 import '../common/closeButton/CloseButton.messages.mjs';

package/build/instructionsList/InstructionsList.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"InstructionsList.mjs","sources":["../../src/instructionsList/InstructionsList.tsx"],"sourcesContent":["import { CrossCircleFill as DontIcon, CheckCircleFill as DoIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport Body from '../body/Body';\nimport { Typography, CommonProps } from '../common';\n\ntype InstructionNode = {\n  content: ReactNode;\n  ['aria-label']: string;\n};\n\nexport type InstructionsListProps = CommonProps &\n  (\n    | {\n        dos?: readonly ReactNode[];\n        donts?: readonly ReactNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n    | {\n        dos?: readonly InstructionNode[];\n        donts?: readonly InstructionNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n  );\n\nconst InstructionsList = ({ className, dos, donts, sort = 'dosFirst' }: InstructionsListProps) => {\n  const dosInstructions =\n    dos?.map((doThis, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={doThis} type=\"do\" />\n    )) ?? null;\n\n  const dontsInstructions =\n    donts?.map((dont, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={dont} type=\"dont\" />\n    )) ?? null;\n\n  const orderedInstructions =\n    sort === 'dosFirst' ? (\n      <>\n        {dosInstructions}\n        {dontsInstructions}\n      </>\n    ) : (\n      <>\n        {dontsInstructions}\n        {dosInstructions}\n      </>\n    );\n\n  return <ul className={clsx('tw-instructions', className)}>{orderedInstructions}</ul>;\n};\n\nfunction Instruction({ item, type }: { item: ReactNode | InstructionNode; type: 'do' | 'dont' }) {\n  const isInstructionNode =\n    typeof item === 'object' && item !== null && 'content' in item && 'aria-label' in item;\n  return (\n    <li className=\"instruction\">\n      {type === 'do' ? (\n        <DoIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      ) : (\n        <DontIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      )}\n      <Body className=\"text-primary\" type={Typography.BODY_LARGE} preserveNewlines>\n        {isInstructionNode ? item.content : item}\n      </Body>\n    </li>\n  );\n}\n\nexport default InstructionsList;\n"],"names":["InstructionsList","className","dos","donts","sort","dosInstructions","map","doThis","index","_jsx","Instruction","item","type","dontsInstructions","dont","orderedInstructions","_jsxs","_Fragment","children","clsx","isInstructionNode","DoIcon","size","title","undefined","DontIcon","Body","Typography","BODY_LARGE","preserveNewlines","content"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAGA,CAAC;EAAEC,SAAS;EAAEC,GAAG;EAAEC,KAAK;AAAEC,EAAAA,IAAI,GAAG;AAAU,CAAyB,KAAI;EAC/F,MAAMC,eAAe,GACnBH,GAAG,EAAEI,GAAG,CAAC,CAACC,MAAM,EAAEC,KAAK;AAAA;AACrB;AACAC,EAAAA,GAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEJ,MAAO;AAACK,IAAAA,IAAI,EAAC;AAAI,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMK,iBAAiB,GACrBV,KAAK,EAAEG,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK;AAAA;AACrB;AACAC,EAAAA,GAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEG,IAAK;AAACF,IAAAA,IAAI,EAAC;AAAM,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMO,mBAAmB,GACvBX,IAAI,KAAK,UAAU,gBACjBY,IAAA,CAAAC,QAAA,EAAA;IAAAC,QAAA,EAAA,CACGb,eAAe,EACfQ,iBAAiB;AAAA,GACpB,CAAG,gBAEHG,IAAA,CAAAC,QAAA,EAAA;IAAAC,QAAA,EAAA,CACGL,iBAAiB,EACjBR,eAAe;AAAA,GAClB,CACD;AAEH,EAAA,oBAAOI,GAAA,CAAA,IAAA,EAAA;AAAIR,IAAAA,SAAS,EAAEkB,IAAI,CAAC,iBAAiB,EAAElB,SAAS,CAAE;AAAAiB,IAAAA,QAAA,EAAEH;AAAmB,GAAK,CAAC;AACtF;AAEA,SAASL,WAAWA,CAAC;EAAEC,IAAI;AAAEC,EAAAA;AAAI,CAA8D,EAAA;AAC7F,EAAA,MAAMQ,iBAAiB,GACrB,OAAOT,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,IAAI,IAAI,SAAS,IAAIA,IAAI,IAAI,YAAY,IAAIA,IAAI;AACxF,EAAA,oBACEK,IAAA,CAAA,IAAA,EAAA;AAAIf,IAAAA,SAAS,EAAC,aAAa;AAAAiB,IAAAA,QAAA,GACxBN,IAAI,KAAK,IAAI,gBACZH,GAAA,CAACY,eAAM,EAAA;AACLC,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAC1D,gBAEFf,GAAA,CAACgB,eAAQ,EAAA;AACPH,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAE7D,eACDf,GAAA,CAACiB,IAAI,EAAA;AAACzB,MAAAA,SAAS,EAAC,cAAc;MAACW,IAAI,EAAEe,UAAU,CAACC,UAAW;MAACC,gBAAgB,EAAA,IAAA;AAAAX,MAAAA,QAAA,EACzEE,iBAAiB,GAAGT,IAAI,CAACmB,OAAO,GAAGnB;AAAI,KACpC,CACR;AAAA,GAAI,CAAC;AAET;;;;"}
+{"version":3,"file":"InstructionsList.mjs","sources":["../../src/instructionsList/InstructionsList.tsx"],"sourcesContent":["import { CrossCircleFill as DontIcon, CheckCircleFill as DoIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactNode } from 'react';\n\nimport Body from '../body/Body';\nimport { Typography, CommonProps } from '../common';\n\ntype InstructionNode = {\n  content: ReactNode;\n  ['aria-label']: string;\n};\n\nexport type InstructionsListProps = CommonProps &\n  (\n    | {\n        dos?: readonly ReactNode[];\n        donts?: readonly ReactNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n    | {\n        dos?: readonly InstructionNode[];\n        donts?: readonly InstructionNode[];\n        sort?: 'dosFirst' | 'dontsFirst';\n      }\n  );\n\nconst InstructionsList = ({ className, dos, donts, sort = 'dosFirst' }: InstructionsListProps) => {\n  const dosInstructions =\n    dos?.map((doThis, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={doThis} type=\"do\" />\n    )) ?? null;\n\n  const dontsInstructions =\n    donts?.map((dont, index) => (\n      // eslint-disable-next-line react/no-array-index-key\n      <Instruction key={index} item={dont} type=\"dont\" />\n    )) ?? null;\n\n  const orderedInstructions =\n    sort === 'dosFirst' ? (\n      <>\n        {dosInstructions}\n        {dontsInstructions}\n      </>\n    ) : (\n      <>\n        {dontsInstructions}\n        {dosInstructions}\n      </>\n    );\n\n  return <ul className={clsx('tw-instructions', className)}>{orderedInstructions}</ul>;\n};\n\nfunction Instruction({ item, type }: { item: ReactNode | InstructionNode; type: 'do' | 'dont' }) {\n  const isInstructionNode =\n    typeof item === 'object' && item !== null && 'content' in item && 'aria-label' in item;\n  return (\n    <li className=\"instruction\">\n      {type === 'do' ? (\n        <DoIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      ) : (\n        <DontIcon\n          size={24}\n          className={type}\n          title={isInstructionNode ? item['aria-label'] : undefined}\n        />\n      )}\n      <Body className=\"text-primary\" type={Typography.BODY_LARGE} preserveNewlines>\n        {isInstructionNode ? item.content : item}\n      </Body>\n    </li>\n  );\n}\n\nexport default InstructionsList;\n"],"names":["InstructionsList","className","dos","donts","sort","dosInstructions","map","doThis","index","_jsx","Instruction","item","type","dontsInstructions","dont","orderedInstructions","_jsxs","_Fragment","children","clsx","isInstructionNode","DoIcon","size","title","undefined","DontIcon","Body","Typography","BODY_LARGE","preserveNewlines","content"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,MAAMA,gBAAgB,GAAGA,CAAC;EAAEC,SAAS;EAAEC,GAAG;EAAEC,KAAK;AAAEC,EAAAA,IAAI,GAAG;AAAU,CAAyB,KAAI;EAC/F,MAAMC,eAAe,GACnBH,GAAG,EAAEI,GAAG,CAAC,CAACC,MAAM,EAAEC,KAAK;AAAA;AACrB;AACAC,EAAAA,GAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEJ,MAAO;AAACK,IAAAA,IAAI,EAAC;AAAI,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMK,iBAAiB,GACrBV,KAAK,EAAEG,GAAG,CAAC,CAACQ,IAAI,EAAEN,KAAK;AAAA;AACrB;AACAC,EAAAA,GAAA,CAACC,WAAW,EAAA;AAAaC,IAAAA,IAAI,EAAEG,IAAK;AAACF,IAAAA,IAAI,EAAC;AAAM,GAAA,EAA9BJ,MACnB,CAAC,IAAI,IAAI;EAEZ,MAAMO,mBAAmB,GACvBX,IAAI,KAAK,UAAU,gBACjBY,IAAA,CAAAC,QAAA,EAAA;IAAAC,QAAA,EAAA,CACGb,eAAe,EACfQ,iBAAiB;AAAA,GACpB,CAAG,gBAEHG,IAAA,CAAAC,QAAA,EAAA;IAAAC,QAAA,EAAA,CACGL,iBAAiB,EACjBR,eAAe;AAAA,GAClB,CACD;AAEH,EAAA,oBAAOI,GAAA,CAAA,IAAA,EAAA;AAAIR,IAAAA,SAAS,EAAEkB,IAAI,CAAC,iBAAiB,EAAElB,SAAS,CAAE;AAAAiB,IAAAA,QAAA,EAAEH;AAAmB,GAAK,CAAC;AACtF;AAEA,SAASL,WAAWA,CAAC;EAAEC,IAAI;AAAEC,EAAAA;AAAI,CAA8D,EAAA;AAC7F,EAAA,MAAMQ,iBAAiB,GACrB,OAAOT,IAAI,KAAK,QAAQ,IAAIA,IAAI,KAAK,IAAI,IAAI,SAAS,IAAIA,IAAI,IAAI,YAAY,IAAIA,IAAI;AACxF,EAAA,oBACEK,IAAA,CAAA,IAAA,EAAA;AAAIf,IAAAA,SAAS,EAAC,aAAa;AAAAiB,IAAAA,QAAA,GACxBN,IAAI,KAAK,IAAI,gBACZH,GAAA,CAACY,eAAM,EAAA;AACLC,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAC1D,gBAEFf,GAAA,CAACgB,eAAQ,EAAA;AACPH,MAAAA,IAAI,EAAE,EAAG;AACTrB,MAAAA,SAAS,EAAEW,IAAK;AAChBW,MAAAA,KAAK,EAAEH,iBAAiB,GAAGT,IAAI,CAAC,YAAY,CAAC,GAAGa;AAAU,KAAA,CAE7D,eACDf,GAAA,CAACiB,IAAI,EAAA;AAACzB,MAAAA,SAAS,EAAC,cAAc;MAACW,IAAI,EAAEe,UAAU,CAACC,UAAW;MAACC,gBAAgB,EAAA,IAAA;AAAAX,MAAAA,QAAA,EACzEE,iBAAiB,GAAGT,IAAI,CAACmB,OAAO,GAAGnB;AAAI,KACpC,CACR;AAAA,GAAI,CAAC;AAET;;;;"}

package/build/link/Link.js

@@ -26,6 +26,7 @@ require('../common/propsValues/variant.js');
 require('../common/propsValues/scroll.js');
 require('../common/propsValues/markdownNodeType.js');
 require('../common/fileType.js');
+require('@transferwise/formatting');
 require('react');
 require('../common/closeButton/CloseButton.messages.js');
 var jsxRuntime = require('react/jsx-runtime');

package/build/link/Link.js.map

@@ -1 +1 @@
-{"version":3,"file":"Link.js","sources":["../../src/link/Link.tsx"],"sourcesContent":["import { NavigateAway as NavigateAwayIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\nimport { PrimitiveAnchor, PrimitiveButton } from '../primitives';\nimport type { PrimitiveAnchorProps, PrimitiveButtonProps } from '../primitives';\n\nimport { LinkLarge, LinkDefault, Typography } from '../common';\n\nimport messages from './Link.messages';\n\nexport type Props = PrimitiveAnchorProps &\n  Pick<PrimitiveButtonProps, 'onClick'> & { type?: LinkLarge | LinkDefault };\n\n/**\n * Standard Link component with navigate away icon\n *\n * Documentation: https://transferwise.github.io/neptune-web/components/content/Link\n */\nconst Link = ({\n  className,\n  children,\n  href,\n  target,\n  type = Typography.LINK_DEFAULT,\n  'aria-label': ariaLabel,\n  onClick,\n  disabled,\n  ...props\n}: Props) => {\n  const { formatMessage } = useIntl();\n  const isButton = Boolean(onClick) && href === undefined;\n  const isBlank = target === '_blank';\n\n  const classNames = clsx(\n    'np-link',\n    'd-inline-flex',\n    {\n      [`np-text-${type}`]: type,\n      'np-link--disabled': disabled,\n    },\n    className,\n  );\n\n  return isButton ? (\n    <PrimitiveButton\n      type=\"button\"\n      aria-label={ariaLabel}\n      className={clsx(classNames, 'btn-unstyled')}\n      disabled={disabled}\n      onClick={onClick}\n    >\n      {children}\n    </PrimitiveButton>\n  ) : (\n    <PrimitiveAnchor\n      href={href}\n      target={target}\n      className={classNames}\n      aria-label={ariaLabel}\n      rel={isBlank ? 'noreferrer' : undefined}\n      disabled={disabled}\n      onClick={onClick}\n      {...props}\n    >\n      {children} {isBlank && <NavigateAwayIcon title={formatMessage(messages.opensInNewTab)} />}\n    </PrimitiveAnchor>\n  );\n};\n\nexport default Link;\n"],"names":["Link","className","children","href","target","type","Typography","LINK_DEFAULT","ariaLabel","onClick","disabled","props","formatMessage","useIntl","isButton","Boolean","undefined","isBlank","classNames","clsx","_jsx","PrimitiveButton","_jsxs","PrimitiveAnchor","rel","NavigateAwayIcon","title","messages","opensInNewTab"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,IAAI,GAAGC,qBAAU,CAACC,YAAY;AAC9B,EAAA,YAAY,EAAEC,SAAS;EACvBC,OAAO;EACPC,QAAQ;EACR,GAAGC;AAAK,CACF,KAAI;EACV,MAAM;AAAEC,IAAAA;GAAe,GAAGC,iBAAO,EAAE;EACnC,MAAMC,QAAQ,GAAGC,OAAO,CAACN,OAAO,CAAC,IAAIN,IAAI,KAAKa,SAAS;AACvD,EAAA,MAAMC,OAAO,GAAGb,MAAM,KAAK,QAAQ;AAEnC,EAAA,MAAMc,UAAU,GAAGC,SAAI,CACrB,SAAS,EACT,eAAe,EACf;AACE,IAAA,CAAC,CAAA,QAAA,EAAWd,IAAI,CAAA,CAAE,GAAGA,IAAI;AACzB,IAAA,mBAAmB,EAAEK;GACtB,EACDT,SAAS,CACV;AAED,EAAA,OAAOa,QAAQ,gBACbM,cAAA,CAACC,uBAAe,EAAA;AACdhB,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYG,SAAU;AACtBP,IAAAA,SAAS,EAAEkB,SAAI,CAACD,UAAU,EAAE,cAAc,CAAE;AAC5CR,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAAP,IAAAA,QAAA,EAEhBA;AAAQ,GACM,CAAC,gBAElBoB,eAAA,CAACC,uBAAe,EAAA;AACdpB,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfH,IAAAA,SAAS,EAAEiB,UAAW;AACtB,IAAA,YAAA,EAAYV,SAAU;AACtBgB,IAAAA,GAAG,EAAEP,OAAO,GAAG,YAAY,GAAGD,SAAU;AACxCN,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAA,IAAA,GACbE,KAAK;IAAAT,QAAA,EAAA,CAERA,QAAQ,EAAE,GAAA,EAACe,OAAO,iBAAIG,cAAA,CAACK,kBAAgB,EAAA;AAACC,MAAAA,KAAK,EAAEd,aAAa,CAACe,qBAAQ,CAACC,aAAa;AAAE,MAAG;AAAA,GAC1E,CAClB;AACH;;;;"}
+{"version":3,"file":"Link.js","sources":["../../src/link/Link.tsx"],"sourcesContent":["import { NavigateAway as NavigateAwayIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\nimport { PrimitiveAnchor, PrimitiveButton } from '../primitives';\nimport type { PrimitiveAnchorProps, PrimitiveButtonProps } from '../primitives';\n\nimport { LinkLarge, LinkDefault, Typography } from '../common';\n\nimport messages from './Link.messages';\n\nexport type Props = PrimitiveAnchorProps &\n  Pick<PrimitiveButtonProps, 'onClick'> & { type?: LinkLarge | LinkDefault };\n\n/**\n * Standard Link component with navigate away icon\n *\n * Documentation: https://transferwise.github.io/neptune-web/components/content/Link\n */\nconst Link = ({\n  className,\n  children,\n  href,\n  target,\n  type = Typography.LINK_DEFAULT,\n  'aria-label': ariaLabel,\n  onClick,\n  disabled,\n  ...props\n}: Props) => {\n  const { formatMessage } = useIntl();\n  const isButton = Boolean(onClick) && href === undefined;\n  const isBlank = target === '_blank';\n\n  const classNames = clsx(\n    'np-link',\n    'd-inline-flex',\n    {\n      [`np-text-${type}`]: type,\n      'np-link--disabled': disabled,\n    },\n    className,\n  );\n\n  return isButton ? (\n    <PrimitiveButton\n      type=\"button\"\n      aria-label={ariaLabel}\n      className={clsx(classNames, 'btn-unstyled')}\n      disabled={disabled}\n      onClick={onClick}\n    >\n      {children}\n    </PrimitiveButton>\n  ) : (\n    <PrimitiveAnchor\n      href={href}\n      target={target}\n      className={classNames}\n      aria-label={ariaLabel}\n      rel={isBlank ? 'noreferrer' : undefined}\n      disabled={disabled}\n      onClick={onClick}\n      {...props}\n    >\n      {children} {isBlank && <NavigateAwayIcon title={formatMessage(messages.opensInNewTab)} />}\n    </PrimitiveAnchor>\n  );\n};\n\nexport default Link;\n"],"names":["Link","className","children","href","target","type","Typography","LINK_DEFAULT","ariaLabel","onClick","disabled","props","formatMessage","useIntl","isButton","Boolean","undefined","isBlank","classNames","clsx","_jsx","PrimitiveButton","_jsxs","PrimitiveAnchor","rel","NavigateAwayIcon","title","messages","opensInNewTab"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,IAAI,GAAGC,qBAAU,CAACC,YAAY;AAC9B,EAAA,YAAY,EAAEC,SAAS;EACvBC,OAAO;EACPC,QAAQ;EACR,GAAGC;AAAK,CACF,KAAI;EACV,MAAM;AAAEC,IAAAA;GAAe,GAAGC,iBAAO,EAAE;EACnC,MAAMC,QAAQ,GAAGC,OAAO,CAACN,OAAO,CAAC,IAAIN,IAAI,KAAKa,SAAS;AACvD,EAAA,MAAMC,OAAO,GAAGb,MAAM,KAAK,QAAQ;AAEnC,EAAA,MAAMc,UAAU,GAAGC,SAAI,CACrB,SAAS,EACT,eAAe,EACf;AACE,IAAA,CAAC,CAAA,QAAA,EAAWd,IAAI,CAAA,CAAE,GAAGA,IAAI;AACzB,IAAA,mBAAmB,EAAEK;GACtB,EACDT,SAAS,CACV;AAED,EAAA,OAAOa,QAAQ,gBACbM,cAAA,CAACC,uBAAe,EAAA;AACdhB,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYG,SAAU;AACtBP,IAAAA,SAAS,EAAEkB,SAAI,CAACD,UAAU,EAAE,cAAc,CAAE;AAC5CR,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAAP,IAAAA,QAAA,EAEhBA;AAAQ,GACM,CAAC,gBAElBoB,eAAA,CAACC,uBAAe,EAAA;AACdpB,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfH,IAAAA,SAAS,EAAEiB,UAAW;AACtB,IAAA,YAAA,EAAYV,SAAU;AACtBgB,IAAAA,GAAG,EAAEP,OAAO,GAAG,YAAY,GAAGD,SAAU;AACxCN,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAA,IAAA,GACbE,KAAK;IAAAT,QAAA,EAAA,CAERA,QAAQ,EAAE,GAAA,EAACe,OAAO,iBAAIG,cAAA,CAACK,kBAAgB,EAAA;AAACC,MAAAA,KAAK,EAAEd,aAAa,CAACe,qBAAQ,CAACC,aAAa;AAAE,MAAG;AAAA,GAC1E,CAClB;AACH;;;;"}

package/build/link/Link.mjs

@@ -22,6 +22,7 @@ import '../common/propsValues/variant.mjs';
 import '../common/propsValues/scroll.mjs';
 import '../common/propsValues/markdownNodeType.mjs';
 import '../common/fileType.mjs';
+import '@transferwise/formatting';
 import 'react';
 import '../common/closeButton/CloseButton.messages.mjs';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/build/link/Link.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"Link.mjs","sources":["../../src/link/Link.tsx"],"sourcesContent":["import { NavigateAway as NavigateAwayIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\nimport { PrimitiveAnchor, PrimitiveButton } from '../primitives';\nimport type { PrimitiveAnchorProps, PrimitiveButtonProps } from '../primitives';\n\nimport { LinkLarge, LinkDefault, Typography } from '../common';\n\nimport messages from './Link.messages';\n\nexport type Props = PrimitiveAnchorProps &\n  Pick<PrimitiveButtonProps, 'onClick'> & { type?: LinkLarge | LinkDefault };\n\n/**\n * Standard Link component with navigate away icon\n *\n * Documentation: https://transferwise.github.io/neptune-web/components/content/Link\n */\nconst Link = ({\n  className,\n  children,\n  href,\n  target,\n  type = Typography.LINK_DEFAULT,\n  'aria-label': ariaLabel,\n  onClick,\n  disabled,\n  ...props\n}: Props) => {\n  const { formatMessage } = useIntl();\n  const isButton = Boolean(onClick) && href === undefined;\n  const isBlank = target === '_blank';\n\n  const classNames = clsx(\n    'np-link',\n    'd-inline-flex',\n    {\n      [`np-text-${type}`]: type,\n      'np-link--disabled': disabled,\n    },\n    className,\n  );\n\n  return isButton ? (\n    <PrimitiveButton\n      type=\"button\"\n      aria-label={ariaLabel}\n      className={clsx(classNames, 'btn-unstyled')}\n      disabled={disabled}\n      onClick={onClick}\n    >\n      {children}\n    </PrimitiveButton>\n  ) : (\n    <PrimitiveAnchor\n      href={href}\n      target={target}\n      className={classNames}\n      aria-label={ariaLabel}\n      rel={isBlank ? 'noreferrer' : undefined}\n      disabled={disabled}\n      onClick={onClick}\n      {...props}\n    >\n      {children} {isBlank && <NavigateAwayIcon title={formatMessage(messages.opensInNewTab)} />}\n    </PrimitiveAnchor>\n  );\n};\n\nexport default Link;\n"],"names":["Link","className","children","href","target","type","Typography","LINK_DEFAULT","ariaLabel","onClick","disabled","props","formatMessage","useIntl","isButton","Boolean","undefined","isBlank","classNames","clsx","_jsx","PrimitiveButton","_jsxs","PrimitiveAnchor","rel","NavigateAwayIcon","title","messages","opensInNewTab"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,IAAI,GAAGC,UAAU,CAACC,YAAY;AAC9B,EAAA,YAAY,EAAEC,SAAS;EACvBC,OAAO;EACPC,QAAQ;EACR,GAAGC;AAAK,CACF,KAAI;EACV,MAAM;AAAEC,IAAAA;GAAe,GAAGC,OAAO,EAAE;EACnC,MAAMC,QAAQ,GAAGC,OAAO,CAACN,OAAO,CAAC,IAAIN,IAAI,KAAKa,SAAS;AACvD,EAAA,MAAMC,OAAO,GAAGb,MAAM,KAAK,QAAQ;AAEnC,EAAA,MAAMc,UAAU,GAAGC,IAAI,CACrB,SAAS,EACT,eAAe,EACf;AACE,IAAA,CAAC,CAAA,QAAA,EAAWd,IAAI,CAAA,CAAE,GAAGA,IAAI;AACzB,IAAA,mBAAmB,EAAEK;GACtB,EACDT,SAAS,CACV;AAED,EAAA,OAAOa,QAAQ,gBACbM,GAAA,CAACC,eAAe,EAAA;AACdhB,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYG,SAAU;AACtBP,IAAAA,SAAS,EAAEkB,IAAI,CAACD,UAAU,EAAE,cAAc,CAAE;AAC5CR,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAAP,IAAAA,QAAA,EAEhBA;AAAQ,GACM,CAAC,gBAElBoB,IAAA,CAACC,eAAe,EAAA;AACdpB,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfH,IAAAA,SAAS,EAAEiB,UAAW;AACtB,IAAA,YAAA,EAAYV,SAAU;AACtBgB,IAAAA,GAAG,EAAEP,OAAO,GAAG,YAAY,GAAGD,SAAU;AACxCN,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAA,IAAA,GACbE,KAAK;IAAAT,QAAA,EAAA,CAERA,QAAQ,EAAE,GAAA,EAACe,OAAO,iBAAIG,GAAA,CAACK,YAAgB,EAAA;AAACC,MAAAA,KAAK,EAAEd,aAAa,CAACe,QAAQ,CAACC,aAAa;AAAE,MAAG;AAAA,GAC1E,CAClB;AACH;;;;"}
+{"version":3,"file":"Link.mjs","sources":["../../src/link/Link.tsx"],"sourcesContent":["import { NavigateAway as NavigateAwayIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { useIntl } from 'react-intl';\nimport { PrimitiveAnchor, PrimitiveButton } from '../primitives';\nimport type { PrimitiveAnchorProps, PrimitiveButtonProps } from '../primitives';\n\nimport { LinkLarge, LinkDefault, Typography } from '../common';\n\nimport messages from './Link.messages';\n\nexport type Props = PrimitiveAnchorProps &\n  Pick<PrimitiveButtonProps, 'onClick'> & { type?: LinkLarge | LinkDefault };\n\n/**\n * Standard Link component with navigate away icon\n *\n * Documentation: https://transferwise.github.io/neptune-web/components/content/Link\n */\nconst Link = ({\n  className,\n  children,\n  href,\n  target,\n  type = Typography.LINK_DEFAULT,\n  'aria-label': ariaLabel,\n  onClick,\n  disabled,\n  ...props\n}: Props) => {\n  const { formatMessage } = useIntl();\n  const isButton = Boolean(onClick) && href === undefined;\n  const isBlank = target === '_blank';\n\n  const classNames = clsx(\n    'np-link',\n    'd-inline-flex',\n    {\n      [`np-text-${type}`]: type,\n      'np-link--disabled': disabled,\n    },\n    className,\n  );\n\n  return isButton ? (\n    <PrimitiveButton\n      type=\"button\"\n      aria-label={ariaLabel}\n      className={clsx(classNames, 'btn-unstyled')}\n      disabled={disabled}\n      onClick={onClick}\n    >\n      {children}\n    </PrimitiveButton>\n  ) : (\n    <PrimitiveAnchor\n      href={href}\n      target={target}\n      className={classNames}\n      aria-label={ariaLabel}\n      rel={isBlank ? 'noreferrer' : undefined}\n      disabled={disabled}\n      onClick={onClick}\n      {...props}\n    >\n      {children} {isBlank && <NavigateAwayIcon title={formatMessage(messages.opensInNewTab)} />}\n    </PrimitiveAnchor>\n  );\n};\n\nexport default Link;\n"],"names":["Link","className","children","href","target","type","Typography","LINK_DEFAULT","ariaLabel","onClick","disabled","props","formatMessage","useIntl","isButton","Boolean","undefined","isBlank","classNames","clsx","_jsx","PrimitiveButton","_jsxs","PrimitiveAnchor","rel","NavigateAwayIcon","title","messages","opensInNewTab"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,IAAI,GAAGC,UAAU,CAACC,YAAY;AAC9B,EAAA,YAAY,EAAEC,SAAS;EACvBC,OAAO;EACPC,QAAQ;EACR,GAAGC;AAAK,CACF,KAAI;EACV,MAAM;AAAEC,IAAAA;GAAe,GAAGC,OAAO,EAAE;EACnC,MAAMC,QAAQ,GAAGC,OAAO,CAACN,OAAO,CAAC,IAAIN,IAAI,KAAKa,SAAS;AACvD,EAAA,MAAMC,OAAO,GAAGb,MAAM,KAAK,QAAQ;AAEnC,EAAA,MAAMc,UAAU,GAAGC,IAAI,CACrB,SAAS,EACT,eAAe,EACf;AACE,IAAA,CAAC,CAAA,QAAA,EAAWd,IAAI,CAAA,CAAE,GAAGA,IAAI;AACzB,IAAA,mBAAmB,EAAEK;GACtB,EACDT,SAAS,CACV;AAED,EAAA,OAAOa,QAAQ,gBACbM,GAAA,CAACC,eAAe,EAAA;AACdhB,IAAAA,IAAI,EAAC,QAAQ;AACb,IAAA,YAAA,EAAYG,SAAU;AACtBP,IAAAA,SAAS,EAAEkB,IAAI,CAACD,UAAU,EAAE,cAAc,CAAE;AAC5CR,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAAP,IAAAA,QAAA,EAEhBA;AAAQ,GACM,CAAC,gBAElBoB,IAAA,CAACC,eAAe,EAAA;AACdpB,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfH,IAAAA,SAAS,EAAEiB,UAAW;AACtB,IAAA,YAAA,EAAYV,SAAU;AACtBgB,IAAAA,GAAG,EAAEP,OAAO,GAAG,YAAY,GAAGD,SAAU;AACxCN,IAAAA,QAAQ,EAAEA,QAAS;AACnBD,IAAAA,OAAO,EAAEA,OAAQ;AAAA,IAAA,GACbE,KAAK;IAAAT,QAAA,EAAA,CAERA,QAAQ,EAAE,GAAA,EAACe,OAAO,iBAAIG,GAAA,CAACK,YAAgB,EAAA;AAACC,MAAAA,KAAK,EAAEd,aAAa,CAACe,QAAQ,CAACC,aAAa;AAAE,MAAG;AAAA,GAC1E,CAClB;AACH;;;;"}

package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js

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

package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemAdditionalInfo.js","sources":["../../../src/listItem/AdditionalInfo/ListItemAdditionalInfo.tsx"],"sourcesContent":["import { PropsWithChildren, useContext } from 'react';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport Body from '../../body';\nimport Link, { type LinkProps } from '../../link';\nimport { Typography } from '../../common';\n\nexport type ListItemAdditionalInfoProps = PropsWithChildren<{\n  /**\n   * Props object to be passed to the [Link](https://storybook.wise.design/?path=/docs/typography-link--docs) component.\n   */\n  action?: { label: string } & Pick<LinkProps, 'href' | 'onClick' | 'target'>;\n}>;\n\nexport const AdditionalInfo = function ({ children, action }: ListItemAdditionalInfoProps) {\n  const { ids } = useContext<ListItemContextData>(ListItemContext);\n\n  return (\n    <Body\n      type={Typography.BODY_DEFAULT}\n      id={ids.additionalInfo}\n      className=\"wds-list-item-additional-info\"\n    >\n      {children}\n      {action ? (\n        <>\n          {' '}\n          <Link href={action.href} target={action.target} onClick={action.onClick}>\n            {action.label}\n          </Link>\n        </>\n      ) : null}\n    </Body>\n  );\n};\n\nAdditionalInfo.displayName = 'ListItem.AdditionalInfo';\n"],"names":["AdditionalInfo","children","action","ids","useContext","ListItemContext","_jsxs","Body","type","Typography","BODY_DEFAULT","id","additionalInfo","className","_Fragment","_jsx","Link","href","target","onClick","label","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAMA,cAAc,GAAG,UAAU;EAAEC,QAAQ;AAAEC,EAAAA;AAAM,CAA+B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAG,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;EAEhE,oBACEC,eAAA,CAACC,YAAI,EAAA;IACHC,IAAI,EAAEC,qBAAU,CAACC,YAAa;IAC9BC,EAAE,EAAER,GAAG,CAACS,cAAe;AACvBC,IAAAA,SAAS,EAAC,+BAA+B;AAAAZ,IAAAA,QAAA,GAExCA,QAAQ,EACRC,MAAM,gBACLI,eAAA,CAAAQ,mBAAA,EAAA;AAAAb,MAAAA,QAAA,EAAA,CACG,GAAG,eACJc,cAAA,CAACC,YAAI,EAAA;QAACC,IAAI,EAAEf,MAAM,CAACe,IAAK;QAACC,MAAM,EAAEhB,MAAM,CAACgB,MAAO;QAACC,OAAO,EAAEjB,MAAM,CAACiB,OAAQ;QAAAlB,QAAA,EACrEC,MAAM,CAACkB;AAAK,OACT,CACR;KAAA,CAAG,GACD,IAAI;AAAA,GACJ,CAAC;AAEX;AAEApB,cAAc,CAACqB,WAAW,GAAG,yBAAyB;;;;"}
+{"version":3,"file":"ListItemAdditionalInfo.js","sources":["../../../src/listItem/AdditionalInfo/ListItemAdditionalInfo.tsx"],"sourcesContent":["import { PropsWithChildren, useContext } from 'react';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport Body from '../../body';\nimport Link, { type LinkProps } from '../../link';\nimport { Typography } from '../../common';\n\nexport type ListItemAdditionalInfoProps = PropsWithChildren<{\n  /**\n   * Props object to be passed to the [Link](https://storybook.wise.design/?path=/docs/typography-link--docs) component.\n   */\n  action?: { label: string } & Pick<LinkProps, 'href' | 'onClick' | 'target'>;\n}>;\n\nexport const AdditionalInfo = function ({ children, action }: ListItemAdditionalInfoProps) {\n  const { ids } = useContext<ListItemContextData>(ListItemContext);\n\n  return (\n    <Body\n      type={Typography.BODY_DEFAULT}\n      id={ids.additionalInfo}\n      className=\"wds-list-item-additional-info\"\n    >\n      {children}\n      {action ? (\n        <>\n          {' '}\n          <Link href={action.href} target={action.target} onClick={action.onClick}>\n            {action.label}\n          </Link>\n        </>\n      ) : null}\n    </Body>\n  );\n};\n\nAdditionalInfo.displayName = 'ListItem.AdditionalInfo';\n"],"names":["AdditionalInfo","children","action","ids","useContext","ListItemContext","_jsxs","Body","type","Typography","BODY_DEFAULT","id","additionalInfo","className","_Fragment","_jsx","Link","href","target","onClick","label","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAMA,cAAc,GAAG,UAAU;EAAEC,QAAQ;AAAEC,EAAAA;AAAM,CAA+B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAG,GAAE,GAAGC,gBAAU,CAAsBC,+BAAe,CAAC;EAEhE,oBACEC,eAAA,CAACC,YAAI,EAAA;IACHC,IAAI,EAAEC,qBAAU,CAACC,YAAa;IAC9BC,EAAE,EAAER,GAAG,CAACS,cAAe;AACvBC,IAAAA,SAAS,EAAC,+BAA+B;AAAAZ,IAAAA,QAAA,GAExCA,QAAQ,EACRC,MAAM,gBACLI,eAAA,CAAAQ,mBAAA,EAAA;AAAAb,MAAAA,QAAA,EAAA,CACG,GAAG,eACJc,cAAA,CAACC,YAAI,EAAA;QAACC,IAAI,EAAEf,MAAM,CAACe,IAAK;QAACC,MAAM,EAAEhB,MAAM,CAACgB,MAAO;QAACC,OAAO,EAAEjB,MAAM,CAACiB,OAAQ;QAAAlB,QAAA,EACrEC,MAAM,CAACkB;AAAK,OACT,CACR;KAAA,CAAG,GACD,IAAI;AAAA,GACJ,CAAC;AAEX;AAEApB,cAAc,CAACqB,WAAW,GAAG,yBAAyB;;;;"}

package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs

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

package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemAdditionalInfo.mjs","sources":["../../../src/listItem/AdditionalInfo/ListItemAdditionalInfo.tsx"],"sourcesContent":["import { PropsWithChildren, useContext } from 'react';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport Body from '../../body';\nimport Link, { type LinkProps } from '../../link';\nimport { Typography } from '../../common';\n\nexport type ListItemAdditionalInfoProps = PropsWithChildren<{\n  /**\n   * Props object to be passed to the [Link](https://storybook.wise.design/?path=/docs/typography-link--docs) component.\n   */\n  action?: { label: string } & Pick<LinkProps, 'href' | 'onClick' | 'target'>;\n}>;\n\nexport const AdditionalInfo = function ({ children, action }: ListItemAdditionalInfoProps) {\n  const { ids } = useContext<ListItemContextData>(ListItemContext);\n\n  return (\n    <Body\n      type={Typography.BODY_DEFAULT}\n      id={ids.additionalInfo}\n      className=\"wds-list-item-additional-info\"\n    >\n      {children}\n      {action ? (\n        <>\n          {' '}\n          <Link href={action.href} target={action.target} onClick={action.onClick}>\n            {action.label}\n          </Link>\n        </>\n      ) : null}\n    </Body>\n  );\n};\n\nAdditionalInfo.displayName = 'ListItem.AdditionalInfo';\n"],"names":["AdditionalInfo","children","action","ids","useContext","ListItemContext","_jsxs","Body","type","Typography","BODY_DEFAULT","id","additionalInfo","className","_Fragment","_jsx","Link","href","target","onClick","label","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAMA,cAAc,GAAG,UAAU;EAAEC,QAAQ;AAAEC,EAAAA;AAAM,CAA+B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAG,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;EAEhE,oBACEC,IAAA,CAACC,IAAI,EAAA;IACHC,IAAI,EAAEC,UAAU,CAACC,YAAa;IAC9BC,EAAE,EAAER,GAAG,CAACS,cAAe;AACvBC,IAAAA,SAAS,EAAC,+BAA+B;AAAAZ,IAAAA,QAAA,GAExCA,QAAQ,EACRC,MAAM,gBACLI,IAAA,CAAAQ,QAAA,EAAA;AAAAb,MAAAA,QAAA,EAAA,CACG,GAAG,eACJc,GAAA,CAACC,IAAI,EAAA;QAACC,IAAI,EAAEf,MAAM,CAACe,IAAK;QAACC,MAAM,EAAEhB,MAAM,CAACgB,MAAO;QAACC,OAAO,EAAEjB,MAAM,CAACiB,OAAQ;QAAAlB,QAAA,EACrEC,MAAM,CAACkB;AAAK,OACT,CACR;KAAA,CAAG,GACD,IAAI;AAAA,GACJ,CAAC;AAEX;AAEApB,cAAc,CAACqB,WAAW,GAAG,yBAAyB;;;;"}
+{"version":3,"file":"ListItemAdditionalInfo.mjs","sources":["../../../src/listItem/AdditionalInfo/ListItemAdditionalInfo.tsx"],"sourcesContent":["import { PropsWithChildren, useContext } from 'react';\nimport { ListItemContext, type ListItemContextData } from '../ListItemContext';\nimport Body from '../../body';\nimport Link, { type LinkProps } from '../../link';\nimport { Typography } from '../../common';\n\nexport type ListItemAdditionalInfoProps = PropsWithChildren<{\n  /**\n   * Props object to be passed to the [Link](https://storybook.wise.design/?path=/docs/typography-link--docs) component.\n   */\n  action?: { label: string } & Pick<LinkProps, 'href' | 'onClick' | 'target'>;\n}>;\n\nexport const AdditionalInfo = function ({ children, action }: ListItemAdditionalInfoProps) {\n  const { ids } = useContext<ListItemContextData>(ListItemContext);\n\n  return (\n    <Body\n      type={Typography.BODY_DEFAULT}\n      id={ids.additionalInfo}\n      className=\"wds-list-item-additional-info\"\n    >\n      {children}\n      {action ? (\n        <>\n          {' '}\n          <Link href={action.href} target={action.target} onClick={action.onClick}>\n            {action.label}\n          </Link>\n        </>\n      ) : null}\n    </Body>\n  );\n};\n\nAdditionalInfo.displayName = 'ListItem.AdditionalInfo';\n"],"names":["AdditionalInfo","children","action","ids","useContext","ListItemContext","_jsxs","Body","type","Typography","BODY_DEFAULT","id","additionalInfo","className","_Fragment","_jsx","Link","href","target","onClick","label","displayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAaO,MAAMA,cAAc,GAAG,UAAU;EAAEC,QAAQ;AAAEC,EAAAA;AAAM,CAA+B,EAAA;EACvF,MAAM;AAAEC,IAAAA;AAAG,GAAE,GAAGC,UAAU,CAAsBC,eAAe,CAAC;EAEhE,oBACEC,IAAA,CAACC,IAAI,EAAA;IACHC,IAAI,EAAEC,UAAU,CAACC,YAAa;IAC9BC,EAAE,EAAER,GAAG,CAACS,cAAe;AACvBC,IAAAA,SAAS,EAAC,+BAA+B;AAAAZ,IAAAA,QAAA,GAExCA,QAAQ,EACRC,MAAM,gBACLI,IAAA,CAAAQ,QAAA,EAAA;AAAAb,MAAAA,QAAA,EAAA,CACG,GAAG,eACJc,GAAA,CAACC,IAAI,EAAA;QAACC,IAAI,EAAEf,MAAM,CAACe,IAAK;QAACC,MAAM,EAAEhB,MAAM,CAACgB,MAAO;QAACC,OAAO,EAAEjB,MAAM,CAACiB,OAAQ;QAAAlB,QAAA,EACrEC,MAAM,CAACkB;AAAK,OACT,CACR;KAAA,CAAG,GACD,IAAI;AAAA,GACJ,CAAC;AAEX;AAEApB,cAAc,CAACqB,WAAW,GAAG,yBAAyB;;;;"}

package/build/listItem/ListItem.js

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