@laerdal/life-react-components 6.0.0-dev.1.full → 6.0.0-dev.12.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 (394) 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/__tests__/AccordionMenu.test.tsx +42 -0
  6. package/dist/Accordion/__tests__/ContentAccordion.test.tsx +150 -0
  7. package/dist/Accordion/styles.cjs +51 -13
  8. package/dist/Accordion/styles.cjs.map +1 -1
  9. package/dist/Accordion/styles.js +51 -13
  10. package/dist/Accordion/styles.js.map +1 -1
  11. package/dist/AuthPage/__tests__/AuthPage.test.tsx +27 -0
  12. package/dist/Banners/Banner.cjs +38 -34
  13. package/dist/Banners/Banner.cjs.map +1 -1
  14. package/dist/Banners/Banner.d.ts +2 -3
  15. package/dist/Banners/Banner.js +38 -34
  16. package/dist/Banners/Banner.js.map +1 -1
  17. package/dist/Banners/__tests__/Banner.test.tsx +47 -0
  18. package/dist/Banners/__tests__/OverviewBanner.test.tsx +20 -0
  19. package/dist/Banners/styles.cjs +8 -16
  20. package/dist/Banners/styles.cjs.map +1 -1
  21. package/dist/Banners/styles.js +8 -16
  22. package/dist/Banners/styles.js.map +1 -1
  23. package/dist/Breadcrumb/Breadcrumb.cjs +8 -2
  24. package/dist/Breadcrumb/Breadcrumb.cjs.map +1 -1
  25. package/dist/Breadcrumb/Breadcrumb.js +8 -2
  26. package/dist/Breadcrumb/Breadcrumb.js.map +1 -1
  27. package/dist/Breadcrumb/__tests__/Breadcrumb.test.tsx +78 -0
  28. package/dist/Breadcrumb/styles.cjs +15 -4
  29. package/dist/Breadcrumb/styles.cjs.map +1 -1
  30. package/dist/Breadcrumb/styles.js +15 -4
  31. package/dist/Breadcrumb/styles.js.map +1 -1
  32. package/dist/Button/BackButton.cjs +27 -6
  33. package/dist/Button/BackButton.cjs.map +1 -1
  34. package/dist/Button/BackButton.js +27 -6
  35. package/dist/Button/BackButton.js.map +1 -1
  36. package/dist/Button/Button.cjs +179 -47
  37. package/dist/Button/Button.cjs.map +1 -1
  38. package/dist/Button/Button.d.ts +2 -0
  39. package/dist/Button/Button.js +179 -47
  40. package/dist/Button/Button.js.map +1 -1
  41. package/dist/Button/Iconbutton.cjs +83 -21
  42. package/dist/Button/Iconbutton.cjs.map +1 -1
  43. package/dist/Button/Iconbutton.js +83 -21
  44. package/dist/Button/Iconbutton.js.map +1 -1
  45. package/dist/Button/__tests__/BackButton.test.tsx +32 -0
  46. package/dist/Button/__tests__/Button.test.tsx +45 -0
  47. package/dist/Button/__tests__/DualButton.test.tsx +119 -0
  48. package/dist/Card/HorizontalCard/HorizontalCard.cjs +20 -5
  49. package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
  50. package/dist/Card/HorizontalCard/HorizontalCard.js +20 -5
  51. package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
  52. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +12 -3
  53. package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +1 -1
  54. package/dist/Card/HorizontalCard/HorizontalCardBody.js +12 -3
  55. package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +1 -1
  56. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +8 -2
  57. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +1 -1
  58. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +8 -2
  59. package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +1 -1
  60. package/dist/Card/HorizontalCard/__tests__/HorizontalCard.test.tsx +71 -0
  61. package/dist/Card/HorizontalCard/__tests__/VerticalCard.test.tsx +124 -0
  62. package/dist/Card/VerticalCard/Card.cjs +20 -5
  63. package/dist/Card/VerticalCard/Card.cjs.map +1 -1
  64. package/dist/Card/VerticalCard/Card.js +20 -5
  65. package/dist/Card/VerticalCard/Card.js.map +1 -1
  66. package/dist/Card/VerticalCard/CardBottomSection.cjs +72 -19
  67. package/dist/Card/VerticalCard/CardBottomSection.cjs.map +1 -1
  68. package/dist/Card/VerticalCard/CardBottomSection.d.ts +8 -1
  69. package/dist/Card/VerticalCard/CardBottomSection.js +73 -20
  70. package/dist/Card/VerticalCard/CardBottomSection.js.map +1 -1
  71. package/dist/Card/VerticalCard/CardMiddleSection.cjs +19 -4
  72. package/dist/Card/VerticalCard/CardMiddleSection.cjs.map +1 -1
  73. package/dist/Card/VerticalCard/CardMiddleSection.js +19 -4
  74. package/dist/Card/VerticalCard/CardMiddleSection.js.map +1 -1
  75. package/dist/Card/VerticalCard/CardTopSection.cjs +9 -2
  76. package/dist/Card/VerticalCard/CardTopSection.cjs.map +1 -1
  77. package/dist/Card/VerticalCard/CardTopSection.js +9 -2
  78. package/dist/Card/VerticalCard/CardTopSection.js.map +1 -1
  79. package/dist/Card/__tests__/Card.test.tsx +146 -0
  80. package/dist/Chips/ChipStyles.cjs +4 -1
  81. package/dist/Chips/ChipStyles.cjs.map +1 -1
  82. package/dist/Chips/ChipStyles.js +4 -1
  83. package/dist/Chips/ChipStyles.js.map +1 -1
  84. package/dist/Chips/__tests__/ActionChip.test.tsx +94 -0
  85. package/dist/Chips/__tests__/ChoiceChips.test.tsx +79 -0
  86. package/dist/Chips/__tests__/FilterChip.test.tsx +95 -0
  87. package/dist/Chips/__tests__/InputChip.test.tsx +155 -0
  88. package/dist/ChipsInput/ChipInputField.cjs +16 -4
  89. package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
  90. package/dist/ChipsInput/ChipInputField.js +16 -4
  91. package/dist/ChipsInput/ChipInputField.js.map +1 -1
  92. package/dist/ChipsInput/__tests__/ChipDropdownInput.test.tsx +100 -0
  93. package/dist/ChipsInput/__tests__/ChipInputFields.test.tsx +155 -0
  94. package/dist/Dropdown/BasicDropdown.cjs +12 -3
  95. package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
  96. package/dist/Dropdown/BasicDropdown.js +12 -3
  97. package/dist/Dropdown/BasicDropdown.js.map +1 -1
  98. package/dist/Dropdown/CommonStyling.cjs +172 -42
  99. package/dist/Dropdown/CommonStyling.cjs.map +1 -1
  100. package/dist/Dropdown/CommonStyling.js +172 -42
  101. package/dist/Dropdown/CommonStyling.js.map +1 -1
  102. package/dist/Dropdown/DropdownContent.cjs +36 -10
  103. package/dist/Dropdown/DropdownContent.cjs.map +1 -1
  104. package/dist/Dropdown/DropdownContent.js +36 -10
  105. package/dist/Dropdown/DropdownContent.js.map +1 -1
  106. package/dist/Dropdown/DropdownFilter.cjs +12 -3
  107. package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
  108. package/dist/Dropdown/DropdownFilter.js +12 -3
  109. package/dist/Dropdown/DropdownFilter.js.map +1 -1
  110. package/dist/Dropdown/__tests__/DropdownFilter.test.tsx +39 -0
  111. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs +4 -1
  112. package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
  113. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js +4 -1
  114. package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
  115. package/dist/Footer/__tests__/Footer.test.tsx +182 -0
  116. package/dist/GlobalNavigationBar/__tests__/GlobalNavigationBar.tests.d.ts +1 -0
  117. package/dist/GlobalNavigationBar/__tests__/Logo.test.tsx +39 -0
  118. package/dist/GlobalNavigationBar/__tests__/Logo.tests.d.ts +1 -0
  119. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs +4 -1
  120. package/dist/GlobalNavigationBar/desktop/UserMenu.cjs.map +1 -1
  121. package/dist/GlobalNavigationBar/desktop/UserMenu.js +4 -1
  122. package/dist/GlobalNavigationBar/desktop/UserMenu.js.map +1 -1
  123. package/dist/GlobalNavigationBar/desktop/__tests__/DesktopActions.test.tsx +108 -0
  124. package/dist/GlobalNavigationBar/desktop/__tests__/ExtendedMainMenu.test.tsx +28 -0
  125. package/dist/GlobalNavigationBar/desktop/__tests__/MainMenu.test.tsx +55 -0
  126. package/dist/GlobalNavigationBar/desktop/__tests__/RightSideNav.test.tsx +45 -0
  127. package/dist/GlobalNavigationBar/desktop/__tests__/UserMenu.test.tsx +125 -0
  128. package/dist/GlobalNavigationBar/mobile/__tests__/MobileMenu.test.tsx +317 -0
  129. package/dist/GlobalNavigationBar/mobile/__tests__/MobileMenuContent.test.tsx +294 -0
  130. package/dist/GlobalNavigationBar/mobile/__tests__/MobileMenuHeader.test.tsx +195 -0
  131. package/dist/HyperLink/styling.cjs +38 -8
  132. package/dist/HyperLink/styling.cjs.map +1 -1
  133. package/dist/HyperLink/styling.js +38 -8
  134. package/dist/HyperLink/styling.js.map +1 -1
  135. package/dist/InputFields/Checkbox.cjs +54 -14
  136. package/dist/InputFields/Checkbox.cjs.map +1 -1
  137. package/dist/InputFields/Checkbox.js +54 -14
  138. package/dist/InputFields/Checkbox.js.map +1 -1
  139. package/dist/InputFields/DatepickerField.cjs +149 -43
  140. package/dist/InputFields/DatepickerField.cjs.map +1 -1
  141. package/dist/InputFields/DatepickerField.d.ts +1 -1
  142. package/dist/InputFields/DatepickerField.js +150 -44
  143. package/dist/InputFields/DatepickerField.js.map +1 -1
  144. package/dist/InputFields/DatepickerFieldHeader.cjs +20 -5
  145. package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
  146. package/dist/InputFields/DatepickerFieldHeader.js +20 -5
  147. package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
  148. package/dist/InputFields/Label.cjs +38 -11
  149. package/dist/InputFields/Label.cjs.map +1 -1
  150. package/dist/InputFields/Label.js +38 -11
  151. package/dist/InputFields/Label.js.map +1 -1
  152. package/dist/InputFields/NumberField.cjs +66 -16
  153. package/dist/InputFields/NumberField.cjs.map +1 -1
  154. package/dist/InputFields/NumberField.js +66 -16
  155. package/dist/InputFields/NumberField.js.map +1 -1
  156. package/dist/InputFields/PasswordField.cjs +4 -1
  157. package/dist/InputFields/PasswordField.cjs.map +1 -1
  158. package/dist/InputFields/PasswordField.d.ts +1 -1
  159. package/dist/InputFields/PasswordField.js +4 -1
  160. package/dist/InputFields/PasswordField.js.map +1 -1
  161. package/dist/InputFields/QuickSearch.cjs +30 -6
  162. package/dist/InputFields/QuickSearch.cjs.map +1 -1
  163. package/dist/InputFields/QuickSearch.js +30 -6
  164. package/dist/InputFields/QuickSearch.js.map +1 -1
  165. package/dist/InputFields/RadioButton.cjs +63 -15
  166. package/dist/InputFields/RadioButton.cjs.map +1 -1
  167. package/dist/InputFields/RadioButton.js +63 -15
  168. package/dist/InputFields/RadioButton.js.map +1 -1
  169. package/dist/InputFields/RichTextField.cjs +60 -15
  170. package/dist/InputFields/RichTextField.cjs.map +1 -1
  171. package/dist/InputFields/RichTextField.js +60 -15
  172. package/dist/InputFields/RichTextField.js.map +1 -1
  173. package/dist/InputFields/SearchBar.cjs +4 -1
  174. package/dist/InputFields/SearchBar.cjs.map +1 -1
  175. package/dist/InputFields/SearchBar.js +4 -1
  176. package/dist/InputFields/SearchBar.js.map +1 -1
  177. package/dist/InputFields/TextField.cjs +9 -3
  178. package/dist/InputFields/TextField.cjs.map +1 -1
  179. package/dist/InputFields/TextField.d.ts +1 -1
  180. package/dist/InputFields/TextField.js +9 -3
  181. package/dist/InputFields/TextField.js.map +1 -1
  182. package/dist/InputFields/Textarea.cjs +68 -17
  183. package/dist/InputFields/Textarea.cjs.map +1 -1
  184. package/dist/InputFields/Textarea.js +68 -17
  185. package/dist/InputFields/Textarea.js.map +1 -1
  186. package/dist/InputFields/__tests__/NumberField.test.tsx +67 -0
  187. package/dist/InputFields/__tests__/NumberInput.test.tsx +68 -0
  188. package/dist/InputFields/__tests__/QuickSearch.test.tsx +42 -0
  189. package/dist/InputFields/components/SearchBarInput.cjs +28 -7
  190. package/dist/InputFields/components/SearchBarInput.cjs.map +1 -1
  191. package/dist/InputFields/components/SearchBarInput.js +28 -7
  192. package/dist/InputFields/components/SearchBarInput.js.map +1 -1
  193. package/dist/InputFields/components/SearchField.cjs +60 -15
  194. package/dist/InputFields/components/SearchField.cjs.map +1 -1
  195. package/dist/InputFields/components/SearchField.js +60 -15
  196. package/dist/InputFields/components/SearchField.js.map +1 -1
  197. package/dist/InputFields/styling.cjs +95 -39
  198. package/dist/InputFields/styling.cjs.map +1 -1
  199. package/dist/InputFields/styling.d.ts +1 -2
  200. package/dist/InputFields/styling.js +95 -39
  201. package/dist/InputFields/styling.js.map +1 -1
  202. package/dist/LinearProgress/LinearProgress.cjs +161 -53
  203. package/dist/LinearProgress/LinearProgress.cjs.map +1 -1
  204. package/dist/LinearProgress/LinearProgress.js +161 -53
  205. package/dist/LinearProgress/LinearProgress.js.map +1 -1
  206. package/dist/LinearProgress/__tests__/LinearProgress.test.tsx +25 -0
  207. package/dist/List/ListRow.cjs +36 -9
  208. package/dist/List/ListRow.cjs.map +1 -1
  209. package/dist/List/ListRow.js +36 -9
  210. package/dist/List/ListRow.js.map +1 -1
  211. package/dist/List/__tests__/ListRow.test.tsx +18 -0
  212. package/dist/List/__tests__/ListRow.tests.d.ts +1 -0
  213. package/dist/LoadingIndicator/LoadingIndicator.cjs +4 -1
  214. package/dist/LoadingIndicator/LoadingIndicator.cjs.map +1 -1
  215. package/dist/LoadingIndicator/LoadingIndicator.js +4 -1
  216. package/dist/LoadingIndicator/LoadingIndicator.js.map +1 -1
  217. package/dist/LoadingPage/GlobalLoadingPage.cjs +4 -1
  218. package/dist/LoadingPage/GlobalLoadingPage.cjs.map +1 -1
  219. package/dist/LoadingPage/GlobalLoadingPage.js +4 -1
  220. package/dist/LoadingPage/GlobalLoadingPage.js.map +1 -1
  221. package/dist/LoadingPage/__tests__/GlobalLoadingPage.test.tsx +23 -0
  222. package/dist/MenuItem/MenuItem.cjs +101 -26
  223. package/dist/MenuItem/MenuItem.cjs.map +1 -1
  224. package/dist/MenuItem/MenuItem.js +101 -26
  225. package/dist/MenuItem/MenuItem.js.map +1 -1
  226. package/dist/Modals/Modal.cjs +4 -1
  227. package/dist/Modals/Modal.cjs.map +1 -1
  228. package/dist/Modals/Modal.js +4 -1
  229. package/dist/Modals/Modal.js.map +1 -1
  230. package/dist/Modals/ModalContent.cjs +24 -6
  231. package/dist/Modals/ModalContent.cjs.map +1 -1
  232. package/dist/Modals/ModalContent.js +24 -6
  233. package/dist/Modals/ModalContent.js.map +1 -1
  234. package/dist/Modals/ModalDialog.cjs +12 -3
  235. package/dist/Modals/ModalDialog.cjs.map +1 -1
  236. package/dist/Modals/ModalDialog.js +12 -3
  237. package/dist/Modals/ModalDialog.js.map +1 -1
  238. package/dist/Modals/ModalNote.cjs +16 -4
  239. package/dist/Modals/ModalNote.cjs.map +1 -1
  240. package/dist/Modals/ModalNote.js +16 -4
  241. package/dist/Modals/ModalNote.js.map +1 -1
  242. package/dist/Modals/ModalStyles.cjs +44 -11
  243. package/dist/Modals/ModalStyles.cjs.map +1 -1
  244. package/dist/Modals/ModalStyles.js +44 -11
  245. package/dist/Modals/ModalStyles.js.map +1 -1
  246. package/dist/Modals/__tests__/Modal.test.tsx +169 -0
  247. package/dist/Modals/__tests__/ModalContainer.test.tsx +77 -0
  248. package/dist/Modals/__tests__/ModalContent.test.tsx +126 -0
  249. package/dist/NavItem/NavItem.cjs +4 -1
  250. package/dist/NavItem/NavItem.cjs.map +1 -1
  251. package/dist/NavItem/NavItem.js +4 -1
  252. package/dist/NavItem/NavItem.js.map +1 -1
  253. package/dist/NavItem/__tests__/NavItem.test.ts +6 -0
  254. package/dist/NotificationDot/NotificationDot.cjs +17 -2
  255. package/dist/NotificationDot/NotificationDot.cjs.map +1 -1
  256. package/dist/NotificationDot/NotificationDot.js +17 -2
  257. package/dist/NotificationDot/NotificationDot.js.map +1 -1
  258. package/dist/NotificationDot/__tests__/NotificationDot.test.tsx +33 -0
  259. package/dist/Paginator/Paginator.cjs +76 -29
  260. package/dist/Paginator/Paginator.cjs.map +1 -1
  261. package/dist/Paginator/Paginator.js +76 -29
  262. package/dist/Paginator/Paginator.js.map +1 -1
  263. package/dist/Paginator/__tests__/Paginator.test.tsx +39 -0
  264. package/dist/Panel/Panel.cjs +4 -1
  265. package/dist/Panel/Panel.cjs.map +1 -1
  266. package/dist/Panel/Panel.js +4 -1
  267. package/dist/Panel/Panel.js.map +1 -1
  268. package/dist/Popover/Popover.cjs +22 -3
  269. package/dist/Popover/Popover.cjs.map +1 -1
  270. package/dist/Popover/Popover.js +22 -3
  271. package/dist/Popover/Popover.js.map +1 -1
  272. package/dist/Popover/__tests__/Popover.test.tsx +64 -0
  273. package/dist/ProfileButton/ProfileButton.cjs +9 -2
  274. package/dist/ProfileButton/ProfileButton.cjs.map +1 -1
  275. package/dist/ProfileButton/ProfileButton.js +9 -2
  276. package/dist/ProfileButton/ProfileButton.js.map +1 -1
  277. package/dist/ProfileButton/__tests__/ProfileButton.test.tsx +31 -0
  278. package/dist/QuizButton/__tests__/QuizButton.test.tsx +53 -0
  279. package/dist/SegmentControl/SegmentControl.cjs +46 -11
  280. package/dist/SegmentControl/SegmentControl.cjs.map +1 -1
  281. package/dist/SegmentControl/SegmentControl.js +46 -11
  282. package/dist/SegmentControl/SegmentControl.js.map +1 -1
  283. package/dist/SegmentControl/__tests__/SegmentControl.test.tsx +145 -0
  284. package/dist/SideMenu/SideMenuHeader.cjs +12 -3
  285. package/dist/SideMenu/SideMenuHeader.cjs.map +1 -1
  286. package/dist/SideMenu/SideMenuHeader.js +12 -3
  287. package/dist/SideMenu/SideMenuHeader.js.map +1 -1
  288. package/dist/SideMenu/__tests__/SideMenu.test.tsx +99 -0
  289. package/dist/Switcher/SwitcherMenuItem.cjs +4 -1
  290. package/dist/Switcher/SwitcherMenuItem.cjs.map +1 -1
  291. package/dist/Switcher/SwitcherMenuItem.js +4 -1
  292. package/dist/Switcher/SwitcherMenuItem.js.map +1 -1
  293. package/dist/Switcher/__tests__/SwitcherMenuItem.tsx +14 -0
  294. package/dist/Table/TableFooter.cjs +8 -2
  295. package/dist/Table/TableFooter.cjs.map +1 -1
  296. package/dist/Table/TableFooter.js +8 -2
  297. package/dist/Table/TableFooter.js.map +1 -1
  298. package/dist/Table/TableStyles.cjs +132 -33
  299. package/dist/Table/TableStyles.cjs.map +1 -1
  300. package/dist/Table/TableStyles.js +132 -33
  301. package/dist/Table/TableStyles.js.map +1 -1
  302. package/dist/Table/__tests__/Table.test.tsx +499 -0
  303. package/dist/Tabs/HorizontalTabs.cjs +68 -18
  304. package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
  305. package/dist/Tabs/HorizontalTabs.js +68 -18
  306. package/dist/Tabs/HorizontalTabs.js.map +1 -1
  307. package/dist/Tabs/TabLink.cjs +4 -1
  308. package/dist/Tabs/TabLink.cjs.map +1 -1
  309. package/dist/Tabs/TabLink.js +4 -1
  310. package/dist/Tabs/TabLink.js.map +1 -1
  311. package/dist/Tabs/__tests__/HorizontalTabs.test.tsx +95 -0
  312. package/dist/Tabs/__tests__/TabLink.test.tsx +40 -0
  313. package/dist/Tabs/__tests__/TabLink.tests.d.ts +1 -0
  314. package/dist/Tabs/__tests__/Tablist.test.tsx +37 -0
  315. package/dist/Tabs/__tests__/Tablist.tests.d.ts +2 -0
  316. package/dist/Tag/Tag.cjs +2 -2
  317. package/dist/Tag/Tag.cjs.map +1 -1
  318. package/dist/Tag/Tag.js +2 -2
  319. package/dist/Tag/Tag.js.map +1 -1
  320. package/dist/Tag/__tests__/Tag.test.tsx +86 -0
  321. package/dist/Tile/Tile.cjs +8 -2
  322. package/dist/Tile/Tile.cjs.map +1 -1
  323. package/dist/Tile/Tile.js +8 -2
  324. package/dist/Tile/Tile.js.map +1 -1
  325. package/dist/Tile/TileCommonItems.cjs +8 -2
  326. package/dist/Tile/TileCommonItems.cjs.map +1 -1
  327. package/dist/Tile/TileCommonItems.js +8 -2
  328. package/dist/Tile/TileCommonItems.js.map +1 -1
  329. package/dist/Tile/TileFooter.cjs +4 -1
  330. package/dist/Tile/TileFooter.cjs.map +1 -1
  331. package/dist/Tile/TileFooter.js +4 -1
  332. package/dist/Tile/TileFooter.js.map +1 -1
  333. package/dist/Tile/TileHeader.cjs +12 -3
  334. package/dist/Tile/TileHeader.cjs.map +1 -1
  335. package/dist/Tile/TileHeader.js +12 -3
  336. package/dist/Tile/TileHeader.js.map +1 -1
  337. package/dist/Toasters/Toast.cjs +62 -13
  338. package/dist/Toasters/Toast.cjs.map +1 -1
  339. package/dist/Toasters/Toast.js +62 -13
  340. package/dist/Toasters/Toast.js.map +1 -1
  341. package/dist/Toasters/__tests__/Toast.test.tsx +74 -0
  342. package/dist/Toggles/ToggleButton.cjs +9 -3
  343. package/dist/Toggles/ToggleButton.cjs.map +1 -1
  344. package/dist/Toggles/ToggleButton.d.ts +1 -1
  345. package/dist/Toggles/ToggleButton.js +9 -3
  346. package/dist/Toggles/ToggleButton.js.map +1 -1
  347. package/dist/Toggles/TogglerStyles.cjs +22 -8
  348. package/dist/Toggles/TogglerStyles.cjs.map +1 -1
  349. package/dist/Toggles/TogglerStyles.js +22 -8
  350. package/dist/Toggles/TogglerStyles.js.map +1 -1
  351. package/dist/Toggles/__tests__/ToggleButton.test.tsx +53 -0
  352. package/dist/Toggles/__tests__/ToggleSwitch.test.tsx +87 -0
  353. package/dist/Tooltips/TooltipStyles.cjs +28 -6
  354. package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
  355. package/dist/Tooltips/TooltipStyles.js +28 -6
  356. package/dist/Tooltips/TooltipStyles.js.map +1 -1
  357. package/dist/Tooltips/__tests__/TooltipWrapper.test.tsx +16 -0
  358. package/dist/common/InputStyling.cjs +30 -7
  359. package/dist/common/InputStyling.cjs.map +1 -1
  360. package/dist/common/InputStyling.js +30 -7
  361. package/dist/common/InputStyling.js.map +1 -1
  362. package/dist/common/Link.cjs +45 -0
  363. package/dist/common/Link.cjs.map +1 -0
  364. package/dist/common/Link.d.ts +9 -0
  365. package/dist/common/Link.js +37 -0
  366. package/dist/common/Link.js.map +1 -0
  367. package/dist/common/NavigationHelper.cjs +30 -0
  368. package/dist/common/NavigationHelper.cjs.map +1 -0
  369. package/dist/common/NavigationHelper.d.ts +4 -0
  370. package/dist/common/NavigationHelper.js +23 -0
  371. package/dist/common/NavigationHelper.js.map +1 -0
  372. package/dist/custom.d.ts +2 -0
  373. package/dist/styles/colors.cjs +439 -84
  374. package/dist/styles/colors.cjs.map +1 -1
  375. package/dist/styles/colors.d.ts +200 -11
  376. package/dist/styles/colors.js +439 -84
  377. package/dist/styles/colors.js.map +1 -1
  378. package/dist/styles/global.cjs +19 -2
  379. package/dist/styles/global.cjs.map +1 -1
  380. package/dist/styles/global.d.ts +3 -2
  381. package/dist/styles/global.js +18 -3
  382. package/dist/styles/global.js.map +1 -1
  383. package/dist/styles/index.cjs +21 -9
  384. package/dist/styles/index.cjs.map +1 -1
  385. package/dist/styles/index.d.ts +2 -2
  386. package/dist/styles/index.js +18 -6
  387. package/dist/styles/index.js.map +1 -1
  388. package/dist/styles/react-datepicker.css +766 -0
  389. package/dist/utils/color-tokens.cjs +91 -0
  390. package/dist/utils/color-tokens.cjs.map +1 -0
  391. package/dist/utils/color-tokens.d.ts +19 -0
  392. package/dist/utils/color-tokens.js +82 -0
  393. package/dist/utils/color-tokens.js.map +1 -0
  394. package/package.json +144 -141
@@ -1,12 +1,12 @@
1
1
  import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
2
2
  import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
3
3
  import _pt from "prop-types";
4
- const _excluded = ["children", "variant", "type", "size", "colorTheme", "invertFocus", "width", "testId", "disabled", "flatEdge", "icon"],
4
+ const _excluded = ["children", "variant", "type", "size", "colorTheme", "invertFocus", "width", "testId", "disabled", "flatEdge", "icon", "iconPosition"],
5
5
  _excluded2 = ["loading"];
6
6
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
7
7
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
8
8
  import * as React from 'react';
9
- import styled from 'styled-components';
9
+ import styled, { useTheme } from 'styled-components';
10
10
  import { LoadingIndicator } from '../LoadingIndicator';
11
11
  import { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';
12
12
  import { COLORS, focusStyles, invertedFocusStyles } from '../styles';
@@ -35,15 +35,29 @@ export const ButtonPrimaryStyled = styled(ButtonBaseStyled)`
35
35
  padding: 0;
36
36
  margin: 0;
37
37
  position: relative;
38
- box-sizing: border-box;
39
- min-height: ${props => props.$size === Size.Large ? '56px' : '48px'};
38
+ box-sizing: border-box;
40
39
  &.loading-state {
41
40
  cursor: wait;
42
41
  }
43
42
  ${ButtonContentContainer} {
44
- ${props => props.$size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme)) : props.$size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme)) : ComponentMStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};
43
+ ${props => props.$size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({
44
+ componentType: 'text',
45
+ isOnFill: true,
46
+ defaultVariant: 'primary'
47
+ }, props.theme)) : props.$size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({
48
+ componentType: 'text',
49
+ isOnFill: true,
50
+ defaultVariant: 'primary'
51
+ }, props.theme)) : ComponentMStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({
52
+ componentType: 'text',
53
+ isOnFill: true,
54
+ defaultVariant: 'primary'
55
+ }, props.theme))};
45
56
 
46
- background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme)};
57
+ background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
58
+ componentType: 'bg-fill',
59
+ defaultVariant: 'primary'
60
+ }, props.theme)};
47
61
  border-radius: ${props => getBorderRadius(props.$flatEdge, 8)};
48
62
 
49
63
  width: ${props => props.$width};
@@ -86,20 +100,40 @@ export const ButtonPrimaryStyled = styled(ButtonBaseStyled)`
86
100
  height: ${props => props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px'};
87
101
  width: ${props => props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px'};
88
102
  path {
89
- fill: ${props => props.$colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.getColor('white', props.theme)};
103
+ fill: ${props => props.$colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.generateToken({
104
+ componentType: 'icon',
105
+ isOnFill: true,
106
+ defaultVariant: 'primary'
107
+ }, props.theme)};
90
108
  }
91
109
  }
92
110
  }
93
111
  }
94
112
  &:hover > ${ButtonContentContainer},
95
113
  &.hover-state > ${ButtonContentContainer} {
96
- background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.getColor('primary_700', props.theme)};
97
- color: ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('white', props.theme)};
114
+ background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.generateToken({
115
+ componentType: 'bg-fill',
116
+ state: 'hover',
117
+ defaultVariant: 'primary'
118
+ }, props.theme)};
119
+ color: ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.generateToken({
120
+ componentType: 'text',
121
+ isOnFill: true,
122
+ defaultVariant: 'primary'
123
+ }, props.theme)};
98
124
  }
99
125
  &:active > ${ButtonContentContainer},
100
126
  &.active-state > ${ButtonContentContainer} {
101
- background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_800', props.theme)};
102
- color: ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme)};
127
+ background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.generateToken({
128
+ componentType: 'bg-fill',
129
+ state: 'active',
130
+ defaultVariant: 'primary'
131
+ }, props.theme)};
132
+ color: ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({
133
+ componentType: 'text',
134
+ isOnFill: true,
135
+ defaultVariant: 'primary'
136
+ }, props.theme)};
103
137
  }
104
138
 
105
139
  &:focus,
@@ -113,46 +147,86 @@ export const ButtonPrimaryStyled = styled(ButtonBaseStyled)`
113
147
  &:disabled > ${ButtonContentContainer},
114
148
  &.disabled-state > ${ButtonContentContainer} {
115
149
  pointer-events: none;
116
- background-color: ${props => props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme)};
117
- color: ${props => props.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('neutral_300', props.theme)};
150
+ background-color: ${props => props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({
151
+ componentType: 'bg-fill',
152
+ state: 'disabled'
153
+ }, props.theme)};
154
+ color: ${props => props.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({
155
+ componentType: 'text',
156
+ isOnFill: true,
157
+ state: 'disabled'
158
+ }, props.theme)};
118
159
  }
119
160
  `;
120
161
  export const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)`
121
162
  ${ButtonContentContainer} {
122
- color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme)};
163
+ color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
164
+ componentType: 'text',
165
+ defaultVariant: 'primary'
166
+ }, props.theme)};
123
167
  background-color: transparent;
124
168
  div svg path {
125
- fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.getColor('primary', props.theme)};
169
+ fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.generateToken({
170
+ componentType: 'icon',
171
+ defaultVariant: 'primary'
172
+ }, props.theme)};
126
173
  }
127
- box-shadow: inset 0 0 0 2px ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme)};
174
+ box-shadow: inset 0 0 0 2px ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
175
+ componentType: 'border',
176
+ defaultVariant: 'primary'
177
+ }, props.theme)};
128
178
 
129
179
  padding: ${props => props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px'};
130
180
  }
131
181
 
132
182
  &:hover > ${ButtonContentContainer},
133
183
  &.hover-state > ${ButtonContentContainer} {
134
- color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme)};
135
- box-shadow: inset 0 0 0 2px ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme)};
184
+ color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.generateToken({
185
+ componentType: 'text',
186
+ state: 'hover',
187
+ defaultVariant: 'primary'
188
+ }, props.theme)};
189
+ box-shadow: inset 0 0 0 2px ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.generateToken({
190
+ componentType: 'border',
191
+ state: 'hover',
192
+ defaultVariant: 'primary'
193
+ }, props.theme)};
136
194
 
137
195
  background-color: transparent;
138
196
  div {
139
197
  svg {
140
198
  path {
141
- fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.getColor('primary_700', props.theme)};
199
+ fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.generateToken({
200
+ componentType: 'text',
201
+ state: 'hover',
202
+ defaultVariant: 'primary'
203
+ }, props.theme)};
142
204
  }
143
205
  }
144
206
  }
145
207
  }
146
208
  &:active > ${ButtonContentContainer},
147
209
  &.active-state > ${ButtonContentContainer} {
148
- color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme)};
149
- box-shadow: inset 0 0 0 2px ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme)};
210
+ color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.generateToken({
211
+ componentType: 'text',
212
+ state: 'active',
213
+ defaultVariant: 'primary'
214
+ }, props.theme)};
215
+ box-shadow: inset 0 0 0 2px ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.generateToken({
216
+ componentType: 'border',
217
+ state: 'active',
218
+ defaultVariant: 'primary'
219
+ }, props.theme)};
150
220
 
151
221
  background-color: transparent;
152
222
  div {
153
223
  svg {
154
224
  path {
155
- fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme)};
225
+ fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
226
+ componentType: 'text',
227
+ state: 'hover',
228
+ defaultVariant: 'primary'
229
+ }, props.theme)};
156
230
  }
157
231
  }
158
232
  }
@@ -161,17 +235,29 @@ export const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)`
161
235
  &:disabled > ${ButtonContentContainer},
162
236
  &.disabled-state > ${ButtonContentContainer} {
163
237
  background-color: transparent;
164
- color: ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_300', props.theme)};
165
- box-shadow: inset 0 0 0 2px ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme)};
238
+ color: ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({
239
+ componentType: 'text',
240
+ state: 'disabled'
241
+ }, props.theme)};
242
+ box-shadow: inset 0 0 0 2px ${props => props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({
243
+ componentType: 'border',
244
+ state: 'disabled'
245
+ }, props.theme)};
166
246
  }
167
247
  `;
168
248
  export const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)`
169
249
  ${ButtonContentContainer} {
170
- color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme)};
250
+ color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
251
+ componentType: 'text',
252
+ defaultVariant: 'primary'
253
+ }, props.theme)};
171
254
  background-color: transparent;
172
255
 
173
256
  div svg path {
174
- fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme)};
257
+ fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
258
+ componentType: 'text',
259
+ defaultVariant: 'primary'
260
+ }, props.theme)};
175
261
  }
176
262
 
177
263
  padding: ${props => props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px'};
@@ -179,26 +265,44 @@ ${ButtonContentContainer} {
179
265
 
180
266
  &:hover > ${ButtonContentContainer},
181
267
  &.hover-state > ${ButtonContentContainer} {
182
- background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('primary_20', props.theme)};
183
- color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme)};
268
+ background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({
269
+ componentType: 'bg-surface',
270
+ state: 'hover'
271
+ }, props.theme)};
272
+ color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
273
+ componentType: 'text',
274
+ defaultVariant: 'primary'
275
+ }, props.theme)};
184
276
 
185
277
  div {
186
278
  svg {
187
279
  path {
188
- fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme)};
280
+ fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
281
+ componentType: 'text',
282
+ defaultVariant: 'primary'
283
+ }, props.theme)};
189
284
  }
190
285
  }
191
286
  }
192
287
  }
193
288
  &:active > ${ButtonContentContainer},
194
289
  &.active-state > ${ButtonContentContainer} {
195
- background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('primary_100', props.theme)};
196
- color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme)};
290
+ background-color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.generateToken({
291
+ componentType: 'bg-surface',
292
+ state: 'active'
293
+ }, props.theme)};
294
+ color: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
295
+ componentType: 'text',
296
+ defaultVariant: 'primary'
297
+ }, props.theme)};
197
298
 
198
299
  div {
199
300
  svg {
200
301
  path {
201
- fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme)};
302
+ fill: ${props => props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({
303
+ componentType: 'text',
304
+ defaultVariant: 'primary'
305
+ }, props.theme)};
202
306
  }
203
307
  }
204
308
  }
@@ -207,22 +311,26 @@ ${ButtonContentContainer} {
207
311
  &:disabled > ${ButtonContentContainer},
208
312
  &.disabled-state > ${ButtonContentContainer} {
209
313
  background-color: transparent !important;
210
- color: ${props => COLORS.getColor('primary_700', props.theme)};
314
+ color: ${props => COLORS.generateToken({
315
+ componentType: 'text',
316
+ isOnFill: true,
317
+ state: 'disabled'
318
+ }, props.theme)};
211
319
  border-color: transparent !important;
212
320
  }
213
321
  `;
214
322
  export const ButtonPositiveStyled = styled(ButtonPrimaryStyled)`
215
323
  ${ButtonContentContainer} {
216
324
  color: white;
217
- background-color: ${props => COLORS.getColor('correct_500', props.theme)};
325
+ background-color: ${props => COLORS.getColor('positive_500', props.theme)};
218
326
  }
219
327
  &:hover > ${ButtonContentContainer},
220
328
  &.hover-state > ${ButtonContentContainer} {
221
- background-color: ${props => COLORS.getColor('correct_700', props.theme)};
329
+ background-color: ${props => COLORS.getColor('positive_700', props.theme)};
222
330
  }
223
331
  &:active > ${ButtonContentContainer},
224
332
  &.active-state > ${ButtonContentContainer} {
225
- background-color: ${props => COLORS.getColor('correct_800', props.theme)};
333
+ background-color: ${props => COLORS.getColor('positive_800', props.theme)};
226
334
  }
227
335
 
228
336
  &:disabled > ${ButtonContentContainer},
@@ -234,21 +342,39 @@ export const ButtonPositiveStyled = styled(ButtonPrimaryStyled)`
234
342
  export const ButtonCriticalStyled = styled(ButtonPrimaryStyled)`
235
343
  ${ButtonContentContainer} {
236
344
  color: white;
237
- background-color: ${props => COLORS.getColor('critical_500', props.theme)};
345
+ background-color: ${props => COLORS.generateToken({
346
+ componentType: 'bg-fill',
347
+ defaultVariant: 'critical'
348
+ }, props.theme)};
238
349
  }
239
350
  &:hover > ${ButtonContentContainer},
240
351
  &.hover-state > ${ButtonContentContainer} {
241
- background-color: ${props => COLORS.getColor('critical_700', props.theme)};
352
+ background-color: ${props => COLORS.generateToken({
353
+ componentType: 'bg-fill',
354
+ state: 'hover',
355
+ defaultVariant: 'critical'
356
+ }, props.theme)};
242
357
  }
243
358
  &:active > ${ButtonContentContainer},
244
359
  &.active-state > ${ButtonContentContainer} {
245
- background-color: ${props => COLORS.getColor('critical_800', props.theme)};
360
+ background-color: ${props => COLORS.generateToken({
361
+ componentType: 'bg-fill',
362
+ state: 'active',
363
+ defaultVariant: 'critical'
364
+ }, props.theme)};
246
365
  }
247
366
 
248
367
  &:disabled > ${ButtonContentContainer},
249
368
  &.disabled-state > ${ButtonContentContainer} {
250
- background-color: ${props => COLORS.getColor('neutral_100', props.theme)};
251
- color: ${props => COLORS.getColor('neutral_300', props.theme)};
369
+ background-color: ${props => COLORS.generateToken({
370
+ componentType: 'bg-fill',
371
+ state: 'disabled'
372
+ }, props.theme)};
373
+ color: ${props => COLORS.generateToken({
374
+ componentType: 'text',
375
+ isOnFill: true,
376
+ state: 'disabled'
377
+ }, props.theme)};
252
378
  }
253
379
  `;
254
380
  /**
@@ -266,7 +392,8 @@ const Button = /*#__PURE__*/React.forwardRef((_ref, ref) => {
266
392
  testId,
267
393
  disabled,
268
394
  flatEdge,
269
- icon
395
+ icon,
396
+ iconPosition = 'left'
270
397
  } = _ref,
271
398
  props = _objectWithoutProperties(_ref, _excluded);
272
399
  // Let's filter out properties that we don't need to render.
@@ -274,14 +401,18 @@ const Button = /*#__PURE__*/React.forwardRef((_ref, ref) => {
274
401
  loading
275
402
  } = props,
276
403
  renderProps = _objectWithoutProperties(props, _excluded2);
277
- const renderContent = () => /*#__PURE__*/_jsxs(_Fragment, {
278
- children: [icon && /*#__PURE__*/_jsx("span", {
404
+ const theme = useTheme();
405
+ const renderIcon = () => /*#__PURE__*/_jsx(_Fragment, {
406
+ children: /*#__PURE__*/_jsx("span", {
279
407
  className: (children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon'),
280
408
  children: icon
281
- }), children && /*#__PURE__*/_jsx("span", {
409
+ })
410
+ });
411
+ const renderContent = () => /*#__PURE__*/_jsxs(_Fragment, {
412
+ children: [icon && iconPosition == 'left' && renderIcon(), children && /*#__PURE__*/_jsx("span", {
282
413
  className: loading ? 'label loading' : 'label',
283
414
  children: children
284
- }), loading && /*#__PURE__*/_jsx(LoadingIndicator, {})]
415
+ }), icon && iconPosition == 'right' && renderIcon(), loading && /*#__PURE__*/_jsx(LoadingIndicator, {})]
285
416
  });
286
417
  let ButtonStyled = ButtonPrimaryStyled;
287
418
  switch (variant) {
@@ -323,7 +454,8 @@ Button.propTypes = {
323
454
  width: _pt.oneOfType([_pt.oneOf(['auto']), _pt.string]),
324
455
  loading: _pt.bool,
325
456
  testId: _pt.string,
326
- icon: _pt.node
457
+ icon: _pt.node,
458
+ iconPosition: _pt.oneOf(['left', 'right'])
327
459
  };
328
460
  export default Button;
329
461
  //# sourceMappingURL=Button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Button.js","names":["React","styled","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","getBorderRadius","flatEdge","radius","ButtonContentContainer","div","ButtonBaseStyled","button","ButtonPrimaryStyled","props","$size","Large","Bold","$colorTheme","getColor","theme","Small","$flatEdge","$width","Medium","$iconOnly","$invertFocus","undefined","ButtonSecondaryStyled","ButtonTertiaryStyled","ButtonPositiveStyled","ButtonCriticalStyled","Button","forwardRef","_ref","ref","children","variant","type","size","colorTheme","invertFocus","width","testId","disabled","icon","_objectWithoutProperties","_excluded","loading","renderProps","_excluded2","renderContent","className","ButtonStyled","_objectSpread","onMouseDown","propTypes","_pt","oneOf","bool","oneOfType","string","node"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { css } from 'styled-components';\r\nimport { LoadingIndicator } from '../LoadingIndicator';\r\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\n\r\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\r\n switch (flatEdge) {\r\n case 'left':\r\n return `0px ${radius}px ${radius}px 0px`;\r\n\r\n case 'right':\r\n return `${radius}px 0px 0px ${radius}px`;\r\n\r\n case 'none':\r\n default:\r\n return `${radius}px`;\r\n }\r\n};\r\n\r\nexport const ButtonContentContainer = styled.div`\r\n min-width: 64px;\r\n`;\r\n\r\nconst ButtonBaseStyled = styled.button<{$iconOnly: boolean; $size: Size; $colorTheme: 'teal' | 'dark' | undefined; $flatEdge: string | undefined; $width: string; $invertFocus: boolean | undefined; }>``;\r\n\r\nexport const ButtonPrimaryStyled = styled(ButtonBaseStyled)`\r\n border: none;\r\n background-color: transparent;\r\n cursor: pointer;\r\n padding: 0;\r\n margin: 0;\r\n position: relative;\r\n box-sizing: border-box;\r\n min-height: ${(props) => (props.$size === Size.Large ? '56px' : '48px')};\r\n &.loading-state {\r\n cursor: wait;\r\n }\r\n ${ButtonContentContainer} {\r\n ${(props) =>\r\n props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))\r\n : props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))\r\n : ComponentMStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};\r\n\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n border-radius: ${(props) => getBorderRadius(props.$flatEdge, 8)};\r\n\r\n width: ${(props) => props.$width};\r\n position: relative;\r\n\r\n min-height: ${(props) => (props.$size === Size.Large ? '56px' : props.$size === Size.Small ? '32px' : '40px')};\r\n\r\n box-sizing: border-box;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: ${(props) => (props.$size === Size.Large ? '14px 16px' : props.$size === Size.Small ? '6px 8px' : '8px 12px')};\r\n\r\n span.icon:not(.loading) {\r\n pointer-events: none;\r\n }\r\n\r\n span.loading {\r\n opacity: 0;\r\n }\r\n\r\n .icon {\r\n margin: ${(props) => (props.$size === Size.Medium ? props.$iconOnly ? '-2px -8px' : '' : (props.$size === Size.Small ? props.$iconOnly ? '-2px -6px' : '' : '' ))};\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n svg {\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')} !important;\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')} !important;\r\n }\r\n }\r\n\r\n .label {\r\n margin: 0 4px;\r\n }\r\n\r\n div {\r\n position: absolute;\r\n width: 100%;\r\n svg {\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('white', props.theme))};\r\n }\r\n\r\n &:focus,\r\n &.focus-state {\r\n ${(props) => (props.$invertFocus || (props.$invertFocus === undefined && props.$colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\r\n }\r\n &:disabled,\r\n &.disabled-state {\r\n cursor: not-allowed;\r\n }\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n pointer-events: none;\r\n background-color: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.getColor('neutral_300', props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n background-color: transparent;\r\n div svg path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.getColor('primary', props.theme))};\r\n }\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary', props.theme))};\r\n \r\n padding: ${(props) => (props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent;\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_300', props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('neutral_100', props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)`\r\n${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme))};\r\n background-color: transparent;\r\n\r\n div svg path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_500', props.theme))};\r\n }\r\n\r\n padding: ${(props) => (props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.getColor('primary_20', props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_700', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.getColor('primary_100', props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.getColor('primary_800', props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent !important;\r\n color: ${props => COLORS.getColor('primary_700', props.theme)};\r\n border-color: transparent !important;\r\n }\r\n`;\r\n\r\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('correct_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('correct_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('correct_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n }\r\n`;\r\n\r\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('critical_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('critical_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('critical_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)}; \r\n }\r\n`;\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /** Look and feel variant of the component. Defaults to 'primary'. */\r\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\r\n /** Can be used in order to remove rounded corners on right or left edge of the button. Used by 'DualFunctionButton'. Defaults to 'undefined' */\r\n flatEdge?: 'right' | 'left' | 'none' | undefined;\r\n /** Size of the component. Small, Medium or Large. Defaults to 'medium' */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n /** Color theme altering of the component. By default there is no altering applied. */\r\n colorTheme?: 'teal' | 'dark';\r\n /** Allows using inverted colors for outlining focus rect. Shown when component focused by keyboard. */\r\n invertFocus?: boolean;\r\n /** Can be used to set custom value for width style. Value is set for 'ButtonContent' container. */\r\n width?: 'auto' | string;\r\n /** If set, then 'opacity' of children container will be set to 0, and loading indicator will be shown. */\r\n loading?: boolean;\r\n /** TestId. Will be set to the top level button component. */\r\n testId?: string;\r\n /** Icon that will be shown on the left of the children. */\r\n icon?: React.ReactNode;\r\n}\r\n\r\n/**\r\n * Button component\r\n */\r\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, colorTheme, invertFocus, width: width = 'auto', testId, disabled, flatEdge, icon, ...props }, ref) => {\r\n // Let's filter out properties that we don't need to render.\r\n const { loading, ...renderProps } = props;\r\n\r\n const renderContent = () => (\r\n <>\r\n {icon && <span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span>}\r\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\r\n {loading && <LoadingIndicator />}\r\n </>\r\n );\r\n\r\n let ButtonStyled = ButtonPrimaryStyled;\r\n switch (variant) {\r\n case 'secondary':\r\n ButtonStyled = ButtonSecondaryStyled;\r\n break;\r\n case 'tertiary':\r\n ButtonStyled = ButtonTertiaryStyled;\r\n break;\r\n case 'positive':\r\n ButtonStyled = ButtonPositiveStyled;\r\n break;\r\n case 'critical':\r\n ButtonStyled = ButtonCriticalStyled;\r\n break;\r\n }\r\n\r\n return (\r\n <ButtonStyled\r\n {...renderProps}\r\n $size={size}\r\n $colorTheme={colorTheme} \r\n $invertFocus={invertFocus} \r\n ref={ref}\r\n disabled={disabled}\r\n $iconOnly={!children}\r\n type={type}\r\n $flatEdge={flatEdge}\r\n $width={width}\r\n data-testid={testId}\r\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\r\n onMouseDown={defaultOnMouseDownHandler}>\r\n <ButtonContentContainer>{renderContent()}</ButtonContentContainer>\r\n </ButtonStyled>\r\n );\r\n },\r\n);\r\n\r\nexport default Button;\r\n"],"mappings":"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","ignoreList":[]}
1
+ {"version":3,"file":"Button.js","names":["React","styled","useTheme","LoadingIndicator","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentTextStyle","COLORS","focusStyles","invertedFocusStyles","Size","defaultOnMouseDownHandler","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","getBorderRadius","flatEdge","radius","ButtonContentContainer","div","ButtonBaseStyled","button","ButtonPrimaryStyled","props","$size","Large","Bold","$colorTheme","getColor","theme","generateToken","componentType","isOnFill","defaultVariant","Small","$flatEdge","$width","Medium","$iconOnly","state","$invertFocus","undefined","ButtonSecondaryStyled","ButtonTertiaryStyled","ButtonPositiveStyled","ButtonCriticalStyled","Button","forwardRef","_ref","ref","children","variant","type","size","colorTheme","invertFocus","width","testId","disabled","icon","iconPosition","_objectWithoutProperties","_excluded","loading","renderProps","_excluded2","renderIcon","className","renderContent","ButtonStyled","_objectSpread","onMouseDown","propTypes","_pt","oneOf","bool","oneOfType","string","node"],"sources":["../../src/Button/Button.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { css, useTheme } from 'styled-components';\r\nimport { LoadingIndicator } from '../LoadingIndicator';\r\nimport { ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';\r\nimport { COLORS, focusStyles, invertedFocusStyles } from '../styles';\r\nimport { Size, Testable } from '../types';\r\nimport { defaultOnMouseDownHandler } from '../common';\r\n\r\nconst getBorderRadius = (flatEdge: string | undefined, radius: number) => {\r\n switch (flatEdge) {\r\n case 'left':\r\n return `0px ${radius}px ${radius}px 0px`;\r\n\r\n case 'right':\r\n return `${radius}px 0px 0px ${radius}px`;\r\n\r\n case 'none':\r\n default:\r\n return `${radius}px`;\r\n }\r\n};\r\n\r\nexport const ButtonContentContainer = styled.div`\r\n min-width: 64px;\r\n`;\r\n\r\nconst ButtonBaseStyled = styled.button<{$iconOnly: boolean; $size: Size; $colorTheme: 'teal' | 'dark' | undefined; $flatEdge: string | undefined; $width: string; $invertFocus: boolean | undefined; }>``;\r\n\r\nexport const ButtonPrimaryStyled = styled(ButtonBaseStyled)`\r\n border: none;\r\n background-color: transparent;\r\n cursor: pointer;\r\n padding: 0;\r\n margin: 0;\r\n position: relative;\r\n box-sizing: border-box; \r\n &.loading-state {\r\n cursor: wait;\r\n }\r\n ${ButtonContentContainer} {\r\n ${(props) =>\r\n props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({ componentType: 'text', isOnFill: true, defaultVariant: 'primary' }, props.theme))\r\n : props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({ componentType: 'text', isOnFill: true, defaultVariant: 'primary' }, props.theme))\r\n : ComponentMStyling(ComponentTextStyle.Bold, props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({ componentType: 'text', isOnFill: true, defaultVariant: 'primary' }, props.theme))};\r\n\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : \r\n COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'primary' }, props.theme))};\r\n border-radius: ${(props) => getBorderRadius(props.$flatEdge, 8)};\r\n\r\n width: ${(props) => props.$width};\r\n position: relative;\r\n\r\n min-height: ${(props) => (props.$size === Size.Large ? '56px' : props.$size === Size.Small ? '32px' : '40px')};\r\n\r\n box-sizing: border-box;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n padding: ${(props) => (props.$size === Size.Large ? '14px 16px' : props.$size === Size.Small ? '6px 8px' : '8px 12px')};\r\n\r\n span.icon:not(.loading) {\r\n pointer-events: none;\r\n }\r\n\r\n span.loading {\r\n opacity: 0;\r\n }\r\n\r\n .icon {\r\n margin: ${(props) => (props.$size === Size.Medium ? props.$iconOnly ? '-2px -8px' : '' : (props.$size === Size.Small ? props.$iconOnly ? '-2px -6px' : '' : '' ))};\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n svg {\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')} !important;\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')} !important;\r\n }\r\n }\r\n\r\n .label {\r\n margin: 0 4px;\r\n }\r\n\r\n div {\r\n position: absolute;\r\n width: 100%;\r\n svg {\r\n height: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n width: ${(props) => (props.$size === Size.Large ? '28px' : props.$size === Size.Small ? '20px' : '24px')};\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary', props.theme) : COLORS.generateToken({ componentType: 'icon', isOnFill: true, defaultVariant: 'primary' }, props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_100', props.theme) : COLORS.generateToken({ componentType: 'bg-fill', state: 'hover', defaultVariant: 'primary' }, props.theme))};\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.generateToken({ componentType: 'text', isOnFill: true, defaultVariant: 'primary' }, props.theme))};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.generateToken({ componentType: 'bg-fill', state: 'active', defaultVariant: 'primary' }, props.theme))};\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({ componentType: 'text', isOnFill: true, defaultVariant: 'primary' }, props.theme))};\r\n }\r\n\r\n &:focus,\r\n &.focus-state {\r\n ${(props) => (props.$invertFocus || (props.$invertFocus === undefined && props.$colorTheme === 'dark') ? invertedFocusStyles : focusStyles)}\r\n }\r\n &:disabled,\r\n &.disabled-state {\r\n cursor: not-allowed;\r\n }\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n pointer-events: none;\r\n background-color: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({ componentType: 'bg-fill', state: 'disabled' }, props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'dark' ? COLORS.getColor('primary_800', props.theme) : COLORS.generateToken({ componentType: 'text', isOnFill: true, state: 'disabled' }, props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonSecondaryStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n background-color: transparent;\r\n div svg path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : COLORS.generateToken({ componentType: 'icon', defaultVariant: 'primary' }, props.theme))};\r\n }\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'border', defaultVariant: 'primary' }, props.theme))};\r\n \r\n padding: ${(props) => (props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.generateToken({ componentType: 'text', state:'hover', defaultVariant: 'primary' }, props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_200', props.theme) : COLORS.generateToken({ componentType: 'border', state:'hover', defaultVariant: 'primary' }, props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : COLORS.generateToken({ componentType: 'text', state:'hover', defaultVariant: 'primary' }, props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.generateToken({ componentType: 'text', state:'active', defaultVariant: 'primary' }, props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('primary_300', props.theme) : COLORS.generateToken({ componentType: 'border', state:'active', defaultVariant: 'primary' }, props.theme))};\r\n \r\n background-color: transparent;\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props?.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', state:'hover', defaultVariant: 'primary' }, props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent;\r\n color: ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({ componentType: 'text', state:'disabled' }, props.theme))};\r\n box-shadow: inset 0 0 0 2px ${(props) => (props?.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({ componentType: 'border', state:'disabled' }, props.theme))};\r\n }\r\n`;\r\n\r\nexport const ButtonTertiaryStyled = styled(ButtonPrimaryStyled)`\r\n${ButtonContentContainer} {\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n background-color: transparent;\r\n\r\n div svg path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n }\r\n\r\n padding: ${(props) => (props.$size === Size.Large ? '12px 16px' : props.$size === Size.Small ? '4px 8px' : '6px 12px')};\r\n }\r\n\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_20', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_700', props.theme) : COLORS.generateToken({ componentType: 'bg-surface', state:'hover' }, props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_700', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_100', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('primary_600', props.theme) : COLORS.generateToken({ componentType: 'bg-surface', state: 'active' }, props.theme))};\r\n color: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n\r\n div {\r\n svg {\r\n path {\r\n fill: ${(props) => (props.$colorTheme === 'teal' ? COLORS.getColor('accent1_800', props.theme) : props.$colorTheme === 'dark' ? COLORS.getColor('white', props.theme) : COLORS.generateToken({ componentType: 'text', defaultVariant: 'primary' }, props.theme))};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: transparent !important;\r\n color: ${props => COLORS.generateToken({ componentType: 'text', isOnFill:true, state:'disabled' }, props.theme)};\r\n border-color: transparent !important;\r\n }\r\n`;\r\n\r\nexport const ButtonPositiveStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.getColor('positive_500', props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('positive_700', props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('positive_800', props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.getColor('neutral_100', props.theme)};\r\n color: ${props => COLORS.getColor('neutral_300', props.theme)};\r\n }\r\n`;\r\n\r\nexport const ButtonCriticalStyled = styled(ButtonPrimaryStyled)`\r\n ${ButtonContentContainer} {\r\n color: white;\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', defaultVariant: 'critical' }, props.theme)};\r\n }\r\n &:hover > ${ButtonContentContainer},\r\n &.hover-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', state:'hover', defaultVariant: 'critical' }, props.theme)};\r\n }\r\n &:active > ${ButtonContentContainer},\r\n &.active-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', state:'active', defaultVariant: 'critical' }, props.theme)};\r\n }\r\n\r\n &:disabled > ${ButtonContentContainer},\r\n &.disabled-state > ${ButtonContentContainer} {\r\n background-color: ${props => COLORS.generateToken({ componentType: 'bg-fill', state: 'disabled' }, props.theme)};\r\n color: ${props => COLORS.generateToken({ componentType: 'text', isOnFill: true, state: 'disabled' }, props.theme)}; \r\n }\r\n`;\r\n\r\nexport interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\r\n /** Look and feel variant of the component. Defaults to 'primary'. */\r\n variant?: 'primary' | 'secondary' | 'tertiary' | 'positive' | 'critical';\r\n /** Can be used in order to remove rounded corners on right or left edge of the button. Used by 'DualFunctionButton'. Defaults to 'undefined' */\r\n flatEdge?: 'right' | 'left' | 'none' | undefined;\r\n /** Size of the component. Small, Medium or Large. Defaults to 'medium' */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n /** Color theme altering of the component. By default there is no altering applied. */\r\n colorTheme?: 'teal' | 'dark';\r\n /** Allows using inverted colors for outlining focus rect. Shown when component focused by keyboard. */\r\n invertFocus?: boolean;\r\n /** Can be used to set custom value for width style. Value is set for 'ButtonContent' container. */\r\n width?: 'auto' | string;\r\n /** If set, then 'opacity' of children container will be set to 0, and loading indicator will be shown. */\r\n loading?: boolean;\r\n /** TestId. Will be set to the top level button component. */\r\n testId?: string;\r\n /** Icon that will be shown on the left of the children. */\r\n icon?: React.ReactNode;\r\n /** Icon position in the button. Defaults to 'left' */\r\n iconPosition?: 'left' | 'right';\r\n}\r\n\r\n/**\r\n * Button component\r\n */\r\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\r\n ({ children = '', variant = 'primary', type = 'button', size = Size.Medium, colorTheme, invertFocus, width: width = 'auto', testId, disabled, flatEdge, icon, iconPosition = 'left', ...props }, ref) => {\r\n // Let's filter out properties that we don't need to render.\r\n const { loading, ...renderProps } = props;\r\n\r\n const theme = useTheme();\r\n const renderIcon = () => (\r\n <><span className={(children ? 'extramargin ' : '') + (loading ? 'icon loading' : 'icon')}>{icon}</span></>\r\n )\r\n\r\n const renderContent = () => (\r\n <>\r\n {icon && iconPosition == 'left' && renderIcon()}\r\n {children && <span className={loading ? 'label loading' : 'label'}>{children}</span>}\r\n {icon && iconPosition == 'right' && renderIcon()}\r\n {loading && <LoadingIndicator />}\r\n </>\r\n );\r\n\r\n let ButtonStyled = ButtonPrimaryStyled;\r\n switch (variant) {\r\n case 'secondary':\r\n ButtonStyled = ButtonSecondaryStyled;\r\n break;\r\n case 'tertiary':\r\n ButtonStyled = ButtonTertiaryStyled;\r\n break;\r\n case 'positive':\r\n ButtonStyled = ButtonPositiveStyled;\r\n break;\r\n case 'critical':\r\n ButtonStyled = ButtonCriticalStyled;\r\n break;\r\n }\r\n\r\n return (\r\n <ButtonStyled\r\n {...renderProps}\r\n $size={size}\r\n $colorTheme={colorTheme} \r\n $invertFocus={invertFocus} \r\n ref={ref}\r\n disabled={disabled}\r\n $iconOnly={!children}\r\n type={type}\r\n $flatEdge={flatEdge}\r\n $width={width}\r\n data-testid={testId}\r\n className={props.loading ? 'loading-state ' + props.className : ' ' + props.className}\r\n onMouseDown={defaultOnMouseDownHandler}>\r\n <ButtonContentContainer>{renderContent()}</ButtonContentContainer>\r\n </ButtonStyled>\r\n );\r\n },\r\n);\r\n\r\nexport default Button;\r\n"],"mappings":"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","ignoreList":[]}