@laerdal/life-react-components 6.0.0-dev.19.full → 6.0.0-dev.2.full

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 (421) hide show
  1. package/dist/Accordion/ContentAccordion.cjs +11 -40
  2. package/dist/Accordion/ContentAccordion.cjs.map +1 -1
  3. package/dist/Accordion/ContentAccordion.js +11 -40
  4. package/dist/Accordion/ContentAccordion.js.map +1 -1
  5. package/dist/Accordion/styles.cjs +13 -51
  6. package/dist/Accordion/styles.cjs.map +1 -1
  7. package/dist/Accordion/styles.js +13 -51
  8. package/dist/Accordion/styles.js.map +1 -1
  9. package/dist/Banners/Banner.cjs +34 -38
  10. package/dist/Banners/Banner.cjs.map +1 -1
  11. package/dist/Banners/Banner.d.ts +3 -2
  12. package/dist/Banners/Banner.js +34 -38
  13. package/dist/Banners/Banner.js.map +1 -1
  14. package/dist/Banners/styles.cjs +16 -8
  15. package/dist/Banners/styles.cjs.map +1 -1
  16. package/dist/Banners/styles.js +16 -8
  17. package/dist/Banners/styles.js.map +1 -1
  18. package/dist/Breadcrumb/Breadcrumb.cjs +2 -8
  19. package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -1
  20. package/dist/Breadcrumb/Breadcrumb.js +2 -8
  21. package/dist/Breadcrumb/Breadcrumb.js.map +1 -1
  22. package/dist/Breadcrumb/styles.cjs +4 -15
  23. package/dist/Breadcrumb/styles.cjs.map +1 -1
  24. package/dist/Breadcrumb/styles.js +4 -15
  25. package/dist/Breadcrumb/styles.js.map +1 -1
  26. package/dist/Button/BackButton.cjs +6 -27
  27. package/dist/Button/BackButton.cjs.map +1 -1
  28. package/dist/Button/BackButton.js +6 -27
  29. package/dist/Button/BackButton.js.map +1 -1
  30. package/dist/Button/Button.cjs +47 -179
  31. package/dist/Button/Button.cjs.map +1 -1
  32. package/dist/Button/Button.d.ts +0 -2
  33. package/dist/Button/Button.js +47 -179
  34. package/dist/Button/Button.js.map +1 -1
  35. package/dist/Button/Iconbutton.cjs +21 -83
  36. package/dist/Button/Iconbutton.cjs.map +1 -1
  37. package/dist/Button/Iconbutton.js +21 -83
  38. package/dist/Button/Iconbutton.js.map +1 -1
  39. package/dist/Card/HorizontalCard/HorizontalCard.cjs +5 -20
  40. package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
  41. package/dist/Card/HorizontalCard/HorizontalCard.js +5 -20
  42. package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
  43. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +3 -12
  44. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +1 -1
  45. package/dist/Card/HorizontalCard/HorizontalCardBody.js +3 -12
  46. package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +1 -1
  47. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +2 -8
  48. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +1 -1
  49. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +2 -8
  50. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +1 -1
  51. package/dist/Card/VerticalCard/Card.cjs +5 -20
  52. package/dist/Card/VerticalCard/Card.cjs.map +1 -1
  53. package/dist/Card/VerticalCard/Card.js +5 -20
  54. package/dist/Card/VerticalCard/Card.js.map +1 -1
  55. package/dist/Card/VerticalCard/CardBottomSection.cjs +7 -28
  56. package/dist/Card/VerticalCard/CardBottomSection.cjs.map +1 -1
  57. package/dist/Card/VerticalCard/CardBottomSection.js +7 -28
  58. package/dist/Card/VerticalCard/CardBottomSection.js.map +1 -1
  59. package/dist/Card/VerticalCard/CardMiddleSection.cjs +4 -19
  60. package/dist/Card/VerticalCard/CardMiddleSection.cjs.map +1 -1
  61. package/dist/Card/VerticalCard/CardMiddleSection.js +4 -19
  62. package/dist/Card/VerticalCard/CardMiddleSection.js.map +1 -1
  63. package/dist/Card/VerticalCard/CardTopSection.cjs +2 -9
  64. package/dist/Card/VerticalCard/CardTopSection.cjs.map +1 -1
  65. package/dist/Card/VerticalCard/CardTopSection.js +2 -9
  66. package/dist/Card/VerticalCard/CardTopSection.js.map +1 -1
  67. package/dist/Chips/ChipStyles.cjs +1 -4
  68. package/dist/Chips/ChipStyles.cjs.map +1 -1
  69. package/dist/Chips/ChipStyles.js +1 -4
  70. package/dist/Chips/ChipStyles.js.map +1 -1
  71. package/dist/ChipsInput/ChipInputField.cjs +4 -16
  72. package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
  73. package/dist/ChipsInput/ChipInputField.js +4 -16
  74. package/dist/ChipsInput/ChipInputField.js.map +1 -1
  75. package/dist/Dropdown/BasicDropdown.cjs +3 -12
  76. package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
  77. package/dist/Dropdown/BasicDropdown.js +3 -12
  78. package/dist/Dropdown/BasicDropdown.js.map +1 -1
  79. package/dist/Dropdown/CommonStyling.cjs +42 -172
  80. package/dist/Dropdown/CommonStyling.cjs.map +1 -1
  81. package/dist/Dropdown/CommonStyling.js +42 -172
  82. package/dist/Dropdown/CommonStyling.js.map +1 -1
  83. package/dist/Dropdown/DropdownContent.cjs +10 -36
  84. package/dist/Dropdown/DropdownContent.cjs.map +1 -1
  85. package/dist/Dropdown/DropdownContent.js +10 -36
  86. package/dist/Dropdown/DropdownContent.js.map +1 -1
  87. package/dist/Dropdown/DropdownFilter.cjs +3 -12
  88. package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
  89. package/dist/Dropdown/DropdownFilter.js +3 -12
  90. package/dist/Dropdown/DropdownFilter.js.map +1 -1
  91. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs +1 -4
  92. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
  93. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js +1 -4
  94. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
  95. package/dist/GlobalNavigationBar/Logo.cjs +1 -2
  96. package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
  97. package/dist/GlobalNavigationBar/Logo.js +1 -2
  98. package/dist/GlobalNavigationBar/Logo.js.map +1 -1
  99. package/dist/GlobalNavigationBar/desktop/MainMenu.cjs +1 -8
  100. package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -1
  101. package/dist/GlobalNavigationBar/desktop/MainMenu.js +1 -8
  102. package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -1
  103. package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs +2 -3
  104. package/dist/GlobalNavigationBar/desktop/RightSideNav.cjs.map +1 -1
  105. package/dist/GlobalNavigationBar/desktop/RightSideNav.js +2 -3
  106. package/dist/GlobalNavigationBar/desktop/RightSideNav.js.map +1 -1
  107. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +1 -4
  108. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -1
  109. package/dist/GlobalNavigationBar/desktop/UserMenu.js +1 -4
  110. package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -1
  111. package/dist/GlobalNavigationBar/mobile/CommonStyles.cjs.map +1 -1
  112. package/dist/GlobalNavigationBar/mobile/CommonStyles.js.map +1 -1
  113. package/dist/HyperLink/HyperLink.cjs +2 -14
  114. package/dist/HyperLink/HyperLink.cjs.map +1 -1
  115. package/dist/HyperLink/HyperLink.d.ts +0 -2
  116. package/dist/HyperLink/HyperLink.js +2 -14
  117. package/dist/HyperLink/HyperLink.js.map +1 -1
  118. package/dist/HyperLink/styling.cjs +8 -38
  119. package/dist/HyperLink/styling.cjs.map +1 -1
  120. package/dist/HyperLink/styling.js +8 -38
  121. package/dist/HyperLink/styling.js.map +1 -1
  122. package/dist/InputFields/Checkbox.cjs +14 -54
  123. package/dist/InputFields/Checkbox.cjs.map +1 -1
  124. package/dist/InputFields/Checkbox.js +14 -54
  125. package/dist/InputFields/Checkbox.js.map +1 -1
  126. package/dist/InputFields/DatepickerField.cjs +43 -149
  127. package/dist/InputFields/DatepickerField.cjs.map +1 -1
  128. package/dist/InputFields/DatepickerField.d.ts +1 -1
  129. package/dist/InputFields/DatepickerField.js +44 -150
  130. package/dist/InputFields/DatepickerField.js.map +1 -1
  131. package/dist/InputFields/DatepickerFieldHeader.cjs +5 -20
  132. package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
  133. package/dist/InputFields/DatepickerFieldHeader.js +5 -20
  134. package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
  135. package/dist/InputFields/Label.cjs +11 -38
  136. package/dist/InputFields/Label.cjs.map +1 -1
  137. package/dist/InputFields/Label.js +11 -38
  138. package/dist/InputFields/Label.js.map +1 -1
  139. package/dist/InputFields/NumberField.cjs +16 -66
  140. package/dist/InputFields/NumberField.cjs.map +1 -1
  141. package/dist/InputFields/NumberField.js +16 -66
  142. package/dist/InputFields/NumberField.js.map +1 -1
  143. package/dist/InputFields/PasswordField.cjs +1 -4
  144. package/dist/InputFields/PasswordField.cjs.map +1 -1
  145. package/dist/InputFields/PasswordField.d.ts +1 -1
  146. package/dist/InputFields/PasswordField.js +1 -4
  147. package/dist/InputFields/PasswordField.js.map +1 -1
  148. package/dist/InputFields/QuickSearch.cjs +6 -30
  149. package/dist/InputFields/QuickSearch.cjs.map +1 -1
  150. package/dist/InputFields/QuickSearch.js +6 -30
  151. package/dist/InputFields/QuickSearch.js.map +1 -1
  152. package/dist/InputFields/RadioButton.cjs +15 -63
  153. package/dist/InputFields/RadioButton.cjs.map +1 -1
  154. package/dist/InputFields/RadioButton.js +15 -63
  155. package/dist/InputFields/RadioButton.js.map +1 -1
  156. package/dist/InputFields/RichTextField.cjs +15 -60
  157. package/dist/InputFields/RichTextField.cjs.map +1 -1
  158. package/dist/InputFields/RichTextField.js +15 -60
  159. package/dist/InputFields/RichTextField.js.map +1 -1
  160. package/dist/InputFields/SearchBar.cjs +1 -4
  161. package/dist/InputFields/SearchBar.cjs.map +1 -1
  162. package/dist/InputFields/SearchBar.js +1 -4
  163. package/dist/InputFields/SearchBar.js.map +1 -1
  164. package/dist/InputFields/TextField.cjs +3 -9
  165. package/dist/InputFields/TextField.cjs.map +1 -1
  166. package/dist/InputFields/TextField.d.ts +1 -1
  167. package/dist/InputFields/TextField.js +3 -9
  168. package/dist/InputFields/TextField.js.map +1 -1
  169. package/dist/InputFields/Textarea.cjs +17 -68
  170. package/dist/InputFields/Textarea.cjs.map +1 -1
  171. package/dist/InputFields/Textarea.js +17 -68
  172. package/dist/InputFields/Textarea.js.map +1 -1
  173. package/dist/InputFields/components/SearchBarInput.cjs +7 -28
  174. package/dist/InputFields/components/SearchBarInput.cjs.map +1 -1
  175. package/dist/InputFields/components/SearchBarInput.js +7 -28
  176. package/dist/InputFields/components/SearchBarInput.js.map +1 -1
  177. package/dist/InputFields/components/SearchField.cjs +15 -60
  178. package/dist/InputFields/components/SearchField.cjs.map +1 -1
  179. package/dist/InputFields/components/SearchField.js +15 -60
  180. package/dist/InputFields/components/SearchField.js.map +1 -1
  181. package/dist/InputFields/styling.cjs +39 -95
  182. package/dist/InputFields/styling.cjs.map +1 -1
  183. package/dist/InputFields/styling.d.ts +2 -1
  184. package/dist/InputFields/styling.js +39 -95
  185. package/dist/InputFields/styling.js.map +1 -1
  186. package/dist/LinearProgress/LinearProgress.cjs +53 -161
  187. package/dist/LinearProgress/LinearProgress.cjs.map +1 -1
  188. package/dist/LinearProgress/LinearProgress.js +53 -161
  189. package/dist/LinearProgress/LinearProgress.js.map +1 -1
  190. package/dist/List/ListRow.cjs +9 -36
  191. package/dist/List/ListRow.cjs.map +1 -1
  192. package/dist/List/ListRow.js +9 -36
  193. package/dist/List/ListRow.js.map +1 -1
  194. package/dist/LoadingIndicator/LoadingIndicator.cjs +1 -4
  195. package/dist/LoadingIndicator/LoadingIndicator.cjs.map +1 -1
  196. package/dist/LoadingIndicator/LoadingIndicator.js +1 -4
  197. package/dist/LoadingIndicator/LoadingIndicator.js.map +1 -1
  198. package/dist/LoadingPage/GlobalLoadingPage.cjs +1 -4
  199. package/dist/LoadingPage/GlobalLoadingPage.cjs.map +1 -1
  200. package/dist/LoadingPage/GlobalLoadingPage.js +1 -4
  201. package/dist/LoadingPage/GlobalLoadingPage.js.map +1 -1
  202. package/dist/MenuItem/MenuItem.cjs +26 -101
  203. package/dist/MenuItem/MenuItem.cjs.map +1 -1
  204. package/dist/MenuItem/MenuItem.js +26 -101
  205. package/dist/MenuItem/MenuItem.js.map +1 -1
  206. package/dist/MiniProductCard/MiniProductCard.cjs +1 -15
  207. package/dist/MiniProductCard/MiniProductCard.cjs.map +1 -1
  208. package/dist/MiniProductCard/MiniProductCard.d.ts +0 -1
  209. package/dist/MiniProductCard/MiniProductCard.js +1 -15
  210. package/dist/MiniProductCard/MiniProductCard.js.map +1 -1
  211. package/dist/Modals/Modal.cjs +1 -4
  212. package/dist/Modals/Modal.cjs.map +1 -1
  213. package/dist/Modals/Modal.js +1 -4
  214. package/dist/Modals/Modal.js.map +1 -1
  215. package/dist/Modals/ModalContent.cjs +6 -24
  216. package/dist/Modals/ModalContent.cjs.map +1 -1
  217. package/dist/Modals/ModalContent.js +6 -24
  218. package/dist/Modals/ModalContent.js.map +1 -1
  219. package/dist/Modals/ModalDialog.cjs +3 -12
  220. package/dist/Modals/ModalDialog.cjs.map +1 -1
  221. package/dist/Modals/ModalDialog.js +3 -12
  222. package/dist/Modals/ModalDialog.js.map +1 -1
  223. package/dist/Modals/ModalNote.cjs +4 -16
  224. package/dist/Modals/ModalNote.cjs.map +1 -1
  225. package/dist/Modals/ModalNote.js +4 -16
  226. package/dist/Modals/ModalNote.js.map +1 -1
  227. package/dist/Modals/ModalStyles.cjs +11 -44
  228. package/dist/Modals/ModalStyles.cjs.map +1 -1
  229. package/dist/Modals/ModalStyles.js +11 -44
  230. package/dist/Modals/ModalStyles.js.map +1 -1
  231. package/dist/NavItem/NavItem.cjs +2 -11
  232. package/dist/NavItem/NavItem.cjs.map +1 -1
  233. package/dist/NavItem/NavItem.js +2 -11
  234. package/dist/NavItem/NavItem.js.map +1 -1
  235. package/dist/NotificationDot/NotificationDot.cjs +2 -17
  236. package/dist/NotificationDot/NotificationDot.cjs.map +1 -1
  237. package/dist/NotificationDot/NotificationDot.js +2 -17
  238. package/dist/NotificationDot/NotificationDot.js.map +1 -1
  239. package/dist/Paginator/Paginator.cjs +29 -76
  240. package/dist/Paginator/Paginator.cjs.map +1 -1
  241. package/dist/Paginator/Paginator.js +29 -76
  242. package/dist/Paginator/Paginator.js.map +1 -1
  243. package/dist/Panel/Panel.cjs +1 -4
  244. package/dist/Panel/Panel.cjs.map +1 -1
  245. package/dist/Panel/Panel.js +1 -4
  246. package/dist/Panel/Panel.js.map +1 -1
  247. package/dist/Popover/Popover.cjs +3 -22
  248. package/dist/Popover/Popover.cjs.map +1 -1
  249. package/dist/Popover/Popover.js +3 -22
  250. package/dist/Popover/Popover.js.map +1 -1
  251. package/dist/ProfileButton/ProfileButton.cjs +2 -9
  252. package/dist/ProfileButton/ProfileButton.cjs.map +1 -1
  253. package/dist/ProfileButton/ProfileButton.js +2 -9
  254. package/dist/ProfileButton/ProfileButton.js.map +1 -1
  255. package/dist/SegmentControl/SegmentControl.cjs +11 -46
  256. package/dist/SegmentControl/SegmentControl.cjs.map +1 -1
  257. package/dist/SegmentControl/SegmentControl.js +11 -46
  258. package/dist/SegmentControl/SegmentControl.js.map +1 -1
  259. package/dist/SideMenu/SideMenuHeader.cjs +3 -12
  260. package/dist/SideMenu/SideMenuHeader.cjs.map +1 -1
  261. package/dist/SideMenu/SideMenuHeader.js +3 -12
  262. package/dist/SideMenu/SideMenuHeader.js.map +1 -1
  263. package/dist/Switcher/SwitcherMenuItem.cjs +1 -4
  264. package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -1
  265. package/dist/Switcher/SwitcherMenuItem.js +1 -4
  266. package/dist/Switcher/SwitcherMenuItem.js.map +1 -1
  267. package/dist/Table/TableFooter.cjs +2 -8
  268. package/dist/Table/TableFooter.cjs.map +1 -1
  269. package/dist/Table/TableFooter.js +2 -8
  270. package/dist/Table/TableFooter.js.map +1 -1
  271. package/dist/Table/TableStyles.cjs +33 -132
  272. package/dist/Table/TableStyles.cjs.map +1 -1
  273. package/dist/Table/TableStyles.js +33 -132
  274. package/dist/Table/TableStyles.js.map +1 -1
  275. package/dist/Tabs/HorizontalTabs.cjs +18 -68
  276. package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
  277. package/dist/Tabs/HorizontalTabs.js +18 -68
  278. package/dist/Tabs/HorizontalTabs.js.map +1 -1
  279. package/dist/Tabs/TabLink.cjs +1 -4
  280. package/dist/Tabs/TabLink.cjs.map +1 -1
  281. package/dist/Tabs/TabLink.js +1 -4
  282. package/dist/Tabs/TabLink.js.map +1 -1
  283. package/dist/Tabs/VerticalTabs.cjs +0 -1
  284. package/dist/Tabs/VerticalTabs.cjs.map +1 -1
  285. package/dist/Tabs/VerticalTabs.js +0 -1
  286. package/dist/Tabs/VerticalTabs.js.map +1 -1
  287. package/dist/Tag/Tag.cjs +2 -2
  288. package/dist/Tag/Tag.cjs.map +1 -1
  289. package/dist/Tag/Tag.js +2 -2
  290. package/dist/Tag/Tag.js.map +1 -1
  291. package/dist/Tile/Tile.cjs +2 -8
  292. package/dist/Tile/Tile.cjs.map +1 -1
  293. package/dist/Tile/Tile.js +2 -8
  294. package/dist/Tile/Tile.js.map +1 -1
  295. package/dist/Tile/TileCommonItems.cjs +2 -8
  296. package/dist/Tile/TileCommonItems.cjs.map +1 -1
  297. package/dist/Tile/TileCommonItems.js +2 -8
  298. package/dist/Tile/TileCommonItems.js.map +1 -1
  299. package/dist/Tile/TileFooter.cjs +1 -4
  300. package/dist/Tile/TileFooter.cjs.map +1 -1
  301. package/dist/Tile/TileFooter.js +1 -4
  302. package/dist/Tile/TileFooter.js.map +1 -1
  303. package/dist/Tile/TileHeader.cjs +3 -12
  304. package/dist/Tile/TileHeader.cjs.map +1 -1
  305. package/dist/Tile/TileHeader.js +3 -12
  306. package/dist/Tile/TileHeader.js.map +1 -1
  307. package/dist/Toasters/Toast.cjs +13 -62
  308. package/dist/Toasters/Toast.cjs.map +1 -1
  309. package/dist/Toasters/Toast.js +13 -62
  310. package/dist/Toasters/Toast.js.map +1 -1
  311. package/dist/Toggles/ToggleButton.cjs +3 -9
  312. package/dist/Toggles/ToggleButton.cjs.map +1 -1
  313. package/dist/Toggles/ToggleButton.d.ts +1 -1
  314. package/dist/Toggles/ToggleButton.js +3 -9
  315. package/dist/Toggles/ToggleButton.js.map +1 -1
  316. package/dist/Toggles/TogglerStyles.cjs +8 -22
  317. package/dist/Toggles/TogglerStyles.cjs.map +1 -1
  318. package/dist/Toggles/TogglerStyles.js +8 -22
  319. package/dist/Toggles/TogglerStyles.js.map +1 -1
  320. package/dist/Tooltips/TooltipStyles.cjs +6 -28
  321. package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
  322. package/dist/Tooltips/TooltipStyles.js +6 -28
  323. package/dist/Tooltips/TooltipStyles.js.map +1 -1
  324. package/dist/common/InputStyling.cjs +7 -30
  325. package/dist/common/InputStyling.cjs.map +1 -1
  326. package/dist/common/InputStyling.js +7 -30
  327. package/dist/common/InputStyling.js.map +1 -1
  328. package/dist/custom.d.ts +0 -2
  329. package/dist/styles/colors.cjs +84 -439
  330. package/dist/styles/colors.cjs.map +1 -1
  331. package/dist/styles/colors.d.ts +11 -200
  332. package/dist/styles/colors.js +84 -439
  333. package/dist/styles/colors.js.map +1 -1
  334. package/dist/styles/global.cjs +2 -19
  335. package/dist/styles/global.cjs.map +1 -1
  336. package/dist/styles/global.d.ts +2 -3
  337. package/dist/styles/global.js +3 -18
  338. package/dist/styles/global.js.map +1 -1
  339. package/dist/styles/index.cjs +9 -21
  340. package/dist/styles/index.cjs.map +1 -1
  341. package/dist/styles/index.d.ts +2 -2
  342. package/dist/styles/index.js +6 -18
  343. package/dist/styles/index.js.map +1 -1
  344. package/package.json +141 -144
  345. package/dist/Accordion/__tests__/AccordionMenu.test.tsx +0 -42
  346. package/dist/Accordion/__tests__/ContentAccordion.test.tsx +0 -150
  347. package/dist/AuthPage/__tests__/AuthPage.test.tsx +0 -27
  348. package/dist/Banners/__tests__/Banner.test.tsx +0 -47
  349. package/dist/Banners/__tests__/OverviewBanner.test.tsx +0 -20
  350. package/dist/Breadcrumb/__tests__/Breadcrumb.test.tsx +0 -78
  351. package/dist/Button/__tests__/BackButton.test.tsx +0 -32
  352. package/dist/Button/__tests__/Button.test.tsx +0 -45
  353. package/dist/Button/__tests__/DualButton.test.tsx +0 -119
  354. package/dist/Card/HorizontalCard/__tests__/HorizontalCard.test.tsx +0 -71
  355. package/dist/Card/HorizontalCard/__tests__/VerticalCard.test.tsx +0 -124
  356. package/dist/Card/__tests__/Card.test.tsx +0 -146
  357. package/dist/Chips/__tests__/ActionChip.test.tsx +0 -94
  358. package/dist/Chips/__tests__/ChoiceChips.test.tsx +0 -79
  359. package/dist/Chips/__tests__/FilterChip.test.tsx +0 -95
  360. package/dist/Chips/__tests__/InputChip.test.tsx +0 -155
  361. package/dist/ChipsInput/__tests__/ChipDropdownInput.test.tsx +0 -100
  362. package/dist/ChipsInput/__tests__/ChipInputFields.test.tsx +0 -155
  363. package/dist/Dropdown/__tests__/DropdownFilter.test.tsx +0 -39
  364. package/dist/Footer/__tests__/Footer.test.tsx +0 -182
  365. package/dist/GlobalNavigationBar/__tests__/GlobalNavigationBar.tests.d.ts +0 -1
  366. package/dist/GlobalNavigationBar/__tests__/Logo.test.tsx +0 -39
  367. package/dist/GlobalNavigationBar/__tests__/Logo.tests.d.ts +0 -1
  368. package/dist/GlobalNavigationBar/desktop/__tests__/DesktopActions.test.tsx +0 -108
  369. package/dist/GlobalNavigationBar/desktop/__tests__/ExtendedMainMenu.test.tsx +0 -28
  370. package/dist/GlobalNavigationBar/desktop/__tests__/MainMenu.test.tsx +0 -55
  371. package/dist/GlobalNavigationBar/desktop/__tests__/RightSideNav.test.tsx +0 -45
  372. package/dist/GlobalNavigationBar/desktop/__tests__/UserMenu.test.tsx +0 -125
  373. package/dist/GlobalNavigationBar/mobile/__tests__/MobileMenu.test.tsx +0 -317
  374. package/dist/GlobalNavigationBar/mobile/__tests__/MobileMenuContent.test.tsx +0 -294
  375. package/dist/GlobalNavigationBar/mobile/__tests__/MobileMenuHeader.test.tsx +0 -195
  376. package/dist/InputFields/__tests__/NumberField.test.tsx +0 -67
  377. package/dist/InputFields/__tests__/NumberInput.test.tsx +0 -68
  378. package/dist/InputFields/__tests__/QuickSearch.test.tsx +0 -42
  379. package/dist/LinearProgress/__tests__/LinearProgress.test.tsx +0 -25
  380. package/dist/List/__tests__/ListRow.test.tsx +0 -18
  381. package/dist/List/__tests__/ListRow.tests.d.ts +0 -1
  382. package/dist/LoadingPage/__tests__/GlobalLoadingPage.test.tsx +0 -23
  383. package/dist/Modals/__tests__/Modal.test.tsx +0 -169
  384. package/dist/Modals/__tests__/ModalContainer.test.tsx +0 -77
  385. package/dist/Modals/__tests__/ModalContent.test.tsx +0 -126
  386. package/dist/NavItem/__tests__/NavItem.test.ts +0 -6
  387. package/dist/NotificationDot/__tests__/NotificationDot.test.tsx +0 -33
  388. package/dist/Paginator/__tests__/Paginator.test.tsx +0 -39
  389. package/dist/Popover/__tests__/Popover.test.tsx +0 -64
  390. package/dist/ProfileButton/__tests__/ProfileButton.test.tsx +0 -31
  391. package/dist/QuizButton/__tests__/QuizButton.test.tsx +0 -53
  392. package/dist/SegmentControl/__tests__/SegmentControl.test.tsx +0 -145
  393. package/dist/SideMenu/__tests__/SideMenu.test.tsx +0 -99
  394. package/dist/Switcher/__tests__/SwitcherMenuItem.tsx +0 -14
  395. package/dist/Table/__tests__/Table.test.tsx +0 -499
  396. package/dist/Tabs/__tests__/HorizontalTabs.test.tsx +0 -95
  397. package/dist/Tabs/__tests__/TabLink.test.tsx +0 -40
  398. package/dist/Tabs/__tests__/TabLink.tests.d.ts +0 -1
  399. package/dist/Tabs/__tests__/Tablist.test.tsx +0 -37
  400. package/dist/Tabs/__tests__/Tablist.tests.d.ts +0 -2
  401. package/dist/Tag/__tests__/Tag.test.tsx +0 -86
  402. package/dist/Toasters/__tests__/Toast.test.tsx +0 -74
  403. package/dist/Toggles/__tests__/ToggleButton.test.tsx +0 -53
  404. package/dist/Toggles/__tests__/ToggleSwitch.test.tsx +0 -87
  405. package/dist/Tooltips/__tests__/TooltipWrapper.test.tsx +0 -16
  406. package/dist/common/Link.cjs +0 -45
  407. package/dist/common/Link.cjs.map +0 -1
  408. package/dist/common/Link.d.ts +0 -9
  409. package/dist/common/Link.js +0 -37
  410. package/dist/common/Link.js.map +0 -1
  411. package/dist/common/NavigationHelper.cjs +0 -30
  412. package/dist/common/NavigationHelper.cjs.map +0 -1
  413. package/dist/common/NavigationHelper.d.ts +0 -4
  414. package/dist/common/NavigationHelper.js +0 -23
  415. package/dist/common/NavigationHelper.js.map +0 -1
  416. package/dist/styles/react-datepicker.css +0 -766
  417. package/dist/utils/color-tokens.cjs +0 -91
  418. package/dist/utils/color-tokens.cjs.map +0 -1
  419. package/dist/utils/color-tokens.d.ts +0 -19
  420. package/dist/utils/color-tokens.js +0 -82
  421. package/dist/utils/color-tokens.js.map +0 -1
@@ -49,46 +49,22 @@ const Loader = _styledComponents.default.div`
49
49
  }
50
50
 
51
51
  &.${_types.ToastColor[_types.ToastColor.BLUE]} {
52
- background: linear-gradient(to right, ${props => _styles.COLORS.generateToken({
53
- componentType: 'bg-surface',
54
- defaultVariant: 'accent1'
55
- }, props.theme)} 50%, ${props => _styles.COLORS.generateToken({
56
- componentType: 'bg-fill',
57
- defaultVariant: 'accent1'
58
- }, props.theme)} 50%) left;
52
+ background: linear-gradient(to right, ${props => _styles.COLORS.getColor('accent1_200', props.theme)} 50%, ${props => _styles.COLORS.getColor('accent1_600', props.theme)} 50%) left;
59
53
  background-size: 200% 100%;
60
54
  }
61
55
 
62
56
  &.${_types.ToastColor[_types.ToastColor.GREEN]} {
63
- background: linear-gradient(to right, ${props => _styles.COLORS.generateToken({
64
- componentType: 'bg-surface',
65
- defaultVariant: 'positive'
66
- }, props.theme)} 50%, ${props => _styles.COLORS.generateToken({
67
- componentType: 'bg-fill',
68
- defaultVariant: 'positive'
69
- }, props.theme)} 50%) left;
57
+ background: linear-gradient(to right, ${props => _styles.COLORS.getColor('correct_200', props.theme)} 50%, ${props => _styles.COLORS.getColor('correct_500', props.theme)} 50%) left;
70
58
  background-size: 200% 100%;
71
59
  }
72
60
 
73
61
  &.${_types.ToastColor[_types.ToastColor.ORANGE]} {
74
- background: linear-gradient(to right, ${props => _styles.COLORS.generateToken({
75
- componentType: 'bg-surface',
76
- defaultVariant: 'warning'
77
- }, props.theme)} 50%, ${props => _styles.COLORS.generateToken({
78
- componentType: 'bg-fill',
79
- defaultVariant: 'warning'
80
- }, props.theme)} 50%) left;
62
+ background: linear-gradient(to right, ${props => _styles.COLORS.getColor('warning_200', props.theme)} 50%, ${props => _styles.COLORS.getColor('warning_500', props.theme)} 50%) left;
81
63
  background-size: 200% 100%;
82
64
  }
83
65
 
84
66
  &.${_types.ToastColor[_types.ToastColor.RED]} {
85
- background: linear-gradient(to right, ${props => _styles.COLORS.generateToken({
86
- componentType: 'bg-surface',
87
- defaultVariant: 'critical'
88
- }, props.theme)} 50%, ${props => _styles.COLORS.generateToken({
89
- componentType: 'bg-fill',
90
- defaultVariant: 'critical'
91
- }, props.theme)} 50%) left;
67
+ background: linear-gradient(to right, ${props => _styles.COLORS.getColor('critical_200', props.theme)} 50%, ${props => _styles.COLORS.getColor('critical_500', props.theme)} 50%) left;
92
68
  background-size: 200% 100%;
93
69
  }
94
70
  `;
@@ -115,10 +91,7 @@ const ToastContainer = exports.ToastContainer = _styledComponents.default.div`
115
91
  min-height: 48px;
116
92
  box-sizing: border-box;
117
93
 
118
- ${props => (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.generateToken({
119
- componentType: 'bg-surface',
120
- defaultVariant: 'default'
121
- }, props.theme))}
94
+ ${props => (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('white', props.theme))}
122
95
 
123
96
  & a {
124
97
  display: inline;
@@ -139,31 +112,19 @@ const ToastContainer = exports.ToastContainer = _styledComponents.default.div`
139
112
  }
140
113
 
141
114
  &.${_types.ToastColor[_types.ToastColor.BLUE]} {
142
- background-color: ${props => _styles.COLORS.generateToken({
143
- componentType: 'bg-fill',
144
- defaultVariant: 'accent1'
145
- }, props.theme)};
115
+ background-color: ${props => _styles.COLORS.getColor('accent1_600', props.theme)};
146
116
  }
147
117
 
148
118
  &.${_types.ToastColor[_types.ToastColor.GREEN]} {
149
- background-color: ${props => _styles.COLORS.generateToken({
150
- componentType: 'bg-fill',
151
- defaultVariant: 'positive'
152
- }, props.theme)};
119
+ background-color: ${props => _styles.COLORS.getColor('correct_500', props.theme)};
153
120
  }
154
121
 
155
122
  &.${_types.ToastColor[_types.ToastColor.ORANGE]} {
156
- background-color: ${props => _styles.COLORS.generateToken({
157
- componentType: 'bg-fill',
158
- defaultVariant: 'warning'
159
- }, props.theme)};
123
+ background-color: ${props => _styles.COLORS.getColor('warning_500', props.theme)};
160
124
  }
161
125
 
162
126
  &.${_types.ToastColor[_types.ToastColor.RED]} {
163
- background-color: ${props => _styles.COLORS.generateToken({
164
- componentType: 'bg-fill',
165
- defaultVariant: 'critical'
166
- }, props.theme)};
127
+ background-color: ${props => _styles.COLORS.getColor('critical_500', props.theme)};
167
128
  }
168
129
  `;
169
130
  const ToastActionButtons = exports.ToastActionButtons = _styledComponents.default.div`
@@ -186,19 +147,12 @@ const ToastCloseButton = exports.ToastCloseButton = _styledComponents.default.di
186
147
  }
187
148
 
188
149
  button svg path{
189
- fill: ${props => _styles.COLORS.generateToken({
190
- componentType: 'icon',
191
- isOnFill: true,
192
- defaultVariant: 'accent1'
193
- }, props.theme)} !important;
150
+ fill: ${props => _styles.COLORS.getColor('white', props.theme)} !important;
194
151
  }
195
152
 
196
- &.${_types.ToastColor[_types.ToastColor.WHITE]}, &.${_types.ToastColor[_types.ToastColor.ORANGE]} {
153
+ &.${_types.ToastColor[_types.ToastColor.WHITE]} {
197
154
  button svg path {
198
- fill: ${props => _styles.COLORS.generateToken({
199
- componentType: 'icon',
200
- defaultVariant: 'subtle'
201
- }, props.theme)} !important;
155
+ fill: ${props => _styles.COLORS.getColor('neutral_600', props.theme)} !important;
202
156
  }
203
157
  }
204
158
  `;
@@ -322,10 +276,7 @@ const Toast = _ref => {
322
276
  action: event => setShouldRemove(true),
323
277
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Close, {
324
278
  size: "24px",
325
- color: _styles.COLORS.generateToken({
326
- componentType: 'icon',
327
- defaultVariant: 'subtle'
328
- }, styledTheme)
279
+ color: _styles.COLORS.getColor('neutral_600', styledTheme)
329
280
  })
330
281
  })
331
282
  }), !!opts.autoClose && /*#__PURE__*/(0, _jsxRuntime.jsx)(Loader, {
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_types","_styles","_Button","_HyperLink","_icons","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","LoaderAnimationKeyframes","keyframes","Loader","styled","div","props","$duration","ToastColor","BLACK","COLORS","getColor","theme","WHITE","BLUE","generateToken","componentType","defaultVariant","GREEN","ORANGE","RED","ToastContainer","exports","BOXSHADOWS","BOXSHADOW_L2","animation","$keyframes","$bezier","$transform","$withClose","$withLoader","ComponentSStyling","ComponentTextStyle","Regular","HyperLinkInvertedStyling","HyperLinkDefaultStyling","ToastActionButtons","ToastCloseButton","isOnFill","ToastTextContainer","span","ToastIconContainer","DEFAULT_OPTIONS","color","autoClose","delay","showCloseButton","position","ToastPosition","TOPLEFT","enterFrom","ToastEntryDirection","TOP","Toast","_ref","content","remove","options","testId","Error","styledTheme","useTheme","removeRef","useRef","current","elementRef","shouldRemove","setShouldRemove","useState","dimensions","setDimensions","width","height","opts","useEffect","id","setTimeout","clearTimeout","undefined","clientHeight","clientWidth","animations","direction","fromY","fromHeight","toY","toHeight","fromX","fromWidth","toX","toWidth","prop","duration","bezier","focus","jsxs","ref","className","tabIndex","children","icon","jsx","action","map","Button","size","Size","Small","variant","type","ToastActionType","SECONDARY","colorTheme","invertFocus","onClick","handler","label","IconButton","shape","useTransparentBackground","event","SystemIcons","Close","propTypes","_propTypes","any","isRequired","bool","number","arrayOf","string","func","node","_default","enter","BOTTOM","LEFT","RIGHT","leave"],"sources":["../../src/Toasters/Toast.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes, useTheme } from 'styled-components';\r\nimport { ToastActionType, ToastColor, ToastEntryDirection, ToastPosition } from '../types';\r\nimport { BOXSHADOWS, COLORS} from '../styles';\r\nimport { Size } from '../types'\r\nimport { Button, IconButton } from '../Button';\r\nimport { ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport {HyperLinkDefaultStyling, HyperLinkInvertedStyling} from '../HyperLink';\r\nimport { SystemIcons } from '../icons';\r\n\r\nconst LoaderAnimationKeyframes = keyframes`\r\n 0% {\r\n background-position: right;\r\n }\r\n 100% {\r\n background-position: left;\r\n }\r\n`;\r\n\r\nconst Loader = styled.div<{ $duration: number }>`\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 4px;\r\n border-bottom-left-radius: 8px;\r\n border-bottom-right-radius: 8px;\r\n\r\n animation: ${LoaderAnimationKeyframes} ${(props) => props.$duration}ms cubic-bezier(0.18, 0.39, 0.35, 1);\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_200', props.theme)} 50%, ${props => COLORS.getColor('neutral_800', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_400', props.theme)} 50%, ${props => COLORS.getColor('white', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'accent1'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'accent1'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'positive'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'positive'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'warning'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'warning'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'critical'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'critical'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n`;\r\n\r\nexport const ToastContainer = styled.div<{ animation: { $duration: string; $bezier: string; $transform: string; $keyframes: any }; $withLoader: boolean; $withClose: boolean }>`\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n border-radius: 4px;\r\n\r\n animation: ${(props) => props.animation.$keyframes} ${(props) => props.animation.$duration} ${(props) => props.animation.$bezier};\r\n transform: ${(props) => props.animation.$transform};\r\n\r\n transition: all 300ms cubic-bezier(0.64, 0.04, 0.35, 1);\r\n\r\n padding: 0 ${(props) => (props.$withClose ? '0' : '16px')} ${(props) => (props.$withLoader ? '4px' : '0')} 16px;\r\n\r\n margin-bottom: 8px;\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n justify-content: left;\r\n\r\n position: relative;\r\n\r\n width: max-content;\r\n min-height: 48px;\r\n box-sizing: border-box;\r\n\r\n ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({componentType: 'bg-surface', defaultVariant: 'default'}, props.theme))}\r\n\r\n & a {\r\n display: inline;\r\n ${HyperLinkInvertedStyling}\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background-color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background-color: ${props => COLORS.getColor('white', props.theme)};\r\n color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n & a {\r\n ${HyperLinkDefaultStyling}\r\n }\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'accent1' }, props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'positive' }, props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'warning' }, props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'critical' }, props.theme)};\r\n }\r\n`;\r\n\r\nexport const ToastActionButtons = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n gap: 8px;\r\n align-items: center;\r\n\r\n & .action {\r\n height: unset;\r\n }\r\n`;\r\n\r\nexport const ToastCloseButton = styled.div`\r\n & > button {\r\n margin-left: 16px;\r\n\r\n & svg {\r\n padding: 0;\r\n }\r\n }\r\n\r\n button svg path{\r\n fill: ${props => COLORS.generateToken({ componentType: 'icon', isOnFill: true, defaultVariant: 'accent1' }, props.theme)} !important;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]}, &.${ToastColor[ToastColor.ORANGE]} {\r\n button svg path {\r\n fill: ${props => COLORS.generateToken({componentType:'icon',defaultVariant:'subtle'}, props.theme)} !important;\r\n }\r\n }\r\n`;\r\n\r\nexport const ToastTextContainer = styled.span`\r\n font-feature-settings: 'liga' off;\r\n width: 240px;\r\n display: flex;\r\n padding: 16px 0;\r\n`;\r\n\r\nexport const ToastIconContainer = styled.span`\r\n margin-right: -8px;\r\n`;\r\n\r\nexport type ToastOptions = {\r\n /** Optional. Color of the toast. Defaults to 'BLACK' */\r\n color?: ToastColor;\r\n /** Optional. If set Toast will automatically close after delay. Defaults to 'true' */\r\n autoClose?: boolean;\r\n /** Optional. Delay after which toast will disappear in milliseconds. Defaults to '5000' */\r\n delay?: number;\r\n /** Optional. If set then Close button will be shown on the right side of the Toast. Defaults to 'false' */\r\n showCloseButton?: boolean;\r\n\r\n /** Optional. Custom action to be available in the Toast, will be shown on the right side of the Toast. */\r\n action?: {\r\n label: string;\r\n handler: () => void;\r\n type?: ToastActionType;\r\n }[];\r\n /** Required. Position on the screen at which Toast will be shown */\r\n position: ToastPosition;\r\n /** Optional. From which side of the screen appearance animation will start. Defaults to 'TOP' */\r\n enterFrom?: ToastEntryDirection;\r\n /** Optional. Icon that will be shown on the left side of the Toast */\r\n icon?: React.ReactNode;\r\n};\r\n\r\ntype Props = {\r\n remove?: any;\r\n content: any;\r\n options?: ToastOptions;\r\n testId?: string;\r\n};\r\n\r\nconst DEFAULT_OPTIONS: ToastOptions = {\r\n color: ToastColor.BLACK,\r\n autoClose: true,\r\n delay: 5000,\r\n showCloseButton: false,\r\n position: ToastPosition.TOPLEFT,\r\n enterFrom: ToastEntryDirection.TOP,\r\n};\r\n\r\nconst Toast = ({ content, remove, options = DEFAULT_OPTIONS, testId }: Props) => {\r\n\r\n \r\n\r\n if(!remove)\r\n throw new Error('remove function is required when rendering Toast. Make sure that you are using useToast hook and ToastProvider for rendering Toasts');\r\n\r\n const styledTheme = useTheme();\r\n\r\n const removeRef = React.useRef(null);\r\n removeRef.current = remove;\r\n\r\n const elementRef = React.useRef<any>(null);\r\n\r\n const [shouldRemove, setShouldRemove] = React.useState(false);\r\n const [dimensions, setDimensions] = React.useState<{ width: number; height: number }>({ width: 0, height: 0 });\r\n\r\n const opts = { ...DEFAULT_OPTIONS, ...options };\r\n\r\n React.useEffect(() => {\r\n if (opts?.autoClose) {\r\n // @ts-ignore\r\n const id = setTimeout(() => setShouldRemove(true), opts.delay);\r\n return () => clearTimeout(id);\r\n }\r\n return undefined;\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n if (shouldRemove) {\r\n // @ts-ignore\r\n const id = setTimeout(() => removeRef.current(), 200);\r\n return () => clearTimeout(id);\r\n }\r\n }, [shouldRemove]);\r\n\r\n React.useEffect(() => {\r\n setDimensions({ height: elementRef.current?.clientHeight, width: elementRef.current?.clientWidth });\r\n }, []);\r\n\r\n const animation = animations[shouldRemove ? 'leave' : 'enter'];\r\n const direction = animation[opts.enterFrom ?? ToastEntryDirection.TOP];\r\n\r\n const fromY = dimensions.height * direction.fromHeight;\r\n const toY = dimensions.height * direction.toHeight;\r\n const fromX = dimensions.width * direction.fromWidth;\r\n const toX = dimensions.width * direction.toWidth;\r\n\r\n let prop = {\r\n $duration: animation.duration,\r\n $bezier: animation.bezier,\r\n $transform: `translateY(${toY}) translateX(${toX})`,\r\n $keyframes: keyframes`\r\n 0% {\r\n transform: translateY(${fromY}px) translateX(${fromX}px);\r\n }\r\n 100% {\r\n transform: translateY(${toY}px) translateX(${toX}px);\r\n }`,\r\n };\r\n\r\n if (!dimensions.height) {\r\n prop = {\r\n ...prop,\r\n ...{\r\n $transform: 'translateY(-1000vh) translateX(-1000vw)',\r\n $keyframes: keyframes``,\r\n },\r\n };\r\n }\r\n\r\n const theme = ToastColor[opts.color ?? ToastColor.BLACK];\r\n\r\n if (!shouldRemove){\r\n setTimeout(() => elementRef?.current?.focus());\r\n }\r\n\r\n return (\r\n <ToastContainer data-testid={testId}\r\n animation={prop}\r\n ref={elementRef}\r\n $withLoader={!!opts.autoClose}\r\n className={theme}\r\n $withClose={!!opts.showCloseButton}\r\n tabIndex={-1}>\r\n {opts.icon && <ToastIconContainer>{opts.icon}</ToastIconContainer>}\r\n <ToastTextContainer className={'description'}>{content}</ToastTextContainer>\r\n {opts.action && (\r\n <ToastActionButtons>\r\n {opts.action.map((action, i) => (\r\n <Button\r\n size={Size.Small}\r\n variant={action.type === ToastActionType.SECONDARY ? 'secondary' : 'primary'}\r\n colorTheme={opts.color !== ToastColor.WHITE ? 'dark' : 'teal'}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n key={i}\r\n onClick={() => {\r\n setShouldRemove(true);\r\n action.handler();\r\n }}\r\n className={'action'}>\r\n {action.label}\r\n </Button>\r\n ))}\r\n </ToastActionButtons>\r\n )}\r\n {opts.showCloseButton && (\r\n <ToastCloseButton className={`close-button ${theme}`}>\r\n <IconButton variant={'secondary'}\r\n shape=\"circular\"\r\n useTransparentBackground={true}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n action={(event) => setShouldRemove(true)}>\r\n <SystemIcons.Close size=\"24px\" color={COLORS.generateToken({componentType:'icon',defaultVariant:'subtle'}, styledTheme)} />\r\n </IconButton>\r\n </ToastCloseButton>\r\n )}\r\n {!!opts.autoClose && <Loader className={`loader ${theme}`} $duration={opts.delay ?? 0} />}\r\n </ToastContainer>\r\n );\r\n};\r\n\r\nexport default Toast;\r\n\r\nconst animations = {\r\n enter: {\r\n bezier: 'cubic-bezier(0.22, 0.61, 0.35, 1)',\r\n duration: '300ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: -1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: -1,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 1,\r\n toWidth: 0,\r\n },\r\n },\r\n leave: {\r\n bezier: 'cubic-bezier(0.5, 0.05, 0.67, 0.19)',\r\n duration: '205ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: 0,\r\n toHeight: -1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 0,\r\n toHeight: 1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: -1,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 1,\r\n },\r\n },\r\n};\r\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Toast.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_types","_styles","_Button","_HyperLink","_icons","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","LoaderAnimationKeyframes","keyframes","Loader","styled","div","props","$duration","ToastColor","BLACK","COLORS","getColor","theme","WHITE","BLUE","GREEN","ORANGE","RED","ToastContainer","exports","BOXSHADOWS","BOXSHADOW_L2","animation","$keyframes","$bezier","$transform","$withClose","$withLoader","ComponentSStyling","ComponentTextStyle","Regular","HyperLinkInvertedStyling","HyperLinkDefaultStyling","ToastActionButtons","ToastCloseButton","ToastTextContainer","span","ToastIconContainer","DEFAULT_OPTIONS","color","autoClose","delay","showCloseButton","position","ToastPosition","TOPLEFT","enterFrom","ToastEntryDirection","TOP","Toast","_ref","content","remove","options","testId","Error","styledTheme","useTheme","removeRef","useRef","current","elementRef","shouldRemove","setShouldRemove","useState","dimensions","setDimensions","width","height","opts","useEffect","id","setTimeout","clearTimeout","undefined","clientHeight","clientWidth","animations","direction","fromY","fromHeight","toY","toHeight","fromX","fromWidth","toX","toWidth","prop","duration","bezier","focus","jsxs","ref","className","tabIndex","children","icon","jsx","action","map","Button","size","Size","Small","variant","type","ToastActionType","SECONDARY","colorTheme","invertFocus","onClick","handler","label","IconButton","shape","useTransparentBackground","event","SystemIcons","Close","propTypes","_propTypes","any","isRequired","bool","number","arrayOf","string","func","node","_default","enter","BOTTOM","LEFT","RIGHT","leave"],"sources":["../../src/Toasters/Toast.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes, useTheme } from 'styled-components';\r\nimport { ToastActionType, ToastColor, ToastEntryDirection, ToastPosition } from '../types';\r\nimport { BOXSHADOWS, COLORS} from '../styles';\r\nimport { Size } from '../types'\r\nimport { Button, IconButton } from '../Button';\r\nimport { ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport {HyperLinkDefaultStyling, HyperLinkInvertedStyling} from '../HyperLink';\r\nimport { SystemIcons } from '../icons';\r\n\r\nconst LoaderAnimationKeyframes = keyframes`\r\n 0% {\r\n background-position: right;\r\n }\r\n 100% {\r\n background-position: left;\r\n }\r\n`;\r\n\r\nconst Loader = styled.div<{ $duration: number }>`\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 4px;\r\n border-bottom-left-radius: 8px;\r\n border-bottom-right-radius: 8px;\r\n\r\n animation: ${LoaderAnimationKeyframes} ${(props) => props.$duration}ms cubic-bezier(0.18, 0.39, 0.35, 1);\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_200', props.theme)} 50%, ${props => COLORS.getColor('neutral_800', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_400', props.theme)} 50%, ${props => COLORS.getColor('white', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('accent1_200', props.theme)} 50%, ${props => COLORS.getColor('accent1_600', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('correct_200', props.theme)} 50%, ${props => COLORS.getColor('correct_500', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('warning_200', props.theme)} 50%, ${props => COLORS.getColor('warning_500', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('critical_200', props.theme)} 50%, ${props => COLORS.getColor('critical_500', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n`;\r\n\r\nexport const ToastContainer = styled.div<{ animation: { $duration: string; $bezier: string; $transform: string; $keyframes: any }; $withLoader: boolean; $withClose: boolean }>`\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n border-radius: 4px;\r\n\r\n animation: ${(props) => props.animation.$keyframes} ${(props) => props.animation.$duration} ${(props) => props.animation.$bezier};\r\n transform: ${(props) => props.animation.$transform};\r\n\r\n transition: all 300ms cubic-bezier(0.64, 0.04, 0.35, 1);\r\n\r\n padding: 0 ${(props) => (props.$withClose ? '0' : '16px')} ${(props) => (props.$withLoader ? '4px' : '0')} 16px;\r\n\r\n margin-bottom: 8px;\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n justify-content: left;\r\n\r\n position: relative;\r\n\r\n width: max-content;\r\n min-height: 48px;\r\n box-sizing: border-box;\r\n\r\n ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme))}\r\n\r\n & a {\r\n display: inline;\r\n ${HyperLinkInvertedStyling}\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background-color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background-color: ${props => COLORS.getColor('white', props.theme)};\r\n color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n & a {\r\n ${HyperLinkDefaultStyling}\r\n }\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background-color: ${props => COLORS.getColor('accent1_600', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background-color: ${props => COLORS.getColor('correct_500', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background-color: ${props => COLORS.getColor('warning_500', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background-color: ${props => COLORS.getColor('critical_500', props.theme)};\r\n }\r\n`;\r\n\r\nexport const ToastActionButtons = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n gap: 8px;\r\n align-items: center;\r\n\r\n & .action {\r\n height: unset;\r\n }\r\n`;\r\n\r\nexport const ToastCloseButton = styled.div`\r\n & > button {\r\n margin-left: 16px;\r\n\r\n & svg {\r\n padding: 0;\r\n }\r\n }\r\n\r\n button svg path{\r\n fill: ${props => COLORS.getColor('white', props.theme)} !important;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n button svg path {\r\n fill: ${props => COLORS.getColor('neutral_600', props.theme)} !important;\r\n }\r\n }\r\n`;\r\n\r\nexport const ToastTextContainer = styled.span`\r\n font-feature-settings: 'liga' off;\r\n width: 240px;\r\n display: flex;\r\n padding: 16px 0;\r\n`;\r\n\r\nexport const ToastIconContainer = styled.span`\r\n margin-right: -8px;\r\n`;\r\n\r\nexport type ToastOptions = {\r\n /** Optional. Color of the toast. Defaults to 'BLACK' */\r\n color?: ToastColor;\r\n /** Optional. If set Toast will automatically close after delay. Defaults to 'true' */\r\n autoClose?: boolean;\r\n /** Optional. Delay after which toast will disappear in milliseconds. Defaults to '5000' */\r\n delay?: number;\r\n /** Optional. If set then Close button will be shown on the right side of the Toast. Defaults to 'false' */\r\n showCloseButton?: boolean;\r\n\r\n /** Optional. Custom action to be available in the Toast, will be shown on the right side of the Toast. */\r\n action?: {\r\n label: string;\r\n handler: () => void;\r\n type?: ToastActionType;\r\n }[];\r\n /** Required. Position on the screen at which Toast will be shown */\r\n position: ToastPosition;\r\n /** Optional. From which side of the screen appearance animation will start. Defaults to 'TOP' */\r\n enterFrom?: ToastEntryDirection;\r\n /** Optional. Icon that will be shown on the left side of the Toast */\r\n icon?: React.ReactNode;\r\n};\r\n\r\ntype Props = {\r\n remove?: any;\r\n content: any;\r\n options?: ToastOptions;\r\n testId?: string;\r\n};\r\n\r\nconst DEFAULT_OPTIONS: ToastOptions = {\r\n color: ToastColor.BLACK,\r\n autoClose: true,\r\n delay: 5000,\r\n showCloseButton: false,\r\n position: ToastPosition.TOPLEFT,\r\n enterFrom: ToastEntryDirection.TOP,\r\n};\r\n\r\nconst Toast = ({ content, remove, options = DEFAULT_OPTIONS, testId }: Props) => {\r\n\r\n \r\n\r\n if(!remove)\r\n throw new Error('remove function is required when rendering Toast. Make sure that you are using useToast hook and ToastProvider for rendering Toasts');\r\n\r\n const styledTheme = useTheme();\r\n\r\n const removeRef = React.useRef(null);\r\n removeRef.current = remove;\r\n\r\n const elementRef = React.useRef<any>(null);\r\n\r\n const [shouldRemove, setShouldRemove] = React.useState(false);\r\n const [dimensions, setDimensions] = React.useState<{ width: number; height: number }>({ width: 0, height: 0 });\r\n\r\n const opts = { ...DEFAULT_OPTIONS, ...options };\r\n\r\n React.useEffect(() => {\r\n if (opts?.autoClose) {\r\n // @ts-ignore\r\n const id = setTimeout(() => setShouldRemove(true), opts.delay);\r\n return () => clearTimeout(id);\r\n }\r\n return undefined;\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n if (shouldRemove) {\r\n // @ts-ignore\r\n const id = setTimeout(() => removeRef.current(), 200);\r\n return () => clearTimeout(id);\r\n }\r\n }, [shouldRemove]);\r\n\r\n React.useEffect(() => {\r\n setDimensions({ height: elementRef.current?.clientHeight, width: elementRef.current?.clientWidth });\r\n }, []);\r\n\r\n const animation = animations[shouldRemove ? 'leave' : 'enter'];\r\n const direction = animation[opts.enterFrom ?? ToastEntryDirection.TOP];\r\n\r\n const fromY = dimensions.height * direction.fromHeight;\r\n const toY = dimensions.height * direction.toHeight;\r\n const fromX = dimensions.width * direction.fromWidth;\r\n const toX = dimensions.width * direction.toWidth;\r\n\r\n let prop = {\r\n $duration: animation.duration,\r\n $bezier: animation.bezier,\r\n $transform: `translateY(${toY}) translateX(${toX})`,\r\n $keyframes: keyframes`\r\n 0% {\r\n transform: translateY(${fromY}px) translateX(${fromX}px);\r\n }\r\n 100% {\r\n transform: translateY(${toY}px) translateX(${toX}px);\r\n }`,\r\n };\r\n\r\n if (!dimensions.height) {\r\n prop = {\r\n ...prop,\r\n ...{\r\n $transform: 'translateY(-1000vh) translateX(-1000vw)',\r\n $keyframes: keyframes``,\r\n },\r\n };\r\n }\r\n\r\n const theme = ToastColor[opts.color ?? ToastColor.BLACK];\r\n\r\n if (!shouldRemove){\r\n setTimeout(() => elementRef?.current?.focus());\r\n }\r\n\r\n return (\r\n <ToastContainer data-testid={testId}\r\n animation={prop}\r\n ref={elementRef}\r\n $withLoader={!!opts.autoClose}\r\n className={theme}\r\n $withClose={!!opts.showCloseButton}\r\n tabIndex={-1}>\r\n {opts.icon && <ToastIconContainer>{opts.icon}</ToastIconContainer>}\r\n <ToastTextContainer className={'description'}>{content}</ToastTextContainer>\r\n {opts.action && (\r\n <ToastActionButtons>\r\n {opts.action.map((action, i) => (\r\n <Button\r\n size={Size.Small}\r\n variant={action.type === ToastActionType.SECONDARY ? 'secondary' : 'primary'}\r\n colorTheme={opts.color !== ToastColor.WHITE ? 'dark' : 'teal'}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n key={i}\r\n onClick={() => {\r\n setShouldRemove(true);\r\n action.handler();\r\n }}\r\n className={'action'}>\r\n {action.label}\r\n </Button>\r\n ))}\r\n </ToastActionButtons>\r\n )}\r\n {opts.showCloseButton && (\r\n <ToastCloseButton className={`close-button ${theme}`}>\r\n <IconButton variant={'secondary'}\r\n shape=\"circular\"\r\n useTransparentBackground={true}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n action={(event) => setShouldRemove(true)}>\r\n <SystemIcons.Close size=\"24px\" color={COLORS.getColor('neutral_600', styledTheme)} />\r\n </IconButton>\r\n </ToastCloseButton>\r\n )}\r\n {!!opts.autoClose && <Loader className={`loader ${theme}`} $duration={opts.delay ?? 0} />}\r\n </ToastContainer>\r\n );\r\n};\r\n\r\nexport default Toast;\r\n\r\nconst animations = {\r\n enter: {\r\n bezier: 'cubic-bezier(0.22, 0.61, 0.35, 1)',\r\n duration: '300ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: -1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: -1,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 1,\r\n toWidth: 0,\r\n },\r\n },\r\n leave: {\r\n bezier: 'cubic-bezier(0.5, 0.05, 0.67, 0.19)',\r\n duration: '205ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: 0,\r\n toHeight: -1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 0,\r\n toHeight: 1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: -1,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 1,\r\n },\r\n },\r\n};\r\n"],"mappings":"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","ignoreList":[]}
@@ -42,46 +42,22 @@ const Loader = styled.div`
42
42
  }
43
43
 
44
44
  &.${ToastColor[ToastColor.BLUE]} {
45
- background: linear-gradient(to right, ${props => COLORS.generateToken({
46
- componentType: 'bg-surface',
47
- defaultVariant: 'accent1'
48
- }, props.theme)} 50%, ${props => COLORS.generateToken({
49
- componentType: 'bg-fill',
50
- defaultVariant: 'accent1'
51
- }, props.theme)} 50%) left;
45
+ background: linear-gradient(to right, ${props => COLORS.getColor('accent1_200', props.theme)} 50%, ${props => COLORS.getColor('accent1_600', props.theme)} 50%) left;
52
46
  background-size: 200% 100%;
53
47
  }
54
48
 
55
49
  &.${ToastColor[ToastColor.GREEN]} {
56
- background: linear-gradient(to right, ${props => COLORS.generateToken({
57
- componentType: 'bg-surface',
58
- defaultVariant: 'positive'
59
- }, props.theme)} 50%, ${props => COLORS.generateToken({
60
- componentType: 'bg-fill',
61
- defaultVariant: 'positive'
62
- }, props.theme)} 50%) left;
50
+ background: linear-gradient(to right, ${props => COLORS.getColor('correct_200', props.theme)} 50%, ${props => COLORS.getColor('correct_500', props.theme)} 50%) left;
63
51
  background-size: 200% 100%;
64
52
  }
65
53
 
66
54
  &.${ToastColor[ToastColor.ORANGE]} {
67
- background: linear-gradient(to right, ${props => COLORS.generateToken({
68
- componentType: 'bg-surface',
69
- defaultVariant: 'warning'
70
- }, props.theme)} 50%, ${props => COLORS.generateToken({
71
- componentType: 'bg-fill',
72
- defaultVariant: 'warning'
73
- }, props.theme)} 50%) left;
55
+ background: linear-gradient(to right, ${props => COLORS.getColor('warning_200', props.theme)} 50%, ${props => COLORS.getColor('warning_500', props.theme)} 50%) left;
74
56
  background-size: 200% 100%;
75
57
  }
76
58
 
77
59
  &.${ToastColor[ToastColor.RED]} {
78
- background: linear-gradient(to right, ${props => COLORS.generateToken({
79
- componentType: 'bg-surface',
80
- defaultVariant: 'critical'
81
- }, props.theme)} 50%, ${props => COLORS.generateToken({
82
- componentType: 'bg-fill',
83
- defaultVariant: 'critical'
84
- }, props.theme)} 50%) left;
60
+ background: linear-gradient(to right, ${props => COLORS.getColor('critical_200', props.theme)} 50%, ${props => COLORS.getColor('critical_500', props.theme)} 50%) left;
85
61
  background-size: 200% 100%;
86
62
  }
87
63
  `;
@@ -108,10 +84,7 @@ export const ToastContainer = styled.div`
108
84
  min-height: 48px;
109
85
  box-sizing: border-box;
110
86
 
111
- ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({
112
- componentType: 'bg-surface',
113
- defaultVariant: 'default'
114
- }, props.theme))}
87
+ ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme))}
115
88
 
116
89
  & a {
117
90
  display: inline;
@@ -132,31 +105,19 @@ export const ToastContainer = styled.div`
132
105
  }
133
106
 
134
107
  &.${ToastColor[ToastColor.BLUE]} {
135
- background-color: ${props => COLORS.generateToken({
136
- componentType: 'bg-fill',
137
- defaultVariant: 'accent1'
138
- }, props.theme)};
108
+ background-color: ${props => COLORS.getColor('accent1_600', props.theme)};
139
109
  }
140
110
 
141
111
  &.${ToastColor[ToastColor.GREEN]} {
142
- background-color: ${props => COLORS.generateToken({
143
- componentType: 'bg-fill',
144
- defaultVariant: 'positive'
145
- }, props.theme)};
112
+ background-color: ${props => COLORS.getColor('correct_500', props.theme)};
146
113
  }
147
114
 
148
115
  &.${ToastColor[ToastColor.ORANGE]} {
149
- background-color: ${props => COLORS.generateToken({
150
- componentType: 'bg-fill',
151
- defaultVariant: 'warning'
152
- }, props.theme)};
116
+ background-color: ${props => COLORS.getColor('warning_500', props.theme)};
153
117
  }
154
118
 
155
119
  &.${ToastColor[ToastColor.RED]} {
156
- background-color: ${props => COLORS.generateToken({
157
- componentType: 'bg-fill',
158
- defaultVariant: 'critical'
159
- }, props.theme)};
120
+ background-color: ${props => COLORS.getColor('critical_500', props.theme)};
160
121
  }
161
122
  `;
162
123
  export const ToastActionButtons = styled.div`
@@ -179,19 +140,12 @@ export const ToastCloseButton = styled.div`
179
140
  }
180
141
 
181
142
  button svg path{
182
- fill: ${props => COLORS.generateToken({
183
- componentType: 'icon',
184
- isOnFill: true,
185
- defaultVariant: 'accent1'
186
- }, props.theme)} !important;
143
+ fill: ${props => COLORS.getColor('white', props.theme)} !important;
187
144
  }
188
145
 
189
- &.${ToastColor[ToastColor.WHITE]}, &.${ToastColor[ToastColor.ORANGE]} {
146
+ &.${ToastColor[ToastColor.WHITE]} {
190
147
  button svg path {
191
- fill: ${props => COLORS.generateToken({
192
- componentType: 'icon',
193
- defaultVariant: 'subtle'
194
- }, props.theme)} !important;
148
+ fill: ${props => COLORS.getColor('neutral_600', props.theme)} !important;
195
149
  }
196
150
  }
197
151
  `;
@@ -315,10 +269,7 @@ const Toast = _ref => {
315
269
  action: event => setShouldRemove(true),
316
270
  children: /*#__PURE__*/_jsx(SystemIcons.Close, {
317
271
  size: "24px",
318
- color: COLORS.generateToken({
319
- componentType: 'icon',
320
- defaultVariant: 'subtle'
321
- }, styledTheme)
272
+ color: COLORS.getColor('neutral_600', styledTheme)
322
273
  })
323
274
  })
324
275
  }), !!opts.autoClose && /*#__PURE__*/_jsx(Loader, {
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.js","names":["React","styled","keyframes","useTheme","ToastActionType","ToastColor","ToastEntryDirection","ToastPosition","BOXSHADOWS","COLORS","Size","Button","IconButton","ComponentSStyling","ComponentTextStyle","HyperLinkDefaultStyling","HyperLinkInvertedStyling","SystemIcons","jsx","_jsx","jsxs","_jsxs","LoaderAnimationKeyframes","Loader","div","props","$duration","BLACK","getColor","theme","WHITE","BLUE","generateToken","componentType","defaultVariant","GREEN","ORANGE","RED","ToastContainer","BOXSHADOW_L2","animation","$keyframes","$bezier","$transform","$withClose","$withLoader","Regular","ToastActionButtons","ToastCloseButton","isOnFill","ToastTextContainer","span","ToastIconContainer","DEFAULT_OPTIONS","color","autoClose","delay","showCloseButton","position","TOPLEFT","enterFrom","TOP","Toast","_ref","content","remove","options","testId","Error","styledTheme","removeRef","useRef","current","elementRef","shouldRemove","setShouldRemove","useState","dimensions","setDimensions","width","height","opts","_objectSpread","useEffect","id","setTimeout","clearTimeout","undefined","clientHeight","clientWidth","animations","direction","fromY","fromHeight","toY","toHeight","fromX","fromWidth","toX","toWidth","prop","duration","bezier","focus","ref","className","tabIndex","children","icon","action","map","i","size","Small","variant","type","SECONDARY","colorTheme","invertFocus","onClick","handler","label","shape","useTransparentBackground","event","Close","propTypes","_pt","any","isRequired","bool","number","arrayOf","string","func","node","enter","BOTTOM","LEFT","RIGHT","leave"],"sources":["../../src/Toasters/Toast.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes, useTheme } from 'styled-components';\r\nimport { ToastActionType, ToastColor, ToastEntryDirection, ToastPosition } from '../types';\r\nimport { BOXSHADOWS, COLORS} from '../styles';\r\nimport { Size } from '../types'\r\nimport { Button, IconButton } from '../Button';\r\nimport { ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport {HyperLinkDefaultStyling, HyperLinkInvertedStyling} from '../HyperLink';\r\nimport { SystemIcons } from '../icons';\r\n\r\nconst LoaderAnimationKeyframes = keyframes`\r\n 0% {\r\n background-position: right;\r\n }\r\n 100% {\r\n background-position: left;\r\n }\r\n`;\r\n\r\nconst Loader = styled.div<{ $duration: number }>`\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 4px;\r\n border-bottom-left-radius: 8px;\r\n border-bottom-right-radius: 8px;\r\n\r\n animation: ${LoaderAnimationKeyframes} ${(props) => props.$duration}ms cubic-bezier(0.18, 0.39, 0.35, 1);\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_200', props.theme)} 50%, ${props => COLORS.getColor('neutral_800', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_400', props.theme)} 50%, ${props => COLORS.getColor('white', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'accent1'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'accent1'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'positive'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'positive'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'warning'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'warning'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background: linear-gradient(to right, ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'critical'}, props.theme)} 50%, ${props => COLORS.generateToken({componentType:'bg-fill', defaultVariant:'critical'}, props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n`;\r\n\r\nexport const ToastContainer = styled.div<{ animation: { $duration: string; $bezier: string; $transform: string; $keyframes: any }; $withLoader: boolean; $withClose: boolean }>`\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n border-radius: 4px;\r\n\r\n animation: ${(props) => props.animation.$keyframes} ${(props) => props.animation.$duration} ${(props) => props.animation.$bezier};\r\n transform: ${(props) => props.animation.$transform};\r\n\r\n transition: all 300ms cubic-bezier(0.64, 0.04, 0.35, 1);\r\n\r\n padding: 0 ${(props) => (props.$withClose ? '0' : '16px')} ${(props) => (props.$withLoader ? '4px' : '0')} 16px;\r\n\r\n margin-bottom: 8px;\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n justify-content: left;\r\n\r\n position: relative;\r\n\r\n width: max-content;\r\n min-height: 48px;\r\n box-sizing: border-box;\r\n\r\n ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({componentType: 'bg-surface', defaultVariant: 'default'}, props.theme))}\r\n\r\n & a {\r\n display: inline;\r\n ${HyperLinkInvertedStyling}\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background-color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background-color: ${props => COLORS.getColor('white', props.theme)};\r\n color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n & a {\r\n ${HyperLinkDefaultStyling}\r\n }\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'accent1' }, props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'positive' }, props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'warning' }, props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'critical' }, props.theme)};\r\n }\r\n`;\r\n\r\nexport const ToastActionButtons = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n gap: 8px;\r\n align-items: center;\r\n\r\n & .action {\r\n height: unset;\r\n }\r\n`;\r\n\r\nexport const ToastCloseButton = styled.div`\r\n & > button {\r\n margin-left: 16px;\r\n\r\n & svg {\r\n padding: 0;\r\n }\r\n }\r\n\r\n button svg path{\r\n fill: ${props => COLORS.generateToken({ componentType: 'icon', isOnFill: true, defaultVariant: 'accent1' }, props.theme)} !important;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]}, &.${ToastColor[ToastColor.ORANGE]} {\r\n button svg path {\r\n fill: ${props => COLORS.generateToken({componentType:'icon',defaultVariant:'subtle'}, props.theme)} !important;\r\n }\r\n }\r\n`;\r\n\r\nexport const ToastTextContainer = styled.span`\r\n font-feature-settings: 'liga' off;\r\n width: 240px;\r\n display: flex;\r\n padding: 16px 0;\r\n`;\r\n\r\nexport const ToastIconContainer = styled.span`\r\n margin-right: -8px;\r\n`;\r\n\r\nexport type ToastOptions = {\r\n /** Optional. Color of the toast. Defaults to 'BLACK' */\r\n color?: ToastColor;\r\n /** Optional. If set Toast will automatically close after delay. Defaults to 'true' */\r\n autoClose?: boolean;\r\n /** Optional. Delay after which toast will disappear in milliseconds. Defaults to '5000' */\r\n delay?: number;\r\n /** Optional. If set then Close button will be shown on the right side of the Toast. Defaults to 'false' */\r\n showCloseButton?: boolean;\r\n\r\n /** Optional. Custom action to be available in the Toast, will be shown on the right side of the Toast. */\r\n action?: {\r\n label: string;\r\n handler: () => void;\r\n type?: ToastActionType;\r\n }[];\r\n /** Required. Position on the screen at which Toast will be shown */\r\n position: ToastPosition;\r\n /** Optional. From which side of the screen appearance animation will start. Defaults to 'TOP' */\r\n enterFrom?: ToastEntryDirection;\r\n /** Optional. Icon that will be shown on the left side of the Toast */\r\n icon?: React.ReactNode;\r\n};\r\n\r\ntype Props = {\r\n remove?: any;\r\n content: any;\r\n options?: ToastOptions;\r\n testId?: string;\r\n};\r\n\r\nconst DEFAULT_OPTIONS: ToastOptions = {\r\n color: ToastColor.BLACK,\r\n autoClose: true,\r\n delay: 5000,\r\n showCloseButton: false,\r\n position: ToastPosition.TOPLEFT,\r\n enterFrom: ToastEntryDirection.TOP,\r\n};\r\n\r\nconst Toast = ({ content, remove, options = DEFAULT_OPTIONS, testId }: Props) => {\r\n\r\n \r\n\r\n if(!remove)\r\n throw new Error('remove function is required when rendering Toast. Make sure that you are using useToast hook and ToastProvider for rendering Toasts');\r\n\r\n const styledTheme = useTheme();\r\n\r\n const removeRef = React.useRef(null);\r\n removeRef.current = remove;\r\n\r\n const elementRef = React.useRef<any>(null);\r\n\r\n const [shouldRemove, setShouldRemove] = React.useState(false);\r\n const [dimensions, setDimensions] = React.useState<{ width: number; height: number }>({ width: 0, height: 0 });\r\n\r\n const opts = { ...DEFAULT_OPTIONS, ...options };\r\n\r\n React.useEffect(() => {\r\n if (opts?.autoClose) {\r\n // @ts-ignore\r\n const id = setTimeout(() => setShouldRemove(true), opts.delay);\r\n return () => clearTimeout(id);\r\n }\r\n return undefined;\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n if (shouldRemove) {\r\n // @ts-ignore\r\n const id = setTimeout(() => removeRef.current(), 200);\r\n return () => clearTimeout(id);\r\n }\r\n }, [shouldRemove]);\r\n\r\n React.useEffect(() => {\r\n setDimensions({ height: elementRef.current?.clientHeight, width: elementRef.current?.clientWidth });\r\n }, []);\r\n\r\n const animation = animations[shouldRemove ? 'leave' : 'enter'];\r\n const direction = animation[opts.enterFrom ?? ToastEntryDirection.TOP];\r\n\r\n const fromY = dimensions.height * direction.fromHeight;\r\n const toY = dimensions.height * direction.toHeight;\r\n const fromX = dimensions.width * direction.fromWidth;\r\n const toX = dimensions.width * direction.toWidth;\r\n\r\n let prop = {\r\n $duration: animation.duration,\r\n $bezier: animation.bezier,\r\n $transform: `translateY(${toY}) translateX(${toX})`,\r\n $keyframes: keyframes`\r\n 0% {\r\n transform: translateY(${fromY}px) translateX(${fromX}px);\r\n }\r\n 100% {\r\n transform: translateY(${toY}px) translateX(${toX}px);\r\n }`,\r\n };\r\n\r\n if (!dimensions.height) {\r\n prop = {\r\n ...prop,\r\n ...{\r\n $transform: 'translateY(-1000vh) translateX(-1000vw)',\r\n $keyframes: keyframes``,\r\n },\r\n };\r\n }\r\n\r\n const theme = ToastColor[opts.color ?? ToastColor.BLACK];\r\n\r\n if (!shouldRemove){\r\n setTimeout(() => elementRef?.current?.focus());\r\n }\r\n\r\n return (\r\n <ToastContainer data-testid={testId}\r\n animation={prop}\r\n ref={elementRef}\r\n $withLoader={!!opts.autoClose}\r\n className={theme}\r\n $withClose={!!opts.showCloseButton}\r\n tabIndex={-1}>\r\n {opts.icon && <ToastIconContainer>{opts.icon}</ToastIconContainer>}\r\n <ToastTextContainer className={'description'}>{content}</ToastTextContainer>\r\n {opts.action && (\r\n <ToastActionButtons>\r\n {opts.action.map((action, i) => (\r\n <Button\r\n size={Size.Small}\r\n variant={action.type === ToastActionType.SECONDARY ? 'secondary' : 'primary'}\r\n colorTheme={opts.color !== ToastColor.WHITE ? 'dark' : 'teal'}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n key={i}\r\n onClick={() => {\r\n setShouldRemove(true);\r\n action.handler();\r\n }}\r\n className={'action'}>\r\n {action.label}\r\n </Button>\r\n ))}\r\n </ToastActionButtons>\r\n )}\r\n {opts.showCloseButton && (\r\n <ToastCloseButton className={`close-button ${theme}`}>\r\n <IconButton variant={'secondary'}\r\n shape=\"circular\"\r\n useTransparentBackground={true}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n action={(event) => setShouldRemove(true)}>\r\n <SystemIcons.Close size=\"24px\" color={COLORS.generateToken({componentType:'icon',defaultVariant:'subtle'}, styledTheme)} />\r\n </IconButton>\r\n </ToastCloseButton>\r\n )}\r\n {!!opts.autoClose && <Loader className={`loader ${theme}`} $duration={opts.delay ?? 0} />}\r\n </ToastContainer>\r\n );\r\n};\r\n\r\nexport default Toast;\r\n\r\nconst animations = {\r\n enter: {\r\n bezier: 'cubic-bezier(0.22, 0.61, 0.35, 1)',\r\n duration: '300ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: -1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: -1,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 1,\r\n toWidth: 0,\r\n },\r\n },\r\n leave: {\r\n bezier: 'cubic-bezier(0.5, 0.05, 0.67, 0.19)',\r\n duration: '205ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: 0,\r\n toHeight: -1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 0,\r\n toHeight: 1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: -1,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 1,\r\n },\r\n },\r\n};\r\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Toast.js","names":["React","styled","keyframes","useTheme","ToastActionType","ToastColor","ToastEntryDirection","ToastPosition","BOXSHADOWS","COLORS","Size","Button","IconButton","ComponentSStyling","ComponentTextStyle","HyperLinkDefaultStyling","HyperLinkInvertedStyling","SystemIcons","jsx","_jsx","jsxs","_jsxs","LoaderAnimationKeyframes","Loader","div","props","$duration","BLACK","getColor","theme","WHITE","BLUE","GREEN","ORANGE","RED","ToastContainer","BOXSHADOW_L2","animation","$keyframes","$bezier","$transform","$withClose","$withLoader","Regular","ToastActionButtons","ToastCloseButton","ToastTextContainer","span","ToastIconContainer","DEFAULT_OPTIONS","color","autoClose","delay","showCloseButton","position","TOPLEFT","enterFrom","TOP","Toast","_ref","content","remove","options","testId","Error","styledTheme","removeRef","useRef","current","elementRef","shouldRemove","setShouldRemove","useState","dimensions","setDimensions","width","height","opts","_objectSpread","useEffect","id","setTimeout","clearTimeout","undefined","clientHeight","clientWidth","animations","direction","fromY","fromHeight","toY","toHeight","fromX","fromWidth","toX","toWidth","prop","duration","bezier","focus","ref","className","tabIndex","children","icon","action","map","i","size","Small","variant","type","SECONDARY","colorTheme","invertFocus","onClick","handler","label","shape","useTransparentBackground","event","Close","propTypes","_pt","any","isRequired","bool","number","arrayOf","string","func","node","enter","BOTTOM","LEFT","RIGHT","leave"],"sources":["../../src/Toasters/Toast.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { keyframes, useTheme } from 'styled-components';\r\nimport { ToastActionType, ToastColor, ToastEntryDirection, ToastPosition } from '../types';\r\nimport { BOXSHADOWS, COLORS} from '../styles';\r\nimport { Size } from '../types'\r\nimport { Button, IconButton } from '../Button';\r\nimport { ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport {HyperLinkDefaultStyling, HyperLinkInvertedStyling} from '../HyperLink';\r\nimport { SystemIcons } from '../icons';\r\n\r\nconst LoaderAnimationKeyframes = keyframes`\r\n 0% {\r\n background-position: right;\r\n }\r\n 100% {\r\n background-position: left;\r\n }\r\n`;\r\n\r\nconst Loader = styled.div<{ $duration: number }>`\r\n position: absolute;\r\n bottom: 0;\r\n left: 0;\r\n width: 100%;\r\n height: 4px;\r\n border-bottom-left-radius: 8px;\r\n border-bottom-right-radius: 8px;\r\n\r\n animation: ${LoaderAnimationKeyframes} ${(props) => props.$duration}ms cubic-bezier(0.18, 0.39, 0.35, 1);\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_200', props.theme)} 50%, ${props => COLORS.getColor('neutral_800', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('neutral_400', props.theme)} 50%, ${props => COLORS.getColor('white', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('accent1_200', props.theme)} 50%, ${props => COLORS.getColor('accent1_600', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('correct_200', props.theme)} 50%, ${props => COLORS.getColor('correct_500', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('warning_200', props.theme)} 50%, ${props => COLORS.getColor('warning_500', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background: linear-gradient(to right, ${props => COLORS.getColor('critical_200', props.theme)} 50%, ${props => COLORS.getColor('critical_500', props.theme)} 50%) left;\r\n background-size: 200% 100%;\r\n }\r\n`;\r\n\r\nexport const ToastContainer = styled.div<{ animation: { $duration: string; $bezier: string; $transform: string; $keyframes: any }; $withLoader: boolean; $withClose: boolean }>`\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n border-radius: 4px;\r\n\r\n animation: ${(props) => props.animation.$keyframes} ${(props) => props.animation.$duration} ${(props) => props.animation.$bezier};\r\n transform: ${(props) => props.animation.$transform};\r\n\r\n transition: all 300ms cubic-bezier(0.64, 0.04, 0.35, 1);\r\n\r\n padding: 0 ${(props) => (props.$withClose ? '0' : '16px')} ${(props) => (props.$withLoader ? '4px' : '0')} 16px;\r\n\r\n margin-bottom: 8px;\r\n display: flex;\r\n align-items: center;\r\n gap: 16px;\r\n justify-content: left;\r\n\r\n position: relative;\r\n\r\n width: max-content;\r\n min-height: 48px;\r\n box-sizing: border-box;\r\n\r\n ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme))}\r\n\r\n & a {\r\n display: inline;\r\n ${HyperLinkInvertedStyling}\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLACK]} {\r\n background-color: ${props => COLORS.getColor('neutral_800', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n background-color: ${props => COLORS.getColor('white', props.theme)};\r\n color: ${props => COLORS.getColor('black', props.theme)};\r\n\r\n & a {\r\n ${HyperLinkDefaultStyling}\r\n }\r\n }\r\n\r\n &.${ToastColor[ToastColor.BLUE]} {\r\n background-color: ${props => COLORS.getColor('accent1_600', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.GREEN]} {\r\n background-color: ${props => COLORS.getColor('correct_500', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.ORANGE]} {\r\n background-color: ${props => COLORS.getColor('warning_500', props.theme)};\r\n }\r\n\r\n &.${ToastColor[ToastColor.RED]} {\r\n background-color: ${props => COLORS.getColor('critical_500', props.theme)};\r\n }\r\n`;\r\n\r\nexport const ToastActionButtons = styled.div`\r\n display: flex;\r\n flex-direction: row;\r\n gap: 8px;\r\n align-items: center;\r\n\r\n & .action {\r\n height: unset;\r\n }\r\n`;\r\n\r\nexport const ToastCloseButton = styled.div`\r\n & > button {\r\n margin-left: 16px;\r\n\r\n & svg {\r\n padding: 0;\r\n }\r\n }\r\n\r\n button svg path{\r\n fill: ${props => COLORS.getColor('white', props.theme)} !important;\r\n }\r\n\r\n &.${ToastColor[ToastColor.WHITE]} {\r\n button svg path {\r\n fill: ${props => COLORS.getColor('neutral_600', props.theme)} !important;\r\n }\r\n }\r\n`;\r\n\r\nexport const ToastTextContainer = styled.span`\r\n font-feature-settings: 'liga' off;\r\n width: 240px;\r\n display: flex;\r\n padding: 16px 0;\r\n`;\r\n\r\nexport const ToastIconContainer = styled.span`\r\n margin-right: -8px;\r\n`;\r\n\r\nexport type ToastOptions = {\r\n /** Optional. Color of the toast. Defaults to 'BLACK' */\r\n color?: ToastColor;\r\n /** Optional. If set Toast will automatically close after delay. Defaults to 'true' */\r\n autoClose?: boolean;\r\n /** Optional. Delay after which toast will disappear in milliseconds. Defaults to '5000' */\r\n delay?: number;\r\n /** Optional. If set then Close button will be shown on the right side of the Toast. Defaults to 'false' */\r\n showCloseButton?: boolean;\r\n\r\n /** Optional. Custom action to be available in the Toast, will be shown on the right side of the Toast. */\r\n action?: {\r\n label: string;\r\n handler: () => void;\r\n type?: ToastActionType;\r\n }[];\r\n /** Required. Position on the screen at which Toast will be shown */\r\n position: ToastPosition;\r\n /** Optional. From which side of the screen appearance animation will start. Defaults to 'TOP' */\r\n enterFrom?: ToastEntryDirection;\r\n /** Optional. Icon that will be shown on the left side of the Toast */\r\n icon?: React.ReactNode;\r\n};\r\n\r\ntype Props = {\r\n remove?: any;\r\n content: any;\r\n options?: ToastOptions;\r\n testId?: string;\r\n};\r\n\r\nconst DEFAULT_OPTIONS: ToastOptions = {\r\n color: ToastColor.BLACK,\r\n autoClose: true,\r\n delay: 5000,\r\n showCloseButton: false,\r\n position: ToastPosition.TOPLEFT,\r\n enterFrom: ToastEntryDirection.TOP,\r\n};\r\n\r\nconst Toast = ({ content, remove, options = DEFAULT_OPTIONS, testId }: Props) => {\r\n\r\n \r\n\r\n if(!remove)\r\n throw new Error('remove function is required when rendering Toast. Make sure that you are using useToast hook and ToastProvider for rendering Toasts');\r\n\r\n const styledTheme = useTheme();\r\n\r\n const removeRef = React.useRef(null);\r\n removeRef.current = remove;\r\n\r\n const elementRef = React.useRef<any>(null);\r\n\r\n const [shouldRemove, setShouldRemove] = React.useState(false);\r\n const [dimensions, setDimensions] = React.useState<{ width: number; height: number }>({ width: 0, height: 0 });\r\n\r\n const opts = { ...DEFAULT_OPTIONS, ...options };\r\n\r\n React.useEffect(() => {\r\n if (opts?.autoClose) {\r\n // @ts-ignore\r\n const id = setTimeout(() => setShouldRemove(true), opts.delay);\r\n return () => clearTimeout(id);\r\n }\r\n return undefined;\r\n }, []);\r\n\r\n React.useEffect(() => {\r\n if (shouldRemove) {\r\n // @ts-ignore\r\n const id = setTimeout(() => removeRef.current(), 200);\r\n return () => clearTimeout(id);\r\n }\r\n }, [shouldRemove]);\r\n\r\n React.useEffect(() => {\r\n setDimensions({ height: elementRef.current?.clientHeight, width: elementRef.current?.clientWidth });\r\n }, []);\r\n\r\n const animation = animations[shouldRemove ? 'leave' : 'enter'];\r\n const direction = animation[opts.enterFrom ?? ToastEntryDirection.TOP];\r\n\r\n const fromY = dimensions.height * direction.fromHeight;\r\n const toY = dimensions.height * direction.toHeight;\r\n const fromX = dimensions.width * direction.fromWidth;\r\n const toX = dimensions.width * direction.toWidth;\r\n\r\n let prop = {\r\n $duration: animation.duration,\r\n $bezier: animation.bezier,\r\n $transform: `translateY(${toY}) translateX(${toX})`,\r\n $keyframes: keyframes`\r\n 0% {\r\n transform: translateY(${fromY}px) translateX(${fromX}px);\r\n }\r\n 100% {\r\n transform: translateY(${toY}px) translateX(${toX}px);\r\n }`,\r\n };\r\n\r\n if (!dimensions.height) {\r\n prop = {\r\n ...prop,\r\n ...{\r\n $transform: 'translateY(-1000vh) translateX(-1000vw)',\r\n $keyframes: keyframes``,\r\n },\r\n };\r\n }\r\n\r\n const theme = ToastColor[opts.color ?? ToastColor.BLACK];\r\n\r\n if (!shouldRemove){\r\n setTimeout(() => elementRef?.current?.focus());\r\n }\r\n\r\n return (\r\n <ToastContainer data-testid={testId}\r\n animation={prop}\r\n ref={elementRef}\r\n $withLoader={!!opts.autoClose}\r\n className={theme}\r\n $withClose={!!opts.showCloseButton}\r\n tabIndex={-1}>\r\n {opts.icon && <ToastIconContainer>{opts.icon}</ToastIconContainer>}\r\n <ToastTextContainer className={'description'}>{content}</ToastTextContainer>\r\n {opts.action && (\r\n <ToastActionButtons>\r\n {opts.action.map((action, i) => (\r\n <Button\r\n size={Size.Small}\r\n variant={action.type === ToastActionType.SECONDARY ? 'secondary' : 'primary'}\r\n colorTheme={opts.color !== ToastColor.WHITE ? 'dark' : 'teal'}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n key={i}\r\n onClick={() => {\r\n setShouldRemove(true);\r\n action.handler();\r\n }}\r\n className={'action'}>\r\n {action.label}\r\n </Button>\r\n ))}\r\n </ToastActionButtons>\r\n )}\r\n {opts.showCloseButton && (\r\n <ToastCloseButton className={`close-button ${theme}`}>\r\n <IconButton variant={'secondary'}\r\n shape=\"circular\"\r\n useTransparentBackground={true}\r\n invertFocus={opts.color === ToastColor.BLACK}\r\n action={(event) => setShouldRemove(true)}>\r\n <SystemIcons.Close size=\"24px\" color={COLORS.getColor('neutral_600', styledTheme)} />\r\n </IconButton>\r\n </ToastCloseButton>\r\n )}\r\n {!!opts.autoClose && <Loader className={`loader ${theme}`} $duration={opts.delay ?? 0} />}\r\n </ToastContainer>\r\n );\r\n};\r\n\r\nexport default Toast;\r\n\r\nconst animations = {\r\n enter: {\r\n bezier: 'cubic-bezier(0.22, 0.61, 0.35, 1)',\r\n duration: '300ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: -1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 1,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: -1,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 1,\r\n toWidth: 0,\r\n },\r\n },\r\n leave: {\r\n bezier: 'cubic-bezier(0.5, 0.05, 0.67, 0.19)',\r\n duration: '205ms',\r\n [ToastEntryDirection.TOP]: {\r\n fromHeight: 0,\r\n toHeight: -1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.BOTTOM]: {\r\n fromHeight: 0,\r\n toHeight: 1,\r\n fromWidth: 0,\r\n toWidth: 0,\r\n },\r\n [ToastEntryDirection.LEFT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: -1,\r\n },\r\n [ToastEntryDirection.RIGHT]: {\r\n fromHeight: 0,\r\n toHeight: 0,\r\n fromWidth: 0,\r\n toWidth: 1,\r\n },\r\n },\r\n};\r\n"],"mappings":"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","ignoreList":[]}
@@ -25,7 +25,7 @@ const Wrapper = _styledComponents.default.div`
25
25
  &.disabled,
26
26
  &.active:not(.state-change) {
27
27
  ${_Iconbutton.IconButtonContentStyles} {
28
- background: transparent;
28
+ background: ${props => _styles.COLORS.getColor('white', props.theme)};
29
29
  }
30
30
  }
31
31
 
@@ -35,10 +35,7 @@ const Wrapper = _styledComponents.default.div`
35
35
  position: absolute;
36
36
  left: 12px;
37
37
  bottom: 1px;
38
- background-color: ${props => _styles.COLORS.generateToken({
39
- componentType: 'border',
40
- defaultVariant: 'selected'
41
- }, props.theme)};
38
+ background-color: ${props => _styles.COLORS.getColor('primary_500', props.theme)};
42
39
  border-radius: 4px;
43
40
  height: 4px;
44
41
  width: 24px;
@@ -47,10 +44,7 @@ const Wrapper = _styledComponents.default.div`
47
44
 
48
45
  &.disabled:not(.state-change) {
49
46
  ${_Iconbutton.IconButtonContentStyles}:after {
50
- background: ${props => _styles.COLORS.generateToken({
51
- componentType: 'icon',
52
- state: 'disabled'
53
- }, props.theme)};
47
+ background: ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
54
48
  }
55
49
  }
56
50
  `;
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleButton.cjs","names":["_react","_interopRequireDefault","require","_Button","_styledComponents","_Iconbutton","_styles","_jsxRuntime","_excluded","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","default","getOwnPropertyDescriptors","defineProperties","defineProperty","Wrapper","styled","div","IconButtonContentStyles","props","COLORS","generateToken","componentType","defaultVariant","theme","state","ToggleButton","exports","React","forwardRef","_ref","ref","id","active","onChange","disabled","defaultState","activeState","className","rest","_objectWithoutProperties2","isActive","setIsActive","useState","useEffect","cls","jsx","children","IconButton","variant","useTransparentBackground","shape","action","iconColor","color","icon","propTypes","_propTypes","bool","isRequired","func","node","string","_default"],"sources":["../../src/Toggles/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\r\nimport { IconButton } from '../Button';\r\nimport styled from 'styled-components';\r\nimport { IconButtonContentStyles } from '../Button/Iconbutton';\r\nimport { COLORS } from '../styles';\r\n\r\nconst Wrapper = styled.div`\r\n ${IconButtonContentStyles} {\r\n transition: all 0.1s ease-in-out;\r\n }\r\n\r\n &.disabled,\r\n &.active:not(.state-change) {\r\n ${IconButtonContentStyles} {\r\n background: transparent;\r\n }\r\n }\r\n\r\n &.active:not(.state-change) {\r\n ${IconButtonContentStyles}:after {\r\n content: '';\r\n position: absolute;\r\n left: 12px;\r\n bottom: 1px;\r\n background-color: ${props => COLORS.generateToken({componentType: 'border', defaultVariant: 'selected'}, props.theme)};\r\n border-radius: 4px;\r\n height: 4px;\r\n width: 24px;\r\n }\r\n }\r\n\r\n &.disabled:not(.state-change) {\r\n ${IconButtonContentStyles}:after {\r\n background: ${props => COLORS.generateToken({componentType:'icon',state:'disabled'}, props.theme)};\r\n }\r\n }\r\n`;\r\n\r\nexport interface ToggleButtonState {\r\n icon: React.ReactNode;\r\n color?: string;\r\n}\r\n\r\nexport interface ToggleButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'onClick'> {\r\n /** Required. Initial state of the toggle. */\r\n active: boolean;\r\n /** Optional. Handler to be called when toggle state changes. */\r\n onChange?: (value: boolean) => void;\r\n /** Optional. If set user can not interact with ToggleButton. */\r\n disabled?: boolean;\r\n /** Required. Icon and color of toggle in default state. */\r\n defaultState: ToggleButtonState;\r\n /** Optional. Icon and color of toggle in active state. If activeState is not provided then when state is changed component will show a small border under the button to highlight the state change. */\r\n activeState?: ToggleButtonState;\r\n}\r\n\r\nexport const ToggleButton = React.forwardRef(({\r\n id,\r\n active,\r\n onChange,\r\n disabled,\r\n defaultState,\r\n activeState,\r\n className,\r\n ...rest\r\n }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n const [isActive, setIsActive] = React.useState(false);\r\n\r\n React.useEffect(() => setIsActive(active), [active]);\r\n\r\n const cls = `${className || ''} ${isActive ? 'active' : ''} ${activeState ? 'state-change' : ''} ${disabled ? 'disabled' : ''}`;\r\n\r\n return (\r\n <Wrapper className={cls}>\r\n <IconButton\r\n variant={'secondary'}\r\n ref={ref}\r\n useTransparentBackground={true}\r\n shape={'circular'}\r\n action={() => {\r\n setIsActive(!isActive);\r\n if (onChange) {\r\n onChange(!isActive);\r\n }\r\n }}\r\n id={id}\r\n iconColor={isActive ? activeState?.color ?? defaultState.color : defaultState.color}\r\n disabled={disabled}\r\n aria-pressed={isActive}\r\n {...rest}>\r\n {isActive ? activeState?.icon ?? defaultState.icon : defaultState.icon}\r\n </IconButton>\r\n </Wrapper>\r\n );\r\n});\r\n\r\nexport default ToggleButton;\r\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"ToggleButton.cjs","names":["_react","_interopRequireDefault","require","_Button","_styledComponents","_Iconbutton","_styles","_jsxRuntime","_excluded","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","default","getOwnPropertyDescriptors","defineProperties","defineProperty","Wrapper","styled","div","IconButtonContentStyles","props","COLORS","getColor","theme","ToggleButton","exports","React","forwardRef","_ref","ref","id","active","onChange","disabled","defaultState","activeState","className","rest","_objectWithoutProperties2","isActive","setIsActive","useState","useEffect","cls","jsx","children","IconButton","variant","useTransparentBackground","shape","action","iconColor","color","icon","propTypes","_propTypes","bool","isRequired","func","node","string","_default"],"sources":["../../src/Toggles/ToggleButton.tsx"],"sourcesContent":["import React from 'react';\r\nimport { IconButton } from '../Button';\r\nimport styled from 'styled-components';\r\nimport { IconButtonContentStyles } from '../Button/Iconbutton';\r\nimport { COLORS } from '../styles';\r\n\r\nconst Wrapper = styled.div`\r\n ${IconButtonContentStyles} {\r\n transition: all 0.1s ease-in-out;\r\n }\r\n\r\n &.disabled,\r\n &.active:not(.state-change) {\r\n ${IconButtonContentStyles} {\r\n background: ${props => COLORS.getColor('white', props.theme)};\r\n }\r\n }\r\n\r\n &.active:not(.state-change) {\r\n ${IconButtonContentStyles}:after {\r\n content: '';\r\n position: absolute;\r\n left: 12px;\r\n bottom: 1px;\r\n background-color: ${props => COLORS.getColor('primary_500', props.theme)};\r\n border-radius: 4px;\r\n height: 4px;\r\n width: 24px;\r\n }\r\n }\r\n\r\n &.disabled:not(.state-change) {\r\n ${IconButtonContentStyles}:after {\r\n background: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n }\r\n }\r\n`;\r\n\r\nexport interface ToggleButtonState {\r\n icon: React.ReactNode;\r\n color?: string;\r\n}\r\n\r\nexport interface ToggleButtonProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'onChange' | 'disabled' | 'onClick'> {\r\n /** Required. Initial state of the toggle. */\r\n active: boolean;\r\n /** Optional. Handler to be called when toggle state changes. */\r\n onChange?: (value: boolean) => void;\r\n /** Optional. If set user can not interact with ToggleButton. */\r\n disabled?: boolean;\r\n /** Required. Icon and color of toggle in default state. */\r\n defaultState: ToggleButtonState;\r\n /** Optional. Icon and color of toggle in active state. */\r\n activeState?: ToggleButtonState;\r\n}\r\n\r\nexport const ToggleButton = React.forwardRef(({\r\n id,\r\n active,\r\n onChange,\r\n disabled,\r\n defaultState,\r\n activeState,\r\n className,\r\n ...rest\r\n }: ToggleButtonProps, ref: React.Ref<HTMLButtonElement>) => {\r\n const [isActive, setIsActive] = React.useState(false);\r\n\r\n React.useEffect(() => setIsActive(active), [active]);\r\n\r\n const cls = `${className || ''} ${isActive ? 'active' : ''} ${activeState ? 'state-change' : ''} ${disabled ? 'disabled' : ''}`;\r\n\r\n return (\r\n <Wrapper className={cls}>\r\n <IconButton\r\n variant={'secondary'}\r\n ref={ref}\r\n useTransparentBackground={true}\r\n shape={'circular'}\r\n action={() => {\r\n setIsActive(!isActive);\r\n if (onChange) {\r\n onChange(!isActive);\r\n }\r\n }}\r\n id={id}\r\n iconColor={isActive ? activeState?.color ?? defaultState.color : defaultState.color}\r\n disabled={disabled}\r\n aria-pressed={isActive}\r\n {...rest}>\r\n {isActive ? activeState?.icon ?? defaultState.icon : defaultState.icon}\r\n </IconButton>\r\n </Wrapper>\r\n );\r\n});\r\n\r\nexport default ToggleButton;\r\n"],"mappings":"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","ignoreList":[]}