@transferwise/components 0.0.0-experimental-fa9fbe9 → 0.0.0-experimental-00012dd

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 (500) hide show
  1. package/build/accordion/AccordionItem/AccordionItem.js +1 -1
  2. package/build/accordion/AccordionItem/AccordionItem.mjs +1 -1
  3. package/build/actionButton/ActionButton.js +1 -1
  4. package/build/actionButton/ActionButton.mjs +1 -1
  5. package/build/actionOption/ActionOption.js +1 -1
  6. package/build/actionOption/ActionOption.mjs +1 -1
  7. package/build/alert/Alert.js +1 -1
  8. package/build/alert/Alert.mjs +1 -1
  9. package/build/alert/inlineMarkdown/InlineMarkdown.js +1 -1
  10. package/build/alert/inlineMarkdown/InlineMarkdown.mjs +1 -1
  11. package/build/avatar/Avatar.js +1 -1
  12. package/build/avatar/Avatar.mjs +1 -1
  13. package/build/avatarLayout/AvatarLayout.js +1 -1
  14. package/build/avatarLayout/AvatarLayout.mjs +1 -1
  15. package/build/avatarView/AvatarView.js +1 -1
  16. package/build/avatarView/AvatarView.mjs +1 -1
  17. package/build/avatarWrapper/AvatarWrapper.js +1 -1
  18. package/build/avatarWrapper/AvatarWrapper.mjs +1 -1
  19. package/build/badge/Badge.js +1 -1
  20. package/build/badge/Badge.mjs +1 -1
  21. package/build/button/Button.js +1 -1
  22. package/build/button/Button.mjs +1 -1
  23. package/build/button/LegacyButton.js +1 -1
  24. package/build/button/LegacyButton.mjs +1 -1
  25. package/build/button/classMap.js +1 -1
  26. package/build/button/classMap.mjs +1 -1
  27. package/build/button/legacyUtils/legacyUtils.js +1 -1
  28. package/build/button/legacyUtils/legacyUtils.mjs +1 -1
  29. package/build/card/Card.js +1 -1
  30. package/build/card/Card.mjs +1 -1
  31. package/build/checkbox/Checkbox.js +1 -1
  32. package/build/checkbox/Checkbox.mjs +1 -1
  33. package/build/chevron/Chevron.js +1 -1
  34. package/build/chevron/Chevron.mjs +1 -1
  35. package/build/chips/Chip.js +1 -1
  36. package/build/chips/Chip.mjs +1 -1
  37. package/build/circularButton/CircularButton.js +2 -2
  38. package/build/circularButton/CircularButton.js.map +1 -1
  39. package/build/circularButton/CircularButton.mjs +2 -2
  40. package/build/circularButton/CircularButton.mjs.map +1 -1
  41. package/build/common/bottomSheet/BottomSheet.js +2 -2
  42. package/build/common/bottomSheet/BottomSheet.js.map +1 -1
  43. package/build/common/bottomSheet/BottomSheet.mjs +2 -2
  44. package/build/common/bottomSheet/BottomSheet.mjs.map +1 -1
  45. package/build/common/circle/Circle.js +2 -2
  46. package/build/common/circle/Circle.js.map +1 -1
  47. package/build/common/circle/Circle.mjs +2 -2
  48. package/build/common/circle/Circle.mjs.map +1 -1
  49. package/build/common/hooks/useLayout/useLayout.js +6 -6
  50. package/build/common/hooks/useLayout/useLayout.js.map +1 -1
  51. package/build/common/hooks/useLayout/useLayout.mjs +1 -1
  52. package/build/common/hooks/useLayout/useLayout.mjs.map +1 -1
  53. package/build/common/hooks/useResizeObserver.js +3 -3
  54. package/build/common/hooks/useResizeObserver.js.map +1 -1
  55. package/build/common/hooks/useResizeObserver.mjs +3 -3
  56. package/build/common/hooks/useResizeObserver.mjs.map +1 -1
  57. package/build/common/hooks/useScreenSize.js.map +1 -1
  58. package/build/common/hooks/useScreenSize.mjs.map +1 -1
  59. package/build/common/panel/Panel.js +1 -1
  60. package/build/common/panel/Panel.mjs +1 -1
  61. package/build/common/responsivePanel/ResponsivePanel.js +1 -1
  62. package/build/common/responsivePanel/ResponsivePanel.mjs +1 -1
  63. package/build/criticalBanner/CriticalCommsBanner.js +1 -4
  64. package/build/criticalBanner/CriticalCommsBanner.js.map +1 -1
  65. package/build/criticalBanner/CriticalCommsBanner.mjs +1 -4
  66. package/build/criticalBanner/CriticalCommsBanner.mjs.map +1 -1
  67. package/build/dateInput/DateInput.js +1 -1
  68. package/build/dateInput/DateInput.mjs +1 -1
  69. package/build/dateLookup/DateLookup.js +2 -2
  70. package/build/dateLookup/DateLookup.js.map +1 -1
  71. package/build/dateLookup/DateLookup.mjs +1 -1
  72. package/build/dateLookup/DateLookup.mjs.map +1 -1
  73. package/build/dateLookup/dateHeader/DateHeader.js +1 -1
  74. package/build/dateLookup/dateHeader/DateHeader.mjs +1 -1
  75. package/build/dateLookup/dateTrigger/DateTrigger.js +1 -1
  76. package/build/dateLookup/dateTrigger/DateTrigger.mjs +1 -1
  77. package/build/decision/Decision.js +3 -3
  78. package/build/decision/Decision.js.map +1 -1
  79. package/build/decision/Decision.mjs +1 -1
  80. package/build/decision/Decision.mjs.map +1 -1
  81. package/build/definitionList/DefinitionList.js +1 -1
  82. package/build/definitionList/DefinitionList.mjs +1 -1
  83. package/build/dimmer/Dimmer.js +1 -1
  84. package/build/dimmer/Dimmer.mjs +1 -1
  85. package/build/display/Display.js +1 -1
  86. package/build/display/Display.mjs +1 -1
  87. package/build/drawer/Drawer.js +1 -1
  88. package/build/drawer/Drawer.mjs +1 -1
  89. package/build/expressiveMoneyInput/currencySelector/CurrencySelector.js +1 -1
  90. package/build/expressiveMoneyInput/currencySelector/CurrencySelector.mjs +1 -1
  91. package/build/field/Field.js +3 -4
  92. package/build/field/Field.js.map +1 -1
  93. package/build/field/Field.mjs +3 -4
  94. package/build/field/Field.mjs.map +1 -1
  95. package/build/flowNavigation/FlowNavigation.js +3 -3
  96. package/build/flowNavigation/FlowNavigation.js.map +1 -1
  97. package/build/flowNavigation/FlowNavigation.mjs +1 -1
  98. package/build/flowNavigation/FlowNavigation.mjs.map +1 -1
  99. package/build/header/Header.js +1 -1
  100. package/build/header/Header.mjs +1 -1
  101. package/build/i18n/en.json +0 -2
  102. package/build/i18n/en.json.js +0 -2
  103. package/build/i18n/en.json.js.map +1 -1
  104. package/build/i18n/en.json.mjs +0 -2
  105. package/build/i18n/en.json.mjs.map +1 -1
  106. package/build/image/Image.js +1 -1
  107. package/build/image/Image.mjs +1 -1
  108. package/build/index.js +2 -4
  109. package/build/index.js.map +1 -1
  110. package/build/index.mjs +1 -2
  111. package/build/index.mjs.map +1 -1
  112. package/build/info/Info.js +1 -1
  113. package/build/info/Info.mjs +1 -1
  114. package/build/inlineAlert/InlineAlert.js +1 -1
  115. package/build/inlineAlert/InlineAlert.mjs +1 -1
  116. package/build/inputs/SearchInput.js +1 -1
  117. package/build/inputs/SearchInput.mjs +1 -1
  118. package/build/inputs/SelectInput/SelectInput.js +2 -2
  119. package/build/inputs/SelectInput/SelectInput.js.map +1 -1
  120. package/build/inputs/SelectInput/SelectInput.mjs +1 -1
  121. package/build/inputs/SelectInput/SelectInput.mjs.map +1 -1
  122. package/build/instructionsList/InstructionsList.js +1 -1
  123. package/build/instructionsList/InstructionsList.mjs +1 -1
  124. package/build/link/Link.js +1 -1
  125. package/build/link/Link.mjs +1 -1
  126. package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.js +1 -1
  127. package/build/listItem/AdditionalInfo/ListItemAdditionalInfo.mjs +1 -1
  128. package/build/listItem/ListItem.js +1 -1
  129. package/build/listItem/ListItem.mjs +1 -1
  130. package/build/listItem/Prompt/ListItemPrompt.js +3 -4
  131. package/build/listItem/Prompt/ListItemPrompt.js.map +1 -1
  132. package/build/listItem/Prompt/ListItemPrompt.mjs +3 -4
  133. package/build/listItem/Prompt/ListItemPrompt.mjs.map +1 -1
  134. package/build/loader/Loader.js +1 -1
  135. package/build/loader/Loader.mjs +1 -1
  136. package/build/logo/Logo.js +1 -1
  137. package/build/logo/Logo.js.map +1 -1
  138. package/build/logo/Logo.mjs +1 -1
  139. package/build/logo/Logo.mjs.map +1 -1
  140. package/build/main.css +330 -495
  141. package/build/markdown/Markdown.js +1 -1
  142. package/build/markdown/Markdown.mjs +1 -1
  143. package/build/modal/Modal.js +1 -1
  144. package/build/modal/Modal.mjs +1 -1
  145. package/build/moneyInput/MoneyInput.js +1 -1
  146. package/build/moneyInput/MoneyInput.mjs +1 -1
  147. package/build/navigationOption/NavigationOption.js +1 -1
  148. package/build/navigationOption/NavigationOption.mjs +1 -1
  149. package/build/nudge/Nudge.js +1 -1
  150. package/build/nudge/Nudge.mjs +1 -1
  151. package/build/overlayHeader/OverlayHeader.js +1 -1
  152. package/build/overlayHeader/OverlayHeader.mjs +1 -1
  153. package/build/phoneNumberInput/PhoneNumberInput.js +1 -1
  154. package/build/phoneNumberInput/PhoneNumberInput.mjs +1 -1
  155. package/build/popover/Popover.js +1 -1
  156. package/build/popover/Popover.mjs +1 -1
  157. package/build/processIndicator/ProcessIndicator.js +1 -1
  158. package/build/processIndicator/ProcessIndicator.mjs +1 -1
  159. package/build/progressBar/ProgressBar.js +1 -1
  160. package/build/progressBar/ProgressBar.mjs +1 -1
  161. package/build/promoCard/PromoCard.js +1 -1
  162. package/build/promoCard/PromoCard.mjs +1 -1
  163. package/build/promoCard/PromoCardIndicator.js +1 -1
  164. package/build/promoCard/PromoCardIndicator.mjs +1 -1
  165. package/build/prompt/ActionPrompt/ActionPrompt.js +42 -10
  166. package/build/prompt/ActionPrompt/ActionPrompt.js.map +1 -1
  167. package/build/prompt/ActionPrompt/ActionPrompt.mjs +41 -9
  168. package/build/prompt/ActionPrompt/ActionPrompt.mjs.map +1 -1
  169. package/build/prompt/InfoPrompt/InfoPrompt.js +1 -1
  170. package/build/prompt/InfoPrompt/InfoPrompt.mjs +1 -1
  171. package/build/prompt/InlinePrompt/InlinePrompt.js +1 -1
  172. package/build/prompt/InlinePrompt/InlinePrompt.mjs +1 -1
  173. package/build/prompt/PrimitivePrompt/PrimitivePrompt.js +4 -11
  174. package/build/prompt/PrimitivePrompt/PrimitivePrompt.js.map +1 -1
  175. package/build/prompt/PrimitivePrompt/PrimitivePrompt.mjs +4 -11
  176. package/build/prompt/PrimitivePrompt/PrimitivePrompt.mjs.map +1 -1
  177. package/build/provider/Provider.js +1 -1
  178. package/build/provider/Provider.mjs +1 -1
  179. package/build/radio/Radio.js +1 -1
  180. package/build/radio/Radio.mjs +1 -1
  181. package/build/segmentedControl/SegmentedControl.js +1 -1
  182. package/build/segmentedControl/SegmentedControl.mjs +1 -1
  183. package/build/select/Select.js +1 -1
  184. package/build/select/Select.mjs +1 -1
  185. package/build/select/option/Option.js +1 -1
  186. package/build/select/option/Option.mjs +1 -1
  187. package/build/statusIcon/StatusIcon.js +2 -2
  188. package/build/statusIcon/StatusIcon.js.map +1 -1
  189. package/build/statusIcon/StatusIcon.mjs +2 -2
  190. package/build/statusIcon/StatusIcon.mjs.map +1 -1
  191. package/build/stepper/Stepper.js +1 -1
  192. package/build/stepper/Stepper.mjs +1 -1
  193. package/build/sticky/Sticky.js +1 -1
  194. package/build/sticky/Sticky.mjs +1 -1
  195. package/build/styles/accordion/Accordion.css +1 -1
  196. package/build/styles/card/Card.css +2 -2
  197. package/build/styles/carousel/Carousel.css +5 -5
  198. package/build/styles/common/Option/Option.css +1 -1
  199. package/build/styles/common/baseCard/BaseCard.css +1 -1
  200. package/build/styles/container/Container.css +3 -3
  201. package/build/styles/criticalBanner/CriticalCommsBanner.css +1 -1
  202. package/build/styles/css/accordion.css +4 -4
  203. package/build/styles/css/button-groups.css +6 -6
  204. package/build/styles/css/buttons.css +1 -1
  205. package/build/styles/css/circles.css +1 -1
  206. package/build/styles/css/column-layout.css +4 -4
  207. package/build/styles/css/decision.css +4 -4
  208. package/build/styles/css/dropdowns.css +10 -10
  209. package/build/styles/css/droppable.css +8 -8
  210. package/build/styles/css/flex.css +14 -14
  211. package/build/styles/css/footer.css +3 -3
  212. package/build/styles/css/grid.css +19 -19
  213. package/build/styles/css/input-groups.css +12 -12
  214. package/build/styles/css/list-group.css +8 -8
  215. package/build/styles/css/modals.css +3 -3
  216. package/build/styles/css/navbar.css +62 -62
  217. package/build/styles/css/navs.css +2 -2
  218. package/build/styles/css/neptune.css +258 -258
  219. package/build/styles/css/panels.css +9 -9
  220. package/build/styles/css/popovers.css +13 -13
  221. package/build/styles/css/select.css +1 -1
  222. package/build/styles/css/sequences.css +6 -6
  223. package/build/styles/css/table.css +6 -6
  224. package/build/styles/css/utilities.css +4 -4
  225. package/build/styles/css/wells.css +4 -4
  226. package/build/styles/dateInput/DateInput.css +1 -1
  227. package/build/styles/definitionList/DefinitionList.css +2 -2
  228. package/build/styles/drawer/Drawer.css +1 -1
  229. package/build/styles/inputs/Input.css +3 -3
  230. package/build/styles/inputs/SelectInput/Options/SelectInputOptions.css +2 -2
  231. package/build/styles/inputs/SelectInput/SelectInput.css +2 -2
  232. package/build/styles/inputs/TextArea.css +3 -3
  233. package/build/styles/less/legacy-variables.less +34 -47
  234. package/build/styles/less/neptune-tokens.less +2 -2
  235. package/build/styles/logo/Logo.css +2 -2
  236. package/build/styles/main.css +330 -495
  237. package/build/styles/modal/Modal.css +5 -5
  238. package/build/styles/popover/Popover.css +3 -3
  239. package/build/styles/promoCard/PromoCard.css +1 -1
  240. package/build/styles/prompt/ActionPrompt/ActionPrompt.css +1 -1
  241. package/build/styles/prompt/PrimitivePrompt/PrimitivePrompt.css +1 -1
  242. package/build/styles/props/custom-media.css +23 -11
  243. package/build/styles/props/neptune-tokens.css +1 -1
  244. package/build/styles/snackbar/Snackbar.css +2 -2
  245. package/build/styles/stepper/Stepper.css +2 -2
  246. package/build/styles/styles/less/accordion.css +4 -4
  247. package/build/styles/styles/less/button-groups.css +6 -6
  248. package/build/styles/styles/less/buttons.css +1 -1
  249. package/build/styles/styles/less/circles.css +1 -1
  250. package/build/styles/styles/less/column-layout.css +4 -4
  251. package/build/styles/styles/less/decision.css +4 -4
  252. package/build/styles/styles/less/dropdowns.css +10 -10
  253. package/build/styles/styles/less/droppable.css +8 -8
  254. package/build/styles/styles/less/flex.css +14 -14
  255. package/build/styles/styles/less/footer.css +3 -3
  256. package/build/styles/styles/less/forms/bootstrap-forms.css +9 -9
  257. package/build/styles/styles/less/grid.css +19 -19
  258. package/build/styles/styles/less/input-groups.css +12 -12
  259. package/build/styles/styles/less/list-group.css +8 -8
  260. package/build/styles/styles/less/modals.css +3 -3
  261. package/build/styles/styles/less/navbar.css +62 -62
  262. package/build/styles/styles/less/navs.css +2 -2
  263. package/build/styles/styles/less/neptune.css +258 -258
  264. package/build/styles/styles/less/panels.css +9 -9
  265. package/build/styles/styles/less/popovers.css +13 -13
  266. package/build/styles/styles/less/select.css +1 -1
  267. package/build/styles/styles/less/sequences.css +6 -6
  268. package/build/styles/styles/less/table.css +6 -6
  269. package/build/styles/styles/less/utilities.css +4 -4
  270. package/build/styles/styles/less/wells.css +4 -4
  271. package/build/styles/styles/props/custom-media.css +1 -11
  272. package/build/styles/table/Table.css +1 -1
  273. package/build/styles/tabs/Tabs.css +2 -2
  274. package/build/styles/typeahead/Typeahead.css +1 -1
  275. package/build/summary/Summary.js +1 -1
  276. package/build/summary/Summary.mjs +1 -1
  277. package/build/table/Table.js +7 -6
  278. package/build/table/Table.js.map +1 -1
  279. package/build/table/Table.mjs +7 -6
  280. package/build/table/Table.mjs.map +1 -1
  281. package/build/table/TableRow.js +1 -1
  282. package/build/table/TableRow.mjs +1 -1
  283. package/build/table/TableStatusText.js +1 -1
  284. package/build/table/TableStatusText.mjs +1 -1
  285. package/build/tabs/Tabs.js +1 -1
  286. package/build/tabs/Tabs.mjs +1 -1
  287. package/build/tile/Tile.js +1 -1
  288. package/build/tile/Tile.mjs +1 -1
  289. package/build/title/Title.js +1 -1
  290. package/build/title/Title.mjs +1 -1
  291. package/build/tooltip/Tooltip.js +1 -1
  292. package/build/tooltip/Tooltip.mjs +1 -1
  293. package/build/typeahead/Typeahead.js +3 -4
  294. package/build/typeahead/Typeahead.js.map +1 -1
  295. package/build/typeahead/Typeahead.mjs +3 -4
  296. package/build/typeahead/Typeahead.mjs.map +1 -1
  297. package/build/types/circularButton/CircularButton.d.ts.map +1 -1
  298. package/build/types/common/bottomSheet/BottomSheet.d.ts.map +1 -1
  299. package/build/types/common/hooks/useResizeObserver.d.ts +1 -1
  300. package/build/types/common/hooks/useResizeObserver.d.ts.map +1 -1
  301. package/build/types/common/hooks/useScreenSize.d.ts +1 -1
  302. package/build/types/common/hooks/useScreenSize.d.ts.map +1 -1
  303. package/build/types/common/index.d.ts +1 -1
  304. package/build/types/common/index.d.ts.map +1 -1
  305. package/build/types/criticalBanner/CriticalCommsBanner.d.ts +0 -3
  306. package/build/types/criticalBanner/CriticalCommsBanner.d.ts.map +1 -1
  307. package/build/types/dateLookup/DateLookup.d.ts.map +1 -1
  308. package/build/types/decision/Decision.d.ts.map +1 -1
  309. package/build/types/flowNavigation/FlowNavigation.d.ts.map +1 -1
  310. package/build/types/index.d.ts +4 -3
  311. package/build/types/index.d.ts.map +1 -1
  312. package/build/types/logo/Logo.d.ts +1 -1
  313. package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts +11 -2
  314. package/build/types/prompt/ActionPrompt/ActionPrompt.d.ts.map +1 -1
  315. package/build/types/prompt/PrimitivePrompt/PrimitivePrompt.d.ts +3 -35
  316. package/build/types/prompt/PrimitivePrompt/PrimitivePrompt.d.ts.map +1 -1
  317. package/build/types/prompt/index.d.ts +0 -2
  318. package/build/types/prompt/index.d.ts.map +1 -1
  319. package/build/types/statusIcon/StatusIcon.d.ts.map +1 -1
  320. package/build/types/table/Table.d.ts.map +1 -1
  321. package/build/types/test-utils/index.d.ts +0 -4
  322. package/build/types/test-utils/index.d.ts.map +1 -1
  323. package/build/upload/Upload.js +1 -1
  324. package/build/upload/Upload.mjs +1 -1
  325. package/build/upload/steps/completeStep/completeStep.js +1 -1
  326. package/build/upload/steps/completeStep/completeStep.mjs +1 -1
  327. package/build/upload/steps/processingStep/processingStep.js +1 -1
  328. package/build/upload/steps/processingStep/processingStep.mjs +1 -1
  329. package/build/upload/steps/uploadImageStep/uploadImageStep.js +1 -1
  330. package/build/upload/steps/uploadImageStep/uploadImageStep.mjs +1 -1
  331. package/build/uploadInput/UploadInput.js +1 -1
  332. package/build/uploadInput/UploadInput.mjs +1 -1
  333. package/build/uploadInput/uploadButton/UploadButton.js +1 -1
  334. package/build/uploadInput/uploadButton/UploadButton.mjs +1 -1
  335. package/build/uploadInput/uploadButton/defaults.js +1 -1
  336. package/build/uploadInput/uploadButton/defaults.mjs +1 -1
  337. package/build/uploadInput/uploadItem/UploadItem.js +1 -1
  338. package/build/uploadInput/uploadItem/UploadItem.mjs +1 -1
  339. package/build/withDisplayFormat/WithDisplayFormat.js +1 -1
  340. package/build/withDisplayFormat/WithDisplayFormat.mjs +1 -1
  341. package/package.json +3 -3
  342. package/src/accordion/Accordion.css +1 -1
  343. package/src/card/Card.css +2 -2
  344. package/src/carousel/Carousel.css +5 -5
  345. package/src/circularButton/CircularButton.tsx +3 -2
  346. package/src/common/Option/Option.css +1 -1
  347. package/src/common/baseCard/BaseCard.css +1 -1
  348. package/src/common/bottomSheet/BottomSheet.test.story.tsx +6 -5
  349. package/src/common/bottomSheet/BottomSheet.tsx +2 -2
  350. package/src/common/circle/Circle.tsx +2 -2
  351. package/src/common/hooks/useLayout/useLayout.ts +1 -1
  352. package/src/common/hooks/useResizeObserver.ts +2 -3
  353. package/src/common/hooks/useScreenSize.ts +1 -1
  354. package/src/common/index.ts +1 -1
  355. package/src/common/responsivePanel/ResponsivePanel.test.js +3 -2
  356. package/src/container/Container.css +3 -3
  357. package/src/criticalBanner/CriticalCommsBanner.css +1 -1
  358. package/src/criticalBanner/CriticalCommsBanner.story.tsx +0 -4
  359. package/src/criticalBanner/CriticalCommsBanner.test.story.tsx +1 -1
  360. package/src/criticalBanner/CriticalCommsBanner.tsx +0 -3
  361. package/src/dateInput/DateInput.css +1 -1
  362. package/src/dateLookup/DateLookup.tsx +1 -1
  363. package/src/decision/Decision.test.tsx +2 -1
  364. package/src/decision/Decision.tsx +2 -1
  365. package/src/definitionList/DefinitionList.css +2 -2
  366. package/src/definitionList/DefinitionList.less +2 -2
  367. package/src/drawer/Drawer.css +1 -1
  368. package/src/flowNavigation/FlowNavigation.test.js +1 -1
  369. package/src/flowNavigation/FlowNavigation.tsx +2 -1
  370. package/src/i18n/en.json +0 -2
  371. package/src/index.ts +3 -3
  372. package/src/inputs/Input.css +3 -3
  373. package/src/inputs/SelectInput/Options/SelectInputOptions.css +2 -2
  374. package/src/inputs/SelectInput/SelectInput.css +2 -2
  375. package/src/inputs/SelectInput/SelectInput.tsx +1 -1
  376. package/src/inputs/TextArea.css +3 -3
  377. package/src/logo/Logo.css +2 -2
  378. package/src/logo/Logo.story.tsx +3 -3
  379. package/src/logo/Logo.tsx +1 -1
  380. package/src/main.css +330 -495
  381. package/src/main.less +1 -3
  382. package/src/modal/Modal.css +5 -5
  383. package/src/popover/Popover.css +3 -3
  384. package/src/popover/Popover.test.tsx +2 -1
  385. package/src/promoCard/PromoCard.css +1 -1
  386. package/src/prompt/ActionPrompt/ActionPrompt.css +1 -1
  387. package/src/prompt/ActionPrompt/ActionPrompt.test.tsx +3 -3
  388. package/src/prompt/ActionPrompt/ActionPrompt.tsx +64 -10
  389. package/src/prompt/PrimitivePrompt/PrimitivePrompt.css +1 -1
  390. package/src/prompt/PrimitivePrompt/PrimitivePrompt.tsx +40 -56
  391. package/src/prompt/index.ts +0 -4
  392. package/src/section/Section.story.tsx +2 -8
  393. package/src/select/Select.test.tsx +1 -1
  394. package/src/sentimentSurface/SentimentSurface.story.tsx +17 -43
  395. package/src/snackbar/Snackbar.css +2 -2
  396. package/src/statusIcon/StatusIcon.test.tsx +0 -2
  397. package/src/statusIcon/StatusIcon.tsx +3 -2
  398. package/src/stepper/Stepper.css +2 -2
  399. package/src/styles/less/accordion.css +4 -4
  400. package/src/styles/less/button-groups.css +6 -6
  401. package/src/styles/less/buttons.css +1 -1
  402. package/src/styles/less/circles.css +1 -1
  403. package/src/styles/less/column-layout.css +4 -4
  404. package/src/styles/less/decision.css +4 -4
  405. package/src/styles/less/dropdowns.css +10 -10
  406. package/src/styles/less/droppable.css +8 -8
  407. package/src/styles/less/flex.css +14 -14
  408. package/src/styles/less/footer.css +3 -3
  409. package/src/styles/less/forms/bootstrap-forms.css +9 -9
  410. package/src/styles/less/forms/bootstrap-forms.less +1 -1
  411. package/src/styles/less/grid.css +19 -19
  412. package/src/styles/less/input-groups.css +12 -12
  413. package/src/styles/less/list-group.css +8 -8
  414. package/src/styles/less/modals.css +3 -3
  415. package/src/styles/less/navbar.css +62 -62
  416. package/src/styles/less/navbar.less +2 -2
  417. package/src/styles/less/navs.css +2 -2
  418. package/src/styles/less/neptune.bundle.less +1 -0
  419. package/src/styles/less/neptune.css +258 -258
  420. package/src/styles/less/panels.css +9 -9
  421. package/src/styles/less/popovers.css +13 -13
  422. package/src/styles/less/select.css +1 -1
  423. package/src/styles/less/sequences.css +6 -6
  424. package/src/styles/less/table.css +6 -6
  425. package/src/styles/less/table.less +1 -1
  426. package/src/styles/less/utilities.css +4 -4
  427. package/src/styles/less/wells.css +4 -4
  428. package/src/styles/props/custom-media.css +1 -11
  429. package/src/styles/variables/legacy-variables.less +4 -47
  430. package/src/table/Table.css +1 -1
  431. package/src/table/Table.story.tsx +1 -1
  432. package/src/table/Table.tsx +6 -5
  433. package/src/tabs/Tabs.css +2 -2
  434. package/src/typeahead/Typeahead.css +1 -1
  435. package/build/common/hooks/useContainerSize.js +0 -30
  436. package/build/common/hooks/useContainerSize.js.map +0 -1
  437. package/build/common/hooks/useContainerSize.mjs +0 -28
  438. package/build/common/hooks/useContainerSize.mjs.map +0 -1
  439. package/build/common/propsValues/breakpoint.js +0 -12
  440. package/build/common/propsValues/breakpoint.js.map +0 -1
  441. package/build/common/propsValues/breakpoint.mjs +0 -12
  442. package/build/common/propsValues/breakpoint.mjs.map +0 -1
  443. package/build/prompt/CriticalBanner/CriticalBanner.js +0 -142
  444. package/build/prompt/CriticalBanner/CriticalBanner.js.map +0 -1
  445. package/build/prompt/CriticalBanner/CriticalBanner.mjs +0 -140
  446. package/build/prompt/CriticalBanner/CriticalBanner.mjs.map +0 -1
  447. package/build/prompt/CriticalBanner/helpers.js +0 -29
  448. package/build/prompt/CriticalBanner/helpers.js.map +0 -1
  449. package/build/prompt/CriticalBanner/helpers.mjs +0 -26
  450. package/build/prompt/CriticalBanner/helpers.mjs.map +0 -1
  451. package/build/prompt/common/Expander/Expander.js +0 -35
  452. package/build/prompt/common/Expander/Expander.js.map +0 -1
  453. package/build/prompt/common/Expander/Expander.messages.js +0 -17
  454. package/build/prompt/common/Expander/Expander.messages.js.map +0 -1
  455. package/build/prompt/common/Expander/Expander.messages.mjs +0 -13
  456. package/build/prompt/common/Expander/Expander.messages.mjs.map +0 -1
  457. package/build/prompt/common/Expander/Expander.mjs +0 -33
  458. package/build/prompt/common/Expander/Expander.mjs.map +0 -1
  459. package/build/prompt/helpers/promptMedia.js +0 -52
  460. package/build/prompt/helpers/promptMedia.js.map +0 -1
  461. package/build/prompt/helpers/promptMedia.mjs +0 -50
  462. package/build/prompt/helpers/promptMedia.mjs.map +0 -1
  463. package/build/styles/prompt/CriticalBanner/CriticalBanner.css +0 -134
  464. package/build/styles/prompt/CriticalBanner/CriticalBanner.vars.css +0 -0
  465. package/build/styles/prompt/common/Expander/Expander.css +0 -8
  466. package/build/types/common/hooks/useContainerSize.d.ts +0 -14
  467. package/build/types/common/hooks/useContainerSize.d.ts.map +0 -1
  468. package/build/types/common/propsValues/breakpoint.d.ts +0 -9
  469. package/build/types/common/propsValues/breakpoint.d.ts.map +0 -1
  470. package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts +0 -39
  471. package/build/types/prompt/CriticalBanner/CriticalBanner.d.ts.map +0 -1
  472. package/build/types/prompt/CriticalBanner/helpers.d.ts +0 -18
  473. package/build/types/prompt/CriticalBanner/helpers.d.ts.map +0 -1
  474. package/build/types/prompt/CriticalBanner/index.d.ts +0 -3
  475. package/build/types/prompt/CriticalBanner/index.d.ts.map +0 -1
  476. package/build/types/prompt/common/Expander/Expander.d.ts +0 -20
  477. package/build/types/prompt/common/Expander/Expander.d.ts.map +0 -1
  478. package/build/types/prompt/common/Expander/Expander.messages.d.ts +0 -14
  479. package/build/types/prompt/common/Expander/Expander.messages.d.ts.map +0 -1
  480. package/build/types/prompt/helpers/promptMedia.d.ts +0 -22
  481. package/build/types/prompt/helpers/promptMedia.d.ts.map +0 -1
  482. package/src/common/hooks/useContainerSize.test.tsx +0 -121
  483. package/src/common/hooks/useContainerSize.ts +0 -32
  484. package/src/common/propsValues/breakpoint.ts +0 -8
  485. package/src/prompt/CriticalBanner/CriticalBanner.accessibility.docs.mdx +0 -113
  486. package/src/prompt/CriticalBanner/CriticalBanner.css +0 -134
  487. package/src/prompt/CriticalBanner/CriticalBanner.less +0 -155
  488. package/src/prompt/CriticalBanner/CriticalBanner.story.tsx +0 -635
  489. package/src/prompt/CriticalBanner/CriticalBanner.test.story.tsx +0 -422
  490. package/src/prompt/CriticalBanner/CriticalBanner.tsx +0 -178
  491. package/src/prompt/CriticalBanner/CriticalBanner.vars.css +0 -0
  492. package/src/prompt/CriticalBanner/CriticalBanner.vars.less +0 -6
  493. package/src/prompt/CriticalBanner/helpers.ts +0 -39
  494. package/src/prompt/CriticalBanner/index.ts +0 -2
  495. package/src/prompt/common/Expander/Expander.css +0 -8
  496. package/src/prompt/common/Expander/Expander.less +0 -9
  497. package/src/prompt/common/Expander/Expander.messages.ts +0 -14
  498. package/src/prompt/common/Expander/Expander.test.tsx +0 -167
  499. package/src/prompt/common/Expander/Expander.tsx +0 -83
  500. package/src/prompt/helpers/promptMedia.tsx +0 -79
package/src/common/bottomSheet/BottomSheet.test.story.tsx CHANGED
@@ -5,7 +5,7 @@ import { fireEvent, within } from 'storybook/test';
5
5
  import { FastFlag } from '@transferwise/icons';
6
6
  import { lorem10, lorem100, lorem500 } from '../../test-utils';
7
7
  import { Typography } from '../propsValues/typography';
8
- import Alert from '../../alert';
8
+ import { InfoPrompt } from '../../prompt/InfoPrompt';
9
9
  import Body from '../../body';
10
10
  import Button from '../../button';
11
11
  import Title from '../../title';
@@ -45,10 +45,11 @@ export const SmoothScrollReset: Story = {
45
45
  children: (
46
46
  <>
47
47
  <Title type={Typography.TITLE_SECTION}>Observe the document</Title>
48
- <Alert className="m-t-2" type="warning">
49
- Once the <code>BottomSheet</code> opens, the document underneath should be static and
50
- should not scroll.
51
- </Alert>
48
+ <InfoPrompt
49
+ className="m-t-2"
50
+ sentiment="warning"
51
+ description="Once the BottomSheet opens, the document underneath should be static and should not scroll."
52
+ />
52
53
  <Body as="p">{lorem100}</Body>
53
54
  <Body as="p">{lorem100}</Body>
54
55
  </>
package/src/common/bottomSheet/BottomSheet.tsx CHANGED
@@ -8,6 +8,7 @@ import {
8
8
  useRef,
9
9
  useState,
10
10
  } from 'react';
11
+ import { Breakpoint } from '@transferwise/neptune-tokens';
11
12
 
12
13
  import Dimmer from '../../dimmer';
13
14
  import Drawer from '../../drawer';
@@ -18,7 +19,6 @@ import { CommonProps } from '../commonProps';
18
19
  import { isServerSide } from '../domHelpers';
19
20
  import { useConditionalListener } from '../hooks';
20
21
  import { useMedia } from '../hooks/useMedia';
21
- import { Breakpoint } from '../propsValues/breakpoint';
22
22
  import { Position } from '../propsValues/position';
23
23
 
24
24
  const INITIAL_Y_POSITION = 0;
@@ -178,7 +178,7 @@ const BottomSheet = ({ role = 'dialog', ...props }: BottomSheetProps) => {
178
178
  };
179
179
  }
180
180
 
181
- const is400Zoom = useMedia(`(max-width: ${Breakpoint.ZOOM_400}px)`);
181
+ const is400Zoom = useMedia(`(max-width: ${Breakpoint.EXTRA_SMALL}px)`);
182
182
 
183
183
  const overlayId = useContext(OverlayIdContext);
184
184
 
package/src/common/circle/Circle.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  import { HTMLAttributes, forwardRef } from 'react';
2
2
  import { clsx } from 'clsx';
3
+ import { Breakpoint } from '@transferwise/neptune-tokens';
3
4
  import { useMedia } from '../hooks/useMedia';
4
- import { Breakpoint } from '../propsValues/breakpoint';
5
5
 
6
6
  export type ShapeSize = 16 | 24 | 32 | 40 | 48 | 56 | 72;
7
7
 
@@ -63,7 +63,7 @@ const Circle = forwardRef(function Circle(
63
63
  }: Props,
64
64
  ref,
65
65
  ) {
66
- const isTinyViewport = useMedia(`(max-width: ${Breakpoint.ZOOM_400}px)`);
66
+ const isTinyViewport = useMedia(`(max-width: ${Breakpoint.EXTRA_SMALL}px)`);
67
67
  return (
68
68
  <Element
69
69
  {...props}
package/src/common/hooks/useLayout/useLayout.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Breakpoint } from '../../propsValues/breakpoint';
1
+ import { Breakpoint } from '@transferwise/neptune-tokens';
2
2
  import { useScreenSize } from '../useScreenSize';
3
3
 
4
4
  /**
package/src/common/hooks/useResizeObserver.ts CHANGED
@@ -5,7 +5,6 @@ import { useEffectEvent } from './useEffectEvent';
5
5
  export function useResizeObserver(
6
6
  ref: React.MutableRefObject<Element | null>,
7
7
  callback: (entry: ResizeObserverEntry) => void,
8
- box: ResizeObserverBoxOptions = 'border-box',
9
8
  ) {
10
9
  const handleCallback = useEffectEvent(callback);
11
10
  useEffect(() => {
@@ -13,11 +12,11 @@ export function useResizeObserver(
13
12
  const resizeObserver = new ResizeObserver(([entry]) => {
14
13
  handleCallback(entry);
15
14
  });
16
- resizeObserver.observe(ref.current, { box });
15
+ resizeObserver.observe(ref.current, { box: 'border-box' });
17
16
  return () => {
18
17
  resizeObserver.disconnect();
19
18
  };
20
19
  }
21
20
  return () => {};
22
- }, [handleCallback, ref, box]);
21
+ }, [handleCallback, ref]);
23
22
  }
package/src/common/hooks/useScreenSize.ts CHANGED
@@ -1,4 +1,4 @@
1
- import { Breakpoint } from '../propsValues/breakpoint';
1
+ import { Breakpoint } from '@transferwise/neptune-tokens';
2
2
 
3
3
  import { useMedia } from './useMedia';
4
4
 
package/src/common/index.ts CHANGED
@@ -4,8 +4,8 @@ export { addNoScrollClass, removeNoScrollClass } from './DOMOperations';
4
4
  export * from './theme';
5
5
  export * from './direction';
6
6
  // Props
7
+ export { Breakpoint } from '@transferwise/neptune-tokens';
7
8
  export * from './propsValues/control';
8
- export { Breakpoint } from './propsValues/breakpoint';
9
9
  export * from './propsValues/size';
10
10
  export * from './propsValues/typography';
11
11
  export * from './propsValues/width';
package/src/common/responsivePanel/ResponsivePanel.test.js CHANGED
@@ -1,6 +1,7 @@
1
- import { Breakpoint, Position } from '..';
1
+ import { Breakpoint } from '@transferwise/neptune-tokens';
2
+ import { Position } from '..';
2
3
  import { mockMatchMedia, render, screen } from '../../test-utils';
3
- import React, { forwardRef } from 'react';
4
+ import React from 'react';
4
5
 
5
6
  import ResponsivePanel from './ResponsivePanel';
6
7
 
package/src/container/Container.css CHANGED
@@ -9,17 +9,17 @@
9
9
  padding-inline: 16px;
10
10
  padding-inline: var(--wds-container-padding-inline);
11
11
  }
12
- @media (min-width: 576px) {
12
+ @media (min-width: 600px) {
13
13
  .wds-container {
14
14
  --wds-container-padding-inline: var(--size-16);
15
15
  }
16
16
  }
17
- @media (min-width: 768px) {
17
+ @media (min-width: 840px) {
18
18
  .wds-container {
19
19
  --wds-container-padding-inline: var(--size-32);
20
20
  }
21
21
  }
22
- @media (min-width: 992px) {
22
+ @media (min-width: 1160px) {
23
23
  .wds-container {
24
24
  --wds-container-padding-inline: var(--size-40);
25
25
  }
package/src/criticalBanner/CriticalCommsBanner.css CHANGED
@@ -44,7 +44,7 @@
44
44
  --Button-background-hover: var(--color-sentiment-interactive-secondary-neutral-hover);
45
45
  --Button-background-active: var(--color-sentiment-interactive-secondary-neutral-active);
46
46
  }
47
- @media (min-width: 768px) {
47
+ @media (min-width: 840px) {
48
48
  .critical-comms .alert-warning .alert__message,
49
49
  .critical-comms .alert-negative .alert__message,
50
50
  .critical-comms .alert-neutral .alert__message {
package/src/criticalBanner/CriticalCommsBanner.story.tsx CHANGED
@@ -1,13 +1,9 @@
1
1
  import { Meta, StoryObj } from '@storybook/react-webpack5';
2
2
  import CriticalCommsBanner from '.';
3
3
 
4
- /**
5
- * @deprecated Use **`CriticalBanner`** component instead.
6
- */
7
4
  export default {
8
5
  component: CriticalCommsBanner,
9
6
  title: 'Prompts/CriticalCommsBanner',
10
- tags: ['deprecated'],
11
7
  } satisfies Meta<typeof CriticalCommsBanner>;
12
8
 
13
9
  type Story = StoryObj<typeof CriticalCommsBanner>;
package/src/criticalBanner/CriticalCommsBanner.test.story.tsx CHANGED
@@ -6,7 +6,7 @@ import { withVariantConfig } from '../../.storybook/helpers';
6
6
  export default {
7
7
  component: CriticalCommsBanner,
8
8
  title: 'Prompts/CriticalCommsBanner/Tests',
9
- tags: ['!autodocs', 'deprecated'],
9
+ tags: ['!autodocs'],
10
10
  } satisfies Meta<typeof CriticalCommsBanner>;
11
11
 
12
12
  type Story = StoryObj<typeof CriticalCommsBanner>;
package/src/criticalBanner/CriticalCommsBanner.tsx CHANGED
@@ -51,9 +51,6 @@ const iconBySentiment: Record<CriticalCommsBannerSentiment, React.ReactNode> = {
51
51
  ),
52
52
  };
53
53
 
54
- /**
55
- * @deprecated `CriticalCommsBanner` component is deprecated and now replaced by the `CriticalBanner` component.
56
- */
57
54
  function CriticalCommsBanner({
58
55
  title,
59
56
  subtitle,
package/src/dateInput/DateInput.css CHANGED
@@ -9,7 +9,7 @@
9
9
  .tw-date .tw-date--day {
10
10
  margin-bottom: 0;
11
11
  }
12
- @media (min-width: 576px) {
12
+ @media (min-width: 600px) {
13
13
  .np-theme-personal .tw-date label {
14
14
  margin-bottom: 0;
15
15
  }
package/src/dateLookup/DateLookup.tsx CHANGED
@@ -1,11 +1,11 @@
1
1
  import { clsx } from 'clsx';
2
2
  import { createRef, PureComponent, KeyboardEvent } from 'react';
3
+ import { Breakpoint } from '@transferwise/neptune-tokens';
3
4
 
4
5
  import {
5
6
  Size,
6
7
  MonthFormat,
7
8
  Position,
8
- Breakpoint,
9
9
  type SizeSmall,
10
10
  type SizeMedium,
11
11
  type SizeLarge,
package/src/decision/Decision.test.tsx CHANGED
@@ -1,4 +1,5 @@
1
- import { Breakpoint, Size } from '../common';
1
+ import { Breakpoint } from '@transferwise/neptune-tokens';
2
+ import { Size } from '../common';
2
3
  import { mockMatchMedia } from '../mocks';
3
4
  import { render, screen } from '../test-utils';
4
5
 
package/src/decision/Decision.tsx CHANGED
@@ -1,6 +1,7 @@
1
1
  import { clsx } from 'clsx';
2
+ import { Breakpoint } from '@transferwise/neptune-tokens';
2
3
 
3
- import { Size, Breakpoint, SizeSmall, SizeMedium } from '../common';
4
+ import { Size, SizeSmall, SizeMedium } from '../common';
4
5
  import { useScreenSize } from '../common/hooks/useScreenSize';
5
6
  import NavigationOption from '../navigationOption';
6
7
  import Tile from '../tile';
package/src/definitionList/DefinitionList.css CHANGED
@@ -9,12 +9,12 @@
9
9
  .tw-definition-list__button {
10
10
  margin-top: -50%;
11
11
  }
12
- @media (max-width: 576px) {
12
+ @media (max-width: 599.98px) {
13
13
  .tw-definition-list--right-aligned-desktop {
14
14
  justify-content: space-between;
15
15
  }
16
16
  }
17
- @media (min-width: 576px) {
17
+ @media (min-width: 600px) {
18
18
  .tw-definition-list--right-aligned-desktop {
19
19
  justify-content: flex-end;
20
20
  }
package/src/definitionList/DefinitionList.less CHANGED
@@ -15,13 +15,13 @@
15
15
  margin-top: -50%;
16
16
  }
17
17
 
18
- @media (max-width: 576px) {
18
+ @media (--screen-xs-max) {
19
19
  &--right-aligned-desktop {
20
20
  justify-content: space-between;
21
21
  }
22
22
  }
23
23
 
24
- @media (min-width: 576px) {
24
+ @media (--screen-sm) {
25
25
  &--right-aligned-desktop {
26
26
  justify-content: flex-end;
27
27
  }
package/src/drawer/Drawer.css CHANGED
@@ -43,7 +43,7 @@
43
43
  padding: 0 16px;
44
44
  padding: 0 var(--size-16);
45
45
  }
46
- @media (min-width: 768px) {
46
+ @media (min-width: 840px) {
47
47
  .np-drawer .np-drawer-header,
48
48
  .np-drawer .np-drawer-footer {
49
49
  padding: 24px;
package/src/flowNavigation/FlowNavigation.test.js CHANGED
@@ -1,5 +1,5 @@
1
+ import { Breakpoint } from '@transferwise/neptune-tokens';
1
2
  import AvatarView from '../avatarView';
2
- import { Breakpoint } from '../common';
3
3
  import { mockMatchMedia, render, screen } from '../test-utils';
4
4
 
5
5
  import FlowNavigation from './FlowNavigation';
package/src/flowNavigation/FlowNavigation.tsx CHANGED
@@ -1,7 +1,8 @@
1
1
  import { clsx } from 'clsx';
2
2
  import { useIntl } from 'react-intl';
3
+ import { Breakpoint } from '@transferwise/neptune-tokens';
3
4
 
4
- import { Breakpoint, Layout } from '../common';
5
+ import { Layout } from '../common';
5
6
  import { CloseButton } from '../common/closeButton';
6
7
  import FlowHeader from '../common/flowHeader/FlowHeader';
7
8
  import Logo from '../logo';
package/src/i18n/en.json CHANGED
@@ -16,8 +16,6 @@
16
16
  "neptune.DateLookup.selected": "selected",
17
17
  "neptune.DateLookup.twentyYears": "20 years",
18
18
  "neptune.DateLookup.year": "year",
19
- "neptune.Expander.collapseAriaLabel": "Collapse",
20
- "neptune.Expander.expandAriaLabel": "Expand",
21
19
  "neptune.ExpressiveMoneyInput.currency.search.placeholder": "Type a currency / country",
22
20
  "neptune.ExpressiveMoneyInput.currency.select.currency": "Select currency",
23
21
  "neptune.FlowNavigation.back": "back to previous step",
package/src/index.ts CHANGED
@@ -36,7 +36,7 @@ export type { HeaderProps } from './header';
36
36
  export type { EmphasisProps } from './emphasis';
37
37
  export type { FieldProps } from './field/Field';
38
38
  export type { InfoProps } from './info';
39
- export type { InlinePromptProps, ActionPromptProps, CriticalBannerProps } from './prompt';
39
+ export type { InlinePromptProps, ActionPromptProps } from './prompt';
40
40
  export type { InfoPromptProps, InfoPromptAction, InfoPromptMedia } from './prompt';
41
41
  export type { InputWithDisplayFormatProps } from './inputWithDisplayFormat';
42
42
  export type { InputProps } from './inputs/Input';
@@ -175,7 +175,7 @@ export { default as Header } from './header';
175
175
  export { default as Image } from './image';
176
176
  export { default as Info } from './info';
177
177
  export { default as InlineAlert } from './inlineAlert';
178
- export { InfoPrompt, InlinePrompt, ActionPrompt, CriticalBanner } from './prompt';
178
+ export { InfoPrompt, InlinePrompt, ActionPrompt } from './prompt';
179
179
  export { default as InputWithDisplayFormat } from './inputWithDisplayFormat';
180
180
  export { Input } from './inputs/Input';
181
181
  export { InputGroup } from './inputs/InputGroup';
@@ -248,10 +248,10 @@ export { default as useSnackbar } from './snackbar/useSnackbar';
248
248
  /**
249
249
  * Enums
250
250
  */
251
+ export { Breakpoint } from '@transferwise/neptune-tokens';
251
252
  export { AlertArrowPosition } from './alert/Alert';
252
253
  export { AvatarType } from './avatar';
253
254
  export {
254
- Breakpoint,
255
255
  ControlType,
256
256
  DateMode,
257
257
  Direction,
package/src/inputs/Input.css CHANGED
@@ -111,12 +111,12 @@
111
111
  hyphens: auto;
112
112
  hyphenate-limit-chars: 7 3;
113
113
  }
114
- @media (min-width: 768px) {
114
+ @media (min-width: 840px) {
115
115
  .np-form-control--size-lg {
116
116
  hyphenate-limit-chars: 8 3;
117
117
  }
118
118
  }
119
- @media (min-width: 992px) {
119
+ @media (min-width: 1160px) {
120
120
  .np-form-control--size-lg {
121
121
  hyphenate-limit-chars: 10 4 3;
122
122
  }
@@ -128,7 +128,7 @@
128
128
  -webkit-hyphenate-limit-before: 3;
129
129
  -webkit-hyphenate-limit-after: 3;
130
130
  }
131
- @media (min-width: 992px) {
131
+ @media (min-width: 1160px) {
132
132
  .np-form-control--size-lg {
133
133
  -webkit-hyphenate-limit-before: 4;
134
134
  }
package/src/inputs/SelectInput/Options/SelectInputOptions.css CHANGED
@@ -6,7 +6,7 @@
6
6
  .np-select-input-options-container:focus {
7
7
  outline: none;
8
8
  }
9
- @media (min-width: 576px) {
9
+ @media (min-width: 600px) {
10
10
  .np-select-input-options-container {
11
11
  max-height: 28rem /* 448px */;
12
12
  }
@@ -42,7 +42,7 @@
42
42
  scroll-padding-bottom: var(--size-8);
43
43
  overflow-y: auto;
44
44
  }
45
- @media (min-width: 576px) {
45
+ @media (min-width: 600px) {
46
46
  .np-select-input-listbox-container {
47
47
  height: auto;
48
48
  }
package/src/inputs/SelectInput/SelectInput.css CHANGED
@@ -250,7 +250,7 @@
250
250
  .np-select-input-options-container:focus {
251
251
  outline: none;
252
252
  }
253
- @media (min-width: 576px) {
253
+ @media (min-width: 600px) {
254
254
  .np-select-input-options-container {
255
255
  max-height: 28rem /* 448px */;
256
256
  }
@@ -286,7 +286,7 @@
286
286
  scroll-padding-bottom: var(--size-8);
287
287
  overflow-y: auto;
288
288
  }
289
- @media (min-width: 576px) {
289
+ @media (min-width: 600px) {
290
290
  .np-select-input-listbox-container {
291
291
  height: auto;
292
292
  }
package/src/inputs/SelectInput/SelectInput.tsx CHANGED
@@ -1,8 +1,8 @@
1
1
  import mergeProps from 'merge-props';
2
2
  import { useEffect, useRef, useState, useDeferredValue } from 'react';
3
3
  import { Listbox as ListboxBase } from '@headlessui/react';
4
+ import { Breakpoint } from '@transferwise/neptune-tokens';
4
5
  import { useScreenSize } from '../../common/hooks/useScreenSize';
5
- import { Breakpoint } from '../../common/propsValues/breakpoint';
6
6
  import { useEffectEvent } from '../../common/hooks/useEffectEvent';
7
7
  import { useInputAttributes } from '../contexts';
8
8
 
package/src/inputs/TextArea.css CHANGED
@@ -111,12 +111,12 @@
111
111
  hyphens: auto;
112
112
  hyphenate-limit-chars: 7 3;
113
113
  }
114
- @media (min-width: 768px) {
114
+ @media (min-width: 840px) {
115
115
  .np-form-control--size-lg {
116
116
  hyphenate-limit-chars: 8 3;
117
117
  }
118
118
  }
119
- @media (min-width: 992px) {
119
+ @media (min-width: 1160px) {
120
120
  .np-form-control--size-lg {
121
121
  hyphenate-limit-chars: 10 4 3;
122
122
  }
@@ -128,7 +128,7 @@
128
128
  -webkit-hyphenate-limit-before: 3;
129
129
  -webkit-hyphenate-limit-after: 3;
130
130
  }
131
- @media (min-width: 992px) {
131
+ @media (min-width: 1160px) {
132
132
  .np-form-control--size-lg {
133
133
  -webkit-hyphenate-limit-before: 4;
134
134
  }
package/src/logo/Logo.css CHANGED
@@ -11,7 +11,7 @@
11
11
  .np-logo-svg--size-sm {
12
12
  display: block;
13
13
  }
14
- @media (min-width: 576px) {
14
+ @media (min-width: 600px) {
15
15
  .np-logo-svg--size-sm {
16
16
  display: none;
17
17
  }
@@ -19,7 +19,7 @@
19
19
  .np-logo-svg--size-md {
20
20
  display: none;
21
21
  }
22
- @media (min-width: 576px) {
22
+ @media (min-width: 600px) {
23
23
  .np-logo-svg--size-md {
24
24
  display: block;
25
25
  }
package/src/logo/Logo.story.tsx CHANGED
@@ -99,7 +99,7 @@ export const Types: Story = {
99
99
  };
100
100
 
101
101
  /**
102
- * Below `576px` the flag-only mark is shown; at `576px` and above the full wordmark is displayed.
102
+ * Below `600px` the flag-only mark is shown; at `600px` and above the full wordmark is displayed.
103
103
  */
104
104
  export const Responsive: Story = {
105
105
  argTypes: {
@@ -110,7 +110,7 @@ export const Responsive: Story = {
110
110
  <div style={{ display: 'flex', flexDirection: 'column', gap: '2rem' }}>
111
111
  <div>
112
112
  <span style={{ fontSize: '12px', opacity: 0.6, display: 'block', marginBottom: '0.5rem' }}>
113
- {'< 576px (flag only)'}
113
+ {'< 600px (flag only)'}
114
114
  </span>
115
115
  <div style={{ display: 'flex', gap: '3rem', alignItems: 'center' }}>
116
116
  {Object.values(LogoType).map((type) => (
@@ -125,7 +125,7 @@ export const Responsive: Story = {
125
125
  </div>
126
126
  <div>
127
127
  <span style={{ fontSize: '12px', opacity: 0.6, display: 'block', marginBottom: '0.5rem' }}>
128
- {'\u2265 576px (full wordmark)'}
128
+ {'\u2265 600px (full wordmark)'}
129
129
  </span>
130
130
  <div style={{ display: 'flex', gap: '3rem', alignItems: 'center' }}>
131
131
  {Object.values(LogoType).map((type) => (
package/src/logo/Logo.tsx CHANGED
@@ -53,7 +53,7 @@ const labelByType = {
53
53
 
54
54
  /**
55
55
  * Renders the Wise wordmark logo. Responsive — shows the flag-only mark on small viewports
56
- * and the full wordmark on ≥576px (small breakpoint and above).
56
+ * and the full wordmark on ≥600px (small breakpoint and above).
57
57
  *
58
58
  * @see {@link https://wise.design/foundations/logo Design Spec}
59
59
  */