@transferwise/components 0.0.0-experimental-5e2f01a → 0.0.0-experimental-cbf5f16

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 (616) hide show
  1. package/build/es/no-polyfill/accordion/Accordion.js +1 -1
  2. package/build/es/no-polyfill/accordion/Accordion.story.js +1 -1
  3. package/build/es/no-polyfill/accordion/AccordionItem/AccordionItem.js +1 -1
  4. package/build/es/no-polyfill/actionButton/ActionButton.js +1 -1
  5. package/build/es/no-polyfill/actionButton/ActionButton.spec.js +1 -1
  6. package/build/es/no-polyfill/actionButton/ActionButton.story.js +1 -1
  7. package/build/es/no-polyfill/actionOption/ActionOption.js +1 -1
  8. package/build/es/no-polyfill/actionOption/ActionOption.story.js +1 -1
  9. package/build/es/no-polyfill/alert/Alert.js +1 -1
  10. package/build/es/no-polyfill/alert/Alert.story.js +1 -1
  11. package/build/es/no-polyfill/alert/inlineMarkdown/InlineMarkdown.js +1 -1
  12. package/build/es/no-polyfill/alert/withArrow/alertArrowPositions.js +1 -1
  13. package/build/es/no-polyfill/alert/withArrow/withArrow.js +1 -1
  14. package/build/es/no-polyfill/avatar/Avatar.js +1 -1
  15. package/build/es/no-polyfill/avatar/Avatar.story.js +1 -1
  16. package/build/es/no-polyfill/avatar/avatarTypes.js +1 -1
  17. package/build/es/no-polyfill/avatar/colors/colors.js +2 -2
  18. package/build/es/no-polyfill/avatarWrapper/AvatarWrapper.js +1 -1
  19. package/build/es/no-polyfill/avatarWrapper/AvatarWrapper.story.js +1 -1
  20. package/build/es/no-polyfill/badge/Badge.js +1 -1
  21. package/build/es/no-polyfill/body/Body.js +2 -2
  22. package/build/es/no-polyfill/body/Body.spec.js +1 -1
  23. package/build/es/no-polyfill/body/Body.story.js +1 -1
  24. package/build/es/no-polyfill/button/Button.js +5 -5
  25. package/build/es/no-polyfill/button/Button.story.js +1 -1
  26. package/build/es/no-polyfill/button/classMap.js +1 -1
  27. package/build/es/no-polyfill/button/legacyUtils/legacyUtils.js +2 -2
  28. package/build/es/no-polyfill/card/Card.js +1 -1
  29. package/build/es/no-polyfill/checkbox/Checkbox.js +1 -1
  30. package/build/es/no-polyfill/checkbox/Checkbox.story.js +1 -1
  31. package/build/es/no-polyfill/checkboxButton/CheckboxButton.js +1 -1
  32. package/build/es/no-polyfill/checkboxButton/CheckboxButton.spec.js +1 -1
  33. package/build/es/no-polyfill/checkboxButton/CheckboxButton.story.js +2 -1
  34. package/build/es/no-polyfill/checkboxOption/CheckboxOption.js +1 -1
  35. package/build/es/no-polyfill/checkboxOption/CheckboxOption.spec.js +1 -1
  36. package/build/es/no-polyfill/checkboxOption/CheckboxOption.story.js +1 -1
  37. package/build/es/no-polyfill/chevron/Chevron.js +1 -1
  38. package/build/es/no-polyfill/chevron/Chevron.story.js +1 -1
  39. package/build/es/no-polyfill/chips/Chip.js +1 -1
  40. package/build/es/no-polyfill/chips/Chips.js +1 -1
  41. package/build/es/no-polyfill/chips/Chips.spec.js +1 -1
  42. package/build/es/no-polyfill/chips/Chips.story.js +1 -1
  43. package/build/es/no-polyfill/circularButton/CircularButton.js +1 -1
  44. package/build/es/no-polyfill/common/DOMOperations/DOMOperations.js +3 -3
  45. package/build/es/no-polyfill/common/Option/Option.js +1 -1
  46. package/build/es/no-polyfill/common/RadioButton/RadioButton.js +1 -1
  47. package/build/es/no-polyfill/common/bottomSheet/BottomSheet.js +4 -4
  48. package/build/es/no-polyfill/common/bottomSheet/BottomSheet.spec.js +1 -1
  49. package/build/es/no-polyfill/common/bottomSheet/BottomSheet.story.js +2 -2
  50. package/build/es/no-polyfill/common/closeButton/CloseButton.js +1 -1
  51. package/build/es/no-polyfill/common/dateUtils/getDayNames/getDayNames.js +2 -2
  52. package/build/es/no-polyfill/common/dateUtils/getMonthNames/getMonthNames.js +1 -1
  53. package/build/es/no-polyfill/common/dateUtils/isDateValid/isDateValid.js +1 -1
  54. package/build/es/no-polyfill/common/dateUtils/isMonthAndYearFormat/isMonthAndYearFormat.js +1 -1
  55. package/build/es/no-polyfill/common/deviceDetection/deviceDetection.js +1 -1
  56. package/build/es/no-polyfill/common/direction.js +1 -1
  57. package/build/es/no-polyfill/common/domHelpers/index.js +1 -1
  58. package/build/es/no-polyfill/common/fakeEvents.js +1 -1
  59. package/build/es/no-polyfill/common/fileType.js +1 -1
  60. package/build/es/no-polyfill/common/flowHeader/FlowHeader.js +1 -1
  61. package/build/es/no-polyfill/common/focusBoundary/FocusBoundary.js +1 -1
  62. package/build/es/no-polyfill/common/focusBoundary/FocusBoundary.spec.js +1 -1
  63. package/build/es/no-polyfill/common/focusBoundary/utils/getFocusableElements.js +2 -2
  64. package/build/es/no-polyfill/common/focusBoundary/utils/resetFocus.js +1 -1
  65. package/build/es/no-polyfill/common/historyNavigator/historyNavigator.js +1 -1
  66. package/build/es/no-polyfill/common/hooks/useClientWidth/useClientWidth.js +3 -3
  67. package/build/es/no-polyfill/common/hooks/useConditionalListener/useConditionalListener.js +1 -1
  68. package/build/es/no-polyfill/common/hooks/useDirection/useDirection.js +1 -1
  69. package/build/es/no-polyfill/common/hooks/useHasIntersected/useHasIntersected.js +2 -2
  70. package/build/es/no-polyfill/common/hooks/useLayout/useLayout.js +1 -1
  71. package/build/es/no-polyfill/common/key.js +1 -1
  72. package/build/es/no-polyfill/common/locale/index.js +7 -7
  73. package/build/es/no-polyfill/common/panel/Panel.js +6 -6
  74. package/build/es/no-polyfill/common/propsValues/breakpoint.js +1 -1
  75. package/build/es/no-polyfill/common/propsValues/control.js +1 -1
  76. package/build/es/no-polyfill/common/propsValues/dateMode.js +1 -1
  77. package/build/es/no-polyfill/common/propsValues/layouts.js +1 -1
  78. package/build/es/no-polyfill/common/propsValues/markdownNodeType.js +1 -1
  79. package/build/es/no-polyfill/common/propsValues/monthFormat.js +1 -1
  80. package/build/es/no-polyfill/common/propsValues/position.js +1 -1
  81. package/build/es/no-polyfill/common/propsValues/profileType.js +1 -1
  82. package/build/es/no-polyfill/common/propsValues/scroll.js +1 -1
  83. package/build/es/no-polyfill/common/propsValues/sentiment.js +1 -1
  84. package/build/es/no-polyfill/common/propsValues/size.js +1 -1
  85. package/build/es/no-polyfill/common/propsValues/status.js +1 -1
  86. package/build/es/no-polyfill/common/propsValues/type.js +1 -1
  87. package/build/es/no-polyfill/common/propsValues/typography.js +1 -1
  88. package/build/es/no-polyfill/common/propsValues/variant.js +1 -1
  89. package/build/es/no-polyfill/common/propsValues/width.js +1 -1
  90. package/build/es/no-polyfill/common/requirements.js +2 -2
  91. package/build/es/no-polyfill/common/responsivePanel/ResponsivePanel.js +1 -1
  92. package/build/es/no-polyfill/common/textFormat/formatWithPattern/formatWithPattern.js +2 -2
  93. package/build/es/no-polyfill/common/textFormat/getCountOfSymbolsInSelection/getCountOfSymbolsInSelection.js +1 -1
  94. package/build/es/no-polyfill/common/textFormat/getCursorPositionAfterKeystroke/getCursorPositionAfterKeystroke.js +1 -1
  95. package/build/es/no-polyfill/common/textFormat/getDistanceToSymbol/getDistanceToSymbol.js +1 -1
  96. package/build/es/no-polyfill/common/textFormat/getSymbolsInPatternWithPosition/getSymbolsInPatternWithPosition.js +1 -1
  97. package/build/es/no-polyfill/common/textFormat/unformatWithPattern/unformatWithPattern.js +1 -1
  98. package/build/es/no-polyfill/common/theme.js +1 -1
  99. package/build/es/no-polyfill/criticalBanner/CriticalCommsBanner.js +1 -1
  100. package/build/es/no-polyfill/criticalBanner/CriticalCommsBanner.story.js +1 -1
  101. package/build/es/no-polyfill/dateInput/DateInput.js +4 -10
  102. package/build/es/no-polyfill/dateInput/DateInput.story.js +1 -1
  103. package/build/es/no-polyfill/dateInput/utils/convertToLocalMidnight/convertToLocalMidnight.js +1 -1
  104. package/build/es/no-polyfill/dateInput/utils/explodeDate/explodeDate.js +1 -1
  105. package/build/es/no-polyfill/dateLookup/DateLookup.js +3 -4
  106. package/build/es/no-polyfill/dateLookup/dateHeader/DateHeader.js +1 -1
  107. package/build/es/no-polyfill/dateLookup/dateTrigger/DateTrigger.js +1 -1
  108. package/build/es/no-polyfill/dateLookup/dayCalendar/DayCalendar.js +1 -1
  109. package/build/es/no-polyfill/dateLookup/dayCalendar/table/DayCalendarTable.js +4 -5
  110. package/build/es/no-polyfill/dateLookup/monthCalendar/MonthCalendar.js +1 -1
  111. package/build/es/no-polyfill/dateLookup/monthCalendar/table/MonthCalendarTable.js +1 -1
  112. package/build/es/no-polyfill/dateLookup/tableLink/TableLink.js +1 -1
  113. package/build/es/no-polyfill/dateLookup/yearCalendar/YearCalendar.js +1 -1
  114. package/build/es/no-polyfill/dateLookup/yearCalendar/table/YearCalendarTable.js +1 -1
  115. package/build/es/no-polyfill/decision/Decision.js +5 -5
  116. package/build/es/no-polyfill/decision/decisionEnums.js +2 -2
  117. package/build/es/no-polyfill/definitionList/DefinitionList.js +1 -1
  118. package/build/es/no-polyfill/dimmer/Dimmer.js +3 -3
  119. package/build/es/no-polyfill/dimmer/Dimmer.story.js +2 -2
  120. package/build/es/no-polyfill/dimmer/dimmerManager/DimmerManager.js +3 -3
  121. package/build/es/no-polyfill/display/Display.js +1 -1
  122. package/build/es/no-polyfill/display/Display.story.js +2 -2
  123. package/build/es/no-polyfill/drawer/Drawer.js +1 -1
  124. package/build/es/no-polyfill/dropFade/DropFade.js +3 -3
  125. package/build/es/no-polyfill/dropFade/DropFade.story.js +1 -1
  126. package/build/es/no-polyfill/dynamicFieldDefinitionList/DynamicFieldDefinitionList.js +1 -1
  127. package/build/es/no-polyfill/dynamicFieldDefinitionList/FormattedValue/FormattedValue.js +1 -1
  128. package/build/es/no-polyfill/dynamicFieldDefinitionList/utils/createDefinitions.js +2 -2
  129. package/build/es/no-polyfill/dynamicFieldDefinitionList/utils/text-format.js +1 -1
  130. package/build/es/no-polyfill/emphasis/Emphasis.js +2 -2
  131. package/build/es/no-polyfill/emphasis/Emphasis.story.js +1 -0
  132. package/build/es/no-polyfill/emphasis/EmphasisHtmlTransformer.js +2 -2
  133. package/build/es/no-polyfill/flowNavigation/FlowNavigation.js +2 -2
  134. package/build/es/no-polyfill/flowNavigation/animatedLabel/AnimatedLabel.js +1 -1
  135. package/build/es/no-polyfill/flowNavigation/backButton/BackButton.js +1 -1
  136. package/build/es/no-polyfill/header/Header.js +2 -2
  137. package/build/es/no-polyfill/header/Header.spec.js +1 -1
  138. package/build/es/no-polyfill/header/Header.story.js +2 -1
  139. package/build/es/no-polyfill/i18n/index.js +1 -1
  140. package/build/es/no-polyfill/image/Image.js +2 -2
  141. package/build/es/no-polyfill/info/Info.js +1 -1
  142. package/build/es/no-polyfill/info/Info.story.js +1 -1
  143. package/build/es/no-polyfill/info/infoPresentations.js +1 -1
  144. package/build/es/no-polyfill/inlineAlert/InlineAlert.js +1 -1
  145. package/build/es/no-polyfill/inputWithDisplayFormat/InputWithDisplayFormat.js +1 -1
  146. package/build/es/no-polyfill/inputs/Input.js +1 -1
  147. package/build/es/no-polyfill/inputs/TextArea.js +1 -1
  148. package/build/es/no-polyfill/inputs/_common.js +2 -2
  149. package/build/es/no-polyfill/instructionsList/InstructionsList.js +3 -3
  150. package/build/es/no-polyfill/link/Link.js +2 -2
  151. package/build/es/no-polyfill/link/Link.spec.js +1 -1
  152. package/build/es/no-polyfill/link/Link.story.js +1 -1
  153. package/build/es/no-polyfill/listItem/ListItem.js +1 -1
  154. package/build/es/no-polyfill/listItem/ListItem.spec.js +1 -1
  155. package/build/es/no-polyfill/listItem/ListItem.story.js +1 -1
  156. package/build/es/no-polyfill/loader/Loader.js +2 -2
  157. package/build/es/no-polyfill/loader/Loader.story.js +1 -1
  158. package/build/es/no-polyfill/logo/Logo.js +1 -1
  159. package/build/es/no-polyfill/logo/Logo.story.js +1 -1
  160. package/build/es/no-polyfill/logo/logoTypes.js +1 -1
  161. package/build/es/no-polyfill/markdown/Markdown.js +1 -1
  162. package/build/es/no-polyfill/markdown/Markdown.story.js +1 -0
  163. package/build/es/no-polyfill/modal/Modal.js +1 -1
  164. package/build/es/no-polyfill/modal/Modal.story.js +2 -2
  165. package/build/es/no-polyfill/money/Money.js +1 -1
  166. package/build/es/no-polyfill/money/Money.story.js +1 -1
  167. package/build/es/no-polyfill/moneyInput/MoneyInput.js +1 -1
  168. package/build/es/no-polyfill/moneyInput/MoneyInput.story.js +1 -1
  169. package/build/es/no-polyfill/moneyInput/currencyFormatting.js +2 -2
  170. package/build/es/no-polyfill/navigationOption/NavigationOption.js +1 -1
  171. package/build/es/no-polyfill/navigationOptionsList/NavigationOptionsList.js +1 -1
  172. package/build/es/no-polyfill/nudge/Nudge.js +1 -1
  173. package/build/es/no-polyfill/overlayHeader/OverlayHeader.js +1 -1
  174. package/build/es/no-polyfill/phoneNumberInput/PhoneNumberInput.js +1 -1
  175. package/build/es/no-polyfill/phoneNumberInput/data/countries.js +1 -1
  176. package/build/es/no-polyfill/phoneNumberInput/utils/cleanNumber/cleanNumber.js +1 -1
  177. package/build/es/no-polyfill/phoneNumberInput/utils/excludeCountries/excludeCountries.js +2 -2
  178. package/build/es/no-polyfill/phoneNumberInput/utils/explodeNumberModel/index.js +1 -1
  179. package/build/es/no-polyfill/phoneNumberInput/utils/filterOptionsForQuery/index.js +1 -1
  180. package/build/es/no-polyfill/phoneNumberInput/utils/findCountryByCode/index.js +1 -1
  181. package/build/es/no-polyfill/phoneNumberInput/utils/findCountryByPrefix/index.js +1 -1
  182. package/build/es/no-polyfill/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.js +1 -1
  183. package/build/es/no-polyfill/phoneNumberInput/utils/isOptionAndFitsQuery/isOptionAndFitsQuery.js +1 -1
  184. package/build/es/no-polyfill/phoneNumberInput/utils/isStringNumeric/isStringNumeric.js +1 -1
  185. package/build/es/no-polyfill/phoneNumberInput/utils/isValidPhoneNumber/isValidPhoneNumber.js +1 -1
  186. package/build/es/no-polyfill/phoneNumberInput/utils/longestMatchingPrefix/index.js +1 -1
  187. package/build/es/no-polyfill/phoneNumberInput/utils/setDefaultPrefix/index.js +3 -3
  188. package/build/es/no-polyfill/phoneNumberInput/utils/sortArrayByProperty/sortArrayByProperty.js +2 -2
  189. package/build/es/no-polyfill/popover/Popover.js +2 -2
  190. package/build/es/no-polyfill/processIndicator/ProcessIndicator.js +4 -4
  191. package/build/es/no-polyfill/progress/Progress.js +1 -1
  192. package/build/es/no-polyfill/progress/Progress.story.js +1 -1
  193. package/build/es/no-polyfill/progressBar/ProgressBar.js +1 -1
  194. package/build/es/no-polyfill/progressBar/ProgressBar.story.js +1 -1
  195. package/build/es/no-polyfill/provider/Provider.js +1 -1
  196. package/build/es/no-polyfill/provider/Provider.spec.js +1 -1
  197. package/build/es/no-polyfill/provider/Provider.story.js +1 -1
  198. package/build/es/no-polyfill/provider/direction/DirectionProvider.js +1 -1
  199. package/build/es/no-polyfill/provider/direction/DirectionProvider.spec.js +1 -1
  200. package/build/es/no-polyfill/provider/language/LanguageProvider.js +1 -1
  201. package/build/es/no-polyfill/provider/language/LanguageProvider.spec.js +1 -1
  202. package/build/es/no-polyfill/radio/Radio.js +1 -1
  203. package/build/es/no-polyfill/radioGroup/RadioGroup.js +2 -2
  204. package/build/es/no-polyfill/radioOption/RadioOption.js +1 -1
  205. package/build/es/no-polyfill/section/Section.js +1 -1
  206. package/build/es/no-polyfill/section/Section.spec.js +1 -1
  207. package/build/es/no-polyfill/section/Section.story.js +1 -1
  208. package/build/es/no-polyfill/select/Select.js +8 -9
  209. package/build/es/no-polyfill/select/option/Option.js +1 -1
  210. package/build/es/no-polyfill/select/searchBox/SearchBox.js +1 -1
  211. package/build/es/no-polyfill/sizeSwapper/SizeSwapper.js +3 -3
  212. package/build/es/no-polyfill/slidingPanel/SlidingPanel.js +2 -2
  213. package/build/es/no-polyfill/snackbar/Snackbar.js +1 -1
  214. package/build/es/no-polyfill/snackbar/SnackbarContext.js +1 -1
  215. package/build/es/no-polyfill/snackbar/SnackbarProvider.js +1 -1
  216. package/build/es/no-polyfill/snackbar/useSnackbar.js +1 -1
  217. package/build/es/no-polyfill/statusIcon/StatusIcon.js +1 -1
  218. package/build/es/no-polyfill/statusIcon/StatusIcon.story.js +1 -1
  219. package/build/es/no-polyfill/stepper/Stepper.js +1 -1
  220. package/build/es/no-polyfill/stepper/deviceDetection.js +2 -2
  221. package/build/es/no-polyfill/sticky/Sticky.js +1 -1
  222. package/build/es/no-polyfill/summary/Summary.js +1 -1
  223. package/build/es/no-polyfill/switch/Switch.js +1 -1
  224. package/build/es/no-polyfill/switch/Switch.story.js +1 -1
  225. package/build/es/no-polyfill/switchOption/SwitchOption.js +1 -1
  226. package/build/es/no-polyfill/switchOption/SwitchOption.story.js +1 -1
  227. package/build/es/no-polyfill/tabs/Tab.js +1 -1
  228. package/build/es/no-polyfill/tabs/TabList.js +1 -1
  229. package/build/es/no-polyfill/tabs/TabPanel.js +1 -1
  230. package/build/es/no-polyfill/tabs/Tabs.js +1 -5
  231. package/build/es/no-polyfill/tabs/utils.js +2 -2
  232. package/build/es/no-polyfill/textareaWithDisplayFormat/TextareaWithDisplayFormat.js +1 -1
  233. package/build/es/no-polyfill/tile/Tile.js +1 -1
  234. package/build/es/no-polyfill/title/Title.js +1 -1
  235. package/build/es/no-polyfill/title/Title.spec.js +1 -1
  236. package/build/es/no-polyfill/title/Title.story.js +1 -1
  237. package/build/es/no-polyfill/tooltip/Tooltip.js +7 -7
  238. package/build/es/no-polyfill/tooltip/Tooltip.spec.js +1 -1
  239. package/build/es/no-polyfill/tooltip/Tooltip.story.js +1 -1
  240. package/build/es/no-polyfill/typeahead/Typeahead.js +1 -1
  241. package/build/es/no-polyfill/typeahead/typeaheadInput/TypeaheadInput.js +1 -1
  242. package/build/es/no-polyfill/typeahead/typeaheadOption/TypeaheadOption.js +1 -1
  243. package/build/es/no-polyfill/typeahead/util/highlight.js +1 -1
  244. package/build/es/no-polyfill/upload/Upload.js +2 -6
  245. package/build/es/no-polyfill/upload/steps/completeStep/completeStep.js +1 -1
  246. package/build/es/no-polyfill/upload/steps/mediaUploadStep/mediaUploadStep.js +1 -1
  247. package/build/es/no-polyfill/upload/steps/processingStep/processingStep.js +1 -1
  248. package/build/es/no-polyfill/upload/steps/uploadImageStep/uploadImageStep.js +1 -1
  249. package/build/es/no-polyfill/upload/uploadSteps.js +1 -1
  250. package/build/es/no-polyfill/upload/utils/asyncFileRead/asyncFileRead.js +1 -1
  251. package/build/es/no-polyfill/upload/utils/getFileType/getFileType.js +1 -1
  252. package/build/es/no-polyfill/upload/utils/getSupportedSpotMimeTypes/getSupportedSpotMimeTypes.js +1 -1
  253. package/build/es/no-polyfill/upload/utils/isSizeValid/isSizeValid.js +1 -1
  254. package/build/es/no-polyfill/upload/utils/isTypeValid/isTypeValid.js +1 -1
  255. package/build/es/no-polyfill/upload/utils/postData/postData.js +1 -1
  256. package/build/es/no-polyfill/upload/utils/requestMedia/requestMedia.js +1 -1
  257. package/build/es/no-polyfill/uploadInput/UploadInput.js +7 -7
  258. package/build/es/no-polyfill/uploadInput/UploadInput.spec.js +1 -1
  259. package/build/es/no-polyfill/uploadInput/UploadInput.story.js +1 -1
  260. package/build/es/no-polyfill/uploadInput/uploadButton/UploadButton.js +1 -1
  261. package/build/es/no-polyfill/uploadInput/uploadButton/UploadButton.spec.js +3 -3
  262. package/build/es/no-polyfill/uploadInput/uploadButton/defaults.js +1 -1
  263. package/build/es/no-polyfill/uploadInput/uploadButton/getAllowedFileTypes.js +3 -3
  264. package/build/es/no-polyfill/uploadInput/uploadButton/getAllowedFileTypes.spec.js +1 -1
  265. package/build/es/no-polyfill/uploadInput/uploadItem/UploadItem.js +2 -2
  266. package/build/es/no-polyfill/uploadInput/uploadItem/UploadItem.spec.js +1 -1
  267. package/build/es/no-polyfill/uploadInput/uploadItem/UploadItemBody.js +1 -1
  268. package/build/es/no-polyfill/utilities/deprecatedProperty/deprecatedProperty.js +1 -1
  269. package/build/es/no-polyfill/utilities/logActionRequired.js +1 -1
  270. package/build/es/no-polyfill/withDisplayFormat/WithDisplayFormat.js +3 -4
  271. package/build/es/no-polyfill/withNextPortal/withNextPortal.js +1 -1
  272. package/build/es/polyfill/accordion/Accordion.js +1 -1
  273. package/build/es/polyfill/accordion/Accordion.story.js +1 -1
  274. package/build/es/polyfill/accordion/AccordionItem/AccordionItem.js +1 -1
  275. package/build/es/polyfill/actionButton/ActionButton.js +1 -1
  276. package/build/es/polyfill/actionButton/ActionButton.spec.js +1 -1
  277. package/build/es/polyfill/actionButton/ActionButton.story.js +1 -1
  278. package/build/es/polyfill/actionOption/ActionOption.js +1 -1
  279. package/build/es/polyfill/actionOption/ActionOption.story.js +1 -1
  280. package/build/es/polyfill/alert/Alert.js +1 -1
  281. package/build/es/polyfill/alert/Alert.story.js +1 -1
  282. package/build/es/polyfill/alert/inlineMarkdown/InlineMarkdown.js +1 -1
  283. package/build/es/polyfill/alert/withArrow/alertArrowPositions.js +1 -1
  284. package/build/es/polyfill/alert/withArrow/withArrow.js +1 -1
  285. package/build/es/polyfill/avatar/Avatar.js +1 -1
  286. package/build/es/polyfill/avatar/Avatar.story.js +1 -1
  287. package/build/es/polyfill/avatar/avatarTypes.js +1 -1
  288. package/build/es/polyfill/avatar/colors/colors.js +2 -2
  289. package/build/es/polyfill/avatarWrapper/AvatarWrapper.js +1 -1
  290. package/build/es/polyfill/avatarWrapper/AvatarWrapper.story.js +1 -1
  291. package/build/es/polyfill/badge/Badge.js +1 -1
  292. package/build/es/polyfill/body/Body.js +2 -2
  293. package/build/es/polyfill/body/Body.spec.js +1 -1
  294. package/build/es/polyfill/body/Body.story.js +1 -1
  295. package/build/es/polyfill/button/Button.js +5 -5
  296. package/build/es/polyfill/button/Button.story.js +1 -1
  297. package/build/es/polyfill/button/classMap.js +1 -1
  298. package/build/es/polyfill/button/legacyUtils/legacyUtils.js +2 -2
  299. package/build/es/polyfill/card/Card.js +1 -1
  300. package/build/es/polyfill/checkbox/Checkbox.js +1 -1
  301. package/build/es/polyfill/checkbox/Checkbox.story.js +1 -1
  302. package/build/es/polyfill/checkboxButton/CheckboxButton.js +1 -1
  303. package/build/es/polyfill/checkboxButton/CheckboxButton.spec.js +1 -1
  304. package/build/es/polyfill/checkboxButton/CheckboxButton.story.js +2 -1
  305. package/build/es/polyfill/checkboxOption/CheckboxOption.js +1 -1
  306. package/build/es/polyfill/checkboxOption/CheckboxOption.spec.js +1 -1
  307. package/build/es/polyfill/checkboxOption/CheckboxOption.story.js +1 -1
  308. package/build/es/polyfill/chevron/Chevron.js +1 -1
  309. package/build/es/polyfill/chevron/Chevron.story.js +1 -1
  310. package/build/es/polyfill/chips/Chip.js +1 -1
  311. package/build/es/polyfill/chips/Chips.js +1 -1
  312. package/build/es/polyfill/chips/Chips.spec.js +1 -1
  313. package/build/es/polyfill/chips/Chips.story.js +1 -1
  314. package/build/es/polyfill/circularButton/CircularButton.js +1 -1
  315. package/build/es/polyfill/common/DOMOperations/DOMOperations.js +3 -3
  316. package/build/es/polyfill/common/Option/Option.js +1 -1
  317. package/build/es/polyfill/common/RadioButton/RadioButton.js +1 -1
  318. package/build/es/polyfill/common/bottomSheet/BottomSheet.js +4 -4
  319. package/build/es/polyfill/common/bottomSheet/BottomSheet.spec.js +1 -1
  320. package/build/es/polyfill/common/bottomSheet/BottomSheet.story.js +2 -2
  321. package/build/es/polyfill/common/closeButton/CloseButton.js +1 -1
  322. package/build/es/polyfill/common/dateUtils/getDayNames/getDayNames.js +2 -2
  323. package/build/es/polyfill/common/dateUtils/getMonthNames/getMonthNames.js +1 -1
  324. package/build/es/polyfill/common/dateUtils/isDateValid/isDateValid.js +1 -1
  325. package/build/es/polyfill/common/dateUtils/isMonthAndYearFormat/isMonthAndYearFormat.js +1 -1
  326. package/build/es/polyfill/common/deviceDetection/deviceDetection.js +1 -1
  327. package/build/es/polyfill/common/direction.js +1 -1
  328. package/build/es/polyfill/common/domHelpers/index.js +1 -1
  329. package/build/es/polyfill/common/fakeEvents.js +1 -1
  330. package/build/es/polyfill/common/fileType.js +1 -1
  331. package/build/es/polyfill/common/flowHeader/FlowHeader.js +1 -1
  332. package/build/es/polyfill/common/focusBoundary/FocusBoundary.js +1 -1
  333. package/build/es/polyfill/common/focusBoundary/FocusBoundary.spec.js +1 -1
  334. package/build/es/polyfill/common/focusBoundary/utils/getFocusableElements.js +2 -2
  335. package/build/es/polyfill/common/focusBoundary/utils/resetFocus.js +1 -1
  336. package/build/es/polyfill/common/historyNavigator/historyNavigator.js +1 -1
  337. package/build/es/polyfill/common/hooks/useClientWidth/useClientWidth.js +3 -3
  338. package/build/es/polyfill/common/hooks/useConditionalListener/useConditionalListener.js +1 -1
  339. package/build/es/polyfill/common/hooks/useDirection/useDirection.js +1 -1
  340. package/build/es/polyfill/common/hooks/useHasIntersected/useHasIntersected.js +2 -2
  341. package/build/es/polyfill/common/hooks/useLayout/useLayout.js +1 -1
  342. package/build/es/polyfill/common/key.js +1 -1
  343. package/build/es/polyfill/common/locale/index.js +8 -8
  344. package/build/es/polyfill/common/panel/Panel.js +6 -6
  345. package/build/es/polyfill/common/propsValues/breakpoint.js +1 -1
  346. package/build/es/polyfill/common/propsValues/control.js +1 -1
  347. package/build/es/polyfill/common/propsValues/dateMode.js +1 -1
  348. package/build/es/polyfill/common/propsValues/layouts.js +1 -1
  349. package/build/es/polyfill/common/propsValues/markdownNodeType.js +1 -1
  350. package/build/es/polyfill/common/propsValues/monthFormat.js +1 -1
  351. package/build/es/polyfill/common/propsValues/position.js +1 -1
  352. package/build/es/polyfill/common/propsValues/profileType.js +1 -1
  353. package/build/es/polyfill/common/propsValues/scroll.js +1 -1
  354. package/build/es/polyfill/common/propsValues/sentiment.js +1 -1
  355. package/build/es/polyfill/common/propsValues/size.js +1 -1
  356. package/build/es/polyfill/common/propsValues/status.js +1 -1
  357. package/build/es/polyfill/common/propsValues/type.js +1 -1
  358. package/build/es/polyfill/common/propsValues/typography.js +1 -1
  359. package/build/es/polyfill/common/propsValues/variant.js +1 -1
  360. package/build/es/polyfill/common/propsValues/width.js +1 -1
  361. package/build/es/polyfill/common/requirements.js +2 -2
  362. package/build/es/polyfill/common/responsivePanel/ResponsivePanel.js +1 -1
  363. package/build/es/polyfill/common/textFormat/formatWithPattern/formatWithPattern.js +2 -2
  364. package/build/es/polyfill/common/textFormat/getCountOfSymbolsInSelection/getCountOfSymbolsInSelection.js +1 -1
  365. package/build/es/polyfill/common/textFormat/getCursorPositionAfterKeystroke/getCursorPositionAfterKeystroke.js +1 -1
  366. package/build/es/polyfill/common/textFormat/getDistanceToSymbol/getDistanceToSymbol.js +1 -1
  367. package/build/es/polyfill/common/textFormat/getSymbolsInPatternWithPosition/getSymbolsInPatternWithPosition.js +1 -1
  368. package/build/es/polyfill/common/textFormat/unformatWithPattern/unformatWithPattern.js +1 -1
  369. package/build/es/polyfill/common/theme.js +1 -1
  370. package/build/es/polyfill/criticalBanner/CriticalCommsBanner.js +1 -1
  371. package/build/es/polyfill/criticalBanner/CriticalCommsBanner.story.js +1 -1
  372. package/build/es/polyfill/dateInput/DateInput.js +4 -10
  373. package/build/es/polyfill/dateInput/DateInput.story.js +1 -1
  374. package/build/es/polyfill/dateInput/utils/convertToLocalMidnight/convertToLocalMidnight.js +1 -1
  375. package/build/es/polyfill/dateInput/utils/explodeDate/explodeDate.js +1 -1
  376. package/build/es/polyfill/dateLookup/DateLookup.js +3 -4
  377. package/build/es/polyfill/dateLookup/dateHeader/DateHeader.js +1 -1
  378. package/build/es/polyfill/dateLookup/dateTrigger/DateTrigger.js +1 -1
  379. package/build/es/polyfill/dateLookup/dayCalendar/DayCalendar.js +1 -1
  380. package/build/es/polyfill/dateLookup/dayCalendar/table/DayCalendarTable.js +4 -5
  381. package/build/es/polyfill/dateLookup/monthCalendar/MonthCalendar.js +1 -1
  382. package/build/es/polyfill/dateLookup/monthCalendar/table/MonthCalendarTable.js +1 -1
  383. package/build/es/polyfill/dateLookup/tableLink/TableLink.js +1 -1
  384. package/build/es/polyfill/dateLookup/yearCalendar/YearCalendar.js +1 -1
  385. package/build/es/polyfill/dateLookup/yearCalendar/table/YearCalendarTable.js +1 -1
  386. package/build/es/polyfill/decision/Decision.js +5 -5
  387. package/build/es/polyfill/decision/decisionEnums.js +2 -2
  388. package/build/es/polyfill/definitionList/DefinitionList.js +1 -1
  389. package/build/es/polyfill/dimmer/Dimmer.js +3 -3
  390. package/build/es/polyfill/dimmer/Dimmer.story.js +2 -2
  391. package/build/es/polyfill/dimmer/dimmerManager/DimmerManager.js +3 -3
  392. package/build/es/polyfill/display/Display.js +1 -1
  393. package/build/es/polyfill/display/Display.story.js +2 -2
  394. package/build/es/polyfill/drawer/Drawer.js +1 -1
  395. package/build/es/polyfill/dropFade/DropFade.js +3 -3
  396. package/build/es/polyfill/dropFade/DropFade.story.js +1 -1
  397. package/build/es/polyfill/dynamicFieldDefinitionList/DynamicFieldDefinitionList.js +1 -1
  398. package/build/es/polyfill/dynamicFieldDefinitionList/FormattedValue/FormattedValue.js +2 -2
  399. package/build/es/polyfill/dynamicFieldDefinitionList/utils/createDefinitions.js +2 -2
  400. package/build/es/polyfill/dynamicFieldDefinitionList/utils/text-format.js +1 -1
  401. package/build/es/polyfill/emphasis/Emphasis.js +2 -2
  402. package/build/es/polyfill/emphasis/Emphasis.story.js +1 -0
  403. package/build/es/polyfill/emphasis/EmphasisHtmlTransformer.js +2 -2
  404. package/build/es/polyfill/flowNavigation/FlowNavigation.js +2 -2
  405. package/build/es/polyfill/flowNavigation/animatedLabel/AnimatedLabel.js +1 -1
  406. package/build/es/polyfill/flowNavigation/backButton/BackButton.js +1 -1
  407. package/build/es/polyfill/header/Header.js +2 -2
  408. package/build/es/polyfill/header/Header.spec.js +1 -1
  409. package/build/es/polyfill/header/Header.story.js +2 -1
  410. package/build/es/polyfill/i18n/index.js +1 -1
  411. package/build/es/polyfill/image/Image.js +2 -2
  412. package/build/es/polyfill/info/Info.js +1 -1
  413. package/build/es/polyfill/info/Info.story.js +1 -1
  414. package/build/es/polyfill/info/infoPresentations.js +1 -1
  415. package/build/es/polyfill/inlineAlert/InlineAlert.js +1 -1
  416. package/build/es/polyfill/inputWithDisplayFormat/InputWithDisplayFormat.js +1 -1
  417. package/build/es/polyfill/inputs/Input.js +1 -1
  418. package/build/es/polyfill/inputs/TextArea.js +1 -1
  419. package/build/es/polyfill/inputs/_common.js +2 -2
  420. package/build/es/polyfill/instructionsList/InstructionsList.js +3 -3
  421. package/build/es/polyfill/link/Link.js +2 -2
  422. package/build/es/polyfill/link/Link.spec.js +1 -1
  423. package/build/es/polyfill/link/Link.story.js +1 -1
  424. package/build/es/polyfill/listItem/ListItem.js +1 -1
  425. package/build/es/polyfill/listItem/ListItem.spec.js +1 -1
  426. package/build/es/polyfill/listItem/ListItem.story.js +1 -1
  427. package/build/es/polyfill/loader/Loader.js +2 -2
  428. package/build/es/polyfill/loader/Loader.story.js +1 -1
  429. package/build/es/polyfill/logo/Logo.js +1 -1
  430. package/build/es/polyfill/logo/Logo.story.js +1 -1
  431. package/build/es/polyfill/logo/logoTypes.js +1 -1
  432. package/build/es/polyfill/markdown/Markdown.js +1 -1
  433. package/build/es/polyfill/markdown/Markdown.story.js +1 -0
  434. package/build/es/polyfill/modal/Modal.js +1 -1
  435. package/build/es/polyfill/modal/Modal.story.js +2 -2
  436. package/build/es/polyfill/money/Money.js +1 -1
  437. package/build/es/polyfill/money/Money.story.js +1 -1
  438. package/build/es/polyfill/moneyInput/MoneyInput.js +1 -1
  439. package/build/es/polyfill/moneyInput/MoneyInput.story.js +1 -1
  440. package/build/es/polyfill/moneyInput/currencyFormatting.js +3 -3
  441. package/build/es/polyfill/navigationOption/NavigationOption.js +1 -1
  442. package/build/es/polyfill/navigationOptionsList/NavigationOptionsList.js +1 -1
  443. package/build/es/polyfill/nudge/Nudge.js +1 -1
  444. package/build/es/polyfill/overlayHeader/OverlayHeader.js +1 -1
  445. package/build/es/polyfill/phoneNumberInput/PhoneNumberInput.js +1 -1
  446. package/build/es/polyfill/phoneNumberInput/data/countries.js +1 -1
  447. package/build/es/polyfill/phoneNumberInput/utils/cleanNumber/cleanNumber.js +1 -1
  448. package/build/es/polyfill/phoneNumberInput/utils/excludeCountries/excludeCountries.js +3 -3
  449. package/build/es/polyfill/phoneNumberInput/utils/explodeNumberModel/index.js +2 -2
  450. package/build/es/polyfill/phoneNumberInput/utils/filterOptionsForQuery/index.js +2 -2
  451. package/build/es/polyfill/phoneNumberInput/utils/findCountryByCode/index.js +1 -1
  452. package/build/es/polyfill/phoneNumberInput/utils/findCountryByPrefix/index.js +1 -1
  453. package/build/es/polyfill/phoneNumberInput/utils/groupCountriesByPrefix/groupCountriesByPrefix.js +1 -1
  454. package/build/es/polyfill/phoneNumberInput/utils/isOptionAndFitsQuery/isOptionAndFitsQuery.js +2 -2
  455. package/build/es/polyfill/phoneNumberInput/utils/isStringNumeric/isStringNumeric.js +1 -1
  456. package/build/es/polyfill/phoneNumberInput/utils/isValidPhoneNumber/isValidPhoneNumber.js +2 -2
  457. package/build/es/polyfill/phoneNumberInput/utils/longestMatchingPrefix/index.js +1 -1
  458. package/build/es/polyfill/phoneNumberInput/utils/setDefaultPrefix/index.js +3 -3
  459. package/build/es/polyfill/phoneNumberInput/utils/sortArrayByProperty/sortArrayByProperty.js +2 -2
  460. package/build/es/polyfill/popover/Popover.js +2 -2
  461. package/build/es/polyfill/processIndicator/ProcessIndicator.js +4 -4
  462. package/build/es/polyfill/progress/Progress.js +1 -1
  463. package/build/es/polyfill/progress/Progress.story.js +1 -1
  464. package/build/es/polyfill/progressBar/ProgressBar.js +1 -1
  465. package/build/es/polyfill/progressBar/ProgressBar.story.js +1 -1
  466. package/build/es/polyfill/provider/Provider.js +1 -1
  467. package/build/es/polyfill/provider/Provider.spec.js +1 -1
  468. package/build/es/polyfill/provider/Provider.story.js +1 -1
  469. package/build/es/polyfill/provider/direction/DirectionProvider.js +1 -1
  470. package/build/es/polyfill/provider/direction/DirectionProvider.spec.js +1 -1
  471. package/build/es/polyfill/provider/language/LanguageProvider.js +1 -1
  472. package/build/es/polyfill/provider/language/LanguageProvider.spec.js +1 -1
  473. package/build/es/polyfill/radio/Radio.js +1 -1
  474. package/build/es/polyfill/radioGroup/RadioGroup.js +2 -2
  475. package/build/es/polyfill/radioOption/RadioOption.js +1 -1
  476. package/build/es/polyfill/section/Section.js +1 -1
  477. package/build/es/polyfill/section/Section.spec.js +1 -1
  478. package/build/es/polyfill/section/Section.story.js +1 -1
  479. package/build/es/polyfill/select/Select.js +8 -9
  480. package/build/es/polyfill/select/option/Option.js +2 -2
  481. package/build/es/polyfill/select/searchBox/SearchBox.js +1 -1
  482. package/build/es/polyfill/sizeSwapper/SizeSwapper.js +3 -3
  483. package/build/es/polyfill/slidingPanel/SlidingPanel.js +2 -2
  484. package/build/es/polyfill/snackbar/Snackbar.js +1 -1
  485. package/build/es/polyfill/snackbar/SnackbarContext.js +1 -1
  486. package/build/es/polyfill/snackbar/SnackbarProvider.js +1 -1
  487. package/build/es/polyfill/snackbar/useSnackbar.js +1 -1
  488. package/build/es/polyfill/statusIcon/StatusIcon.js +1 -1
  489. package/build/es/polyfill/statusIcon/StatusIcon.story.js +1 -1
  490. package/build/es/polyfill/stepper/Stepper.js +1 -1
  491. package/build/es/polyfill/stepper/deviceDetection.js +2 -2
  492. package/build/es/polyfill/sticky/Sticky.js +1 -1
  493. package/build/es/polyfill/summary/Summary.js +1 -1
  494. package/build/es/polyfill/switch/Switch.js +1 -1
  495. package/build/es/polyfill/switch/Switch.story.js +1 -1
  496. package/build/es/polyfill/switchOption/SwitchOption.js +1 -1
  497. package/build/es/polyfill/switchOption/SwitchOption.story.js +1 -1
  498. package/build/es/polyfill/tabs/Tab.js +1 -1
  499. package/build/es/polyfill/tabs/TabList.js +1 -1
  500. package/build/es/polyfill/tabs/TabPanel.js +1 -1
  501. package/build/es/polyfill/tabs/Tabs.js +1 -5
  502. package/build/es/polyfill/tabs/utils.js +2 -2
  503. package/build/es/polyfill/textareaWithDisplayFormat/TextareaWithDisplayFormat.js +1 -1
  504. package/build/es/polyfill/tile/Tile.js +1 -1
  505. package/build/es/polyfill/title/Title.js +1 -1
  506. package/build/es/polyfill/title/Title.spec.js +1 -1
  507. package/build/es/polyfill/title/Title.story.js +1 -1
  508. package/build/es/polyfill/tooltip/Tooltip.js +7 -7
  509. package/build/es/polyfill/tooltip/Tooltip.spec.js +1 -1
  510. package/build/es/polyfill/tooltip/Tooltip.story.js +1 -1
  511. package/build/es/polyfill/typeahead/Typeahead.js +1 -1
  512. package/build/es/polyfill/typeahead/typeaheadInput/TypeaheadInput.js +1 -1
  513. package/build/es/polyfill/typeahead/typeaheadOption/TypeaheadOption.js +1 -1
  514. package/build/es/polyfill/typeahead/util/highlight.js +1 -1
  515. package/build/es/polyfill/upload/Upload.js +2 -6
  516. package/build/es/polyfill/upload/steps/completeStep/completeStep.js +1 -1
  517. package/build/es/polyfill/upload/steps/mediaUploadStep/mediaUploadStep.js +1 -1
  518. package/build/es/polyfill/upload/steps/processingStep/processingStep.js +1 -1
  519. package/build/es/polyfill/upload/steps/uploadImageStep/uploadImageStep.js +1 -1
  520. package/build/es/polyfill/upload/uploadSteps.js +1 -1
  521. package/build/es/polyfill/upload/utils/asyncFileRead/asyncFileRead.js +1 -1
  522. package/build/es/polyfill/upload/utils/getFileType/getFileType.js +1 -1
  523. package/build/es/polyfill/upload/utils/getSupportedSpotMimeTypes/getSupportedSpotMimeTypes.js +2 -2
  524. package/build/es/polyfill/upload/utils/isSizeValid/isSizeValid.js +1 -1
  525. package/build/es/polyfill/upload/utils/isTypeValid/isTypeValid.js +1 -1
  526. package/build/es/polyfill/upload/utils/postData/postData.js +1 -1
  527. package/build/es/polyfill/upload/utils/requestMedia/requestMedia.js +1 -1
  528. package/build/es/polyfill/uploadInput/UploadInput.js +7 -7
  529. package/build/es/polyfill/uploadInput/UploadInput.spec.js +1 -1
  530. package/build/es/polyfill/uploadInput/UploadInput.story.js +1 -1
  531. package/build/es/polyfill/uploadInput/uploadButton/UploadButton.js +1 -1
  532. package/build/es/polyfill/uploadInput/uploadButton/UploadButton.spec.js +3 -3
  533. package/build/es/polyfill/uploadInput/uploadButton/defaults.js +1 -1
  534. package/build/es/polyfill/uploadInput/uploadButton/getAllowedFileTypes.js +3 -3
  535. package/build/es/polyfill/uploadInput/uploadButton/getAllowedFileTypes.spec.js +1 -1
  536. package/build/es/polyfill/uploadInput/uploadItem/UploadItem.js +2 -2
  537. package/build/es/polyfill/uploadInput/uploadItem/UploadItem.spec.js +1 -1
  538. package/build/es/polyfill/uploadInput/uploadItem/UploadItemBody.js +1 -1
  539. package/build/es/polyfill/utilities/deprecatedProperty/deprecatedProperty.js +1 -1
  540. package/build/es/polyfill/utilities/logActionRequired.js +1 -1
  541. package/build/es/polyfill/withDisplayFormat/WithDisplayFormat.js +3 -4
  542. package/build/es/polyfill/withNextPortal/withNextPortal.js +1 -1
  543. package/build/main.css +1 -4236
  544. package/build/styles/accordion/Accordion.css +1 -59
  545. package/build/styles/actionButton/ActionButton.css +1 -41
  546. package/build/styles/avatar/Avatar.css +1 -240
  547. package/build/styles/badge/Badge.css +1 -66
  548. package/build/styles/button/Button.css +1 -17
  549. package/build/styles/card/Card.css +1 -88
  550. package/build/styles/checkboxButton/CheckboxButton.css +1 -21
  551. package/build/styles/chips/Chip.css +1 -169
  552. package/build/styles/circularButton/CircularButton.css +1 -175
  553. package/build/styles/common/Option/Option.css +1 -74
  554. package/build/styles/common/RadioButton/RadioButton.css +1 -3
  555. package/build/styles/common/bottomSheet/BottomSheet.css +1 -44
  556. package/build/styles/common/closeButton/CloseButton.css +1 -44
  557. package/build/styles/common/panel/Panel.css +1 -67
  558. package/build/styles/criticalBanner/CriticalCommsBanner.css +1 -73
  559. package/build/styles/dateInput/DateInput.css +1 -3
  560. package/build/styles/dateLookup/DateLookup.css +1 -80
  561. package/build/styles/dateLookup/dateTrigger/DateTrigger.css +1 -53
  562. package/build/styles/decision/Decision.css +1 -69
  563. package/build/styles/definitionList/DefinitionList.css +1 -48
  564. package/build/styles/dimmer/Dimmer.css +1 -68
  565. package/build/styles/drawer/Drawer.css +1 -77
  566. package/build/styles/dropFade/DropFade.css +1 -19
  567. package/build/styles/dynamicFieldDefinitionList/FormattedValue/FormattedValue.css +1 -4
  568. package/build/styles/emphasis/Emphasis.css +1 -25
  569. package/build/styles/flowNavigation/FlowNavigation.css +1 -85
  570. package/build/styles/flowNavigation/animatedLabel/AnimatedLabel.css +1 -26
  571. package/build/styles/flowNavigation/backButton/BackButton.css +1 -28
  572. package/build/styles/header/Header.css +1 -20
  573. package/build/styles/image/Image.css +1 -12
  574. package/build/styles/info/Info.css +1 -37
  575. package/build/styles/inputs/Input.css +1 -53
  576. package/build/styles/inputs/TextArea.css +1 -59
  577. package/build/styles/instructionsList/InstructionsList.css +1 -30
  578. package/build/styles/link/Link.css +1 -12
  579. package/build/styles/listItem/ListItem.css +1 -6
  580. package/build/styles/loader/Loader.css +1 -294
  581. package/build/styles/logo/Logo.css +1 -10
  582. package/build/styles/main.css +1 -4236
  583. package/build/styles/modal/Modal.css +1 -133
  584. package/build/styles/moneyInput/MoneyInput.css +1 -128
  585. package/build/styles/navigationOption/NavigationOption.css +1 -61
  586. package/build/styles/navigationOptionsList/NavigationOptionsList.css +1 -12
  587. package/build/styles/nudge/Nudge.css +1 -138
  588. package/build/styles/overlayHeader/OverlayHeader.css +1 -31
  589. package/build/styles/phoneNumberInput/PhoneNumberInput.css +1 -17
  590. package/build/styles/popover/Popover.css +1 -40
  591. package/build/styles/progress/Progress.css +1 -35
  592. package/build/styles/progressBar/ProgressBar.css +1 -9
  593. package/build/styles/section/Section.css +1 -8
  594. package/build/styles/select/Select.css +1 -322
  595. package/build/styles/slidingPanel/SlidingPanel.css +1 -96
  596. package/build/styles/snackbar/Snackbar.css +1 -85
  597. package/build/styles/statusIcon/StatusIcon.css +1 -50
  598. package/build/styles/stepper/Stepper.css +1 -139
  599. package/build/styles/summary/Summary.css +1 -86
  600. package/build/styles/switch/Switch.css +1 -64
  601. package/build/styles/tabs/Tabs.css +1 -104
  602. package/build/styles/tile/Tile.css +1 -58
  603. package/build/styles/tooltip/Tooltip.css +1 -37
  604. package/build/styles/typeahead/Typeahead.css +1 -167
  605. package/build/styles/typeahead/typeaheadOption/TypeaheadOption.css +1 -6
  606. package/build/styles/upload/Upload.css +1 -15
  607. package/build/styles/uploadInput/UploadInput.css +1 -53
  608. package/build/styles/uploadInput/uploadButton/UploadButton.css +1 -44
  609. package/build/styles/uploadInput/uploadItem/UploadItem.css +1 -60
  610. package/build/types/checkboxButton/CheckboxButton.story.d.ts +14 -4
  611. package/build/types/emphasis/Emphasis.story.d.ts +13 -0
  612. package/build/types/markdown/Markdown.story.d.ts +39 -0
  613. package/build/umd/no-polyfill/main.js +1 -1
  614. package/build/umd/polyfill/main.js +1 -1
  615. package/package.json +1 -1
  616. package/build/types/test-utils/VariantDecorator.d.ts +0 -18
@@ -1,3 +1,3 @@
1
- import React,{useRef,useState}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{jsx as _jsx}from"react/jsx-runtime";const DropFade=a=>{let{children:b,show:c}=a;const d=useRef(null),[e,f]=useState(0),g=/*#__PURE__*/React.cloneElement(b);return/*#__PURE__*/_jsx(CSSTransition,{nodeRef:d,in:c,timeout:300,classNames:"np-dropfade",onEntering:()=>{// Set height so we can animate to the correct height
2
- f(d.current?.scrollHeight||0)}// Un-set height, as we don't want to presume it should be that height forever
3
- ,onEntered:()=>f(void 0),onExit:()=>{f(d.current?.scrollHeight||0)},onExiting:()=>{f(0)},children:/*#__PURE__*/_jsx("div",{ref:d,style:{height:e},className:"np-dropfade",children:g})})};export default DropFade;
1
+ import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import React,{useRef,useState}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{jsx as _jsx}from"react/jsx-runtime";var DropFade=function(a){var b=a.children,c=a.show,d=useRef(null),e=useState(0),f=_slicedToArray(e,2),g=f[0],h=f[1],i=/*#__PURE__*/React.cloneElement(b);return/*#__PURE__*/_jsx(CSSTransition,{nodeRef:d,in:c,timeout:300,classNames:"np-dropfade",onEntering:function onEntering(){var a;// Set height so we can animate to the correct height
2
+ h((null===(a=d.current)||void 0===a?void 0:a.scrollHeight)||0)}// Un-set height, as we don't want to presume it should be that height forever
3
+ ,onEntered:function onEntered(){return h(void 0)},onExit:function onExit(){var a;h((null===(a=d.current)||void 0===a?void 0:a.scrollHeight)||0)},onExiting:function onExiting(){h(0)},children:/*#__PURE__*/_jsx("div",{ref:d,style:{height:g},className:"np-dropfade",children:i})})};export default DropFade;
@@ -1 +1 @@
1
- /* eslint-disable react/forbid-dom-props */import{action}from"@storybook/addon-actions";import{useState}from"react";import{Button,Nudge}from"..";import DropFade from"./DropFade";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{title:"Dialogs/DropFade",component:DropFade};export const Basic=()=>{const[a,b]=useState(!1);return/*#__PURE__*/_jsxs("div",{style:{margin:"0 auto",maxWidth:400},children:[/*#__PURE__*/_jsx(DropFade,{show:a,children:/*#__PURE__*/_jsx(Nudge,{media:/*#__PURE__*/_jsx("img",{alt:"",style:{width:44,height:44},src:"https://wise.com/public-resources/assets/public-navigation/saving.svg"}),mediaName:"globe",title:"Did you know it's cool to be Wise?",link:"Get Wise",href:"https://wise.com",onClick:action("action clicked"),onDismiss:()=>{action("dismissed"),b(!1)}})}),/*#__PURE__*/_jsx(Button,{className:"m-t-3",block:!0,onClick:()=>b(!0),children:"Some other content"})]})};
1
+ import _slicedToArray from"@babel/runtime/helpers/slicedToArray";/* eslint-disable react/forbid-dom-props */import{action}from"@storybook/addon-actions";import{useState}from"react";import{Button,Nudge}from"..";import DropFade from"./DropFade";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{title:"Dialogs/DropFade",component:DropFade};export var Basic=function(){var a=useState(!1),b=_slicedToArray(a,2),c=b[0],d=b[1];return/*#__PURE__*/_jsxs("div",{style:{margin:"0 auto",maxWidth:400},children:[/*#__PURE__*/_jsx(DropFade,{show:c,children:/*#__PURE__*/_jsx(Nudge,{media:/*#__PURE__*/_jsx("img",{alt:"",style:{width:44,height:44},src:"https://wise.com/public-resources/assets/public-navigation/saving.svg"}),mediaName:"globe",title:"Did you know it's cool to be Wise?",link:"Get Wise",href:"https://wise.com",onClick:action("action clicked"),onDismiss:function onDismiss(){action("dismissed"),d(!1)}})}),/*#__PURE__*/_jsx(Button,{className:"m-t-3",block:!0,onClick:function onClick(){return d(!0)},children:"Some other content"})]})};
@@ -1 +1 @@
1
- import PropTypes from"prop-types";import{Typography,Layout}from"../common";import{prepFields}from"../common/requirements";import DefinitionList from"../definitionList";import Title from"../title";import createDefinitions from"./utils/createDefinitions";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const DynamicFieldDefinitionList=a=>{let{model:b,title:c,layout:d,fields:e}=a;return/*#__PURE__*/_jsxs(_Fragment,{children:[c&&/*#__PURE__*/_jsx("div",{className:"m-t-1 m-b-3",children:/*#__PURE__*/_jsx(Title,{type:Typography.TITLE_BODY,className:"p-t-3",children:c})}),/*#__PURE__*/_jsx(DefinitionList,{layout:d,definitions:createDefinitions(prepFields(e),b)})]})};DynamicFieldDefinitionList.propTypes={model:PropTypes.shape({}).isRequired,fields:PropTypes.shape({}).isRequired,title:PropTypes.string,layout:PropTypes.oneOf(["VERTICAL_TWO_COLUMN","VERTICAL_ONE_COLUMN","HORIZONTAL_JUSTIFIED","HORIZONTAL_LEFT_ALIGNED"])},DynamicFieldDefinitionList.defaultProps={title:null,layout:Layout.VERTICAL_TWO_COLUMN};export default DynamicFieldDefinitionList;
1
+ import PropTypes from"prop-types";import{Typography,Layout}from"../common";import{prepFields}from"../common/requirements";import DefinitionList from"../definitionList";import Title from"../title";import createDefinitions from"./utils/createDefinitions";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var DynamicFieldDefinitionList=function(a){var b=a.model,c=a.title,d=a.layout,e=a.fields;return/*#__PURE__*/_jsxs(_Fragment,{children:[c&&/*#__PURE__*/_jsx("div",{className:"m-t-1 m-b-3",children:/*#__PURE__*/_jsx(Title,{type:Typography.TITLE_BODY,className:"p-t-3",children:c})}),/*#__PURE__*/_jsx(DefinitionList,{layout:d,definitions:createDefinitions(prepFields(e),b)})]})};DynamicFieldDefinitionList.propTypes={model:PropTypes.shape({}).isRequired,fields:PropTypes.shape({}).isRequired,title:PropTypes.string,layout:PropTypes.oneOf(["VERTICAL_TWO_COLUMN","VERTICAL_ONE_COLUMN","HORIZONTAL_JUSTIFIED","HORIZONTAL_LEFT_ALIGNED"])},DynamicFieldDefinitionList.defaultProps={title:null,layout:Layout.VERTICAL_TWO_COLUMN};export default DynamicFieldDefinitionList;
@@ -2,7 +2,7 @@ import{formatDate,formatNumber}from"@transferwise/formatting";import classNames
2
2
  *
3
3
  * @param {Array} options
4
4
  * @param {string|number} value
5
- */import{jsx as _jsx}from"react/jsx-runtime";const getValueLabel=(a,b)=>{const c=a.find(a=>a.value===b);return c&&c.label?c.label:b},mask=a=>Array(a.length+1).join("*"),FormattedValue=a=>{let{field:b,value:c}=a;const{locale:d}=useIntl(),e=[];switch(b.tagClassName&&b.tagClassName.h3&&(e.push("np-text-body-large-bold"),e.push("formatted-value__h3-custom-alignment")),b.control){case"select":case"radio":return/*#__PURE__*/_jsx("span",{children:getValueLabel(b.values,c)});case"date":return/*#__PURE__*/_jsx("span",{children:formatDate(c instanceof Date?c:new Date(c),d)});case"number":return/*#__PURE__*/_jsx("span",{children:formatNumber(c,d)});case"password":return/*#__PURE__*/_jsx("span",{children:mask(c)});case"file":return/*#__PURE__*/_jsx("div",{className:"thumbnail",children:/*#__PURE__*/_jsx("img",{alt:b.title,src:c})});case"checkbox":return/*#__PURE__*/_jsx("span",{children:JSON.stringify(c)});default:return/*#__PURE__*/_jsx("span",{className:classNames(e),children:formatUsingPattern(c,b.displayFormat)});}};/**
5
+ */import{jsx as _jsx}from"react/jsx-runtime";var getValueLabel=function(a,b){var c=a.find(function(a){return a.value===b});return c&&c.label?c.label:b},mask=function(a){return Array(a.length+1).join("*")},FormattedValue=function(a){var b=a.field,c=a.value,d=useIntl(),e=d.locale,f=[];switch(b.tagClassName&&b.tagClassName.h3&&(f.push("np-text-body-large-bold"),f.push("formatted-value__h3-custom-alignment")),b.control){case"select":case"radio":return/*#__PURE__*/_jsx("span",{children:getValueLabel(b.values,c)});case"date":return/*#__PURE__*/_jsx("span",{children:formatDate(c instanceof Date?c:new Date(c),e)});case"number":return/*#__PURE__*/_jsx("span",{children:formatNumber(c,e)});case"password":return/*#__PURE__*/_jsx("span",{children:mask(c)});case"file":return/*#__PURE__*/_jsx("div",{className:"thumbnail",children:/*#__PURE__*/_jsx("img",{alt:b.title,src:c})});case"checkbox":return/*#__PURE__*/_jsx("span",{children:JSON.stringify(c)});default:return/*#__PURE__*/_jsx("span",{className:classNames(f),children:formatUsingPattern(c,b.displayFormat)});}};/**
6
6
  *
7
7
  * @param {string} value
8
8
  */FormattedValue.propTypes={field:PropTypes.shape({control:PropTypes.string.isRequired,displayFormat:PropTypes.string,refreshRequirementsOnChange:PropTypes.bool,title:PropTypes.string.isRequired,type:PropTypes.string.isRequired,width:PropTypes.string,tagClassName:PropTypes.shape({h3:PropTypes.bool}),values:PropTypes.arrayOf(PropTypes.shape({value:PropTypes.any}))}).isRequired,value:PropTypes.any.isRequired};export default FormattedValue;
@@ -1,2 +1,2 @@
1
- import toPairs from"lodash.topairs";import FormattedValue from"../FormattedValue";import{jsx as _jsx}from"react/jsx-runtime";export default function createDefinitions(a,b){return toPairs(a).map(a=>{let[c,d]=a;return createDefinition(c,d,b)}).filter(a=>!!a)}function createDefinition(a,b,c){const{title:d,group:e,hidden:f}=b;return!c[a]||f?null:{title:d,value:e?e.map((b,d)=>/*#__PURE__*/_jsx(FormattedValue,{// eslint-disable-line react/no-array-index-key
2
- field:b,value:c[a]},d)):/*#__PURE__*/_jsx(FormattedValue,{field:b,value:c[a]}),key:a}}
1
+ import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import toPairs from"lodash.topairs";import FormattedValue from"../FormattedValue";import{jsx as _jsx}from"react/jsx-runtime";export default function createDefinitions(a,b){return toPairs(a).map(function(a){var c=_slicedToArray(a,2),d=c[0],e=c[1];return createDefinition(d,e,b)}).filter(function(a){return!!a})}function createDefinition(a,b,c){var d=b.title,e=b.group,f=b.hidden;return!c[a]||f?null:{title:d,value:e?e.map(function(b,d){return/*#__PURE__*/_jsx(FormattedValue,{// eslint-disable-line react/no-array-index-key
2
+ field:b,value:c[a]},d)}):/*#__PURE__*/_jsx(FormattedValue,{field:b,value:c[a]}),key:a}}
@@ -1 +1 @@
1
- const formatUsingPattern=function(){let a=0<arguments.length&&void 0!==arguments[0]?arguments[0]:"",b=1<arguments.length?arguments[1]:void 0;if("string"!=typeof b)return a;let c=b;0<c.indexOf("||")&&(c=c.slice(0,Math.max(0,b.indexOf("||"))));let d="",separators=0,e=a.length,f=0;for(;e;)positionIsSeparator(c,f)?(d+=c[f],separators+=1):(d+=a[f-separators],e-=1),f+=1;const g=countSeparatorsAfterCursor(c,f);return g&&(d+=c.slice(f,g)),d},countSeparatorsAfterCursor=(a,b)=>{let separators=0;for(;positionIsSeparator(a,b+separators);)separators+=1;return separators},positionIsSeparator=(a,b)=>a[b]&&"*"!==a[b];export{formatUsingPattern};
1
+ var formatUsingPattern=function(){var a=0<arguments.length&&void 0!==arguments[0]?arguments[0]:"",b=1<arguments.length?arguments[1]:void 0;if("string"!=typeof b)return a;var c=b;0<c.indexOf("||")&&(c=c.slice(0,Math.max(0,b.indexOf("||"))));for(var d="",separators=0,e=a.length,f=0;e;)positionIsSeparator(c,f)?(d+=c[f],separators+=1):(d+=a[f-separators],e-=1),f+=1;var g=countSeparatorsAfterCursor(c,f);return g&&(d+=c.slice(f,g)),d},countSeparatorsAfterCursor=function(a,b){for(var separators=0;positionIsSeparator(a,b+separators);)separators+=1;return separators},positionIsSeparator=function(a,b){return a[b]&&"*"!==a[b]};export{formatUsingPattern};
@@ -1,2 +1,2 @@
1
- import EmphasisHtmlTransformer from"./EmphasisHtmlTransformer";import{jsx as _jsx}from"react/jsx-runtime";const SUPPORTED_TAGS=["important","positive","negative","warning"],emphasisHtmlTransformer=new EmphasisHtmlTransformer(SUPPORTED_TAGS),Emphasis=a=>{let{text:b=void 0}=a;if(!b)return null;const c=emphasisHtmlTransformer.transform(b);// eslint-disable-next-line react/no-danger
2
- return c?/*#__PURE__*/_jsx("span",{dangerouslySetInnerHTML:{__html:c}}):null};export default Emphasis;
1
+ import EmphasisHtmlTransformer from"./EmphasisHtmlTransformer";import{jsx as _jsx}from"react/jsx-runtime";var SUPPORTED_TAGS=["important","positive","negative","warning"],emphasisHtmlTransformer=new EmphasisHtmlTransformer(SUPPORTED_TAGS),Emphasis=function(a){var b=a.text,c=void 0===b?void 0:b;if(!c)return null;var d=emphasisHtmlTransformer.transform(c);// eslint-disable-next-line react/no-danger
2
+ return d?/*#__PURE__*/_jsx("span",{dangerouslySetInnerHTML:{__html:d}}):null};export default Emphasis;
@@ -0,0 +1 @@
1
+ import Emphasis from"./Emphasis";export default{component:Emphasis,title:"Typography/Emphasis",tags:["autodocs"]};export var Basic={args:{text:"This is <important>important</important>.\\nThis is <positive>positive</positive>.\\nThis is <negative>negative</negative>.\\nThis is a <warning>warning</warning>.\\n<script>alert(\"nice try!\")</script>"}};
@@ -1,7 +1,7 @@
1
- const ESCAPED_OPENING_CHEVRON="&lt;",ESCAPED_CLOSING_CHEVRON="&gt;";class EmphasisHtmlTransformer{constructor(a){this.tags=(a||[]).map(a=>({transformed:{opening:`<em class="emphasis emphasis--${a}">`,closing:"</em>"},escapedRegex:{opening:new RegExp(`${ESCAPED_OPENING_CHEVRON}${a}${ESCAPED_CLOSING_CHEVRON}`,"g"),closing:new RegExp(`${ESCAPED_OPENING_CHEVRON}/${a}${ESCAPED_CLOSING_CHEVRON}`,"g")}}))}// Algorithm:
1
+ import _classCallCheck from"@babel/runtime/helpers/classCallCheck";import _createClass from"@babel/runtime/helpers/createClass";import _defineProperty from"@babel/runtime/helpers/defineProperty";var ESCAPED_OPENING_CHEVRON="&lt;",ESCAPED_CLOSING_CHEVRON="&gt;",EmphasisHtmlTransformer=/*#__PURE__*/function(){function a(b){_classCallCheck(this,a),_defineProperty(this,"tags",void 0),this.tags=(b||[]).map(function(a){return{transformed:{opening:"<em class=\"emphasis emphasis--".concat(a,"\">"),closing:"</em>"},escapedRegex:{opening:new RegExp("".concat(ESCAPED_OPENING_CHEVRON).concat(a).concat(ESCAPED_CLOSING_CHEVRON),"g"),closing:new RegExp("".concat(ESCAPED_OPENING_CHEVRON,"/").concat(a).concat(ESCAPED_CLOSING_CHEVRON),"g")}}})}// Algorithm:
2
2
  // 1) Escape all dangerous characters (<,>,&)
3
3
  // 2) Replace all escaped, whitelisted tags with styled spans.
4
4
  // 3) Transform new line characters to `<br />`s
5
5
  //
6
6
  // Note: for simplicity this doesn't support tags with non-standard whitespaces, e.g. <positive></ positive>
7
- transform(a){if(!a)return null;const b=a.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");return this.tags.reduce((a,b)=>a.replace(b.escapedRegex.opening,b.transformed.opening).replace(b.escapedRegex.closing,b.transformed.closing),b).replace(/\\n|\n/g,"<br />")}}export default EmphasisHtmlTransformer;
7
+ return _createClass(a,[{key:"transform",value:function transform(a){if(!a)return null;var b=a.replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");return this.tags.reduce(function(a,b){return a.replace(b.escapedRegex.opening,b.transformed.opening).replace(b.escapedRegex.closing,b.transformed.closing)},b).replace(/\\n|\n/g,"<br />")}}]),a}();export default EmphasisHtmlTransformer;
@@ -1,2 +1,2 @@
1
- import classNames from"classnames";import PropTypes from"prop-types";import{useRef}from"react";import{Breakpoint,Layout}from"../common";import{CloseButton}from"../common/closeButton";import FlowHeader from"../common/flowHeader";import{useClientWidth}from"../common/hooks";import Logo from"../logo";import Stepper from"../stepper";import AnimatedLabel from"./animatedLabel";import BackButton from"./backButton";// Size switches on parent container which may or may not have the same size as the window.
2
- import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const containerBreakpoints={"np-flow-navigation--sm":Breakpoint.SMALL,"np-flow-navigation--lg":Breakpoint.LARGE},FlowNavigation=a=>{let{activeStep:b,avatar:c,logo:d,onClose:e,onGoBack:f,done:g,steps:h}=a;const i=useRef(null),[j]=useClientWidth({ref:i}),k=e&&/*#__PURE__*/_jsx(CloseButton,{size:"lg",onClick:e}),l=j<Breakpoint.SMALL,m=g?null:c;return/*#__PURE__*/_jsx("div",{ref:i,className:classNames("np-flow-navigation d-flex align-items-center justify-content-center p-y-3",{"np-flow-navigation--border-bottom":!g}),children:/*#__PURE__*/_jsx(FlowHeader,{className:classNames("np-flow-navigation__content p-x-3",{"np-flow-navigation--hidden":!j,"np-flow-navigation--xs-max":l},Object.keys(containerBreakpoints).filter(a=>j>=containerBreakpoints[a])),leftContent:l?(()=>{return/*#__PURE__*/_jsx(_Fragment,{children:f&&0<b?/*#__PURE__*/_jsx(BackButton,{label:/*#__PURE__*/_jsx(AnimatedLabel,{className:"m-x-1",labels:h.map(a=>a.label),activeLabel:b-1}),onClick:f}):d})})():d,rightContent:/*#__PURE__*/_jsxs(_Fragment,{children:[m,m&&k&&/*#__PURE__*/_jsx("span",{className:"separator"}),k]}),bottomContent:!g&&/*#__PURE__*/_jsx(Stepper,{activeStep:b,steps:h,className:classNames("np-flow-navigation__stepper")}),layout:j<Breakpoint.LARGE?Layout.VERTICAL:Layout.HORIZONTAL})})};FlowNavigation.defaultProps={activeStep:0,avatar:void 0,logo:/*#__PURE__*/_jsx(Logo,{}),onGoBack:void 0,onClose:void 0,done:!1},FlowNavigation.propTypes={activeStep:PropTypes.number,/** An Avatar */avatar:PropTypes.element,logo:PropTypes.node,/** Called when the close button is clicked. If not provided the close button won't show */onClose:PropTypes.func,/** Called when the back button is clicked. If not provided the back button won't show. The back button only shows on small screens */onGoBack:PropTypes.func,done:PropTypes.bool,/** Steps to be displayed in stepper. If you don't need the stepper, please use OverlayHeader instead */steps:PropTypes.arrayOf(PropTypes.shape({label:PropTypes.node.isRequired,onClick:PropTypes.func,hoverLabel:PropTypes.node})).isRequired};export default FlowNavigation;
1
+ import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import classNames from"classnames";import PropTypes from"prop-types";import{useRef}from"react";import{Breakpoint,Layout}from"../common";import{CloseButton}from"../common/closeButton";import FlowHeader from"../common/flowHeader";import{useClientWidth}from"../common/hooks";import Logo from"../logo";import Stepper from"../stepper";import AnimatedLabel from"./animatedLabel";import BackButton from"./backButton";// Size switches on parent container which may or may not have the same size as the window.
2
+ import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var containerBreakpoints={"np-flow-navigation--sm":Breakpoint.SMALL,"np-flow-navigation--lg":Breakpoint.LARGE},FlowNavigation=function(a){var b=a.activeStep,c=a.avatar,d=a.logo,e=a.onClose,f=a.onGoBack,g=a.done,h=a.steps,i=useRef(null),j=useClientWidth({ref:i}),k=_slicedToArray(j,1),l=k[0],m=e&&/*#__PURE__*/_jsx(CloseButton,{size:"lg",onClick:e}),n=l<Breakpoint.SMALL,o=g?null:c;return/*#__PURE__*/_jsx("div",{ref:i,className:classNames("np-flow-navigation d-flex align-items-center justify-content-center p-y-3",{"np-flow-navigation--border-bottom":!g}),children:/*#__PURE__*/_jsx(FlowHeader,{className:classNames("np-flow-navigation__content p-x-3",{"np-flow-navigation--hidden":!l,"np-flow-navigation--xs-max":n},Object.keys(containerBreakpoints).filter(function(a){return l>=containerBreakpoints[a]})),leftContent:n?function getLeftContentSmall(){return/*#__PURE__*/_jsx(_Fragment,{children:f&&0<b?/*#__PURE__*/_jsx(BackButton,{label:/*#__PURE__*/_jsx(AnimatedLabel,{className:"m-x-1",labels:h.map(function(a){return a.label}),activeLabel:b-1}),onClick:f}):d})}():d,rightContent:/*#__PURE__*/_jsxs(_Fragment,{children:[o,o&&m&&/*#__PURE__*/_jsx("span",{className:"separator"}),m]}),bottomContent:!g&&/*#__PURE__*/_jsx(Stepper,{activeStep:b,steps:h,className:classNames("np-flow-navigation__stepper")}),layout:l<Breakpoint.LARGE?Layout.VERTICAL:Layout.HORIZONTAL})})};FlowNavigation.defaultProps={activeStep:0,avatar:void 0,logo:/*#__PURE__*/_jsx(Logo,{}),onGoBack:void 0,onClose:void 0,done:!1},FlowNavigation.propTypes={activeStep:PropTypes.number,/** An Avatar */avatar:PropTypes.element,logo:PropTypes.node,/** Called when the close button is clicked. If not provided the close button won't show */onClose:PropTypes.func,/** Called when the back button is clicked. If not provided the back button won't show. The back button only shows on small screens */onGoBack:PropTypes.func,done:PropTypes.bool,/** Steps to be displayed in stepper. If you don't need the stepper, please use OverlayHeader instead */steps:PropTypes.arrayOf(PropTypes.shape({label:PropTypes.node.isRequired,onClick:PropTypes.func,hoverLabel:PropTypes.node})).isRequired};export default FlowNavigation;
@@ -1 +1 @@
1
- import classNames from"classnames";import PropTypes from"prop-types";import{jsx as _jsx}from"react/jsx-runtime";const AnimatedLabel=a=>{let{activeLabel:b,className:c,labels:d}=a;const e=d.length-1;return/*#__PURE__*/_jsx("div",{className:classNames("np-animated-label","np-text-body-large-bold",c),children:d.map((a,c)=>{const d=c-1;return/*#__PURE__*/_jsx("div",{className:classNames("text-xs-left",{"np-animated-label--in":c===b,"np-animated-label--out":d===b&&d!==e}),children:a},d)})})};AnimatedLabel.propTypes={activeLabel:PropTypes.number.isRequired,className:PropTypes.string,labels:PropTypes.arrayOf(PropTypes.node).isRequired},AnimatedLabel.defaultProps={className:void 0};export default AnimatedLabel;
1
+ import classNames from"classnames";import PropTypes from"prop-types";import{jsx as _jsx}from"react/jsx-runtime";var AnimatedLabel=function(a){var b=a.activeLabel,c=a.className,d=a.labels,e=d.length-1;return/*#__PURE__*/_jsx("div",{className:classNames("np-animated-label","np-text-body-large-bold",c),children:d.map(function(a,c){var d=c-1;return/*#__PURE__*/_jsx("div",{className:classNames("text-xs-left",{"np-animated-label--in":c===b,"np-animated-label--out":d===b&&d!==e}),children:a},d)})})};AnimatedLabel.propTypes={activeLabel:PropTypes.number.isRequired,className:PropTypes.string,labels:PropTypes.arrayOf(PropTypes.node).isRequired},AnimatedLabel.defaultProps={className:void 0};export default AnimatedLabel;
@@ -1 +1 @@
1
- import{ArrowLeft as ArrowLeftIcon}from"@transferwise/icons";import classNames from"classnames";import PropTypes from"prop-types";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const BackButton=a=>{let{label:b,className:c,onClick:d}=a;return/*#__PURE__*/_jsxs("button",{type:"button",className:classNames("np-back-button","align-items-center","btn-unstyled",c),onClick:d,children:[/*#__PURE__*/_jsx(ArrowLeftIcon,{size:24}),b]})};BackButton.propTypes={className:PropTypes.string,label:PropTypes.element,onClick:PropTypes.func.isRequired},BackButton.defaultProps={className:void 0,label:void 0};export default BackButton;
1
+ import{ArrowLeft as ArrowLeftIcon}from"@transferwise/icons";import classNames from"classnames";import PropTypes from"prop-types";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var BackButton=function(a){var b=a.label,c=a.className,d=a.onClick;return/*#__PURE__*/_jsxs("button",{type:"button",className:classNames("np-back-button","align-items-center","btn-unstyled",c),onClick:d,children:[/*#__PURE__*/_jsx(ArrowLeftIcon,{size:24}),b]})};BackButton.propTypes={className:PropTypes.string,label:PropTypes.element,onClick:PropTypes.func.isRequired},BackButton.defaultProps={className:void 0,label:void 0};export default BackButton;
@@ -1,5 +1,5 @@
1
- import{useTheme}from"@wise/components-theming";import classNames from"classnames";import ActionButton from"../actionButton/ActionButton";import Button from"../button";import{Typography}from"../common";import Link from"../link";import Title from"../title";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const HeaderAction=a=>{let{action:b}=a;const{isModern:c}=useTheme(),d={"aria-label":b["aria-label"]};return"href"in b?/*#__PURE__*/_jsx(Link,{href:b.href,target:b.target,onClick:b.onClick,...d,children:b.text}):c?/*#__PURE__*/_jsx(Button,{className:"np-header__button",priority:"tertiary",size:"sm",onClick:b.onClick,...d,children:b.text}):/*#__PURE__*/_jsx(ActionButton,{onClick:b.onClick,...d,children:b.text})};/**
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{useTheme}from"@wise/components-theming";import classNames from"classnames";import ActionButton from"../actionButton/ActionButton";import Button from"../button";import{Typography}from"../common";import Link from"../link";import Title from"../title";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var HeaderAction=function(a){var b=a.action,c=useTheme(),d=c.isModern,e={"aria-label":b["aria-label"]};return"href"in b?/*#__PURE__*/_jsx(Link,_objectSpread(_objectSpread({href:b.href,target:b.target,onClick:b.onClick},e),{},{children:b.text})):d?/*#__PURE__*/_jsx(Button,_objectSpread(_objectSpread({className:"np-header__button",priority:"tertiary",size:"sm",onClick:b.onClick},e),{},{children:b.text})):/*#__PURE__*/_jsx(ActionButton,_objectSpread(_objectSpread({onClick:b.onClick},e),{},{children:b.text}))};/**
2
2
  *
3
3
  * Neptune Web: https://transferwise.github.io/neptune-web/components/content/Header
4
4
  *
5
- */export const Header=a=>{let{action:b,as:e="h5",title:c,className:d}=a;return/*#__PURE__*/_jsxs("div",{className:classNames("np-header",d),children:[/*#__PURE__*/_jsx(Title,{as:e,type:Typography.TITLE_GROUP,className:"np-header__title",children:c}),b&&/*#__PURE__*/_jsx(HeaderAction,{action:b})]})};export default Header;
5
+ */export var Header=function(a){var b=a.action,c=a.as,d=void 0===c?"h5":c,e=a.title,f=a.className;return/*#__PURE__*/_jsxs("div",{className:classNames("np-header",f),children:[/*#__PURE__*/_jsx(Title,{as:d,type:Typography.TITLE_GROUP,className:"np-header__title",children:e}),b&&/*#__PURE__*/_jsx(HeaderAction,{action:b})]})};export default Header;
@@ -1 +1 @@
1
- import{render,screen,userEvent}from"../test-utils";import Header from".";import{jsx as _jsx}from"react/jsx-runtime";describe("Header",()=>{it("can set header title",()=>{render(/*#__PURE__*/_jsx(Header,{title:"Header title"})),expect(screen.getByText("Header title")).toBeInTheDocument()}),it("can trigger header action",()=>{const a=jest.fn();render(/*#__PURE__*/_jsx(Header,{title:"Header title",action:{text:"Click me!",onClick:a}})),userEvent.click(screen.getByRole("button",{name:"Click me!"})),expect(a).toHaveBeenCalledTimes(1)}),it("can set aria-label property for header action",()=>{const a=jest.fn();render(/*#__PURE__*/_jsx(Header,{title:"Header title",action:{"aria-label":"Magic",text:"Click me!",onClick:a}})),userEvent.click(screen.getByRole("button",{name:"Magic"})),expect(a).toHaveBeenCalledTimes(1)}),it("renders header action as a link when href is provided",()=>{render(/*#__PURE__*/_jsx(Header,{title:"Header title",action:{"aria-label":"Click me!",text:"I am a link",href:"https://wise.com"}}));const a=screen.getByRole("link",{name:"Click me!"});expect(a).toHaveAttribute("href","https://wise.com")}),it("renders header with h5 heading tag by default",()=>{render(/*#__PURE__*/_jsx(Header,{title:"Header title"})),expect(screen.getByRole("heading",{name:"Header title",level:5})).toBeInTheDocument()}),it("can render header with specific heading tag",()=>{render(/*#__PURE__*/_jsx(Header,{as:"h3",title:"Header title"})),expect(screen.getByRole("heading",{name:"Header title",level:3})).toBeInTheDocument()}),it("runs onClick if specified even when it got href prop",()=>{const a=jest.fn();render(/*#__PURE__*/_jsx(Header,{as:"h3",title:"Header title",action:{text:"Click me",href:"#",onClick:a}}));const b=screen.getByRole("link",{name:"Click me"});expect(b).toBeInTheDocument(),userEvent.click(b),expect(a).toHaveBeenCalledTimes(1)})});
1
+ import{render,screen,userEvent}from"../test-utils";import Header from".";import{jsx as _jsx}from"react/jsx-runtime";describe("Header",function(){it("can set header title",function(){render(/*#__PURE__*/_jsx(Header,{title:"Header title"})),expect(screen.getByText("Header title")).toBeInTheDocument()}),it("can trigger header action",function(){var a=jest.fn();render(/*#__PURE__*/_jsx(Header,{title:"Header title",action:{text:"Click me!",onClick:a}})),userEvent.click(screen.getByRole("button",{name:"Click me!"})),expect(a).toHaveBeenCalledTimes(1)}),it("can set aria-label property for header action",function(){var a=jest.fn();render(/*#__PURE__*/_jsx(Header,{title:"Header title",action:{"aria-label":"Magic",text:"Click me!",onClick:a}})),userEvent.click(screen.getByRole("button",{name:"Magic"})),expect(a).toHaveBeenCalledTimes(1)}),it("renders header action as a link when href is provided",function(){render(/*#__PURE__*/_jsx(Header,{title:"Header title",action:{"aria-label":"Click me!",text:"I am a link",href:"https://wise.com"}}));var a=screen.getByRole("link",{name:"Click me!"});expect(a).toHaveAttribute("href","https://wise.com")}),it("renders header with h5 heading tag by default",function(){render(/*#__PURE__*/_jsx(Header,{title:"Header title"})),expect(screen.getByRole("heading",{name:"Header title",level:5})).toBeInTheDocument()}),it("can render header with specific heading tag",function(){render(/*#__PURE__*/_jsx(Header,{as:"h3",title:"Header title"})),expect(screen.getByRole("heading",{name:"Header title",level:3})).toBeInTheDocument()}),it("runs onClick if specified even when it got href prop",function(){var a=jest.fn();render(/*#__PURE__*/_jsx(Header,{as:"h3",title:"Header title",action:{text:"Click me",href:"#",onClick:a}}));var b=screen.getByRole("link",{name:"Click me"});expect(b).toBeInTheDocument(),userEvent.click(b),expect(a).toHaveBeenCalledTimes(1)})});
@@ -1 +1,2 @@
1
- import Header from"./Header";import{jsx as _jsx}from"react/jsx-runtime";export default{component:Header,title:"Typography/Header"};export const Basic=()=>/*#__PURE__*/_jsx(Header,{title:"Header title"});export const WithAction=()=>/*#__PURE__*/_jsx(Header,{title:"Header title",action:{"aria-label":"Magic",text:"Click me!",onClick:()=>alert("Action!")}});export const WithActionAsLink=()=>/*#__PURE__*/_jsx(Header,{title:"Header title",action:{text:"This is a link",href:"https://wise.com"}});export const WithActionAsLinkPreventingNavigationWithTracking=()=>/*#__PURE__*/_jsx(Header,{title:"Header title",action:{text:"This is a link",href:"https://wise.com",onClick:a=>{alert("Running onClick handler"),a.preventDefault()}}});
1
+ import Header from"./Header";import{jsx as _jsx}from"react/jsx-runtime";export default{component:Header,title:"Typography/Header"};export var Basic=function(){return/*#__PURE__*/_jsx(Header,{title:"Header title"})};export var WithAction=function(){return/*#__PURE__*/_jsx(Header,{title:"Header title",action:{"aria-label":"Magic",text:"Click me!",onClick:function onClick(){return alert("Action!")}}})};export var WithActionAsLink=function(){return/*#__PURE__*/_jsx(Header,{title:"Header title",action:{text:"This is a link",href:"https://wise.com"}})};export var WithActionAsLinkPreventingNavigationWithTracking=function(){return/*#__PURE__*/_jsx(Header,{title:"Header title",action:{text:"This is a link",href:"https://wise.com",onClick:function onClick(a){// we can stop the navigation from happening as onClick will always run before href redirect
2
+ alert("Running onClick handler"),a.preventDefault()}}})};
@@ -1 +1 @@
1
- import de from"./de.json";import en from"./en.json";import es from"./es.json";import fr from"./fr.json";import hu from"./hu.json";import id from"./id.json";import it from"./it.json";import ja from"./ja.json";import pl from"./pl.json";import pt from"./pt.json";import ro from"./ro.json";import ru from"./ru.json";import th from"./th.json";import tr from"./tr.json";import uk from"./uk.json";import zh from"./zh.json";const translations={de,en,es,fr,hu,id,it,ja,pl,pt,ro,ru,th,tr,uk,zh};export default translations;
1
+ import de from"./de.json";import en from"./en.json";import es from"./es.json";import fr from"./fr.json";import hu from"./hu.json";import id from"./id.json";import it from"./it.json";import ja from"./ja.json";import pl from"./pl.json";import pt from"./pt.json";import ro from"./ro.json";import ru from"./ru.json";import th from"./th.json";import tr from"./tr.json";import uk from"./uk.json";import zh from"./zh.json";var translations={de:de,en:en,es:es,fr:fr,hu:hu,id:id,it:it,ja:ja,pl:pl,pt:pt,ro:ro,ru:ru,th:th,tr:tr,uk:uk,zh:zh};export default translations;
@@ -1,4 +1,4 @@
1
- import classnames from"classnames";import PropTypes from"prop-types";import{useRef}from"react";import{useHasIntersected}from"../common/hooks";/**
1
+ import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import classnames from"classnames";import PropTypes from"prop-types";import{useRef}from"react";import{useHasIntersected}from"../common/hooks";/**
2
2
  * Image component provides a wrapper for image tag. Optional lazy loading functionalities can also be enabled passing prop loading = "lazy.
3
3
  * Once element intersects viewport image loads.
4
4
  *
@@ -9,4 +9,4 @@ import classnames from"classnames";import PropTypes from"prop-types";import{useR
9
9
  * @param {Function} [onError=()=>{}] - function that contains error callback. Doesn't fire on SSR https://github.com/facebook/react/issues/15446
10
10
  * @param {boolean} [loading="lazy"] - This attribute follows the loading API attribute. If set to eager image will load immediately just like a normal image tag otherwise it will lazy load.
11
11
  * @usage `<Image alt="alt" src="src" id="id1" onLoad={()=>{}} onError={())=>{}} loading="lazy" />`
12
- */import{jsx as _jsx}from"react/jsx-runtime";export const EmptyTransparentImage="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";const Image=a=>{let{id:b,src:c,alt:d,onLoad:e,onError:f,className:g,loading:h,stretch:i,shrink:j}=a;const k=useRef(),[l]=useHasIntersected({elRef:k,loading:h});let m=c,n=e;return"lazy"!==h||l||(m=EmptyTransparentImage,n=null),/*#__PURE__*/_jsx("img",{ref:k,id:b,alt:d,src:m,className:classnames(["tw-image",{"tw-image__stretch":i,"tw-image__shrink":j},g]),onLoad:n,onError:f})};Image.propTypes={id:PropTypes.string,src:PropTypes.string.isRequired,alt:PropTypes.string.isRequired,onLoad:PropTypes.func,onError:PropTypes.func,className:PropTypes.string,loading:PropTypes.oneOf(["lazy","eager"]),stretch:PropTypes.bool,shrink:PropTypes.bool},Image.defaultProps={id:null,className:"",onLoad:()=>{},onError:()=>{},loading:"eager",stretch:!0,shrink:!0};export default Image;
12
+ */import{jsx as _jsx}from"react/jsx-runtime";export var EmptyTransparentImage="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==";var Image=function(a){var b=a.id,c=a.src,d=a.alt,e=a.onLoad,f=a.onError,g=a.className,h=a.loading,i=a.stretch,j=a.shrink,k=useRef(),l=useHasIntersected({elRef:k,loading:h}),m=_slicedToArray(l,1),n=m[0],o=c,p=e;return"lazy"!==h||n||(o=EmptyTransparentImage,p=null),/*#__PURE__*/_jsx("img",{ref:k,id:b,alt:d,src:o,className:classnames(["tw-image",{"tw-image__stretch":i,"tw-image__shrink":j},g]),onLoad:p,onError:f})};Image.propTypes={id:PropTypes.string,src:PropTypes.string.isRequired,alt:PropTypes.string.isRequired,onLoad:PropTypes.func,onError:PropTypes.func,className:PropTypes.string,loading:PropTypes.oneOf(["lazy","eager"]),stretch:PropTypes.bool,shrink:PropTypes.bool},Image.defaultProps={id:null,className:"",onLoad:function onLoad(){},onError:function onError(){},loading:"eager",stretch:!0,shrink:!0};export default Image;
@@ -1 +1 @@
1
- import{QuestionMarkCircle as HelpCircleIcon}from"@transferwise/icons";import classNames from"classnames";import PropTypes from"prop-types";import{useState}from"react";import{Size,Position}from"../common";import Modal from"../modal";import Popover from"../popover";import{InfoPresentation}from"./infoPresentations";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const Info=a=>{const{className:b,content:c,onClick:d,presentation:e,size:f,title:g}=a,[h,i]=useState(!1),j=e===InfoPresentation.MODAL,k=f===Size.SMALL,l={"aria-label":a["aria-label"],className:"btn-unstyled",children:/*#__PURE__*/_jsx(HelpCircleIcon,{size:k?16:24})};return/*#__PURE__*/_jsx("span",{className:classNames(b,"np-info",{"np-info__small":k,"np-info__large":!k}),children:j?/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("button",{type:"button",onClick:()=>{i(!h),d&&d()},...l}),/*#__PURE__*/_jsx(Modal,{body:c,open:h,title:g,onClose:()=>i(!1)})]}):/*#__PURE__*/_jsx(Popover,{content:c,preferredPlacement:Position.BOTTOM,title:g,children:/*#__PURE__*/_jsx("button",{type:"button",...l,onClick:()=>{d&&d()}})})})};Info.propTypes={"aria-label":PropTypes.string.isRequired,/** Extra classes applied to Info */className:PropTypes.string,/** Content displayed inside a Popover a Modal */content:PropTypes.node,onClick:PropTypes.func,/** Decides whether to display content in a Popover or a Modal */presentation:PropTypes.oneOf(["MODAL","POPOVER"]),/** Decides the size of help Icon */size:PropTypes.oneOf(["sm","lg"]),/** Title displayed inside a Popover a Modal */title:PropTypes.node},Info.defaultProps={className:void 0,content:void 0,onClick:void 0,presentation:InfoPresentation.POPOVER,size:Size.SMALL,title:void 0};export default Info;
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{QuestionMarkCircle as HelpCircleIcon}from"@transferwise/icons";import classNames from"classnames";import PropTypes from"prop-types";import{useState}from"react";import{Size,Position}from"../common";import Modal from"../modal";import Popover from"../popover";import{InfoPresentation}from"./infoPresentations";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var Info=function(a){var b=a.className,c=a.content,d=a.onClick,e=a.presentation,f=a.size,g=a.title,h=useState(!1),i=_slicedToArray(h,2),j=i[0],k=i[1],l=e===InfoPresentation.MODAL,m=f===Size.SMALL,n={"aria-label":a["aria-label"],className:"btn-unstyled",children:/*#__PURE__*/_jsx(HelpCircleIcon,{size:m?16:24})};return/*#__PURE__*/_jsx("span",{className:classNames(b,"np-info",{"np-info__small":m,"np-info__large":!m}),children:l?/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx("button",_objectSpread({type:"button",onClick:function onClick(){k(!j),d&&d()}},n)),/*#__PURE__*/_jsx(Modal,{body:c,open:j,title:g,onClose:function onClose(){return k(!1)}})]}):/*#__PURE__*/_jsx(Popover,{content:c,preferredPlacement:Position.BOTTOM,title:g,children:/*#__PURE__*/_jsx("button",_objectSpread(_objectSpread({type:"button"},n),{},{onClick:function onClick(){d&&d()}}))})})};Info.propTypes={"aria-label":PropTypes.string.isRequired,/** Extra classes applied to Info */className:PropTypes.string,/** Content displayed inside a Popover a Modal */content:PropTypes.node,onClick:PropTypes.func,/** Decides whether to display content in a Popover or a Modal */presentation:PropTypes.oneOf(["MODAL","POPOVER"]),/** Decides the size of help Icon */size:PropTypes.oneOf(["sm","lg"]),/** Title displayed inside a Popover a Modal */title:PropTypes.node},Info.defaultProps={className:void 0,content:void 0,onClick:void 0,presentation:InfoPresentation.POPOVER,size:Size.SMALL,title:void 0};export default Info;
@@ -1 +1 @@
1
- import{userEvent,within}from"@storybook/testing-library";import{lorem10,storyConfig}from"../test-utils";import Info,{InfoPresentation}from".";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:Info,title:"Dialogs/Info",args:{"aria-label":"Click here for more details",title:"Fast transfer hint",content:lorem10},render:a=>/*#__PURE__*/_jsxs("p",{children:[/*#__PURE__*/_jsx("span",{children:"Fast transfer"})," ",/*#__PURE__*/_jsx(Info,{...a})]})};export const Basic=storyConfig({},{variants:["default","dark","rtl"]});export const OpenedPopover={parameters:{chromatic:{delay:1e3}},play:a=>{let{canvasElement:b}=a;const c=within(b);userEvent.click(c.getByRole("button"))}};export const OpenedPopoverMobile=storyConfig(OpenedPopover,{variants:["mobile"]});export const OpenedModal={...OpenedPopover,args:{presentation:InfoPresentation.MODAL}};export const OpenedModalMobile=storyConfig(OpenedModal,{variants:["mobile"]});
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{userEvent,within}from"@storybook/testing-library";import{lorem10,storyConfig}from"../test-utils";import Info,{InfoPresentation}from".";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:Info,title:"Dialogs/Info",args:{"aria-label":"Click here for more details",title:"Fast transfer hint",content:lorem10},render:function render(a){return/*#__PURE__*/_jsxs("p",{children:[/*#__PURE__*/_jsx("span",{children:"Fast transfer"})," ",/*#__PURE__*/_jsx(Info,_objectSpread({},a))]})}};export var Basic=storyConfig({},{variants:["default","dark","rtl"]});export var OpenedPopover={parameters:{chromatic:{delay:1e3}},play:function play(a){var b=a.canvasElement,c=within(b);userEvent.click(c.getByRole("button"))}};export var OpenedPopoverMobile=storyConfig(OpenedPopover,{variants:["mobile"]});export var OpenedModal=_objectSpread(_objectSpread({},OpenedPopover),{},{args:{presentation:InfoPresentation.MODAL}});export var OpenedModalMobile=storyConfig(OpenedModal,{variants:["mobile"]});
@@ -1,2 +1,2 @@
1
1
  // TODO: consider to move this enum into component file once we migrate it on TypeScript or replace with some common enum
2
- export let InfoPresentation=/*#__PURE__*/function(a){return a.POPOVER="POPOVER",a.MODAL="MODAL",a}({});
2
+ export var InfoPresentation=/*#__PURE__*/function(a){return a.POPOVER="POPOVER",a.MODAL="MODAL",a}({});
@@ -1 +1 @@
1
- import{AlertCircle as AlertCircleIcon}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import withArrow,{AlertArrowPosition}from"../alert/withArrow";import{Sentiment}from"../common";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const typeClassMap={[Sentiment.ERROR]:"danger",[Sentiment.NEGATIVE]:"danger"},InlineAlert=a=>{const{isModern:b}=useTheme(),c=`alert-${typeClassMap[a.type]||a.type}`;if(b)return/*#__PURE__*/_jsxs("div",{role:"alert",id:a.id,className:classNames("alert alert-detach",c,a.className),children:[("error"===a.type||"negative"===a.type)&&/*#__PURE__*/_jsx(AlertCircleIcon,{}),/*#__PURE__*/_jsx("div",{children:a.children})]});const d=withArrow(b=>{let{children:d,className:e}=b;return/*#__PURE__*/_jsx("div",{role:"alert",id:a.id,className:classNames("alert alert-detach p-x-2 p-y-1",c,e),children:d})},AlertArrowPosition.TOP_LEFT);return/*#__PURE__*/_jsx(d,{...a})};InlineAlert.propTypes={children:PropTypes.node.isRequired,className:PropTypes.string,id:PropTypes.string,type:PropTypes.oneOf(["positive","negative","warning","neutral","success","info","error"])},InlineAlert.defaultProps={className:void 0,id:void 0,type:Sentiment.NEUTRAL};export default InlineAlert;
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";var _typeClassMap;function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{AlertCircle as AlertCircleIcon}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import withArrow,{AlertArrowPosition}from"../alert/withArrow";import{Sentiment}from"../common";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var typeClassMap=(_typeClassMap={},_defineProperty(_typeClassMap,Sentiment.ERROR,"danger"),_defineProperty(_typeClassMap,Sentiment.NEGATIVE,"danger"),_typeClassMap),InlineAlert=function(a){var b=useTheme(),c=b.isModern,d="alert-".concat(typeClassMap[a.type]||a.type);if(c)return/*#__PURE__*/_jsxs("div",{role:"alert",id:a.id,className:classNames("alert alert-detach",d,a.className),children:[("error"===a.type||"negative"===a.type)&&/*#__PURE__*/_jsx(AlertCircleIcon,{}),/*#__PURE__*/_jsx("div",{children:a.children})]});var e=withArrow(function getAlertContents(b){var c=b.children,e=b.className;return/*#__PURE__*/_jsx("div",{role:"alert",id:a.id,className:classNames("alert alert-detach p-x-2 p-y-1",d,e),children:c})},AlertArrowPosition.TOP_LEFT);return/*#__PURE__*/_jsx(e,_objectSpread({},a))};InlineAlert.propTypes={children:PropTypes.node.isRequired,className:PropTypes.string,id:PropTypes.string,type:PropTypes.oneOf(["positive","negative","warning","neutral","success","info","error"])},InlineAlert.defaultProps={className:void 0,id:void 0,type:Sentiment.NEUTRAL};export default InlineAlert;
@@ -1 +1 @@
1
- import PropTypes from"prop-types";import WithDisplayFormat from"../withDisplayFormat";import{jsx as _jsx}from"react/jsx-runtime";const InputWithDisplayFormat=a=>/*#__PURE__*/_jsx(WithDisplayFormat,{...a,render:a=>/*#__PURE__*/_jsx("input",{...a})});InputWithDisplayFormat.propTypes={displayPattern:PropTypes.string.isRequired,onChange:PropTypes.func.isRequired};export default InputWithDisplayFormat;
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import PropTypes from"prop-types";import WithDisplayFormat from"../withDisplayFormat";import{jsx as _jsx}from"react/jsx-runtime";var InputWithDisplayFormat=function(a){return/*#__PURE__*/_jsx(WithDisplayFormat,_objectSpread(_objectSpread({},a),{},{render:function render(a){return/*#__PURE__*/_jsx("input",_objectSpread({},a))}}))};InputWithDisplayFormat.propTypes={displayPattern:PropTypes.string.isRequired,onChange:PropTypes.func.isRequired};export default InputWithDisplayFormat;
@@ -1 +1 @@
1
- import classNames from"classnames";import{forwardRef}from"react";import{formControlClassNameBase}from"./_common";import{jsx as _jsx}from"react/jsx-runtime";export const Input=/*#__PURE__*/forwardRef(function(a,b){let{size:e="auto",className:c,...d}=a;return/*#__PURE__*/_jsx("input",{ref:b,className:classNames(c,formControlClassNameBase({size:e})),...d})});
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["size","className"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import classNames from"classnames";import{forwardRef}from"react";import{formControlClassNameBase}from"./_common";import{jsx as _jsx}from"react/jsx-runtime";export var Input=/*#__PURE__*/forwardRef(function(a,b){var c=a.size,d=void 0===c?"auto":c,e=a.className,f=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx("input",_objectSpread({ref:b,className:classNames(e,formControlClassNameBase({size:d}))},f))});
@@ -1 +1 @@
1
- import classNames from"classnames";import{forwardRef}from"react";import{formControlClassNameBase}from"./_common";import{jsx as _jsx}from"react/jsx-runtime";export const TextArea=/*#__PURE__*/forwardRef(function(a,b){let{className:c,...d}=a;return/*#__PURE__*/_jsx("textarea",{ref:b,className:classNames(c,formControlClassNameBase(),"np-text-area"),...d})});
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import classNames from"classnames";import{forwardRef}from"react";import{formControlClassNameBase}from"./_common";import{jsx as _jsx}from"react/jsx-runtime";export var TextArea=/*#__PURE__*/forwardRef(function(a,b){var c=a.className,d=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx("textarea",_objectSpread({ref:b,className:classNames(c,formControlClassNameBase(),"np-text-area")},d))});
@@ -1,2 +1,2 @@
1
- import classNames from"classnames";export function formControlClassNameBase(){let{size:a="auto"}=0<arguments.length&&arguments[0]!==void 0?arguments[0]:{};return classNames("form-control",// TODO: Deprecate
2
- "np-form-control",{"np-form-control--size-auto np-text-body-large":"auto"===a,"np-form-control--size-sm np-text-body-default":"sm"===a,"np-form-control--size-md np-text-body-large":"md"===a,"np-form-control--size-lg np-text-title-subsection":"lg"===a},"np-form-control--shape-rectangle")}
1
+ import classNames from"classnames";export function formControlClassNameBase(){var a=0<arguments.length&&arguments[0]!==void 0?arguments[0]:{},b=a.size,c=void 0===b?"auto":b;return classNames("form-control",// TODO: Deprecate
2
+ "np-form-control",{"np-form-control--size-auto np-text-body-large":"auto"===c,"np-form-control--size-sm np-text-body-default":"sm"===c,"np-form-control--size-md np-text-body-large":"md"===c,"np-form-control--size-lg np-text-title-subsection":"lg"===c},"np-form-control--shape-rectangle")}
@@ -1,3 +1,3 @@
1
- import{CrossCircle,CrossCircleFill,CheckCircle,CheckCircleFill}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import Body from"../body/Body";import{Typography}from"../common/propsValues/typography";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const InstructionsList=a=>{const{isModern:b}=useTheme(),{dos:c,donts:d}=a,e=b?CrossCircleFill:CrossCircle,f=b?CheckCircleFill:CheckCircle;return/*#__PURE__*/_jsxs("div",{className:"tw-instructions",children:[c&&c.map((a,b)=>/*#__PURE__*/ // eslint-disable-next-line react/no-array-index-key
2
- _jsxs("div",{className:"instruction",children:[/*#__PURE__*/_jsx(f,{size:24,className:"do"}),/*#__PURE__*/_jsx(Body,{className:"text-primary",type:Typography.BODY_LARGE,children:a})]},b)),d&&d.map((a,b)=>/*#__PURE__*/ // eslint-disable-next-line react/no-array-index-key
3
- _jsxs("div",{className:"instruction",children:[/*#__PURE__*/_jsx(e,{size:24,className:"dont"}),/*#__PURE__*/_jsx(Body,{className:"text-primary",type:Typography.BODY_LARGE,children:a})]},b))]})};export default InstructionsList;
1
+ import{CrossCircle,CrossCircleFill,CheckCircle,CheckCircleFill}from"@transferwise/icons";import{useTheme}from"@wise/components-theming";import Body from"../body/Body";import{Typography}from"../common/propsValues/typography";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var InstructionsList=function(a){var b=useTheme(),c=b.isModern,d=a.dos,e=a.donts,f=c?CrossCircleFill:CrossCircle,g=c?CheckCircleFill:CheckCircle;return/*#__PURE__*/_jsxs("div",{className:"tw-instructions",children:[d&&d.map(function(a,b){return/*#__PURE__*/ (// eslint-disable-next-line react/no-array-index-key
2
+ _jsxs("div",{className:"instruction",children:[/*#__PURE__*/_jsx(g,{size:24,className:"do"}),/*#__PURE__*/_jsx(Body,{className:"text-primary",type:Typography.BODY_LARGE,children:a})]},b))}),e&&e.map(function(a,b){return/*#__PURE__*/ (// eslint-disable-next-line react/no-array-index-key
3
+ _jsxs("div",{className:"instruction",children:[/*#__PURE__*/_jsx(f,{size:24,className:"dont"}),/*#__PURE__*/_jsx(Body,{className:"text-primary",type:Typography.BODY_LARGE,children:a})]},b))})]})};export default InstructionsList;
@@ -1,5 +1,5 @@
1
- import{NavigateAway as NavigateAwayIcon}from"@transferwise/icons";import classNames from"classnames";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";/**
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["className","children","href","target","type","aria-label","onClick"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{NavigateAway as NavigateAwayIcon}from"@transferwise/icons";import classNames from"classnames";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";/**
2
2
  * Standard Link component with navigate away icon
3
3
  *
4
4
  * Documentation: https://transferwise.github.io/neptune-web/components/content/Link
5
- */const Link=a=>{let{className:b,children:c,href:d,target:e,type:f,"aria-label":g,onClick:h,...i}=a;const j="_blank"===e;return/*#__PURE__*/_jsxs("a",{href:d,target:e,className:classNames("np-link",f?`np-text-${f}`:void 0,"d-inline-flex",b),"aria-label":g,rel:j?"noreferrer":void 0,onClick:h,...i,children:[c,j&&/*#__PURE__*/_jsx(NavigateAwayIcon,{})]})};export default Link;
5
+ */var Link=function(a){var b=a.className,c=a.children,d=a.href,e=a.target,f=a.type,g=a["aria-label"],h=a.onClick,i=_objectWithoutProperties(a,_excluded),j="_blank"===e;return/*#__PURE__*/_jsxs("a",_objectSpread(_objectSpread({href:d,target:e,className:classNames("np-link",f?"np-text-".concat(f):void 0,"d-inline-flex",b),"aria-label":g,rel:j?"noreferrer":void 0,onClick:h},i),{},{children:[c,j&&/*#__PURE__*/_jsx(NavigateAwayIcon,{})]}))};export default Link;
@@ -1 +1 @@
1
- import"@testing-library/jest-dom";import{render,screen}from"../test-utils";import Link from".";import{jsx as _jsx}from"react/jsx-runtime";describe("Link",()=>{const a={className:"a-class",href:"/test"};it("renders Link component",()=>{render(/*#__PURE__*/_jsx(Link,{...a,children:"link text"}));const b=screen.getByRole("link",{name:"link text"});expect(b).toHaveAttribute("href",a.href),expect(b).toHaveClass(a.className),expect(b).not.toHaveAttribute("target"),expect(b).not.toHaveAttribute("rel")}),it("renders target and rel attributes when target is _blank",()=>{render(/*#__PURE__*/_jsx(Link,{...a,target:"_blank",children:"link text"}));const b=screen.getByText("link text");expect(b).toHaveAttribute("target","_blank"),expect(b).toHaveAttribute("rel","noreferrer")}),it("renders with the provided aria-label",()=>{render(/*#__PURE__*/_jsx(Link,{...a,"aria-label":"make me accessible",children:"link text"}));const b=screen.getByText("link text");expect(b).toHaveAttribute("aria-label","make me accessible")})});
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import"@testing-library/jest-dom";import{render,screen}from"../test-utils";import Link from".";import{jsx as _jsx}from"react/jsx-runtime";describe("Link",function(){var a={className:"a-class",href:"/test"};it("renders Link component",function(){render(/*#__PURE__*/_jsx(Link,_objectSpread(_objectSpread({},a),{},{children:"link text"})));var b=screen.getByRole("link",{name:"link text"});expect(b).toHaveAttribute("href",a.href),expect(b).toHaveClass(a.className),expect(b).not.toHaveAttribute("target"),expect(b).not.toHaveAttribute("rel")}),it("renders target and rel attributes when target is _blank",function(){render(/*#__PURE__*/_jsx(Link,_objectSpread(_objectSpread({},a),{},{target:"_blank",children:"link text"})));var b=screen.getByText("link text");expect(b).toHaveAttribute("target","_blank"),expect(b).toHaveAttribute("rel","noreferrer")}),it("renders with the provided aria-label",function(){render(/*#__PURE__*/_jsx(Link,_objectSpread(_objectSpread({},a),{},{"aria-label":"make me accessible",children:"link text"})));var b=screen.getByText("link text");expect(b).toHaveAttribute("aria-label","make me accessible")})});
@@ -1 +1 @@
1
- /* eslint-disable react/jsx-child-element-spacing */import Body from"../body/Body";import{Typography}from"../common";import Title from"../title/Title";import Link from".";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";export default{component:Link,title:"Typography/Link"};export const Basic=()=>/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Title,{type:Typography.TITLE_SCREEN,className:"m-t-3",children:"Standalone examples of links"}),/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"Default link"}),/*#__PURE__*/_jsx(Link,{type:Typography.LINK_DEFAULT,target:"_blank",className:"m-t-3",href:"#",children:"Default link"}),/*#__PURE__*/_jsx(Link,{type:Typography.LINK_LARGE,target:"_blank",className:"m-t-3",href:"#",children:"Large link"}),/*#__PURE__*/_jsxs(Title,{type:Typography.TITLE_SCREEN,className:"m-t-3",children:["Links via ",/*#__PURE__*/_jsx("code",{children:"<Link />"})," component in all types of body copy"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Title,{type:Typography.TITLE_SCREEN,className:"m-t-3",children:["Links via ",/*#__PURE__*/_jsx("code",{children:"<a>"})," tag in all types of body copy"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]})]});
1
+ /* eslint-disable react/jsx-child-element-spacing */import Body from"../body/Body";import{Typography}from"../common";import Title from"../title/Title";import Link from".";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";export default{component:Link,title:"Typography/Link"};export var Basic=function(){return/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Title,{type:Typography.TITLE_SCREEN,className:"m-t-3",children:"Standalone examples of links"}),/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"Default link"}),/*#__PURE__*/_jsx(Link,{type:Typography.LINK_DEFAULT,target:"_blank",className:"m-t-3",href:"#",children:"Default link"}),/*#__PURE__*/_jsx(Link,{type:Typography.LINK_LARGE,target:"_blank",className:"m-t-3",href:"#",children:"Large link"}),/*#__PURE__*/_jsxs(Title,{type:Typography.TITLE_SCREEN,className:"m-t-3",children:["Links via ",/*#__PURE__*/_jsx("code",{children:"<Link />"})," component in all types of body copy"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx(Link,{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Title,{type:Typography.TITLE_SCREEN,className:"m-t-3",children:["Links via ",/*#__PURE__*/_jsx("code",{children:"<a>"})," tag in all types of body copy"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_LARGE,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT_BOLD,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]}),/*#__PURE__*/_jsxs(Body,{type:Typography.BODY_DEFAULT,className:"m-t-3",children:["We\u2019re building the world's"," ",/*#__PURE__*/_jsx("a",{href:"#",target:"_blank",children:"most international account"}),". We\u2019re building the world's most international account"]})]})};
@@ -1 +1 @@
1
- import classNames from"classnames";import Body from"../body/Body";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const ListItem=a=>{let{media:b,action:c,className:d,title:e,value:f,isContainerAligned:g,as:i="li",...h}=a;return/*#__PURE__*/_jsxs(i,{className:classNames("np-list-item d-flex align-items-center p-y-2",d,{"p-x-2":!g}),...h,children:[b?b:null,/*#__PURE__*/_jsxs("div",{className:classNames("d-flex flex-column",{"p-l-2":!!b,"p-r-2":!!c}),children:[/*#__PURE__*/_jsx(Body,{type:"body-default",className:"text-secondary m-b-0",children:e}),f&&/*#__PURE__*/_jsx(Body,{type:"body-large",className:"text-primary m-b-0",children:f})]}),c?/*#__PURE__*/_jsx("div",{className:"np-list-item__action m-l-auto",children:c}):null]})};export default ListItem;
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["media","action","className","title","value","isContainerAligned","as"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import classNames from"classnames";import Body from"../body/Body";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var ListItem=function(a){var b=a.media,c=a.action,d=a.className,e=a.title,f=a.value,g=a.isContainerAligned,h=a.as,i=void 0===h?"li":h,j=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsxs(i,_objectSpread(_objectSpread({className:classNames("np-list-item d-flex align-items-center p-y-2",d,{"p-x-2":!g})},j),{},{children:[b?b:null,/*#__PURE__*/_jsxs("div",{className:classNames("d-flex flex-column",{"p-l-2":!!b,"p-r-2":!!c}),children:[/*#__PURE__*/_jsx(Body,{type:"body-default",className:"text-secondary m-b-0",children:e}),f&&/*#__PURE__*/_jsx(Body,{type:"body-large",className:"text-primary m-b-0",children:f})]}),c?/*#__PURE__*/_jsx("div",{className:"np-list-item__action m-l-auto",children:c}):null]}))};export default ListItem;
@@ -1 +1 @@
1
- import"@testing-library/jest-dom";import ActionButton from"../actionButton/ActionButton";import{render,screen,within}from"../test-utils";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";describe("ListItem",()=>{it("shows the title and description",async()=>{render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some description",as:"li"}));const b=await a();expect(b).toHaveClass("np-list-item"),expect(within(b).getByText("Some title")).toBeInTheDocument(),expect(within(b).getByText("Some description")).toBeInTheDocument()}),it("shows an action",async()=>{render(/*#__PURE__*/_jsx(ListItem,{title:"Account number",value:"123",action:/*#__PURE__*/_jsx(ActionButton,{children:"Copy"})}));const b=await a(),c=await within(b).findByRole("button",{name:"Copy"});expect(c).toBeInTheDocument()}),it("shows media icon",async()=>{render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some desctiption",media:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:"icon"})}));const b=await a();expect(within(b).getByAltText("icon")).toBeInTheDocument()});const a=async()=>screen.findByRole("listitem")});
1
+ import _asyncToGenerator from"@babel/runtime/helpers/asyncToGenerator";import _regeneratorRuntime from"@babel/runtime/regenerator";import"@testing-library/jest-dom";import ActionButton from"../actionButton/ActionButton";import{render,screen,within}from"../test-utils";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";describe("ListItem",function(){it("shows the title and description",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some description",as:"li"})),b.next=3,a();case 3:c=b.sent,expect(c).toHaveClass("np-list-item"),expect(within(c).getByText("Some title")).toBeInTheDocument(),expect(within(c).getByText("Some description")).toBeInTheDocument();case 7:case"end":return b.stop();}},b)}))),it("shows an action",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c,d;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Account number",value:"123",action:/*#__PURE__*/_jsx(ActionButton,{children:"Copy"})})),b.next=3,a();case 3:return c=b.sent,b.next=6,within(c).findByRole("button",{name:"Copy"});case 6:d=b.sent,expect(d).toBeInTheDocument();case 8:case"end":return b.stop();}},b)}))),it("shows media icon",/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function b(){var c;return _regeneratorRuntime.wrap(function(b){for(;;)switch(b.prev=b.next){case 0:return render(/*#__PURE__*/_jsx(ListItem,{title:"Some title",value:"Some desctiption",media:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:"icon"})})),b.next=3,a();case 3:c=b.sent,expect(within(c).getByAltText("icon")).toBeInTheDocument();case 5:case"end":return b.stop();}},b)})));var a=/*#__PURE__*/function(){var a=_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime.mark(function a(){return _regeneratorRuntime.wrap(function(a){for(;;)switch(a.prev=a.next){case 0:return a.abrupt("return",screen.findByRole("listitem"));case 1:case"end":return a.stop();}},a)}));return function(){return a.apply(this,arguments)}}()});
@@ -1 +1 @@
1
- /* eslint-disable react/jsx-child-element-spacing */import{action}from"@storybook/addon-actions";import{Documents}from"@transferwise/icons";import ActionButton from"../actionButton/ActionButton";import Avatar from"../avatar";import Badge from"../badge";import Info from"../info";import Title from"../title/Title";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:ListItem,title:"Other/ListItem",tags:["autodocs"]};const Template=a=>{let{title:c="Wise",value:d="We\u2019re building the world\u2019s most international account",...b}=a;return/*#__PURE__*/_jsx(ListItem,{title:c,value:d,...b})};export const Basic=()=>/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsx(ListItem,{title:"Wise",value:"We\u2019re building the world's most international account"})});export const Variants=()=>/*#__PURE__*/_jsxs("div",{children:[/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Icon Avatar"}),/*#__PURE__*/_jsx(Template,{media:/*#__PURE__*/_jsx(Avatar,{children:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:""})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Contact Avatar"}),/*#__PURE__*/_jsx(Template,{title:"Sandra Pepper",value:"Personal account",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Avatar and Action"}),/*#__PURE__*/_jsx(Template,{title:"Account holder",value:"Sandra Pepper",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})}),action:/*#__PURE__*/_jsx(ActionButton,{children:"Share details"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text Only List"}),/*#__PURE__*/_jsxs("ul",{style:{paddingLeft:0},children:[/*#__PURE__*/_jsx(Template,{title:"Sort code",value:"23-14-71"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"12345678"})]})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Action Button"}),/*#__PURE__*/_jsx(Template,{title:"SWIFT/BIC",value:"\u2022\u2022\u2022 \u2022\u2022\u2022",action:/*#__PURE__*/_jsx(ActionButton,{onClick:()=>action("clicked"),children:"Reveal"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Other Action"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"123456789",action:/*#__PURE__*/_jsx("button",{type:"button",style:{background:"none",border:0},onClick:()=>action("clicked"),children:/*#__PURE__*/_jsx(Documents,{size:"24"})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Info Action"}),/*#__PURE__*/_jsx(Template,{title:"Routing number",value:"987654",action:/*#__PURE__*/_jsx(Info,{size:"lg","aria-label":"More information",content:"Use this routing number to receive ACH and Wire transfers."})})]})]});
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["title","value"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}/* eslint-disable react/jsx-child-element-spacing */import{action}from"@storybook/addon-actions";import{Documents}from"@transferwise/icons";import ActionButton from"../actionButton/ActionButton";import Avatar from"../avatar";import Badge from"../badge";import Info from"../info";import Title from"../title/Title";import ListItem from".";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:ListItem,title:"Other/ListItem",tags:["autodocs"]};var Template=function(a){var b=a.title,c=void 0===b?"Wise":b,d=a.value,e=void 0===d?"We\u2019re building the world\u2019s most international account":d,f=_objectWithoutProperties(a,_excluded);return/*#__PURE__*/_jsx(ListItem,_objectSpread({title:c,value:e},f))};export var Basic=function(){return/*#__PURE__*/_jsx(_Fragment,{children:/*#__PURE__*/_jsx(ListItem,{title:"Wise",value:"We\u2019re building the world's most international account"})})};export var Variants=function(){return/*#__PURE__*/_jsxs("div",{children:[/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Icon Avatar"}),/*#__PURE__*/_jsx(Template,{media:/*#__PURE__*/_jsx(Avatar,{children:/*#__PURE__*/_jsx("img",{style:{width:32,height:32},src:"https://wise.com/public-resources/assets/balances/savings-emoji/google/\u2708\uFE0F.png",alt:""})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Contact Avatar"}),/*#__PURE__*/_jsx(Template,{title:"Sandra Pepper",value:"Personal account",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"With Avatar and Action"}),/*#__PURE__*/_jsx(Template,{title:"Account holder",value:"Sandra Pepper",media:/*#__PURE__*/_jsx(Badge,{badge:/*#__PURE__*/_jsx("img",{src:"https://wise.com/public-resources/assets/brand/fast_flag_badge_personal.svg",alt:"",height:"24px",width:"24px"}),children:/*#__PURE__*/_jsx(Avatar,{type:"initials",size:"md",children:/*#__PURE__*/_jsx("span",{"aria-hidden":!0,children:"SP"})})}),action:/*#__PURE__*/_jsx(ActionButton,{children:"Share details"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text Only List"}),/*#__PURE__*/_jsxs("ul",{style:{paddingLeft:0},children:[/*#__PURE__*/_jsx(Template,{title:"Sort code",value:"23-14-71"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"12345678"})]})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Action Button"}),/*#__PURE__*/_jsx(Template,{title:"SWIFT/BIC",value:"\u2022\u2022\u2022 \u2022\u2022\u2022",action:/*#__PURE__*/_jsx(ActionButton,{onClick:function onClick(){return action("clicked")},children:"Reveal"})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Other Action"}),/*#__PURE__*/_jsx(Template,{title:"Account number",value:"123456789",action:/*#__PURE__*/_jsx("button",{type:"button",style:{background:"none",border:0},onClick:function onClick(){return action("clicked")},children:/*#__PURE__*/_jsx(Documents,{size:"24"})})})]}),/*#__PURE__*/_jsxs("div",{className:"m-t-4 m-b-2",children:[/*#__PURE__*/_jsx(Title,{type:"title-body",children:"Text With Info Action"}),/*#__PURE__*/_jsx(Template,{title:"Routing number",value:"987654",action:/*#__PURE__*/_jsx(Info,{size:"lg","aria-label":"More information",content:"Use this routing number to receive ACH and Wire transfers."})})]})]})};
@@ -1,4 +1,4 @@
1
- import classnames from"classnames";import{useEffect,useState}from"react";import{Size}from"../common";// TODO: We gracefully depracated xs, lg and xl -- remove these as part of a future breaking change to this component
1
+ import _slicedToArray from"@babel/runtime/helpers/slicedToArray";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["small","size","displayInstantly","classNames"];import classnames from"classnames";import{useEffect,useState}from"react";import{Size}from"../common";// TODO: We gracefully depracated xs, lg and xl -- remove these as part of a future breaking change to this component
2
2
  import{jsx as _jsx}from"react/jsx-runtime";/**
3
3
  * Loader component
4
4
  *
@@ -8,4 +8,4 @@ import{jsx as _jsx}from"react/jsx-runtime";/**
8
8
  * @param root0.small
9
9
  * @param root0.size
10
10
  * @param root0.classNames
11
- */const Loader=a=>{let{small:c=!1,size:d=Size.MEDIUM,displayInstantly:e=!1,classNames:f={},...b}=a;const[g,h]=useState(e);useEffect(()=>{let a,b;return e||(b=setTimeout(()=>{a||h(!0)},1e3)),()=>{a=!0,clearTimeout(b)}},[]);const i=a=>f[a]||a,j=c?Size.SMALL:d,k=getSupportedSize(j);return/*#__PURE__*/_jsx("div",{className:classnames(i("tw-loader"),i(`tw-loader--${k}`),{"tw-loader--visible":g}),"data-testid":b["data-testid"]})},getSupportedSize=a=>{switch(a){case Size.SMALL:case Size.EXTRA_SMALL:return Size.SMALL;case Size.EXTRA_LARGE:case Size.LARGE:case Size.MEDIUM:default:return Size.MEDIUM;}};export default Loader;
11
+ */var Loader=function(a){var b=a.small,c=a.size,d=void 0===c?Size.MEDIUM:c,e=a.displayInstantly,f=void 0!==e&&e,g=a.classNames,h=void 0===g?{}:g,i=_objectWithoutProperties(a,_excluded),j=useState(f),k=_slicedToArray(j,2),l=k[0],m=k[1];useEffect(function(){var a,b;return f||(b=setTimeout(function(){a||m(!0)},1e3)),function(){a=!0,clearTimeout(b)}},[]);var n=function(a){return h[a]||a},o=void 0!==b&&b?Size.SMALL:d,p=getSupportedSize(o);return/*#__PURE__*/_jsx("div",{className:classnames(n("tw-loader"),n("tw-loader--".concat(p)),{"tw-loader--visible":l}),"data-testid":i["data-testid"]})},getSupportedSize=function(a){switch(a){case Size.SMALL:case Size.EXTRA_SMALL:return Size.SMALL;case Size.EXTRA_LARGE:case Size.LARGE:case Size.MEDIUM:default:return Size.MEDIUM;}};export default Loader;
@@ -1 +1 @@
1
- import Loader from"./Loader";export default{component:Loader,title:"Loading/Loader",args:{size:"md"},argTypes:{size:{type:{name:"enum",value:["sm","md"]}}},tags:["autodocs"]};export const Basic={};
1
+ import Loader from"./Loader";export default{component:Loader,title:"Loading/Loader",args:{size:"md"},argTypes:{size:{type:{name:"enum",value:["sm","md"]}}},tags:["autodocs"]};export var Basic={};
@@ -1 +1 @@
1
- import React from"react";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{Breakpoint}from"../common";import{isServerSide}from"../common/domHelpers";import{useClientWidth}from"../common/hooks";import{LogoType}from"./logoTypes";import{jsx as _jsx}from"react/jsx-runtime";var LogoFlagInverse=function(a){return/*#__PURE__*/_jsx("svg",{...a,children:/*#__PURE__*/_jsx("path",{fill:"#9FE870",d:"M6.826 7.232 0 15.21h12.188l1.37-3.762H8.335l3.191-3.69.01-.098L9.461 4.09h9.336L11.56 24h4.953L25.25 0H2.676l4.15 7.232Z"})})};LogoFlagInverse.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"26",height:"24",fill:"none"};var LogoFlag=function(a){return/*#__PURE__*/_jsx("svg",{...a,children:/*#__PURE__*/_jsx("path",{fill:"#163300",d:"M6.826 7.232 0 15.21h12.188l1.37-3.762H8.335l3.191-3.69.01-.098L9.461 4.09h9.336L11.56 24h4.953L25.25 0H2.676l4.15 7.232Z"})})};LogoFlag.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"26",height:"24",fill:"none"};var LogoWiseInverse=function(a){return/*#__PURE__*/_jsx("svg",{...a,children:/*#__PURE__*/_jsx("path",{fill:"#9FE870",d:"M58.738.359h6.498l-3.27 23.322h-6.498L58.739.359Zm-8.193 0L46.16 13.794 44.247.359h-4.545L33.96 13.754 33.243.36h-6.299l2.193 23.322h5.223l6.458-14.75 2.272 14.75h5.143L56.725.359h-6.18Zm54.558 13.555H89.674c.08 3.03 1.894 5.023 4.565 5.023 2.014 0 3.608-1.077 4.844-3.13l5.208 2.368C102.501 21.702 98.729 24 94.08 24c-6.339 0-10.545-4.266-10.545-11.123C83.535 5.342 88.478 0 95.455 0c6.14 0 10.007 4.146 10.007 10.605 0 1.076-.12 2.152-.359 3.309Zm-5.78-4.466c0-2.71-1.516-4.425-3.947-4.425-2.512 0-4.585 1.794-5.144 4.425h9.09ZM6.632 7.387 0 15.139h11.844l1.33-3.655H8.1l3.1-3.586.01-.095-2.016-3.471h9.072l-7.032 19.35h4.812L24.538.358H2.6l4.033 7.028Zm69.168-2.364c2.292 0 4.3 1.233 6.055 3.346l.921-6.575C81.143.688 78.93 0 76 0c-5.82 0-9.09 3.409-9.09 7.734 0 3 1.675 4.834 4.426 6.02l1.315.598c2.452 1.047 3.11 1.565 3.11 2.671 0 1.146-1.106 1.874-2.79 1.874-2.782.01-5.034-1.415-6.728-3.847l-.94 6.699C67.234 23.22 69.708 24 72.97 24c5.532 0 8.93-3.19 8.93-7.615 0-3.01-1.335-4.943-4.704-6.458l-1.435-.678c-1.994-.887-2.671-1.375-2.671-2.352 0-1.056.927-1.874 2.71-1.874Z"})})};LogoWiseInverse.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"106",height:"24",fill:"none"};var LogoWise=function(a){return/*#__PURE__*/_jsx("svg",{...a,children:/*#__PURE__*/_jsx("path",{fill:"#163300",d:"M58.738.359h6.498l-3.27 23.322h-6.498L58.739.359Zm-8.193 0L46.16 13.794 44.247.359h-4.545L33.96 13.754 33.243.36h-6.299l2.193 23.322h5.223l6.458-14.75 2.272 14.75h5.143L56.725.359h-6.18Zm54.558 13.555H89.674c.08 3.03 1.894 5.023 4.565 5.023 2.014 0 3.608-1.077 4.844-3.13l5.208 2.368C102.501 21.702 98.729 24 94.08 24c-6.339 0-10.545-4.266-10.545-11.123C83.535 5.342 88.478 0 95.455 0c6.14 0 10.007 4.146 10.007 10.605 0 1.076-.12 2.152-.359 3.309Zm-5.78-4.466c0-2.71-1.516-4.425-3.947-4.425-2.512 0-4.585 1.794-5.144 4.425h9.09ZM6.632 7.387 0 15.139h11.844l1.33-3.655H8.1l3.1-3.586.01-.095-2.016-3.471h9.072l-7.032 19.35h4.812L24.538.358H2.6l4.033 7.028Zm69.168-2.364c2.292 0 4.3 1.233 6.055 3.346l.921-6.575C81.143.688 78.93 0 76 0c-5.82 0-9.09 3.409-9.09 7.734 0 3 1.675 4.834 4.426 6.02l1.315.598c2.452 1.047 3.11 1.565 3.11 2.671 0 1.146-1.106 1.874-2.79 1.874-2.782.01-5.034-1.415-6.728-3.847l-.94 6.699C67.234 23.22 69.708 24 72.97 24c5.532 0 8.93-3.19 8.93-7.615 0-3.01-1.335-4.943-4.704-6.458l-1.435-.678c-1.994-.887-2.671-1.375-2.671-2.352 0-1.056.927-1.874 2.71-1.874Z"})})};LogoWise.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"106",height:"24",fill:"none"};const baseUrl="https://wise.com/public-resources/assets/logos/wise/",logoPaths={WISE:"brand_logo.svg",WISE_BUSINESS:"brand_logo_business.svg",WISE_INVERSE:"brand_logo_inverse.svg",WISE_BUSINESS_INVERSE:"brand_logo_business_inverse.svg",WISE_FLAG:"brand_flag.svg"},svgPaths={WISE:LogoWise,WISE_BUSINESS:LogoWise,WISE_INVERSE:LogoWiseInverse,WISE_BUSINESS_INVERSE:LogoWiseInverse,WISE_FLAG:LogoFlag,WISE_FLAG_INVERSE:LogoFlagInverse},Logo=a=>{let{className:b,inverse:c,type:d}=a;const{isModern:e}=useTheme(),[f]=useClientWidth({ref:isServerSide()?void 0:window}),g=f<Breakpoint.SMALL,h=g?logoPaths.WISE_FLAG:logoPaths[`${d}${c?"_INVERSE":""}`],i=g?svgPaths[`WISE_FLAG${c?"_INVERSE":""}`]:svgPaths[`${d}${c?"_INVERSE":""}`];return e?/*#__PURE__*/_jsx(i,{className:"np-logo-svg"}):/*#__PURE__*/_jsx("img",{className:classNames("np-logo",b),alt:d===LogoType.WISE?"Wise":"Wise business",src:`${baseUrl}${h}`})};Logo.propTypes={/** Extra classes applied to Logo */className:PropTypes.string,/** If true, will use dark colours for dark on light theme */inverse:PropTypes.bool,/** What type of logo to display */type:PropTypes.oneOf(["WISE","WISE_BUSINESS"])},Logo.defaultProps={className:void 0,inverse:!1,type:LogoType.WISE};export default Logo;
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import React from"react";import{useTheme}from"@wise/components-theming";import classNames from"classnames";import PropTypes from"prop-types";import{Breakpoint}from"../common";import{isServerSide}from"../common/domHelpers";import{useClientWidth}from"../common/hooks";import{LogoType}from"./logoTypes";import{jsx as _jsx}from"react/jsx-runtime";var LogoFlagInverse=function(a){return/*#__PURE__*/_jsx("svg",_objectSpread(_objectSpread({},a),{},{children:/*#__PURE__*/_jsx("path",{fill:"#9FE870",d:"M6.826 7.232 0 15.21h12.188l1.37-3.762H8.335l3.191-3.69.01-.098L9.461 4.09h9.336L11.56 24h4.953L25.25 0H2.676l4.15 7.232Z"})}))};LogoFlagInverse.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"26",height:"24",fill:"none"};var LogoFlag=function(a){return/*#__PURE__*/_jsx("svg",_objectSpread(_objectSpread({},a),{},{children:/*#__PURE__*/_jsx("path",{fill:"#163300",d:"M6.826 7.232 0 15.21h12.188l1.37-3.762H8.335l3.191-3.69.01-.098L9.461 4.09h9.336L11.56 24h4.953L25.25 0H2.676l4.15 7.232Z"})}))};LogoFlag.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"26",height:"24",fill:"none"};var LogoWiseInverse=function(a){return/*#__PURE__*/_jsx("svg",_objectSpread(_objectSpread({},a),{},{children:/*#__PURE__*/_jsx("path",{fill:"#9FE870",d:"M58.738.359h6.498l-3.27 23.322h-6.498L58.739.359Zm-8.193 0L46.16 13.794 44.247.359h-4.545L33.96 13.754 33.243.36h-6.299l2.193 23.322h5.223l6.458-14.75 2.272 14.75h5.143L56.725.359h-6.18Zm54.558 13.555H89.674c.08 3.03 1.894 5.023 4.565 5.023 2.014 0 3.608-1.077 4.844-3.13l5.208 2.368C102.501 21.702 98.729 24 94.08 24c-6.339 0-10.545-4.266-10.545-11.123C83.535 5.342 88.478 0 95.455 0c6.14 0 10.007 4.146 10.007 10.605 0 1.076-.12 2.152-.359 3.309Zm-5.78-4.466c0-2.71-1.516-4.425-3.947-4.425-2.512 0-4.585 1.794-5.144 4.425h9.09ZM6.632 7.387 0 15.139h11.844l1.33-3.655H8.1l3.1-3.586.01-.095-2.016-3.471h9.072l-7.032 19.35h4.812L24.538.358H2.6l4.033 7.028Zm69.168-2.364c2.292 0 4.3 1.233 6.055 3.346l.921-6.575C81.143.688 78.93 0 76 0c-5.82 0-9.09 3.409-9.09 7.734 0 3 1.675 4.834 4.426 6.02l1.315.598c2.452 1.047 3.11 1.565 3.11 2.671 0 1.146-1.106 1.874-2.79 1.874-2.782.01-5.034-1.415-6.728-3.847l-.94 6.699C67.234 23.22 69.708 24 72.97 24c5.532 0 8.93-3.19 8.93-7.615 0-3.01-1.335-4.943-4.704-6.458l-1.435-.678c-1.994-.887-2.671-1.375-2.671-2.352 0-1.056.927-1.874 2.71-1.874Z"})}))};LogoWiseInverse.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"106",height:"24",fill:"none"};var LogoWise=function(a){return/*#__PURE__*/_jsx("svg",_objectSpread(_objectSpread({},a),{},{children:/*#__PURE__*/_jsx("path",{fill:"#163300",d:"M58.738.359h6.498l-3.27 23.322h-6.498L58.739.359Zm-8.193 0L46.16 13.794 44.247.359h-4.545L33.96 13.754 33.243.36h-6.299l2.193 23.322h5.223l6.458-14.75 2.272 14.75h5.143L56.725.359h-6.18Zm54.558 13.555H89.674c.08 3.03 1.894 5.023 4.565 5.023 2.014 0 3.608-1.077 4.844-3.13l5.208 2.368C102.501 21.702 98.729 24 94.08 24c-6.339 0-10.545-4.266-10.545-11.123C83.535 5.342 88.478 0 95.455 0c6.14 0 10.007 4.146 10.007 10.605 0 1.076-.12 2.152-.359 3.309Zm-5.78-4.466c0-2.71-1.516-4.425-3.947-4.425-2.512 0-4.585 1.794-5.144 4.425h9.09ZM6.632 7.387 0 15.139h11.844l1.33-3.655H8.1l3.1-3.586.01-.095-2.016-3.471h9.072l-7.032 19.35h4.812L24.538.358H2.6l4.033 7.028Zm69.168-2.364c2.292 0 4.3 1.233 6.055 3.346l.921-6.575C81.143.688 78.93 0 76 0c-5.82 0-9.09 3.409-9.09 7.734 0 3 1.675 4.834 4.426 6.02l1.315.598c2.452 1.047 3.11 1.565 3.11 2.671 0 1.146-1.106 1.874-2.79 1.874-2.782.01-5.034-1.415-6.728-3.847l-.94 6.699C67.234 23.22 69.708 24 72.97 24c5.532 0 8.93-3.19 8.93-7.615 0-3.01-1.335-4.943-4.704-6.458l-1.435-.678c-1.994-.887-2.671-1.375-2.671-2.352 0-1.056.927-1.874 2.71-1.874Z"})}))};LogoWise.defaultProps={xmlns:"http://www.w3.org/2000/svg",width:"106",height:"24",fill:"none"};var baseUrl="https://wise.com/public-resources/assets/logos/wise/",logoPaths={WISE:"brand_logo.svg",WISE_BUSINESS:"brand_logo_business.svg",WISE_INVERSE:"brand_logo_inverse.svg",WISE_BUSINESS_INVERSE:"brand_logo_business_inverse.svg",WISE_FLAG:"brand_flag.svg"},svgPaths={WISE:LogoWise,WISE_BUSINESS:LogoWise,WISE_INVERSE:LogoWiseInverse,WISE_BUSINESS_INVERSE:LogoWiseInverse,WISE_FLAG:LogoFlag,WISE_FLAG_INVERSE:LogoFlagInverse},Logo=function(a){var b=a.className,c=a.inverse,d=a.type,e=useTheme(),f=e.isModern,g=useClientWidth({ref:isServerSide()?void 0:window}),h=_slicedToArray(g,1),i=h[0],j=i<Breakpoint.SMALL,k=j?logoPaths.WISE_FLAG:logoPaths["".concat(d).concat(c?"_INVERSE":"")],l=j?svgPaths["WISE_FLAG".concat(c?"_INVERSE":"")]:svgPaths["".concat(d).concat(c?"_INVERSE":"")];return f?/*#__PURE__*/_jsx(l,{className:"np-logo-svg"}):/*#__PURE__*/_jsx("img",{className:classNames("np-logo",b),alt:d===LogoType.WISE?"Wise":"Wise business",src:"".concat(baseUrl).concat(k)})};Logo.propTypes={/** Extra classes applied to Logo */className:PropTypes.string,/** If true, will use dark colours for dark on light theme */inverse:PropTypes.bool,/** What type of logo to display */type:PropTypes.oneOf(["WISE","WISE_BUSINESS"])},Logo.defaultProps={className:void 0,inverse:!1,type:LogoType.WISE};export default Logo;
@@ -1 +1 @@
1
- import Logo,{LogoType}from".";import{jsx as _jsx}from"react/jsx-runtime";export default{component:Logo,title:"Content/Logo",render:a=>{const b=a.type,c=a.inverse;return/*#__PURE__*/_jsx("div",{className:`${c?"bg--dark":""} p-a-3`,children:/*#__PURE__*/_jsx(Logo,{type:b,inverse:c})})},tags:["autodocs"]};export const Basic={args:{type:LogoType.WISE,inverse:!1}};
1
+ import Logo,{LogoType}from".";import{jsx as _jsx}from"react/jsx-runtime";export default{component:Logo,title:"Content/Logo",render:function render(a){var b=a.type,c=a.inverse;return/*#__PURE__*/_jsx("div",{className:"".concat(c?"bg--dark":""," p-a-3"),children:/*#__PURE__*/_jsx(Logo,{type:b,inverse:c})})},tags:["autodocs"]};export var Basic={args:{type:LogoType.WISE,inverse:!1}};
@@ -1,2 +1,2 @@
1
1
  // TODO: consider to move this enum into component file once we migrate it on TypeScript or replace with some common enum
2
- export let LogoType=/*#__PURE__*/function(a){return a.WISE="WISE",a.WISE_BUSINESS="WISE_BUSINESS",a}({});
2
+ export var LogoType=/*#__PURE__*/function(a){return a.WISE="WISE",a.WISE_BUSINESS="WISE_BUSINESS",a}({});
@@ -1 +1 @@
1
- import commonmark from"commonmark";import difference from"lodash.difference";import PropTypes from"prop-types";import{MarkdownNodeType}from"../common";import{logActionRequired}from"../utilities";import{jsx as _jsx}from"react/jsx-runtime";const reader=new commonmark.Parser,writer=new commonmark.HtmlRenderer({safe:!0}),NODE_TYPE_LIST=Object.values(MarkdownNodeType),Markdown=a=>{let{as:b,children:c,className:d,allowList:e,blockList:f,config:g}=a;if(!c)return null;e?.length&&f?.length&&logActionRequired("Markdown supports only one of `allowList` or `blockList` to be used at a time. `blockList` will be ignored.");const h=a=>{const b=reader.parse(a);if(e||f){const a=e?difference(NODE_TYPE_LIST,e):f;return stripNodes({parsed:b,blockList:a})}return b};return/*#__PURE__*/_jsx(b,{className:d,dangerouslySetInnerHTML:{__html:(()=>{const{link:{target:a}}=g,b=h(c);return writer.render(b).replace(/<a href="/g,`<a target="${a}" href="`)})()}})};function stripNodes(a){let{blockList:b,parsed:c}=a;if(!c)return c;const d=c.walker();for(let c=d.next();c;){const{node:a}=c;if(b.includes(a.type)&&!c.entering){for(;a.firstChild;)a.insertBefore(a.firstChild);a.unlink()}c=d.next()}return d.root}Markdown.propTypes={children:PropTypes.string.isRequired,as:PropTypes.string,className:PropTypes.string,allowList:PropTypes.arrayOf(PropTypes.oneOf(["block_quote","code_block","code","emph","heading","html_block","html_inline","image","item","linebreak","link","list","paragraph","softbreak","strong","thematic_break"])),blockList:PropTypes.arrayOf(PropTypes.oneOf(["block_quote","code_block","code","emph","heading","html_block","html_inline","image","item","linebreak","link","list","paragraph","softbreak","strong","thematic_break"])),config:PropTypes.shape({link:PropTypes.shape({target:PropTypes.oneOf(["_blank","_self"])})})},Markdown.defaultProps={as:"div",className:void 0,allowList:null,blockList:null,config:{link:{target:"_self"}}};export default Markdown;
1
+ import commonmark from"commonmark";import difference from"lodash.difference";import PropTypes from"prop-types";import{MarkdownNodeType}from"../common";import{logActionRequired}from"../utilities";import{jsx as _jsx}from"react/jsx-runtime";var reader=new commonmark.Parser,writer=new commonmark.HtmlRenderer({safe:!0}),NODE_TYPE_LIST=Object.values(MarkdownNodeType),Markdown=function(a){var b=a.as,c=a.children,d=a.className,e=a.allowList,f=a.blockList,g=a.config;if(!c)return null;null!==e&&void 0!==e&&e.length&&null!==f&&void 0!==f&&f.length&&logActionRequired("Markdown supports only one of `allowList` or `blockList` to be used at a time. `blockList` will be ignored.");var h=function(a){var b=reader.parse(a);if(e||f){var c=e?difference(NODE_TYPE_LIST,e):f;return stripNodes({parsed:b,blockList:c})}return b};return/*#__PURE__*/_jsx(b,{className:d,dangerouslySetInnerHTML:{__html:function createMarkup(){var a=g.link.target,b=h(c);return writer.render(b).replace(/<a href="/g,"<a target=\"".concat(a,"\" href=\""))}()}})};function stripNodes(a){var b=a.blockList,c=a.parsed;if(!c)return c;for(var d=c.walker(),e=d.next();e;){var f=e,g=f.node;if(b.includes(g.type)&&!e.entering){for(;g.firstChild;)g.insertBefore(g.firstChild);g.unlink()}e=d.next()}return d.root}Markdown.propTypes={children:PropTypes.string.isRequired,as:PropTypes.string,className:PropTypes.string,allowList:PropTypes.arrayOf(PropTypes.oneOf(["block_quote","code_block","code","emph","heading","html_block","html_inline","image","item","linebreak","link","list","paragraph","softbreak","strong","thematic_break"])),blockList:PropTypes.arrayOf(PropTypes.oneOf(["block_quote","code_block","code","emph","heading","html_block","html_inline","image","item","linebreak","link","list","paragraph","softbreak","strong","thematic_break"])),config:PropTypes.shape({link:PropTypes.shape({target:PropTypes.oneOf(["_blank","_self"])})})},Markdown.defaultProps={as:"div",className:void 0,allowList:null,blockList:null,config:{link:{target:"_self"}}};export default Markdown;
@@ -0,0 +1 @@
1
+ import Markdown from"./Markdown";export default{component:Markdown,title:"Typography/Markdown",tags:["autodocs"]};export var Basic={args:{children:"# Heading\n 1. item one\n 2. item two\n - sublist\n - sublist"}};
@@ -1 +1 @@
1
- import classNames from"classnames";import{useRef}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{Size,Position,Scroll,Typography}from"../common";import{CloseButton}from"../common/closeButton";import{useLayout}from"../common/hooks";import Dimmer from"../dimmer";import Drawer from"../drawer";import Title from"../title/Title";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";const TRANSITION_DURATION_IN_MILLISECONDS=150,Modal=a=>{let{title:g=null,body:b,footer:h=null,onClose:c,className:d,open:e,size:i=Size.MEDIUM,scroll:j=Scroll.VIEWPORT,position:k=Position.CENTER,...f}=a;const l=a=>d?.split(" ").includes(a),{isMobile:m}=useLayout(),n=l("compact"),o=l("no-divider"),p=useRef(null);return m?/*#__PURE__*/_jsx(Drawer,{open:e,headerTitle:g,footerContent:h,position:Position.BOTTOM,onClose:c,children:b}):/*#__PURE__*/_jsx(Dimmer,{open:e,scrollable:j===Scroll.VIEWPORT,contentPosition:k,onClose:c,children:/*#__PURE__*/_jsx(CSSTransition,{nodeRef:p,appear:!0,in:e,classNames:{enterDone:"in"},timeout:TRANSITION_DURATION_IN_MILLISECONDS,unmountOnExit:!0,children:/*#__PURE__*/_jsx("div",{ref:p,className:classNames("tw-modal","d-flex","fade","outline-none",j===Scroll.CONTENT&&"tw-modal--scrollable",d),...f,children:/*#__PURE__*/_jsx("div",{className:classNames("tw-modal-dialog","d-flex",{[`tw-modal-${i}`]:i}),"aria-modal":!0,role:"dialog",children:/*#__PURE__*/_jsxs("div",{className:classNames("tw-modal-content","d-flex","flex-column","justify-content-between",{"tw-modal-compact":n,"tw-modal-no-title":!g}),children:[/*#__PURE__*/_jsxs("div",{className:classNames("tw-modal-header","d-flex","align-items-center","justify-content-between","flex-wrap",{"modal--withoutborder":!g||o}),children:[/*#__PURE__*/_jsx(Title,{type:Typography.TITLE_BODY,className:"tw-modal-title",children:g}),/*#__PURE__*/_jsx(CloseButton,{onClick:c})]}),/*#__PURE__*/_jsx("div",{className:classNames("tw-modal-body",{"tw-modal-body--scrollable":j===Scroll.CONTENT}),children:b}),h&&/*#__PURE__*/_jsx("div",{className:classNames("tw-modal-footer","d-flex","align-items-center","flex-wrap",{"modal--withoutborder":o}),children:h})]})})})})})};export default Modal;
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _objectWithoutProperties from"@babel/runtime/helpers/objectWithoutProperties";var _excluded=["title","body","footer","onClose","className","open","size","scroll","position"];function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import classNames from"classnames";import{useRef}from"react";import CSSTransition from"react-transition-group/CSSTransition";import{Size,Position,Scroll,Typography}from"../common";import{CloseButton}from"../common/closeButton";import{useLayout}from"../common/hooks";import Dimmer from"../dimmer";import Drawer from"../drawer";import Title from"../title/Title";import{jsx as _jsx}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";var TRANSITION_DURATION_IN_MILLISECONDS=150,Modal=function(a){var b=a.title,c=void 0===b?null:b,d=a.body,e=a.footer,f=void 0===e?null:e,g=a.onClose,h=a.className,i=a.open,j=a.size,k=void 0===j?Size.MEDIUM:j,l=a.scroll,m=void 0===l?Scroll.VIEWPORT:l,n=a.position,o=void 0===n?Position.CENTER:n,p=_objectWithoutProperties(a,_excluded),q=function(a){return null===h||void 0===h?void 0:h.split(" ").includes(a)},r=useLayout(),s=r.isMobile,t=q("compact"),u=q("no-divider"),v=useRef(null);return s?/*#__PURE__*/_jsx(Drawer,{open:i,headerTitle:c,footerContent:f,position:Position.BOTTOM,onClose:g,children:d}):/*#__PURE__*/_jsx(Dimmer,{open:i,scrollable:m===Scroll.VIEWPORT,contentPosition:o,onClose:g,children:/*#__PURE__*/_jsx(CSSTransition,{nodeRef:v,appear:!0,in:i,classNames:{enterDone:"in"},timeout:TRANSITION_DURATION_IN_MILLISECONDS,unmountOnExit:!0,children:/*#__PURE__*/_jsx("div",_objectSpread(_objectSpread({ref:v,className:classNames("tw-modal","d-flex","fade","outline-none",m===Scroll.CONTENT&&"tw-modal--scrollable",h)},p),{},{children:/*#__PURE__*/_jsx("div",{className:classNames("tw-modal-dialog","d-flex",_defineProperty({},"tw-modal-".concat(k),k)),"aria-modal":!0,role:"dialog",children:/*#__PURE__*/_jsxs("div",{className:classNames("tw-modal-content","d-flex","flex-column","justify-content-between",{"tw-modal-compact":t,"tw-modal-no-title":!c}),children:[/*#__PURE__*/_jsxs("div",{className:classNames("tw-modal-header","d-flex","align-items-center","justify-content-between","flex-wrap",{"modal--withoutborder":!c||u}),children:[/*#__PURE__*/_jsx(Title,{type:Typography.TITLE_BODY,className:"tw-modal-title",children:c}),/*#__PURE__*/_jsx(CloseButton,{onClick:g})]}),/*#__PURE__*/_jsx("div",{className:classNames("tw-modal-body",{"tw-modal-body--scrollable":m===Scroll.CONTENT}),children:d}),f&&/*#__PURE__*/_jsx("div",{className:classNames("tw-modal-footer","d-flex","align-items-center","flex-wrap",{"modal--withoutborder":u}),children:f})]})})}))})})};export default Modal;
@@ -1,2 +1,2 @@
1
- import{action}from"@storybook/addon-actions";import{useState}from"react";import{Button,Modal}from"..";import{Scroll}from"../common";import{lorem10,lorem1000,storyConfig}from"../test-utils";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:Modal,title:"Dialogs/Modal",args:{size:"md",position:"center",open:!0},parameters:{chromatic:{delay:2e3}}};export const Basic={args:{title:"Title",body:lorem10,scroll:Scroll.VIEWPORT,footer:/*#__PURE__*/_jsx(Button,{block:!0,children:"Action"})},render:a=>{// eslint-disable-next-line react-hooks/rules-of-hooks
2
- const[b,c]=useState(a.open);return/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Button,{onClick:()=>c(!0),children:"Open Modal"}),/*#__PURE__*/_jsx(Modal,{...a,open:b,onClose:()=>{c(!1),action("Modal closed")()}})]})}};export const BasicMobile=storyConfig(Basic,{variants:["mobile"]});export const ContentScroll={args:{title:lorem10,body:lorem1000,scroll:Scroll.CONTENT}};export const ContentScrollMobile=storyConfig(ContentScroll,{variants:["mobile"]});export const ViewportScroll={args:{title:lorem10,body:lorem1000,scroll:Scroll.VIEWPORT}};export const ViewportScrollMobile=storyConfig(ViewportScroll,{variants:["mobile"]});export const WithoutTitle={args:{body:lorem1000,scroll:Scroll.CONTENT}};export const WithoutTitleMobile=storyConfig(WithoutTitle,{variants:["mobile"]});
1
+ import _defineProperty from"@babel/runtime/helpers/defineProperty";import _slicedToArray from"@babel/runtime/helpers/slicedToArray";function ownKeys(a,b){var c=Object.keys(a);if(Object.getOwnPropertySymbols){var d=Object.getOwnPropertySymbols(a);b&&(d=d.filter(function(b){return Object.getOwnPropertyDescriptor(a,b).enumerable})),c.push.apply(c,d)}return c}function _objectSpread(a){for(var b,c=1;c<arguments.length;c++)b=null==arguments[c]?{}:arguments[c],c%2?ownKeys(Object(b),!0).forEach(function(c){_defineProperty(a,c,b[c])}):Object.getOwnPropertyDescriptors?Object.defineProperties(a,Object.getOwnPropertyDescriptors(b)):ownKeys(Object(b)).forEach(function(c){Object.defineProperty(a,c,Object.getOwnPropertyDescriptor(b,c))});return a}import{action}from"@storybook/addon-actions";import{useState}from"react";import{Button,Modal}from"..";import{Scroll}from"../common";import{lorem10,lorem1000,storyConfig}from"../test-utils";import{jsx as _jsx}from"react/jsx-runtime";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsxs as _jsxs}from"react/jsx-runtime";export default{component:Modal,title:"Dialogs/Modal",args:{size:"md",position:"center",open:!0},parameters:{chromatic:{delay:2e3}}};export var Basic={args:{title:"Title",body:lorem10,scroll:Scroll.VIEWPORT,footer:/*#__PURE__*/_jsx(Button,{block:!0,children:"Action"})},render:function render(a){// eslint-disable-next-line react-hooks/rules-of-hooks
2
+ var b=useState(a.open),c=_slicedToArray(b,2),d=c[0],e=c[1];return/*#__PURE__*/_jsxs(_Fragment,{children:[/*#__PURE__*/_jsx(Button,{onClick:function onClick(){return e(!0)},children:"Open Modal"}),/*#__PURE__*/_jsx(Modal,_objectSpread(_objectSpread({},a),{},{open:d,onClose:function onClose(){e(!1),action("Modal closed")()}}))]})}};export var BasicMobile=storyConfig(Basic,{variants:["mobile"]});export var ContentScroll={args:{title:lorem10,body:lorem1000,scroll:Scroll.CONTENT}};export var ContentScrollMobile=storyConfig(ContentScroll,{variants:["mobile"]});export var ViewportScroll={args:{title:lorem10,body:lorem1000,scroll:Scroll.VIEWPORT}};export var ViewportScrollMobile=storyConfig(ViewportScroll,{variants:["mobile"]});export var WithoutTitle={args:{body:lorem1000,scroll:Scroll.CONTENT}};export var WithoutTitleMobile=storyConfig(WithoutTitle,{variants:["mobile"]});
@@ -1 +1 @@
1
- import{formatMoney}from"@transferwise/formatting";import PropTypes from"prop-types";import{useIntl}from"react-intl";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsx as _jsx}from"react/jsx-runtime";const Money=a=>{let{amount:b,currency:c}=a;const{locale:d}=useIntl();return/*#__PURE__*/_jsx(_Fragment,{children:formatMoney(b,c,d)})};Money.propTypes={amount:PropTypes.number.isRequired,currency:PropTypes.string.isRequired};export default Money;
1
+ import{formatMoney}from"@transferwise/formatting";import PropTypes from"prop-types";import{useIntl}from"react-intl";import{Fragment as _Fragment}from"react/jsx-runtime";import{jsx as _jsx}from"react/jsx-runtime";var Money=function(a){var b=a.amount,c=a.currency,d=useIntl(),e=d.locale;return/*#__PURE__*/_jsx(_Fragment,{children:formatMoney(b,c,e)})};Money.propTypes={amount:PropTypes.number.isRequired,currency:PropTypes.string.isRequired};export default Money;
@@ -1 +1 @@
1
- import Money from"./Money";export default{component:Money,title:"Typography/Money"};export const Basic={args:{amount:1234.5678,currency:"GBP"}};
1
+ import Money from"./Money";export default{component:Money,title:"Typography/Money"};export var Basic={args:{amount:1234.5678,currency:"GBP"}};