@transferwise/components 46.78.0 → 46.79.1

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 (409) hide show
  1. package/build/accordion/AccordionItem/AccordionItem.js +22 -3
  2. package/build/accordion/AccordionItem/AccordionItem.js.map +1 -1
  3. package/build/accordion/AccordionItem/AccordionItem.mjs +22 -3
  4. package/build/accordion/AccordionItem/AccordionItem.mjs.map +1 -1
  5. package/build/actionButton/ActionButton.js +22 -1
  6. package/build/actionButton/ActionButton.js.map +1 -1
  7. package/build/actionButton/ActionButton.mjs +22 -1
  8. package/build/actionButton/ActionButton.mjs.map +1 -1
  9. package/build/actionOption/ActionOption.js +24 -2
  10. package/build/actionOption/ActionOption.js.map +1 -1
  11. package/build/actionOption/ActionOption.mjs +24 -2
  12. package/build/actionOption/ActionOption.mjs.map +1 -1
  13. package/build/alert/Alert.js +22 -6
  14. package/build/alert/Alert.js.map +1 -1
  15. package/build/alert/Alert.mjs +22 -6
  16. package/build/alert/Alert.mjs.map +1 -1
  17. package/build/alert/inlineMarkdown/InlineMarkdown.js +25 -2
  18. package/build/alert/inlineMarkdown/InlineMarkdown.js.map +1 -1
  19. package/build/alert/inlineMarkdown/InlineMarkdown.mjs +25 -2
  20. package/build/alert/inlineMarkdown/InlineMarkdown.mjs.map +1 -1
  21. package/build/avatar/Avatar.js +23 -2
  22. package/build/avatar/Avatar.js.map +1 -1
  23. package/build/avatar/Avatar.mjs +23 -2
  24. package/build/avatar/Avatar.mjs.map +1 -1
  25. package/build/avatarWrapper/AvatarWrapper.js +23 -3
  26. package/build/avatarWrapper/AvatarWrapper.js.map +1 -1
  27. package/build/avatarWrapper/AvatarWrapper.mjs +23 -3
  28. package/build/avatarWrapper/AvatarWrapper.mjs.map +1 -1
  29. package/build/badge/Badge.js +23 -2
  30. package/build/badge/Badge.js.map +1 -1
  31. package/build/badge/Badge.mjs +23 -2
  32. package/build/badge/Badge.mjs.map +1 -1
  33. package/build/button/Button.js +22 -6
  34. package/build/button/Button.js.map +1 -1
  35. package/build/button/Button.messages.js.map +1 -1
  36. package/build/button/Button.messages.mjs.map +1 -1
  37. package/build/button/Button.mjs +22 -6
  38. package/build/button/Button.mjs.map +1 -1
  39. package/build/button/classMap.js +24 -0
  40. package/build/button/classMap.js.map +1 -1
  41. package/build/button/classMap.mjs +24 -0
  42. package/build/button/classMap.mjs.map +1 -1
  43. package/build/button/legacyUtils/legacyUtils.js +30 -7
  44. package/build/button/legacyUtils/legacyUtils.js.map +1 -1
  45. package/build/button/legacyUtils/legacyUtils.mjs +30 -7
  46. package/build/button/legacyUtils/legacyUtils.mjs.map +1 -1
  47. package/build/card/Card.js +23 -3
  48. package/build/card/Card.js.map +1 -1
  49. package/build/card/Card.mjs +23 -3
  50. package/build/card/Card.mjs.map +1 -1
  51. package/build/checkbox/Checkbox.js +23 -1
  52. package/build/checkbox/Checkbox.js.map +1 -1
  53. package/build/checkbox/Checkbox.mjs +23 -1
  54. package/build/checkbox/Checkbox.mjs.map +1 -1
  55. package/build/checkboxOption/CheckboxOption.js +1 -1
  56. package/build/checkboxOption/CheckboxOption.mjs +1 -1
  57. package/build/chevron/Chevron.js +21 -1
  58. package/build/chevron/Chevron.js.map +1 -1
  59. package/build/chevron/Chevron.mjs +21 -1
  60. package/build/chevron/Chevron.mjs.map +1 -1
  61. package/build/chips/Chip.js +19 -1
  62. package/build/chips/Chip.js.map +1 -1
  63. package/build/chips/Chip.mjs +19 -1
  64. package/build/chips/Chip.mjs.map +1 -1
  65. package/build/circularButton/CircularButton.js +23 -4
  66. package/build/circularButton/CircularButton.js.map +1 -1
  67. package/build/circularButton/CircularButton.mjs +23 -4
  68. package/build/circularButton/CircularButton.mjs.map +1 -1
  69. package/build/common/bottomSheet/BottomSheet.js +3 -2
  70. package/build/common/bottomSheet/BottomSheet.js.map +1 -1
  71. package/build/common/bottomSheet/BottomSheet.mjs +3 -2
  72. package/build/common/bottomSheet/BottomSheet.mjs.map +1 -1
  73. package/build/common/dateUtils/getDateView/getDateView.js +10 -0
  74. package/build/common/dateUtils/getDateView/getDateView.js.map +1 -0
  75. package/build/common/dateUtils/getDateView/getDateView.mjs +8 -0
  76. package/build/common/dateUtils/getDateView/getDateView.mjs.map +1 -0
  77. package/build/common/hooks/useHasIntersected/useHasIntersected.js +10 -10
  78. package/build/common/hooks/useHasIntersected/useHasIntersected.js.map +1 -1
  79. package/build/common/hooks/useHasIntersected/useHasIntersected.mjs +10 -10
  80. package/build/common/hooks/useHasIntersected/useHasIntersected.mjs.map +1 -1
  81. package/build/common/locale/index.js +24 -0
  82. package/build/common/locale/index.js.map +1 -1
  83. package/build/common/locale/index.mjs +24 -0
  84. package/build/common/locale/index.mjs.map +1 -1
  85. package/build/common/panel/Panel.js +23 -2
  86. package/build/common/panel/Panel.js.map +1 -1
  87. package/build/common/panel/Panel.mjs +23 -2
  88. package/build/common/panel/Panel.mjs.map +1 -1
  89. package/build/common/responsivePanel/ResponsivePanel.js +27 -3
  90. package/build/common/responsivePanel/ResponsivePanel.js.map +1 -1
  91. package/build/common/responsivePanel/ResponsivePanel.mjs +27 -3
  92. package/build/common/responsivePanel/ResponsivePanel.mjs.map +1 -1
  93. package/build/criticalBanner/CriticalCommsBanner.js +22 -3
  94. package/build/criticalBanner/CriticalCommsBanner.js.map +1 -1
  95. package/build/criticalBanner/CriticalCommsBanner.mjs +22 -3
  96. package/build/criticalBanner/CriticalCommsBanner.mjs.map +1 -1
  97. package/build/dateInput/DateInput.js +22 -5
  98. package/build/dateInput/DateInput.js.map +1 -1
  99. package/build/dateInput/DateInput.mjs +22 -5
  100. package/build/dateInput/DateInput.mjs.map +1 -1
  101. package/build/dateLookup/DateLookup.js +30 -12
  102. package/build/dateLookup/DateLookup.js.map +1 -1
  103. package/build/dateLookup/DateLookup.mjs +30 -12
  104. package/build/dateLookup/DateLookup.mjs.map +1 -1
  105. package/build/dateLookup/dateHeader/DateHeader.js +26 -5
  106. package/build/dateLookup/dateHeader/DateHeader.js.map +1 -1
  107. package/build/dateLookup/dateHeader/DateHeader.mjs +26 -5
  108. package/build/dateLookup/dateHeader/DateHeader.mjs.map +1 -1
  109. package/build/dateLookup/dateTrigger/DateTrigger.js +19 -3
  110. package/build/dateLookup/dateTrigger/DateTrigger.js.map +1 -1
  111. package/build/dateLookup/dateTrigger/DateTrigger.mjs +19 -3
  112. package/build/dateLookup/dateTrigger/DateTrigger.mjs.map +1 -1
  113. package/build/dateLookup/dayCalendar/table/DayCalendarTable.js +4 -1
  114. package/build/dateLookup/dayCalendar/table/DayCalendarTable.js.map +1 -1
  115. package/build/dateLookup/dayCalendar/table/DayCalendarTable.mjs +4 -1
  116. package/build/dateLookup/dayCalendar/table/DayCalendarTable.mjs.map +1 -1
  117. package/build/decision/Decision.js +24 -3
  118. package/build/decision/Decision.js.map +1 -1
  119. package/build/decision/Decision.mjs +24 -3
  120. package/build/decision/Decision.mjs.map +1 -1
  121. package/build/definitionList/DefinitionList.js +23 -1
  122. package/build/definitionList/DefinitionList.js.map +1 -1
  123. package/build/definitionList/DefinitionList.mjs +23 -1
  124. package/build/definitionList/DefinitionList.mjs.map +1 -1
  125. package/build/dimmer/Dimmer.js +24 -2
  126. package/build/dimmer/Dimmer.js.map +1 -1
  127. package/build/dimmer/Dimmer.mjs +24 -2
  128. package/build/dimmer/Dimmer.mjs.map +1 -1
  129. package/build/display/Display.js +23 -1
  130. package/build/display/Display.js.map +1 -1
  131. package/build/display/Display.mjs +23 -1
  132. package/build/display/Display.mjs.map +1 -1
  133. package/build/drawer/Drawer.js +23 -4
  134. package/build/drawer/Drawer.js.map +1 -1
  135. package/build/drawer/Drawer.mjs +23 -4
  136. package/build/drawer/Drawer.mjs.map +1 -1
  137. package/build/field/Field.js +23 -2
  138. package/build/field/Field.js.map +1 -1
  139. package/build/field/Field.mjs +23 -2
  140. package/build/field/Field.mjs.map +1 -1
  141. package/build/flowNavigation/FlowNavigation.js +19 -2
  142. package/build/flowNavigation/FlowNavigation.js.map +1 -1
  143. package/build/flowNavigation/FlowNavigation.mjs +19 -2
  144. package/build/flowNavigation/FlowNavigation.mjs.map +1 -1
  145. package/build/header/Header.js +24 -2
  146. package/build/header/Header.js.map +1 -1
  147. package/build/header/Header.mjs +24 -2
  148. package/build/header/Header.mjs.map +1 -1
  149. package/build/image/Image.js +4 -1
  150. package/build/image/Image.js.map +1 -1
  151. package/build/image/Image.mjs +4 -1
  152. package/build/image/Image.mjs.map +1 -1
  153. package/build/index.js +69 -62
  154. package/build/index.js.map +1 -1
  155. package/build/index.mjs +27 -20
  156. package/build/index.mjs.map +1 -1
  157. package/build/info/Info.js +21 -3
  158. package/build/info/Info.js.map +1 -1
  159. package/build/info/Info.mjs +21 -3
  160. package/build/info/Info.mjs.map +1 -1
  161. package/build/inlineAlert/InlineAlert.js +24 -3
  162. package/build/inlineAlert/InlineAlert.js.map +1 -1
  163. package/build/inlineAlert/InlineAlert.mjs +24 -3
  164. package/build/inlineAlert/InlineAlert.mjs.map +1 -1
  165. package/build/inputs/SearchInput.js +23 -2
  166. package/build/inputs/SearchInput.js.map +1 -1
  167. package/build/inputs/SearchInput.mjs +23 -2
  168. package/build/inputs/SearchInput.mjs.map +1 -1
  169. package/build/instructionsList/InstructionsList.js +22 -1
  170. package/build/instructionsList/InstructionsList.js.map +1 -1
  171. package/build/instructionsList/InstructionsList.mjs +22 -1
  172. package/build/instructionsList/InstructionsList.mjs.map +1 -1
  173. package/build/loader/Loader.js +22 -1
  174. package/build/loader/Loader.js.map +1 -1
  175. package/build/loader/Loader.mjs +22 -1
  176. package/build/loader/Loader.mjs.map +1 -1
  177. package/build/markdown/Markdown.js +24 -1
  178. package/build/markdown/Markdown.js.map +1 -1
  179. package/build/markdown/Markdown.mjs +24 -1
  180. package/build/markdown/Markdown.mjs.map +1 -1
  181. package/build/modal/Modal.js +22 -5
  182. package/build/modal/Modal.js.map +1 -1
  183. package/build/modal/Modal.mjs +22 -5
  184. package/build/modal/Modal.mjs.map +1 -1
  185. package/build/moneyInput/MoneyInput.js +22 -3
  186. package/build/moneyInput/MoneyInput.js.map +1 -1
  187. package/build/moneyInput/MoneyInput.mjs +22 -3
  188. package/build/moneyInput/MoneyInput.mjs.map +1 -1
  189. package/build/navigationOption/NavigationOption.js +23 -2
  190. package/build/navigationOption/NavigationOption.js.map +1 -1
  191. package/build/navigationOption/NavigationOption.mjs +23 -2
  192. package/build/navigationOption/NavigationOption.mjs.map +1 -1
  193. package/build/nudge/Nudge.js +19 -1
  194. package/build/nudge/Nudge.js.map +1 -1
  195. package/build/nudge/Nudge.mjs +19 -1
  196. package/build/nudge/Nudge.mjs.map +1 -1
  197. package/build/overlayHeader/OverlayHeader.js +19 -1
  198. package/build/overlayHeader/OverlayHeader.js.map +1 -1
  199. package/build/overlayHeader/OverlayHeader.mjs +19 -1
  200. package/build/overlayHeader/OverlayHeader.mjs.map +1 -1
  201. package/build/phoneNumberInput/PhoneNumberInput.js +23 -2
  202. package/build/phoneNumberInput/PhoneNumberInput.js.map +1 -1
  203. package/build/phoneNumberInput/PhoneNumberInput.mjs +23 -2
  204. package/build/phoneNumberInput/PhoneNumberInput.mjs.map +1 -1
  205. package/build/popover/Popover.js +24 -4
  206. package/build/popover/Popover.js.map +1 -1
  207. package/build/popover/Popover.mjs +24 -4
  208. package/build/popover/Popover.mjs.map +1 -1
  209. package/build/processIndicator/ProcessIndicator.js +22 -1
  210. package/build/processIndicator/ProcessIndicator.js.map +1 -1
  211. package/build/processIndicator/ProcessIndicator.mjs +22 -1
  212. package/build/processIndicator/ProcessIndicator.mjs.map +1 -1
  213. package/build/progressBar/ProgressBar.js +24 -2
  214. package/build/progressBar/ProgressBar.js.map +1 -1
  215. package/build/progressBar/ProgressBar.mjs +24 -2
  216. package/build/progressBar/ProgressBar.mjs.map +1 -1
  217. package/build/promoCard/PromoCard.js +22 -2
  218. package/build/promoCard/PromoCard.js.map +1 -1
  219. package/build/promoCard/PromoCard.mjs +22 -2
  220. package/build/promoCard/PromoCard.mjs.map +1 -1
  221. package/build/promoCard/PromoCardIndicator.js +22 -1
  222. package/build/promoCard/PromoCardIndicator.js.map +1 -1
  223. package/build/promoCard/PromoCardIndicator.mjs +22 -1
  224. package/build/promoCard/PromoCardIndicator.mjs.map +1 -1
  225. package/build/provider/Provider.js +25 -2
  226. package/build/provider/Provider.js.map +1 -1
  227. package/build/provider/Provider.mjs +25 -2
  228. package/build/provider/Provider.mjs.map +1 -1
  229. package/build/radio/Radio.js +24 -2
  230. package/build/radio/Radio.js.map +1 -1
  231. package/build/radio/Radio.mjs +24 -2
  232. package/build/radio/Radio.mjs.map +1 -1
  233. package/build/segmentedControl/SegmentedControl.js +22 -1
  234. package/build/segmentedControl/SegmentedControl.js.map +1 -1
  235. package/build/segmentedControl/SegmentedControl.mjs +22 -1
  236. package/build/segmentedControl/SegmentedControl.mjs.map +1 -1
  237. package/build/select/Select.js +26 -4
  238. package/build/select/Select.js.map +1 -1
  239. package/build/select/Select.mjs +26 -4
  240. package/build/select/Select.mjs.map +1 -1
  241. package/build/select/option/Option.js +22 -1
  242. package/build/select/option/Option.js.map +1 -1
  243. package/build/select/option/Option.mjs +22 -1
  244. package/build/select/option/Option.mjs.map +1 -1
  245. package/build/selectOption/SelectOption.js +24 -6
  246. package/build/selectOption/SelectOption.js.map +1 -1
  247. package/build/selectOption/SelectOption.mjs +24 -6
  248. package/build/selectOption/SelectOption.mjs.map +1 -1
  249. package/build/statusIcon/StatusIcon.js +22 -4
  250. package/build/statusIcon/StatusIcon.js.map +1 -1
  251. package/build/statusIcon/StatusIcon.mjs +22 -4
  252. package/build/statusIcon/StatusIcon.mjs.map +1 -1
  253. package/build/stepper/Stepper.js +25 -3
  254. package/build/stepper/Stepper.js.map +1 -1
  255. package/build/stepper/Stepper.mjs +25 -3
  256. package/build/stepper/Stepper.mjs.map +1 -1
  257. package/build/stepper/deviceDetection.js +2 -3
  258. package/build/stepper/deviceDetection.js.map +1 -1
  259. package/build/stepper/deviceDetection.mjs +2 -3
  260. package/build/stepper/deviceDetection.mjs.map +1 -1
  261. package/build/sticky/Sticky.js +25 -2
  262. package/build/sticky/Sticky.js.map +1 -1
  263. package/build/sticky/Sticky.mjs +25 -2
  264. package/build/sticky/Sticky.mjs.map +1 -1
  265. package/build/summary/Summary.js +21 -5
  266. package/build/summary/Summary.js.map +1 -1
  267. package/build/summary/Summary.mjs +21 -5
  268. package/build/summary/Summary.mjs.map +1 -1
  269. package/build/tabs/Tabs.js +23 -3
  270. package/build/tabs/Tabs.js.map +1 -1
  271. package/build/tabs/Tabs.mjs +23 -3
  272. package/build/tabs/Tabs.mjs.map +1 -1
  273. package/build/tile/Tile.js +24 -2
  274. package/build/tile/Tile.js.map +1 -1
  275. package/build/tile/Tile.mjs +24 -2
  276. package/build/tile/Tile.mjs.map +1 -1
  277. package/build/title/Title.js +23 -1
  278. package/build/title/Title.js.map +1 -1
  279. package/build/title/Title.mjs +23 -1
  280. package/build/title/Title.mjs.map +1 -1
  281. package/build/tooltip/Tooltip.js +22 -1
  282. package/build/tooltip/Tooltip.js.map +1 -1
  283. package/build/tooltip/Tooltip.mjs +22 -1
  284. package/build/tooltip/Tooltip.mjs.map +1 -1
  285. package/build/typeahead/Typeahead.js +22 -4
  286. package/build/typeahead/Typeahead.js.map +1 -1
  287. package/build/typeahead/Typeahead.mjs +22 -4
  288. package/build/typeahead/Typeahead.mjs.map +1 -1
  289. package/build/types/button/Button.d.ts.map +1 -1
  290. package/build/types/button/Button.messages.d.ts +7 -7
  291. package/build/types/button/Button.messages.d.ts.map +1 -1
  292. package/build/types/button/classMap.d.ts +10 -10
  293. package/build/types/button/classMap.d.ts.map +1 -1
  294. package/build/types/button/legacyUtils/index.d.ts +1 -1
  295. package/build/types/button/legacyUtils/index.d.ts.map +1 -1
  296. package/build/types/button/legacyUtils/legacyUtils.d.ts +20 -6
  297. package/build/types/button/legacyUtils/legacyUtils.d.ts.map +1 -1
  298. package/build/types/checkboxButton/index.d.ts +1 -1
  299. package/build/types/checkboxButton/index.d.ts.map +1 -1
  300. package/build/types/common/dateUtils/getDateView/getDateView.d.ts +2 -0
  301. package/build/types/common/dateUtils/getDateView/getDateView.d.ts.map +1 -0
  302. package/build/types/common/dateUtils/index.d.ts +1 -0
  303. package/build/types/common/dateUtils/index.d.ts.map +1 -1
  304. package/build/types/common/fakeEvents.d.ts +23 -0
  305. package/build/types/common/fakeEvents.d.ts.map +1 -0
  306. package/build/types/common/hooks/index.d.ts +4 -4
  307. package/build/types/common/hooks/index.d.ts.map +1 -1
  308. package/build/types/common/hooks/useConditionalListener/index.d.ts +1 -1
  309. package/build/types/common/hooks/useConditionalListener/index.d.ts.map +1 -1
  310. package/build/types/common/hooks/useDirection/index.d.ts +1 -1
  311. package/build/types/common/hooks/useDirection/index.d.ts.map +1 -1
  312. package/build/types/common/hooks/useHasIntersected/index.d.ts +1 -1
  313. package/build/types/common/hooks/useHasIntersected/index.d.ts.map +1 -1
  314. package/build/types/common/hooks/useHasIntersected/useHasIntersected.d.ts +15 -4
  315. package/build/types/common/hooks/useHasIntersected/useHasIntersected.d.ts.map +1 -1
  316. package/build/types/common/index.d.ts +28 -28
  317. package/build/types/common/index.d.ts.map +1 -1
  318. package/build/types/common/responsivePanel/index.d.ts +1 -1
  319. package/build/types/common/responsivePanel/index.d.ts.map +1 -1
  320. package/build/types/dateLookup/DateLookup.d.ts +1 -1
  321. package/build/types/dateLookup/DateLookup.d.ts.map +1 -1
  322. package/build/types/dateLookup/dayCalendar/table/DayCalendarTable.d.ts +1 -1
  323. package/build/types/dateLookup/dayCalendar/table/DayCalendarTable.d.ts.map +1 -1
  324. package/build/types/index.d.ts +1 -0
  325. package/build/types/index.d.ts.map +1 -1
  326. package/build/types/navigationOption/NavigationOption.d.ts +1 -0
  327. package/build/types/navigationOption/NavigationOption.d.ts.map +1 -1
  328. package/build/types/stepper/deviceDetection.d.ts +1 -1
  329. package/build/types/stepper/deviceDetection.d.ts.map +1 -1
  330. package/build/types/test-utils/style-mock.d.ts +1 -0
  331. package/build/types/test-utils/style-mock.d.ts.map +1 -0
  332. package/build/types/utilities/deprecatedProperty/deprecatedProperty.d.ts +8 -6
  333. package/build/types/utilities/deprecatedProperty/deprecatedProperty.d.ts.map +1 -1
  334. package/build/types/utilities/deprecatedProperty/index.d.ts +1 -1
  335. package/build/types/utilities/deprecatedProperty/index.d.ts.map +1 -1
  336. package/build/types/utilities/index.d.ts +2 -2
  337. package/build/types/utilities/index.d.ts.map +1 -1
  338. package/build/types/utilities/logActionRequired.d.ts +2 -2
  339. package/build/types/utilities/logActionRequired.d.ts.map +1 -1
  340. package/build/upload/Upload.js +21 -2
  341. package/build/upload/Upload.js.map +1 -1
  342. package/build/upload/Upload.mjs +21 -2
  343. package/build/upload/Upload.mjs.map +1 -1
  344. package/build/upload/steps/processingStep/processingStep.js +25 -3
  345. package/build/upload/steps/processingStep/processingStep.js.map +1 -1
  346. package/build/upload/steps/processingStep/processingStep.mjs +25 -3
  347. package/build/upload/steps/processingStep/processingStep.mjs.map +1 -1
  348. package/build/upload/steps/uploadImageStep/uploadImageStep.js +23 -3
  349. package/build/upload/steps/uploadImageStep/uploadImageStep.js.map +1 -1
  350. package/build/upload/steps/uploadImageStep/uploadImageStep.mjs +23 -3
  351. package/build/upload/steps/uploadImageStep/uploadImageStep.mjs.map +1 -1
  352. package/build/uploadInput/UploadInput.js +22 -3
  353. package/build/uploadInput/UploadInput.js.map +1 -1
  354. package/build/uploadInput/UploadInput.mjs +22 -3
  355. package/build/uploadInput/UploadInput.mjs.map +1 -1
  356. package/build/uploadInput/uploadButton/UploadButton.js +21 -2
  357. package/build/uploadInput/uploadButton/UploadButton.js.map +1 -1
  358. package/build/uploadInput/uploadButton/UploadButton.mjs +21 -2
  359. package/build/uploadInput/uploadButton/UploadButton.mjs.map +1 -1
  360. package/build/uploadInput/uploadButton/defaults.js +24 -0
  361. package/build/uploadInput/uploadButton/defaults.js.map +1 -1
  362. package/build/uploadInput/uploadButton/defaults.mjs +24 -0
  363. package/build/uploadInput/uploadButton/defaults.mjs.map +1 -1
  364. package/build/uploadInput/uploadItem/UploadItem.js +21 -4
  365. package/build/uploadInput/uploadItem/UploadItem.js.map +1 -1
  366. package/build/uploadInput/uploadItem/UploadItem.mjs +21 -4
  367. package/build/uploadInput/uploadItem/UploadItem.mjs.map +1 -1
  368. package/build/utilities/logActionRequired.js.map +1 -1
  369. package/build/utilities/logActionRequired.mjs.map +1 -1
  370. package/build/withDisplayFormat/WithDisplayFormat.js +25 -1
  371. package/build/withDisplayFormat/WithDisplayFormat.js.map +1 -1
  372. package/build/withDisplayFormat/WithDisplayFormat.mjs +25 -1
  373. package/build/withDisplayFormat/WithDisplayFormat.mjs.map +1 -1
  374. package/package.json +2 -2
  375. package/src/button/Button.tsx +0 -3
  376. package/src/button/legacyUtils/legacyUtils.ts +74 -0
  377. package/src/common/dateUtils/getDateView/getDateView.ts +5 -0
  378. package/src/common/dateUtils/index.ts +1 -0
  379. package/src/common/{fakeEvents.js → fakeEvents.ts} +1 -1
  380. package/src/common/hooks/useHasIntersected/{useHasIntersected.js → useHasIntersected.ts} +20 -11
  381. package/src/dateLookup/DateLookup.tests.story.tsx +40 -5
  382. package/src/dateLookup/DateLookup.tsx +9 -11
  383. package/src/dateLookup/dayCalendar/table/DayCalendarTable.tsx +5 -2
  384. package/src/flowNavigation/{FlowNavigation.story.js → FlowNavigation.story.tsx} +34 -16
  385. package/src/index.ts +1 -0
  386. package/src/inputWithDisplayFormat/InputWithDisplayFormat.story.tsx +78 -0
  387. package/src/navigationOption/{NavigationOption.story.js → NavigationOption.story.tsx} +23 -5
  388. package/src/navigationOption/NavigationOption.tsx +1 -1
  389. package/src/select/{Select.story.js → Select.story.tsx} +97 -47
  390. package/src/stepper/{deviceDetection.js → deviceDetection.ts} +2 -6
  391. package/src/utilities/deprecatedProperty/{deprecatedProperty.spec.js → deprecatedProperty.spec.ts} +7 -13
  392. package/src/utilities/deprecatedProperty/{deprecatedProperty.js → deprecatedProperty.ts} +23 -4
  393. package/src/utilities/{logActionRequired.js → logActionRequired.ts} +2 -2
  394. package/src/button/legacyUtils/legacyUtils.js +0 -54
  395. package/src/common/requirements.js +0 -440
  396. package/src/inputWithDisplayFormat/InputWithDisplayFormat.story.js +0 -85
  397. /package/src/button/{Button.messages.js → Button.messages.ts} +0 -0
  398. /package/src/button/{classMap.js → classMap.ts} +0 -0
  399. /package/src/button/legacyUtils/{index.js → index.ts} +0 -0
  400. /package/src/checkboxButton/{index.js → index.ts} +0 -0
  401. /package/src/common/hooks/{index.js → index.ts} +0 -0
  402. /package/src/common/hooks/useConditionalListener/{index.js → index.ts} +0 -0
  403. /package/src/common/hooks/useDirection/{index.js → index.ts} +0 -0
  404. /package/src/common/hooks/useHasIntersected/{index.js → index.ts} +0 -0
  405. /package/src/common/{index.js → index.ts} +0 -0
  406. /package/src/common/responsivePanel/{index.js → index.ts} +0 -0
  407. /package/src/test-utils/{style-mock.js → style-mock.ts} +0 -0
  408. /package/src/utilities/deprecatedProperty/{index.js → index.ts} +0 -0
  409. /package/src/utilities/{index.js → index.ts} +0 -0
@@ -2,8 +2,29 @@
2
2
 
3
3
  var clsx = require('clsx');
4
4
  var React = require('react');
5
- var jsxRuntime = require('react/jsx-runtime');
5
+ require('../common/theme.js');
6
+ require('../common/direction.js');
7
+ require('../common/propsValues/control.js');
8
+ require('../common/propsValues/breakpoint.js');
9
+ require('../common/propsValues/size.js');
10
+ require('../common/propsValues/typography.js');
11
+ require('../common/propsValues/width.js');
12
+ require('../common/propsValues/type.js');
13
+ require('../common/propsValues/dateMode.js');
14
+ require('../common/propsValues/monthFormat.js');
15
+ require('../common/propsValues/position.js');
16
+ require('../common/propsValues/layouts.js');
6
17
  var status = require('../common/propsValues/status.js');
18
+ require('../common/propsValues/sentiment.js');
19
+ require('../common/propsValues/profileType.js');
20
+ require('../common/propsValues/variant.js');
21
+ require('../common/propsValues/scroll.js');
22
+ require('../common/propsValues/markdownNodeType.js');
23
+ require('../common/fileType.js');
24
+ require('@transferwise/icons');
25
+ require('react-intl');
26
+ require('../common/closeButton/CloseButton.messages.js');
27
+ var jsxRuntime = require('react/jsx-runtime');
7
28
 
8
29
  const radius = {
9
30
  xxs: 6,
@@ -1 +1 @@
1
- {"version":3,"file":"ProcessIndicator.js","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING | Status.FAILED | Status.SUCCEEDED | Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' | `${Size.EXTRA_SMALL | Size.SMALL | Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' | 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /**\n * Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n */\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /**\n * Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":"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"}
1
+ {"version":3,"file":"ProcessIndicator.js","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING | Status.FAILED | Status.SUCCEEDED | Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' | `${Size.EXTRA_SMALL | Size.SMALL | Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' | 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /**\n * Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n */\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /**\n * Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":"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"}
@@ -1,7 +1,28 @@
1
1
  import { clsx } from 'clsx';
2
2
  import { Component } from 'react';
3
- import { jsxs, jsx } from 'react/jsx-runtime';
3
+ import '../common/theme.mjs';
4
+ import '../common/direction.mjs';
5
+ import '../common/propsValues/control.mjs';
6
+ import '../common/propsValues/breakpoint.mjs';
7
+ import '../common/propsValues/size.mjs';
8
+ import '../common/propsValues/typography.mjs';
9
+ import '../common/propsValues/width.mjs';
10
+ import '../common/propsValues/type.mjs';
11
+ import '../common/propsValues/dateMode.mjs';
12
+ import '../common/propsValues/monthFormat.mjs';
13
+ import '../common/propsValues/position.mjs';
14
+ import '../common/propsValues/layouts.mjs';
4
15
  import { Status } from '../common/propsValues/status.mjs';
16
+ import '../common/propsValues/sentiment.mjs';
17
+ import '../common/propsValues/profileType.mjs';
18
+ import '../common/propsValues/variant.mjs';
19
+ import '../common/propsValues/scroll.mjs';
20
+ import '../common/propsValues/markdownNodeType.mjs';
21
+ import '../common/fileType.mjs';
22
+ import '@transferwise/icons';
23
+ import 'react-intl';
24
+ import '../common/closeButton/CloseButton.messages.mjs';
25
+ import { jsxs, jsx } from 'react/jsx-runtime';
5
26
 
6
27
  const radius = {
7
28
  xxs: 6,
@@ -1 +1 @@
1
- {"version":3,"file":"ProcessIndicator.mjs","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING | Status.FAILED | Status.SUCCEEDED | Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' | `${Size.EXTRA_SMALL | Size.SMALL | Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' | 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /**\n * Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n */\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /**\n * Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":"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"}
1
+ {"version":3,"file":"ProcessIndicator.mjs","sources":["../../src/processIndicator/ProcessIndicator.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { Component } from 'react';\n\nimport { Status, Size } from '../common';\n\nconst radius = { xxs: 6, xs: 11, sm: 22, xl: 61 };\n\nconst ANIMATION_DURATION_IN_MS = 1500;\n\nexport type ProcessIndicatorStatus =\n `${Status.PROCESSING | Status.FAILED | Status.SUCCEEDED | Status.HIDDEN}`;\n\nexport interface ProcessIndicatorProps {\n status?: ProcessIndicatorStatus;\n size?: 'xxs' | `${Size.EXTRA_SMALL | Size.SMALL | Size.EXTRA_LARGE}`;\n className?: string;\n 'data-testid'?: string;\n onAnimationCompleted?: (status: ProcessIndicatorStatus) => void;\n}\n\ntype ProcessIndicatorState = Required<Pick<ProcessIndicatorProps, 'status' | 'size'>>;\n\nexport default class ProcessIndicator extends Component<\n ProcessIndicatorProps,\n ProcessIndicatorState\n> {\n declare props: ProcessIndicatorProps &\n Required<Pick<ProcessIndicatorProps, keyof typeof ProcessIndicator.defaultProps>>;\n\n static defaultProps = {\n status: 'processing',\n size: 'sm',\n } satisfies Partial<ProcessIndicatorProps>;\n\n interval = 0;\n timeout = 0;\n\n constructor(props: ProcessIndicator['props']) {\n super(props);\n this.state = {\n status: props.status,\n size: props.size,\n };\n }\n\n /**\n * Create interval for animation duration (1500ms)\n * Update state only at the end of every interval\n * (end of animation loop) if props changed before end of animation\n */\n componentDidMount() {\n this.interval = window.setInterval(() => {\n const { status: targetStatus, size: targetSize, onAnimationCompleted } = this.props;\n const { status: currentStatus, size: currentSize } = this.state;\n\n if (currentStatus !== targetStatus) {\n this.setState({ status: targetStatus }, () => {\n if (onAnimationCompleted) {\n this.timeout = window.setTimeout(() => {\n onAnimationCompleted(targetStatus);\n }, ANIMATION_DURATION_IN_MS);\n }\n });\n }\n\n if (currentSize !== targetSize) {\n this.setState({ size: targetSize });\n }\n }, ANIMATION_DURATION_IN_MS);\n }\n\n /**\n * Only trigger render if comopnent's state got\n * updated from interval callback\n */\n shouldComponentUpdate(nextProps: ProcessIndicator['props'], nextState: ProcessIndicatorState) {\n const isSameStatus = nextProps.status === nextState.status;\n const isSameSize = nextProps.size === nextState.size;\n\n return isSameStatus && isSameSize;\n }\n\n // Clear interval before destroying component\n componentWillUnmount() {\n window.clearInterval(this.interval);\n window.clearTimeout(this.timeout);\n }\n\n render() {\n const { className, 'data-testid': dataTestId } = this.props;\n const { size, status } = this.state;\n const classes = clsx(`process process-${size}`, className, {\n [`process-danger`]: status === Status.FAILED,\n [`process-stopped`]: status === Status.HIDDEN,\n [`process-success`]: status === Status.SUCCEEDED,\n });\n\n return (\n <span className={classes} data-testid={dataTestId}>\n <span className=\"process-icon-container\">\n <span className=\"process-icon-horizontal\" />\n <span className=\"process-icon-vertical\" />\n </span>\n <svg xmlns=\"http://www.w3.org/2000/svg\">\n <circle className=\"process-circle\" cx=\"50%\" cy=\"50%\" r={radius[size]} fillOpacity=\"0.0\" />\n </svg>\n </span>\n );\n }\n}\n"],"names":["radius","xxs","xs","sm","xl","ANIMATION_DURATION_IN_MS","ProcessIndicator","Component","defaultProps","status","size","interval","timeout","constructor","props","state","componentDidMount","window","setInterval","targetStatus","targetSize","onAnimationCompleted","currentStatus","currentSize","setState","setTimeout","shouldComponentUpdate","nextProps","nextState","isSameStatus","isSameSize","componentWillUnmount","clearInterval","clearTimeout","render","className","dataTestId","classes","clsx","Status","FAILED","HIDDEN","SUCCEEDED","_jsxs","children","_jsx","xmlns","cx","cy","r","fillOpacity"],"mappings":"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"}
@@ -3,10 +3,32 @@
3
3
  var componentsTheming = require('@wise/components-theming');
4
4
  var clsx = require('clsx');
5
5
  var Body = require('../body/Body.js');
6
+ require('../common/theme.js');
7
+ require('../common/direction.js');
8
+ require('../common/propsValues/control.js');
9
+ require('../common/propsValues/breakpoint.js');
10
+ require('../common/propsValues/size.js');
11
+ var typography = require('../common/propsValues/typography.js');
12
+ require('../common/propsValues/width.js');
13
+ require('../common/propsValues/type.js');
14
+ require('../common/propsValues/dateMode.js');
15
+ require('../common/propsValues/monthFormat.js');
16
+ require('../common/propsValues/position.js');
17
+ require('../common/propsValues/layouts.js');
18
+ require('../common/propsValues/status.js');
19
+ require('../common/propsValues/sentiment.js');
20
+ require('../common/propsValues/profileType.js');
21
+ require('../common/propsValues/variant.js');
22
+ require('../common/propsValues/scroll.js');
23
+ require('../common/propsValues/markdownNodeType.js');
24
+ require('../common/fileType.js');
25
+ require('@transferwise/icons');
26
+ require('react');
27
+ require('react-intl');
28
+ require('../common/closeButton/CloseButton.messages.js');
29
+ var jsxRuntime = require('react/jsx-runtime');
6
30
  var Progress = require('../progress/Progress.js');
7
31
  var Title = require('../title/Title.js');
8
- var jsxRuntime = require('react/jsx-runtime');
9
- var typography = require('../common/propsValues/typography.js');
10
32
 
11
33
  const ProgressBar = ({
12
34
  className,
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressBar.js","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: string;\n id: string;\n title: string;\n progress: { value: number; max: number };\n textEnd: string;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;AAiBMA,MAAAA,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA,OAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,0BAAQ,EAAE,CAAA;AAC/B,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,SAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,eAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,cAAA,CAACC,KAAK,EAAA;QACJC,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,CAAe,YAAA,CAAA;AAAAI,QAAAA,QAAA,EAE3DP,KAAAA;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,cAAA,CAACK,IAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET,WAAAA;AAAW,OAAO,CAAC,CAAA;AAAA,KACrC,CACP,eAAAW,cAAA,CAACM,QAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA,QAAAA;AAAS,KACrC,CAAA,eAAAQ,cAAA,CAACK,IAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,qBAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL,OAAAA;AAAO,KACJ,CACR,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
1
+ {"version":3,"file":"ProgressBar.js","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: string;\n id: string;\n title: string;\n progress: { value: number; max: number };\n textEnd: string;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBMA,MAAAA,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA,OAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,0BAAQ,EAAE,CAAA;AAC/B,EAAA,oBACEC,eAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,SAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,eAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,cAAA,CAACC,KAAK,EAAA;QACJC,IAAI,EAAEC,qBAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,CAAe,YAAA,CAAA;AAAAI,QAAAA,QAAA,EAE3DP,KAAAA;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,cAAA,CAACK,IAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET,WAAAA;AAAW,OAAO,CAAC,CAAA;AAAA,KACrC,CACP,eAAAW,cAAA,CAACM,QAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA,QAAAA;AAAS,KACrC,CAAA,eAAAQ,cAAA,CAACK,IAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,qBAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL,OAAAA;AAAO,KACJ,CACR,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
@@ -1,10 +1,32 @@
1
1
  import { useTheme } from '@wise/components-theming';
2
2
  import { clsx } from 'clsx';
3
3
  import Body from '../body/Body.mjs';
4
+ import '../common/theme.mjs';
5
+ import '../common/direction.mjs';
6
+ import '../common/propsValues/control.mjs';
7
+ import '../common/propsValues/breakpoint.mjs';
8
+ import '../common/propsValues/size.mjs';
9
+ import { Typography } from '../common/propsValues/typography.mjs';
10
+ import '../common/propsValues/width.mjs';
11
+ import '../common/propsValues/type.mjs';
12
+ import '../common/propsValues/dateMode.mjs';
13
+ import '../common/propsValues/monthFormat.mjs';
14
+ import '../common/propsValues/position.mjs';
15
+ import '../common/propsValues/layouts.mjs';
16
+ import '../common/propsValues/status.mjs';
17
+ import '../common/propsValues/sentiment.mjs';
18
+ import '../common/propsValues/profileType.mjs';
19
+ import '../common/propsValues/variant.mjs';
20
+ import '../common/propsValues/scroll.mjs';
21
+ import '../common/propsValues/markdownNodeType.mjs';
22
+ import '../common/fileType.mjs';
23
+ import '@transferwise/icons';
24
+ import 'react';
25
+ import 'react-intl';
26
+ import '../common/closeButton/CloseButton.messages.mjs';
27
+ import { jsxs, jsx } from 'react/jsx-runtime';
4
28
  import Progress from '../progress/Progress.mjs';
5
29
  import Title from '../title/Title.mjs';
6
- import { jsxs, jsx } from 'react/jsx-runtime';
7
- import { Typography } from '../common/propsValues/typography.mjs';
8
30
 
9
31
  const ProgressBar = ({
10
32
  className,
@@ -1 +1 @@
1
- {"version":3,"file":"ProgressBar.mjs","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: string;\n id: string;\n title: string;\n progress: { value: number; max: number };\n textEnd: string;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;AAiBMA,MAAAA,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA,OAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,QAAQ,EAAE,CAAA;AAC/B,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,IAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,IAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,GAAA,CAACC,KAAK,EAAA;QACJC,IAAI,EAAEC,UAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,CAAe,YAAA,CAAA;AAAAI,QAAAA,QAAA,EAE3DP,KAAAA;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,GAAA,CAACK,IAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET,WAAAA;AAAW,OAAO,CAAC,CAAA;AAAA,KACrC,CACP,eAAAW,GAAA,CAACM,QAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA,QAAAA;AAAS,KACrC,CAAA,eAAAQ,GAAA,CAACK,IAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,UAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL,OAAAA;AAAO,KACJ,CACR,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
1
+ {"version":3,"file":"ProgressBar.mjs","sources":["../../src/progressBar/ProgressBar.tsx"],"sourcesContent":["import { useTheme } from '@wise/components-theming';\nimport { clsx } from 'clsx';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Progress from '../progress';\nimport Title from '../title/Title';\n\nexport type ProgressBarProps = {\n className?: string;\n description?: string;\n id: string;\n title: string;\n progress: { value: number; max: number };\n textEnd: string;\n};\n\nconst ProgressBar = ({\n className,\n description,\n id,\n title,\n progress,\n textEnd,\n}: ProgressBarProps) => {\n const { isModern } = useTheme();\n return (\n <div className={clsx('np-progress-bar', className)}>\n <label className=\"np-progress-bar__title m-b-1\" htmlFor={id}>\n <Title\n type={Typography.TITLE_BODY}\n className={isModern ? `m-b-1 text-primary` : `text-primary`}\n >\n {title}\n </Title>\n {description && <Body>{description}</Body>}\n </label>\n <Progress id={id} progress={progress} />\n <Body\n as=\"p\"\n type={Typography.BODY_DEFAULT_BOLD}\n className=\"d-flex justify-content-end text-primary m-b-0\"\n >\n {textEnd}\n </Body>\n </div>\n );\n};\n\nexport default ProgressBar;\n"],"names":["ProgressBar","className","description","id","title","progress","textEnd","isModern","useTheme","_jsxs","clsx","children","htmlFor","_jsx","Title","type","Typography","TITLE_BODY","Body","Progress","as","BODY_DEFAULT_BOLD"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBMA,MAAAA,WAAW,GAAGA,CAAC;EACnBC,SAAS;EACTC,WAAW;EACXC,EAAE;EACFC,KAAK;EACLC,QAAQ;AACRC,EAAAA,OAAAA;AAAO,CACU,KAAI;EACrB,MAAM;AAAEC,IAAAA,QAAAA;GAAU,GAAGC,QAAQ,EAAE,CAAA;AAC/B,EAAA,oBACEC,IAAA,CAAA,KAAA,EAAA;AAAKR,IAAAA,SAAS,EAAES,IAAI,CAAC,iBAAiB,EAAET,SAAS,CAAE;AAAAU,IAAAA,QAAA,gBACjDF,IAAA,CAAA,OAAA,EAAA;AAAOR,MAAAA,SAAS,EAAC,8BAA8B;AAACW,MAAAA,OAAO,EAAET,EAAG;MAAAQ,QAAA,EAAA,cAC1DE,GAAA,CAACC,KAAK,EAAA;QACJC,IAAI,EAAEC,UAAU,CAACC,UAAW;AAC5BhB,QAAAA,SAAS,EAAEM,QAAQ,GAAG,CAAA,kBAAA,CAAoB,GAAG,CAAe,YAAA,CAAA;AAAAI,QAAAA,QAAA,EAE3DP,KAAAA;AAAK,OACD,CACP,EAACF,WAAW,iBAAIW,GAAA,CAACK,IAAI,EAAA;AAAAP,QAAAA,QAAA,EAAET,WAAAA;AAAW,OAAO,CAAC,CAAA;AAAA,KACrC,CACP,eAAAW,GAAA,CAACM,QAAQ,EAAA;AAAChB,MAAAA,EAAE,EAAEA,EAAG;AAACE,MAAAA,QAAQ,EAAEA,QAAAA;AAAS,KACrC,CAAA,eAAAQ,GAAA,CAACK,IAAI,EAAA;AACHE,MAAAA,EAAE,EAAC,GAAG;MACNL,IAAI,EAAEC,UAAU,CAACK,iBAAkB;AACnCpB,MAAAA,SAAS,EAAC,+CAA+C;AAAAU,MAAAA,QAAA,EAExDL,OAAAA;AAAO,KACJ,CACR,CAAA;AAAA,GAAK,CAAC,CAAA;AAEV;;;;"}
@@ -4,14 +4,34 @@ var icons = require('@transferwise/icons');
4
4
  var clsx = require('clsx');
5
5
  var React = require('react');
6
6
  var Body = require('../body/Body.js');
7
+ require('../common/theme.js');
8
+ require('../common/direction.js');
9
+ require('../common/propsValues/control.js');
10
+ require('../common/propsValues/breakpoint.js');
11
+ require('../common/propsValues/size.js');
12
+ var typography = require('../common/propsValues/typography.js');
13
+ require('../common/propsValues/width.js');
14
+ require('../common/propsValues/type.js');
15
+ require('../common/propsValues/dateMode.js');
16
+ require('../common/propsValues/monthFormat.js');
17
+ require('../common/propsValues/position.js');
18
+ require('../common/propsValues/layouts.js');
19
+ require('../common/propsValues/status.js');
20
+ require('../common/propsValues/sentiment.js');
21
+ require('../common/propsValues/profileType.js');
22
+ require('../common/propsValues/variant.js');
23
+ require('../common/propsValues/scroll.js');
24
+ require('../common/propsValues/markdownNodeType.js');
25
+ require('../common/fileType.js');
26
+ require('react-intl');
27
+ require('../common/closeButton/CloseButton.messages.js');
28
+ var jsxRuntime = require('react/jsx-runtime');
7
29
  var Card = require('../common/card/Card.js');
8
30
  var Display = require('../display/Display.js');
9
31
  var Image = require('../image/Image.js');
10
32
  var Title = require('../title/Title.js');
11
33
  var PromoCardContext = require('./PromoCardContext.js');
12
34
  var PromoCardIndicator = require('./PromoCardIndicator.js');
13
- var jsxRuntime = require('react/jsx-runtime');
14
- var typography = require('../common/propsValues/typography.js');
15
35
 
16
36
  function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
17
37
 
@@ -1 +1 @@
1
- {"version":3,"file":"PromoCard.js","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> | React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n | ''\n | 'alternate'\n | 'author'\n | 'bookmark'\n | 'external'\n | 'help'\n | 'license'\n | 'next'\n | 'nofollow'\n | 'noreferrer'\n | 'noopener'\n | 'prev'\n | 'search'\n | 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard */\n className?: string;\n\n /** Optional prop to specify the ID of the PromoCard */\n id?: string;\n\n /** Required prop to specify the descriptive text of the PromoCard */\n description: string;\n\n /**\n * Optional prop to specify the heading level of the PromoCard\n *\n * @default 'h3'\n */\n headingLevel?: 'h3' | 'h4' | 'h5' | 'h6';\n\n /** Optional prop to specify text for the indicator label of the PromoCard */\n indicatorLabel?: string;\n\n /** Optional prop to specify the icon for the indicator icon of the PromoCard */\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /** Optional prop to specify an image alt text */\n imageAlt?: string;\n\n /** Optional prop to specify an image class */\n imageClass?: string;\n\n /** Optional prop to specify an image source url */\n imageSource?: string;\n\n /** Specify whether the PromoCard is disabled, or not */\n isDisabled?: boolean;\n\n /** Specify an onClick event handler */\n onClick?: () => void;\n\n /** Specify an onKeyDown event handler */\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /** Optional prop to specify the ID used for testing */\n testId?: string;\n\n /** Required prop to specify the title text of the PromoCard */\n title: string;\n\n /** Set to false to use body font style for the title */\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /**\n * Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n */\n download?: string;\n\n /** Optionally specify an href for your PromoCard to contain an <a> element */\n href?: string;\n\n /** Optionally specify the language of the linked URL */\n hrefLang?: string;\n\n /** Optional property that can be pass a ref for the anchor. */\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /**\n * Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n */\n anchorId?: string;\n\n /**\n * Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n */\n rel?: RelatedTypes;\n\n /** Optional prop to to display where the linked URL will show */\n target?: React.HTMLAttributeAnchorTarget;\n\n /** Only applies to role=\"radio\" or \"checkbox\" */\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /** Specify the initial checked attribute of the PromoCard */\n defaultChecked?: boolean;\n\n /** Specify whether the PromoCard is checked, or not */\n isChecked?: boolean;\n\n /** Optional prop to specify the tabIndex of the PromoCard */\n tabIndex?: number;\n\n /** Optional property to provide component Ref */\n ref?: ReferenceType;\n\n /** Optional prop to specify the input type of the PromoCard */\n type?: 'checkbox' | 'radio';\n\n /** Specify the value attribute of the PromoCard if Checkbox or Radio */\n value?: string;\n\n /** Only applies to <a />s */\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps | PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps | PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/**\n * PromoCard component.\n *\n * PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n *\n * @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value || ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id || fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled || contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href || undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' || type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' || type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state || checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt || ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}
1
+ {"version":3,"file":"PromoCard.js","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> | React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n | ''\n | 'alternate'\n | 'author'\n | 'bookmark'\n | 'external'\n | 'help'\n | 'license'\n | 'next'\n | 'nofollow'\n | 'noreferrer'\n | 'noopener'\n | 'prev'\n | 'search'\n | 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard */\n className?: string;\n\n /** Optional prop to specify the ID of the PromoCard */\n id?: string;\n\n /** Required prop to specify the descriptive text of the PromoCard */\n description: string;\n\n /**\n * Optional prop to specify the heading level of the PromoCard\n *\n * @default 'h3'\n */\n headingLevel?: 'h3' | 'h4' | 'h5' | 'h6';\n\n /** Optional prop to specify text for the indicator label of the PromoCard */\n indicatorLabel?: string;\n\n /** Optional prop to specify the icon for the indicator icon of the PromoCard */\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /** Optional prop to specify an image alt text */\n imageAlt?: string;\n\n /** Optional prop to specify an image class */\n imageClass?: string;\n\n /** Optional prop to specify an image source url */\n imageSource?: string;\n\n /** Specify whether the PromoCard is disabled, or not */\n isDisabled?: boolean;\n\n /** Specify an onClick event handler */\n onClick?: () => void;\n\n /** Specify an onKeyDown event handler */\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /** Optional prop to specify the ID used for testing */\n testId?: string;\n\n /** Required prop to specify the title text of the PromoCard */\n title: string;\n\n /** Set to false to use body font style for the title */\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /**\n * Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n */\n download?: string;\n\n /** Optionally specify an href for your PromoCard to contain an <a> element */\n href?: string;\n\n /** Optionally specify the language of the linked URL */\n hrefLang?: string;\n\n /** Optional property that can be pass a ref for the anchor. */\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /**\n * Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n */\n anchorId?: string;\n\n /**\n * Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n */\n rel?: RelatedTypes;\n\n /** Optional prop to to display where the linked URL will show */\n target?: React.HTMLAttributeAnchorTarget;\n\n /** Only applies to role=\"radio\" or \"checkbox\" */\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /** Specify the initial checked attribute of the PromoCard */\n defaultChecked?: boolean;\n\n /** Specify whether the PromoCard is checked, or not */\n isChecked?: boolean;\n\n /** Optional prop to specify the tabIndex of the PromoCard */\n tabIndex?: number;\n\n /** Optional property to provide component Ref */\n ref?: ReferenceType;\n\n /** Optional prop to specify the input type of the PromoCard */\n type?: 'checkbox' | 'radio';\n\n /** Specify the value attribute of the PromoCard if Checkbox or Radio */\n value?: string;\n\n /** Only applies to <a />s */\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps | PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps | PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/**\n * PromoCard component.\n *\n * PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n *\n * @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value || ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id || fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled || contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href || undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' || type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' || type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state || checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt || ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}
@@ -2,14 +2,34 @@ import { Check } from '@transferwise/icons';
2
2
  import { clsx } from 'clsx';
3
3
  import React__default, { forwardRef, useState, useId, useEffect } from 'react';
4
4
  import Body from '../body/Body.mjs';
5
+ import '../common/theme.mjs';
6
+ import '../common/direction.mjs';
7
+ import '../common/propsValues/control.mjs';
8
+ import '../common/propsValues/breakpoint.mjs';
9
+ import '../common/propsValues/size.mjs';
10
+ import { Typography } from '../common/propsValues/typography.mjs';
11
+ import '../common/propsValues/width.mjs';
12
+ import '../common/propsValues/type.mjs';
13
+ import '../common/propsValues/dateMode.mjs';
14
+ import '../common/propsValues/monthFormat.mjs';
15
+ import '../common/propsValues/position.mjs';
16
+ import '../common/propsValues/layouts.mjs';
17
+ import '../common/propsValues/status.mjs';
18
+ import '../common/propsValues/sentiment.mjs';
19
+ import '../common/propsValues/profileType.mjs';
20
+ import '../common/propsValues/variant.mjs';
21
+ import '../common/propsValues/scroll.mjs';
22
+ import '../common/propsValues/markdownNodeType.mjs';
23
+ import '../common/fileType.mjs';
24
+ import 'react-intl';
25
+ import '../common/closeButton/CloseButton.messages.mjs';
26
+ import { jsxs, jsx } from 'react/jsx-runtime';
5
27
  import Card from '../common/card/Card.mjs';
6
28
  import Display from '../display/Display.mjs';
7
29
  import Image from '../image/Image.mjs';
8
30
  import Title from '../title/Title.mjs';
9
31
  import { usePromoCardContext } from './PromoCardContext.mjs';
10
32
  import PromoCardIndicator from './PromoCardIndicator.mjs';
11
- import { jsxs, jsx } from 'react/jsx-runtime';
12
- import { Typography } from '../common/propsValues/typography.mjs';
13
33
 
14
34
  const PromoCard = /*#__PURE__*/forwardRef(({
15
35
  className,
@@ -1 +1 @@
1
- {"version":3,"file":"PromoCard.mjs","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> | React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n | ''\n | 'alternate'\n | 'author'\n | 'bookmark'\n | 'external'\n | 'help'\n | 'license'\n | 'next'\n | 'nofollow'\n | 'noreferrer'\n | 'noopener'\n | 'prev'\n | 'search'\n | 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard */\n className?: string;\n\n /** Optional prop to specify the ID of the PromoCard */\n id?: string;\n\n /** Required prop to specify the descriptive text of the PromoCard */\n description: string;\n\n /**\n * Optional prop to specify the heading level of the PromoCard\n *\n * @default 'h3'\n */\n headingLevel?: 'h3' | 'h4' | 'h5' | 'h6';\n\n /** Optional prop to specify text for the indicator label of the PromoCard */\n indicatorLabel?: string;\n\n /** Optional prop to specify the icon for the indicator icon of the PromoCard */\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /** Optional prop to specify an image alt text */\n imageAlt?: string;\n\n /** Optional prop to specify an image class */\n imageClass?: string;\n\n /** Optional prop to specify an image source url */\n imageSource?: string;\n\n /** Specify whether the PromoCard is disabled, or not */\n isDisabled?: boolean;\n\n /** Specify an onClick event handler */\n onClick?: () => void;\n\n /** Specify an onKeyDown event handler */\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /** Optional prop to specify the ID used for testing */\n testId?: string;\n\n /** Required prop to specify the title text of the PromoCard */\n title: string;\n\n /** Set to false to use body font style for the title */\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /**\n * Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n */\n download?: string;\n\n /** Optionally specify an href for your PromoCard to contain an <a> element */\n href?: string;\n\n /** Optionally specify the language of the linked URL */\n hrefLang?: string;\n\n /** Optional property that can be pass a ref for the anchor. */\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /**\n * Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n */\n anchorId?: string;\n\n /**\n * Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n */\n rel?: RelatedTypes;\n\n /** Optional prop to to display where the linked URL will show */\n target?: React.HTMLAttributeAnchorTarget;\n\n /** Only applies to role=\"radio\" or \"checkbox\" */\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /** Specify the initial checked attribute of the PromoCard */\n defaultChecked?: boolean;\n\n /** Specify whether the PromoCard is checked, or not */\n isChecked?: boolean;\n\n /** Optional prop to specify the tabIndex of the PromoCard */\n tabIndex?: number;\n\n /** Optional property to provide component Ref */\n ref?: ReferenceType;\n\n /** Optional prop to specify the input type of the PromoCard */\n type?: 'checkbox' | 'radio';\n\n /** Specify the value attribute of the PromoCard if Checkbox or Radio */\n value?: string;\n\n /** Only applies to <a />s */\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps | PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps | PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/**\n * PromoCard component.\n *\n * PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n *\n * @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value || ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id || fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled || contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href || undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' || type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' || type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state || checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt || ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}
1
+ {"version":3,"file":"PromoCard.mjs","sources":["../../src/promoCard/PromoCard.tsx"],"sourcesContent":["import { Check } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport React, { forwardRef, FunctionComponent, useEffect, useId, useState } from 'react';\n\nimport Body from '../body';\nimport { Typography } from '../common';\nimport Card, { type CardProps } from '../common/card';\nimport Display from '../display';\nimport Image from '../image/Image';\nimport Title from '../title';\n\nimport { usePromoCardContext } from './PromoCardContext';\nimport PromoCardIndicator, { type PromoCardIndicatorProps } from './PromoCardIndicator';\n\nexport type ReferenceType = React.Ref<HTMLInputElement> | React.Ref<HTMLDivElement>;\nexport type RelatedTypes =\n | ''\n | 'alternate'\n | 'author'\n | 'bookmark'\n | 'external'\n | 'help'\n | 'license'\n | 'next'\n | 'nofollow'\n | 'noreferrer'\n | 'noopener'\n | 'prev'\n | 'search'\n | 'tag';\n\nexport interface PromoCardCommonProps {\n /** Optional prop to specify classNames onto the PromoCard */\n className?: string;\n\n /** Optional prop to specify the ID of the PromoCard */\n id?: string;\n\n /** Required prop to specify the descriptive text of the PromoCard */\n description: string;\n\n /**\n * Optional prop to specify the heading level of the PromoCard\n *\n * @default 'h3'\n */\n headingLevel?: 'h3' | 'h4' | 'h5' | 'h6';\n\n /** Optional prop to specify text for the indicator label of the PromoCard */\n indicatorLabel?: string;\n\n /** Optional prop to specify the icon for the indicator icon of the PromoCard */\n indicatorIcon?: PromoCardIndicatorProps['icon'];\n\n /** Optional prop to specify an image alt text */\n imageAlt?: string;\n\n /** Optional prop to specify an image class */\n imageClass?: string;\n\n /** Optional prop to specify an image source url */\n imageSource?: string;\n\n /** Specify whether the PromoCard is disabled, or not */\n isDisabled?: boolean;\n\n /** Specify an onClick event handler */\n onClick?: () => void;\n\n /** Specify an onKeyDown event handler */\n onKeyDown?: (event: React.KeyboardEvent<HTMLInputElement>) => void;\n\n /** Optional prop to specify the ID used for testing */\n testId?: string;\n\n /** Required prop to specify the title text of the PromoCard */\n title: string;\n\n /** Set to false to use body font style for the title */\n useDisplayFont?: boolean;\n\n ref?: ReferenceType;\n}\n\nexport interface PromoCardLinkProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /**\n * Optional prop to prompts a user to save the linked URL instead of\n * navigating to it\n */\n download?: string;\n\n /** Optionally specify an href for your PromoCard to contain an <a> element */\n href?: string;\n\n /** Optionally specify the language of the linked URL */\n hrefLang?: string;\n\n /** Optional property that can be pass a ref for the anchor. */\n anchorRef?: React.Ref<HTMLAnchorElement>;\n\n /**\n * Optional prop to specify the ID of the anchor element which can be useful when using a ref.\n */\n anchorId?: string;\n\n /**\n * Relationship between the PromoCard href URL and the current page. See\n * [MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/rel).\n */\n rel?: RelatedTypes;\n\n /** Optional prop to to display where the linked URL will show */\n target?: React.HTMLAttributeAnchorTarget;\n\n /** Only applies to role=\"radio\" or \"checkbox\" */\n defaultChecked?: never;\n isChecked?: never;\n tabIndex?: never;\n type?: never;\n ref?: ReferenceType;\n value?: never;\n}\n\nexport interface PromoCardCheckedProps extends PromoCardCommonProps, Omit<CardProps, 'children'> {\n /** Specify the initial checked attribute of the PromoCard */\n defaultChecked?: boolean;\n\n /** Specify whether the PromoCard is checked, or not */\n isChecked?: boolean;\n\n /** Optional prop to specify the tabIndex of the PromoCard */\n tabIndex?: number;\n\n /** Optional property to provide component Ref */\n ref?: ReferenceType;\n\n /** Optional prop to specify the input type of the PromoCard */\n type?: 'checkbox' | 'radio';\n\n /** Specify the value attribute of the PromoCard if Checkbox or Radio */\n value?: string;\n\n /** Only applies to <a />s */\n download?: never;\n href?: never;\n anchorRef?: never;\n anchorId?: never;\n hrefLang?: never;\n rel?: never;\n target?: never;\n}\n\nexport type PromoCardProps = PromoCardLinkProps | PromoCardCheckedProps;\n\nexport type PolymorphicPromoCard = (\n props: PromoCardLinkProps | PromoCardCheckedProps,\n) => React.JSX.Element;\n\n/**\n * PromoCard component.\n *\n * PromoCard is a marketing style component that is used to group marketing\n * product related information (such as choosing Card types). It can be used to\n * display information in a structured way, and can be customized with various\n * props to suit different use cases.\n *\n * @component\n * @param {string} className - Additional class name for the PromoCard.\n * @param {string} description - Description text for the PromoCard.\n * @param {boolean} defaultChecked - Initial checked state for checkboxes and radios.\n * @param {string} download - Download file name for links.\n * @param {string} href - URL for links.\n * @param {string} hrefLang - Language code for linked URL.\n * @param {string} id - ID of the PromoCard.\n * @param {string} imageAlt - Alt text for the image.\n * @param {string} imageSource - Source URL of the image.\n * @param {string} indicatorLabel - Label for the indicator icon.\n * @param {boolean} isChecked - Checked state for checkboxes and radios.\n * @param {boolean} isDisabled - Whether the PromoCard is disabled.\n * @param {Function} onClick - Click event handler for the PromoCard.\n * @param {string} rel - Relationship between the URL and the current page.\n * @param {number} tabIndex - Tab index for keyboard navigation.\n * @param {string} target - Target window for links.\n * @param {string} testId - ID used for testing.\n * @param {string} title - Title text of the PromoCard.\n * @param {('checkbox'|'radio')} type - Type of the PromoCard (checkbox, radio).\n * @param {string} value - Value for checkboxes and radios.\n * @returns {React.JSX.Element} The rendered PromoCard component.\n * @example\n * <PromoCard\n * title=\"Example PromoCard\"\n * description=\"This is an example PromoCard with a link variation.\"\n * href=\"https://example.com\"\n * target=\"_blank\"\n * imageSource=\"https://example.com/image.png\"\n * imageAlt=\"Example Image\"\n * indicatorLabel=\"Learn More\"\n * />\n */\nconst PromoCard: FunctionComponent<PromoCardProps> = forwardRef(\n (\n {\n className,\n description,\n defaultChecked,\n download,\n href,\n hrefLang,\n id,\n headingLevel = 'h3',\n imageAlt,\n imageClass,\n imageSource,\n indicatorLabel,\n indicatorIcon,\n isChecked,\n isDisabled,\n onClick,\n onKeyDown,\n rel,\n tabIndex,\n target,\n testId,\n title,\n type,\n value,\n isSmall,\n useDisplayFont = true,\n anchorRef,\n anchorId,\n ...props\n },\n ref: ReferenceType,\n ) => {\n // Set the `checked` state to the value of `defaultChecked` if it is truthy,\n // or the value of `isChecked` if it is truthy, or `false` if neither\n // is truthy.\n const { state, onChange, isDisabled: contextIsDisabled } = usePromoCardContext();\n const [checked, setChecked] = useState(\n type === 'checkbox' ? (defaultChecked ?? isChecked ?? false) : false,\n );\n\n const handleClick = () => {\n if (type === 'radio') {\n onChange(value || ''); // Update the context state for radio\n } else if (type === 'checkbox') {\n setChecked(!checked); // Update local state for checkbox\n }\n };\n\n const fallbackId = useId();\n const componentId = id || fallbackId;\n\n // Set the icon to `'arrow'` if `href` is truthy and `type` is falsy, or\n // `'download'` if `download` is truthy. If neither condition is true, set\n // `icon` to `undefined`.\n\n // Create a function to get icon type\n const getIconType = () => {\n if (indicatorIcon) {\n return indicatorIcon;\n }\n\n if (download) {\n return 'download';\n }\n\n if (href && !type) {\n return 'arrow';\n }\n\n return undefined;\n };\n\n const CardTitle = useDisplayFont ? Display : Title;\n\n // Define all class names string based on the values of the `href`, `type`,\n // `checked`, and `className` props.\n const commonClasses = clsx(\n {\n 'np-Card--promoCard': true,\n 'np-Card--checked': !href && type,\n 'np-Card--link': href && !type,\n 'is-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n },\n className,\n );\n\n // Object with common props that will be passed to the `Card` components\n const commonProps = {\n className: commonClasses,\n id: componentId,\n isDisabled: isDisabled || contextIsDisabled,\n onClick,\n onKeyDown,\n ref,\n 'data-testid': testId,\n isSmall,\n };\n\n // Object with Anchor props that will be passed to the `a` element. These\n // won't be refurned if set to `isDisabled`\n const anchorProps =\n href && !isDisabled\n ? {\n download,\n href: href || undefined,\n hrefLang,\n rel,\n target,\n ref: anchorRef,\n id: anchorId,\n }\n : {};\n\n // Object of all Checked props that will be passed to the root `Card` component\n const checkedProps =\n (type === 'checkbox' || type === 'radio') && !href\n ? {\n ...commonProps,\n 'aria-checked':\n type === 'radio' ? value === state : type === 'checkbox' ? checked : undefined,\n 'aria-describedby': `${componentId}-title`,\n 'aria-disabled': isDisabled,\n 'data-value': value ?? undefined,\n role: type === 'checkbox' || type === 'radio' ? type : undefined,\n onClick: handleClick,\n onKeyDown: (event: React.KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter' || event.key === ' ') {\n handleClick();\n }\n },\n ref,\n tabIndex: 0,\n }\n : {};\n\n const getTitle = () => {\n const titleContent =\n href && !type ? (\n <a className=\"np-Card-titleLink\" {...anchorProps}>\n {title}\n </a>\n ) : (\n title\n );\n\n const titleProps = {\n id: `${componentId}-title`,\n as: headingLevel,\n className: 'np-Card-title',\n };\n\n return useDisplayFont ? (\n <Display type={Typography.DISPLAY_SMALL} {...titleProps}>\n {titleContent}\n </Display>\n ) : (\n <Title type={Typography.TITLE_SUBSECTION} {...titleProps}>\n {titleContent}\n </Title>\n );\n };\n\n useEffect(() => {\n setChecked(defaultChecked ?? isChecked ?? false);\n }, [defaultChecked, isChecked]);\n\n return (\n <Card {...commonProps} {...checkedProps} {...props}>\n {(value === state || checked) && (\n <span className=\"np-Card-check\">\n <Check size={24} aria-hidden=\"true\" />\n </span>\n )}\n\n {getTitle()}\n\n <Body className=\"np-Card-description\">{description}</Body>\n\n {imageSource && (\n <div className={clsx('np-Card-image', { imageClass })}>\n <Image src={imageSource} alt={imageAlt || ''} loading=\"lazy\" />\n </div>\n )}\n\n <PromoCardIndicator label={indicatorLabel} icon={getIconType()} isSmall={isSmall} />\n </Card>\n );\n },\n) as PolymorphicPromoCard;\n\nexport default React.memo(PromoCard);\n"],"names":["PromoCard","forwardRef","className","description","defaultChecked","download","href","hrefLang","id","headingLevel","imageAlt","imageClass","imageSource","indicatorLabel","indicatorIcon","isChecked","isDisabled","onClick","onKeyDown","rel","tabIndex","target","testId","title","type","value","isSmall","useDisplayFont","anchorRef","anchorId","props","ref","state","onChange","contextIsDisabled","usePromoCardContext","checked","setChecked","useState","handleClick","fallbackId","useId","componentId","getIconType","undefined","commonClasses","clsx","commonProps","anchorProps","checkedProps","role","event","key","getTitle","titleContent","_jsx","children","titleProps","as","Display","Typography","DISPLAY_SMALL","Title","TITLE_SUBSECTION","useEffect","_jsxs","Card","Check","size","Body","Image","src","alt","loading","PromoCardIndicator","label","icon","React","memo"],"mappings":"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"}
@@ -5,8 +5,29 @@ var clsx = require('clsx');
5
5
  var avatarTypes = require('../avatar/avatarTypes.js');
6
6
  var Avatar = require('../avatar/Avatar.js');
7
7
  var Body = require('../body/Body.js');
8
- var jsxRuntime = require('react/jsx-runtime');
8
+ require('../common/theme.js');
9
+ require('../common/direction.js');
10
+ require('../common/propsValues/control.js');
11
+ require('../common/propsValues/breakpoint.js');
12
+ require('../common/propsValues/size.js');
9
13
  var typography = require('../common/propsValues/typography.js');
14
+ require('../common/propsValues/width.js');
15
+ require('../common/propsValues/type.js');
16
+ require('../common/propsValues/dateMode.js');
17
+ require('../common/propsValues/monthFormat.js');
18
+ require('../common/propsValues/position.js');
19
+ require('../common/propsValues/layouts.js');
20
+ require('../common/propsValues/status.js');
21
+ require('../common/propsValues/sentiment.js');
22
+ require('../common/propsValues/profileType.js');
23
+ require('../common/propsValues/variant.js');
24
+ require('../common/propsValues/scroll.js');
25
+ require('../common/propsValues/markdownNodeType.js');
26
+ require('../common/fileType.js');
27
+ require('react');
28
+ require('react-intl');
29
+ require('../common/closeButton/CloseButton.messages.js');
30
+ var jsxRuntime = require('react/jsx-runtime');
10
31
 
11
32
  const PromoCardIndicator = ({
12
33
  className,
@@ -1 +1 @@
1
- {"version":3,"file":"PromoCardIndicator.js","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Avatar, { AvatarType } from '../avatar';\nimport Body from '../body';\nimport { Typography } from '../common';\n\nexport type PromoCardIndicatorProps = {\n /** Optional class name(s) to add to the indicator container. */\n className?: string;\n\n /** Optional label to display next to the indicator. */\n label?: string;\n\n /** Optional icon to display in the indicator. */\n icon?: 'check' | 'arrow' | 'download' | ReactElement;\n\n /** Optional prop to specify whether the indicator is sized small or not. */\n isSmall?: boolean;\n\n /** Optional ID to add to the indicator container for testing purposes. */\n testid?: string;\n\n /** Optional children to display inside the indicator. */\n children?: ReactNode;\n};\n\n/**\n * PromoCardIndicator component.\n *\n * A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n *\n * @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string | ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n className,\n children,\n label,\n icon,\n isSmall = false,\n testid,\n ...rest\n}) => {\n const isIconString = icon && typeof icon === 'string';\n\n const IconComponent =\n isIconString &&\n {\n check: Check,\n arrow: ArrowRight,\n download: Download,\n }[icon];\n\n return (\n <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n {label && (\n <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n {label}\n </Body>\n )}\n {icon && (\n <Avatar\n type={AvatarType.ICON}\n size={isSmall ? 40 : 56}\n backgroundColor=\"var(--Card-indicator-icon-background-color)\"\n className=\"np-Card-indicatorIcon\"\n >\n {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n </Avatar>\n )}\n {children}\n </div>\n );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","Avatar","AvatarType","ICON","size","backgroundColor"],"mappings":";;;;;;;;;;AA4CMA,MAAAA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC,IAAAA;AACJ,CAAA,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,CAAA;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,WAAK;AACZC,IAAAA,KAAK,EAAEC,gBAAU;AACjBC,IAAAA,QAAQ,EAAEC,cAAAA;GACX,CAACX,IAAI,CAAC,CAAA;AAET,EAAA,oBACEY,eAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,SAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAChFC,CAAAA,KAAK,iBACJe,cAAA,CAACC,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC,KAAAA;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,cAAA,CAACM,MAAM,EAAA;MACLH,IAAI,EAAEI,sBAAU,CAACC,IAAK;AACtBC,MAAAA,IAAI,EAAEtB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBuB,MAAAA,eAAe,EAAC,6CAA6C;AAC7D3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,cAAA,CAACT,aAAa,EAAA;AAACkB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAY,EAAA,MAAA;AAAM,QAAG,GAAGvB,IAAAA;KAC5D,CACT,EACAF,QAAQ,CAAA;AAAA,GACN,CAAC,CAAA;AAEV;;;;"}
1
+ {"version":3,"file":"PromoCardIndicator.js","sources":["../../src/promoCard/PromoCardIndicator.tsx"],"sourcesContent":["import { ArrowRight, Check, Download } from '@transferwise/icons';\nimport { clsx } from 'clsx';\nimport { ReactElement, ReactNode } from 'react';\n\nimport Avatar, { AvatarType } from '../avatar';\nimport Body from '../body';\nimport { Typography } from '../common';\n\nexport type PromoCardIndicatorProps = {\n /** Optional class name(s) to add to the indicator container. */\n className?: string;\n\n /** Optional label to display next to the indicator. */\n label?: string;\n\n /** Optional icon to display in the indicator. */\n icon?: 'check' | 'arrow' | 'download' | ReactElement;\n\n /** Optional prop to specify whether the indicator is sized small or not. */\n isSmall?: boolean;\n\n /** Optional ID to add to the indicator container for testing purposes. */\n testid?: string;\n\n /** Optional children to display inside the indicator. */\n children?: ReactNode;\n};\n\n/**\n * PromoCardIndicator component.\n *\n * A PromoCardIndicator is a small component that can be used to display\n * additional information or actions related to a PromoCard. It can be\n * customized with various props to suit different use cases.\n *\n * @param {string} className - Optional class name(s) to add to the indicator container.\n * @param {string} label - Optional label to display next to the indicator.\n * @param {string | ReactElement} icon - Optional icon to display in the indicator.\n * @param {string} testid - Optional ID to add to the indicator container for testing purposes.\n * @param {ReactNode} children - Optional children to display inside the indicator.\n * @returns {React.JSX.Element} - The PromoCardIndicator component.\n * @example\n * <PromoCardIndicator label=\"Download\" icon=\"download\" />\n */\nconst PromoCardIndicator: React.FC<PromoCardIndicatorProps> = ({\n className,\n children,\n label,\n icon,\n isSmall = false,\n testid,\n ...rest\n}) => {\n const isIconString = icon && typeof icon === 'string';\n\n const IconComponent =\n isIconString &&\n {\n check: Check,\n arrow: ArrowRight,\n download: Download,\n }[icon];\n\n return (\n <div className={clsx('np-Card-indicator', className)} data-testid={testid} {...rest}>\n {label && (\n <Body as=\"span\" type={Typography.BODY_LARGE_BOLD} className=\"np-Card-indicatorText\">\n {label}\n </Body>\n )}\n {icon && (\n <Avatar\n type={AvatarType.ICON}\n size={isSmall ? 40 : 56}\n backgroundColor=\"var(--Card-indicator-icon-background-color)\"\n className=\"np-Card-indicatorIcon\"\n >\n {IconComponent ? <IconComponent size={24} aria-hidden=\"true\" /> : icon}\n </Avatar>\n )}\n {children}\n </div>\n );\n};\n\nexport default PromoCardIndicator;\n"],"names":["PromoCardIndicator","className","children","label","icon","isSmall","testid","rest","isIconString","IconComponent","check","Check","arrow","ArrowRight","download","Download","_jsxs","clsx","_jsx","Body","as","type","Typography","BODY_LARGE_BOLD","Avatar","AvatarType","ICON","size","backgroundColor"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4CMA,MAAAA,kBAAkB,GAAsCA,CAAC;EAC7DC,SAAS;EACTC,QAAQ;EACRC,KAAK;EACLC,IAAI;AACJC,EAAAA,OAAO,GAAG,KAAK;EACfC,MAAM;EACN,GAAGC,IAAAA;AACJ,CAAA,KAAI;AACH,EAAA,MAAMC,YAAY,GAAGJ,IAAI,IAAI,OAAOA,IAAI,KAAK,QAAQ,CAAA;EAErD,MAAMK,aAAa,GACjBD,YAAY,IACZ;AACEE,IAAAA,KAAK,EAAEC,WAAK;AACZC,IAAAA,KAAK,EAAEC,gBAAU;AACjBC,IAAAA,QAAQ,EAAEC,cAAAA;GACX,CAACX,IAAI,CAAC,CAAA;AAET,EAAA,oBACEY,eAAA,CAAA,KAAA,EAAA;AAAKf,IAAAA,SAAS,EAAEgB,SAAI,CAAC,mBAAmB,EAAEhB,SAAS,CAAE;AAAC,IAAA,aAAA,EAAaK,MAAO;AAAA,IAAA,GAAKC,IAAI;AAAAL,IAAAA,QAAA,EAChFC,CAAAA,KAAK,iBACJe,cAAA,CAACC,IAAI,EAAA;AAACC,MAAAA,EAAE,EAAC,MAAM;MAACC,IAAI,EAAEC,qBAAU,CAACC,eAAgB;AAACtB,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAChFC,KAAAA;AAAK,KACF,CACP,EACAC,IAAI,iBACHc,cAAA,CAACM,MAAM,EAAA;MACLH,IAAI,EAAEI,sBAAU,CAACC,IAAK;AACtBC,MAAAA,IAAI,EAAEtB,OAAO,GAAG,EAAE,GAAG,EAAG;AACxBuB,MAAAA,eAAe,EAAC,6CAA6C;AAC7D3B,MAAAA,SAAS,EAAC,uBAAuB;AAAAC,MAAAA,QAAA,EAEhCO,aAAa,gBAAGS,cAAA,CAACT,aAAa,EAAA;AAACkB,QAAAA,IAAI,EAAE,EAAG;QAAC,aAAY,EAAA,MAAA;AAAM,QAAG,GAAGvB,IAAAA;KAC5D,CACT,EACAF,QAAQ,CAAA;AAAA,GACN,CAAC,CAAA;AAEV;;;;"}
@@ -3,8 +3,29 @@ import { clsx } from 'clsx';
3
3
  import { AvatarType } from '../avatar/avatarTypes.mjs';
4
4
  import Avatar from '../avatar/Avatar.mjs';
5
5
  import Body from '../body/Body.mjs';
6
- import { jsxs, jsx } from 'react/jsx-runtime';
6
+ import '../common/theme.mjs';
7
+ import '../common/direction.mjs';
8
+ import '../common/propsValues/control.mjs';
9
+ import '../common/propsValues/breakpoint.mjs';
10
+ import '../common/propsValues/size.mjs';
7
11
  import { Typography } from '../common/propsValues/typography.mjs';
12
+ import '../common/propsValues/width.mjs';
13
+ import '../common/propsValues/type.mjs';
14
+ import '../common/propsValues/dateMode.mjs';
15
+ import '../common/propsValues/monthFormat.mjs';
16
+ import '../common/propsValues/position.mjs';
17
+ import '../common/propsValues/layouts.mjs';
18
+ import '../common/propsValues/status.mjs';
19
+ import '../common/propsValues/sentiment.mjs';
20
+ import '../common/propsValues/profileType.mjs';
21
+ import '../common/propsValues/variant.mjs';
22
+ import '../common/propsValues/scroll.mjs';
23
+ import '../common/propsValues/markdownNodeType.mjs';
24
+ import '../common/fileType.mjs';
25
+ import 'react';
26
+ import 'react-intl';
27
+ import '../common/closeButton/CloseButton.messages.mjs';
28
+ import { jsxs, jsx } from 'react/jsx-runtime';
8
29
 
9
30
  const PromoCardIndicator = ({
10
31
  className,