@laerdal/life-react-components 6.0.0-dev.1.full → 6.0.0-dev.10.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 (337) hide show
  1. package/dist/Accordion/ContentAccordion.cjs +40 -11
  2. package/dist/Accordion/ContentAccordion.cjs.map +1 -1
  3. package/dist/Accordion/ContentAccordion.js +40 -11
  4. package/dist/Accordion/ContentAccordion.js.map +1 -1
  5. package/dist/Accordion/styles.cjs +51 -13
  6. package/dist/Accordion/styles.cjs.map +1 -1
  7. package/dist/Accordion/styles.js +51 -13
  8. package/dist/Accordion/styles.js.map +1 -1
  9. package/dist/Banners/Banner.cjs +38 -34
  10. package/dist/Banners/Banner.cjs.map +1 -1
  11. package/dist/Banners/Banner.d.ts +2 -3
  12. package/dist/Banners/Banner.js +38 -34
  13. package/dist/Banners/Banner.js.map +1 -1
  14. package/dist/Banners/styles.cjs +8 -16
  15. package/dist/Banners/styles.cjs.map +1 -1
  16. package/dist/Banners/styles.js +8 -16
  17. package/dist/Banners/styles.js.map +1 -1
  18. package/dist/Breadcrumb/Breadcrumb.cjs +8 -2
  19. package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -1
  20. package/dist/Breadcrumb/Breadcrumb.js +8 -2
  21. package/dist/Breadcrumb/Breadcrumb.js.map +1 -1
  22. package/dist/Breadcrumb/styles.cjs +15 -4
  23. package/dist/Breadcrumb/styles.cjs.map +1 -1
  24. package/dist/Breadcrumb/styles.js +15 -4
  25. package/dist/Breadcrumb/styles.js.map +1 -1
  26. package/dist/Button/BackButton.cjs +27 -6
  27. package/dist/Button/BackButton.cjs.map +1 -1
  28. package/dist/Button/BackButton.js +27 -6
  29. package/dist/Button/BackButton.js.map +1 -1
  30. package/dist/Button/Button.cjs +179 -47
  31. package/dist/Button/Button.cjs.map +1 -1
  32. package/dist/Button/Button.d.ts +2 -0
  33. package/dist/Button/Button.js +179 -47
  34. package/dist/Button/Button.js.map +1 -1
  35. package/dist/Button/Iconbutton.cjs +83 -21
  36. package/dist/Button/Iconbutton.cjs.map +1 -1
  37. package/dist/Button/Iconbutton.js +83 -21
  38. package/dist/Button/Iconbutton.js.map +1 -1
  39. package/dist/Card/HorizontalCard/HorizontalCard.cjs +20 -5
  40. package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
  41. package/dist/Card/HorizontalCard/HorizontalCard.js +20 -5
  42. package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
  43. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +12 -3
  44. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +1 -1
  45. package/dist/Card/HorizontalCard/HorizontalCardBody.js +12 -3
  46. package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +1 -1
  47. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +8 -2
  48. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +1 -1
  49. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +8 -2
  50. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +1 -1
  51. package/dist/Card/VerticalCard/Card.cjs +20 -5
  52. package/dist/Card/VerticalCard/Card.cjs.map +1 -1
  53. package/dist/Card/VerticalCard/Card.js +20 -5
  54. package/dist/Card/VerticalCard/Card.js.map +1 -1
  55. package/dist/Card/VerticalCard/CardBottomSection.cjs +72 -19
  56. package/dist/Card/VerticalCard/CardBottomSection.cjs.map +1 -1
  57. package/dist/Card/VerticalCard/CardBottomSection.d.ts +8 -1
  58. package/dist/Card/VerticalCard/CardBottomSection.js +73 -20
  59. package/dist/Card/VerticalCard/CardBottomSection.js.map +1 -1
  60. package/dist/Card/VerticalCard/CardMiddleSection.cjs +19 -4
  61. package/dist/Card/VerticalCard/CardMiddleSection.cjs.map +1 -1
  62. package/dist/Card/VerticalCard/CardMiddleSection.js +19 -4
  63. package/dist/Card/VerticalCard/CardMiddleSection.js.map +1 -1
  64. package/dist/Card/VerticalCard/CardTopSection.cjs +9 -2
  65. package/dist/Card/VerticalCard/CardTopSection.cjs.map +1 -1
  66. package/dist/Card/VerticalCard/CardTopSection.js +9 -2
  67. package/dist/Card/VerticalCard/CardTopSection.js.map +1 -1
  68. package/dist/Chips/ChipStyles.cjs +4 -1
  69. package/dist/Chips/ChipStyles.cjs.map +1 -1
  70. package/dist/Chips/ChipStyles.js +4 -1
  71. package/dist/Chips/ChipStyles.js.map +1 -1
  72. package/dist/ChipsInput/ChipInputField.cjs +16 -4
  73. package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
  74. package/dist/ChipsInput/ChipInputField.js +16 -4
  75. package/dist/ChipsInput/ChipInputField.js.map +1 -1
  76. package/dist/Dropdown/BasicDropdown.cjs +12 -3
  77. package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
  78. package/dist/Dropdown/BasicDropdown.js +12 -3
  79. package/dist/Dropdown/BasicDropdown.js.map +1 -1
  80. package/dist/Dropdown/CommonStyling.cjs +172 -42
  81. package/dist/Dropdown/CommonStyling.cjs.map +1 -1
  82. package/dist/Dropdown/CommonStyling.js +172 -42
  83. package/dist/Dropdown/CommonStyling.js.map +1 -1
  84. package/dist/Dropdown/DropdownContent.cjs +36 -10
  85. package/dist/Dropdown/DropdownContent.cjs.map +1 -1
  86. package/dist/Dropdown/DropdownContent.js +36 -10
  87. package/dist/Dropdown/DropdownContent.js.map +1 -1
  88. package/dist/Dropdown/DropdownFilter.cjs +12 -3
  89. package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
  90. package/dist/Dropdown/DropdownFilter.js +12 -3
  91. package/dist/Dropdown/DropdownFilter.js.map +1 -1
  92. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs +4 -1
  93. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
  94. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js +4 -1
  95. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
  96. package/dist/GlobalNavigationBar/__tests__/GlobalNavigationBar.tests.d.ts +1 -0
  97. package/dist/GlobalNavigationBar/__tests__/Logo.tests.d.ts +1 -0
  98. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +4 -1
  99. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -1
  100. package/dist/GlobalNavigationBar/desktop/UserMenu.js +4 -1
  101. package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -1
  102. package/dist/HyperLink/styling.cjs +38 -8
  103. package/dist/HyperLink/styling.cjs.map +1 -1
  104. package/dist/HyperLink/styling.js +38 -8
  105. package/dist/HyperLink/styling.js.map +1 -1
  106. package/dist/InputFields/Checkbox.cjs +54 -14
  107. package/dist/InputFields/Checkbox.cjs.map +1 -1
  108. package/dist/InputFields/Checkbox.js +54 -14
  109. package/dist/InputFields/Checkbox.js.map +1 -1
  110. package/dist/InputFields/DatepickerField.cjs +149 -43
  111. package/dist/InputFields/DatepickerField.cjs.map +1 -1
  112. package/dist/InputFields/DatepickerField.d.ts +1 -1
  113. package/dist/InputFields/DatepickerField.js +150 -44
  114. package/dist/InputFields/DatepickerField.js.map +1 -1
  115. package/dist/InputFields/DatepickerFieldHeader.cjs +20 -5
  116. package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
  117. package/dist/InputFields/DatepickerFieldHeader.js +20 -5
  118. package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
  119. package/dist/InputFields/Label.cjs +38 -11
  120. package/dist/InputFields/Label.cjs.map +1 -1
  121. package/dist/InputFields/Label.js +38 -11
  122. package/dist/InputFields/Label.js.map +1 -1
  123. package/dist/InputFields/NumberField.cjs +66 -16
  124. package/dist/InputFields/NumberField.cjs.map +1 -1
  125. package/dist/InputFields/NumberField.js +66 -16
  126. package/dist/InputFields/NumberField.js.map +1 -1
  127. package/dist/InputFields/PasswordField.cjs +4 -1
  128. package/dist/InputFields/PasswordField.cjs.map +1 -1
  129. package/dist/InputFields/PasswordField.d.ts +1 -1
  130. package/dist/InputFields/PasswordField.js +4 -1
  131. package/dist/InputFields/PasswordField.js.map +1 -1
  132. package/dist/InputFields/QuickSearch.cjs +30 -6
  133. package/dist/InputFields/QuickSearch.cjs.map +1 -1
  134. package/dist/InputFields/QuickSearch.js +30 -6
  135. package/dist/InputFields/QuickSearch.js.map +1 -1
  136. package/dist/InputFields/RadioButton.cjs +63 -15
  137. package/dist/InputFields/RadioButton.cjs.map +1 -1
  138. package/dist/InputFields/RadioButton.js +63 -15
  139. package/dist/InputFields/RadioButton.js.map +1 -1
  140. package/dist/InputFields/RichTextField.cjs +60 -15
  141. package/dist/InputFields/RichTextField.cjs.map +1 -1
  142. package/dist/InputFields/RichTextField.js +60 -15
  143. package/dist/InputFields/RichTextField.js.map +1 -1
  144. package/dist/InputFields/SearchBar.cjs +4 -1
  145. package/dist/InputFields/SearchBar.cjs.map +1 -1
  146. package/dist/InputFields/SearchBar.js +4 -1
  147. package/dist/InputFields/SearchBar.js.map +1 -1
  148. package/dist/InputFields/TextField.cjs +9 -3
  149. package/dist/InputFields/TextField.cjs.map +1 -1
  150. package/dist/InputFields/TextField.d.ts +1 -1
  151. package/dist/InputFields/TextField.js +9 -3
  152. package/dist/InputFields/TextField.js.map +1 -1
  153. package/dist/InputFields/Textarea.cjs +68 -17
  154. package/dist/InputFields/Textarea.cjs.map +1 -1
  155. package/dist/InputFields/Textarea.js +68 -17
  156. package/dist/InputFields/Textarea.js.map +1 -1
  157. package/dist/InputFields/components/SearchBarInput.cjs +28 -7
  158. package/dist/InputFields/components/SearchBarInput.cjs.map +1 -1
  159. package/dist/InputFields/components/SearchBarInput.js +28 -7
  160. package/dist/InputFields/components/SearchBarInput.js.map +1 -1
  161. package/dist/InputFields/components/SearchField.cjs +60 -15
  162. package/dist/InputFields/components/SearchField.cjs.map +1 -1
  163. package/dist/InputFields/components/SearchField.js +60 -15
  164. package/dist/InputFields/components/SearchField.js.map +1 -1
  165. package/dist/InputFields/styling.cjs +95 -39
  166. package/dist/InputFields/styling.cjs.map +1 -1
  167. package/dist/InputFields/styling.d.ts +1 -2
  168. package/dist/InputFields/styling.js +95 -39
  169. package/dist/InputFields/styling.js.map +1 -1
  170. package/dist/LinearProgress/LinearProgress.cjs +161 -53
  171. package/dist/LinearProgress/LinearProgress.cjs.map +1 -1
  172. package/dist/LinearProgress/LinearProgress.js +161 -53
  173. package/dist/LinearProgress/LinearProgress.js.map +1 -1
  174. package/dist/List/ListRow.cjs +36 -9
  175. package/dist/List/ListRow.cjs.map +1 -1
  176. package/dist/List/ListRow.js +36 -9
  177. package/dist/List/ListRow.js.map +1 -1
  178. package/dist/List/__tests__/ListRow.tests.d.ts +1 -0
  179. package/dist/LoadingIndicator/LoadingIndicator.cjs +4 -1
  180. package/dist/LoadingIndicator/LoadingIndicator.cjs.map +1 -1
  181. package/dist/LoadingIndicator/LoadingIndicator.js +4 -1
  182. package/dist/LoadingIndicator/LoadingIndicator.js.map +1 -1
  183. package/dist/LoadingPage/GlobalLoadingPage.cjs +4 -1
  184. package/dist/LoadingPage/GlobalLoadingPage.cjs.map +1 -1
  185. package/dist/LoadingPage/GlobalLoadingPage.js +4 -1
  186. package/dist/LoadingPage/GlobalLoadingPage.js.map +1 -1
  187. package/dist/MenuItem/MenuItem.cjs +101 -26
  188. package/dist/MenuItem/MenuItem.cjs.map +1 -1
  189. package/dist/MenuItem/MenuItem.js +101 -26
  190. package/dist/MenuItem/MenuItem.js.map +1 -1
  191. package/dist/Modals/Modal.cjs +4 -1
  192. package/dist/Modals/Modal.cjs.map +1 -1
  193. package/dist/Modals/Modal.js +4 -1
  194. package/dist/Modals/Modal.js.map +1 -1
  195. package/dist/Modals/ModalContent.cjs +24 -6
  196. package/dist/Modals/ModalContent.cjs.map +1 -1
  197. package/dist/Modals/ModalContent.js +24 -6
  198. package/dist/Modals/ModalContent.js.map +1 -1
  199. package/dist/Modals/ModalDialog.cjs +12 -3
  200. package/dist/Modals/ModalDialog.cjs.map +1 -1
  201. package/dist/Modals/ModalDialog.js +12 -3
  202. package/dist/Modals/ModalDialog.js.map +1 -1
  203. package/dist/Modals/ModalNote.cjs +16 -4
  204. package/dist/Modals/ModalNote.cjs.map +1 -1
  205. package/dist/Modals/ModalNote.js +16 -4
  206. package/dist/Modals/ModalNote.js.map +1 -1
  207. package/dist/Modals/ModalStyles.cjs +44 -11
  208. package/dist/Modals/ModalStyles.cjs.map +1 -1
  209. package/dist/Modals/ModalStyles.js +44 -11
  210. package/dist/Modals/ModalStyles.js.map +1 -1
  211. package/dist/NavItem/NavItem.cjs +4 -1
  212. package/dist/NavItem/NavItem.cjs.map +1 -1
  213. package/dist/NavItem/NavItem.js +4 -1
  214. package/dist/NavItem/NavItem.js.map +1 -1
  215. package/dist/NotificationDot/NotificationDot.cjs +17 -2
  216. package/dist/NotificationDot/NotificationDot.cjs.map +1 -1
  217. package/dist/NotificationDot/NotificationDot.js +17 -2
  218. package/dist/NotificationDot/NotificationDot.js.map +1 -1
  219. package/dist/Paginator/Paginator.cjs +76 -29
  220. package/dist/Paginator/Paginator.cjs.map +1 -1
  221. package/dist/Paginator/Paginator.js +76 -29
  222. package/dist/Paginator/Paginator.js.map +1 -1
  223. package/dist/Panel/Panel.cjs +4 -1
  224. package/dist/Panel/Panel.cjs.map +1 -1
  225. package/dist/Panel/Panel.js +4 -1
  226. package/dist/Panel/Panel.js.map +1 -1
  227. package/dist/Popover/Popover.cjs +22 -3
  228. package/dist/Popover/Popover.cjs.map +1 -1
  229. package/dist/Popover/Popover.js +22 -3
  230. package/dist/Popover/Popover.js.map +1 -1
  231. package/dist/ProfileButton/ProfileButton.cjs +9 -2
  232. package/dist/ProfileButton/ProfileButton.cjs.map +1 -1
  233. package/dist/ProfileButton/ProfileButton.js +9 -2
  234. package/dist/ProfileButton/ProfileButton.js.map +1 -1
  235. package/dist/SegmentControl/SegmentControl.cjs +46 -11
  236. package/dist/SegmentControl/SegmentControl.cjs.map +1 -1
  237. package/dist/SegmentControl/SegmentControl.js +46 -11
  238. package/dist/SegmentControl/SegmentControl.js.map +1 -1
  239. package/dist/SideMenu/SideMenuHeader.cjs +12 -3
  240. package/dist/SideMenu/SideMenuHeader.cjs.map +1 -1
  241. package/dist/SideMenu/SideMenuHeader.js +12 -3
  242. package/dist/SideMenu/SideMenuHeader.js.map +1 -1
  243. package/dist/Switcher/SwitcherMenuItem.cjs +4 -1
  244. package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -1
  245. package/dist/Switcher/SwitcherMenuItem.js +4 -1
  246. package/dist/Switcher/SwitcherMenuItem.js.map +1 -1
  247. package/dist/Table/TableFooter.cjs +8 -2
  248. package/dist/Table/TableFooter.cjs.map +1 -1
  249. package/dist/Table/TableFooter.js +8 -2
  250. package/dist/Table/TableFooter.js.map +1 -1
  251. package/dist/Table/TableStyles.cjs +132 -33
  252. package/dist/Table/TableStyles.cjs.map +1 -1
  253. package/dist/Table/TableStyles.js +132 -33
  254. package/dist/Table/TableStyles.js.map +1 -1
  255. package/dist/Tabs/HorizontalTabs.cjs +68 -18
  256. package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
  257. package/dist/Tabs/HorizontalTabs.js +68 -18
  258. package/dist/Tabs/HorizontalTabs.js.map +1 -1
  259. package/dist/Tabs/TabLink.cjs +4 -1
  260. package/dist/Tabs/TabLink.cjs.map +1 -1
  261. package/dist/Tabs/TabLink.js +4 -1
  262. package/dist/Tabs/TabLink.js.map +1 -1
  263. package/dist/Tabs/__tests__/TabLink.tests.d.ts +1 -0
  264. package/dist/Tabs/__tests__/Tablist.tests.d.ts +2 -0
  265. package/dist/Tag/Tag.cjs +2 -2
  266. package/dist/Tag/Tag.cjs.map +1 -1
  267. package/dist/Tag/Tag.js +2 -2
  268. package/dist/Tag/Tag.js.map +1 -1
  269. package/dist/Tile/Tile.cjs +8 -2
  270. package/dist/Tile/Tile.cjs.map +1 -1
  271. package/dist/Tile/Tile.js +8 -2
  272. package/dist/Tile/Tile.js.map +1 -1
  273. package/dist/Tile/TileCommonItems.cjs +8 -2
  274. package/dist/Tile/TileCommonItems.cjs.map +1 -1
  275. package/dist/Tile/TileCommonItems.js +8 -2
  276. package/dist/Tile/TileCommonItems.js.map +1 -1
  277. package/dist/Tile/TileFooter.cjs +4 -1
  278. package/dist/Tile/TileFooter.cjs.map +1 -1
  279. package/dist/Tile/TileFooter.js +4 -1
  280. package/dist/Tile/TileFooter.js.map +1 -1
  281. package/dist/Tile/TileHeader.cjs +12 -3
  282. package/dist/Tile/TileHeader.cjs.map +1 -1
  283. package/dist/Tile/TileHeader.js +12 -3
  284. package/dist/Tile/TileHeader.js.map +1 -1
  285. package/dist/Toasters/Toast.cjs +62 -13
  286. package/dist/Toasters/Toast.cjs.map +1 -1
  287. package/dist/Toasters/Toast.js +62 -13
  288. package/dist/Toasters/Toast.js.map +1 -1
  289. package/dist/Toggles/ToggleButton.cjs +9 -3
  290. package/dist/Toggles/ToggleButton.cjs.map +1 -1
  291. package/dist/Toggles/ToggleButton.d.ts +1 -1
  292. package/dist/Toggles/ToggleButton.js +9 -3
  293. package/dist/Toggles/ToggleButton.js.map +1 -1
  294. package/dist/Toggles/TogglerStyles.cjs +22 -8
  295. package/dist/Toggles/TogglerStyles.cjs.map +1 -1
  296. package/dist/Toggles/TogglerStyles.js +22 -8
  297. package/dist/Toggles/TogglerStyles.js.map +1 -1
  298. package/dist/Tooltips/TooltipStyles.cjs +28 -6
  299. package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
  300. package/dist/Tooltips/TooltipStyles.js +28 -6
  301. package/dist/Tooltips/TooltipStyles.js.map +1 -1
  302. package/dist/common/InputStyling.cjs +30 -7
  303. package/dist/common/InputStyling.cjs.map +1 -1
  304. package/dist/common/InputStyling.js +30 -7
  305. package/dist/common/InputStyling.js.map +1 -1
  306. package/dist/common/Link.cjs +45 -0
  307. package/dist/common/Link.cjs.map +1 -0
  308. package/dist/common/Link.d.ts +9 -0
  309. package/dist/common/Link.js +37 -0
  310. package/dist/common/Link.js.map +1 -0
  311. package/dist/common/NavigationHelper.cjs +30 -0
  312. package/dist/common/NavigationHelper.cjs.map +1 -0
  313. package/dist/common/NavigationHelper.d.ts +4 -0
  314. package/dist/common/NavigationHelper.js +23 -0
  315. package/dist/common/NavigationHelper.js.map +1 -0
  316. package/dist/custom.d.ts +2 -0
  317. package/dist/styles/colors.cjs +439 -84
  318. package/dist/styles/colors.cjs.map +1 -1
  319. package/dist/styles/colors.d.ts +200 -11
  320. package/dist/styles/colors.js +439 -84
  321. package/dist/styles/colors.js.map +1 -1
  322. package/dist/styles/global.cjs +19 -2
  323. package/dist/styles/global.cjs.map +1 -1
  324. package/dist/styles/global.d.ts +3 -2
  325. package/dist/styles/global.js +18 -3
  326. package/dist/styles/global.js.map +1 -1
  327. package/dist/styles/index.cjs +21 -9
  328. package/dist/styles/index.cjs.map +1 -1
  329. package/dist/styles/index.d.ts +2 -2
  330. package/dist/styles/index.js +18 -6
  331. package/dist/styles/index.js.map +1 -1
  332. package/dist/utils/color-tokens.cjs +91 -0
  333. package/dist/utils/color-tokens.cjs.map +1 -0
  334. package/dist/utils/color-tokens.d.ts +19 -0
  335. package/dist/utils/color-tokens.js +82 -0
  336. package/dist/utils/color-tokens.js.map +1 -0
  337. package/package.json +143 -141
@@ -49,22 +49,46 @@ 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.getColor('accent1_200', props.theme)} 50%, ${props => _styles.COLORS.getColor('accent1_600', props.theme)} 50%) left;
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;
53
59
  background-size: 200% 100%;
54
60
  }
55
61
 
56
62
  &.${_types.ToastColor[_types.ToastColor.GREEN]} {
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;
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;
58
70
  background-size: 200% 100%;
59
71
  }
60
72
 
61
73
  &.${_types.ToastColor[_types.ToastColor.ORANGE]} {
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;
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;
63
81
  background-size: 200% 100%;
64
82
  }
65
83
 
66
84
  &.${_types.ToastColor[_types.ToastColor.RED]} {
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;
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;
68
92
  background-size: 200% 100%;
69
93
  }
70
94
  `;
@@ -91,7 +115,10 @@ const ToastContainer = exports.ToastContainer = _styledComponents.default.div`
91
115
  min-height: 48px;
92
116
  box-sizing: border-box;
93
117
 
94
- ${props => (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.getColor('white', props.theme))}
118
+ ${props => (0, _styles.ComponentSStyling)(_styles.ComponentTextStyle.Regular, _styles.COLORS.generateToken({
119
+ componentType: 'bg-surface',
120
+ defaultVariant: 'default'
121
+ }, props.theme))}
95
122
 
96
123
  & a {
97
124
  display: inline;
@@ -112,19 +139,31 @@ const ToastContainer = exports.ToastContainer = _styledComponents.default.div`
112
139
  }
113
140
 
114
141
  &.${_types.ToastColor[_types.ToastColor.BLUE]} {
115
- background-color: ${props => _styles.COLORS.getColor('accent1_600', props.theme)};
142
+ background-color: ${props => _styles.COLORS.generateToken({
143
+ componentType: 'bg-fill',
144
+ defaultVariant: 'accent1'
145
+ }, props.theme)};
116
146
  }
117
147
 
118
148
  &.${_types.ToastColor[_types.ToastColor.GREEN]} {
119
- background-color: ${props => _styles.COLORS.getColor('correct_500', props.theme)};
149
+ background-color: ${props => _styles.COLORS.generateToken({
150
+ componentType: 'bg-fill',
151
+ defaultVariant: 'positive'
152
+ }, props.theme)};
120
153
  }
121
154
 
122
155
  &.${_types.ToastColor[_types.ToastColor.ORANGE]} {
123
- background-color: ${props => _styles.COLORS.getColor('warning_500', props.theme)};
156
+ background-color: ${props => _styles.COLORS.generateToken({
157
+ componentType: 'bg-fill',
158
+ defaultVariant: 'warning'
159
+ }, props.theme)};
124
160
  }
125
161
 
126
162
  &.${_types.ToastColor[_types.ToastColor.RED]} {
127
- background-color: ${props => _styles.COLORS.getColor('critical_500', props.theme)};
163
+ background-color: ${props => _styles.COLORS.generateToken({
164
+ componentType: 'bg-fill',
165
+ defaultVariant: 'critical'
166
+ }, props.theme)};
128
167
  }
129
168
  `;
130
169
  const ToastActionButtons = exports.ToastActionButtons = _styledComponents.default.div`
@@ -147,12 +186,19 @@ const ToastCloseButton = exports.ToastCloseButton = _styledComponents.default.di
147
186
  }
148
187
 
149
188
  button svg path{
150
- fill: ${props => _styles.COLORS.getColor('white', props.theme)} !important;
189
+ fill: ${props => _styles.COLORS.generateToken({
190
+ componentType: 'icon',
191
+ isOnFill: true,
192
+ defaultVariant: 'accent1'
193
+ }, props.theme)} !important;
151
194
  }
152
195
 
153
- &.${_types.ToastColor[_types.ToastColor.WHITE]} {
196
+ &.${_types.ToastColor[_types.ToastColor.WHITE]}, &.${_types.ToastColor[_types.ToastColor.ORANGE]} {
154
197
  button svg path {
155
- fill: ${props => _styles.COLORS.getColor('neutral_600', props.theme)} !important;
198
+ fill: ${props => _styles.COLORS.generateToken({
199
+ componentType: 'icon',
200
+ defaultVariant: 'subtle'
201
+ }, props.theme)} !important;
156
202
  }
157
203
  }
158
204
  `;
@@ -276,7 +322,10 @@ const Toast = _ref => {
276
322
  action: event => setShouldRemove(true),
277
323
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_icons.SystemIcons.Close, {
278
324
  size: "24px",
279
- color: _styles.COLORS.getColor('neutral_600', styledTheme)
325
+ color: _styles.COLORS.generateToken({
326
+ componentType: 'icon',
327
+ defaultVariant: 'subtle'
328
+ }, styledTheme)
280
329
  })
281
330
  })
282
331
  }), !!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","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":[]}
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":[]}
@@ -42,22 +42,46 @@ const Loader = styled.div`
42
42
  }
43
43
 
44
44
  &.${ToastColor[ToastColor.BLUE]} {
45
- background: linear-gradient(to right, ${props => COLORS.getColor('accent1_200', props.theme)} 50%, ${props => COLORS.getColor('accent1_600', props.theme)} 50%) left;
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;
46
52
  background-size: 200% 100%;
47
53
  }
48
54
 
49
55
  &.${ToastColor[ToastColor.GREEN]} {
50
- background: linear-gradient(to right, ${props => COLORS.getColor('correct_200', props.theme)} 50%, ${props => COLORS.getColor('correct_500', props.theme)} 50%) left;
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;
51
63
  background-size: 200% 100%;
52
64
  }
53
65
 
54
66
  &.${ToastColor[ToastColor.ORANGE]} {
55
- background: linear-gradient(to right, ${props => COLORS.getColor('warning_200', props.theme)} 50%, ${props => COLORS.getColor('warning_500', props.theme)} 50%) left;
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;
56
74
  background-size: 200% 100%;
57
75
  }
58
76
 
59
77
  &.${ToastColor[ToastColor.RED]} {
60
- background: linear-gradient(to right, ${props => COLORS.getColor('critical_200', props.theme)} 50%, ${props => COLORS.getColor('critical_500', props.theme)} 50%) left;
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;
61
85
  background-size: 200% 100%;
62
86
  }
63
87
  `;
@@ -84,7 +108,10 @@ export const ToastContainer = styled.div`
84
108
  min-height: 48px;
85
109
  box-sizing: border-box;
86
110
 
87
- ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.getColor('white', props.theme))}
111
+ ${props => ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({
112
+ componentType: 'bg-surface',
113
+ defaultVariant: 'default'
114
+ }, props.theme))}
88
115
 
89
116
  & a {
90
117
  display: inline;
@@ -105,19 +132,31 @@ export const ToastContainer = styled.div`
105
132
  }
106
133
 
107
134
  &.${ToastColor[ToastColor.BLUE]} {
108
- background-color: ${props => COLORS.getColor('accent1_600', props.theme)};
135
+ background-color: ${props => COLORS.generateToken({
136
+ componentType: 'bg-fill',
137
+ defaultVariant: 'accent1'
138
+ }, props.theme)};
109
139
  }
110
140
 
111
141
  &.${ToastColor[ToastColor.GREEN]} {
112
- background-color: ${props => COLORS.getColor('correct_500', props.theme)};
142
+ background-color: ${props => COLORS.generateToken({
143
+ componentType: 'bg-fill',
144
+ defaultVariant: 'positive'
145
+ }, props.theme)};
113
146
  }
114
147
 
115
148
  &.${ToastColor[ToastColor.ORANGE]} {
116
- background-color: ${props => COLORS.getColor('warning_500', props.theme)};
149
+ background-color: ${props => COLORS.generateToken({
150
+ componentType: 'bg-fill',
151
+ defaultVariant: 'warning'
152
+ }, props.theme)};
117
153
  }
118
154
 
119
155
  &.${ToastColor[ToastColor.RED]} {
120
- background-color: ${props => COLORS.getColor('critical_500', props.theme)};
156
+ background-color: ${props => COLORS.generateToken({
157
+ componentType: 'bg-fill',
158
+ defaultVariant: 'critical'
159
+ }, props.theme)};
121
160
  }
122
161
  `;
123
162
  export const ToastActionButtons = styled.div`
@@ -140,12 +179,19 @@ export const ToastCloseButton = styled.div`
140
179
  }
141
180
 
142
181
  button svg path{
143
- fill: ${props => COLORS.getColor('white', props.theme)} !important;
182
+ fill: ${props => COLORS.generateToken({
183
+ componentType: 'icon',
184
+ isOnFill: true,
185
+ defaultVariant: 'accent1'
186
+ }, props.theme)} !important;
144
187
  }
145
188
 
146
- &.${ToastColor[ToastColor.WHITE]} {
189
+ &.${ToastColor[ToastColor.WHITE]}, &.${ToastColor[ToastColor.ORANGE]} {
147
190
  button svg path {
148
- fill: ${props => COLORS.getColor('neutral_600', props.theme)} !important;
191
+ fill: ${props => COLORS.generateToken({
192
+ componentType: 'icon',
193
+ defaultVariant: 'subtle'
194
+ }, props.theme)} !important;
149
195
  }
150
196
  }
151
197
  `;
@@ -269,7 +315,10 @@ const Toast = _ref => {
269
315
  action: event => setShouldRemove(true),
270
316
  children: /*#__PURE__*/_jsx(SystemIcons.Close, {
271
317
  size: "24px",
272
- color: COLORS.getColor('neutral_600', styledTheme)
318
+ color: COLORS.generateToken({
319
+ componentType: 'icon',
320
+ defaultVariant: 'subtle'
321
+ }, styledTheme)
273
322
  })
274
323
  })
275
324
  }), !!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","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":[]}
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":[]}
@@ -25,7 +25,7 @@ const Wrapper = _styledComponents.default.div`
25
25
  &.disabled,
26
26
  &.active:not(.state-change) {
27
27
  ${_Iconbutton.IconButtonContentStyles} {
28
- background: ${props => _styles.COLORS.getColor('white', props.theme)};
28
+ background: transparent;
29
29
  }
30
30
  }
31
31
 
@@ -35,7 +35,10 @@ const Wrapper = _styledComponents.default.div`
35
35
  position: absolute;
36
36
  left: 12px;
37
37
  bottom: 1px;
38
- background-color: ${props => _styles.COLORS.getColor('primary_500', props.theme)};
38
+ background-color: ${props => _styles.COLORS.generateToken({
39
+ componentType: 'border',
40
+ defaultVariant: 'selected'
41
+ }, props.theme)};
39
42
  border-radius: 4px;
40
43
  height: 4px;
41
44
  width: 24px;
@@ -44,7 +47,10 @@ const Wrapper = _styledComponents.default.div`
44
47
 
45
48
  &.disabled:not(.state-change) {
46
49
  ${_Iconbutton.IconButtonContentStyles}:after {
47
- background: ${props => _styles.COLORS.getColor('neutral_300', props.theme)};
50
+ background: ${props => _styles.COLORS.generateToken({
51
+ componentType: 'icon',
52
+ state: 'disabled'
53
+ }, props.theme)};
48
54
  }
49
55
  }
50
56
  `;
@@ -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","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":[]}
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":[]}