@transferwise/components 0.0.0-experimental-9e05ecb → 0.0.0-experimental-012dcef

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 (378) hide show
  1. package/build/Body/Body.js +1 -1
  2. package/build/Body/Body.js.map +1 -1
  3. package/build/Body/Body.mjs +1 -1
  4. package/build/Body/Body.mjs.map +1 -1
  5. package/build/Calendar/DayCalendar/Table/DayCalendarTable.js +1 -1
  6. package/build/Calendar/DayCalendar/Table/DayCalendarTable.js.map +1 -1
  7. package/build/Calendar/DayCalendar/Table/DayCalendarTable.mjs +1 -1
  8. package/build/Calendar/DayCalendar/Table/DayCalendarTable.mjs.map +1 -1
  9. package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.js +1 -1
  10. package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.js.map +1 -1
  11. package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.mjs +1 -1
  12. package/build/Calendar/MonthCalendar/Table/MonthCalendarTable.mjs.map +1 -1
  13. package/build/Calendar/TableLink/TableLink.js +1 -1
  14. package/build/Calendar/TableLink/TableLink.js.map +1 -1
  15. package/build/Calendar/TableLink/TableLink.mjs +1 -1
  16. package/build/Calendar/TableLink/TableLink.mjs.map +1 -1
  17. package/build/ExpressiveMoneyInput/AmountInput/AmountInput.js +1 -1
  18. package/build/ExpressiveMoneyInput/AmountInput/AmountInput.js.map +1 -1
  19. package/build/ExpressiveMoneyInput/AmountInput/AmountInput.mjs +1 -1
  20. package/build/ExpressiveMoneyInput/AmountInput/AmountInput.mjs.map +1 -1
  21. package/build/FlowNavigation/AnimatedLabel/AnimatedLabel.js +1 -1
  22. package/build/FlowNavigation/AnimatedLabel/AnimatedLabel.js.map +1 -1
  23. package/build/FlowNavigation/AnimatedLabel/AnimatedLabel.mjs +1 -1
  24. package/build/FlowNavigation/AnimatedLabel/AnimatedLabel.mjs.map +1 -1
  25. package/build/Inputs/SelectInput/BottomSheet/SelectInputBottomSheet.js +2 -2
  26. package/build/Inputs/SelectInput/BottomSheet/SelectInputBottomSheet.js.map +1 -1
  27. package/build/Inputs/SelectInput/BottomSheet/SelectInputBottomSheet.mjs +2 -2
  28. package/build/Inputs/SelectInput/BottomSheet/SelectInputBottomSheet.mjs.map +1 -1
  29. package/build/Inputs/SelectInput/Option/SelectInputOption.js +1 -1
  30. package/build/Inputs/SelectInput/Option/SelectInputOption.js.map +1 -1
  31. package/build/Inputs/SelectInput/Option/SelectInputOption.mjs +1 -1
  32. package/build/Inputs/SelectInput/Option/SelectInputOption.mjs.map +1 -1
  33. package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.js +3 -3
  34. package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.js.map +1 -1
  35. package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.mjs +3 -3
  36. package/build/Inputs/SelectInput/OptionContent/SelectInputOptionContent.mjs.map +1 -1
  37. package/build/Inputs/SelectInput/Popover/SelectInputPopover.js +2 -2
  38. package/build/Inputs/SelectInput/Popover/SelectInputPopover.js.map +1 -1
  39. package/build/Inputs/SelectInput/Popover/SelectInputPopover.mjs +2 -2
  40. package/build/Inputs/SelectInput/Popover/SelectInputPopover.mjs.map +1 -1
  41. package/build/Label/Label.js +1 -1
  42. package/build/Label/Label.js.map +1 -1
  43. package/build/Label/Label.mjs +1 -1
  44. package/build/Label/Label.mjs.map +1 -1
  45. package/build/Stepper/Stepper.js +1 -1
  46. package/build/Stepper/Stepper.js.map +1 -1
  47. package/build/Stepper/Stepper.mjs +1 -1
  48. package/build/Stepper/Stepper.mjs.map +1 -1
  49. package/build/Table/Header/TableHeader.js +1 -1
  50. package/build/Table/Header/TableHeader.js.map +1 -1
  51. package/build/Table/Header/TableHeader.mjs +1 -1
  52. package/build/Table/Header/TableHeader.mjs.map +1 -1
  53. package/build/Tabs/Tab/Tab.js +1 -1
  54. package/build/Tabs/Tab/Tab.js.map +1 -1
  55. package/build/Tabs/Tab/Tab.mjs +1 -1
  56. package/build/Tabs/Tab/Tab.mjs.map +1 -1
  57. package/build/Tag/Tag.js +1 -1
  58. package/build/Tag/Tag.js.map +1 -1
  59. package/build/Tag/Tag.mjs +1 -1
  60. package/build/Tag/Tag.mjs.map +1 -1
  61. package/build/Typeahead/TypeaheadOption/TypeaheadOption.js +2 -2
  62. package/build/Typeahead/TypeaheadOption/TypeaheadOption.js.map +1 -1
  63. package/build/Typeahead/TypeaheadOption/TypeaheadOption.mjs +2 -2
  64. package/build/Typeahead/TypeaheadOption/TypeaheadOption.mjs.map +1 -1
  65. package/build/Upload/Steps/UploadImageStep/UploadImageStep.js +2 -2
  66. package/build/Upload/Steps/UploadImageStep/UploadImageStep.js.map +1 -1
  67. package/build/Upload/Steps/UploadImageStep/UploadImageStep.mjs +2 -2
  68. package/build/Upload/Steps/UploadImageStep/UploadImageStep.mjs.map +1 -1
  69. package/build/_deprecated/ActionButton/ActionButton.js +1 -1
  70. package/build/_deprecated/ActionButton/ActionButton.js.map +1 -1
  71. package/build/_deprecated/ActionButton/ActionButton.mjs +1 -1
  72. package/build/_deprecated/ActionButton/ActionButton.mjs.map +1 -1
  73. package/build/_deprecated/Avatar/Avatar.js +1 -1
  74. package/build/_deprecated/Avatar/Avatar.js.map +1 -1
  75. package/build/_deprecated/Avatar/Avatar.mjs +1 -1
  76. package/build/_deprecated/Avatar/Avatar.mjs.map +1 -1
  77. package/build/_deprecated/Select/Select.js +2 -2
  78. package/build/_deprecated/Select/Select.js.map +1 -1
  79. package/build/_deprecated/Select/Select.mjs +2 -2
  80. package/build/_deprecated/Select/Select.mjs.map +1 -1
  81. package/build/common/PropsValues/typography.js +0 -6
  82. package/build/common/PropsValues/typography.js.map +1 -1
  83. package/build/common/PropsValues/typography.mjs +0 -6
  84. package/build/common/PropsValues/typography.mjs.map +1 -1
  85. package/build/main.css +2432 -8907
  86. package/build/styles/Accordion/Accordion.css +6 -7
  87. package/build/styles/Body/Body.css +1 -1
  88. package/build/styles/Calendar/Calendar.css +4 -11
  89. package/build/styles/Calendar/TableLink/TableLink.css +4 -11
  90. package/build/styles/Chips/Chip/Chip.css +3 -5
  91. package/build/styles/Decision/Decision.css +3 -4
  92. package/build/styles/Emphasis/Emphasis.css +1 -1
  93. package/build/styles/ExpressiveMoneyInput/AmountInput/AmountInput.css +1 -2
  94. package/build/styles/ExpressiveMoneyInput/ExpressiveMoneyInput.css +1 -2
  95. package/build/styles/Inputs/Input/Input.css +60 -67
  96. package/build/styles/Inputs/TextArea/TextArea.css +60 -67
  97. package/build/styles/Markup/Markup.css +2 -2
  98. package/build/styles/MoneyInput/MoneyInput.css +6 -9
  99. package/build/styles/Nudge/Nudge.css +3 -3
  100. package/build/styles/Popover/Popover.css +43 -4
  101. package/build/styles/ProgressBar/ProgressBar.css +2 -3
  102. package/build/styles/Prompt/PrimitivePrompt/PrimitivePrompt.css +1 -2
  103. package/build/styles/Snackbar/Snackbar.css +1 -1
  104. package/build/styles/Table/Table.css +8 -18
  105. package/build/styles/Tabs/Tabs.css +3 -3
  106. package/build/styles/Tag/Tag.css +1 -1
  107. package/build/styles/Tile/Tile.css +3 -4
  108. package/build/styles/Typeahead/Typeahead.css +2 -4
  109. package/build/styles/UploadInput/UploadInput.css +1 -1
  110. package/build/styles/_deprecated/ActionButton/ActionButton.css +4 -3
  111. package/build/styles/_deprecated/Avatar/Avatar.css +2 -2
  112. package/build/styles/_deprecated/CriticalBanner/CriticalCommsBanner.css +1 -2
  113. package/build/styles/_deprecated/Select/Select.css +14 -49
  114. package/build/styles/_deprecated/Summary/Summary.css +2 -2
  115. package/build/styles/common/Circle/Circle.css +1 -1
  116. package/build/styles/common/Option/Option.css +4 -4
  117. package/build/styles/css/accordion.css +44 -22
  118. package/build/styles/css/badge.css +2 -2
  119. package/build/styles/css/button-groups.css +6 -29
  120. package/build/styles/css/buttons.css +11 -35
  121. package/build/styles/css/decision.css +44 -22
  122. package/build/styles/css/dropdowns.css +54 -39
  123. package/build/styles/css/droppable.css +6 -28
  124. package/build/styles/css/footer.css +10 -41
  125. package/build/styles/css/input-groups.css +167 -203
  126. package/build/styles/css/list-group.css +42 -1
  127. package/build/styles/css/modals.css +1 -1
  128. package/build/styles/css/navbar.css +81 -66
  129. package/build/styles/css/navs.css +8 -8
  130. package/build/styles/css/neptune-addons.css +0 -15
  131. package/build/styles/css/neptune-core.css +524 -5935
  132. package/build/styles/css/neptune.css +2092 -8533
  133. package/build/styles/css/panels.css +2 -2
  134. package/build/styles/css/popovers.css +56 -39
  135. package/build/styles/css/progress-bars.css +2 -2
  136. package/build/styles/css/sequences.css +9 -14
  137. package/build/styles/css/table.css +7 -7
  138. package/build/styles/css/tooltip.css +6 -28
  139. package/build/styles/fonts/inter-cyrillic-ext-variable-wghtOnly-normal.woff2 +0 -0
  140. package/build/styles/fonts/inter-cyrillic-variable-wghtOnly-normal.woff2 +0 -0
  141. package/build/styles/fonts/inter-greek-ext-variable-wghtOnly-normal.woff2 +0 -0
  142. package/build/styles/fonts/inter-greek-variable-wghtOnly-normal.woff2 +0 -0
  143. package/build/styles/fonts/inter-latin-ext-variable-wghtOnly-normal.woff2 +0 -0
  144. package/build/styles/fonts/inter-latin-variable-wghtOnly-normal.woff2 +0 -0
  145. package/build/styles/fonts/inter-vietnamese-variable-wghtOnly-normal.woff2 +0 -0
  146. package/build/styles/less/legacy-variables.less +3 -3
  147. package/build/styles/less/neptune-tokens.less +48 -0
  148. package/build/styles/main.css +2432 -8907
  149. package/build/styles/props/neptune-tokens.css +3 -804
  150. package/build/styles/styles/less/accordion.css +44 -22
  151. package/build/styles/styles/less/badge.css +2 -2
  152. package/build/styles/styles/less/button-groups.css +6 -29
  153. package/build/styles/styles/less/buttons.css +11 -35
  154. package/build/styles/styles/less/decision.css +44 -22
  155. package/build/styles/styles/less/dropdowns.css +54 -39
  156. package/build/styles/styles/less/droppable.css +6 -28
  157. package/build/styles/styles/less/footer.css +10 -41
  158. package/build/styles/styles/less/forms/bootstrap-forms.css +100 -153
  159. package/build/styles/styles/less/forms/checkbox-radio.css +3 -3
  160. package/build/styles/styles/less/input-groups.css +167 -203
  161. package/build/styles/styles/less/list-group.css +42 -1
  162. package/build/styles/styles/less/modals.css +1 -1
  163. package/build/styles/styles/less/navbar.css +81 -66
  164. package/build/styles/styles/less/navs.css +8 -8
  165. package/build/styles/styles/less/neptune-addons.css +0 -15
  166. package/build/styles/styles/less/neptune-core.css +524 -5935
  167. package/build/styles/styles/less/neptune.css +2092 -8533
  168. package/build/styles/styles/less/panels.css +2 -2
  169. package/build/styles/styles/less/popovers.css +56 -39
  170. package/build/styles/styles/less/progress-bars.css +2 -2
  171. package/build/styles/styles/less/sequences.css +9 -14
  172. package/build/styles/styles/less/table.css +7 -7
  173. package/build/styles/styles/less/tooltip.css +6 -28
  174. package/build/types/Body/Body.d.ts +2 -2
  175. package/build/types/ExpressiveMoneyInput/AmountInput/AmountInput.d.ts.map +1 -1
  176. package/build/types/IconButton/IconButton.d.ts +1 -1
  177. package/build/types/ListItem/_stories/variants/helpers.d.ts +1 -4
  178. package/build/types/ListItem/_stories/variants/helpers.d.ts.map +1 -1
  179. package/build/types/MoneyInput/MoneyInput.d.ts +1 -1
  180. package/build/types/MoneyInput/MoneyInput.d.ts.map +1 -1
  181. package/build/types/Title/Title.d.ts +2 -2
  182. package/build/types/Upload/Steps/UploadImageStep/UploadImageStep.d.ts +1 -1
  183. package/build/types/UploadInput/UploadItem/UploadItemLink.d.ts +1 -1
  184. package/build/types/common/PropsValues/typography.d.ts +1 -13
  185. package/build/types/common/PropsValues/typography.d.ts.map +1 -1
  186. package/package.json +1 -1
  187. package/src/Accordion/Accordion.css +6 -7
  188. package/src/Accordion/Accordion.less +6 -7
  189. package/src/Body/Body.css +1 -1
  190. package/src/Body/Body.less +1 -1
  191. package/src/Body/Body.test.tsx +4 -4
  192. package/src/Body/Body.tsx +2 -2
  193. package/src/Button/_stories/Button.test.story.tsx +0 -1
  194. package/src/Calendar/Calendar.css +4 -11
  195. package/src/Calendar/DayCalendar/Table/DayCalendarTable.tsx +2 -2
  196. package/src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx +1 -1
  197. package/src/Calendar/TableLink/TableLink.css +4 -11
  198. package/src/Calendar/TableLink/TableLink.less +4 -14
  199. package/src/Calendar/TableLink/TableLink.tsx +1 -1
  200. package/src/Calendar/_stories/Calendar.test.story.tsx +0 -1
  201. package/src/Chips/Chip/Chip.css +3 -5
  202. package/src/Chips/Chip/Chip.less +2 -3
  203. package/src/CircularButton/_stories/CircularButton.story.tsx +16 -6
  204. package/src/DateInput/_stories/DateInput.rtl.test.story.tsx +2 -3
  205. package/src/DateInput/_stories/DateInput.story.tsx +0 -1
  206. package/src/Decision/Decision.css +3 -4
  207. package/src/Decision/Decision.less +3 -4
  208. package/src/Decision/_stories/Decision.test.story.tsx +2 -3
  209. package/src/DefinitionList/_stories/DefinitionList.story.tsx +1 -1
  210. package/src/DefinitionList/_stories/DefinitionList.test.story.tsx +1 -1
  211. package/src/Display/_stories/Display.story.tsx +6 -20
  212. package/src/Emphasis/Emphasis.css +1 -1
  213. package/src/Emphasis/Emphasis.less +1 -1
  214. package/src/ExpressiveMoneyInput/AmountInput/AmountInput.css +1 -2
  215. package/src/ExpressiveMoneyInput/AmountInput/AmountInput.less +1 -2
  216. package/src/ExpressiveMoneyInput/AmountInput/AmountInput.tsx +4 -1
  217. package/src/ExpressiveMoneyInput/ExpressiveMoneyInput.css +1 -2
  218. package/src/ExpressiveMoneyInput/_stories/ExpressiveMoneyInput.rtl.test.story.tsx +2 -3
  219. package/src/Field/_stories/Field.test.story.tsx +2 -3
  220. package/src/FlowNavigation/AnimatedLabel/AnimatedLabel.tsx +1 -1
  221. package/src/Header/_stories/Header.test.story.tsx +1 -1
  222. package/src/InputWithDisplayFormat/_stories/InputWithDisplayFormat.test.story.tsx +2 -3
  223. package/src/Inputs/Input/Input.css +60 -67
  224. package/src/Inputs/InputGroup/_stories/InputGroup.test.story.tsx +2 -3
  225. package/src/Inputs/SelectInput/BottomSheet/SelectInputBottomSheet.tsx +2 -2
  226. package/src/Inputs/SelectInput/Option/SelectInputOption.tsx +1 -1
  227. package/src/Inputs/SelectInput/OptionContent/SelectInputOptionContent.tsx +3 -3
  228. package/src/Inputs/SelectInput/Popover/SelectInputPopover.tsx +2 -2
  229. package/src/Inputs/SelectInput/_stories/SelectInput.rtl.test.story.tsx +2 -3
  230. package/src/Inputs/SelectInput/_stories/SelectInput.story.tsx +1 -1
  231. package/src/Inputs/TextArea/TextArea.css +60 -67
  232. package/src/Inputs/TextArea/_stories/TextArea.test.story.tsx +2 -3
  233. package/src/Inputs/_common.less +10 -12
  234. package/src/InstructionsList/_stories/InstructionsList.test.story.tsx +1 -2
  235. package/src/Label/Label.tsx +1 -1
  236. package/src/Label/_stories/Label.test.story.tsx +2 -3
  237. package/src/ListItem/_stories/ListItem.rtl.test.story.tsx +8 -15
  238. package/src/ListItem/_stories/variants/helpers.tsx +1 -5
  239. package/src/Markup/Markup.css +2 -2
  240. package/src/Markup/Markup.less +2 -2
  241. package/src/MoneyInput/MoneyInput.css +6 -9
  242. package/src/MoneyInput/MoneyInput.less +7 -10
  243. package/src/MoneyInput/_stories/MoneyInput.rtl.test.story.tsx +3 -5
  244. package/src/Nudge/Nudge.css +3 -3
  245. package/src/Nudge/Nudge.less +3 -3
  246. package/src/PhoneNumberInput/_stories/PhoneNumberInput.rtl.test.story.tsx +3 -3
  247. package/src/PocketSurface/_stories/PocketSurface.story.tsx +2 -2
  248. package/src/Popover/Popover.css +43 -4
  249. package/src/Popover/Popover.less +2 -2
  250. package/src/ProgressBar/ProgressBar.css +2 -3
  251. package/src/ProgressBar/ProgressBar.less +11 -12
  252. package/src/ProgressBar/_stories/ProgressBar.test.story.tsx +2 -3
  253. package/src/Prompt/ActionPrompt/_stories/ActionPrompt.test.story.tsx +2 -3
  254. package/src/Prompt/CriticalBanner/_stories/CriticalBanner.test.story.tsx +2 -3
  255. package/src/Prompt/InfoPrompt/_stories/InfoPrompt.test.story.tsx +2 -3
  256. package/src/Prompt/InlinePrompt/_stories/InlinePrompt.test.story.tsx +2 -3
  257. package/src/Prompt/PrimitivePrompt/PrimitivePrompt.css +1 -2
  258. package/src/Prompt/PrimitivePrompt/PrimitivePrompt.less +1 -2
  259. package/src/SentimentSurface/_stories/SentimentSurface.story.tsx +1 -1
  260. package/src/Snackbar/Snackbar.css +1 -1
  261. package/src/Snackbar/Snackbar.less +1 -1
  262. package/src/Stepper/Stepper.tsx +1 -1
  263. package/src/Table/Header/TableHeader.tsx +1 -1
  264. package/src/Table/StatusText/TableStatusText.test.tsx +5 -5
  265. package/src/Table/Table.css +8 -18
  266. package/src/Table/Table.less +9 -20
  267. package/src/Table/_stories/Table.test.story.tsx +15 -26
  268. package/src/Tabs/Tab/Tab.tsx +1 -1
  269. package/src/Tabs/Tabs.css +3 -3
  270. package/src/Tabs/Tabs.less +3 -3
  271. package/src/Tabs/_stories/Tabs.test.story.tsx +1 -1
  272. package/src/Tag/Tag.css +1 -1
  273. package/src/Tag/Tag.less +1 -1
  274. package/src/Tag/Tag.tsx +1 -1
  275. package/src/Tag/_stories/Tag.story.tsx +1 -1
  276. package/src/TextareaWithDisplayFormat/_stories/TextareaWithDisplayFormat.test.story.tsx +2 -3
  277. package/src/Tile/Tile.css +3 -4
  278. package/src/Tile/Tile.less +3 -4
  279. package/src/Typeahead/Typeahead.css +2 -4
  280. package/src/Typeahead/Typeahead.less +1 -2
  281. package/src/Typeahead/TypeaheadOption/TypeaheadOption.tsx +2 -2
  282. package/src/Typeahead/_stories/Typeahead.rtl.test.story.tsx +1 -1
  283. package/src/Upload/Steps/UploadImageStep/UploadImageStep.tsx +2 -2
  284. package/src/Upload/_stories/Upload.rtl.test.story.tsx +0 -1
  285. package/src/UploadInput/UploadInput.css +1 -1
  286. package/src/UploadInput/UploadInput.less +4 -7
  287. package/src/UploadInput/_stories/UploadInput.test.story.tsx +0 -1
  288. package/src/_deprecated/ActionButton/ActionButton.css +4 -3
  289. package/src/_deprecated/ActionButton/ActionButton.less +5 -4
  290. package/src/_deprecated/ActionButton/ActionButton.tsx +1 -1
  291. package/src/_deprecated/Avatar/Avatar.css +2 -2
  292. package/src/_deprecated/Avatar/Avatar.less +2 -2
  293. package/src/_deprecated/Avatar/Avatar.tsx +1 -1
  294. package/src/_deprecated/CriticalBanner/CriticalCommsBanner.css +1 -2
  295. package/src/_deprecated/CriticalBanner/CriticalCommsBanner.less +1 -2
  296. package/src/_deprecated/NavigationOption/_stories/NavigationOption.story.tsx +6 -6
  297. package/src/_deprecated/Select/Select.css +14 -49
  298. package/src/_deprecated/Select/Select.less +10 -14
  299. package/src/_deprecated/Select/Select.tsx +2 -2
  300. package/src/_deprecated/Summary/Summary.css +2 -2
  301. package/src/_deprecated/Summary/Summary.less +2 -2
  302. package/src/common/Circle/Circle.css +1 -1
  303. package/src/common/Circle/Circle.less +1 -1
  304. package/src/common/Option/Option.css +4 -4
  305. package/src/common/Option/Option.less +4 -4
  306. package/src/common/PropsValues/typography.ts +1 -20
  307. package/src/main.css +2432 -8907
  308. package/src/main.less +2 -3
  309. package/src/styles/fonts/inter-cyrillic-ext-variable-wghtOnly-normal.woff2 +0 -0
  310. package/src/styles/fonts/inter-cyrillic-variable-wghtOnly-normal.woff2 +0 -0
  311. package/src/styles/fonts/inter-greek-ext-variable-wghtOnly-normal.woff2 +0 -0
  312. package/src/styles/fonts/inter-greek-variable-wghtOnly-normal.woff2 +0 -0
  313. package/src/styles/fonts/inter-latin-ext-variable-wghtOnly-normal.woff2 +0 -0
  314. package/src/styles/fonts/inter-latin-variable-wghtOnly-normal.woff2 +0 -0
  315. package/src/styles/fonts/inter-vietnamese-variable-wghtOnly-normal.woff2 +0 -0
  316. package/src/styles/less/accordion.css +44 -22
  317. package/src/styles/less/addons/_background-utilities.less +0 -5
  318. package/src/styles/less/badge.css +2 -2
  319. package/src/styles/less/badge.less +2 -2
  320. package/src/styles/less/button-groups.css +6 -29
  321. package/src/styles/less/button-groups.less +2 -3
  322. package/src/styles/less/buttons.css +11 -35
  323. package/src/styles/less/buttons.less +7 -7
  324. package/src/styles/less/core/_fonts.less +75 -7
  325. package/src/styles/less/core/_scaffolding.less +4 -4
  326. package/src/styles/less/core/_typography-utilities.less +3 -3
  327. package/src/styles/less/core/_typography.less +235 -81
  328. package/src/styles/less/decision.css +44 -22
  329. package/src/styles/less/decision.less +2 -2
  330. package/src/styles/less/dropdowns.css +54 -39
  331. package/src/styles/less/dropdowns.less +7 -8
  332. package/src/styles/less/droppable.css +6 -28
  333. package/src/styles/less/droppable.less +4 -4
  334. package/src/styles/less/footer.css +10 -41
  335. package/src/styles/less/footer.less +3 -4
  336. package/src/styles/less/forms/bootstrap-forms.css +100 -153
  337. package/src/styles/less/forms/bootstrap-forms.less +72 -85
  338. package/src/styles/less/forms/checkbox-radio.css +3 -3
  339. package/src/styles/less/forms/checkbox-radio.less +3 -3
  340. package/src/styles/less/input-groups.css +167 -203
  341. package/src/styles/less/input-groups.less +10 -20
  342. package/src/styles/less/list-group.css +42 -1
  343. package/src/styles/less/list-group.less +5 -8
  344. package/src/styles/less/mixins/_reset-text.less +1 -1
  345. package/src/styles/less/mixins/_text-emphasis.less +1 -7
  346. package/src/styles/less/modals.css +1 -1
  347. package/src/styles/less/modals.less +1 -1
  348. package/src/styles/less/navbar.css +81 -66
  349. package/src/styles/less/navbar.less +19 -19
  350. package/src/styles/less/navs.css +8 -8
  351. package/src/styles/less/navs.less +8 -8
  352. package/src/styles/less/neptune-addons.css +0 -15
  353. package/src/styles/less/neptune-core.css +524 -5935
  354. package/src/styles/less/neptune.bundle.less +0 -4
  355. package/src/styles/less/neptune.css +2092 -8533
  356. package/src/styles/less/panels.css +2 -2
  357. package/src/styles/less/panels.less +2 -2
  358. package/src/styles/less/popovers.css +56 -39
  359. package/src/styles/less/popovers.less +7 -7
  360. package/src/styles/less/progress-bars.css +2 -2
  361. package/src/styles/less/progress-bars.less +2 -2
  362. package/src/styles/less/sequences.css +9 -14
  363. package/src/styles/less/sequences.less +10 -15
  364. package/src/styles/less/table.css +7 -7
  365. package/src/styles/less/table.less +7 -7
  366. package/src/styles/less/tooltip.css +6 -28
  367. package/src/styles/less/tooltip.less +1 -1
  368. package/src/styles/variables/legacy-variables.less +3 -3
  369. package/build/styles/Label/Label.css +0 -3
  370. package/src/Label/Label.css +0 -3
  371. package/src/Label/Label.less +0 -8
  372. package/src/styles/less/core/fonts/_fonts-ar.less +0 -140
  373. package/src/styles/less/core/fonts/_fonts-en.less +0 -99
  374. package/src/styles/less/core/fonts/_fonts-he.less +0 -8
  375. package/src/styles/less/core/fonts/_fonts-ja.less +0 -4247
  376. package/src/styles/less/core/fonts/_fonts-ko.less +0 -1079
  377. package/src/styles/less/core/fonts/_fonts-th.less +0 -8
  378. package/src/styles/less/core/fonts/_fonts-zh.less +0 -872
package/src/Body/Body.test.tsx CHANGED
@@ -9,7 +9,7 @@ describe('Body', () => {
9
9
  const copy = screen.getByText('Test');
10
10
  expect(copy).toBeInTheDocument();
11
11
  expect(copy.tagName).toBe('DIV');
12
- expect(copy).toHaveClass(`wds-text-${Typography.BODY_DEFAULT}`);
12
+ expect(copy).toHaveClass(`np-text-${Typography.BODY_DEFAULT}`);
13
13
  });
14
14
 
15
15
  it('enforces tag via `as` prop', () => {
@@ -17,7 +17,7 @@ describe('Body', () => {
17
17
  const copy = screen.getByText('Test');
18
18
  expect(copy).toBeInTheDocument();
19
19
  expect(copy.tagName).toBe('P');
20
- expect(copy).toHaveClass(`wds-text-${Typography.BODY_DEFAULT}`);
20
+ expect(copy).toHaveClass(`np-text-${Typography.BODY_DEFAULT}`);
21
21
  });
22
22
 
23
23
  it('supports native HTML attrs', () => {
@@ -35,7 +35,7 @@ describe('Body', () => {
35
35
  it('renders newlines as line breaks when preserveNewlines is true', () => {
36
36
  render(<Body preserveNewlines>{'Line 1.\nLine 2'}</Body>);
37
37
  const copy = screen.getByText(/Line 1\.\s*Line 2/);
38
- expect(copy).toHaveClass('wds-text--pre-line');
38
+ expect(copy).toHaveClass('np-text--pre-line');
39
39
  expect(copy).toHaveTextContent('Line 1.');
40
40
  expect(copy).toHaveTextContent('Line 2');
41
41
  });
@@ -47,6 +47,6 @@ describe('Body', () => {
47
47
  const copy = screen.getByText('Test');
48
48
  expect(copy).toBeInTheDocument();
49
49
  expect(copy.tagName).toBe('DIV');
50
- expect(copy).toHaveClass(`wds-text-${Typography.BODY_DEFAULT}`);
50
+ expect(copy).toHaveClass(`np-text-${Typography.BODY_DEFAULT}`);
51
51
  });
52
52
  });
package/src/Body/Body.tsx CHANGED
@@ -41,8 +41,8 @@ const Body = forwardRef(function Body(
41
41
  // See: https://fettblog.eu/typescript-react-generic-forward-refs/
42
42
  ref={reference}
43
43
  className={clsx(
44
- `wds-text-${isTypeSupported ? type : DEFAULT_TYPE}`,
45
- preserveNewlines && 'wds-text--pre-line',
44
+ `np-text-${isTypeSupported ? type : DEFAULT_TYPE}`,
45
+ preserveNewlines && 'np-text--pre-line',
46
46
  className,
47
47
  )}
48
48
  />
package/src/Button/_stories/Button.test.story.tsx CHANGED
@@ -250,7 +250,6 @@ export const RTLDiff: Story = {
250
250
  );
251
251
  },
252
252
  ...withRTLDiff({
253
- fixedRows: { heights: 'auto' },
254
253
  i18n: {
255
254
  startIcon: { en: 'Start icon', ar: 'أيقونة البداية' },
256
255
  endIcon: { en: 'End icon', ar: 'أيقونة النهاية' },
package/src/Calendar/Calendar.css CHANGED
@@ -7,7 +7,7 @@
7
7
  border: transparent;
8
8
  border-radius: var(--radius-small);
9
9
  background-color: transparent;
10
- font-weight: var(--wds-font-weight-title-screen);
10
+ font-weight: var(--font-weight-semi-bold);
11
11
  color: var(--color-content-primary);
12
12
  }
13
13
  @media (max-width: 320px) {
@@ -89,11 +89,10 @@
89
89
  text-decoration-color: var(--color-content-tertiary);
90
90
  }
91
91
  .wds-Calendar__option--day {
92
- --circleSize: var(--size-40);
93
- block-size: var(--circleSize);
94
- line-height: var(--circleSize);
95
- inline-size: var(--circleSize);
92
+ block-size: var(--size-40);
96
93
  border-radius: var(--radius-full);
94
+ line-height: var(--size-40);
95
+ inline-size: var(--size-40);
97
96
  padding: 0;
98
97
  display: inline-flex;
99
98
  align-items: center;
@@ -105,12 +104,6 @@
105
104
  text-decoration-thickness: 2px;
106
105
  text-underline-offset: 4px;
107
106
  }
108
- .wds-Calendar__option--year {
109
- display: inline-flex;
110
- align-items: center;
111
- justify-content: center;
112
- block-size: calc(1rlh * 1.6);
113
- }
114
107
  .tw-date-lookup-calendar {
115
108
  min-inline-size: 300px;
116
109
  text-align: center;
package/src/Calendar/DayCalendar/Table/DayCalendarTable.tsx CHANGED
@@ -134,8 +134,8 @@ class DayCalendarTable extends PureComponent<DayCalendarTableProps> {
134
134
  key={day}
135
135
  className={
136
136
  index > 4
137
- ? 'text-xs-center wds-text-body-default'
138
- : 'text-xs-center wds-text-body-default-bold'
137
+ ? 'text-xs-center np-text-body-default'
138
+ : 'text-xs-center np-text-body-default-bold'
139
139
  }
140
140
  >
141
141
  <span className="hidden-xs">
package/src/Calendar/MonthCalendar/Table/MonthCalendarTable.tsx CHANGED
@@ -76,7 +76,7 @@ const MonthCalendarTable = ({
76
76
  })();
77
77
 
78
78
  return (
79
- <table className="table table-condensed table-bordered tw-date-lookup-calendar wds-text-body-default-bold m-b-0">
79
+ <table className="table table-condensed table-bordered tw-date-lookup-calendar np-text-body-default-bold m-b-0">
80
80
  <thead className="sr-only">
81
81
  <tr>
82
82
  <th colSpan={COLS}>{placeholder}</th>
package/src/Calendar/TableLink/TableLink.css CHANGED
@@ -7,7 +7,7 @@
7
7
  border: transparent;
8
8
  border-radius: var(--radius-small);
9
9
  background-color: transparent;
10
- font-weight: var(--wds-font-weight-title-screen);
10
+ font-weight: var(--font-weight-semi-bold);
11
11
  color: var(--color-content-primary);
12
12
  }
13
13
  @media (max-width: 320px) {
@@ -89,11 +89,10 @@
89
89
  text-decoration-color: var(--color-content-tertiary);
90
90
  }
91
91
  .wds-Calendar__option--day {
92
- --circleSize: var(--size-40);
93
- block-size: var(--circleSize);
94
- line-height: var(--circleSize);
95
- inline-size: var(--circleSize);
92
+ block-size: var(--size-40);
96
93
  border-radius: var(--radius-full);
94
+ line-height: var(--size-40);
95
+ inline-size: var(--size-40);
97
96
  padding: 0;
98
97
  display: inline-flex;
99
98
  align-items: center;
@@ -105,9 +104,3 @@
105
104
  text-decoration-thickness: 2px;
106
105
  text-underline-offset: 4px;
107
106
  }
108
- .wds-Calendar__option--year {
109
- display: inline-flex;
110
- align-items: center;
111
- justify-content: center;
112
- block-size: calc(1rlh * 1.6);
113
- }
package/src/Calendar/TableLink/TableLink.less CHANGED
@@ -11,7 +11,7 @@
11
11
  border: transparent;
12
12
  border-radius: var(--radius-small);
13
13
  background-color: transparent;
14
- font-weight: var(--wds-font-weight-title-screen);
14
+ font-weight: var(--font-weight-semi-bold);
15
15
  color: var(--color-content-primary);
16
16
 
17
17
  &:focus {
@@ -51,11 +51,10 @@
51
51
  }
52
52
 
53
53
  .wds-Calendar__option--day {
54
- --circleSize: var(--size-40);
55
- height: var(--circleSize);
56
- line-height: var(--circleSize);
57
- width: var(--circleSize);
54
+ height: var(--size-40);
58
55
  border-radius: var(--radius-full);
56
+ line-height: var(--size-40);
57
+ width: var(--size-40);
59
58
  padding: 0;
60
59
  display: inline-flex;
61
60
  align-items: center;
@@ -67,12 +66,3 @@
67
66
  text-underline-offset: 4px;
68
67
  }
69
68
  }
70
-
71
- .wds-Calendar__option--year{
72
- display: inline-flex;
73
- align-items: center;
74
- justify-content: center;
75
- height: calc(1rlh * 1.6);
76
- }
77
-
78
-
package/src/Calendar/TableLink/TableLink.tsx CHANGED
@@ -96,7 +96,7 @@ const TableLink = ({
96
96
  aria-pressed={active}
97
97
  className={clsx(
98
98
  `wds-Calendar__option--${type}`,
99
- `tw-date-lookup-${type}-option wds-text-body-default-bold`,
99
+ `tw-date-lookup-${type}-option np-text-body-default-bold`,
100
100
  { active: !!active },
101
101
  { today: !!today },
102
102
  { disabled: !!isUnavailable },
package/src/Calendar/_stories/Calendar.test.story.tsx CHANGED
@@ -166,7 +166,6 @@ export const RTLDiff: Story = {
166
166
  });
167
167
  },
168
168
  ...withRTLDiff({
169
- fixedRows: { heights: 'auto' },
170
169
  i18n: {
171
170
  disabledReason: {
172
171
  en: 'Weekends and specific dates are unavailable.',
package/src/Chips/Chip/Chip.css CHANGED
@@ -70,7 +70,7 @@
70
70
  border-color: var(--color-sentiment-negative-active) !important;
71
71
  }
72
72
  .np-theme-personal .np-chip {
73
- font-weight: var(--wds-font-weight-body-bold);
73
+ font-weight: var(--font-weight-semi-bold);
74
74
  color: var(--color-interactive-primary);
75
75
  padding-block: 0;
76
76
  padding-inline: var(--size-16);
@@ -114,13 +114,11 @@
114
114
  .np-theme-personal .np-chip.np-chip--removable {
115
115
  position: relative;
116
116
  }
117
- .np-theme-personal .np-chip.np-chip--removable .np-text-body-default-bold,
118
- .np-theme-personal .np-chip.np-chip--removable .wds-text-body-default-bold {
117
+ .np-theme-personal .np-chip.np-chip--removable .np-text-body-default-bold {
119
118
  padding-inline-end: var(--size-24);
120
119
  }
121
120
  @media (max-width: 320px) {
122
- .np-theme-personal .np-chip.np-chip--removable .np-text-body-default-bold,
123
- .np-theme-personal .np-chip.np-chip--removable .wds-text-body-default-bold {
121
+ .np-theme-personal .np-chip.np-chip--removable .np-text-body-default-bold {
124
122
  padding-inline-end: var(--size-48);
125
123
  }
126
124
  }
package/src/Chips/Chip/Chip.less CHANGED
@@ -90,7 +90,7 @@
90
90
  }
91
91
 
92
92
  .np-theme-personal & {
93
- font-weight: var(--wds-font-weight-body-bold);
93
+ font-weight: var(--font-weight-semi-bold);
94
94
  color: var(--color-interactive-primary);
95
95
  padding: 0 var(--size-16);
96
96
  border-color: var(--color-interactive-secondary);
@@ -137,8 +137,7 @@
137
137
  &.np-chip--removable {
138
138
  position: relative;
139
139
 
140
- .np-text-body-default-bold,
141
- .wds-text-body-default-bold {
140
+ .np-text-body-default-bold {
142
141
  padding-right: var(--size-24);
143
142
 
144
143
  @media (--screen-400-zoom) {
package/src/CircularButton/_stories/CircularButton.story.tsx CHANGED
@@ -232,8 +232,13 @@ export const SentimentAwareness: Story = {
232
232
  style={{ display: 'flex', alignItems: 'center', padding: '8px 0', gap: '8px' }}
233
233
  >
234
234
  <div
235
- className="wds-text-body-default-bold p-l-1 text-align-left"
236
- style={{ width: '12ch' }}
235
+ style={{
236
+ width: '120px',
237
+ fontSize: '11px',
238
+ fontWeight: 'bold',
239
+ textAlign: 'left',
240
+ paddingLeft: '8px',
241
+ }}
237
242
  >
238
243
  {sentiment} (base)
239
244
  </div>
@@ -241,7 +246,7 @@ export const SentimentAwareness: Story = {
241
246
  <div
242
247
  key={button.label}
243
248
  style={{
244
- width: '13ch',
249
+ width: '100px',
245
250
  display: 'flex',
246
251
  justifyContent: 'center',
247
252
  }}
@@ -265,8 +270,13 @@ export const SentimentAwareness: Story = {
265
270
  style={{ display: 'flex', alignItems: 'center', padding: '8px 0', gap: '8px' }}
266
271
  >
267
272
  <div
268
- className="wds-text-body-default-bold p-l-1 text-align-left"
269
- style={{ width: '12ch' }}
273
+ style={{
274
+ width: '120px',
275
+ fontSize: '11px',
276
+ fontWeight: 'bold',
277
+ textAlign: 'left',
278
+ paddingLeft: '8px',
279
+ }}
270
280
  >
271
281
  {sentiment} (elevated)
272
282
  </div>
@@ -274,7 +284,7 @@ export const SentimentAwareness: Story = {
274
284
  <div
275
285
  key={button.label}
276
286
  style={{
277
- width: '13ch',
287
+ width: '100px',
278
288
  display: 'flex',
279
289
  justifyContent: 'center',
280
290
  }}
package/src/DateInput/_stories/DateInput.rtl.test.story.tsx CHANGED
@@ -16,7 +16,7 @@ export const Sizes: Story = {
16
16
  render: () => {
17
17
  const i18n = useRtlDiffI18n();
18
18
  return (
19
- <div>
19
+ <>
20
20
  <DateInput
21
21
  size="sm"
22
22
  dayLabel={i18n.dayLabel}
@@ -44,12 +44,11 @@ export const Sizes: Story = {
44
44
  yearLabel={i18n.yearLabel}
45
45
  onChange={fn()}
46
46
  />
47
- </div>
47
+ </>
48
48
  );
49
49
  },
50
50
  ...withRTLDiff({
51
51
  renderAs: 'iframe',
52
- fixedRows: { heights: [6, 7, 9] },
53
52
  i18n: {
54
53
  dayLabel: { en: 'Day', ar: 'اليوم' },
55
54
  monthLabel: { en: 'Month', ar: 'الشهر' },
package/src/DateInput/_stories/DateInput.story.tsx CHANGED
@@ -37,6 +37,5 @@ export const Basic: Story = {
37
37
  onChange: fn(),
38
38
  onBlur: fn(),
39
39
  onFocus: fn(),
40
- size: 'lg',
41
40
  },
42
41
  } satisfies Story;
package/src/Decision/Decision.css CHANGED
@@ -1,10 +1,9 @@
1
1
  .np-decision .decision {
2
2
  display: flex;
3
3
  }
4
- .np-decision__tile--small .np-text-title-subsection,
5
- .np-decision__tile--small .wds-text-title-subsection {
6
- font-size: var(--wds-font-size-body-large);
7
- line-height: var(--wds-line-height-body-large);
4
+ .np-decision__tile--small .np-text-title-subsection {
5
+ font-size: var(--font-size-16);
6
+ line-height: var(--line-height-title);
8
7
  }
9
8
  .np-decision:not(.flex-column) {
10
9
  gap: var(--size-24);
package/src/Decision/Decision.less CHANGED
@@ -4,10 +4,9 @@
4
4
  }
5
5
 
6
6
  &__tile--small {
7
- .np-text-title-subsection,
8
- .wds-text-title-subsection {
9
- font-size: var(--wds-font-size-body-large);
10
- line-height: var(--wds-line-height-body-large);
7
+ .np-text-title-subsection {
8
+ font-size: var(--font-size-16);
9
+ line-height: var(--line-height-title);
11
10
  }
12
11
  }
13
12
 
package/src/Decision/_stories/Decision.test.story.tsx CHANGED
@@ -50,7 +50,7 @@ export const RTLDiff: Story = {
50
50
  ];
51
51
 
52
52
  return (
53
- <div>
53
+ <>
54
54
  <Decision
55
55
  options={options}
56
56
  presentation={DecisionPresentation.LIST}
@@ -80,11 +80,10 @@ export const RTLDiff: Story = {
80
80
  type={DecisionType.NAVIGATION}
81
81
  size={Size.MEDIUM}
82
82
  />
83
- </div>
83
+ </>
84
84
  );
85
85
  },
86
86
  ...withRTLDiff({
87
- fixedRows: { heights: 'auto' },
88
87
  i18n: {
89
88
  sendTitle: { en: 'Send money', ar: 'إرسال الأموال' },
90
89
  sendDescription: { en: 'Fast international transfers.', ar: 'تحويلات دولية سريعة.' },
package/src/DefinitionList/_stories/DefinitionList.story.tsx CHANGED
@@ -32,7 +32,7 @@ const definitions = [
32
32
  },
33
33
  {
34
34
  title: 'Use wrapper elements to style',
35
- value: <span className="wds-text-title-subsection">89.45GBP</span>,
35
+ value: <span className="np-text-title-subsection">89.45GBP</span>,
36
36
  key: 'second',
37
37
  },
38
38
  {
package/src/DefinitionList/_stories/DefinitionList.test.story.tsx CHANGED
@@ -222,7 +222,7 @@ export const RTLDiff: Story = {
222
222
  );
223
223
  },
224
224
  ...withRTLDiff({
225
- fixedRows: { heights: 'auto' },
225
+ fixedRows: { heights: [8, 11, 8, 8, 8, 10, 12, 8, 8, 8] },
226
226
  i18n: {
227
227
  fullName: { en: 'Full name', ar: 'الاسم الكامل' },
228
228
  customerName: { en: 'Alice Smith', ar: 'أليس سميث' },
package/src/Display/_stories/Display.story.tsx CHANGED
@@ -118,40 +118,26 @@ export const Basic = () => {
118
118
  export const Numbers = () => {
119
119
  return (
120
120
  <>
121
- <Title type={Typography.TITLE_SCREEN}>Display Number Small</Title>
121
+ <Title type={Typography.TITLE_SCREEN}>Display Number</Title>
122
122
  <hr />
123
- <Display type={Typography.DISPLAY_NUMBER_SMALL}>
123
+ <Display type={Typography.DISPLAY_NUMBER}>
124
124
  <Money amount={1050.6} currency="UAH" />
125
125
  </Display>
126
126
  <hr />
127
- <Display type={Typography.DISPLAY_NUMBER_SMALL}>
127
+ <Display type={Typography.DISPLAY_NUMBER}>
128
128
  <Money amount={10.17} currency="JPY" />
129
129
  </Display>
130
-
131
- <Title type={Typography.TITLE_SCREEN}>Display Number Medium</Title>
132
130
  <hr />
133
- <Display type={Typography.DISPLAY_NUMBER_MEDIUM}>
131
+ <Display type={Typography.DISPLAY_NUMBER}>
134
132
  <Money amount={0.01} currency="EUR" />
135
133
  </Display>
136
134
  <hr />
137
- <Display type={Typography.DISPLAY_NUMBER_MEDIUM}>
135
+ <Display type={Typography.DISPLAY_NUMBER}>
138
136
  <Money amount={1000000} currency="EUR" />
139
137
  </Display>
140
-
141
- <Title type={Typography.TITLE_SCREEN}>Display Number Large</Title>
142
- <hr />
143
- <Display type={Typography.DISPLAY_NUMBER_LARGE}>
144
- <Money amount={1000000} currency="GBP" />
145
- </Display>
146
- <hr />
147
- <Display type={Typography.DISPLAY_NUMBER_LARGE}>
148
- <Money amount={1050.6} currency="UAH" />
149
- </Display>
150
-
151
- <Title type={Typography.TITLE_SCREEN}>Display Number (Deprecated)</Title>
152
138
  <hr />
153
139
  <Display type={Typography.DISPLAY_NUMBER}>
154
- <Money amount={1050.6} currency="UAH" />
140
+ <Money amount={1000000} currency="GBP" />
155
141
  </Display>
156
142
  </>
157
143
  );
package/src/Emphasis/Emphasis.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .emphasis {
2
- font-weight: var(--wds-font-weight-body-bold);
2
+ font-weight: var(--font-weight-semi-bold);
3
3
  font-style: normal;
4
4
  }
5
5
  .emphasis--important {
package/src/Emphasis/Emphasis.less CHANGED
@@ -1,5 +1,5 @@
1
1
  .emphasis {
2
- font-weight: var(--wds-font-weight-body-bold);
2
+ font-weight: var(--font-weight-semi-bold);
3
3
  font-style: normal;
4
4
  }
5
5
 
package/src/ExpressiveMoneyInput/AmountInput/AmountInput.css CHANGED
@@ -2,7 +2,6 @@
2
2
  inline-size: 100%;
3
3
  }
4
4
  .wds-amount-input-input-container {
5
- font-family: var(--wds-font-family-display-number);
6
5
  display: flex;
7
6
  justify-content: right;
8
7
  inline-size: 100%;
@@ -37,5 +36,5 @@
37
36
  flex-grow: 0;
38
37
  display: flex;
39
38
  align-items: center;
40
- line-height: 1em;
39
+ line-height: inherit;
41
40
  }
package/src/ExpressiveMoneyInput/AmountInput/AmountInput.less CHANGED
@@ -4,7 +4,6 @@
4
4
  }
5
5
 
6
6
  &-input-container {
7
- font-family: var(--wds-font-family-display-number);
8
7
  display: flex;
9
8
  justify-content: right;
10
9
  width: 100%;
@@ -48,6 +47,6 @@
48
47
  flex-grow: 0;
49
48
  display: flex;
50
49
  align-items: center;
51
- line-height: 1em;
50
+ line-height: inherit;
52
51
  }
53
52
  }
package/src/ExpressiveMoneyInput/AmountInput/AmountInput.tsx CHANGED
@@ -297,7 +297,10 @@ export const AmountInput = ({
297
297
 
298
298
  return (
299
299
  <div className="wds-amount-input-container" dir="ltr">
300
- <div className={clsx('wds-amount-input-input-container')} style={style}>
300
+ <div
301
+ className={clsx('wds-amount-input-input-container', 'np-text-display-large--forced')}
302
+ style={style}
303
+ >
301
304
  <input
302
305
  ref={ref}
303
306
  dir="auto"
package/src/ExpressiveMoneyInput/ExpressiveMoneyInput.css CHANGED
@@ -2,7 +2,6 @@
2
2
  inline-size: 100%;
3
3
  }
4
4
  .wds-amount-input-input-container {
5
- font-family: var(--wds-font-family-display-number);
6
5
  display: flex;
7
6
  justify-content: right;
8
7
  inline-size: 100%;
@@ -37,7 +36,7 @@
37
36
  flex-grow: 0;
38
37
  display: flex;
39
38
  align-items: center;
40
- line-height: 1em;
39
+ line-height: inherit;
41
40
  }
42
41
  .wds-currency-selector:disabled {
43
42
  opacity: 1 !important;
package/src/ExpressiveMoneyInput/_stories/ExpressiveMoneyInput.rtl.test.story.tsx CHANGED
@@ -27,7 +27,7 @@ export const TriggerVariants: Story = {
27
27
  render: () => {
28
28
  const i18n = useRtlDiffI18n();
29
29
  return (
30
- <div>
30
+ <>
31
31
  {/* Currency selector on leading side — flips in RTL */}
32
32
  <ExpressiveMoneyInput
33
33
  label={i18n.youSend}
@@ -90,11 +90,10 @@ export const TriggerVariants: Story = {
90
90
  }}
91
91
  onAmountChange={fn()}
92
92
  />
93
- </div>
93
+ </>
94
94
  );
95
95
  },
96
96
  ...withRTLDiff({
97
- fixedRows: { heights: [8, 8, 10, 8] },
98
97
  renderAs: 'iframe',
99
98
  width: 'stretch',
100
99
  i18n: {
package/src/Field/_stories/Field.test.story.tsx CHANGED
@@ -61,7 +61,7 @@ export const RTLDiff: Story = {
61
61
  render: () => {
62
62
  const i18n = useRtlDiffI18n();
63
63
  return (
64
- <div>
64
+ <>
65
65
  <Field label="Localised placeholder">
66
66
  <Input placeholder={i18n.placeholder_ar} />
67
67
  </Field>
@@ -107,11 +107,10 @@ export const RTLDiff: Story = {
107
107
  <Field label={i18n.textareaLabel} required={false} description={i18n.maxChars}>
108
108
  <TextArea maxLength={100} defaultValue={i18n.textareaValue} />
109
109
  </Field>
110
- </div>
110
+ </>
111
111
  );
112
112
  },
113
113
  ...withRTLDiff({
114
- fixedRows: { heights: 'auto' },
115
114
  width: 'stretch',
116
115
  i18n: {
117
116
  placeholder_en: { en: 'LTR placeholder...', ar: 'LTR placeholder...' },
package/src/FlowNavigation/AnimatedLabel/AnimatedLabel.tsx CHANGED
@@ -40,7 +40,7 @@ const AnimatedLabel = ({ activeLabel, className, steps }: AnimatedLabelProps) =>
40
40
  className={clsx(
41
41
  'np-animated-label',
42
42
  'btn-unstyled',
43
- 'wds-text-body-large-bold',
43
+ 'np-text-body-large-bold',
44
44
  className,
45
45
  )}
46
46
  onClick={() => setShowSteps(true)}
package/src/Header/_stories/Header.test.story.tsx CHANGED
@@ -151,7 +151,7 @@ export const RTLDiff: Story = {
151
151
  );
152
152
  },
153
153
  ...withRTLDiff({
154
- fixedRows: { heights: 'auto', hideSeparators: true },
154
+ fixedRows: { heights: [4, 4, 5, 5], hideSeparators: true },
155
155
  i18n: {
156
156
  groupWithoutAction: { en: 'Group level without action', ar: 'مستوى المجموعة بدون إجراء' },
157
157
  groupWithAction: { en: 'Group level with action', ar: 'مستوى المجموعة مع إجراء' },
package/src/InputWithDisplayFormat/_stories/InputWithDisplayFormat.test.story.tsx CHANGED
@@ -38,7 +38,7 @@ export const RTLDiff: StoryObj<typeof InputWithDisplayFormat> = {
38
38
  const i18n = useRtlDiffI18n();
39
39
 
40
40
  return (
41
- <div>
41
+ <>
42
42
  <Field id="empty" label="Empty with placeholder">
43
43
  <InputWithDisplayFormat
44
44
  id="empty"
@@ -66,11 +66,10 @@ export const RTLDiff: StoryObj<typeof InputWithDisplayFormat> = {
66
66
  onChange={() => {}}
67
67
  />
68
68
  </Field>
69
- </div>
69
+ </>
70
70
  );
71
71
  },
72
72
  ...withRTLDiff({
73
- fixedRows: { heights: 'auto' },
74
73
  width: 'stretch',
75
74
  i18n: {
76
75
  value: {