@transferwise/components 0.0.0-experimental-28eac06 → 0.0.0-experimental-9b6d886

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (202) hide show
  1. package/build/alert/Alert.js +17 -17
  2. package/build/alert/Alert.js.map +1 -1
  3. package/build/alert/Alert.mjs +14 -14
  4. package/build/alert/Alert.mjs.map +1 -1
  5. package/build/avatarLayout/AvatarLayout.js +2 -9
  6. package/build/avatarLayout/AvatarLayout.js.map +1 -1
  7. package/build/avatarLayout/AvatarLayout.mjs +2 -9
  8. package/build/avatarLayout/AvatarLayout.mjs.map +1 -1
  9. package/build/button/Button.js +79 -86
  10. package/build/button/Button.js.map +1 -1
  11. package/build/button/Button.mjs +80 -87
  12. package/build/button/Button.mjs.map +1 -1
  13. package/build/circularButton/CircularButton.js.map +1 -1
  14. package/build/circularButton/CircularButton.mjs.map +1 -1
  15. package/build/common/action/Action.js +15 -26
  16. package/build/common/action/Action.js.map +1 -1
  17. package/build/common/action/Action.mjs +15 -26
  18. package/build/common/action/Action.mjs.map +1 -1
  19. package/build/common/propsValues/sentiment.js +0 -1
  20. package/build/common/propsValues/sentiment.js.map +1 -1
  21. package/build/common/propsValues/sentiment.mjs +0 -1
  22. package/build/common/propsValues/sentiment.mjs.map +1 -1
  23. package/build/criticalBanner/CriticalCommsBanner.js +73 -10
  24. package/build/criticalBanner/CriticalCommsBanner.js.map +1 -1
  25. package/build/criticalBanner/CriticalCommsBanner.mjs +74 -11
  26. package/build/criticalBanner/CriticalCommsBanner.mjs.map +1 -1
  27. package/build/header/Header.js +2 -2
  28. package/build/header/Header.js.map +1 -1
  29. package/build/header/Header.mjs +1 -1
  30. package/build/i18n/en.json +0 -1
  31. package/build/i18n/en.json.js +0 -1
  32. package/build/i18n/en.json.js.map +1 -1
  33. package/build/i18n/en.json.mjs +0 -1
  34. package/build/i18n/en.json.mjs.map +1 -1
  35. package/build/i18n/ja.json +1 -0
  36. package/build/i18n/ja.json.js +1 -0
  37. package/build/i18n/ja.json.js.map +1 -1
  38. package/build/i18n/ja.json.mjs +1 -0
  39. package/build/i18n/ja.json.mjs.map +1 -1
  40. package/build/i18n/pt.json +1 -0
  41. package/build/i18n/pt.json.js +1 -0
  42. package/build/i18n/pt.json.js.map +1 -1
  43. package/build/i18n/pt.json.mjs +1 -0
  44. package/build/i18n/pt.json.mjs.map +1 -1
  45. package/build/i18n/ru.json +1 -0
  46. package/build/i18n/ru.json.js +1 -0
  47. package/build/i18n/ru.json.js.map +1 -1
  48. package/build/i18n/ru.json.mjs +1 -0
  49. package/build/i18n/ru.json.mjs.map +1 -1
  50. package/build/i18n/zh-HK.json +1 -0
  51. package/build/i18n/zh-HK.json.js +1 -0
  52. package/build/i18n/zh-HK.json.js.map +1 -1
  53. package/build/i18n/zh-HK.json.mjs +1 -0
  54. package/build/i18n/zh-HK.json.mjs.map +1 -1
  55. package/build/index.js +2 -2
  56. package/build/index.mjs +1 -1
  57. package/build/link/Link.js +3 -8
  58. package/build/link/Link.js.map +1 -1
  59. package/build/link/Link.mjs +3 -8
  60. package/build/link/Link.mjs.map +1 -1
  61. package/build/main.css +70 -267
  62. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js +4 -2
  63. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.js.map +1 -1
  64. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs +4 -2
  65. package/build/primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs.map +1 -1
  66. package/build/primitives/PrimitiveButton/src/PrimitiveButton.js +5 -3
  67. package/build/primitives/PrimitiveButton/src/PrimitiveButton.js.map +1 -1
  68. package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs +5 -3
  69. package/build/primitives/PrimitiveButton/src/PrimitiveButton.mjs.map +1 -1
  70. package/build/select/Select.js +2 -2
  71. package/build/select/Select.js.map +1 -1
  72. package/build/select/Select.mjs +1 -1
  73. package/build/statusIcon/StatusIcon.js +1 -5
  74. package/build/statusIcon/StatusIcon.js.map +1 -1
  75. package/build/statusIcon/StatusIcon.messages.js +0 -3
  76. package/build/statusIcon/StatusIcon.messages.js.map +1 -1
  77. package/build/statusIcon/StatusIcon.messages.mjs +0 -3
  78. package/build/statusIcon/StatusIcon.messages.mjs.map +1 -1
  79. package/build/statusIcon/StatusIcon.mjs +1 -5
  80. package/build/statusIcon/StatusIcon.mjs.map +1 -1
  81. package/build/styles/avatarLayout/AvatarLayout.css +0 -11
  82. package/build/styles/button/Button.css +15 -230
  83. package/build/styles/criticalBanner/CriticalCommsBanner.css +73 -21
  84. package/build/styles/main.css +70 -267
  85. package/build/types/alert/Alert.d.ts +4 -3
  86. package/build/types/alert/Alert.d.ts.map +1 -1
  87. package/build/types/avatarLayout/AvatarLayout.d.ts.map +1 -1
  88. package/build/types/button/Button.d.ts +23 -2
  89. package/build/types/button/Button.d.ts.map +1 -1
  90. package/build/types/button/index.d.ts +2 -2
  91. package/build/types/button/index.d.ts.map +1 -1
  92. package/build/types/circularButton/CircularButton.d.ts.map +1 -1
  93. package/build/types/common/action/Action.d.ts +2 -5
  94. package/build/types/common/action/Action.d.ts.map +1 -1
  95. package/build/types/common/propsValues/sentiment.d.ts +0 -1
  96. package/build/types/common/propsValues/sentiment.d.ts.map +1 -1
  97. package/build/types/criticalBanner/CriticalCommsBanner.d.ts.map +1 -1
  98. package/build/types/index.d.ts +1 -0
  99. package/build/types/index.d.ts.map +1 -1
  100. package/build/types/link/Link.d.ts +2 -2
  101. package/build/types/link/Link.d.ts.map +1 -1
  102. package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.d.ts.map +1 -1
  103. package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts +2 -6
  104. package/build/types/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.d.ts.map +1 -1
  105. package/build/types/primitives/PrimitiveButton/src/PrimitiveButton.d.ts.map +1 -1
  106. package/build/types/statusIcon/StatusIcon.d.ts.map +1 -1
  107. package/build/types/statusIcon/StatusIcon.messages.d.ts +0 -5
  108. package/build/types/statusIcon/StatusIcon.messages.d.ts.map +1 -1
  109. package/build/types/test-utils/index.d.ts +0 -2
  110. package/build/types/test-utils/index.d.ts.map +1 -1
  111. package/build/types/test-utils/story-config.d.ts +1 -1
  112. package/build/types/test-utils/story-config.d.ts.map +1 -1
  113. package/build/upload/steps/completeStep/completeStep.js +2 -2
  114. package/build/upload/steps/completeStep/completeStep.js.map +1 -1
  115. package/build/upload/steps/completeStep/completeStep.mjs +1 -1
  116. package/build/upload/steps/processingStep/processingStep.js +2 -2
  117. package/build/upload/steps/processingStep/processingStep.js.map +1 -1
  118. package/build/upload/steps/processingStep/processingStep.mjs +1 -1
  119. package/build/uploadInput/UploadInput.js +3 -3
  120. package/build/uploadInput/UploadInput.js.map +1 -1
  121. package/build/uploadInput/UploadInput.mjs +1 -1
  122. package/package.json +3 -3
  123. package/src/alert/Alert.spec.tsx +30 -0
  124. package/src/alert/Alert.story.tsx +1 -34
  125. package/src/alert/Alert.tests.story.tsx +1 -1
  126. package/src/alert/Alert.tsx +15 -20
  127. package/src/avatarLayout/AvatarLayout.css +0 -11
  128. package/src/avatarLayout/AvatarLayout.less +1 -18
  129. package/src/avatarLayout/AvatarLayout.tsx +2 -10
  130. package/src/button/Button.css +15 -230
  131. package/src/button/Button.less +14 -242
  132. package/src/button/Button.spec.tsx +226 -215
  133. package/src/button/Button.story.tsx +134 -761
  134. package/src/button/Button.tsx +132 -103
  135. package/src/button/__snapshots__/Button.spec.tsx.snap +309 -0
  136. package/src/button/index.ts +3 -2
  137. package/src/circularButton/CircularButton.tsx +0 -1
  138. package/src/common/action/Action.tsx +22 -40
  139. package/src/common/propsValues/sentiment.ts +0 -1
  140. package/src/criticalBanner/CriticalCommsBanner.css +73 -21
  141. package/src/criticalBanner/CriticalCommsBanner.less +70 -24
  142. package/src/criticalBanner/CriticalCommsBanner.story.tsx +4 -26
  143. package/src/criticalBanner/CriticalCommsBanner.tsx +50 -8
  144. package/src/field/Field.story.tsx +1 -1
  145. package/src/flowNavigation/__snapshots__/FlowNavigation.spec.js.snap +2 -1
  146. package/src/i18n/en.json +0 -1
  147. package/src/i18n/ja.json +1 -0
  148. package/src/i18n/pt.json +1 -0
  149. package/src/i18n/ru.json +1 -0
  150. package/src/i18n/zh-HK.json +1 -0
  151. package/src/index.ts +1 -0
  152. package/src/inputs/SelectInput.story.tsx +1 -1
  153. package/src/label/Label.story.tsx +1 -1
  154. package/src/link/Link.tsx +6 -15
  155. package/src/main.css +70 -267
  156. package/src/main.less +0 -1
  157. package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.tsx +8 -2
  158. package/src/primitives/PrimitiveAnchor/src/PrimitiveAnchor.types.ts +2 -7
  159. package/src/primitives/PrimitiveAnchor/test/PrimitiveAnchor.spec.tsx +3 -1
  160. package/src/primitives/PrimitiveButton/src/PrimitiveButton.tsx +12 -4
  161. package/src/primitives/PrimitiveButton/test/PrimitiveButton.spec.tsx +13 -16
  162. package/src/radio/Radio.spec.tsx +73 -0
  163. package/src/radio/Radio.story.tsx +22 -52
  164. package/src/radioGroup/RadioGroup.spec.tsx +91 -0
  165. package/src/radioGroup/RadioGroup.story.tsx +3 -5
  166. package/src/statusIcon/StatusIcon.less +0 -1
  167. package/src/statusIcon/StatusIcon.messages.ts +0 -6
  168. package/src/statusIcon/StatusIcon.tsx +1 -8
  169. package/src/test-utils/Parameters.d.ts +1 -9
  170. package/src/test-utils/story-config.ts +1 -10
  171. package/build/button/Button.resolver.js +0 -74
  172. package/build/button/Button.resolver.js.map +0 -1
  173. package/build/button/Button.resolver.mjs +0 -72
  174. package/build/button/Button.resolver.mjs.map +0 -1
  175. package/build/button/LegacyButton.js +0 -114
  176. package/build/button/LegacyButton.js.map +0 -1
  177. package/build/button/LegacyButton.mjs +0 -112
  178. package/build/button/LegacyButton.mjs.map +0 -1
  179. package/build/styles/button/Button.vars.css +0 -46
  180. package/build/styles/button/LegacyButton.css +0 -23
  181. package/build/types/button/Button.resolver.d.ts +0 -35
  182. package/build/types/button/Button.resolver.d.ts.map +0 -1
  183. package/build/types/button/Button.types.d.ts +0 -70
  184. package/build/types/button/Button.types.d.ts.map +0 -1
  185. package/build/types/button/LegacyButton.d.ts +0 -44
  186. package/build/types/button/LegacyButton.d.ts.map +0 -1
  187. package/src/button/Button.accessibility.docs.mdx +0 -103
  188. package/src/button/Button.resolver.tsx +0 -73
  189. package/src/button/Button.tests.story.tsx +0 -27
  190. package/src/button/Button.types.ts +0 -92
  191. package/src/button/Button.vars.css +0 -46
  192. package/src/button/Button.vars.less +0 -55
  193. package/src/button/LegacyButton.css +0 -23
  194. package/src/button/LegacyButton.less +0 -24
  195. package/src/button/LegacyButton.spec.tsx +0 -147
  196. package/src/button/LegacyButton.story.tsx +0 -228
  197. package/src/button/LegacyButton.tsx +0 -177
  198. package/src/radio/Radio.rtl.spec.tsx +0 -24
  199. package/src/radio/Radio.spec.js +0 -76
  200. package/src/radio/__snapshots__/Radio.rtl.spec.tsx.snap +0 -49
  201. package/src/radioGroup/RadioGroup.rtl.spec.tsx +0 -30
  202. package/src/radioGroup/RadioGroup.spec.js +0 -90
@@ -1,8 +1,36 @@
1
1
  'use strict';
2
2
 
3
- var Alert = require('../alert/Alert.js');
3
+ var icons = require('@transferwise/icons');
4
+ var componentsTheming = require('@wise/components-theming');
4
5
  var clsx = require('clsx');
6
+ var avatarTypes = require('../avatar/avatarTypes.js');
7
+ var Avatar = require('../avatar/Avatar.js');
8
+ var Body = require('../body/Body.js');
9
+ var Button = require('../button/Button.js');
10
+ require('../common/theme.js');
11
+ require('../common/direction.js');
12
+ var control = require('../common/propsValues/control.js');
13
+ require('../common/propsValues/breakpoint.js');
14
+ var size = require('../common/propsValues/size.js');
15
+ var typography = require('../common/propsValues/typography.js');
16
+ require('../common/propsValues/width.js');
17
+ require('../common/propsValues/type.js');
18
+ require('../common/propsValues/dateMode.js');
19
+ require('../common/propsValues/monthFormat.js');
20
+ require('../common/propsValues/position.js');
21
+ require('../common/propsValues/layouts.js');
22
+ require('../common/propsValues/status.js');
23
+ require('../common/propsValues/sentiment.js');
24
+ require('../common/propsValues/profileType.js');
25
+ require('../common/propsValues/variant.js');
26
+ require('../common/propsValues/scroll.js');
27
+ require('../common/propsValues/markdownNodeType.js');
28
+ require('../common/fileType.js');
29
+ require('react');
30
+ require('react-intl');
31
+ require('../common/closeButton/CloseButton.messages.js');
5
32
  var jsxRuntime = require('react/jsx-runtime');
33
+ var Title = require('../title/Title.js');
6
34
 
7
35
  function CriticalCommsBanner({
8
36
  title,
@@ -10,17 +38,52 @@ function CriticalCommsBanner({
10
38
  action,
11
39
  className
12
40
  }) {
41
+ const {
42
+ isModern
43
+ } = componentsTheming.useTheme();
13
44
  return /*#__PURE__*/jsxRuntime.jsx("div", {
14
45
  className: clsx.clsx('critical-comms', className),
15
- children: /*#__PURE__*/jsxRuntime.jsx(Alert.default, {
16
- title: title,
17
- message: subtitle,
18
- action: {
19
- target: action?.href,
20
- text: action?.label
21
- },
22
- className: className,
23
- type: "critical"
46
+ children: /*#__PURE__*/jsxRuntime.jsxs("div", {
47
+ className: "critical-comms-body",
48
+ children: [/*#__PURE__*/jsxRuntime.jsx(Avatar, {
49
+ size: size.Size.MEDIUM,
50
+ type: avatarTypes.AvatarType.ICON,
51
+ className: clsx.clsx(isModern ? 'm-r-2' : 'm-r-1'),
52
+ backgroundColor: isModern ? 'var(--color-sentiment-negative)' : 'var(--color-background-negative)',
53
+ children: isModern ? /*#__PURE__*/jsxRuntime.jsx(icons.AlertCircleFill, {}) : /*#__PURE__*/jsxRuntime.jsx(icons.Alert, {
54
+ size: 24
55
+ })
56
+ }), /*#__PURE__*/jsxRuntime.jsxs("div", {
57
+ className: "critical-comms-content d-flex align-items-center flex-grow-1",
58
+ children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
59
+ className: clsx.clsx('flex-grow-1', {
60
+ 'p-x-2': !isModern
61
+ }),
62
+ children: [/*#__PURE__*/jsxRuntime.jsx(Title, {
63
+ type: isModern ? typography.Typography.TITLE_BODY : typography.Typography.TITLE_GROUP,
64
+ className: "critical-comms--title",
65
+ children: title
66
+ }), /*#__PURE__*/jsxRuntime.jsx(Body, {
67
+ className: "critical-comms--subtitle",
68
+ children: subtitle
69
+ })]
70
+ }), action ? /*#__PURE__*/jsxRuntime.jsx("div", {
71
+ className: "critical-comms--cta",
72
+ children: /*#__PURE__*/jsxRuntime.jsx(Button, {
73
+ block: isModern,
74
+ size: size.Size.SMALL,
75
+ type: control.ControlType.NEGATIVE,
76
+ priority: isModern ? control.Priority.SECONDARY : control.Priority.PRIMARY,
77
+ className: "cta-btn",
78
+ onClick: () => {
79
+ if (action) {
80
+ window.location.href = action.href;
81
+ }
82
+ },
83
+ children: action.label
84
+ })
85
+ }) : null]
86
+ })]
24
87
  })
25
88
  });
26
89
  }
@@ -1 +1 @@
1
- {"version":3,"file":"CriticalCommsBanner.js","sources":["../../src/criticalBanner/CriticalCommsBanner.tsx"],"sourcesContent":["import Alert from '../alert';\nimport { clsx } from 'clsx';\n\nexport type CriticalCommsBannerProps = {\n title: string;\n subtitle?: string;\n action?: {\n label: string;\n href: string;\n };\n className?: string;\n};\n\nfunction CriticalCommsBanner({ title, subtitle, action, className }: CriticalCommsBannerProps) {\n return (\n <div className={clsx('critical-comms', className)}>\n <Alert\n title={title}\n message={subtitle}\n action={{ target: action?.href, text: action?.label }}\n className={className}\n type=\"critical\"\n />\n </div>\n );\n}\n\nexport default CriticalCommsBanner;\n"],"names":["CriticalCommsBanner","title","subtitle","action","className","_jsx","clsx","children","Alert","message","target","href","text","label","type"],"mappings":";;;;;;AAaA,SAASA,mBAAmBA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;AAAEC,EAAAA,SAAAA;AAAqC,CAAA,EAAA;AAC3F,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKD,IAAAA,SAAS,EAAEE,SAAI,CAAC,gBAAgB,EAAEF,SAAS,CAAE;IAAAG,QAAA,eAChDF,cAAA,CAACG,aAAK,EAAA;AACJP,MAAAA,KAAK,EAAEA,KAAM;AACbQ,MAAAA,OAAO,EAAEP,QAAS;AAClBC,MAAAA,MAAM,EAAE;QAAEO,MAAM,EAAEP,MAAM,EAAEQ,IAAI;QAAEC,IAAI,EAAET,MAAM,EAAEU,KAAAA;OAAQ;AACtDT,MAAAA,SAAS,EAAEA,SAAU;AACrBU,MAAAA,IAAI,EAAC,UAAA;KAET,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
1
+ {"version":3,"file":"CriticalCommsBanner.js","sources":["../../src/criticalBanner/CriticalCommsBanner.tsx"],"sourcesContent":["import { Alert as DangerIcon, AlertCircleFill } from '@transferwise/icons';\nimport { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Avatar, { AvatarType } from '../avatar';\nimport Body from '../body';\nimport Button from '../button';\nimport { ControlType, Priority, Size, Typography } from '../common';\nimport Title from '../title';\n\nexport type CriticalCommsBannerProps = {\n title: string;\n subtitle?: string;\n action?: {\n label: string;\n href: string;\n };\n className?: string;\n};\n\nfunction CriticalCommsBanner({ title, subtitle, action, className }: CriticalCommsBannerProps) {\n const { isModern } = useTheme();\n return (\n <div className={clsx('critical-comms', className)}>\n <div className=\"critical-comms-body\">\n <Avatar\n size={Size.MEDIUM}\n type={AvatarType.ICON}\n className={clsx(isModern ? 'm-r-2' : 'm-r-1')}\n backgroundColor={\n isModern ? 'var(--color-sentiment-negative)' : 'var(--color-background-negative)'\n }\n >\n {isModern ? <AlertCircleFill /> : <DangerIcon size={24} />}\n </Avatar>\n <div className=\"critical-comms-content d-flex align-items-center flex-grow-1\">\n <div className={clsx('flex-grow-1', { 'p-x-2': !isModern })}>\n <Title\n type={isModern ? Typography.TITLE_BODY : Typography.TITLE_GROUP}\n className=\"critical-comms--title\"\n >\n {title}\n </Title>\n <Body className=\"critical-comms--subtitle\">{subtitle}</Body>\n </div>\n {action ? (\n <div className=\"critical-comms--cta\">\n <Button\n block={isModern}\n size={Size.SMALL}\n type={ControlType.NEGATIVE}\n priority={isModern ? Priority.SECONDARY : Priority.PRIMARY}\n className=\"cta-btn\"\n onClick={() => {\n if (action) {\n window.location.href = action.href;\n }\n }}\n >\n {action.label}\n </Button>\n </div>\n ) : null}\n </div>\n </div>\n </div>\n );\n}\n\nexport default CriticalCommsBanner;\n"],"names":["CriticalCommsBanner","title","subtitle","action","className","isModern","useTheme","_jsx","clsx","children","_jsxs","Avatar","size","Size","MEDIUM","type","AvatarType","ICON","backgroundColor","AlertCircleFill","DangerIcon","Title","Typography","TITLE_BODY","TITLE_GROUP","Body","Button","block","SMALL","ControlType","NEGATIVE","priority","Priority","SECONDARY","PRIMARY","onClick","window","location","href","label"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,SAASA,mBAAmBA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;AAAEC,EAAAA,SAAAA;AAAqC,CAAA,EAAA;EAC3F,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,0BAAQ,EAAE,CAAA;AAC/B,EAAA,oBACEC,cAAA,CAAA,KAAA,EAAA;AAAKH,IAAAA,SAAS,EAAEI,SAAI,CAAC,gBAAgB,EAAEJ,SAAS,CAAE;AAAAK,IAAAA,QAAA,eAChDC,eAAA,CAAA,KAAA,EAAA;AAAKN,MAAAA,SAAS,EAAC,qBAAqB;MAAAK,QAAA,EAAA,cAClCF,cAAA,CAACI,MAAM,EAAA;QACLC,IAAI,EAAEC,SAAI,CAACC,MAAO;QAClBC,IAAI,EAAEC,sBAAU,CAACC,IAAK;QACtBb,SAAS,EAAEI,SAAI,CAACH,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAE;AAC9Ca,QAAAA,eAAe,EACbb,QAAQ,GAAG,iCAAiC,GAAG,kCAChD;QAAAI,QAAA,EAEAJ,QAAQ,gBAAGE,cAAA,CAACY,qBAAe,EAAA,EAAG,CAAA,gBAAGZ,cAAA,CAACa,WAAU,EAAA;AAACR,UAAAA,IAAI,EAAE,EAAA;SAAG,CAAA;OACjD,CACR,eAAAF,eAAA,CAAA,KAAA,EAAA;AAAKN,QAAAA,SAAS,EAAC,8DAA8D;AAAAK,QAAAA,QAAA,gBAC3EC,eAAA,CAAA,KAAA,EAAA;AAAKN,UAAAA,SAAS,EAAEI,SAAI,CAAC,aAAa,EAAE;AAAE,YAAA,OAAO,EAAE,CAACH,QAAAA;AAAU,WAAA,CAAE;UAAAI,QAAA,EAAA,cAC1DF,cAAA,CAACc,KAAK,EAAA;YACJN,IAAI,EAAEV,QAAQ,GAAGiB,qBAAU,CAACC,UAAU,GAAGD,qBAAU,CAACE,WAAY;AAChEpB,YAAAA,SAAS,EAAC,uBAAuB;AAAAK,YAAAA,QAAA,EAEhCR,KAAAA;AAAK,WACD,CACP,eAAAM,cAAA,CAACkB,IAAI,EAAA;AAACrB,YAAAA,SAAS,EAAC,0BAA0B;AAAAK,YAAAA,QAAA,EAAEP,QAAAA;AAAQ,WAAO,CAC7D,CAAA;AAAA,SAAK,CACL,EAACC,MAAM,gBACLI,cAAA,CAAA,KAAA,EAAA;AAAKH,UAAAA,SAAS,EAAC,qBAAqB;UAAAK,QAAA,eAClCF,cAAA,CAACmB,MAAM,EAAA;AACLC,YAAAA,KAAK,EAAEtB,QAAS;YAChBO,IAAI,EAAEC,SAAI,CAACe,KAAM;YACjBb,IAAI,EAAEc,mBAAW,CAACC,QAAS;YAC3BC,QAAQ,EAAE1B,QAAQ,GAAG2B,gBAAQ,CAACC,SAAS,GAAGD,gBAAQ,CAACE,OAAQ;AAC3D9B,YAAAA,SAAS,EAAC,SAAS;YACnB+B,OAAO,EAAEA,MAAK;AACZ,cAAA,IAAIhC,MAAM,EAAE;AACViC,gBAAAA,MAAM,CAACC,QAAQ,CAACC,IAAI,GAAGnC,MAAM,CAACmC,IAAI,CAAA;AACpC,eAAA;aACA;YAAA7B,QAAA,EAEDN,MAAM,CAACoC,KAAAA;WACF,CAAA;SACL,CAAC,GACJ,IAAI,CAAA;AAAA,OACL,CACP,CAAA;KAAK,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}
@@ -1,6 +1,34 @@
1
- import Alert from '../alert/Alert.mjs';
1
+ import { AlertCircleFill, Alert } from '@transferwise/icons';
2
+ import { useTheme } from '@wise/components-theming';
2
3
  import { clsx } from 'clsx';
3
- import { jsx } from 'react/jsx-runtime';
4
+ import { AvatarType } from '../avatar/avatarTypes.mjs';
5
+ import Avatar from '../avatar/Avatar.mjs';
6
+ import Body from '../body/Body.mjs';
7
+ import Button from '../button/Button.mjs';
8
+ import '../common/theme.mjs';
9
+ import '../common/direction.mjs';
10
+ import { ControlType, Priority } from '../common/propsValues/control.mjs';
11
+ import '../common/propsValues/breakpoint.mjs';
12
+ import { Size } from '../common/propsValues/size.mjs';
13
+ import { Typography } from '../common/propsValues/typography.mjs';
14
+ import '../common/propsValues/width.mjs';
15
+ import '../common/propsValues/type.mjs';
16
+ import '../common/propsValues/dateMode.mjs';
17
+ import '../common/propsValues/monthFormat.mjs';
18
+ import '../common/propsValues/position.mjs';
19
+ import '../common/propsValues/layouts.mjs';
20
+ import '../common/propsValues/status.mjs';
21
+ import '../common/propsValues/sentiment.mjs';
22
+ import '../common/propsValues/profileType.mjs';
23
+ import '../common/propsValues/variant.mjs';
24
+ import '../common/propsValues/scroll.mjs';
25
+ import '../common/propsValues/markdownNodeType.mjs';
26
+ import '../common/fileType.mjs';
27
+ import 'react';
28
+ import 'react-intl';
29
+ import '../common/closeButton/CloseButton.messages.mjs';
30
+ import { jsx, jsxs } from 'react/jsx-runtime';
31
+ import Title from '../title/Title.mjs';
4
32
 
5
33
  function CriticalCommsBanner({
6
34
  title,
@@ -8,17 +36,52 @@ function CriticalCommsBanner({
8
36
  action,
9
37
  className
10
38
  }) {
39
+ const {
40
+ isModern
41
+ } = useTheme();
11
42
  return /*#__PURE__*/jsx("div", {
12
43
  className: clsx('critical-comms', className),
13
- children: /*#__PURE__*/jsx(Alert, {
14
- title: title,
15
- message: subtitle,
16
- action: {
17
- target: action?.href,
18
- text: action?.label
19
- },
20
- className: className,
21
- type: "critical"
44
+ children: /*#__PURE__*/jsxs("div", {
45
+ className: "critical-comms-body",
46
+ children: [/*#__PURE__*/jsx(Avatar, {
47
+ size: Size.MEDIUM,
48
+ type: AvatarType.ICON,
49
+ className: clsx(isModern ? 'm-r-2' : 'm-r-1'),
50
+ backgroundColor: isModern ? 'var(--color-sentiment-negative)' : 'var(--color-background-negative)',
51
+ children: isModern ? /*#__PURE__*/jsx(AlertCircleFill, {}) : /*#__PURE__*/jsx(Alert, {
52
+ size: 24
53
+ })
54
+ }), /*#__PURE__*/jsxs("div", {
55
+ className: "critical-comms-content d-flex align-items-center flex-grow-1",
56
+ children: [/*#__PURE__*/jsxs("div", {
57
+ className: clsx('flex-grow-1', {
58
+ 'p-x-2': !isModern
59
+ }),
60
+ children: [/*#__PURE__*/jsx(Title, {
61
+ type: isModern ? Typography.TITLE_BODY : Typography.TITLE_GROUP,
62
+ className: "critical-comms--title",
63
+ children: title
64
+ }), /*#__PURE__*/jsx(Body, {
65
+ className: "critical-comms--subtitle",
66
+ children: subtitle
67
+ })]
68
+ }), action ? /*#__PURE__*/jsx("div", {
69
+ className: "critical-comms--cta",
70
+ children: /*#__PURE__*/jsx(Button, {
71
+ block: isModern,
72
+ size: Size.SMALL,
73
+ type: ControlType.NEGATIVE,
74
+ priority: isModern ? Priority.SECONDARY : Priority.PRIMARY,
75
+ className: "cta-btn",
76
+ onClick: () => {
77
+ if (action) {
78
+ window.location.href = action.href;
79
+ }
80
+ },
81
+ children: action.label
82
+ })
83
+ }) : null]
84
+ })]
22
85
  })
23
86
  });
24
87
  }
@@ -1 +1 @@
1
- {"version":3,"file":"CriticalCommsBanner.mjs","sources":["../../src/criticalBanner/CriticalCommsBanner.tsx"],"sourcesContent":["import Alert from '../alert';\nimport { clsx } from 'clsx';\n\nexport type CriticalCommsBannerProps = {\n title: string;\n subtitle?: string;\n action?: {\n label: string;\n href: string;\n };\n className?: string;\n};\n\nfunction CriticalCommsBanner({ title, subtitle, action, className }: CriticalCommsBannerProps) {\n return (\n <div className={clsx('critical-comms', className)}>\n <Alert\n title={title}\n message={subtitle}\n action={{ target: action?.href, text: action?.label }}\n className={className}\n type=\"critical\"\n />\n </div>\n );\n}\n\nexport default CriticalCommsBanner;\n"],"names":["CriticalCommsBanner","title","subtitle","action","className","_jsx","clsx","children","Alert","message","target","href","text","label","type"],"mappings":";;;;AAaA,SAASA,mBAAmBA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;AAAEC,EAAAA,SAAAA;AAAqC,CAAA,EAAA;AAC3F,EAAA,oBACEC,GAAA,CAAA,KAAA,EAAA;AAAKD,IAAAA,SAAS,EAAEE,IAAI,CAAC,gBAAgB,EAAEF,SAAS,CAAE;IAAAG,QAAA,eAChDF,GAAA,CAACG,KAAK,EAAA;AACJP,MAAAA,KAAK,EAAEA,KAAM;AACbQ,MAAAA,OAAO,EAAEP,QAAS;AAClBC,MAAAA,MAAM,EAAE;QAAEO,MAAM,EAAEP,MAAM,EAAEQ,IAAI;QAAEC,IAAI,EAAET,MAAM,EAAEU,KAAAA;OAAQ;AACtDT,MAAAA,SAAS,EAAEA,SAAU;AACrBU,MAAAA,IAAI,EAAC,UAAA;KAET,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
1
+ {"version":3,"file":"CriticalCommsBanner.mjs","sources":["../../src/criticalBanner/CriticalCommsBanner.tsx"],"sourcesContent":["import { Alert as DangerIcon, AlertCircleFill } from '@transferwise/icons';\nimport { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Avatar, { AvatarType } from '../avatar';\nimport Body from '../body';\nimport Button from '../button';\nimport { ControlType, Priority, Size, Typography } from '../common';\nimport Title from '../title';\n\nexport type CriticalCommsBannerProps = {\n title: string;\n subtitle?: string;\n action?: {\n label: string;\n href: string;\n };\n className?: string;\n};\n\nfunction CriticalCommsBanner({ title, subtitle, action, className }: CriticalCommsBannerProps) {\n const { isModern } = useTheme();\n return (\n <div className={clsx('critical-comms', className)}>\n <div className=\"critical-comms-body\">\n <Avatar\n size={Size.MEDIUM}\n type={AvatarType.ICON}\n className={clsx(isModern ? 'm-r-2' : 'm-r-1')}\n backgroundColor={\n isModern ? 'var(--color-sentiment-negative)' : 'var(--color-background-negative)'\n }\n >\n {isModern ? <AlertCircleFill /> : <DangerIcon size={24} />}\n </Avatar>\n <div className=\"critical-comms-content d-flex align-items-center flex-grow-1\">\n <div className={clsx('flex-grow-1', { 'p-x-2': !isModern })}>\n <Title\n type={isModern ? Typography.TITLE_BODY : Typography.TITLE_GROUP}\n className=\"critical-comms--title\"\n >\n {title}\n </Title>\n <Body className=\"critical-comms--subtitle\">{subtitle}</Body>\n </div>\n {action ? (\n <div className=\"critical-comms--cta\">\n <Button\n block={isModern}\n size={Size.SMALL}\n type={ControlType.NEGATIVE}\n priority={isModern ? Priority.SECONDARY : Priority.PRIMARY}\n className=\"cta-btn\"\n onClick={() => {\n if (action) {\n window.location.href = action.href;\n }\n }}\n >\n {action.label}\n </Button>\n </div>\n ) : null}\n </div>\n </div>\n </div>\n );\n}\n\nexport default CriticalCommsBanner;\n"],"names":["CriticalCommsBanner","title","subtitle","action","className","isModern","useTheme","_jsx","clsx","children","_jsxs","Avatar","size","Size","MEDIUM","type","AvatarType","ICON","backgroundColor","AlertCircleFill","DangerIcon","Title","Typography","TITLE_BODY","TITLE_GROUP","Body","Button","block","SMALL","ControlType","NEGATIVE","priority","Priority","SECONDARY","PRIMARY","onClick","window","location","href","label"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,SAASA,mBAAmBA,CAAC;EAAEC,KAAK;EAAEC,QAAQ;EAAEC,MAAM;AAAEC,EAAAA,SAAAA;AAAqC,CAAA,EAAA;EAC3F,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,QAAQ,EAAE,CAAA;AAC/B,EAAA,oBACEC,GAAA,CAAA,KAAA,EAAA;AAAKH,IAAAA,SAAS,EAAEI,IAAI,CAAC,gBAAgB,EAAEJ,SAAS,CAAE;AAAAK,IAAAA,QAAA,eAChDC,IAAA,CAAA,KAAA,EAAA;AAAKN,MAAAA,SAAS,EAAC,qBAAqB;MAAAK,QAAA,EAAA,cAClCF,GAAA,CAACI,MAAM,EAAA;QACLC,IAAI,EAAEC,IAAI,CAACC,MAAO;QAClBC,IAAI,EAAEC,UAAU,CAACC,IAAK;QACtBb,SAAS,EAAEI,IAAI,CAACH,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAE;AAC9Ca,QAAAA,eAAe,EACbb,QAAQ,GAAG,iCAAiC,GAAG,kCAChD;QAAAI,QAAA,EAEAJ,QAAQ,gBAAGE,GAAA,CAACY,eAAe,EAAA,EAAG,CAAA,gBAAGZ,GAAA,CAACa,KAAU,EAAA;AAACR,UAAAA,IAAI,EAAE,EAAA;SAAG,CAAA;OACjD,CACR,eAAAF,IAAA,CAAA,KAAA,EAAA;AAAKN,QAAAA,SAAS,EAAC,8DAA8D;AAAAK,QAAAA,QAAA,gBAC3EC,IAAA,CAAA,KAAA,EAAA;AAAKN,UAAAA,SAAS,EAAEI,IAAI,CAAC,aAAa,EAAE;AAAE,YAAA,OAAO,EAAE,CAACH,QAAAA;AAAU,WAAA,CAAE;UAAAI,QAAA,EAAA,cAC1DF,GAAA,CAACc,KAAK,EAAA;YACJN,IAAI,EAAEV,QAAQ,GAAGiB,UAAU,CAACC,UAAU,GAAGD,UAAU,CAACE,WAAY;AAChEpB,YAAAA,SAAS,EAAC,uBAAuB;AAAAK,YAAAA,QAAA,EAEhCR,KAAAA;AAAK,WACD,CACP,eAAAM,GAAA,CAACkB,IAAI,EAAA;AAACrB,YAAAA,SAAS,EAAC,0BAA0B;AAAAK,YAAAA,QAAA,EAAEP,QAAAA;AAAQ,WAAO,CAC7D,CAAA;AAAA,SAAK,CACL,EAACC,MAAM,gBACLI,GAAA,CAAA,KAAA,EAAA;AAAKH,UAAAA,SAAS,EAAC,qBAAqB;UAAAK,QAAA,eAClCF,GAAA,CAACmB,MAAM,EAAA;AACLC,YAAAA,KAAK,EAAEtB,QAAS;YAChBO,IAAI,EAAEC,IAAI,CAACe,KAAM;YACjBb,IAAI,EAAEc,WAAW,CAACC,QAAS;YAC3BC,QAAQ,EAAE1B,QAAQ,GAAG2B,QAAQ,CAACC,SAAS,GAAGD,QAAQ,CAACE,OAAQ;AAC3D9B,YAAAA,SAAS,EAAC,SAAS;YACnB+B,OAAO,EAAEA,MAAK;AACZ,cAAA,IAAIhC,MAAM,EAAE;AACViC,gBAAAA,MAAM,CAACC,QAAQ,CAACC,IAAI,GAAGnC,MAAM,CAACmC,IAAI,CAAA;AACpC,eAAA;aACA;YAAA7B,QAAA,EAEDN,MAAM,CAACoC,KAAAA;WACF,CAAA;SACL,CAAC,GACJ,IAAI,CAAA;AAAA,OACL,CACP,CAAA;KAAK,CAAA;AACP,GAAK,CAAC,CAAA;AAEV;;;;"}
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var clsx = require('clsx');
6
- var Button_resolver = require('../button/Button.resolver.js');
6
+ var Button = require('../button/Button.js');
7
7
  require('../common/theme.js');
8
8
  require('../common/direction.js');
9
9
  require('../common/propsValues/control.js');
@@ -46,7 +46,7 @@ const HeaderAction = ({
46
46
  children: action.text
47
47
  });
48
48
  }
49
- return /*#__PURE__*/jsxRuntime.jsx(Button_resolver, {
49
+ return /*#__PURE__*/jsxRuntime.jsx(Button, {
50
50
  className: "np-header__button",
51
51
  priority: "tertiary",
52
52
  size: "sm",
@@ -1 +1 @@
1
- {"version":3,"file":"Header.js","sources":["../../src/header/Header.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { ActionButtonProps } from '../actionButton/ActionButton';\nimport Button from '../button';\nimport { AriaLabelProperty, CommonProps, Heading, LinkProps, Typography } from '../common';\nimport Link from '../link';\nimport Title from '../title';\n\ntype ActionProps = AriaLabelProperty & {\n text: string;\n};\n\ntype ButtonActionProps = ActionProps & ActionButtonProps;\n\ntype LinkActionProps = ActionProps & LinkProps;\n\nexport type HeaderProps = CommonProps & {\n /**\n * When the `href` property is provided to the `action`, we will render a `Link` instead of a `ActionButton`.\n */\n action?: ButtonActionProps | LinkActionProps;\n /**\n * Override the heading element rendered for the title, useful to specify the semantics of your header.\n *\n * @default \"h5\"\n */\n as?: Heading | 'legend';\n title: string;\n};\n\nconst HeaderAction = ({ action }: { action: ButtonActionProps | LinkActionProps }) => {\n const props = {\n 'aria-label': action['aria-label'],\n };\n\n if ('href' in action) {\n return (\n <Link href={action.href} target={action.target} onClick={action.onClick} {...props}>\n {action.text}\n </Link>\n );\n }\n\n return (\n <Button\n className=\"np-header__button\"\n priority=\"tertiary\"\n size=\"sm\"\n onClick={action.onClick}\n {...props}\n >\n {action.text}\n </Button>\n );\n};\n\n/**\n *\n * Neptune Web: https://transferwise.github.io/neptune-web/components/content/Header\n *\n */\nexport const Header = ({ action, as = 'h5', title, className }: HeaderProps) => {\n if (!action) {\n return (\n <Title\n as={as}\n type={Typography.TITLE_GROUP}\n className={clsx('np-header', 'np-header__title', className)}\n >\n {title}\n </Title>\n );\n }\n\n if (as === 'legend') {\n // eslint-disable-next-line no-console\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 return (\n <div className={clsx('np-header', className)}>\n <Title as={as} type={Typography.TITLE_GROUP} className=\"np-header__title\">\n {title}\n </Title>\n <HeaderAction action={action} />\n </div>\n );\n};\n\nexport default Header;\n"],"names":["HeaderAction","action","props","_jsx","Link","href","target","onClick","children","text","Button","className","priority","size","Header","as","title","Title","type","Typography","TITLE_GROUP","clsx","console","warn","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAMA,YAAY,GAAGA,CAAC;AAAEC,EAAAA,MAAAA;AAAM,CAAmD,KAAI;AACnF,EAAA,MAAMC,KAAK,GAAG;IACZ,YAAY,EAAED,MAAM,CAAC,YAAY,CAAA;GAClC,CAAA;EAED,IAAI,MAAM,IAAIA,MAAM,EAAE;IACpB,oBACEE,cAAA,CAACC,IAAI,EAAA;MAACC,IAAI,EAAEJ,MAAM,CAACI,IAAK;MAACC,MAAM,EAAEL,MAAM,CAACK,MAAO;MAACC,OAAO,EAAEN,MAAM,CAACM,OAAQ;AAAA,MAAA,GAAKL,KAAK;MAAAM,QAAA,EAC/EP,MAAM,CAACQ,IAAAA;AAAI,KACR,CAAC,CAAA;AAEX,GAAA;EAEA,oBACEN,cAAA,CAACO,eAAM,EAAA;AACLC,IAAAA,SAAS,EAAC,mBAAmB;AAC7BC,IAAAA,QAAQ,EAAC,UAAU;AACnBC,IAAAA,IAAI,EAAC,IAAI;IACTN,OAAO,EAAEN,MAAM,CAACM,OAAQ;AAAA,IAAA,GACpBL,KAAK;IAAAM,QAAA,EAERP,MAAM,CAACQ,IAAAA;AAAI,GACN,CAAC,CAAA;AAEb,CAAC,CAAA;AAED;;;;AAIG;AACI,MAAMK,MAAM,GAAGA,CAAC;EAAEb,MAAM;AAAEc,EAAAA,EAAE,GAAG,IAAI;EAAEC,KAAK;AAAEL,EAAAA,SAAAA;AAAS,CAAe,KAAI;EAC7E,IAAI,CAACV,MAAM,EAAE;IACX,oBACEE,cAAA,CAACc,KAAK,EAAA;AACJF,MAAAA,EAAE,EAAEA,EAAG;MACPG,IAAI,EAAEC,qBAAU,CAACC,WAAY;MAC7BT,SAAS,EAAEU,SAAI,CAAC,WAAW,EAAE,kBAAkB,EAAEV,SAAS,CAAE;AAAAH,MAAAA,QAAA,EAE3DQ,KAAAA;AAAK,KACD,CAAC,CAAA;AAEZ,GAAA;EAEA,IAAID,EAAE,KAAK,QAAQ,EAAE;AACnB;AACAO,IAAAA,OAAO,CAACC,IAAI,CACV,oGAAoG,CACrG,CAAA;AACH,GAAA;AAEA,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKb,IAAAA,SAAS,EAAEU,SAAI,CAAC,WAAW,EAAEV,SAAS,CAAE;IAAAH,QAAA,EAAA,cAC3CL,cAAA,CAACc,KAAK,EAAA;AAACF,MAAAA,EAAE,EAAEA,EAAG;MAACG,IAAI,EAAEC,qBAAU,CAACC,WAAY;AAACT,MAAAA,SAAS,EAAC,kBAAkB;AAAAH,MAAAA,QAAA,EACtEQ,KAAAA;AAAK,KACD,CACP,eAAAb,cAAA,CAACH,YAAY,EAAA;AAACC,MAAAA,MAAM,EAAEA,MAAAA;AAAO,KAC/B,CAAA,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;;"}
1
+ {"version":3,"file":"Header.js","sources":["../../src/header/Header.tsx"],"sourcesContent":["import { clsx } from 'clsx';\n\nimport { ActionButtonProps } from '../actionButton/ActionButton';\nimport Button from '../button';\nimport { AriaLabelProperty, CommonProps, Heading, LinkProps, Typography } from '../common';\nimport Link from '../link';\nimport Title from '../title';\n\ntype ActionProps = AriaLabelProperty & {\n text: string;\n};\n\ntype ButtonActionProps = ActionProps & ActionButtonProps;\n\ntype LinkActionProps = ActionProps & LinkProps;\n\nexport type HeaderProps = CommonProps & {\n /**\n * When the `href` property is provided to the `action`, we will render a `Link` instead of a `ActionButton`.\n */\n action?: ButtonActionProps | LinkActionProps;\n /**\n * Override the heading element rendered for the title, useful to specify the semantics of your header.\n *\n * @default \"h5\"\n */\n as?: Heading | 'legend';\n title: string;\n};\n\nconst HeaderAction = ({ action }: { action: ButtonActionProps | LinkActionProps }) => {\n const props = {\n 'aria-label': action['aria-label'],\n };\n\n if ('href' in action) {\n return (\n <Link href={action.href} target={action.target} onClick={action.onClick} {...props}>\n {action.text}\n </Link>\n );\n }\n\n return (\n <Button\n className=\"np-header__button\"\n priority=\"tertiary\"\n size=\"sm\"\n onClick={action.onClick}\n {...props}\n >\n {action.text}\n </Button>\n );\n};\n\n/**\n *\n * Neptune Web: https://transferwise.github.io/neptune-web/components/content/Header\n *\n */\nexport const Header = ({ action, as = 'h5', title, className }: HeaderProps) => {\n if (!action) {\n return (\n <Title\n as={as}\n type={Typography.TITLE_GROUP}\n className={clsx('np-header', 'np-header__title', className)}\n >\n {title}\n </Title>\n );\n }\n\n if (as === 'legend') {\n // eslint-disable-next-line no-console\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 return (\n <div className={clsx('np-header', className)}>\n <Title as={as} type={Typography.TITLE_GROUP} className=\"np-header__title\">\n {title}\n </Title>\n <HeaderAction action={action} />\n </div>\n );\n};\n\nexport default Header;\n"],"names":["HeaderAction","action","props","_jsx","Link","href","target","onClick","children","text","Button","className","priority","size","Header","as","title","Title","type","Typography","TITLE_GROUP","clsx","console","warn","_jsxs"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8BA,MAAMA,YAAY,GAAGA,CAAC;AAAEC,EAAAA,MAAAA;AAAM,CAAmD,KAAI;AACnF,EAAA,MAAMC,KAAK,GAAG;IACZ,YAAY,EAAED,MAAM,CAAC,YAAY,CAAA;GAClC,CAAA;EAED,IAAI,MAAM,IAAIA,MAAM,EAAE;IACpB,oBACEE,cAAA,CAACC,IAAI,EAAA;MAACC,IAAI,EAAEJ,MAAM,CAACI,IAAK;MAACC,MAAM,EAAEL,MAAM,CAACK,MAAO;MAACC,OAAO,EAAEN,MAAM,CAACM,OAAQ;AAAA,MAAA,GAAKL,KAAK;MAAAM,QAAA,EAC/EP,MAAM,CAACQ,IAAAA;AAAI,KACR,CAAC,CAAA;AAEX,GAAA;EAEA,oBACEN,cAAA,CAACO,MAAM,EAAA;AACLC,IAAAA,SAAS,EAAC,mBAAmB;AAC7BC,IAAAA,QAAQ,EAAC,UAAU;AACnBC,IAAAA,IAAI,EAAC,IAAI;IACTN,OAAO,EAAEN,MAAM,CAACM,OAAQ;AAAA,IAAA,GACpBL,KAAK;IAAAM,QAAA,EAERP,MAAM,CAACQ,IAAAA;AAAI,GACN,CAAC,CAAA;AAEb,CAAC,CAAA;AAED;;;;AAIG;AACI,MAAMK,MAAM,GAAGA,CAAC;EAAEb,MAAM;AAAEc,EAAAA,EAAE,GAAG,IAAI;EAAEC,KAAK;AAAEL,EAAAA,SAAAA;AAAS,CAAe,KAAI;EAC7E,IAAI,CAACV,MAAM,EAAE;IACX,oBACEE,cAAA,CAACc,KAAK,EAAA;AACJF,MAAAA,EAAE,EAAEA,EAAG;MACPG,IAAI,EAAEC,qBAAU,CAACC,WAAY;MAC7BT,SAAS,EAAEU,SAAI,CAAC,WAAW,EAAE,kBAAkB,EAAEV,SAAS,CAAE;AAAAH,MAAAA,QAAA,EAE3DQ,KAAAA;AAAK,KACD,CAAC,CAAA;AAEZ,GAAA;EAEA,IAAID,EAAE,KAAK,QAAQ,EAAE;AACnB;AACAO,IAAAA,OAAO,CAACC,IAAI,CACV,oGAAoG,CACrG,CAAA;AACH,GAAA;AAEA,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKb,IAAAA,SAAS,EAAEU,SAAI,CAAC,WAAW,EAAEV,SAAS,CAAE;IAAAH,QAAA,EAAA,cAC3CL,cAAA,CAACc,KAAK,EAAA;AAACF,MAAAA,EAAE,EAAEA,EAAG;MAACG,IAAI,EAAEC,qBAAU,CAACC,WAAY;AAACT,MAAAA,SAAS,EAAC,kBAAkB;AAAAH,MAAAA,QAAA,EACtEQ,KAAAA;AAAK,KACD,CACP,eAAAb,cAAA,CAACH,YAAY,EAAA;AAACC,MAAAA,MAAM,EAAEA,MAAAA;AAAO,KAC/B,CAAA,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;;"}
@@ -1,5 +1,5 @@
1
1
  import { clsx } from 'clsx';
2
- import Button from '../button/Button.resolver.mjs';
2
+ import Button from '../button/Button.mjs';
3
3
  import '../common/theme.mjs';
4
4
  import '../common/direction.mjs';
5
5
  import '../common/propsValues/control.mjs';
@@ -27,7 +27,6 @@
27
27
  "neptune.SelectInput.noResultsFound": "No results found",
28
28
  "neptune.SelectOption.action.label": "Choose",
29
29
  "neptune.SelectOption.selected.action.label": "Change chosen option",
30
- "neptune.StatusIcon.iconLabel.critical": "Critical:",
31
30
  "neptune.StatusIcon.iconLabel.error": "Error:",
32
31
  "neptune.StatusIcon.iconLabel.information": "Information:",
33
32
  "neptune.StatusIcon.iconLabel.pending": "Pending:",
@@ -29,7 +29,6 @@ var en = {
29
29
  "neptune.SelectInput.noResultsFound": "No results found",
30
30
  "neptune.SelectOption.action.label": "Choose",
31
31
  "neptune.SelectOption.selected.action.label": "Change chosen option",
32
- "neptune.StatusIcon.iconLabel.critical": "Critical:",
33
32
  "neptune.StatusIcon.iconLabel.error": "Error:",
34
33
  "neptune.StatusIcon.iconLabel.information": "Information:",
35
34
  "neptune.StatusIcon.iconLabel.pending": "Pending:",
@@ -1 +1 @@
1
- {"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"en.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -27,7 +27,6 @@ var en = {
27
27
  "neptune.SelectInput.noResultsFound": "No results found",
28
28
  "neptune.SelectOption.action.label": "Choose",
29
29
  "neptune.SelectOption.selected.action.label": "Change chosen option",
30
- "neptune.StatusIcon.iconLabel.critical": "Critical:",
31
30
  "neptune.StatusIcon.iconLabel.error": "Error:",
32
31
  "neptune.StatusIcon.iconLabel.information": "Information:",
33
32
  "neptune.StatusIcon.iconLabel.pending": "Pending:",
@@ -1 +1 @@
1
- {"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"en.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@
54
54
  "neptune.UploadButton.allFileTypes": "すべてのファイル種類",
55
55
  "neptune.UploadButton.dropFiles": "ファイルをドロップしてアップロードする",
56
56
  "neptune.UploadButton.instructions": "{fileTypes}、{size}MB以下",
57
+ "neptune.UploadButton.maximumFiles": "最大ファイル数:{maxFiles}個",
57
58
  "neptune.UploadButton.uploadFile": "ファイルをアップロードする",
58
59
  "neptune.UploadButton.uploadFiles": "ファイルをアップロードする",
59
60
  "neptune.UploadInput.deleteModalBody": "このファイルを削除すると、当社のシステムからも削除されます。",
@@ -56,6 +56,7 @@ var ja = {
56
56
  "neptune.UploadButton.allFileTypes": "すべてのファイル種類",
57
57
  "neptune.UploadButton.dropFiles": "ファイルをドロップしてアップロードする",
58
58
  "neptune.UploadButton.instructions": "{fileTypes}、{size}MB以下",
59
+ "neptune.UploadButton.maximumFiles": "最大ファイル数:{maxFiles}個",
59
60
  "neptune.UploadButton.uploadFile": "ファイルをアップロードする",
60
61
  "neptune.UploadButton.uploadFiles": "ファイルをアップロードする",
61
62
  "neptune.UploadInput.deleteModalBody": "このファイルを削除すると、当社のシステムからも削除されます。",
@@ -1 +1 @@
1
- {"version":3,"file":"ja.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ja.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@ var ja = {
54
54
  "neptune.UploadButton.allFileTypes": "すべてのファイル種類",
55
55
  "neptune.UploadButton.dropFiles": "ファイルをドロップしてアップロードする",
56
56
  "neptune.UploadButton.instructions": "{fileTypes}、{size}MB以下",
57
+ "neptune.UploadButton.maximumFiles": "最大ファイル数:{maxFiles}個",
57
58
  "neptune.UploadButton.uploadFile": "ファイルをアップロードする",
58
59
  "neptune.UploadButton.uploadFiles": "ファイルをアップロードする",
59
60
  "neptune.UploadInput.deleteModalBody": "このファイルを削除すると、当社のシステムからも削除されます。",
@@ -1 +1 @@
1
- {"version":3,"file":"ja.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ja.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@
54
54
  "neptune.UploadButton.allFileTypes": "Todos os tipos de arquivos",
55
55
  "neptune.UploadButton.dropFiles": "Arraste o arquivo para iniciar o envio",
56
56
  "neptune.UploadButton.instructions": "{fileTypes}, com menos de {size}MB",
57
+ "neptune.UploadButton.maximumFiles": "Máximo de {maxFiles} arquivos.",
57
58
  "neptune.UploadButton.uploadFile": "Enviar arquivo",
58
59
  "neptune.UploadButton.uploadFiles": "Enviar arquivos",
59
60
  "neptune.UploadInput.deleteModalBody": "Se você remover este arquivo, ele será permanentemente excluído do nosso sistema.",
@@ -56,6 +56,7 @@ var pt = {
56
56
  "neptune.UploadButton.allFileTypes": "Todos os tipos de arquivos",
57
57
  "neptune.UploadButton.dropFiles": "Arraste o arquivo para iniciar o envio",
58
58
  "neptune.UploadButton.instructions": "{fileTypes}, com menos de {size}MB",
59
+ "neptune.UploadButton.maximumFiles": "Máximo de {maxFiles} arquivos.",
59
60
  "neptune.UploadButton.uploadFile": "Enviar arquivo",
60
61
  "neptune.UploadButton.uploadFiles": "Enviar arquivos",
61
62
  "neptune.UploadInput.deleteModalBody": "Se você remover este arquivo, ele será permanentemente excluído do nosso sistema.",
@@ -1 +1 @@
1
- {"version":3,"file":"pt.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"pt.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@ var pt = {
54
54
  "neptune.UploadButton.allFileTypes": "Todos os tipos de arquivos",
55
55
  "neptune.UploadButton.dropFiles": "Arraste o arquivo para iniciar o envio",
56
56
  "neptune.UploadButton.instructions": "{fileTypes}, com menos de {size}MB",
57
+ "neptune.UploadButton.maximumFiles": "Máximo de {maxFiles} arquivos.",
57
58
  "neptune.UploadButton.uploadFile": "Enviar arquivo",
58
59
  "neptune.UploadButton.uploadFiles": "Enviar arquivos",
59
60
  "neptune.UploadInput.deleteModalBody": "Se você remover este arquivo, ele será permanentemente excluído do nosso sistema.",
@@ -1 +1 @@
1
- {"version":3,"file":"pt.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"pt.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@
54
54
  "neptune.UploadButton.allFileTypes": "Все типы файлов",
55
55
  "neptune.UploadButton.dropFiles": "Перетащите файл, чтобы начать загрузку",
56
56
  "neptune.UploadButton.instructions": "{fileTypes}, не превышающий {size} MB",
57
+ "neptune.UploadButton.maximumFiles": "Макс. количество файлов: {maxFiles}.",
57
58
  "neptune.UploadButton.uploadFile": "Загрузить файл",
58
59
  "neptune.UploadButton.uploadFiles": "Загрузить файлы",
59
60
  "neptune.UploadInput.deleteModalBody": "Удаление этого файла приведет к его удалению из нашей системы.",
@@ -56,6 +56,7 @@ var ru = {
56
56
  "neptune.UploadButton.allFileTypes": "Все типы файлов",
57
57
  "neptune.UploadButton.dropFiles": "Перетащите файл, чтобы начать загрузку",
58
58
  "neptune.UploadButton.instructions": "{fileTypes}, не превышающий {size} MB",
59
+ "neptune.UploadButton.maximumFiles": "Макс. количество файлов: {maxFiles}.",
59
60
  "neptune.UploadButton.uploadFile": "Загрузить файл",
60
61
  "neptune.UploadButton.uploadFiles": "Загрузить файлы",
61
62
  "neptune.UploadInput.deleteModalBody": "Удаление этого файла приведет к его удалению из нашей системы.",
@@ -1 +1 @@
1
- {"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ru.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@ var ru = {
54
54
  "neptune.UploadButton.allFileTypes": "Все типы файлов",
55
55
  "neptune.UploadButton.dropFiles": "Перетащите файл, чтобы начать загрузку",
56
56
  "neptune.UploadButton.instructions": "{fileTypes}, не превышающий {size} MB",
57
+ "neptune.UploadButton.maximumFiles": "Макс. количество файлов: {maxFiles}.",
57
58
  "neptune.UploadButton.uploadFile": "Загрузить файл",
58
59
  "neptune.UploadButton.uploadFiles": "Загрузить файлы",
59
60
  "neptune.UploadInput.deleteModalBody": "Удаление этого файла приведет к его удалению из нашей системы.",
@@ -1 +1 @@
1
- {"version":3,"file":"ru.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"ru.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@
54
54
  "neptune.UploadButton.allFileTypes": "所有檔案類型",
55
55
  "neptune.UploadButton.dropFiles": "拖放檔案以開始上載",
56
56
  "neptune.UploadButton.instructions": "{fileTypes},小於{size}MB",
57
+ "neptune.UploadButton.maximumFiles": "最多{maxFiles}個檔案。",
57
58
  "neptune.UploadButton.uploadFile": "上載檔案",
58
59
  "neptune.UploadButton.uploadFiles": "上載檔案",
59
60
  "neptune.UploadInput.deleteModalBody": "移除此檔案會把它從我們的系統中刪除。",
@@ -56,6 +56,7 @@ var zhHK = {
56
56
  "neptune.UploadButton.allFileTypes": "所有檔案類型",
57
57
  "neptune.UploadButton.dropFiles": "拖放檔案以開始上載",
58
58
  "neptune.UploadButton.instructions": "{fileTypes},小於{size}MB",
59
+ "neptune.UploadButton.maximumFiles": "最多{maxFiles}個檔案。",
59
60
  "neptune.UploadButton.uploadFile": "上載檔案",
60
61
  "neptune.UploadButton.uploadFiles": "上載檔案",
61
62
  "neptune.UploadInput.deleteModalBody": "移除此檔案會把它從我們的系統中刪除。",
@@ -1 +1 @@
1
- {"version":3,"file":"zh-HK.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"zh-HK.json.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -54,6 +54,7 @@ var zhHK = {
54
54
  "neptune.UploadButton.allFileTypes": "所有檔案類型",
55
55
  "neptune.UploadButton.dropFiles": "拖放檔案以開始上載",
56
56
  "neptune.UploadButton.instructions": "{fileTypes},小於{size}MB",
57
+ "neptune.UploadButton.maximumFiles": "最多{maxFiles}個檔案。",
57
58
  "neptune.UploadButton.uploadFile": "上載檔案",
58
59
  "neptune.UploadButton.uploadFiles": "上載檔案",
59
60
  "neptune.UploadInput.deleteModalBody": "移除此檔案會把它從我們的系統中刪除。",
@@ -1 +1 @@
1
- {"version":3,"file":"zh-HK.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"zh-HK.json.mjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/build/index.js CHANGED
@@ -21,7 +21,7 @@ require('react/jsx-runtime');
21
21
  var Image = require('./image/Image.js');
22
22
  require('@transferwise/icons');
23
23
  var Body = require('./body/Body.js');
24
- var Button_resolver = require('./button/Button.resolver.js');
24
+ var Button = require('./button/Button.js');
25
25
  var IconButton = require('./iconButton/IconButton.js');
26
26
  var Carousel = require('./carousel/Carousel.js');
27
27
  var Card = require('./card/Card.js');
@@ -165,7 +165,7 @@ Object.defineProperty(exports, "Breakpoint", {
165
165
  });
166
166
  exports.Image = Image.default;
167
167
  exports.Body = Body;
168
- exports.Button = Button_resolver;
168
+ exports.Button = Button;
169
169
  exports.IconButton = IconButton;
170
170
  exports.Carousel = Carousel;
171
171
  exports.Card = Card;
package/build/index.mjs CHANGED
@@ -19,7 +19,7 @@ import 'react/jsx-runtime';
19
19
  export { default as Image } from './image/Image.mjs';
20
20
  import '@transferwise/icons';
21
21
  export { default as Body } from './body/Body.mjs';
22
- export { default as Button } from './button/Button.resolver.mjs';
22
+ export { default as Button } from './button/Button.mjs';
23
23
  export { default as IconButton } from './iconButton/IconButton.mjs';
24
24
  export { default as Carousel } from './carousel/Carousel.mjs';
25
25
  export { default as Card } from './card/Card.mjs';
@@ -3,8 +3,6 @@
3
3
  var icons = require('@transferwise/icons');
4
4
  var clsx = require('clsx');
5
5
  var reactIntl = require('react-intl');
6
- require('../primitives/PrimitiveButton/src/PrimitiveButton.js');
7
- var PrimitiveAnchor = require('../primitives/PrimitiveAnchor/src/PrimitiveAnchor.js');
8
6
  var Link_messages = require('./Link.messages.js');
9
7
  var jsxRuntime = require('react/jsx-runtime');
10
8
 
@@ -18,17 +16,14 @@ const Link = ({
18
16
  onClick,
19
17
  ...props
20
18
  }) => {
19
+ const isBlank = target === '_blank';
21
20
  const {
22
21
  formatMessage
23
22
  } = reactIntl.useIntl();
24
- const isBlank = target === '_blank';
25
- const classNames = clsx.clsx('np-link', 'd-inline-flex', {
26
- [`np-text-${type}`]: type
27
- }, className);
28
- return /*#__PURE__*/jsxRuntime.jsxs(PrimitiveAnchor, {
23
+ return /*#__PURE__*/jsxRuntime.jsxs("a", {
29
24
  href: href,
30
25
  target: target,
31
- className: classNames,
26
+ className: clsx.clsx('np-link', type ? `np-text-${type}` : undefined, 'd-inline-flex', className),
32
27
  "aria-label": ariaLabel,
33
28
  rel: isBlank ? 'noreferrer' : undefined,
34
29
  onClick: onClick,
@@ -1 +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 } from '../primitives';\nimport type { PrimitiveAnchorProps } from '../primitives';\n\nimport { LinkLarge, LinkDefault } from '../common';\n\nimport messages from './Link.messages';\n\nexport type Props = PrimitiveAnchorProps & { 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,\n 'aria-label': ariaLabel,\n onClick,\n ...props\n}: Props) => {\n const { formatMessage } = useIntl();\n const isBlank = target === '_blank';\n\n const classNames = clsx(\n 'np-link',\n 'd-inline-flex',\n {\n [`np-text-${type}`]: type,\n },\n className,\n );\n\n return (\n <PrimitiveAnchor\n href={href}\n target={target}\n className={classNames}\n aria-label={ariaLabel}\n rel={isBlank ? 'noreferrer' : undefined}\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","ariaLabel","onClick","props","formatMessage","useIntl","isBlank","classNames","clsx","_jsxs","PrimitiveAnchor","rel","undefined","_jsx","NavigateAwayIcon","title","messages","opensInNewTab"],"mappings":";;;;;;;;;;AAiBMA,MAAAA,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,IAAI;AACJ,EAAA,YAAY,EAAEC,SAAS;EACvBC,OAAO;EACP,GAAGC,KAAAA;AACG,CAAA,KAAI;EACV,MAAM;AAAEC,IAAAA,aAAAA;GAAe,GAAGC,iBAAO,EAAE,CAAA;AACnC,EAAA,MAAMC,OAAO,GAAGP,MAAM,KAAK,QAAQ,CAAA;AAEnC,EAAA,MAAMQ,UAAU,GAAGC,SAAI,CACrB,SAAS,EACT,eAAe,EACf;IACE,CAAC,CAAA,QAAA,EAAWR,IAAI,CAAA,CAAE,GAAGA,IAAAA;GACtB,EACDJ,SAAS,CACV,CAAA;EAED,oBACEa,eAAA,CAACC,eAAe,EAAA;AACdZ,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfH,IAAAA,SAAS,EAAEW,UAAW;AACtB,IAAA,YAAA,EAAYN,SAAU;AACtBU,IAAAA,GAAG,EAAEL,OAAO,GAAG,YAAY,GAAGM,SAAU;AACxCV,IAAAA,OAAO,EAAEA,OAAQ;AAAA,IAAA,GACbC,KAAK;IAAAN,QAAA,EAAA,CAERA,QAAQ,EAAE,GAAA,EAACS,OAAO,iBAAIO,cAAA,CAACC,kBAAgB,EAAA;AAACC,MAAAA,KAAK,EAAEX,aAAa,CAACY,aAAQ,CAACC,aAAa,CAAA;AAAE,MAAG,CAAA;AAAA,GAC1E,CAAC,CAAA;AAEtB;;;;"}
1
+ {"version":3,"file":"Link.js","sources":["../../src/link/Link.tsx"],"sourcesContent":["import { NavigateAway as NavigateAwayIcon } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { AnchorHTMLAttributes } from 'react';\nimport { useIntl } from 'react-intl';\n\nimport { LinkLarge, LinkDefault } from '../common';\n\nimport messages from './Link.messages';\n\nexport type Props = AnchorHTMLAttributes<HTMLAnchorElement> & { 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,\n 'aria-label': ariaLabel,\n onClick,\n ...props\n}: Props) => {\n const isBlank = target === '_blank';\n\n const { formatMessage } = useIntl();\n\n return (\n <a\n href={href}\n target={target}\n className={clsx('np-link', type ? `np-text-${type}` : undefined, 'd-inline-flex', className)}\n aria-label={ariaLabel}\n rel={isBlank ? 'noreferrer' : undefined}\n onClick={onClick}\n {...props}\n >\n {children} {isBlank && <NavigateAwayIcon title={formatMessage(messages.opensInNewTab)} />}\n </a>\n );\n};\n\nexport default Link;\n"],"names":["Link","className","children","href","target","type","ariaLabel","onClick","props","isBlank","formatMessage","useIntl","_jsxs","clsx","undefined","rel","_jsx","NavigateAwayIcon","title","messages","opensInNewTab"],"mappings":";;;;;;;;AAgBMA,MAAAA,IAAI,GAAGA,CAAC;EACZC,SAAS;EACTC,QAAQ;EACRC,IAAI;EACJC,MAAM;EACNC,IAAI;AACJ,EAAA,YAAY,EAAEC,SAAS;EACvBC,OAAO;EACP,GAAGC,KAAAA;AACG,CAAA,KAAI;AACV,EAAA,MAAMC,OAAO,GAAGL,MAAM,KAAK,QAAQ,CAAA;EAEnC,MAAM;AAAEM,IAAAA,aAAAA;GAAe,GAAGC,iBAAO,EAAE,CAAA;AAEnC,EAAA,oBACEC,eAAA,CAAA,GAAA,EAAA;AACET,IAAAA,IAAI,EAAEA,IAAK;AACXC,IAAAA,MAAM,EAAEA,MAAO;AACfH,IAAAA,SAAS,EAAEY,SAAI,CAAC,SAAS,EAAER,IAAI,GAAG,CAAA,QAAA,EAAWA,IAAI,CAAA,CAAE,GAAGS,SAAS,EAAE,eAAe,EAAEb,SAAS,CAAE;AAC7F,IAAA,YAAA,EAAYK,SAAU;AACtBS,IAAAA,GAAG,EAAEN,OAAO,GAAG,YAAY,GAAGK,SAAU;AACxCP,IAAAA,OAAO,EAAEA,OAAQ;AAAA,IAAA,GACbC,KAAK;IAAAN,QAAA,EAAA,CAERA,QAAQ,EAAE,GAAA,EAACO,OAAO,iBAAIO,cAAA,CAACC,kBAAgB,EAAA;AAACC,MAAAA,KAAK,EAAER,aAAa,CAACS,aAAQ,CAACC,aAAa,CAAA;AAAE,MAAG,CAAA;AAAA,GACxF,CAAC,CAAA;AAER;;;;"}
@@ -1,8 +1,6 @@
1
1
  import { NavigateAway } from '@transferwise/icons';
2
2
  import { clsx } from 'clsx';
3
3
  import { useIntl } from 'react-intl';
4
- import '../primitives/PrimitiveButton/src/PrimitiveButton.mjs';
5
- import PrimitiveAnchor from '../primitives/PrimitiveAnchor/src/PrimitiveAnchor.mjs';
6
4
  import messages from './Link.messages.mjs';
7
5
  import { jsxs, jsx } from 'react/jsx-runtime';
8
6
 
@@ -16,17 +14,14 @@ const Link = ({
16
14
  onClick,
17
15
  ...props
18
16
  }) => {
17
+ const isBlank = target === '_blank';
19
18
  const {
20
19
  formatMessage
21
20
  } = useIntl();
22
- const isBlank = target === '_blank';
23
- const classNames = clsx('np-link', 'd-inline-flex', {
24
- [`np-text-${type}`]: type
25
- }, className);
26
- return /*#__PURE__*/jsxs(PrimitiveAnchor, {
21
+ return /*#__PURE__*/jsxs("a", {
27
22
  href: href,
28
23
  target: target,
29
- className: classNames,
24
+ className: clsx('np-link', type ? `np-text-${type}` : undefined, 'd-inline-flex', className),
30
25
  "aria-label": ariaLabel,
31
26
  rel: isBlank ? 'noreferrer' : undefined,
32
27
  onClick: onClick,